storybook 9.0.10 → 9.0.12

package/dist/core-server/presets/common-manager.js

@@ -330,14 +330,14 @@ function ys(e, t, { signal: r, edges: o } = {}) {
     p(), n = void 0, i = null;
   }, "cancel"), f = /* @__PURE__ */ a(() => {
     p(), c();
-  }, "flush"), b = /* @__PURE__ */ a(function(...h) {
+  }, "flush"), h = /* @__PURE__ */ a(function(...b) {
     if (r?.aborted)
       return;
-    n = this, i = h;
+    n = this, i = b;
     let y = d == null;
     g(), s && y && c();
   }, "debounced");
-  return b.schedule = g, b.cancel = m, b.flush = f, r?.addEventListener("abort", m, { once: !0 }), b;
+  return h.schedule = g, h.cancel = m, h.flush = f, r?.addEventListener("abort", m, { once: !0 }), h;
 }
 var xs = V(() => {
   a(ys, "debounce");
@@ -1135,17 +1135,17 @@ Db, Ac, Bb, kc, Mb, Oc, Fb, Ic, Pc = V(() => {
     !mr(e) && e.preventDefault();
   }, "h"), da = Y.memo(function(e) {
     var t = e.onMove, r = e.onKey, o = ua(e, ["onMove", "onKey"]), n = pt(null), i = sa(t), s = sa(r), l = pt(null), c = pt(!1), u = bb(function() {
-      var m = /* @__PURE__ */ a(function(h) {
-        gc(h), (mr(h) ? h.touches.length > 0 : h.buttons > 0) && n.current ? i(mc(n.current, h, l.current)) : b(!1);
+      var m = /* @__PURE__ */ a(function(b) {
+        gc(b), (mr(b) ? b.touches.length > 0 : b.buttons > 0) && n.current ? i(mc(n.current, b, l.current)) : h(!1);
       }, "e"), f = /* @__PURE__ */ a(function() {
-        return b(!1);
+        return h(!1);
       }, "r");
-      function b(h) {
-        var y = c.current, x = la(n.current), v = h ? x.addEventListener : x.removeEventListener;
+      function h(b) {
+        var y = c.current, x = la(n.current), v = b ? x.addEventListener : x.removeEventListener;
         v(y ? "touchmove" : "mousemove", m), v(y ? "touchend" : "mouseup", f);
       }
-      return a(b, "t"), [function(h) {
-        var y = h.nativeEvent, x = n.current;
+      return a(h, "t"), [function(b) {
+        var y = b.nativeEvent, x = n.current;
         if (x && (gc(y), !function(S, w) {
           return w && !mr(S);
         }(y, c.current) && x)) {
@@ -1154,13 +1154,13 @@ Db, Ac, Bb, kc, Mb, Oc, Fb, Ic, Pc = V(() => {
             var v = y.changedTouches || [];
             v.length && (l.current = v[0].identifier);
           }
-          x.focus(), i(mc(x, y, l.current)), b(!0);
+          x.focus(), i(mc(x, y, l.current)), h(!0);
         }
-      }, function(h) {
-        var y = h.which || h.keyCode;
-        y < 37 || y > 40 || (h.preventDefault(), s({ left: y === 39 ? 0.05 : y === 37 ? -0.05 : 0, top: y === 40 ? 0.05 : y === 38 ? -0.05 :
+      }, function(b) {
+        var y = b.which || b.keyCode;
+        y < 37 || y > 40 || (b.preventDefault(), s({ left: y === 39 ? 0.05 : y === 37 ? -0.05 : 0, top: y === 40 ? 0.05 : y === 38 ? -0.05 :
         0 }));
-      }, b];
+      }, h];
     }, [s, i]), d = u[0], g = u[1], p = u[2];
     return vo(function() {
       return p;
@@ -1513,14 +1513,14 @@ var Ie, Vb, zb, $b, Ub, qb, Wb, Gb, Lc, Jb, Kb, Bc, ma, Yb, Xb, Zb, ga, Qb, ey,
     let c = Co(bn(r, 200), [r]), { value: u, realValue: d, updateValue: g, color: p, colorSpace: m, cycleColorSpace: f } = ay(
       t,
       c
-    ), { presets: b, addPreset: h } = iy(i ?? [], p, m), y = ey[m], x = !!l?.table?.readonly;
+    ), { presets: h, addPreset: b } = iy(i ?? [], p, m), y = ey[m], x = !!l?.table?.readonly;
     return /* @__PURE__ */ De.createElement(Vb, { "aria-readonly": x }, /* @__PURE__ */ De.createElement(
       zb,
       {
         startOpen: s,
         trigger: x ? null : void 0,
         closeOnOutsideClick: !0,
-        onVisibleChange: () => p && h(p),
+        onVisibleChange: () => p && b(p),
         tooltip: /* @__PURE__ */ De.createElement($b, null, /* @__PURE__ */ De.createElement(
           y,
           {
@@ -1529,7 +1529,7 @@ var Ie, Vb, zb, $b, Ub, qb, Wb, Gb, Lc, Jb, Kb, Bc, ma, Yb, Xb, Zb, ga, Qb, ey,
             onFocus: o,
             onBlur: n
           }
-        ), b.length > 0 && /* @__PURE__ */ De.createElement(qb, null, b.map((v, S) => /* @__PURE__ */ De.createElement(
+        ), h.length > 0 && /* @__PURE__ */ De.createElement(qb, null, h.map((v, S) => /* @__PURE__ */ De.createElement(
           Dc,
           {
             key: `${v?.value || S}-${S}`,
@@ -1585,9 +1585,9 @@ var Wc = K((qc, ya) => {
             throw m.code = "MODULE_NOT_FOUND", m;
           }
           var f = i[d] = { exports: {} };
-          n[d][0].call(f.exports, function(b) {
-            var h = n[d][1][b];
-            return l(h || b);
+          n[d][0].call(f.exports, function(h) {
+            var b = n[d][1][h];
+            return l(b || h);
           }, f, f.exports, o, n, i, s);
         }
         return i[d].exports;
@@ -1644,22 +1644,22 @@ var Wc = K((qc, ya) => {
         var g = new s(!1), p = [];
         return function(m) {
           var f = /* @__PURE__ */ a(function() {
-            var b = g, h, y, x = arguments.length - 1, v = Array(x + 1), S = !0, w;
+            var h = g, b, y, x = arguments.length - 1, v = Array(x + 1), S = !0, w;
             if ((f.numArgs || f.numArgs === 0) && f.numArgs !== x + 1)
               throw new Error("Memoizerific functions should always be called with the same number of arguments");
             for (w = 0; w < x; w++) {
               if (v[w] = {
-                cacheItem: b,
+                cacheItem: h,
                 arg: arguments[w]
-              }, b.has(arguments[w])) {
-                b = b.get(arguments[w]);
+              }, h.has(arguments[w])) {
+                h = h.get(arguments[w]);
                 continue;
               }
-              S = !1, h = new s(!1), b.set(arguments[w], h), b = h;
+              S = !1, b = new s(!1), h.set(arguments[w], b), h = b;
             }
-            return S && (b.has(arguments[x]) ? y = b.get(arguments[x]) : S = !1), S || (y = m.apply(null, arguments), b.set(arguments[x], y)),
+            return S && (h.has(arguments[x]) ? y = h.get(arguments[x]) : S = !1), S || (y = m.apply(null, arguments), h.set(arguments[x], y)),
             d > 0 && (v[x] = {
-              cacheItem: b,
+              cacheItem: h,
               arg: arguments[x]
             }, S ? l(p, v) : p.push(v), p.length > d && c(p.shift())), f.wasMemoized = S, f.numArgs = x + 1, y;
           }, "memoizerific");
@@ -1667,17 +1667,17 @@ var Wc = K((qc, ya) => {
         };
       };
       function l(d, g) {
-        var p = d.length, m = g.length, f, b, h;
-        for (b = 0; b < p; b++) {
-          for (f = !0, h = 0; h < m; h++)
-            if (!u(d[b][h].arg, g[h].arg)) {
+        var p = d.length, m = g.length, f, h, b;
+        for (h = 0; h < p; h++) {
+          for (f = !0, b = 0; b < m; b++)
+            if (!u(d[h][b].arg, g[b].arg)) {
               f = !1;
               break;
             }
           if (f)
             break;
         }
-        d.push(d.splice(b, 1)[0]);
+        d.push(d.splice(h, 1)[0]);
       }
       a(l, "moveToMostRecentLru");
       function c(d) {
@@ -2577,18 +2577,18 @@ e" : e === 9 ? t = "strike" : 29 < e && e < 38 || e === 39 || 89 < e && e < 98 ?
       E > n && o || (o = !1, e = e.replace(w.pattern, w.sub));
     }
     a(m, "process");
-    var f = [], b = e, h = b.length;
-    e: for (; h > 0; ) {
+    var f = [], h = e, b = h.length;
+    e: for (; b > 0; ) {
       for (var y = 0, x = 0, v = p.length; x < v; y = ++x) {
         var S = p[y];
-        if (m(S, y), e.length !== h) {
-          h = e.length;
+        if (m(S, y), e.length !== b) {
+          b = e.length;
           continue e;
         }
       }
-      if (e.length === h)
+      if (e.length === b)
         break;
-      f.push(0), h = e.length;
+      f.push(0), b = e.length;
     }
     return f;
   }
@@ -3549,10 +3549,10 @@ function jt(e) {
   }
   var p = Af.exec(t.substring(0, 50));
   if (p) {
-    var m = parseInt("" + p[1], 10), f = parseInt("" + p[2], 10) / 100, b = parseInt("" + p[3], 10) / 100, h = "rgb(" + nr(m, f, b) + ")", y = En.
-    exec(h);
+    var m = parseInt("" + p[1], 10), f = parseInt("" + p[2], 10) / 100, h = parseInt("" + p[3], 10) / 100, b = "rgb(" + nr(m, f, h) + ")", y = En.
+    exec(b);
     if (!y)
-      throw new we(4, t, h);
+      throw new we(4, t, b);
     return {
       red: parseInt("" + y[1], 10),
       green: parseInt("" + y[2], 10),
@@ -4518,8 +4518,8 @@ var Im = Ht(Gs)({
   inline: d = !1,
   ...g
 }) => {
-  let [p, m] = Pn(s), { source: f, actionItem: b } = km(n, p, m), [h, y] = Pn(1), x = [c].concat(["sbdocs", "sbdocs-preview", "sb-unstyled"]),
-  v = n ? [b] : [], [S, w] = Pn(
+  let [p, m] = Pn(s), { source: f, actionItem: h } = km(n, p, m), [b, y] = Pn(1), x = [c].concat(["sbdocs", "sbdocs-preview", "sb-unstyled"]),
+  v = n ? [h] : [], [S, w] = Pn(
     l ? [...l] : []
   ), E = [...v, ...S], { window: I } = globalThis, D = Sm(async (z) => {
     let { createCopyToClipboardFunction: W } = await import("storybook/internal/components");
@@ -4555,13 +4555,13 @@ var Im = Ht(Gs)({
       {
         isLoading: e,
         border: !0,
-        zoom: (z) => y(h * z),
+        zoom: (z) => y(b * z),
         resetZoom: () => y(1),
         storyId: Om(o),
         baseUrl: "./iframe.html"
       }
     ),
-    /* @__PURE__ */ je.createElement(kn.Provider, { value: { scale: h } }, /* @__PURE__ */ je.createElement(Pm, { className: "docs-story", onCopyCapture: n &&
+    /* @__PURE__ */ je.createElement(kn.Provider, { value: { scale: b } }, /* @__PURE__ */ je.createElement(Pm, { className: "docs-story", onCopyCapture: n &&
     _ }, /* @__PURE__ */ je.createElement(
       Tm,
       {
@@ -4570,7 +4570,7 @@ var Im = Ht(Gs)({
         layout: u,
         inline: d
       },
-      /* @__PURE__ */ je.createElement(wm.Element, { centered: u === "centered", scale: d ? h : 1 }, Array.isArray(o) ? o.map((z, W) => /* @__PURE__ */ je.
+      /* @__PURE__ */ je.createElement(wm.Element, { centered: u === "centered", scale: d ? b : 1 }, Array.isArray(o) ? o.map((z, W) => /* @__PURE__ */ je.
       createElement("div", { key: W }, z)) : /* @__PURE__ */ je.createElement("div", null, o))
     ), /* @__PURE__ */ je.createElement(Cm, { actionItems: E }))),
     n && p && f
@@ -4886,15 +4886,15 @@ function Qs(e, t) {
     let u = r ? +s[2] : void 0, d = s[0].replace(jm, `
 `).match(n), g = !1;
     return { items: d.map(function(p, m) {
-      let f = i.exec(p)[0].length, b = new RegExp("^ {1," + f + "}", "gm"), h = p.replace(b, "").replace(i, ""), y = m === d.length - 1, x = h.
+      let f = i.exec(p)[0].length, h = new RegExp("^ {1," + f + "}", "gm"), b = p.replace(h, "").replace(i, ""), y = m === d.length - 1, x = b.
       indexOf(`
 
 `) !== -1 || y && g;
       g = x;
       let v = c.inline, S = c.list, w;
-      c.list = !0, x ? (c.inline = !1, w = sr(h) + `
+      c.list = !0, x ? (c.inline = !1, w = sr(b) + `
 
-`) : (c.inline = !0, w = sr(h));
+`) : (c.inline = !0, w = sr(b));
       let E = l(w, c);
       return c.inline = v, c.list = S, E;
     }), ordered: r, start: u };
@@ -5047,11 +5047,11 @@ function Mn(e, t, r) {
 a(Mn, "Ve");
 function jg(e = "", t = {}) {
   function r(p, m, ...f) {
-    let b = Mn(t.overrides, `${p}.props`, {});
-    return t.createElement(function(h, y) {
-      let x = Mn(y, h);
-      return x ? typeof x == "function" || typeof x == "object" && "render" in x ? x : Mn(y, `${h}.component`, h) : h;
-    }(p, t.overrides), Tt({}, m, b, { className: Fg(m?.className, b.className) || void 0 }), ...f);
+    let h = Mn(t.overrides, `${p}.props`, {});
+    return t.createElement(function(b, y) {
+      let x = Mn(y, b);
+      return x ? typeof x == "function" || typeof x == "object" && "render" in x ? x : Mn(y, `${b}.component`, b) : b;
+    }(p, t.overrides), Tt({}, m, h, { className: Fg(m?.className, h.className) || void 0 }), ...f);
   }
   a(r, "u");
   function o(p) {
@@ -5063,30 +5063,30 @@ function jg(e = "", t = {}) {
 `, { inline: m }));
     for (; typeof f[f.length - 1] == "string" && !f[f.length - 1].trim(); ) f.pop();
     if (t.wrapper === null) return f;
-    let b = t.wrapper || (m ? "span" : "div"), h;
-    if (f.length > 1 || t.forceWrapper) h = f;
+    let h = t.wrapper || (m ? "span" : "div"), b;
+    if (f.length > 1 || t.forceWrapper) b = f;
     else {
-      if (f.length === 1) return h = f[0], typeof h == "string" ? r("span", { key: "outer" }, h) : h;
-      h = null;
+      if (f.length === 1) return b = f[0], typeof b == "string" ? r("span", { key: "outer" }, b) : b;
+      b = null;
     }
-    return t.createElement(b, { key: "outer" }, h);
+    return t.createElement(h, { key: "outer" }, b);
   }
   a(o, "Z");
   function n(p, m) {
     let f = m.match(Mm);
-    return f ? f.reduce(function(b, h) {
-      let y = h.indexOf("=");
+    return f ? f.reduce(function(h, b) {
+      let y = b.indexOf("=");
       if (y !== -1) {
         let x = function(E) {
           return E.indexOf("-") !== -1 && E.match(Zm) === null && (E = E.replace(og, function(I, D) {
             return D.toUpperCase();
           })), E;
-        }(h.slice(0, y)).trim(), v = function(E) {
+        }(b.slice(0, y)).trim(), v = function(E) {
           let I = E[0];
           return (I === '"' || I === "'") && E.length >= 2 && E[E.length - 1] === I ? E.slice(1, -1) : E;
-        }(h.slice(y + 1).trim()), S = Ys[x] || x;
-        if (S === "ref") return b;
-        let w = b[S] = function(E, I, D, _) {
+        }(b.slice(y + 1).trim()), S = Ys[x] || x;
+        if (S === "ref") return h;
+        let w = h[S] = function(E, I, D, _) {
           return I === "style" ? function(z) {
             let W = [], ee = "", ce = !1, ne = !1, ae = "";
             if (!z) return W;
@@ -5119,20 +5119,20 @@ function jg(e = "", t = {}) {
             return z[W.replace(/(-[a-z])/g, (ce) => ce[1].toUpperCase())] = _(ee, E, W), z;
           }, {}) : Bm.indexOf(I) !== -1 ? _(D, E, I) : (D.match(Qm) && (D = D.slice(1, D.length - 1)), D === "true" || D !== "false" && D);
         }(p, x, v, t.sanitizer);
-        typeof w == "string" && (Fn.test(w) || jn.test(w)) && (b[S] = o(w.trim()));
-      } else h !== "style" && (b[Ys[h] || h] = !0);
-      return b;
+        typeof w == "string" && (Fn.test(w) || jn.test(w)) && (h[S] = o(w.trim()));
+      } else b !== "style" && (h[Ys[b] || b] = !0);
+      return h;
     }, {}) : null;
   }
   a(n, "q"), t.overrides = t.overrides || {}, t.sanitizer = t.sanitizer || Dg, t.slugify = t.slugify || ar, t.namedCodesToUnicode = t.namedCodesToUnicode ?
   Tt({}, Xs, t.namedCodesToUnicode) : Xs, t.createElement = t.createElement || to.createElement;
   let i = [], s = {}, l = { [L.blockQuote]: { match: Xe(ol), order: 1, parse(p, m, f) {
-    let [, b, h] = p[0].replace(Rm, "").match(Hm);
-    return { alert: b, children: m(h, f) };
+    let [, h, b] = p[0].replace(Rm, "").match(Hm);
+    return { alert: h, children: m(b, f) };
   }, render(p, m, f) {
-    let b = { key: f.key };
-    return p.alert && (b.className = "markdown-alert-" + t.slugify(p.alert.toLowerCase(), ar), p.children.unshift({ attrs: {}, children: [{ type: L.
-    text, text: p.alert }], noInnerParse: !0, type: L.htmlBlock, tag: "header" })), r("blockquote", b, m(p.children, f));
+    let h = { key: f.key };
+    return p.alert && (h.className = "markdown-alert-" + t.slugify(p.alert.toLowerCase(), ar), p.children.unshift({ attrs: {}, children: [{ type: L.
+    text, text: p.alert }], noInnerParse: !0, type: L.htmlBlock, tag: "header" })), r("blockquote", h, m(p.children, f));
   } }, [L.breakLine]: { match: ir(Vm), order: 1, parse: Dn, render: /* @__PURE__ */ a((p, m, f) => r("br", { key: f.key }), "render") }, [L.
   breakThematic]: { match: Xe(zm), order: 1, parse: Dn, render: /* @__PURE__ */ a((p, m, f) => r("hr", { key: f.key }), "render") }, [L.codeBlock]: {
   match: Xe(al), order: 0, parse: /* @__PURE__ */ a((p) => ({ lang: void 0, text: sr(p[0].replace(/^ {4}/gm, "")).replace(Zs, "$1") }), "par\
@@ -5149,7 +5149,7 @@ se"), render: /* @__PURE__ */ a((p, m, f) => r("pre", { key: f.key }, r("code",
 rse"), render: /* @__PURE__ */ a((p, m, f) => r(`h${p.level}`, { id: p.id, key: f.key }, m(p.children, f)), "render") }, [L.headingSetext]: {
   match: Xe(ll), order: 0, parse: /* @__PURE__ */ a((p, m, f) => ({ children: eo(m, p[1], f), level: p[2] === "=" ? 1 : 2, type: L.heading }),
   "parse") }, [L.htmlBlock]: { match: ir(Fn), order: 1, parse(p, m, f) {
-    let [, b] = p[3].match(vg), h = new RegExp(`^${b}`, "gm"), y = p[3].replace(h, ""), x = (v = y, Ig.some((D) => D.test(v)) ? Mg : eo);
+    let [, h] = p[3].match(vg), b = new RegExp(`^${h}`, "gm"), y = p[3].replace(b, ""), x = (v = y, Ig.some((D) => D.test(v)) ? Mg : eo);
     var v;
     let S = p[1].toLowerCase(), w = Dm.indexOf(S) !== -1, E = (w ? S : p[1]).trim(), I = { attrs: n(E, p[2]), noInnerParse: w, tag: E };
     return f.inAnchor = f.inAnchor || S === "a", w ? I.text = p[3] : I.children = x(m, y, f), f.inAnchor = !1, I;
@@ -5178,12 +5178,12 @@ e"), render: Bn }, [L.refImage]: { match: lt(ag), order: 0, parse: /* @__PURE__
   ref: p[2] }), "parse"), render: /* @__PURE__ */ a((p, m, f) => s[p.ref] ? r("a", { key: f.key, href: t.sanitizer(s[p.ref].target, "a", "hr\
 ef"), title: s[p.ref].title }, m(p.children, f)) : r("span", { key: f.key }, p.fallbackChildren), "render") }, [L.table]: { match: Xe(pl), order: 1,
   parse: Lg, render(p, m, f) {
-    let b = p;
-    return r("table", { key: f.key }, r("thead", null, r("tr", null, b.header.map(function(h, y) {
-      return r("th", { key: y, style: tl(b, y) }, m(h, f));
-    }))), r("tbody", null, b.cells.map(function(h, y) {
-      return r("tr", { key: y }, h.map(function(x, v) {
-        return r("td", { key: v, style: tl(b, v) }, m(x, f));
+    let h = p;
+    return r("table", { key: f.key }, r("thead", null, r("tr", null, h.header.map(function(b, y) {
+      return r("th", { key: y, style: tl(h, y) }, m(b, f));
+    }))), r("tbody", null, h.cells.map(function(b, y) {
+      return r("tr", { key: y }, b.map(function(x, v) {
+        return r("td", { key: v, style: tl(h, v) }, m(x, f));
       }));
     })));
   } }, [L.text]: { match: ir(yg), order: 4, parse: /* @__PURE__ */ a((p) => ({ text: p[0].replace(Xm, (m, f) => t.namedCodesToUnicode[f] ? t.
@@ -5197,48 +5197,48 @@ ef"), title: s[p.ref].title }, m(p.children, f)) : r("span", { key: f.key }, p.f
   t.disableParsingRawHTML === !0 && (delete l[L.htmlBlock], delete l[L.htmlSelfClosing]);
   let c = function(p) {
     let m = Object.keys(p);
-    function f(b, h) {
+    function f(h, b) {
       let y, x, v = [], S = "", w = "";
-      for (h.prevCapture = h.prevCapture || ""; b; ) {
+      for (b.prevCapture = b.prevCapture || ""; h; ) {
         let E = 0;
         for (; E < m.length; ) {
-          if (S = m[E], y = p[S], h.inline && !y.match.inline) {
+          if (S = m[E], y = p[S], b.inline && !y.match.inline) {
             E++;
             continue;
           }
-          let I = y.match(b, h);
+          let I = y.match(h, b);
           if (I) {
-            w = I[0], h.prevCapture += w, b = b.substring(w.length), x = y.parse(I, f, h), x.type == null && (x.type = S), v.push(x);
+            w = I[0], b.prevCapture += w, h = h.substring(w.length), x = y.parse(I, f, b), x.type == null && (x.type = S), v.push(x);
             break;
           }
           E++;
         }
       }
-      return h.prevCapture = "", v;
+      return b.prevCapture = "", v;
     }
-    return a(f, "n"), m.sort(function(b, h) {
-      let y = p[b].order, x = p[h].order;
-      return y !== x ? y - x : b < h ? -1 : 1;
-    }), function(b, h) {
+    return a(f, "n"), m.sort(function(h, b) {
+      let y = p[h].order, x = p[b].order;
+      return y !== x ? y - x : h < b ? -1 : 1;
+    }), function(h, b) {
       return f(function(y) {
         return y.replace(qm, `
 `).replace(Jm, "").replace(lg, "    ");
-      }(b), h);
+      }(h), b);
     };
   }(l), u = (d = /* @__PURE__ */ function(p, m) {
-    return function(f, b, h) {
+    return function(f, h, b) {
       let y = p[f.type].render;
-      return m ? m(() => y(f, b, h), f, b, h) : y(f, b, h);
+      return m ? m(() => y(f, h, b), f, h, b) : y(f, h, b);
     };
   }(l, t.renderRule), /* @__PURE__ */ a(function p(m, f = {}) {
     if (Array.isArray(m)) {
-      let b = f.key, h = [], y = !1;
+      let h = f.key, b = [], y = !1;
       for (let x = 0; x < m.length; x++) {
         f.key = x;
         let v = p(m[x], f), S = typeof v == "string";
-        S && y ? h[h.length - 1] += v : v !== null && h.push(v), y = S;
+        S && y ? b[b.length - 1] += v : v !== null && b.push(v), y = S;
       }
-      return f.key = b, h;
+      return f.key = h, b;
     }
     return d(m, p, f);
   }, "e"));
@@ -5428,16 +5428,16 @@ var Gg = /* @__PURE__ */ a((e) => {
   let g = /* @__PURE__ */ a((f) => {
     if (!f.target.value)
       return r();
-    let b = Gg(f.target.value), h = new Date(t ?? "");
-    h.setFullYear(b.getFullYear(), b.getMonth(), b.getDate());
-    let y = h.getTime();
+    let h = Gg(f.target.value), b = new Date(t ?? "");
+    b.setFullYear(h.getFullYear(), h.getMonth(), h.getDate());
+    let y = b.getTime();
     y && r(y), l(!!y);
   }, "onDateChange"), p = /* @__PURE__ */ a((f) => {
     if (!f.target.value)
       return r();
-    let b = Jg(f.target.value), h = new Date(t ?? "");
-    h.setHours(b.getHours()), h.setMinutes(b.getMinutes());
-    let y = h.getTime();
+    let h = Jg(f.target.value), b = new Date(t ?? "");
+    b.setHours(h.getHours()), b.setMinutes(h.getMinutes());
+    let y = b.getTime();
     y && r(y), l(!!y);
   }, "onTimeChange"), m = Z(e);
   return /* @__PURE__ */ oo.createElement(Xg, null, /* @__PURE__ */ oo.createElement(
@@ -5492,7 +5492,7 @@ var rh = Ol(eh.Input)(({ readOnly: e }) => ({
   onFocus: l,
   argType: c
 }) => {
-  let [u, d] = zn(typeof t == "number" ? t : ""), [g, p] = zn(!1), [m, f] = zn(null), b = !!c?.table?.readonly, h = Al(
+  let [u, d] = zn(typeof t == "number" ? t : ""), [g, p] = zn(!1), [m, f] = zn(null), h = !!c?.table?.readonly, b = Al(
     (v) => {
       d(v.target.value);
       let S = parseFloat(v.target.value);
@@ -5514,7 +5514,7 @@ var rh = Ol(eh.Input)(({ readOnly: e }) => ({
       size: "medium",
       id: ct(e),
       onClick: y,
-      disabled: b
+      disabled: h
     },
     "Set number"
   ) : /* @__PURE__ */ Vn.createElement(th, null, /* @__PURE__ */ Vn.createElement(
@@ -5523,13 +5523,13 @@ var rh = Ol(eh.Input)(({ readOnly: e }) => ({
       ref: x,
       id: Z(e),
       type: "number",
-      onChange: h,
+      onChange: b,
       size: "flex",
       placeholder: "Edit number...",
       value: u,
       valid: m ? "error" : void 0,
       autoFocus: g,
-      readOnly: b,
+      readOnly: h,
       name: e,
       min: o,
       max: n,
@@ -6040,8 +6040,8 @@ jt-collapsed-text", style: g, onClick: this.handleCollapseMode }, "[...] ", r.le
       dataType: p,
       addButtonElement: m,
       cancelButtonElement: f,
-      editButtonElement: b,
-      inputElementGenerator: h,
+      editButtonElement: h,
+      inputElementGenerator: b,
       textareaElementGenerator: y,
       minusMenuElement: x,
       plusMenuElement: v,
@@ -6078,8 +6078,8 @@ rejt-not-collapsed-delimiter", style: W }, "["), !i && ae, /* @__PURE__ */ O.cre
         getStyle: g,
         addButtonElement: m,
         cancelButtonElement: f,
-        editButtonElement: b,
-        inputElementGenerator: h,
+        editButtonElement: h,
+        inputElementGenerator: b,
         textareaElementGenerator: y,
         minusMenuElement: x,
         plusMenuElement: v,
@@ -6097,7 +6097,7 @@ rejt-not-collapsed-delimiter", style: W }, "["), !i && ae, /* @__PURE__ */ O.cre
         onlyValue: !0,
         addButtonElement: m,
         cancelButtonElement: f,
-        inputElementGenerator: h,
+        inputElementGenerator: b,
         keyPath: o,
         deep: n,
         onSubmitValueParser: D
@@ -6188,12 +6188,12 @@ var Xn = class Xn extends Ut {
       cancelButtonElement: p,
       textareaElementGenerator: m,
       minusMenuElement: f,
-      keyPath: b
-    } = this.props, h = d(t, l, n, i, u), y = null, x = null, v = c(t, l, n, i, u);
+      keyPath: h
+    } = this.props, b = d(t, l, n, i, u), y = null, x = null, v = c(t, l, n, i, u);
     if (o && !v) {
       let S = m(
         co,
-        b,
+        h,
         i,
         t,
         l,
@@ -6206,13 +6206,13 @@ var Xn = class Xn extends Ut {
         ref: this.refInput,
         defaultValue: l
       });
-      y = /* @__PURE__ */ O.createElement("span", { className: "rejt-edit-form", style: h.editForm }, I, " ", E, w), x = null;
+      y = /* @__PURE__ */ O.createElement("span", { className: "rejt-edit-form", style: b.editForm }, I, " ", E, w), x = null;
     } else {
       y = /* @__PURE__ */ O.createElement(
         "span",
         {
           className: "rejt-value",
-          style: h.value,
+          style: b.value,
           onClick: v ? void 0 : this.handleEditMode
         },
         r
@@ -6220,12 +6220,12 @@ var Xn = class Xn extends Ut {
       let S = f && ie(f, {
         onClick: s,
         className: "rejt-minus-menu",
-        style: h.minus
+        style: b.minus
       });
       x = v ? null : S;
     }
-    return /* @__PURE__ */ O.createElement("li", { className: "rejt-function-value-node", style: h.li }, /* @__PURE__ */ O.createElement("sp\
-an", { className: "rejt-name", style: h.name }, t, " :", " "), y, x);
+    return /* @__PURE__ */ O.createElement("li", { className: "rejt-function-value-node", style: b.li }, /* @__PURE__ */ O.createElement("sp\
+an", { className: "rejt-name", style: b.name }, t, " :", " "), y, x);
   }
 };
 a(Xn, "JsonFunctionValue");
@@ -6263,8 +6263,8 @@ var Zn = class Zn extends Ut {
       addButtonElement: p,
       cancelButtonElement: m,
       editButtonElement: f,
-      inputElementGenerator: b,
-      textareaElementGenerator: h,
+      inputElementGenerator: h,
+      textareaElementGenerator: b,
       minusMenuElement: y,
       plusMenuElement: x,
       beforeRemoveAction: v,
@@ -6292,8 +6292,8 @@ var Zn = class Zn extends Ut {
             addButtonElement: p,
             cancelButtonElement: m,
             editButtonElement: f,
-            inputElementGenerator: b,
-            textareaElementGenerator: h,
+            inputElementGenerator: h,
+            textareaElementGenerator: b,
             minusMenuElement: y,
             plusMenuElement: x,
             beforeRemoveAction: v,
@@ -6321,8 +6321,8 @@ var Zn = class Zn extends Ut {
             addButtonElement: p,
             cancelButtonElement: m,
             editButtonElement: f,
-            inputElementGenerator: b,
-            textareaElementGenerator: h,
+            inputElementGenerator: h,
+            textareaElementGenerator: b,
             minusMenuElement: y,
             plusMenuElement: x,
             beforeRemoveAction: v,
@@ -6350,8 +6350,8 @@ var Zn = class Zn extends Ut {
             addButtonElement: p,
             cancelButtonElement: m,
             editButtonElement: f,
-            inputElementGenerator: b,
-            textareaElementGenerator: h,
+            inputElementGenerator: h,
+            textareaElementGenerator: b,
             minusMenuElement: y,
             plusMenuElement: x,
             beforeRemoveAction: v,
@@ -6377,7 +6377,7 @@ var Zn = class Zn extends Ut {
             getStyle: g,
             cancelButtonElement: m,
             editButtonElement: f,
-            inputElementGenerator: b,
+            inputElementGenerator: h,
             minusMenuElement: y,
             logger: E,
             onSubmitValueParser: I
@@ -6399,7 +6399,7 @@ var Zn = class Zn extends Ut {
             getStyle: g,
             cancelButtonElement: m,
             editButtonElement: f,
-            inputElementGenerator: b,
+            inputElementGenerator: h,
             minusMenuElement: y,
             logger: E,
             onSubmitValueParser: I
@@ -6421,7 +6421,7 @@ var Zn = class Zn extends Ut {
             getStyle: g,
             cancelButtonElement: m,
             editButtonElement: f,
-            inputElementGenerator: b,
+            inputElementGenerator: h,
             minusMenuElement: y,
             logger: E,
             onSubmitValueParser: I
@@ -6443,7 +6443,7 @@ var Zn = class Zn extends Ut {
             getStyle: g,
             cancelButtonElement: m,
             editButtonElement: f,
-            inputElementGenerator: b,
+            inputElementGenerator: h,
             minusMenuElement: y,
             logger: E,
             onSubmitValueParser: I
@@ -6465,7 +6465,7 @@ var Zn = class Zn extends Ut {
             getStyle: g,
             cancelButtonElement: m,
             editButtonElement: f,
-            inputElementGenerator: b,
+            inputElementGenerator: h,
             minusMenuElement: y,
             logger: E,
             onSubmitValueParser: I
@@ -6487,7 +6487,7 @@ var Zn = class Zn extends Ut {
             getStyle: g,
             cancelButtonElement: m,
             editButtonElement: f,
-            inputElementGenerator: b,
+            inputElementGenerator: h,
             minusMenuElement: y,
             logger: E,
             onSubmitValueParser: I
@@ -6509,7 +6509,7 @@ var Zn = class Zn extends Ut {
             getStyle: g,
             cancelButtonElement: m,
             editButtonElement: f,
-            textareaElementGenerator: h,
+            textareaElementGenerator: b,
             minusMenuElement: y,
             logger: E,
             onSubmitValueParser: I
@@ -6531,7 +6531,7 @@ var Zn = class Zn extends Ut {
             getStyle: g,
             cancelButtonElement: m,
             editButtonElement: f,
-            inputElementGenerator: b,
+            inputElementGenerator: h,
             minusMenuElement: y,
             logger: E,
             onSubmitValueParser: I
@@ -6663,8 +6663,8 @@ jt-collapsed-text", style: g, onClick: this.handleCollapseMode }, "{...}", " ",
       dataType: p,
       addButtonElement: m,
       cancelButtonElement: f,
-      editButtonElement: b,
-      inputElementGenerator: h,
+      editButtonElement: h,
+      inputElementGenerator: b,
       textareaElementGenerator: y,
       minusMenuElement: x,
       plusMenuElement: v,
@@ -6699,8 +6699,8 @@ jt-collapsed-text", style: g, onClick: this.handleCollapseMode }, "{...}", " ",
         getStyle: g,
         addButtonElement: m,
         cancelButtonElement: f,
-        editButtonElement: b,
-        inputElementGenerator: h,
+        editButtonElement: h,
+        inputElementGenerator: b,
         textareaElementGenerator: y,
         minusMenuElement: x,
         plusMenuElement: v,
@@ -6720,7 +6720,7 @@ rejt-not-collapsed-delimiter", style: ce }, "{"), !ae && B, /* @__PURE__ */ O.cr
         handleCancel: this.handleAddValueCancel,
         addButtonElement: m,
         cancelButtonElement: f,
-        inputElementGenerator: h,
+        inputElementGenerator: b,
         keyPath: o,
         deep: n,
         onSubmitValueParser: D
@@ -6811,10 +6811,10 @@ var ea = class ea extends Ut {
       cancelButtonElement: p,
       inputElementGenerator: m,
       minusMenuElement: f,
-      keyPath: b
-    } = this.props, h = d(t, l, n, i, u), y = c(t, l, n, i, u), x = o && !y, v = m(
+      keyPath: h
+    } = this.props, b = d(t, l, n, i, u), y = c(t, l, n, i, u), x = o && !y, v = m(
       co,
-      b,
+      h,
       i,
       t,
       l,
@@ -6829,15 +6829,15 @@ var ea = class ea extends Ut {
     }), I = f && ie(f, {
       onClick: s,
       className: "rejt-minus-menu",
-      style: h.minus
+      style: b.minus
     });
-    return /* @__PURE__ */ O.createElement("li", { className: "rejt-value-node", style: h.li }, /* @__PURE__ */ O.createElement("span", { className: "\
-rejt-name", style: h.name }, t, " : "), x ? /* @__PURE__ */ O.createElement("span", { className: "rejt-edit-form", style: h.editForm }, E, "\
+    return /* @__PURE__ */ O.createElement("li", { className: "rejt-value-node", style: b.li }, /* @__PURE__ */ O.createElement("span", { className: "\
+rejt-name", style: b.name }, t, " : "), x ? /* @__PURE__ */ O.createElement("span", { className: "rejt-edit-form", style: b.editForm }, E, "\
  ", w, S) : /* @__PURE__ */ O.createElement(
       "span",
       {
         className: "rejt-value",
-        style: h.value,
+        style: b.value,
         onClick: y ? void 0 : this.handleEditMode
       },
       String(r)
@@ -6961,8 +6961,8 @@ var ta = class ta extends Sh {
       minusMenuElement: p,
       plusMenuElement: m,
       beforeRemoveAction: f,
-      beforeAddAction: b,
-      beforeUpdateAction: h,
+      beforeAddAction: h,
+      beforeUpdateAction: b,
       logger: y,
       onSubmitValueParser: x,
       fallback: v = null
@@ -6993,8 +6993,8 @@ var ta = class ta extends Sh {
         plusMenuElement: m,
         handleRemove: this.removeRoot,
         beforeRemoveAction: f,
-        beforeAddAction: b,
-        beforeUpdateAction: h,
+        beforeAddAction: h,
+        beforeUpdateAction: b,
         logger: y ?? {},
         onSubmitValueParser: x ?? ((D) => D)
       }
@@ -7251,17 +7251,17 @@ ejt-not-collapsed, .rejt-array-node:hover > .rejt-not-collapsed": {
       }
     },
     [r]
-  ), [m, f] = ra(!1), b = Ql(() => {
+  ), [m, f] = ra(!1), h = Ql(() => {
     r({}), f(!0);
-  }, [f]), h = Th(null);
+  }, [f]), b = Th(null);
   if (Ch(() => {
-    m && h.current && h.current.select();
+    m && b.current && b.current.select();
   }, [m]), !s)
-    return /* @__PURE__ */ be.createElement(Ah, { disabled: g, id: ct(e), onClick: b }, "Set object");
+    return /* @__PURE__ */ be.createElement(Ah, { disabled: g, id: ct(e), onClick: h }, "Set object");
   let y = /* @__PURE__ */ be.createElement(
     Rh,
     {
-      ref: h,
+      ref: b,
       id: Z(e),
       name: e,
       defaultValue: t === null ? "" : JSON.stringify(t, null, 2),
@@ -7623,12 +7623,12 @@ updateArgs: r, isHovered: o }) => {
     s || u({ value: t });
   }, [s, t]);
   let d = ba(
-    (b) => (u({ value: b }), r({ [n]: b }), b),
+    (h) => (u({ value: h }), r({ [n]: h }), h),
     [r, n]
   ), g = ba(() => l(!1), []), p = ba(() => l(!0), []);
   if (!i || i.disable) {
-    let b = i?.disable !== !0 && e?.type?.name !== "function";
-    return o && b ? /* @__PURE__ */ hr.createElement(dy, { href: "https://storybook.js.org/docs/essentials/controls", target: "_blank", withArrow: !0 },
+    let h = i?.disable !== !0 && e?.type?.name !== "function";
+    return o && h ? /* @__PURE__ */ hr.createElement(dy, { href: "https://storybook.js.org/docs/essentials/controls", target: "_blank", withArrow: !0 },
     "Setup controls") : /* @__PURE__ */ hr.createElement(zc, null);
   }
   let m = { name: n, argType: e, value: c.value, onChange: d, onBlur: g, onFocus: p }, f = fy[i.type] || zc;
@@ -8266,9 +8266,9 @@ redFirst"),
   ), p = g.ungrouped.length === 0, m = Object.entries(g.sections).length === 0, f = Object.entries(g.ungroupedSubsections).length === 0;
   if (p && m && f)
     return /* @__PURE__ */ G.createElement(rp, { inAddonPanel: n });
-  let b = 1;
-  t && (b += 1), o || (b += 2);
-  let h = Object.keys(g.sections).length > 0, y = { updateArgs: t, compact: o, inAddonPanel: n, initialExpandedArgs: i };
+  let h = 1;
+  t && (h += 1), o || (h += 2);
+  let b = Object.keys(g.sections).length > 0, y = { updateArgs: t, compact: o, inAddonPanel: n, initialExpandedArgs: i };
   return /* @__PURE__ */ G.createElement(a0, null, /* @__PURE__ */ G.createElement(c0, { compact: o, inAddonPanel: n, className: "docblock-a\
 rgstable sb-unstyled" }, /* @__PURE__ */ G.createElement("thead", { className: "docblock-argstable-head" }, /* @__PURE__ */ G.createElement(
   "tr", null, /* @__PURE__ */ G.createElement("th", null, /* @__PURE__ */ G.createElement("span", null, "Name")), o ? null : /* @__PURE__ */ G.
@@ -8277,17 +8277,17 @@ rgstable sb-unstyled" }, /* @__PURE__ */ G.createElement("thead", { className: "
   u0, null, "Control", " ", !l && r && /* @__PURE__ */ G.createElement(p0, { onClick: () => r(), title: "Reset controls" }, /* @__PURE__ */ G.
   createElement(l0, { "aria-hidden": !0 })))) : null)), /* @__PURE__ */ G.createElement("tbody", { className: "docblock-argstable-body" }, g.
   ungrouped.map((x) => /* @__PURE__ */ G.createElement(br, { key: x.key, row: x, arg: u && u[x.key], ...y })), Object.entries(g.ungroupedSubsections).
-  map(([x, v]) => /* @__PURE__ */ G.createElement(Ao, { key: x, label: x, level: "subsection", colSpan: b }, v.map((S) => /* @__PURE__ */ G.
+  map(([x, v]) => /* @__PURE__ */ G.createElement(Ao, { key: x, label: x, level: "subsection", colSpan: h }, v.map((S) => /* @__PURE__ */ G.
   createElement(
     br,
     {
       key: S.key,
       row: S,
       arg: u && u[S.key],
-      expandable: h,
+      expandable: b,
       ...y
     }
-  )))), Object.entries(g.sections).map(([x, v]) => /* @__PURE__ */ G.createElement(Ao, { key: x, label: x, level: "section", colSpan: b }, v.
+  )))), Object.entries(g.sections).map(([x, v]) => /* @__PURE__ */ G.createElement(Ao, { key: x, label: x, level: "section", colSpan: h }, v.
   ungrouped.map((S) => /* @__PURE__ */ G.createElement(br, { key: S.key, row: S, arg: u && u[S.key], ...y })), Object.entries(v.subsections).
   map(([S, w]) => /* @__PURE__ */ G.createElement(
     Ao,
@@ -8295,7 +8295,7 @@ rgstable sb-unstyled" }, /* @__PURE__ */ G.createElement("thead", { className: "
       key: S,
       label: S,
       level: "subsection",
-      colSpan: b
+      colSpan: h
     },
     w.map((E) => /* @__PURE__ */ G.createElement(
       br,
@@ -8303,7 +8303,7 @@ rgstable sb-unstyled" }, /* @__PURE__ */ G.createElement("thead", { className: "
         key: E.key,
         row: E,
         arg: u && u[E.key],
-        expandable: h,
+        expandable: b,
         ...y
       }
     ))
@@ -8388,17 +8388,22 @@ var x0 = sp({
   "&:invalid:not(:placeholder-shown)": {
     boxShadow: `${e.color.negative} 0 0 0 1px inset`
   }
-})), lp = /* @__PURE__ */ a(({ saveStory: e, createStory: t, resetArgs: r }) => {
-  let o = H.useRef(null), [n, i] = H.useState(!1), [s, l] = H.useState(!1), [c, u] = H.useState(""), [d, g] = H.useState(null), p = /* @__PURE__ */ a(
+})), lp = /* @__PURE__ */ a(({
+  saveStory: e,
+  createStory: t,
+  resetArgs: r,
+  portalSelector: o
+}) => {
+  let n = H.useRef(null), [i, s] = H.useState(!1), [l, c] = H.useState(!1), [u, d] = H.useState(""), [g, p] = H.useState(null), m = /* @__PURE__ */ a(
   async () => {
-    n || (i(!0), await e().catch(() => {
-    }), i(!1));
-  }, "onSaveStory"), m = /* @__PURE__ */ a(() => {
-    l(!0), u(""), setTimeout(() => o.current?.focus(), 0);
-  }, "onShowForm"), f = /* @__PURE__ */ a((h) => {
-    let y = h.target.value.replace(/^[^a-z]/i, "").replace(/[^a-z0-9-_ ]/gi, "").replaceAll(/([-_ ]+[a-z0-9])/gi, (x) => x.toUpperCase().replace(
+    i || (s(!0), await e().catch(() => {
+    }), s(!1));
+  }, "onSaveStory"), f = /* @__PURE__ */ a(() => {
+    c(!0), d(""), setTimeout(() => n.current?.focus(), 0);
+  }, "onShowForm"), h = /* @__PURE__ */ a((y) => {
+    let x = y.target.value.replace(/^[^a-z]/i, "").replace(/[^a-z0-9-_ ]/gi, "").replaceAll(/([-_ ]+[a-z0-9])/gi, (v) => v.toUpperCase().replace(
     /[-_ ]/g, ""));
-    u(y.charAt(0).toUpperCase() + y.slice(1));
+    d(x.charAt(0).toUpperCase() + x.slice(1));
   }, "onChange");
   return /* @__PURE__ */ H.createElement(E0, { id: "save-from-controls" }, /* @__PURE__ */ H.createElement(S0, null, /* @__PURE__ */ H.createElement(
   w0, null, /* @__PURE__ */ H.createElement(
@@ -8409,7 +8414,7 @@ var x0 = sp({
       trigger: "hover",
       tooltip: /* @__PURE__ */ H.createElement(Sa, { note: "Save changes to story" })
     },
-    /* @__PURE__ */ H.createElement(Ea, { "aria-label": "Save changes to story", disabled: n, onClick: p }, /* @__PURE__ */ H.createElement(
+    /* @__PURE__ */ H.createElement(Ea, { "aria-label": "Save changes to story", disabled: i, onClick: m }, /* @__PURE__ */ H.createElement(
     b0, null), /* @__PURE__ */ H.createElement(wa, { "data-short-label": "Save" }, "Update story"))
   ), /* @__PURE__ */ H.createElement(
     Ca,
@@ -8419,7 +8424,7 @@ var x0 = sp({
       trigger: "hover",
       tooltip: /* @__PURE__ */ H.createElement(Sa, { note: "Create new story with these settings" })
     },
-    /* @__PURE__ */ H.createElement(Ea, { "aria-label": "Create new story with these settings", onClick: m }, /* @__PURE__ */ H.createElement(
+    /* @__PURE__ */ H.createElement(Ea, { "aria-label": "Create new story with these settings", onClick: f }, /* @__PURE__ */ H.createElement(
     h0, null), /* @__PURE__ */ H.createElement(wa, { "data-short-label": "New" }, "Create new story"))
   ), /* @__PURE__ */ H.createElement(
     Ca,
@@ -8432,28 +8437,37 @@ var x0 = sp({
     /* @__PURE__ */ H.createElement(Ea, { "aria-label": "Reset changes", onClick: () => r() }, /* @__PURE__ */ H.createElement(y0, null), /* @__PURE__ */ H.
     createElement("span", null, "Reset"))
   )), /* @__PURE__ */ H.createElement(C0, null, /* @__PURE__ */ H.createElement(wa, { "data-short-label": "Unsaved changes" }, "You modified\
- this story. Do you want to save your changes?")), /* @__PURE__ */ H.createElement(ft, { width: 350, open: s, onOpenChange: l }, /* @__PURE__ */ H.
-  createElement(ip, { onSubmit: /* @__PURE__ */ a(async (h) => {
-    if (h.preventDefault(), !n)
-      try {
-        g(null), i(!0), await t(c.replace(/^[^a-z]/i, "").replaceAll(/[^a-z0-9]/gi, "")), l(!1), i(!1);
-      } catch (y) {
-        g(y.message), i(!1);
-      }
-  }, "onSubmitForm"), id: "create-new-story-form" }, /* @__PURE__ */ H.createElement(ft.Content, null, /* @__PURE__ */ H.createElement(ft.Header,
-  null, /* @__PURE__ */ H.createElement(ft.Title, null, "Create new story"), /* @__PURE__ */ H.createElement(ft.Description, null, "This wil\
-l add a new story to your existing stories file.")), /* @__PURE__ */ H.createElement(
-    T0,
+ this story. Do you want to save your changes?")), /* @__PURE__ */ H.createElement(
+    ft,
     {
-      onChange: f,
-      placeholder: "Story export name",
-      readOnly: n,
-      ref: o,
-      value: c
-    }
-  ), /* @__PURE__ */ H.createElement(ft.Actions, null, /* @__PURE__ */ H.createElement(ap, { disabled: n || !c, size: "medium", type: "submi\
-t", variant: "solid" }, "Create"), /* @__PURE__ */ H.createElement(ft.Dialog.Close, { asChild: !0 }, /* @__PURE__ */ H.createElement(ap, { disabled: n,
-  size: "medium", type: "reset" }, "Cancel"))))), d && /* @__PURE__ */ H.createElement(ft.Error, null, d))));
+      width: 350,
+      open: l,
+      onOpenChange: c,
+      portalSelector: o
+    },
+    /* @__PURE__ */ H.createElement(ip, { onSubmit: /* @__PURE__ */ a(async (y) => {
+      if (y.preventDefault(), !i)
+        try {
+          p(null), s(!0), await t(u.replace(/^[^a-z]/i, "").replaceAll(/[^a-z0-9]/gi, "")), c(!1), s(!1);
+        } catch (x) {
+          p(x.message), s(!1);
+        }
+    }, "onSubmitForm"), id: "create-new-story-form" }, /* @__PURE__ */ H.createElement(ft.Content, null, /* @__PURE__ */ H.createElement(ft.
+    Header, null, /* @__PURE__ */ H.createElement(ft.Title, null, "Create new story"), /* @__PURE__ */ H.createElement(ft.Description, null,
+    "This will add a new story to your existing stories file.")), /* @__PURE__ */ H.createElement(
+      T0,
+      {
+        onChange: h,
+        placeholder: "Story export name",
+        readOnly: i,
+        ref: n,
+        value: u
+      }
+    ), /* @__PURE__ */ H.createElement(ft.Actions, null, /* @__PURE__ */ H.createElement(ap, { disabled: i || !u, size: "medium", type: "sub\
+mit", variant: "solid" }, "Create"), /* @__PURE__ */ H.createElement(ft.Dialog.Close, { asChild: !0 }, /* @__PURE__ */ H.createElement(ap, {
+    disabled: i, size: "medium", type: "reset" }, "Cancel"))))),
+    g && /* @__PURE__ */ H.createElement(ft.Error, null, g)
+  )));
 }, "SaveStory");
 
 // src/controls/components/ControlsPanel.tsx
@@ -8472,11 +8486,11 @@ var cp = /* @__PURE__ */ a((e) => Object.entries(e).reduce(
     sort: g,
     presetColors: p,
     disableSaveFromUI: m = !1
-  } = _0(Io, {}), { path: f, previewInitialized: b } = D0();
+  } = _0(Io, {}), { path: f, previewInitialized: h } = D0();
   A0(() => {
-    b && o(!1);
-  }, [b]);
-  let h = Object.values(u).some((v) => v?.control), y = Object.entries(u).reduce((v, [S, w]) => {
+    h && o(!1);
+  }, [h]);
+  let b = Object.values(u).some((v) => v?.control), y = Object.entries(u).reduce((v, [S, w]) => {
     let E = w?.control;
     return typeof E != "object" || E?.type !== "color" || E?.presetColors ? v[S] = w : v[S] = { ...w, control: { ...E, presetColors: p } }, v;
   }, {}), x = k0(
@@ -8487,7 +8501,7 @@ var cp = /* @__PURE__ */ a((e) => Object.entries(e).reduce(
     Ln,
     {
       key: f,
-      compact: !d && h,
+      compact: !d && b,
       rows: y,
       args: n,
       globals: c,
@@ -8497,7 +8511,7 @@ var cp = /* @__PURE__ */ a((e) => Object.entries(e).reduce(
       sort: g,
       isLoading: r
     }
-  ), h && x && I0.CONFIG_TYPE === "DEVELOPMENT" && m !== !0 && /* @__PURE__ */ Ta.createElement(lp, { resetArgs: s, saveStory: e, createStory: t }));
+  ), b && x && I0.CONFIG_TYPE === "DEVELOPMENT" && m !== !0 && /* @__PURE__ */ Ta.createElement(lp, { resetArgs: s, saveStory: e, createStory: t }));
 }, "ControlsPanel");
 
 // src/controls/components/Title.tsx
@@ -9102,8 +9116,8 @@ dPathsFromLevel"), xx = /* @__PURE__ */ a((e, t, r, o, n) => {
       if (p === 0)
         Do(d, t) && (m === Mo || m === xp) && u(d, Mo, p + 1);
       else if (m === xp)
-        for (let { name: f, data: b } of t(d))
-          Do(b, t) && u(b, `${g}.${f}`, p + 1);
+        for (let { name: f, data: h } of t(d))
+          Do(h, t) && u(h, `${g}.${f}`, p + 1);
       else {
         let f = d[m];
         Do(f, t) && u(f, `${g}.${m}`, p + 1);
@@ -9461,18 +9475,18 @@ var Px = /* @__PURE__ */ a(({ rows: e, columns: t, rowsData: r }) => {
     sortColumn: void 0,
     sortAscending: !1
   }), c = Ep(() => {
-    l(({ sortIndexColumn: f, sortAscending: b }) => ({
+    l(({ sortIndexColumn: f, sortAscending: h }) => ({
       sorted: !0,
       sortIndexColumn: !0,
       sortColumn: void 0,
-      sortAscending: f ? !b : !0
+      sortAscending: f ? !h : !0
     }));
   }, []), u = Ep((f) => {
-    l(({ sortColumn: b, sortAscending: h }) => ({
+    l(({ sortColumn: h, sortAscending: b }) => ({
       sorted: !0,
       sortIndexColumn: !1,
       sortColumn: f,
-      sortAscending: f === b ? !h : !0
+      sortAscending: f === h ? !b : !0
     }));
   }, []);
   if (typeof e != "object" || e === null)
@@ -9480,10 +9494,10 @@ var Px = /* @__PURE__ */ a(({ rows: e, columns: t, rowsData: r }) => {
   let { rowHeaders: d, colHeaders: g } = Ix(e);
   t !== void 0 && (g = t);
   let p = d.map((f) => e[f]), m;
-  if (i !== void 0 ? m = p.map((f, b) => typeof f == "object" && f !== null ? [f[i], b] : [void 0, b]) : n && (m = d.map((f, b) => [d[b], b])),
+  if (i !== void 0 ? m = p.map((f, h) => typeof f == "object" && f !== null ? [f[i], h] : [void 0, h]) : n && (m = d.map((f, h) => [d[h], h])),
   m !== void 0) {
-    let f = /* @__PURE__ */ a((h, y) => (x, v) => {
-      let S = h(x), w = h(v), E = typeof S, I = typeof w, D = /* @__PURE__ */ a((z, W) => z < W ? -1 : z > W ? 1 : 0, "lt"), _;
+    let f = /* @__PURE__ */ a((b, y) => (x, v) => {
+      let S = b(x), w = b(v), E = typeof S, I = typeof w, D = /* @__PURE__ */ a((z, W) => z < W ? -1 : z > W ? 1 : 0, "lt"), _;
       if (E === I)
         _ = D(S, w);
       else {
@@ -9499,8 +9513,8 @@ var Px = /* @__PURE__ */ a(({ rows: e, columns: t, rowsData: r }) => {
         _ = D(z[E], z[I]);
       }
       return y || (_ = -_), _;
-    }, "comparator"), b = m.sort(f((h) => h[0], s)).map((h) => h[1]);
-    d = b.map((h) => d[h]), p = b.map((h) => p[h]);
+    }, "comparator"), h = m.sort(f((b) => b[0], s)).map((b) => b[1]);
+    d = h.map((b) => d[b]), p = h.map((b) => p[b]);
   }
   return /* @__PURE__ */ No.createElement("div", {
     style: r.base
@@ -10125,9 +10139,9 @@ var Tv = ["theme", "hover", "colorScheme", "children", "label", "className", "on
   kv(() => {
     f(u);
   }, [u]);
-  let b = /* @__PURE__ */ a((T) => {
+  let h = /* @__PURE__ */ a((T) => {
     f(T), l && l(T);
-  }, "updateState"), h = ge.Children.count(n) > 0, y = /* @__PURE__ */ a((T, P) => {
+  }, "updateState"), b = ge.Children.count(n) > 0, y = /* @__PURE__ */ a((T, P) => {
     if (T.isSameNode(P || null)) return;
     let k = T.querySelector('[tabindex="-1"]');
     k?.focus(), T.setAttribute("aria-selected", "true"), P?.removeAttribute("aria-selected");
@@ -10165,8 +10179,8 @@ var Tv = ["theme", "hover", "colorScheme", "children", "label", "className", "on
     y(k[0]);
   }, "moveFocusAdjacent"), I = /* @__PURE__ */ a((T, P) => {
     let k = T.target;
-    (T.key === "Enter" || T.key === " ") && b(!m), T.key === "ArrowRight" && m && !P ? E(k, "down") : T.key === "ArrowRight" && b(!0), T.key ===
-    "ArrowLeft" && (!m || P) ? S(k) : T.key === "ArrowLeft" && b(!1), T.key === "ArrowDown" && E(k, "down"), T.key === "ArrowUp" && E(k, "up"),
+    (T.key === "Enter" || T.key === " ") && h(!m), T.key === "ArrowRight" && m && !P ? E(k, "down") : T.key === "ArrowRight" && h(!0), T.key ===
+    "ArrowLeft" && (!m || P) ? S(k) : T.key === "ArrowLeft" && h(!1), T.key === "ArrowDown" && E(k, "down"), T.key === "ArrowUp" && E(k, "up"),
     T.key === "Home" && w(k, "start"), T.key === "End" && w(k, "end");
   }, "handleKeypress"), D = /* @__PURE__ */ a((T, P) => {
     let k = T.target, $ = x(k, "treeitem"), ze = v(k) || [], Oi = !1;
@@ -10177,7 +10191,7 @@ var Tv = ["theme", "hover", "colorScheme", "children", "label", "className", "on
         break;
       }
     }
-    !Oi && $ && y($), P || b(!m);
+    !Oi && $ && y($), P || h(!m);
   }, "handleClick"), _ = /* @__PURE__ */ a((T) => {
     let P = T.currentTarget;
     !P.contains(document.activeElement) && P.getAttribute("role") === "tree" && P.setAttribute("tabindex", "0");
@@ -10214,7 +10228,7 @@ var Tv = ["theme", "hover", "colorScheme", "children", "label", "className", "on
         hasHover: B
       }
     }, /* @__PURE__ */ ge.createElement(Ar, e)));
-  if (!h)
+  if (!b)
     return /* @__PURE__ */ ge.createElement("li", (0, Jo.default)({
       role: "treeitem",
       className: Ee.item
@@ -10807,14 +10821,14 @@ value: e, style: { color: "#16B242" } }) : /* @__PURE__ */ X.createElement(pE, n
       if (n.startsWith("expect(")) {
         let g = dd(n, 7), p = g ? 7 + g.length : 0, m = g && n.slice(p).match(/\.(to|last|nth)[A-Z]\w+\(/);
         if (m) {
-          let f = p + (m.index ?? 0) + m[0].length, b = dd(n, f);
-          if (b)
+          let f = p + (m.index ?? 0) + m[0].length, h = dd(n, f);
+          if (h)
             return [
               "expect(",
               /* @__PURE__ */ X.createElement(gi, { key: `received_${g}`, value: g }),
               n.slice(p, f),
-              /* @__PURE__ */ X.createElement(hi, { key: `expected_${b}`, value: b }),
-              n.slice(f + b.length),
+              /* @__PURE__ */ X.createElement(hi, { key: `expected_${h}`, value: h }),
+              n.slice(f + h.length),
               /* @__PURE__ */ X.createElement("br", { key: `br${i}` })
             ];
         }
@@ -11276,16 +11290,16 @@ var lS = er.div(({ theme: e }) => ({
     onScrollToEnd: p,
     endRef: m,
     hasResultMismatch: f,
-    browserTestStatus: b
+    browserTestStatus: h
   }) {
-    let h = Qt(), y = i.some((x) => x.id !== ve);
-    return /* @__PURE__ */ Q.createElement(lS, null, f && /* @__PURE__ */ Q.createElement(xd, { browserTestStatus: b }), n.detached && (y ||
+    let b = Qt(), y = i.some((x) => x.id !== ve);
+    return /* @__PURE__ */ Q.createElement(lS, null, f && /* @__PURE__ */ Q.createElement(xd, { browserTestStatus: h }), n.detached && (y ||
     l) && /* @__PURE__ */ Q.createElement(Tu, { storyUrl: t }), (i.length > 0 || l) && /* @__PURE__ */ Q.createElement(
       bd,
       {
         controls: o,
         controlStates: n,
-        status: b,
+        status: h,
         storyFileName: s,
         onScrollToEnd: p
       }
@@ -11309,7 +11323,7 @@ var lS = er.div(({ theme: e }) => ({
       {
         "data-chromatic": "ignore",
         dangerouslySetInnerHTML: {
-          __html: h.toHtml(Cd(c))
+          __html: b.toHtml(Cd(c))
         }
       }
     )), u && /* @__PURE__ */ Q.createElement(vd, null, /* @__PURE__ */ Q.createElement(Ed, null, "Unhandled Errors"), /* @__PURE__ */ Q.createElement(
@@ -11395,8 +11409,8 @@ var en = {
       unhandledErrors: void 0
     }), [c, u] = Ci(void 0), [d, g] = Ci(/* @__PURE__ */ new Set()), [p, m] = Ci(!1), {
       controlStates: f = en,
-      isErrored: b = !1,
-      pausedAt: h = void 0,
+      isErrored: h = !1,
+      pausedAt: b = void 0,
       interactions: y = [],
       isPlaying: x = !1,
       caughtException: v = void 0,
@@ -11558,9 +11572,9 @@ var en = {
         hasException: ne,
         caughtException: v,
         unhandledErrors: S,
-        isErrored: b,
+        isErrored: h,
         isPlaying: x,
-        pausedAt: h,
+        pausedAt: b,
         endRef: D,
         onScrollToEnd: c && ce
       }
@@ -11971,16 +11985,16 @@ var Kd = cn.div({
 // src/viewport/components/Tool.tsx
 var Qd = /* @__PURE__ */ a(({ api: e }) => {
   let t = CC(Br), [r, o, n] = SC(), [i, s] = gC(!1), { options: l = Wd, disable: c } = t || {}, u = r?.[Br] || {}, d = typeof u == "string" ?
-  u : u.value, g = typeof u == "string" ? !1 : u.isRotated, p = l[d] || tr, m = i || p !== tr, f = Br in n, b = Object.keys(l).length;
+  u : u.value, g = typeof u == "string" ? !1 : u.isRotated, p = l[d] || tr, m = i || p !== tr, f = Br in n, h = Object.keys(l).length;
   if (mC(() => {
     Jd(e, d, o, Object.keys(l));
-  }, [l, d, o, e]), p.styles === null || !l || b < 1)
+  }, [l, d, o, e]), p.styles === null || !l || h < 1)
     return null;
   if (typeof p.styles == "function")
     return console.warn(
       "Addon Viewport no longer supports dynamic styles using a function, use css calc() instead"
     ), null;
-  let h = g ? p.styles.height : p.styles.width, y = g ? p.styles.width : p.styles.height;
+  let b = g ? p.styles.height : p.styles.width, y = g ? p.styles.width : p.styles.height;
   return c ? null : /* @__PURE__ */ Se.createElement(
     TC,
     {
@@ -11992,7 +12006,7 @@ var Qd = /* @__PURE__ */ a(({ api: e }) => {
       setIsTooltipVisible: s,
       isLocked: f,
       isActive: m,
-      width: h,
+      width: b,
       height: y
     }
   );
@@ -12030,10 +12044,10 @@ var Qd = /* @__PURE__ */ a(({ api: e }) => {
                 }, "onClick")
               }
             ] : [],
-            ...Object.entries(o).map(([f, b]) => ({
+            ...Object.entries(o).map(([f, h]) => ({
               id: f,
-              title: b.name,
-              icon: Zd[b.type],
+              title: h.name,
+              icon: Zd[h.type],
               active: f === n,
               onClick: /* @__PURE__ */ a(() => {
                 p({ value: f, isRotated: !1 }), m();