Upload folder using huggingface_hub

README.md

@@ -1,9 +1,9 @@
 
 ---
 tags: [gradio-custom-component,gradio-template-HTML,HTML,iFrame]
-title: gradio_iframe V0.0.3
-colorFrom: indigo
-colorTo: purple
+title: gradio_iframe V0.0.4
+colorFrom: blue
+colorTo: gray
 sdk: docker
 pinned: false
 license: apache-2.0

requirements.txt

@@ -1 +1 @@
-gradio_iframe-0.0.3-py3-none-any.whl
+gradio_iframe-0.0.4-py3-none-any.whl

src/.gitignore

@@ -5,4 +5,4 @@ __pycache__/
 *$py.class
 __tmp/*
 *.pyi
-node_modules
+node_modules

src/README.md

@@ -34,5 +34,3 @@ Also this component is still a work in progress and not fully tested. Use at you
 
 - Height does not grow according to the inner component.
 - ...
-
-

src/backend/gradio_iframe/iframe.py

@@ -36,6 +36,7 @@ class iFrame(Component):
         elem_id: str | None = None,
         elem_classes: list[str] | str | None = None,
         render: bool = True,
+        height: str | None = None,
     ):
         """
         Parameters:
@@ -47,6 +48,7 @@ class iFrame(Component):
             elem_id: An optional string that is assigned as the id of this component in the iFrame DOM. Can be used for targeting CSS styles.
             elem_classes: An optional list of strings that are assigned as the classes of this component in the iFrame DOM. Can be used for targeting CSS styles.
             render: If False, component will not render be rendered in the Blocks context. Should be used if the intention is to assign event listeners now but render the component later.
+            height: The height of the iFrame in valid css (i.e "10px). If None, the height will be automatically set to 100%
         """
         super().__init__(
             label=label,
@@ -59,6 +61,8 @@ class iFrame(Component):
             value=value,
         )
 
+        self.height = height
+
     def example_inputs(self) -> Any:
         return "<p>Hello</p>"
 

src/backend/gradio_iframe/iframe.pyi

@@ -37,6 +37,7 @@ class iFrame(Component):
         elem_id: str | None = None,
         elem_classes: list[str] | str | None = None,
         render: bool = True,
+        height: str | None = None,
     ):
         """
         Parameters:
@@ -48,6 +49,7 @@ class iFrame(Component):
             elem_id: An optional string that is assigned as the id of this component in the iFrame DOM. Can be used for targeting CSS styles.
             elem_classes: An optional list of strings that are assigned as the classes of this component in the iFrame DOM. Can be used for targeting CSS styles.
             render: If False, component will not render be rendered in the Blocks context. Should be used if the intention is to assign event listeners now but render the component later.
+            height: The height of the iFrame in pixels. If None, the height will be automatically set to 100%
         """
         super().__init__(
             label=label,
@@ -60,6 +62,8 @@ class iFrame(Component):
             value=value,
         )
 
+        self.height = height
+
     def example_inputs(self) -> Any:
         return "<p>Hello</p>"
 

src/backend/gradio_iframe/templates/component/index.js

@@ -1,10 +1,10 @@
 const {
   SvelteComponent: nt,
   append: it,
-  attr: B,
-  detach: st,
+  attr: P,
+  detach: ft,
   element: we,
-  init: ft,
+  init: st,
   insert: ot,
   noop: ve,
   safe_not_equal: at,
@@ -14,12 +14,17 @@ function _t(n) {
   let t, e, l;
   return {
     c() {
-      t = we("div"), e = we("iframe"), B(e, "title", "iframe component"), B(e, "width", "100%"), B(e, "height", "100%"), B(
+      t = we("div"), e = we("iframe"), P(e, "title", "iframe component"), P(e, "width", "100%"), P(
+        e,
+        "height",
+        /*height*/
+        n[4]
+      ), P(
         e,
         "srcdoc",
         /*value*/
         n[1]
-      ), B(e, "allow", "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"), e.allowFullscreen = !0, B(t, "class", l = "prose " + /*elem_classes*/
+      ), P(e, "allow", "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"), e.allowFullscreen = !0, P(t, "class", l = "prose " + /*elem_classes*/
       n[0].join(" ") + " svelte-2qygph"), x(
         t,
         "min",
@@ -28,52 +33,59 @@ function _t(n) {
       ), x(t, "hide", !/*visible*/
       n[2]);
     },
-    m(i, f) {
-      ot(i, t, f), it(t, e);
+    m(i, s) {
+      ot(i, t, s), it(t, e);
     },
-    p(i, [f]) {
-      f & /*value*/
-      2 && B(
+    p(i, [s]) {
+      s & /*height*/
+      16 && P(
+        e,
+        "height",
+        /*height*/
+        i[4]
+      ), s & /*value*/
+      2 && P(
         e,
         "srcdoc",
         /*value*/
         i[1]
-      ), f & /*elem_classes*/
+      ), s & /*elem_classes*/
       1 && l !== (l = "prose " + /*elem_classes*/
-      i[0].join(" ") + " svelte-2qygph") && B(t, "class", l), f & /*elem_classes, min_height*/
+      i[0].join(" ") + " svelte-2qygph") && P(t, "class", l), s & /*elem_classes, min_height*/
       9 && x(
         t,
         "min",
         /*min_height*/
         i[3]
-      ), f & /*elem_classes, visible*/
+      ), s & /*elem_classes, visible*/
       5 && x(t, "hide", !/*visible*/
       i[2]);
     },
     i: ve,
     o: ve,
     d(i) {
-      i && st(t);
+      i && ft(t);
     }
   };
 }
-function ct(n, t, e) {
-  let { elem_classes: l = [] } = t, { value: i } = t, { visible: f = !0 } = t, { min_height: o = !1 } = t;
-  const a = rt();
-  return n.$$set = (r) => {
-    "elem_classes" in r && e(0, l = r.elem_classes), "value" in r && e(1, i = r.value), "visible" in r && e(2, f = r.visible), "min_height" in r && e(3, o = r.min_height);
+function ut(n, t, e) {
+  let { elem_classes: l = [] } = t, { value: i } = t, { visible: s = !0 } = t, { min_height: o = !1 } = t, { height: a = "100%" } = t;
+  const r = rt();
+  return n.$$set = (f) => {
+    "elem_classes" in f && e(0, l = f.elem_classes), "value" in f && e(1, i = f.value), "visible" in f && e(2, s = f.visible), "min_height" in f && e(3, o = f.min_height), "height" in f && e(4, a = f.height);
   }, n.$$.update = () => {
     n.$$.dirty & /*value*/
-    2 && a("change");
-  }, [l, i, f, o];
+    2 && r("change");
+  }, [l, i, s, o, a];
 }
-class ut extends nt {
+class ct extends nt {
   constructor(t) {
-    super(), ft(this, t, ct, _t, at, {
+    super(), st(this, t, ut, _t, at, {
       elem_classes: 0,
       value: 1,
       visible: 2,
-      min_height: 3
+      min_height: 3,
+      height: 4
     });
   }
 }
@@ -90,7 +102,7 @@ function dt(n, t) {
   return n != n ? t == t : n !== t || n && typeof n == "object" || typeof n == "function";
 }
 const Re = typeof window < "u";
-let pe = Re ? () => window.performance.now() : () => Date.now(), Ue = Re ? (n) => requestAnimationFrame(n) : te;
+let ye = Re ? () => window.performance.now() : () => Date.now(), Ue = Re ? (n) => requestAnimationFrame(n) : te;
 const G = /* @__PURE__ */ new Set();
 function Je(n) {
   G.forEach((t) => {
@@ -115,77 +127,77 @@ function bt(n, t = te) {
   function i(a) {
     if (dt(n, a) && (n = a, e)) {
       const r = !X.length;
-      for (const s of l)
-        s[1](), X.push(s, n);
+      for (const f of l)
+        f[1](), X.push(f, n);
       if (r) {
-        for (let s = 0; s < X.length; s += 2)
-          X[s][0](X[s + 1]);
+        for (let f = 0; f < X.length; f += 2)
+          X[f][0](X[f + 1]);
         X.length = 0;
       }
     }
   }
-  function f(a) {
+  function s(a) {
     i(a(n));
   }
   function o(a, r = te) {
-    const s = [a, r];
-    return l.add(s), l.size === 1 && (e = t(i, f) || te), a(n), () => {
-      l.delete(s), l.size === 0 && e && (e(), e = null);
+    const f = [a, r];
+    return l.add(f), l.size === 1 && (e = t(i, s) || te), a(n), () => {
+      l.delete(f), l.size === 0 && e && (e(), e = null);
     };
   }
-  return { set: i, update: f, subscribe: o };
+  return { set: i, update: s, subscribe: o };
 }
-function ye(n) {
+function ke(n) {
   return Object.prototype.toString.call(n) === "[object Date]";
 }
-function fe(n, t, e, l) {
-  if (typeof e == "number" || ye(e)) {
-    const i = l - e, f = (e - t) / (n.dt || 1 / 60), o = n.opts.stiffness * i, a = n.opts.damping * f, r = (o - a) * n.inv_mass, s = (f + r) * n.dt;
-    return Math.abs(s) < n.opts.precision && Math.abs(i) < n.opts.precision ? l : (n.settled = !1, ye(e) ? new Date(e.getTime() + s) : e + s);
+function se(n, t, e, l) {
+  if (typeof e == "number" || ke(e)) {
+    const i = l - e, s = (e - t) / (n.dt || 1 / 60), o = n.opts.stiffness * i, a = n.opts.damping * s, r = (o - a) * n.inv_mass, f = (s + r) * n.dt;
+    return Math.abs(f) < n.opts.precision && Math.abs(i) < n.opts.precision ? l : (n.settled = !1, ke(e) ? new Date(e.getTime() + f) : e + f);
   } else {
     if (Array.isArray(e))
       return e.map(
-        (i, f) => fe(n, t[f], e[f], l[f])
+        (i, s) => se(n, t[s], e[s], l[s])
       );
     if (typeof e == "object") {
       const i = {};
-      for (const f in e)
-        i[f] = fe(n, t[f], e[f], l[f]);
+      for (const s in e)
+        i[s] = se(n, t[s], e[s], l[s]);
       return i;
     } else
       throw new Error(`Cannot spring ${typeof e} values`);
   }
 }
-function ke(n, t = {}) {
-  const e = bt(n), { stiffness: l = 0.15, damping: i = 0.8, precision: f = 0.01 } = t;
-  let o, a, r, s = n, _ = n, u = 1, w = 0, h = !1;
-  function p(k, L = {}) {
-    _ = k;
+function pe(n, t = {}) {
+  const e = bt(n), { stiffness: l = 0.15, damping: i = 0.8, precision: s = 0.01 } = t;
+  let o, a, r, f = n, _ = n, m = 1, c = 0, w = !1;
+  function y(p, L = {}) {
+    _ = p;
     const F = r = {};
-    return n == null || L.hard || C.stiffness >= 1 && C.damping >= 1 ? (h = !0, o = pe(), s = k, e.set(n = _), Promise.resolve()) : (L.soft && (w = 1 / ((L.soft === !0 ? 0.5 : +L.soft) * 60), u = 0), a || (o = pe(), h = !1, a = mt((c) => {
-      if (h)
-        return h = !1, a = null, !1;
-      u = Math.min(u + w, 1);
-      const y = {
-        inv_mass: u,
+    return n == null || L.hard || C.stiffness >= 1 && C.damping >= 1 ? (w = !0, o = ye(), f = p, e.set(n = _), Promise.resolve()) : (L.soft && (c = 1 / ((L.soft === !0 ? 0.5 : +L.soft) * 60), m = 0), a || (o = ye(), w = !1, a = mt((u) => {
+      if (w)
+        return w = !1, a = null, !1;
+      m = Math.min(m + c, 1);
+      const k = {
+        inv_mass: m,
         opts: C,
         settled: !0,
-        dt: (c - o) * 60 / 1e3
-      }, m = fe(y, s, n, _);
-      return o = c, s = n, e.set(n = m), y.settled && (a = null), !y.settled;
-    })), new Promise((c) => {
+        dt: (u - o) * 60 / 1e3
+      }, b = se(k, f, n, _);
+      return o = u, f = n, e.set(n = b), k.settled && (a = null), !k.settled;
+    })), new Promise((u) => {
       a.promise.then(() => {
-        F === r && c();
+        F === r && u();
       });
     }));
   }
   const C = {
-    set: p,
-    update: (k, L) => p(k(_, n), L),
+    set: y,
+    update: (p, L) => y(p(_, n), L),
     subscribe: e.subscribe,
     stiffness: l,
     damping: i,
-    precision: f
+    precision: s
   };
   return C;
 }
@@ -197,20 +209,20 @@ const {
   detach: ht,
   element: wt,
   init: vt,
-  insert: pt,
+  insert: yt,
   noop: Fe,
-  safe_not_equal: yt,
+  safe_not_equal: kt,
   set_style: $,
   svg_element: z,
   toggle_class: Le
-} = window.__gradio__svelte__internal, { onMount: kt } = window.__gradio__svelte__internal;
+} = window.__gradio__svelte__internal, { onMount: pt } = window.__gradio__svelte__internal;
 function qt(n) {
-  let t, e, l, i, f, o, a, r, s, _, u, w;
+  let t, e, l, i, s, o, a, r, f, _, m, c;
   return {
     c() {
-      t = wt("div"), e = z("svg"), l = z("g"), i = z("path"), f = z("path"), o = z("path"), a = z("path"), r = z("g"), s = z("path"), _ = z("path"), u = z("path"), w = z("path"), v(i, "d", "M255.926 0.754768L509.702 139.936V221.027L255.926 81.8465V0.754768Z"), v(i, "fill", "#FF7C00"), v(i, "fill-opacity", "0.4"), v(i, "class", "svelte-43sxxs"), v(f, "d", "M509.69 139.936L254.981 279.641V361.255L509.69 221.55V139.936Z"), v(f, "fill", "#FF7C00"), v(f, "class", "svelte-43sxxs"), v(o, "d", "M0.250138 139.937L254.981 279.641V361.255L0.250138 221.55V139.937Z"), v(o, "fill", "#FF7C00"), v(o, "fill-opacity", "0.4"), v(o, "class", "svelte-43sxxs"), v(a, "d", "M255.923 0.232622L0.236328 139.936V221.55L255.923 81.8469V0.232622Z"), v(a, "fill", "#FF7C00"), v(a, "class", "svelte-43sxxs"), $(l, "transform", "translate(" + /*$top*/
+      t = wt("div"), e = z("svg"), l = z("g"), i = z("path"), s = z("path"), o = z("path"), a = z("path"), r = z("g"), f = z("path"), _ = z("path"), m = z("path"), c = z("path"), v(i, "d", "M255.926 0.754768L509.702 139.936V221.027L255.926 81.8465V0.754768Z"), v(i, "fill", "#FF7C00"), v(i, "fill-opacity", "0.4"), v(i, "class", "svelte-43sxxs"), v(s, "d", "M509.69 139.936L254.981 279.641V361.255L509.69 221.55V139.936Z"), v(s, "fill", "#FF7C00"), v(s, "class", "svelte-43sxxs"), v(o, "d", "M0.250138 139.937L254.981 279.641V361.255L0.250138 221.55V139.937Z"), v(o, "fill", "#FF7C00"), v(o, "fill-opacity", "0.4"), v(o, "class", "svelte-43sxxs"), v(a, "d", "M255.923 0.232622L0.236328 139.936V221.55L255.923 81.8469V0.232622Z"), v(a, "fill", "#FF7C00"), v(a, "class", "svelte-43sxxs"), $(l, "transform", "translate(" + /*$top*/
       n[1][0] + "px, " + /*$top*/
-      n[1][1] + "px)"), v(s, "d", "M255.926 141.5L509.702 280.681V361.773L255.926 222.592V141.5Z"), v(s, "fill", "#FF7C00"), v(s, "fill-opacity", "0.4"), v(s, "class", "svelte-43sxxs"), v(_, "d", "M509.69 280.679L254.981 420.384V501.998L509.69 362.293V280.679Z"), v(_, "fill", "#FF7C00"), v(_, "class", "svelte-43sxxs"), v(u, "d", "M0.250138 280.681L254.981 420.386V502L0.250138 362.295V280.681Z"), v(u, "fill", "#FF7C00"), v(u, "fill-opacity", "0.4"), v(u, "class", "svelte-43sxxs"), v(w, "d", "M255.923 140.977L0.236328 280.68V362.294L255.923 222.591V140.977Z"), v(w, "fill", "#FF7C00"), v(w, "class", "svelte-43sxxs"), $(r, "transform", "translate(" + /*$bottom*/
+      n[1][1] + "px)"), v(f, "d", "M255.926 141.5L509.702 280.681V361.773L255.926 222.592V141.5Z"), v(f, "fill", "#FF7C00"), v(f, "fill-opacity", "0.4"), v(f, "class", "svelte-43sxxs"), v(_, "d", "M509.69 280.679L254.981 420.384V501.998L509.69 362.293V280.679Z"), v(_, "fill", "#FF7C00"), v(_, "class", "svelte-43sxxs"), v(m, "d", "M0.250138 280.681L254.981 420.386V502L0.250138 362.295V280.681Z"), v(m, "fill", "#FF7C00"), v(m, "fill-opacity", "0.4"), v(m, "class", "svelte-43sxxs"), v(c, "d", "M255.923 140.977L0.236328 280.68V362.294L255.923 222.591V140.977Z"), v(c, "fill", "#FF7C00"), v(c, "class", "svelte-43sxxs"), $(r, "transform", "translate(" + /*$bottom*/
       n[2][0] + "px, " + /*$bottom*/
       n[2][1] + "px)"), v(e, "viewBox", "-1200 -1200 3000 3000"), v(e, "fill", "none"), v(e, "xmlns", "http://www.w3.org/2000/svg"), v(e, "class", "svelte-43sxxs"), v(t, "class", "svelte-43sxxs"), Le(
         t,
@@ -219,54 +231,54 @@ function qt(n) {
         n[0]
       );
     },
-    m(h, p) {
-      pt(h, t, p), N(t, e), N(e, l), N(l, i), N(l, f), N(l, o), N(l, a), N(e, r), N(r, s), N(r, _), N(r, u), N(r, w);
+    m(w, y) {
+      yt(w, t, y), N(t, e), N(e, l), N(l, i), N(l, s), N(l, o), N(l, a), N(e, r), N(r, f), N(r, _), N(r, m), N(r, c);
     },
-    p(h, [p]) {
-      p & /*$top*/
+    p(w, [y]) {
+      y & /*$top*/
       2 && $(l, "transform", "translate(" + /*$top*/
-      h[1][0] + "px, " + /*$top*/
-      h[1][1] + "px)"), p & /*$bottom*/
+      w[1][0] + "px, " + /*$top*/
+      w[1][1] + "px)"), y & /*$bottom*/
       4 && $(r, "transform", "translate(" + /*$bottom*/
-      h[2][0] + "px, " + /*$bottom*/
-      h[2][1] + "px)"), p & /*margin*/
+      w[2][0] + "px, " + /*$bottom*/
+      w[2][1] + "px)"), y & /*margin*/
       1 && Le(
         t,
         "margin",
         /*margin*/
-        h[0]
+        w[0]
       );
     },
     i: Fe,
     o: Fe,
-    d(h) {
-      h && ht(t);
+    d(w) {
+      w && ht(t);
     }
   };
 }
 function Ft(n, t, e) {
-  let l, i, { margin: f = !0 } = t;
-  const o = ke([0, 0]);
-  qe(n, o, (w) => e(1, l = w));
-  const a = ke([0, 0]);
-  qe(n, a, (w) => e(2, i = w));
+  let l, i, { margin: s = !0 } = t;
+  const o = pe([0, 0]);
+  qe(n, o, (c) => e(1, l = c));
+  const a = pe([0, 0]);
+  qe(n, a, (c) => e(2, i = c));
   let r;
-  async function s() {
+  async function f() {
     await Promise.all([o.set([125, 140]), a.set([-125, -140])]), await Promise.all([o.set([-125, 140]), a.set([125, -140])]), await Promise.all([o.set([-125, 0]), a.set([125, -0])]), await Promise.all([o.set([125, 0]), a.set([-125, 0])]);
   }
   async function _() {
-    await s(), r || _();
+    await f(), r || _();
   }
-  async function u() {
+  async function m() {
     await Promise.all([o.set([125, 0]), a.set([-125, 0])]), _();
   }
-  return kt(() => (u(), () => r = !0)), n.$$set = (w) => {
-    "margin" in w && e(0, f = w.margin);
-  }, [f, l, i, o, a];
+  return pt(() => (m(), () => r = !0)), n.$$set = (c) => {
+    "margin" in c && e(0, s = c.margin);
+  }, [s, l, i, o, a];
 }
 class Lt extends gt {
   constructor(t) {
-    super(), vt(this, t, Ft, qt, yt, { margin: 0 });
+    super(), vt(this, t, Ft, qt, kt, { margin: 0 });
   }
 }
 const {
@@ -279,15 +291,15 @@ const {
   create_slot: Vt,
   destroy_component: St,
   destroy_each: Qe,
-  detach: b,
-  element: P,
+  detach: g,
+  element: Z,
   empty: U,
   ensure_array_like: le,
   get_all_dirty_from_scope: Nt,
   get_slot_changes: zt,
   group_outros: We,
   init: Tt,
-  insert: g,
+  insert: h,
   mount_component: jt,
   noop: oe,
   safe_not_equal: Pt,
@@ -312,7 +324,7 @@ function Et(n) {
   let t, e = (
     /*i18n*/
     n[1]("common.error") + ""
-  ), l, i, f;
+  ), l, i, s;
   const o = (
     /*#slots*/
     n[29].error
@@ -325,26 +337,26 @@ function Et(n) {
   );
   return {
     c() {
-      t = P("span"), l = q(e), i = j(), a && a.c(), T(t, "class", "error svelte-1txqlrd");
+      t = Z("span"), l = q(e), i = j(), a && a.c(), T(t, "class", "error svelte-1txqlrd");
     },
-    m(r, s) {
-      g(r, t, s), H(t, l), g(r, i, s), a && a.m(r, s), f = !0;
+    m(r, f) {
+      h(r, t, f), H(t, l), h(r, i, f), a && a.m(r, f), s = !0;
     },
-    p(r, s) {
-      (!f || s[0] & /*i18n*/
+    p(r, f) {
+      (!s || f[0] & /*i18n*/
       2) && e !== (e = /*i18n*/
-      r[1]("common.error") + "") && S(l, e), a && a.p && (!f || s[0] & /*$$scope*/
+      r[1]("common.error") + "") && S(l, e), a && a.p && (!s || f[0] & /*$$scope*/
       268435456) && Zt(
         a,
         o,
         r,
         /*$$scope*/
         r[28],
-        f ? zt(
+        s ? zt(
           o,
           /*$$scope*/
           r[28],
-          s,
+          f,
           Dt
         ) : Nt(
           /*$$scope*/
@@ -354,62 +366,62 @@ function Et(n) {
       );
     },
     i(r) {
-      f || (O(a, r), f = !0);
+      s || (O(a, r), s = !0);
     },
     o(r) {
-      R(a, r), f = !1;
+      R(a, r), s = !1;
     },
     d(r) {
-      r && (b(t), b(i)), a && a.d(r);
+      r && (g(t), g(i)), a && a.d(r);
     }
   };
 }
 function It(n) {
-  let t, e, l, i, f, o, a, r, s, _ = (
+  let t, e, l, i, s, o, a, r, f, _ = (
     /*variant*/
     n[8] === "default" && /*show_eta_bar*/
     n[18] && /*show_progress*/
     n[6] === "full" && Ne(n)
   );
-  function u(c, y) {
+  function m(u, k) {
     if (
       /*progress*/
-      c[7]
+      u[7]
     )
       return Yt;
     if (
       /*queue_position*/
-      c[2] !== null && /*queue_size*/
-      c[3] !== void 0 && /*queue_position*/
-      c[2] >= 0
+      u[2] !== null && /*queue_size*/
+      u[3] !== void 0 && /*queue_position*/
+      u[2] >= 0
     )
       return Xt;
     if (
       /*queue_position*/
-      c[2] === 0
+      u[2] === 0
     )
       return Ht;
   }
-  let w = u(n), h = w && w(n), p = (
+  let c = m(n), w = c && c(n), y = (
     /*timer*/
     n[5] && je(n)
   );
-  const C = [Ut, Rt], k = [];
-  function L(c, y) {
+  const C = [Ut, Rt], p = [];
+  function L(u, k) {
     return (
       /*last_progress_level*/
-      c[15] != null ? 0 : (
+      u[15] != null ? 0 : (
         /*show_progress*/
-        c[6] === "full" ? 1 : -1
+        u[6] === "full" ? 1 : -1
       )
     );
   }
-  ~(f = L(n)) && (o = k[f] = C[f](n));
+  ~(s = L(n)) && (o = p[s] = C[s](n));
   let F = !/*timer*/
   n[5] && Ie(n);
   return {
     c() {
-      _ && _.c(), t = j(), e = P("div"), h && h.c(), l = j(), p && p.c(), i = j(), o && o.c(), a = j(), F && F.c(), r = U(), T(e, "class", "progress-text svelte-1txqlrd"), V(
+      _ && _.c(), t = j(), e = Z("div"), w && w.c(), l = j(), y && y.c(), i = j(), o && o.c(), a = j(), F && F.c(), r = U(), T(e, "class", "progress-text svelte-1txqlrd"), V(
         e,
         "meta-text-center",
         /*variant*/
@@ -421,41 +433,41 @@ function It(n) {
         n[8] === "default"
       );
     },
-    m(c, y) {
-      _ && _.m(c, y), g(c, t, y), g(c, e, y), h && h.m(e, null), H(e, l), p && p.m(e, null), g(c, i, y), ~f && k[f].m(c, y), g(c, a, y), F && F.m(c, y), g(c, r, y), s = !0;
+    m(u, k) {
+      _ && _.m(u, k), h(u, t, k), h(u, e, k), w && w.m(e, null), H(e, l), y && y.m(e, null), h(u, i, k), ~s && p[s].m(u, k), h(u, a, k), F && F.m(u, k), h(u, r, k), f = !0;
     },
-    p(c, y) {
+    p(u, k) {
       /*variant*/
-      c[8] === "default" && /*show_eta_bar*/
-      c[18] && /*show_progress*/
-      c[6] === "full" ? _ ? _.p(c, y) : (_ = Ne(c), _.c(), _.m(t.parentNode, t)) : _ && (_.d(1), _ = null), w === (w = u(c)) && h ? h.p(c, y) : (h && h.d(1), h = w && w(c), h && (h.c(), h.m(e, l))), /*timer*/
-      c[5] ? p ? p.p(c, y) : (p = je(c), p.c(), p.m(e, null)) : p && (p.d(1), p = null), (!s || y[0] & /*variant*/
+      u[8] === "default" && /*show_eta_bar*/
+      u[18] && /*show_progress*/
+      u[6] === "full" ? _ ? _.p(u, k) : (_ = Ne(u), _.c(), _.m(t.parentNode, t)) : _ && (_.d(1), _ = null), c === (c = m(u)) && w ? w.p(u, k) : (w && w.d(1), w = c && c(u), w && (w.c(), w.m(e, l))), /*timer*/
+      u[5] ? y ? y.p(u, k) : (y = je(u), y.c(), y.m(e, null)) : y && (y.d(1), y = null), (!f || k[0] & /*variant*/
       256) && V(
         e,
         "meta-text-center",
         /*variant*/
-        c[8] === "center"
-      ), (!s || y[0] & /*variant*/
+        u[8] === "center"
+      ), (!f || k[0] & /*variant*/
       256) && V(
         e,
         "meta-text",
         /*variant*/
-        c[8] === "default"
+        u[8] === "default"
       );
-      let m = f;
-      f = L(c), f === m ? ~f && k[f].p(c, y) : (o && (We(), R(k[m], 1, 1, () => {
-        k[m] = null;
-      }), Ke()), ~f ? (o = k[f], o ? o.p(c, y) : (o = k[f] = C[f](c), o.c()), O(o, 1), o.m(a.parentNode, a)) : o = null), /*timer*/
-      c[5] ? F && (F.d(1), F = null) : F ? F.p(c, y) : (F = Ie(c), F.c(), F.m(r.parentNode, r));
+      let b = s;
+      s = L(u), s === b ? ~s && p[s].p(u, k) : (o && (We(), R(p[b], 1, 1, () => {
+        p[b] = null;
+      }), Ke()), ~s ? (o = p[s], o ? o.p(u, k) : (o = p[s] = C[s](u), o.c()), O(o, 1), o.m(a.parentNode, a)) : o = null), /*timer*/
+      u[5] ? F && (F.d(1), F = null) : F ? F.p(u, k) : (F = Ie(u), F.c(), F.m(r.parentNode, r));
     },
-    i(c) {
-      s || (O(o), s = !0);
+    i(u) {
+      f || (O(o), f = !0);
     },
-    o(c) {
-      R(o), s = !1;
+    o(u) {
+      R(o), f = !1;
     },
-    d(c) {
-      c && (b(t), b(e), b(i), b(a), b(r)), _ && _.d(c), h && h.d(), p && p.d(), ~f && k[f].d(c), F && F.d(c);
+    d(u) {
+      u && (g(t), g(e), g(i), g(a), g(r)), _ && _.d(u), w && w.d(), y && y.d(), ~s && p[s].d(u), F && F.d(u);
     }
   };
 }
@@ -464,10 +476,10 @@ function Ne(n) {
   (n[17] || 0) * 100 - 100}%)`;
   return {
     c() {
-      t = P("div"), T(t, "class", "eta-bar svelte-1txqlrd"), D(t, "transform", e);
+      t = Z("div"), T(t, "class", "eta-bar svelte-1txqlrd"), D(t, "transform", e);
     },
     m(l, i) {
-      g(l, t, i);
+      h(l, t, i);
     },
     p(l, i) {
       i[0] & /*eta_level*/
@@ -475,7 +487,7 @@ function Ne(n) {
       (l[17] || 0) * 100 - 100}%)`) && D(t, "transform", e);
     },
     d(l) {
-      l && b(t);
+      l && g(t);
     }
   };
 }
@@ -486,11 +498,11 @@ function Ht(n) {
       t = q("processing |");
     },
     m(e, l) {
-      g(e, t, l);
+      h(e, t, l);
     },
     p: oe,
     d(e) {
-      e && b(t);
+      e && g(t);
     }
   };
 }
@@ -498,29 +510,29 @@ function Xt(n) {
   let t, e = (
     /*queue_position*/
     n[2] + 1 + ""
-  ), l, i, f, o;
+  ), l, i, s, o;
   return {
     c() {
-      t = q("queue: "), l = q(e), i = q("/"), f = q(
+      t = q("queue: "), l = q(e), i = q("/"), s = q(
         /*queue_size*/
         n[3]
       ), o = q(" |");
     },
     m(a, r) {
-      g(a, t, r), g(a, l, r), g(a, i, r), g(a, f, r), g(a, o, r);
+      h(a, t, r), h(a, l, r), h(a, i, r), h(a, s, r), h(a, o, r);
     },
     p(a, r) {
       r[0] & /*queue_position*/
       4 && e !== (e = /*queue_position*/
       a[2] + 1 + "") && S(l, e), r[0] & /*queue_size*/
       8 && S(
-        f,
+        s,
         /*queue_size*/
         a[3]
       );
     },
     d(a) {
-      a && (b(t), b(l), b(i), b(f), b(o));
+      a && (g(t), g(l), g(i), g(s), g(o));
     }
   };
 }
@@ -537,13 +549,13 @@ function Yt(n) {
         l[i].c();
       t = U();
     },
-    m(i, f) {
+    m(i, s) {
       for (let o = 0; o < l.length; o += 1)
-        l[o] && l[o].m(i, f);
-      g(i, t, f);
+        l[o] && l[o].m(i, s);
+      h(i, t, s);
     },
-    p(i, f) {
-      if (f[0] & /*progress*/
+    p(i, s) {
+      if (s[0] & /*progress*/
       128) {
         e = le(
           /*progress*/
@@ -552,7 +564,7 @@ function Yt(n) {
         let o;
         for (o = 0; o < e.length; o += 1) {
           const a = Se(i, e, o);
-          l[o] ? l[o].p(a, f) : (l[o] = Te(a), l[o].c(), l[o].m(t.parentNode, t));
+          l[o] ? l[o].p(a, s) : (l[o] = Te(a), l[o].c(), l[o].m(t.parentNode, t));
         }
         for (; o < l.length; o += 1)
           l[o].d(1);
@@ -560,7 +572,7 @@ function Yt(n) {
       }
     },
     d(i) {
-      i && b(t), Qe(l, i);
+      i && g(t), Qe(l, i);
     }
   };
 }
@@ -568,28 +580,28 @@ function ze(n) {
   let t, e = (
     /*p*/
     n[38].unit + ""
-  ), l, i, f = " ", o;
-  function a(_, u) {
+  ), l, i, s = " ", o;
+  function a(_, m) {
     return (
       /*p*/
       _[38].length != null ? Ot : Gt
     );
   }
-  let r = a(n), s = r(n);
+  let r = a(n), f = r(n);
   return {
     c() {
-      s.c(), t = j(), l = q(e), i = q(" | "), o = q(f);
+      f.c(), t = j(), l = q(e), i = q(" | "), o = q(s);
     },
-    m(_, u) {
-      s.m(_, u), g(_, t, u), g(_, l, u), g(_, i, u), g(_, o, u);
+    m(_, m) {
+      f.m(_, m), h(_, t, m), h(_, l, m), h(_, i, m), h(_, o, m);
     },
-    p(_, u) {
-      r === (r = a(_)) && s ? s.p(_, u) : (s.d(1), s = r(_), s && (s.c(), s.m(t.parentNode, t))), u[0] & /*progress*/
+    p(_, m) {
+      r === (r = a(_)) && f ? f.p(_, m) : (f.d(1), f = r(_), f && (f.c(), f.m(t.parentNode, t))), m[0] & /*progress*/
       128 && e !== (e = /*p*/
       _[38].unit + "") && S(l, e);
     },
     d(_) {
-      _ && (b(t), b(l), b(i), b(o)), s.d(_);
+      _ && (g(t), g(l), g(i), g(o)), f.d(_);
     }
   };
 }
@@ -603,7 +615,7 @@ function Gt(n) {
       e = q(t);
     },
     m(l, i) {
-      g(l, e, i);
+      h(l, e, i);
     },
     p(l, i) {
       i[0] & /*progress*/
@@ -613,7 +625,7 @@ function Gt(n) {
       ) + "") && S(e, t);
     },
     d(l) {
-      l && b(e);
+      l && g(e);
     }
   };
 }
@@ -624,13 +636,13 @@ function Ot(n) {
   ) + "", e, l, i = Y(
     /*p*/
     n[38].length
-  ) + "", f;
+  ) + "", s;
   return {
     c() {
-      e = q(t), l = q("/"), f = q(i);
+      e = q(t), l = q("/"), s = q(i);
     },
     m(o, a) {
-      g(o, e, a), g(o, l, a), g(o, f, a);
+      h(o, e, a), h(o, l, a), h(o, s, a);
     },
     p(o, a) {
       a[0] & /*progress*/
@@ -641,10 +653,10 @@ function Ot(n) {
       128 && i !== (i = Y(
         /*p*/
         o[38].length
-      ) + "") && S(f, i);
+      ) + "") && S(s, i);
     },
     d(o) {
-      o && (b(e), b(l), b(f));
+      o && (g(e), g(l), g(s));
     }
   };
 }
@@ -658,14 +670,14 @@ function Te(n) {
       e && e.c(), t = U();
     },
     m(l, i) {
-      e && e.m(l, i), g(l, t, i);
+      e && e.m(l, i), h(l, t, i);
     },
     p(l, i) {
       /*p*/
       l[38].index != null ? e ? e.p(l, i) : (e = ze(l), e.c(), e.m(t.parentNode, t)) : e && (e.d(1), e = null);
     },
     d(l) {
-      l && b(t), e && e.d(l);
+      l && g(t), e && e.d(l);
     }
   };
 }
@@ -682,22 +694,22 @@ function je(n) {
         n[20]
       ), l = q(e), i = q("s");
     },
-    m(f, o) {
-      g(f, t, o), g(f, l, o), g(f, i, o);
+    m(s, o) {
+      h(s, t, o), h(s, l, o), h(s, i, o);
     },
-    p(f, o) {
+    p(s, o) {
       o[0] & /*formatted_timer*/
       1048576 && S(
         t,
         /*formatted_timer*/
-        f[20]
+        s[20]
       ), o[0] & /*eta, formatted_eta*/
       524289 && e !== (e = /*eta*/
-      f[0] ? `/${/*formatted_eta*/
-      f[19]}` : "") && S(l, e);
+      s[0] ? `/${/*formatted_eta*/
+      s[19]}` : "") && S(l, e);
     },
-    d(f) {
-      f && (b(t), b(l), b(i));
+    d(s) {
+      s && (g(t), g(l), g(i));
     }
   };
 }
@@ -716,10 +728,10 @@ function Rt(n) {
       jt(t, l, i), e = !0;
     },
     p(l, i) {
-      const f = {};
+      const s = {};
       i[0] & /*variant*/
-      256 && (f.margin = /*variant*/
-      l[8] === "default"), t.$set(f);
+      256 && (s.margin = /*variant*/
+      l[8] === "default"), t.$set(s);
     },
     i(l) {
       e || (O(t.$$.fragment, l), e = !0);
@@ -733,28 +745,28 @@ function Rt(n) {
   };
 }
 function Ut(n) {
-  let t, e, l, i, f, o = `${/*last_progress_level*/
+  let t, e, l, i, s, o = `${/*last_progress_level*/
   n[15] * 100}%`, a = (
     /*progress*/
     n[7] != null && Pe(n)
   );
   return {
     c() {
-      t = P("div"), e = P("div"), a && a.c(), l = j(), i = P("div"), f = P("div"), T(e, "class", "progress-level-inner svelte-1txqlrd"), T(f, "class", "progress-bar svelte-1txqlrd"), D(f, "width", o), T(i, "class", "progress-bar-wrap svelte-1txqlrd"), T(t, "class", "progress-level svelte-1txqlrd");
+      t = Z("div"), e = Z("div"), a && a.c(), l = j(), i = Z("div"), s = Z("div"), T(e, "class", "progress-level-inner svelte-1txqlrd"), T(s, "class", "progress-bar svelte-1txqlrd"), D(s, "width", o), T(i, "class", "progress-bar-wrap svelte-1txqlrd"), T(t, "class", "progress-level svelte-1txqlrd");
     },
-    m(r, s) {
-      g(r, t, s), H(t, e), a && a.m(e, null), H(t, l), H(t, i), H(i, f), n[30](f);
+    m(r, f) {
+      h(r, t, f), H(t, e), a && a.m(e, null), H(t, l), H(t, i), H(i, s), n[30](s);
     },
-    p(r, s) {
+    p(r, f) {
       /*progress*/
-      r[7] != null ? a ? a.p(r, s) : (a = Pe(r), a.c(), a.m(e, null)) : a && (a.d(1), a = null), s[0] & /*last_progress_level*/
+      r[7] != null ? a ? a.p(r, f) : (a = Pe(r), a.c(), a.m(e, null)) : a && (a.d(1), a = null), f[0] & /*last_progress_level*/
       32768 && o !== (o = `${/*last_progress_level*/
-      r[15] * 100}%`) && D(f, "width", o);
+      r[15] * 100}%`) && D(s, "width", o);
     },
     i: oe,
     o: oe,
     d(r) {
-      r && b(t), a && a.d(), n[30](null);
+      r && g(t), a && a.d(), n[30](null);
     }
   };
 }
@@ -771,13 +783,13 @@ function Pe(n) {
         l[i].c();
       t = U();
     },
-    m(i, f) {
+    m(i, s) {
       for (let o = 0; o < l.length; o += 1)
-        l[o] && l[o].m(i, f);
-      g(i, t, f);
+        l[o] && l[o].m(i, s);
+      h(i, t, s);
     },
-    p(i, f) {
-      if (f[0] & /*progress_level, progress*/
+    p(i, s) {
+      if (s[0] & /*progress_level, progress*/
       16512) {
         e = le(
           /*progress*/
@@ -786,7 +798,7 @@ function Pe(n) {
         let o;
         for (o = 0; o < e.length; o += 1) {
           const a = Ve(i, e, o);
-          l[o] ? l[o].p(a, f) : (l[o] = Ee(a), l[o].c(), l[o].m(t.parentNode, t));
+          l[o] ? l[o].p(a, s) : (l[o] = Ee(a), l[o].c(), l[o].m(t.parentNode, t));
         }
         for (; o < l.length; o += 1)
           l[o].d(1);
@@ -794,12 +806,12 @@ function Pe(n) {
       }
     },
     d(i) {
-      i && b(t), Qe(l, i);
+      i && g(t), Qe(l, i);
     }
   };
 }
 function Ze(n) {
-  let t, e, l, i, f = (
+  let t, e, l, i, s = (
     /*i*/
     n[40] !== 0 && Jt()
   ), o = (
@@ -819,24 +831,24 @@ function Ze(n) {
   );
   return {
     c() {
-      f && f.c(), t = j(), o && o.c(), e = j(), a && a.c(), l = j(), r && r.c(), i = U();
+      s && s.c(), t = j(), o && o.c(), e = j(), a && a.c(), l = j(), r && r.c(), i = U();
     },
-    m(s, _) {
-      f && f.m(s, _), g(s, t, _), o && o.m(s, _), g(s, e, _), a && a.m(s, _), g(s, l, _), r && r.m(s, _), g(s, i, _);
+    m(f, _) {
+      s && s.m(f, _), h(f, t, _), o && o.m(f, _), h(f, e, _), a && a.m(f, _), h(f, l, _), r && r.m(f, _), h(f, i, _);
     },
-    p(s, _) {
+    p(f, _) {
       /*p*/
-      s[38].desc != null ? o ? o.p(s, _) : (o = Be(s), o.c(), o.m(e.parentNode, e)) : o && (o.d(1), o = null), /*p*/
-      s[38].desc != null && /*progress_level*/
-      s[14] && /*progress_level*/
-      s[14][
+      f[38].desc != null ? o ? o.p(f, _) : (o = Be(f), o.c(), o.m(e.parentNode, e)) : o && (o.d(1), o = null), /*p*/
+      f[38].desc != null && /*progress_level*/
+      f[14] && /*progress_level*/
+      f[14][
         /*i*/
-        s[40]
+        f[40]
       ] != null ? a || (a = Ae(), a.c(), a.m(l.parentNode, l)) : a && (a.d(1), a = null), /*progress_level*/
-      s[14] != null ? r ? r.p(s, _) : (r = De(s), r.c(), r.m(i.parentNode, i)) : r && (r.d(1), r = null);
+      f[14] != null ? r ? r.p(f, _) : (r = De(f), r.c(), r.m(i.parentNode, i)) : r && (r.d(1), r = null);
     },
-    d(s) {
-      s && (b(t), b(e), b(l), b(i)), f && f.d(s), o && o.d(s), a && a.d(s), r && r.d(s);
+    d(f) {
+      f && (g(t), g(e), g(l), g(i)), s && s.d(f), o && o.d(f), a && a.d(f), r && r.d(f);
     }
   };
 }
@@ -847,10 +859,10 @@ function Jt(n) {
       t = q(" /");
     },
     m(e, l) {
-      g(e, t, l);
+      h(e, t, l);
     },
     d(e) {
-      e && b(t);
+      e && g(t);
     }
   };
 }
@@ -864,7 +876,7 @@ function Be(n) {
       e = q(t);
     },
     m(l, i) {
-      g(l, e, i);
+      h(l, e, i);
     },
     p(l, i) {
       i[0] & /*progress*/
@@ -872,7 +884,7 @@ function Be(n) {
       l[38].desc + "") && S(e, t);
     },
     d(l) {
-      l && b(e);
+      l && g(e);
     }
   };
 }
@@ -883,10 +895,10 @@ function Ae(n) {
       t = q("-");
     },
     m(e, l) {
-      g(e, t, l);
+      h(e, t, l);
     },
     d(e) {
-      e && b(t);
+      e && g(t);
     }
   };
 }
@@ -900,11 +912,11 @@ function De(n) {
     c() {
       e = q(t), l = q("%");
     },
-    m(i, f) {
-      g(i, e, f), g(i, l, f);
+    m(i, s) {
+      h(i, e, s), h(i, l, s);
     },
-    p(i, f) {
-      f[0] & /*progress_level*/
+    p(i, s) {
+      s[0] & /*progress_level*/
       16384 && t !== (t = (100 * /*progress_level*/
       (i[14][
         /*i*/
@@ -912,7 +924,7 @@ function De(n) {
       ] || 0)).toFixed(1) + "") && S(e, t);
     },
     d(i) {
-      i && (b(e), b(l));
+      i && (g(e), g(l));
     }
   };
 }
@@ -931,7 +943,7 @@ function Ee(n) {
       e && e.c(), t = U();
     },
     m(l, i) {
-      e && e.m(l, i), g(l, t, i);
+      e && e.m(l, i), h(l, t, i);
     },
     p(l, i) {
       /*p*/
@@ -943,7 +955,7 @@ function Ee(n) {
       ] != null ? e ? e.p(l, i) : (e = Ze(l), e.c(), e.m(t.parentNode, t)) : e && (e.d(1), e = null);
     },
     d(l) {
-      l && b(t), e && e.d(l);
+      l && g(t), e && e.d(l);
     }
   };
 }
@@ -951,13 +963,13 @@ function Ie(n) {
   let t, e;
   return {
     c() {
-      t = P("p"), e = q(
+      t = Z("p"), e = q(
         /*loading_text*/
         n[9]
       ), T(t, "class", "loading svelte-1txqlrd");
     },
     m(l, i) {
-      g(l, t, i), H(t, e);
+      h(l, t, i), H(t, e);
     },
     p(l, i) {
       i[0] & /*loading_text*/
@@ -968,25 +980,25 @@ function Ie(n) {
       );
     },
     d(l) {
-      l && b(t);
+      l && g(t);
     }
   };
 }
 function Kt(n) {
-  let t, e, l, i, f;
+  let t, e, l, i, s;
   const o = [It, Et], a = [];
-  function r(s, _) {
+  function r(f, _) {
     return (
       /*status*/
-      s[4] === "pending" ? 0 : (
+      f[4] === "pending" ? 0 : (
         /*status*/
-        s[4] === "error" ? 1 : -1
+        f[4] === "error" ? 1 : -1
       )
     );
   }
   return ~(e = r(n)) && (l = a[e] = o[e](n)), {
     c() {
-      t = P("div"), l && l.c(), T(t, "class", i = "wrap " + /*variant*/
+      t = Z("div"), l && l.c(), T(t, "class", i = "wrap " + /*variant*/
       n[8] + " " + /*show_progress*/
       n[6] + " svelte-1txqlrd"), V(t, "hide", !/*status*/
       n[4] || /*status*/
@@ -1022,86 +1034,86 @@ function Kt(n) {
         n[10] ? "0" : "var(--size-8) 0"
       );
     },
-    m(s, _) {
-      g(s, t, _), ~e && a[e].m(t, null), n[31](t), f = !0;
+    m(f, _) {
+      h(f, t, _), ~e && a[e].m(t, null), n[31](t), s = !0;
     },
-    p(s, _) {
-      let u = e;
-      e = r(s), e === u ? ~e && a[e].p(s, _) : (l && (We(), R(a[u], 1, 1, () => {
-        a[u] = null;
-      }), Ke()), ~e ? (l = a[e], l ? l.p(s, _) : (l = a[e] = o[e](s), l.c()), O(l, 1), l.m(t, null)) : l = null), (!f || _[0] & /*variant, show_progress*/
+    p(f, _) {
+      let m = e;
+      e = r(f), e === m ? ~e && a[e].p(f, _) : (l && (We(), R(a[m], 1, 1, () => {
+        a[m] = null;
+      }), Ke()), ~e ? (l = a[e], l ? l.p(f, _) : (l = a[e] = o[e](f), l.c()), O(l, 1), l.m(t, null)) : l = null), (!s || _[0] & /*variant, show_progress*/
       320 && i !== (i = "wrap " + /*variant*/
-      s[8] + " " + /*show_progress*/
-      s[6] + " svelte-1txqlrd")) && T(t, "class", i), (!f || _[0] & /*variant, show_progress, status, show_progress*/
+      f[8] + " " + /*show_progress*/
+      f[6] + " svelte-1txqlrd")) && T(t, "class", i), (!s || _[0] & /*variant, show_progress, status, show_progress*/
       336) && V(t, "hide", !/*status*/
-      s[4] || /*status*/
-      s[4] === "complete" || /*show_progress*/
-      s[6] === "hidden"), (!f || _[0] & /*variant, show_progress, variant, status, translucent, show_progress*/
+      f[4] || /*status*/
+      f[4] === "complete" || /*show_progress*/
+      f[6] === "hidden"), (!s || _[0] & /*variant, show_progress, variant, status, translucent, show_progress*/
       2384) && V(
         t,
         "translucent",
         /*variant*/
-        s[8] === "center" && /*status*/
-        (s[4] === "pending" || /*status*/
-        s[4] === "error") || /*translucent*/
-        s[11] || /*show_progress*/
-        s[6] === "minimal"
-      ), (!f || _[0] & /*variant, show_progress, status*/
+        f[8] === "center" && /*status*/
+        (f[4] === "pending" || /*status*/
+        f[4] === "error") || /*translucent*/
+        f[11] || /*show_progress*/
+        f[6] === "minimal"
+      ), (!s || _[0] & /*variant, show_progress, status*/
       336) && V(
         t,
         "generating",
         /*status*/
-        s[4] === "generating"
-      ), (!f || _[0] & /*variant, show_progress, border*/
+        f[4] === "generating"
+      ), (!s || _[0] & /*variant, show_progress, border*/
       4416) && V(
         t,
         "border",
         /*border*/
-        s[12]
+        f[12]
       ), _[0] & /*absolute*/
       1024 && D(
         t,
         "position",
         /*absolute*/
-        s[10] ? "absolute" : "static"
+        f[10] ? "absolute" : "static"
       ), _[0] & /*absolute*/
       1024 && D(
         t,
         "padding",
         /*absolute*/
-        s[10] ? "0" : "var(--size-8) 0"
+        f[10] ? "0" : "var(--size-8) 0"
       );
     },
-    i(s) {
-      f || (O(l), f = !0);
+    i(f) {
+      s || (O(l), s = !0);
     },
-    o(s) {
-      R(l), f = !1;
+    o(f) {
+      R(l), s = !1;
     },
-    d(s) {
-      s && b(t), ~e && a[e].d(), n[31](null);
+    d(f) {
+      f && g(t), ~e && a[e].d(), n[31](null);
     }
   };
 }
-let ee = [], se = !1;
+let ee = [], fe = !1;
 async function Qt(n, t = !0) {
   if (!(window.__gradio_mode__ === "website" || window.__gradio_mode__ !== "app" && t !== !0)) {
-    if (ee.push(n), !se)
-      se = !0;
+    if (ee.push(n), !fe)
+      fe = !0;
     else
       return;
     await Bt(), requestAnimationFrame(() => {
       let e = [0, 0];
       for (let l = 0; l < ee.length; l++) {
-        const f = ee[l].getBoundingClientRect();
-        (l === 0 || f.top + window.scrollY <= e[0]) && (e[0] = f.top + window.scrollY, e[1] = l);
+        const s = ee[l].getBoundingClientRect();
+        (l === 0 || s.top + window.scrollY <= e[0]) && (e[0] = s.top + window.scrollY, e[1] = l);
       }
-      window.scrollTo({ top: e[0] - 20, behavior: "smooth" }), se = !1, ee = [];
+      window.scrollTo({ top: e[0] - 20, behavior: "smooth" }), fe = !1, ee = [];
     });
   }
 }
 function Wt(n, t, e) {
-  let l, { $$slots: i = {}, $$scope: f } = t, { i18n: o } = t, { eta: a = null } = t, { queue: r = !1 } = t, { queue_position: s } = t, { queue_size: _ } = t, { status: u } = t, { scroll_to_output: w = !1 } = t, { timer: h = !0 } = t, { show_progress: p = "full" } = t, { message: C = null } = t, { progress: k = null } = t, { variant: L = "default" } = t, { loading_text: F = "Loading..." } = t, { absolute: c = !0 } = t, { translucent: y = !1 } = t, { border: m = !1 } = t, { autoscroll: ne } = t, J, K = !1, W = 0, E = 0, ie = null, de = 0, I = null, Q, Z = null, me = !0;
+  let l, { $$slots: i = {}, $$scope: s } = t, { i18n: o } = t, { eta: a = null } = t, { queue: r = !1 } = t, { queue_position: f } = t, { queue_size: _ } = t, { status: m } = t, { scroll_to_output: c = !1 } = t, { timer: w = !0 } = t, { show_progress: y = "full" } = t, { message: C = null } = t, { progress: p = null } = t, { variant: L = "default" } = t, { loading_text: F = "Loading..." } = t, { absolute: u = !0 } = t, { translucent: k = !1 } = t, { border: b = !1 } = t, { autoscroll: ne } = t, J, K = !1, W = 0, E = 0, ie = null, de = 0, I = null, Q, B = null, me = !0;
   const et = () => {
     e(25, W = performance.now()), e(26, E = 0), K = !0, be();
   };
@@ -1119,7 +1131,7 @@ function Wt(n, t, e) {
   let he = null;
   function tt(d) {
     Ce[d ? "unshift" : "push"](() => {
-      Z = d, e(16, Z), e(7, k), e(14, I), e(15, Q);
+      B = d, e(16, B), e(7, p), e(14, I), e(15, Q);
     });
   }
   function lt(d) {
@@ -1128,52 +1140,52 @@ function Wt(n, t, e) {
     });
   }
   return n.$$set = (d) => {
-    "i18n" in d && e(1, o = d.i18n), "eta" in d && e(0, a = d.eta), "queue" in d && e(21, r = d.queue), "queue_position" in d && e(2, s = d.queue_position), "queue_size" in d && e(3, _ = d.queue_size), "status" in d && e(4, u = d.status), "scroll_to_output" in d && e(22, w = d.scroll_to_output), "timer" in d && e(5, h = d.timer), "show_progress" in d && e(6, p = d.show_progress), "message" in d && e(23, C = d.message), "progress" in d && e(7, k = d.progress), "variant" in d && e(8, L = d.variant), "loading_text" in d && e(9, F = d.loading_text), "absolute" in d && e(10, c = d.absolute), "translucent" in d && e(11, y = d.translucent), "border" in d && e(12, m = d.border), "autoscroll" in d && e(24, ne = d.autoscroll), "$$scope" in d && e(28, f = d.$$scope);
+    "i18n" in d && e(1, o = d.i18n), "eta" in d && e(0, a = d.eta), "queue" in d && e(21, r = d.queue), "queue_position" in d && e(2, f = d.queue_position), "queue_size" in d && e(3, _ = d.queue_size), "status" in d && e(4, m = d.status), "scroll_to_output" in d && e(22, c = d.scroll_to_output), "timer" in d && e(5, w = d.timer), "show_progress" in d && e(6, y = d.show_progress), "message" in d && e(23, C = d.message), "progress" in d && e(7, p = d.progress), "variant" in d && e(8, L = d.variant), "loading_text" in d && e(9, F = d.loading_text), "absolute" in d && e(10, u = d.absolute), "translucent" in d && e(11, k = d.translucent), "border" in d && e(12, b = d.border), "autoscroll" in d && e(24, ne = d.autoscroll), "$$scope" in d && e(28, s = d.$$scope);
   }, n.$$.update = () => {
     n.$$.dirty[0] & /*eta, old_eta, queue, timer_start*/
     169869313 && (a === null ? e(0, a = ie) : r && e(0, a = (performance.now() - W) / 1e3 + a), a != null && (e(19, he = a.toFixed(1)), e(27, ie = a))), n.$$.dirty[0] & /*eta, timer_diff*/
     67108865 && e(17, de = a === null || a <= 0 || !E ? null : Math.min(E / a, 1)), n.$$.dirty[0] & /*progress*/
-    128 && k != null && e(18, me = !1), n.$$.dirty[0] & /*progress, progress_level, progress_bar, last_progress_level*/
-    114816 && (k != null ? e(14, I = k.map((d) => {
+    128 && p != null && e(18, me = !1), n.$$.dirty[0] & /*progress, progress_level, progress_bar, last_progress_level*/
+    114816 && (p != null ? e(14, I = p.map((d) => {
       if (d.index != null && d.length != null)
         return d.index / d.length;
       if (d.progress != null)
         return d.progress;
-    })) : e(14, I = null), I ? (e(15, Q = I[I.length - 1]), Z && (Q === 0 ? e(16, Z.style.transition = "0", Z) : e(16, Z.style.transition = "150ms", Z))) : e(15, Q = void 0)), n.$$.dirty[0] & /*status*/
-    16 && (u === "pending" ? et() : ge()), n.$$.dirty[0] & /*el, scroll_to_output, status, autoscroll*/
-    20979728 && J && w && (u === "pending" || u === "complete") && Qt(J, ne), n.$$.dirty[0] & /*status, message*/
+    })) : e(14, I = null), I ? (e(15, Q = I[I.length - 1]), B && (Q === 0 ? e(16, B.style.transition = "0", B) : e(16, B.style.transition = "150ms", B))) : e(15, Q = void 0)), n.$$.dirty[0] & /*status*/
+    16 && (m === "pending" ? et() : ge()), n.$$.dirty[0] & /*el, scroll_to_output, status, autoscroll*/
+    20979728 && J && c && (m === "pending" || m === "complete") && Qt(J, ne), n.$$.dirty[0] & /*status, message*/
     8388624, n.$$.dirty[0] & /*timer_diff*/
     67108864 && e(20, l = E.toFixed(1));
   }, [
     a,
     o,
-    s,
+    f,
     _,
-    u,
-    h,
+    m,
+    w,
+    y,
     p,
-    k,
     L,
     F,
-    c,
-    y,
-    m,
+    u,
+    k,
+    b,
     J,
     I,
     Q,
-    Z,
+    B,
     de,
     me,
     he,
     l,
     r,
-    w,
+    c,
     C,
     ne,
     W,
     E,
     ie,
-    f,
+    s,
     i,
     tt,
     lt
@@ -1218,8 +1230,8 @@ const {
   detach: ll,
   element: nl,
   get_all_dirty_from_scope: il,
-  get_slot_changes: sl,
-  get_spread_update: fl,
+  get_slot_changes: fl,
+  get_spread_update: sl,
   init: ol,
   insert: al,
   safe_not_equal: rl,
@@ -1230,12 +1242,12 @@ const {
   transition_out: $e,
   update_slot_base: _l
 } = window.__gradio__svelte__internal;
-function cl(n) {
+function ul(n) {
   let t, e, l;
   const i = (
     /*#slots*/
     n[17].default
-  ), f = tl(
+  ), s = tl(
     i,
     n,
     /*$$scope*/
@@ -1263,7 +1275,7 @@ function cl(n) {
       t = nl(
         /*tag*/
         n[14]
-      ), f && f.c(), He(
+      ), s && s.c(), He(
         /*tag*/
         n[14]
       )(t, a), A(
@@ -1307,22 +1319,22 @@ function cl(n) {
       ), M(t, "min-width", `calc(min(${/*min_width*/
       n[13]}px, 100%))`), M(t, "border-width", "var(--block-border-width)");
     },
-    m(r, s) {
-      al(r, t, s), f && f.m(t, null), l = !0;
+    m(r, f) {
+      al(r, t, f), s && s.m(t, null), l = !0;
     },
-    p(r, s) {
-      f && f.p && (!l || s & /*$$scope*/
+    p(r, f) {
+      s && s.p && (!l || f & /*$$scope*/
       65536) && _l(
-        f,
+        s,
         i,
         r,
         /*$$scope*/
         r[16],
-        l ? sl(
+        l ? fl(
           i,
           /*$$scope*/
           r[16],
-          s,
+          f,
           null
         ) : il(
           /*$$scope*/
@@ -1332,18 +1344,18 @@ function cl(n) {
       ), He(
         /*tag*/
         r[14]
-      )(t, a = fl(o, [
-        (!l || s & /*test_id*/
+      )(t, a = sl(o, [
+        (!l || f & /*test_id*/
         128) && { "data-testid": (
           /*test_id*/
           r[7]
         ) },
-        (!l || s & /*elem_id*/
+        (!l || f & /*elem_id*/
         4) && { id: (
           /*elem_id*/
           r[2]
         ) },
-        (!l || s & /*elem_classes*/
+        (!l || f & /*elem_classes*/
         8 && e !== (e = "block " + /*elem_classes*/
         r[3].join(" ") + " svelte-1t38q2d")) && { class: e }
       ])), A(
@@ -1363,51 +1375,51 @@ function cl(n) {
         r[5] === "focus"
       ), A(t, "hide-container", !/*explicit_call*/
       r[8] && !/*container*/
-      r[9]), s & /*height*/
+      r[9]), f & /*height*/
       1 && M(t, "height", typeof /*height*/
       r[0] == "number" ? (
         /*height*/
         r[0] + "px"
-      ) : void 0), s & /*width*/
+      ) : void 0), f & /*width*/
       2 && M(t, "width", typeof /*width*/
       r[1] == "number" ? `calc(min(${/*width*/
-      r[1]}px, 100%))` : void 0), s & /*variant*/
+      r[1]}px, 100%))` : void 0), f & /*variant*/
       16 && M(
         t,
         "border-style",
         /*variant*/
         r[4]
-      ), s & /*allow_overflow*/
+      ), f & /*allow_overflow*/
       2048 && M(
         t,
         "overflow",
         /*allow_overflow*/
         r[11] ? "visible" : "hidden"
-      ), s & /*scale*/
+      ), f & /*scale*/
       4096 && M(
         t,
         "flex-grow",
         /*scale*/
         r[12]
-      ), s & /*min_width*/
+      ), f & /*min_width*/
       8192 && M(t, "min-width", `calc(min(${/*min_width*/
       r[13]}px, 100%))`);
     },
     i(r) {
-      l || (xe(f, r), l = !0);
+      l || (xe(s, r), l = !0);
     },
     o(r) {
-      $e(f, r), l = !1;
+      $e(s, r), l = !1;
     },
     d(r) {
-      r && ll(t), f && f.d(r);
+      r && ll(t), s && s.d(r);
     }
   };
 }
-function ul(n) {
+function cl(n) {
   let t, e = (
     /*tag*/
-    n[14] && cl(n)
+    n[14] && ul(n)
   );
   return {
     c() {
@@ -1432,33 +1444,33 @@ function ul(n) {
   };
 }
 function dl(n, t, e) {
-  let { $$slots: l = {}, $$scope: i } = t, { height: f = void 0 } = t, { width: o = void 0 } = t, { elem_id: a = "" } = t, { elem_classes: r = [] } = t, { variant: s = "solid" } = t, { border_mode: _ = "base" } = t, { padding: u = !0 } = t, { type: w = "normal" } = t, { test_id: h = void 0 } = t, { explicit_call: p = !1 } = t, { container: C = !0 } = t, { visible: k = !0 } = t, { allow_overflow: L = !0 } = t, { scale: F = null } = t, { min_width: c = 0 } = t, y = w === "fieldset" ? "fieldset" : "div";
-  return n.$$set = (m) => {
-    "height" in m && e(0, f = m.height), "width" in m && e(1, o = m.width), "elem_id" in m && e(2, a = m.elem_id), "elem_classes" in m && e(3, r = m.elem_classes), "variant" in m && e(4, s = m.variant), "border_mode" in m && e(5, _ = m.border_mode), "padding" in m && e(6, u = m.padding), "type" in m && e(15, w = m.type), "test_id" in m && e(7, h = m.test_id), "explicit_call" in m && e(8, p = m.explicit_call), "container" in m && e(9, C = m.container), "visible" in m && e(10, k = m.visible), "allow_overflow" in m && e(11, L = m.allow_overflow), "scale" in m && e(12, F = m.scale), "min_width" in m && e(13, c = m.min_width), "$$scope" in m && e(16, i = m.$$scope);
+  let { $$slots: l = {}, $$scope: i } = t, { height: s = void 0 } = t, { width: o = void 0 } = t, { elem_id: a = "" } = t, { elem_classes: r = [] } = t, { variant: f = "solid" } = t, { border_mode: _ = "base" } = t, { padding: m = !0 } = t, { type: c = "normal" } = t, { test_id: w = void 0 } = t, { explicit_call: y = !1 } = t, { container: C = !0 } = t, { visible: p = !0 } = t, { allow_overflow: L = !0 } = t, { scale: F = null } = t, { min_width: u = 0 } = t, k = c === "fieldset" ? "fieldset" : "div";
+  return n.$$set = (b) => {
+    "height" in b && e(0, s = b.height), "width" in b && e(1, o = b.width), "elem_id" in b && e(2, a = b.elem_id), "elem_classes" in b && e(3, r = b.elem_classes), "variant" in b && e(4, f = b.variant), "border_mode" in b && e(5, _ = b.border_mode), "padding" in b && e(6, m = b.padding), "type" in b && e(15, c = b.type), "test_id" in b && e(7, w = b.test_id), "explicit_call" in b && e(8, y = b.explicit_call), "container" in b && e(9, C = b.container), "visible" in b && e(10, p = b.visible), "allow_overflow" in b && e(11, L = b.allow_overflow), "scale" in b && e(12, F = b.scale), "min_width" in b && e(13, u = b.min_width), "$$scope" in b && e(16, i = b.$$scope);
   }, [
-    f,
+    s,
     o,
     a,
     r,
-    s,
+    f,
     _,
-    u,
-    h,
-    p,
+    m,
+    w,
+    y,
     C,
-    k,
+    p,
     L,
     F,
+    u,
+    k,
     c,
-    y,
-    w,
     i,
     l
   ];
 }
 class ml extends $t {
   constructor(t) {
-    super(), ol(this, t, dl, ul, rl, {
+    super(), ol(this, t, dl, cl, rl, {
       height: 0,
       width: 1,
       elem_id: 2,
@@ -1799,42 +1811,42 @@ const {
   destroy_component: re,
   detach: Ye,
   element: vl,
-  get_spread_object: pl,
-  get_spread_update: yl,
-  init: kl,
+  get_spread_object: yl,
+  get_spread_update: kl,
+  init: pl,
   insert: Ge,
   mount_component: _e,
   safe_not_equal: ql,
   space: Fl,
   toggle_class: Oe,
-  transition_in: ce,
-  transition_out: ue
+  transition_in: ue,
+  transition_out: ce
 } = window.__gradio__svelte__internal;
 function Ll(n) {
   var r;
-  let t, e, l, i, f;
+  let t, e, l, i, s;
   const o = [
     { autoscroll: (
       /*gradio*/
-      n[5].autoscroll
+      n[6].autoscroll
     ) },
     { i18n: (
       /*gradio*/
-      n[5].i18n
+      n[6].i18n
     ) },
     /*loading_status*/
-    n[4],
+    n[5],
     { variant: "center" }
   ];
   let a = {};
-  for (let s = 0; s < o.length; s += 1)
-    a = hl(a, o[s]);
-  return t = new xt({ props: a }), i = new ut({
+  for (let f = 0; f < o.length; f += 1)
+    a = hl(a, o[f]);
+  return t = new xt({ props: a }), i = new ct({
     props: {
       min_height: (
         /*loading_status*/
-        n[4] && /*loading_status*/
-        ((r = n[4]) == null ? void 0 : r.status) !== "complete"
+        n[5] && /*loading_status*/
+        ((r = n[5]) == null ? void 0 : r.status) !== "complete"
       ),
       value: (
         /*value*/
@@ -1847,73 +1859,79 @@ function Ll(n) {
       visible: (
         /*visible*/
         n[2]
+      ),
+      height: (
+        /*height*/
+        n[4]
       )
     }
   }), i.$on(
     "change",
     /*change_handler*/
-    n[7]
+    n[8]
   ), {
     c() {
-      var s;
+      var f;
       ae(t.$$.fragment), e = Fl(), l = vl("div"), ae(i.$$.fragment), wl(l, "class", "svelte-gqsrr7"), Oe(
         l,
         "pending",
         /*loading_status*/
-        ((s = n[4]) == null ? void 0 : s.status) === "pending"
+        ((f = n[5]) == null ? void 0 : f.status) === "pending"
       );
     },
-    m(s, _) {
-      _e(t, s, _), Ge(s, e, _), Ge(s, l, _), _e(i, l, null), f = !0;
+    m(f, _) {
+      _e(t, f, _), Ge(f, e, _), Ge(f, l, _), _e(i, l, null), s = !0;
     },
-    p(s, _) {
-      var h, p;
-      const u = _ & /*gradio, loading_status*/
-      48 ? yl(o, [
+    p(f, _) {
+      var w, y;
+      const m = _ & /*gradio, loading_status*/
+      96 ? kl(o, [
         _ & /*gradio*/
-        32 && { autoscroll: (
+        64 && { autoscroll: (
           /*gradio*/
-          s[5].autoscroll
+          f[6].autoscroll
         ) },
         _ & /*gradio*/
-        32 && { i18n: (
+        64 && { i18n: (
           /*gradio*/
-          s[5].i18n
+          f[6].i18n
         ) },
         _ & /*loading_status*/
-        16 && pl(
+        32 && yl(
           /*loading_status*/
-          s[4]
+          f[5]
         ),
         o[3]
       ]) : {};
-      t.$set(u);
-      const w = {};
+      t.$set(m);
+      const c = {};
       _ & /*loading_status*/
-      16 && (w.min_height = /*loading_status*/
-      s[4] && /*loading_status*/
-      ((h = s[4]) == null ? void 0 : h.status) !== "complete"), _ & /*value*/
-      8 && (w.value = /*value*/
-      s[3]), _ & /*elem_classes*/
-      2 && (w.elem_classes = /*elem_classes*/
-      s[1]), _ & /*visible*/
-      4 && (w.visible = /*visible*/
-      s[2]), i.$set(w), (!f || _ & /*loading_status*/
-      16) && Oe(
+      32 && (c.min_height = /*loading_status*/
+      f[5] && /*loading_status*/
+      ((w = f[5]) == null ? void 0 : w.status) !== "complete"), _ & /*value*/
+      8 && (c.value = /*value*/
+      f[3]), _ & /*elem_classes*/
+      2 && (c.elem_classes = /*elem_classes*/
+      f[1]), _ & /*visible*/
+      4 && (c.visible = /*visible*/
+      f[2]), _ & /*height*/
+      16 && (c.height = /*height*/
+      f[4]), i.$set(c), (!s || _ & /*loading_status*/
+      32) && Oe(
         l,
         "pending",
         /*loading_status*/
-        ((p = s[4]) == null ? void 0 : p.status) === "pending"
+        ((y = f[5]) == null ? void 0 : y.status) === "pending"
       );
     },
-    i(s) {
-      f || (ce(t.$$.fragment, s), ce(i.$$.fragment, s), f = !0);
+    i(f) {
+      s || (ue(t.$$.fragment, f), ue(i.$$.fragment, f), s = !0);
     },
-    o(s) {
-      ue(t.$$.fragment, s), ue(i.$$.fragment, s), f = !1;
+    o(f) {
+      ce(t.$$.fragment, f), ce(i.$$.fragment, f), s = !1;
     },
-    d(s) {
-      s && (Ye(e), Ye(l)), re(t, s), re(i);
+    d(f) {
+      f && (Ye(e), Ye(l)), re(t, f), re(i);
     }
   };
 }
@@ -1945,21 +1963,21 @@ function Cl(n) {
       _e(t, l, i), e = !0;
     },
     p(l, [i]) {
-      const f = {};
+      const s = {};
       i & /*visible*/
-      4 && (f.visible = /*visible*/
+      4 && (s.visible = /*visible*/
       l[2]), i & /*elem_id*/
-      1 && (f.elem_id = /*elem_id*/
+      1 && (s.elem_id = /*elem_id*/
       l[0]), i & /*elem_classes*/
-      2 && (f.elem_classes = /*elem_classes*/
-      l[1]), i & /*$$scope, loading_status, value, elem_classes, visible, gradio*/
-      318 && (f.$$scope = { dirty: i, ctx: l }), t.$set(f);
+      2 && (s.elem_classes = /*elem_classes*/
+      l[1]), i & /*$$scope, loading_status, value, elem_classes, visible, height, gradio*/
+      638 && (s.$$scope = { dirty: i, ctx: l }), t.$set(s);
     },
     i(l) {
-      e || (ce(t.$$.fragment, l), e = !0);
+      e || (ue(t.$$.fragment, l), e = !0);
     },
     o(l) {
-      ue(t.$$.fragment, l), e = !1;
+      ce(t.$$.fragment, l), e = !1;
     },
     d(l) {
       re(t, l);
@@ -1967,34 +1985,36 @@ function Cl(n) {
   };
 }
 function Ml(n, t, e) {
-  let { label: l } = t, { elem_id: i = "" } = t, { elem_classes: f = [] } = t, { visible: o = !0 } = t, { value: a = "" } = t, { loading_status: r } = t, { gradio: s } = t;
-  const _ = () => s.dispatch("change");
-  return n.$$set = (u) => {
-    "label" in u && e(6, l = u.label), "elem_id" in u && e(0, i = u.elem_id), "elem_classes" in u && e(1, f = u.elem_classes), "visible" in u && e(2, o = u.visible), "value" in u && e(3, a = u.value), "loading_status" in u && e(4, r = u.loading_status), "gradio" in u && e(5, s = u.gradio);
+  let { label: l } = t, { elem_id: i = "" } = t, { elem_classes: s = [] } = t, { visible: o = !0 } = t, { value: a = "" } = t, { height: r = "100%" } = t, { loading_status: f } = t, { gradio: _ } = t;
+  const m = () => _.dispatch("change");
+  return n.$$set = (c) => {
+    "label" in c && e(7, l = c.label), "elem_id" in c && e(0, i = c.elem_id), "elem_classes" in c && e(1, s = c.elem_classes), "visible" in c && e(2, o = c.visible), "value" in c && e(3, a = c.value), "height" in c && e(4, r = c.height), "loading_status" in c && e(5, f = c.loading_status), "gradio" in c && e(6, _ = c.gradio);
   }, n.$$.update = () => {
     n.$$.dirty & /*label, gradio*/
-    96 && s.dispatch("change");
+    192 && _.dispatch("change");
   }, [
     i,
-    f,
+    s,
     o,
     a,
     r,
-    s,
+    f,
+    _,
     l,
-    _
+    m
   ];
 }
 class Vl extends gl {
   constructor(t) {
-    super(), kl(this, t, Ml, Cl, ql, {
-      label: 6,
+    super(), pl(this, t, Ml, Cl, ql, {
+      label: 7,
       elem_id: 0,
       elem_classes: 1,
       visible: 2,
       value: 3,
-      loading_status: 4,
-      gradio: 5
+      height: 4,
+      loading_status: 5,
+      gradio: 6
     });
   }
 }

src/frontend/Index.svelte

@@ -10,6 +10,7 @@
 	export let elem_classes: string[] = [];
 	export let visible = true;
 	export let value = "";
+	export let height: string = "100%";
 	export let loading_status: LoadingStatus;
 	export let gradio: Gradio<{
 		change: never;
@@ -31,6 +32,7 @@
 			{value}
 			{elem_classes}
 			{visible}
+			{height}
 			on:change={() => gradio.dispatch("change")}
 		/>
 	</div>

src/frontend/package.json

@@ -17,4 +17,4 @@
     "./example": "./Example.svelte",
     "./package.json": "./package.json"
   }
-}
+}

src/frontend/shared/HTML.svelte

@@ -5,6 +5,8 @@
 	export let visible = true;
 	export let min_height = false;
 
+	export let height = "100%";
+
 	const dispatch = createEventDispatcher<{ change: undefined }>();
 
 	$: value, dispatch("change");
@@ -15,7 +17,7 @@
 	class:min={min_height}
 	class:hide={!visible}
 >
-	<iframe title="iframe component" width="100%" height="100%" srcdoc={value} allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
+	<iframe title="iframe component" width="100%" height={height} srcdoc={value} allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
 </div>
 
 <style>

src/pyproject.toml

@@ -8,7 +8,7 @@ build-backend = "hatchling.build"
 
 [project]
 name = "gradio_iframe"
-version = "0.0.3"
+version = "0.0.4"
 description = "Experimental empowered iFrame component based on existing HTML gradio component."
 readme = "README.md"
 license = "MIT"
@@ -36,7 +36,7 @@ classifiers = [
 dev = ["build", "twine"]
 
 [tool.hatch.build]
-artifacts = ["/backend/gradio_iframe/templates", "*.pyi", "backend/gradio_iframe/templates", "home/lennard/.virtualenvs/thesis/lib/python3.11/site-packages/gradio_iframe/templates", "backend/gradio_iframe/templates"]
+artifacts = ["/backend/gradio_iframe/templates", "*.pyi", "backend/gradio_iframe/templates", "home/lennard/.virtualenvs/thesis/lib/python3.11/site-packages/gradio_iframe/templates", "backend/gradio_iframe/templates", "backend/gradio_iframe/templates", "backend/gradio_iframe/templates"]
 
 [tool.hatch.build.targets.wheel]
 packages = ["/backend/gradio_iframe"]