storybook 9.0.0-alpha.10 → 9.0.0-alpha.12

package/dist/actions/manager.js

@@ -2,25 +2,25 @@ var He = Object.defineProperty;
 var l = (e, t) => He(e, "name", { value: t, configurable: !0 });
 
 // src/actions/manager.tsx
-import U from "react";
-import { Badge as Kt, Spaced as qt } from "storybook/internal/components";
-import { STORY_CHANGED as Qt } from "storybook/internal/core-events";
-import { addons as Me, types as er, useAddonState as tr, useChannel as rr } from "storybook/manager-api";
+import G from "react";
+import { Badge as Kt } from "storybook/internal/components";
+import { STORY_CHANGED as qt } from "storybook/internal/core-events";
+import { addons as Me, types as Qt, useAddonState as er, useChannel as tr, useStorybookApi as rr } from "storybook/manager-api";
 
 // src/actions/constants.ts
-var ie = "actions", b = "storybook/actions", ce = `${b}/panel`, D = `${b}/action-event`, H = `${b}/action-clear`;
+var ce = "actions", b = "storybook/actions", J = `${b}/panel`, D = `${b}/action-event`, U = `${b}/action-clear`;
 
 // src/actions/containers/ActionLogger/index.tsx
 import $t, { Component as Zt } from "react";
 import { STORY_CHANGED as xe } from "storybook/internal/core-events";
 
 // ../node_modules/dequal/dist/index.mjs
-var Ee = Object.prototype.hasOwnProperty;
-function pe(e, t, r) {
+var pe = Object.prototype.hasOwnProperty;
+function Ee(e, t, r) {
   for (r of e.keys())
     if (L(r, t)) return r;
 }
-l(pe, "find");
+l(Ee, "find");
 function L(e, t) {
   var r, n, o;
   if (e === t) return !0;
@@ -36,14 +36,14 @@ function L(e, t) {
       if (e.size !== t.size)
         return !1;
       for (n of e)
-        if (o = n, o && typeof o == "object" && (o = pe(t, o), !o) || !t.has(o)) return !1;
+        if (o = n, o && typeof o == "object" && (o = Ee(t, o), !o) || !t.has(o)) return !1;
       return !0;
     }
     if (r === Map) {
       if (e.size !== t.size)
         return !1;
       for (n of e)
-        if (o = n[0], o && typeof o == "object" && (o = pe(t, o), !o) || !L(n[1], t.get(o)))
+        if (o = n[0], o && typeof o == "object" && (o = Ee(t, o), !o) || !L(n[1], t.get(o)))
           return !1;
       return !0;
     }
@@ -62,7 +62,7 @@ function L(e, t) {
     if (!r || typeof e == "object") {
       n = 0;
       for (r in e)
-        if (Ee.call(e, r) && ++n && !Ee.call(t, r) || !(r in t) || !L(e[r], t[r])) return !1;
+        if (pe.call(e, r) && ++n && !pe.call(t, r) || !(r in t) || !L(e[r], t[r])) return !1;
       return Object.keys(t).length === n;
     }
   }
@@ -71,47 +71,47 @@ function L(e, t) {
 l(L, "dequal");
 
 // src/actions/components/ActionLogger/index.tsx
-import y, { Fragment as Ht, forwardRef as Vt, useEffect as jt, useRef as kt } from "react";
+import C, { Fragment as Ht, forwardRef as Vt, useEffect as jt, useRef as kt } from "react";
 import { ActionBar as Ft, ScrollArea as Gt } from "storybook/internal/components";
 
 // ../node_modules/react-inspector/dist/index.mjs
-import Y from "react";
+import X from "react";
 import M, { useContext as Ke, useCallback as qe, useLayoutEffect as Qe, useState as et, memo as ge } from "react";
 import { createContext as tt } from "react";
 import R, { Children as rt, memo as nt } from "react";
 import ue, { createContext as ot, useContext as lt, useMemo as at } from "react";
 import B from "react";
-import pt from "react";
+import Et from "react";
 import m from "react";
 import _ from "react";
 import x from "react";
-import V, { useCallback as de, useState as At } from "react";
-import C from "react";
+import H, { useCallback as de, useState as At } from "react";
+import y from "react";
 import h from "react";
-import I, { useCallback as me, useState as Ct } from "react";
+import I, { useCallback as me, useState as yt } from "react";
 import It from "react";
 import u from "react";
-import W from "react";
-var Ve = Object.create, z = Object.defineProperty, je = Object.getOwnPropertyDescriptor, Ae = Object.getOwnPropertyNames, ke = Object.getPrototypeOf,
-Fe = Object.prototype.hasOwnProperty, K = /* @__PURE__ */ l((e, t) => /* @__PURE__ */ l(function() {
+import Y from "react";
+var Ve = Object.create, K = Object.defineProperty, je = Object.getOwnPropertyDescriptor, Ae = Object.getOwnPropertyNames, ke = Object.getPrototypeOf,
+Fe = Object.prototype.hasOwnProperty, q = /* @__PURE__ */ l((e, t) => /* @__PURE__ */ l(function() {
   return t || (0, e[Ae(e)[0]])((t = { exports: {} }).exports, t), t.exports;
 }, "__require"), "__commonJS"), Ge = /* @__PURE__ */ l((e, t) => {
   for (var r in t)
-    z(e, r, { get: t[r], enumerable: !0 });
+    K(e, r, { get: t[r], enumerable: !0 });
 }, "__export"), Je = /* @__PURE__ */ l((e, t, r, n) => {
   if (t && typeof t == "object" || typeof t == "function")
     for (let o of Ae(t))
-      !Fe.call(e, o) && o !== r && z(e, o, { get: /* @__PURE__ */ l(() => t[o], "get"), enumerable: !(n = je(t, o)) || n.enumerable });
+      !Fe.call(e, o) && o !== r && K(e, o, { get: /* @__PURE__ */ l(() => t[o], "get"), enumerable: !(n = je(t, o)) || n.enumerable });
   return e;
-}, "__copyProps"), We = /* @__PURE__ */ l((e, t, r) => (r = e != null ? Ve(ke(e)) : {}, Je(t || !e || !e.__esModule ? z(r, "default", { value: e,
-enumerable: !0 }) : r, e)), "__toESM"), Ye = K({
+}, "__copyProps"), We = /* @__PURE__ */ l((e, t, r) => (r = e != null ? Ve(ke(e)) : {}, Je(t || !e || !e.__esModule ? K(r, "default", { value: e,
+enumerable: !0 }) : r, e)), "__toESM"), Ye = q({
   "node_modules/is-object/index.js"(e, t) {
     "use strict";
     t.exports = /* @__PURE__ */ l(function(n) {
       return typeof n == "object" && n !== null;
     }, "isObject");
   }
-}), Xe = K({
+}), Xe = q({
   "node_modules/is-window/index.js"(e, t) {
     "use strict";
     t.exports = function(r) {
@@ -121,7 +121,7 @@ enumerable: !0 }) : r, e)), "__toESM"), Ye = K({
       return n === n.window;
     };
   }
-}), $e = K({
+}), $e = q({
   "node_modules/is-dom/index.js"(e, t) {
     var r = Ye(), n = Xe();
     function o(a) {
@@ -129,8 +129,8 @@ enumerable: !0 }) : r, e)), "__toESM"), Ye = K({
     }
     l(o, "isNode"), t.exports = o;
   }
-}), F = {};
-Ge(F, {
+}), k = {};
+Ge(k, {
   chromeDark: /* @__PURE__ */ l(() => Ze, "chromeDark"),
   chromeLight: /* @__PURE__ */ l(() => ze, "chromeLight")
 });
@@ -212,7 +212,7 @@ var Ze = {
   TABLE_DATA_BACKGROUND_IMAGE: "linear-gradient(to bottom, white, white 50%, rgb(234, 243, 255) 50%, rgb(234, 243, 255))",
   TABLE_DATA_BACKGROUND_SIZE: "128px 32px"
 }, Ne = tt([{}, () => {
-}]), J = {
+}]), W = {
   WebkitTouchCallout: "none",
   WebkitUserSelect: "none",
   KhtmlUserSelect: "none",
@@ -220,7 +220,7 @@ var Ze = {
   msUserSelect: "none",
   OUserSelect: "none",
   userSelect: "none"
-}, j = /* @__PURE__ */ l((e) => ({
+}, V = /* @__PURE__ */ l((e) => ({
   DOMNodePreview: {
     htmlOpenTag: {
       base: {
@@ -327,7 +327,7 @@ var Ze = {
       whiteSpace: "pre",
       fontSize: e.ARROW_FONT_SIZE,
       marginRight: e.ARROW_MARGIN_RIGHT,
-      ...J
+      ...W
     },
     treeNodeArrow: {
       base: {
@@ -338,7 +338,7 @@ var Ze = {
         ...parseFloat(e.ARROW_ANIMATION_DURATION) > 0 ? {
           transition: `transform ${e.ARROW_ANIMATION_DURATION} ease 0s`
         } : {},
-        ...J
+        ...W
       },
       expanded: {
         WebkitTransform: "rotateZ(90deg)",
@@ -471,21 +471,21 @@ var Ze = {
     marginTop: -7,
     color: e.TABLE_SORT_ICON_COLOR,
     fontSize: 12,
-    ...J
+    ...W
   }
-}), "createTheme"), X = "chromeLight", Ce = ot(j(F[X])), g = /* @__PURE__ */ l((e) => lt(Ce)[e], "useStyles"), q = /* @__PURE__ */ l((e) => /* @__PURE__ */ l(
-({ theme: r = X, ...n }) => {
+}), "createTheme"), $ = "chromeLight", ye = ot(V(k[$])), g = /* @__PURE__ */ l((e) => lt(ye)[e], "useStyles"), Q = /* @__PURE__ */ l((e) => /* @__PURE__ */ l(
+({ theme: r = $, ...n }) => {
   let o = at(() => {
     switch (Object.prototype.toString.call(r)) {
       case "[object String]":
-        return j(F[r]);
+        return V(k[r]);
       case "[object Object]":
-        return j(r);
+        return V(r);
       default:
-        return j(F[X]);
+        return V(k[$]);
     }
   }, [r]);
-  return /* @__PURE__ */ ue.createElement(Ce.Provider, {
+  return /* @__PURE__ */ ue.createElement(ye.Provider, {
     value: o
   }, /* @__PURE__ */ ue.createElement(e, {
     ...n
@@ -498,7 +498,7 @@ var Ze = {
 }, "\u25B6"), "Arrow"), it = nt((e) => {
   e = {
     expanded: !0,
-    nodeRenderer: /* @__PURE__ */ l(({ name: p }) => /* @__PURE__ */ R.createElement("span", null, p), "nodeRenderer"),
+    nodeRenderer: /* @__PURE__ */ l(({ name: E }) => /* @__PURE__ */ R.createElement("span", null, E), "nodeRenderer"),
     onClick: /* @__PURE__ */ l(() => {
     }, "onClick"),
     shouldShowArrow: !1,
@@ -506,7 +506,7 @@ var Ze = {
     ...e
   };
   let { expanded: t, onClick: r, children: n, nodeRenderer: o, title: a, shouldShowArrow: c, shouldShowPlaceholder: s } = e, i = g("TreeNode"),
-  E = o;
+  p = o;
   return /* @__PURE__ */ R.createElement("li", {
     "aria-expanded": t,
     role: "treeitem",
@@ -520,52 +520,52 @@ var Ze = {
     styles: i.treeNodeArrow
   }) : s && /* @__PURE__ */ R.createElement("span", {
     style: i.treeNodePlaceholder
-  }, "\xA0"), /* @__PURE__ */ R.createElement(E, {
+  }, "\xA0"), /* @__PURE__ */ R.createElement(p, {
     ...e
   })), /* @__PURE__ */ R.createElement("ol", {
     role: "group",
     style: i.treeNodeChildNodesContainer
   }, t ? n : void 0));
-}), G = "$", Oe = "*";
-function k(e, t) {
+}), F = "$", Oe = "*";
+function j(e, t) {
   return !t(e).next().done;
 }
-l(k, "hasChildNodes");
-var ct = /* @__PURE__ */ l((e) => Array.from({ length: e }, (t, r) => [G].concat(Array.from({ length: r }, () => "*")).join(".")), "wildcard\
-PathsFromLevel"), Et = /* @__PURE__ */ l((e, t, r, n, o) => {
+l(j, "hasChildNodes");
+var ct = /* @__PURE__ */ l((e) => Array.from({ length: e }, (t, r) => [F].concat(Array.from({ length: r }, () => "*")).join(".")), "wildcard\
+PathsFromLevel"), pt = /* @__PURE__ */ l((e, t, r, n, o) => {
   let a = [].concat(ct(n)).concat(r).filter((s) => typeof s == "string"), c = [];
   return a.forEach((s) => {
-    let i = s.split("."), E = /* @__PURE__ */ l((p, f, A) => {
+    let i = s.split("."), p = /* @__PURE__ */ l((E, f, A) => {
       if (A === i.length) {
         c.push(f);
         return;
       }
       let N = i[A];
       if (A === 0)
-        k(p, t) && (N === G || N === Oe) && E(p, G, A + 1);
+        j(E, t) && (N === F || N === Oe) && p(E, F, A + 1);
       else if (N === Oe)
-        for (let { name: O, data: d } of t(p))
-          k(d, t) && E(d, `${f}.${O}`, A + 1);
+        for (let { name: O, data: d } of t(E))
+          j(d, t) && p(d, `${f}.${O}`, A + 1);
       else {
-        let O = p[N];
-        k(O, t) && E(O, `${f}.${N}`, A + 1);
+        let O = E[N];
+        j(O, t) && p(O, `${f}.${N}`, A + 1);
       }
     }, "populatePaths");
-    E(e, "", 0);
+    p(e, "", 0);
   }), c.reduce((s, i) => (s[i] = !0, s), { ...o });
-}, "getExpandedPaths"), ye = ge((e) => {
-  let { data: t, dataIterator: r, path: n, depth: o, nodeRenderer: a } = e, [c, s] = Ke(Ne), i = k(t, r), E = !!c[n], p = qe(() => i && s((f) => ({
+}, "getExpandedPaths"), Ce = ge((e) => {
+  let { data: t, dataIterator: r, path: n, depth: o, nodeRenderer: a } = e, [c, s] = Ke(Ne), i = j(t, r), p = !!c[n], E = qe(() => i && s((f) => ({
     ...f,
-    [n]: !E
-  })), [i, s, n, E]);
+    [n]: !p
+  })), [i, s, n, p]);
   return /* @__PURE__ */ M.createElement(it, {
-    expanded: E,
-    onClick: p,
+    expanded: p,
+    onClick: E,
     shouldShowArrow: i,
     shouldShowPlaceholder: o > 0,
     nodeRenderer: a,
     ...e
-  }, E ? [...r(t)].map(({ name: f, data: A, ...N }) => /* @__PURE__ */ M.createElement(ye, {
+  }, p ? [...r(t)].map(({ name: f, data: A, ...N }) => /* @__PURE__ */ M.createElement(Ce, {
     name: f,
     data: A,
     depth: o + 1,
@@ -577,26 +577,26 @@ PathsFromLevel"), Et = /* @__PURE__ */ l((e, t, r, n, o) => {
   })) : null);
 }), Re = ge(({ name: e, data: t, dataIterator: r, nodeRenderer: n, expandPaths: o, expandLevel: a }) => {
   let c = g("TreeView"), s = et({}), [, i] = s;
-  return Qe(() => i((E) => Et(t, r, o, a, E)), [t, r, o, a]), /* @__PURE__ */ M.createElement(Ne.Provider, {
+  return Qe(() => i((p) => pt(t, r, o, a, p)), [t, r, o, a]), /* @__PURE__ */ M.createElement(Ne.Provider, {
     value: s
   }, /* @__PURE__ */ M.createElement("ol", {
     role: "tree",
     style: c.treeViewOutline
-  }, /* @__PURE__ */ M.createElement(ye, {
+  }, /* @__PURE__ */ M.createElement(Ce, {
     name: e,
     data: t,
     dataIterator: r,
     depth: 0,
-    path: G,
+    path: F,
     nodeRenderer: n
   })));
-}), Q = /* @__PURE__ */ l(({ name: e, dimmed: t = !1, styles: r = {} }) => {
+}), ee = /* @__PURE__ */ l(({ name: e, dimmed: t = !1, styles: r = {} }) => {
   let n = g("ObjectName"), o = {
     ...n.base,
     ...t ? n.dimmed : {},
     ...r
   };
-  return /* @__PURE__ */ pt.createElement("span", {
+  return /* @__PURE__ */ Et.createElement("span", {
     style: o
   }, e);
 }, "ObjectName"), w = /* @__PURE__ */ l(({ object: e, styles: t }) => {
@@ -645,7 +645,7 @@ PathsFromLevel"), Et = /* @__PURE__ */ l((e, t, r, n, o) => {
       return /* @__PURE__ */ _.createElement("span", null);
   }
 }, "ObjectValue"), be = Object.prototype.hasOwnProperty, ut = Object.prototype.propertyIsEnumerable;
-function $(e, t) {
+function Z(e, t) {
   let r = Object.getOwnPropertyDescriptor(e, t);
   if (r.get)
     try {
@@ -655,12 +655,12 @@ function $(e, t) {
     }
   return e[t];
 }
-l($, "getPropertyValue");
+l(Z, "getPropertyValue");
 function _e(e, t) {
   return e.length === 0 ? [] : e.slice(1).reduce((r, n) => r.concat([t, n]), [e[0]]);
 }
 l(_e, "intersperse");
-var Z = /* @__PURE__ */ l(({ data: e }) => {
+var z = /* @__PURE__ */ l(({ data: e }) => {
   let t = g("ObjectPreview"), r = e;
   if (typeof r != "object" || r === null || r instanceof Date || r instanceof RegExp)
     return /* @__PURE__ */ m.createElement(w, {
@@ -688,10 +688,10 @@ var Z = /* @__PURE__ */ l(({ data: e }) => {
         o.length === n - 1 && Object.keys(r).length > n && (s = /* @__PURE__ */ m.createElement("span", {
           key: "ellipsis"
         }, "\u2026"));
-        let i = $(r, c);
+        let i = Z(r, c);
         if (o.push(/* @__PURE__ */ m.createElement("span", {
           key: c
-        }, /* @__PURE__ */ m.createElement(Q, {
+        }, /* @__PURE__ */ m.createElement(ee, {
           name: c || '""'
         }), ":\xA0", /* @__PURE__ */ m.createElement(w, {
           object: i
@@ -706,18 +706,18 @@ var Z = /* @__PURE__ */ l(({ data: e }) => {
     }, "{", _e(o, ", "), "}"));
   }
 }, "ObjectPreview"), Ot = /* @__PURE__ */ l(({ name: e, data: t }) => typeof e == "string" ? /* @__PURE__ */ B.createElement("span", null, /* @__PURE__ */ B.
-createElement(Q, {
+createElement(ee, {
   name: e
-}), /* @__PURE__ */ B.createElement("span", null, ": "), /* @__PURE__ */ B.createElement(Z, {
+}), /* @__PURE__ */ B.createElement("span", null, ": "), /* @__PURE__ */ B.createElement(z, {
   data: t
-})) : /* @__PURE__ */ B.createElement(Z, {
+})) : /* @__PURE__ */ B.createElement(z, {
   data: t
 }), "ObjectRootLabel"), _t = /* @__PURE__ */ l(({ name: e, data: t, isNonenumerable: r = !1 }) => {
   let n = t;
-  return /* @__PURE__ */ x.createElement("span", null, typeof e == "string" ? /* @__PURE__ */ x.createElement(Q, {
+  return /* @__PURE__ */ x.createElement("span", null, typeof e == "string" ? /* @__PURE__ */ x.createElement(ee, {
     name: e,
     dimmed: r
-  }) : /* @__PURE__ */ x.createElement(Z, {
+  }) : /* @__PURE__ */ x.createElement(z, {
     data: e
   }), /* @__PURE__ */ x.createElement("span", null, ": "), /* @__PURE__ */ x.createElement(w, {
     object: n
@@ -730,10 +730,10 @@ createElement(Q, {
     let c = 0;
     for (let s of n) {
       if (Array.isArray(s) && s.length === 2) {
-        let [i, E] = s;
+        let [i, p] = s;
         yield {
           name: i,
-          data: E
+          data: p
         };
       } else
         yield {
@@ -747,7 +747,7 @@ createElement(Q, {
     t === !0 && !a ? c.sort() : typeof t == "function" && c.sort(t);
     for (let s of c)
       if (ut.call(n, s)) {
-        let i = $(n, s);
+        let i = Z(n, s);
         yield {
           name: s || '""',
           data: i
@@ -755,7 +755,7 @@ createElement(Q, {
       } else if (e) {
         let i;
         try {
-          i = $(n, s);
+          i = Z(n, s);
         } catch {
         }
         i !== void 0 && (yield {
@@ -770,22 +770,22 @@ createElement(Q, {
       isNonenumerable: !0
     });
   }
-}, "objectIterator"), "createIterator"), mt = /* @__PURE__ */ l(({ depth: e, name: t, data: r, isNonenumerable: n }) => e === 0 ? /* @__PURE__ */ Y.
+}, "objectIterator"), "createIterator"), mt = /* @__PURE__ */ l(({ depth: e, name: t, data: r, isNonenumerable: n }) => e === 0 ? /* @__PURE__ */ X.
 createElement(Ot, {
   name: t,
   data: r
-}) : /* @__PURE__ */ Y.createElement(_t, {
+}) : /* @__PURE__ */ X.createElement(_t, {
   name: t,
   data: r,
   isNonenumerable: n
 }), "defaultNodeRenderer"), Tt = /* @__PURE__ */ l(({ showNonenumerable: e = !1, sortObjectKeys: t, nodeRenderer: r, ...n }) => {
   let o = dt(e, t), a = r || mt;
-  return /* @__PURE__ */ Y.createElement(Re, {
+  return /* @__PURE__ */ X.createElement(Re, {
     nodeRenderer: a,
     dataIterator: o,
     ...n
   });
-}, "ObjectInspector"), ft = q(Tt);
+}, "ObjectInspector"), ft = Q(Tt);
 function gt(e) {
   if (typeof e == "object") {
     let t = [];
@@ -806,29 +806,29 @@ function gt(e) {
 l(gt, "getHeaders");
 var Nt = /* @__PURE__ */ l(({ rows: e, columns: t, rowsData: r }) => {
   let n = g("TableInspectorDataContainer"), o = g("TableInspectorLeftBorder");
-  return /* @__PURE__ */ C.createElement("div", {
+  return /* @__PURE__ */ y.createElement("div", {
     style: n.div
-  }, /* @__PURE__ */ C.createElement("table", {
+  }, /* @__PURE__ */ y.createElement("table", {
     style: n.table
-  }, /* @__PURE__ */ C.createElement("colgroup", null), /* @__PURE__ */ C.createElement("tbody", null, e.map((a, c) => /* @__PURE__ */ C.createElement(
+  }, /* @__PURE__ */ y.createElement("colgroup", null), /* @__PURE__ */ y.createElement("tbody", null, e.map((a, c) => /* @__PURE__ */ y.createElement(
   "tr", {
     key: a,
     style: n.tr
-  }, /* @__PURE__ */ C.createElement("td", {
+  }, /* @__PURE__ */ y.createElement("td", {
     style: { ...n.td, ...o.none }
   }, a), t.map((s) => {
     let i = r[c];
-    return typeof i == "object" && i !== null && be.call(i, s) ? /* @__PURE__ */ C.createElement("td", {
+    return typeof i == "object" && i !== null && be.call(i, s) ? /* @__PURE__ */ y.createElement("td", {
       key: s,
       style: { ...n.td, ...o.solid }
-    }, /* @__PURE__ */ C.createElement(w, {
+    }, /* @__PURE__ */ y.createElement(w, {
       object: i[s]
-    })) : /* @__PURE__ */ C.createElement("td", {
+    })) : /* @__PURE__ */ y.createElement("td", {
       key: s,
       style: { ...n.td, ...o.solid }
     });
   }))))));
-}, "DataContainer"), yt = /* @__PURE__ */ l((e) => /* @__PURE__ */ I.createElement("div", {
+}, "DataContainer"), Ct = /* @__PURE__ */ l((e) => /* @__PURE__ */ I.createElement("div", {
   style: {
     position: "absolute",
     top: 1,
@@ -850,7 +850,7 @@ var Nt = /* @__PURE__ */ l(({ rows: e, columns: t, rowsData: r }) => {
   children: o,
   ...a
 }) => {
-  let c = g("TableInspectorTH"), [s, i] = Ct(!1), E = me(() => i(!0), []), p = me(() => i(!1), []);
+  let c = g("TableInspectorTH"), [s, i] = yt(!1), p = me(() => i(!0), []), E = me(() => i(!1), []);
   return /* @__PURE__ */ I.createElement("th", {
     ...a,
     style: {
@@ -858,12 +858,12 @@ var Nt = /* @__PURE__ */ l(({ rows: e, columns: t, rowsData: r }) => {
       ...n,
       ...s ? c.base[":hover"] : {}
     },
-    onMouseEnter: E,
-    onMouseLeave: p,
+    onMouseEnter: p,
+    onMouseLeave: E,
     onClick: r
   }, /* @__PURE__ */ I.createElement("div", {
     style: c.div
-  }, o), t && /* @__PURE__ */ I.createElement(yt, null, /* @__PURE__ */ I.createElement(Rt, {
+  }, o), t && /* @__PURE__ */ I.createElement(Ct, null, /* @__PURE__ */ I.createElement(Rt, {
     sortAscending: e
   })));
 }, "TH"), bt = /* @__PURE__ */ l(({
@@ -876,23 +876,23 @@ var Nt = /* @__PURE__ */ l(({ rows: e, columns: t, rowsData: r }) => {
   onTHClick: c,
   onIndexTHClick: s
 }) => {
-  let i = g("TableInspectorHeaderContainer"), E = g("TableInspectorLeftBorder");
+  let i = g("TableInspectorHeaderContainer"), p = g("TableInspectorLeftBorder");
   return /* @__PURE__ */ h.createElement("div", {
     style: i.base
   }, /* @__PURE__ */ h.createElement("table", {
     style: i.table
   }, /* @__PURE__ */ h.createElement("tbody", null, /* @__PURE__ */ h.createElement("tr", null, /* @__PURE__ */ h.createElement(Te, {
-    borderStyle: E.none,
+    borderStyle: p.none,
     sorted: r && n,
     sortAscending: a,
     onClick: s
-  }, e), t.map((p) => /* @__PURE__ */ h.createElement(Te, {
-    borderStyle: E.solid,
-    key: p,
-    sorted: r && o === p,
+  }, e), t.map((E) => /* @__PURE__ */ h.createElement(Te, {
+    borderStyle: p.solid,
+    key: E,
+    sorted: r && o === E,
     sortAscending: a,
-    onClick: c.bind(null, p)
-  }, p))))));
+    onClick: c.bind(null, E)
+  }, E))))));
 }, "HeaderContainer"), Lt = /* @__PURE__ */ l(({
   data: e,
   columns: t
@@ -909,7 +909,7 @@ var Nt = /* @__PURE__ */ l(({ rows: e, columns: t, rowsData: r }) => {
       sortColumn: void 0,
       sortAscending: O ? !d : !0
     }));
-  }, []), E = de((O) => {
+  }, []), p = de((O) => {
     s(({ sortColumn: d, sortAscending: T }) => ({
       sorted: !0,
       sortIndexColumn: !1,
@@ -918,16 +918,16 @@ var Nt = /* @__PURE__ */ l(({ rows: e, columns: t, rowsData: r }) => {
     }));
   }, []);
   if (typeof e != "object" || e === null)
-    return /* @__PURE__ */ V.createElement("div", null);
-  let { rowHeaders: p, colHeaders: f } = gt(e);
+    return /* @__PURE__ */ H.createElement("div", null);
+  let { rowHeaders: E, colHeaders: f } = gt(e);
   t !== void 0 && (f = t);
-  let A = p.map((O) => e[O]), N;
-  if (a !== void 0 ? N = A.map((O, d) => typeof O == "object" && O !== null ? [O[a], d] : [void 0, d]) : o && (N = p.map((O, d) => [p[d], d])),
+  let A = E.map((O) => e[O]), N;
+  if (a !== void 0 ? N = A.map((O, d) => typeof O == "object" && O !== null ? [O[a], d] : [void 0, d]) : o && (N = E.map((O, d) => [E[d], d])),
   N !== void 0) {
     let O = /* @__PURE__ */ l((T, we) => (Pe, Ue) => {
-      let re = T(Pe), ne = T(Ue), oe = typeof re, le = typeof ne, ae = /* @__PURE__ */ l((v, se) => v < se ? -1 : v > se ? 1 : 0, "lt"), S;
-      if (oe === le)
-        S = ae(re, ne);
+      let ne = T(Pe), oe = T(Ue), le = typeof ne, ae = typeof oe, se = /* @__PURE__ */ l((v, ie) => v < ie ? -1 : v > ie ? 1 : 0, "lt"), S;
+      if (le === ae)
+        S = se(ne, oe);
       else {
         let v = {
           string: 0,
@@ -938,28 +938,28 @@ var Nt = /* @__PURE__ */ l(({ rows: e, columns: t, rowsData: r }) => {
           undefined: 5,
           function: 6
         };
-        S = ae(v[oe], v[le]);
+        S = se(v[le], v[ae]);
       }
       return we || (S = -S), S;
     }, "comparator"), d = N.sort(O((T) => T[0], c)).map((T) => T[1]);
-    p = d.map((T) => p[T]), A = d.map((T) => A[T]);
+    E = d.map((T) => E[T]), A = d.map((T) => A[T]);
   }
-  return /* @__PURE__ */ V.createElement("div", {
+  return /* @__PURE__ */ H.createElement("div", {
     style: r.base
-  }, /* @__PURE__ */ V.createElement(bt, {
+  }, /* @__PURE__ */ H.createElement(bt, {
     columns: f,
     sorted: n,
     sortIndexColumn: o,
     sortColumn: a,
     sortAscending: c,
-    onTHClick: E,
+    onTHClick: p,
     onIndexTHClick: i
-  }), /* @__PURE__ */ V.createElement(Nt, {
-    rows: p,
+  }), /* @__PURE__ */ H.createElement(Nt, {
+    rows: E,
     columns: f,
     rowsData: A
   }));
-}, "TableInspector"), ht = q(Lt), St = 80, Le = /* @__PURE__ */ l((e) => e.childNodes.length === 0 || e.childNodes.length === 1 && e.childNodes[0].
+}, "TableInspector"), ht = Q(Lt), St = 80, Le = /* @__PURE__ */ l((e) => e.childNodes.length === 0 || e.childNodes.length === 1 && e.childNodes[0].
 nodeType === Node.TEXT_NODE && e.textContent.length < St, "shouldInline"), vt = /* @__PURE__ */ l(({ tagName: e, attributes: t, styles: r }) => /* @__PURE__ */ u.
 createElement("span", {
   style: r.base
@@ -1055,14 +1055,14 @@ createElement("span", {
   nodeRenderer: Bt,
   dataIterator: xt,
   ...e
-}), "DOMInspector"), wt = q(Mt), Pt = We($e()), he = /* @__PURE__ */ l(({ table: e = !1, data: t, ...r }) => e ? /* @__PURE__ */ W.createElement(
+}), "DOMInspector"), wt = Q(Mt), Pt = We($e()), he = /* @__PURE__ */ l(({ table: e = !1, data: t, ...r }) => e ? /* @__PURE__ */ Y.createElement(
 ht, {
   data: t,
   ...r
-}) : (0, Pt.default)(t) ? /* @__PURE__ */ W.createElement(wt, {
+}) : (0, Pt.default)(t) ? /* @__PURE__ */ Y.createElement(wt, {
   data: t,
   ...r
-}) : /* @__PURE__ */ W.createElement(ft, {
+}) : /* @__PURE__ */ Y.createElement(ft, {
   data: t,
   ...r
 }), "Inspector");
@@ -1072,8 +1072,8 @@ import { styled as Jt, withTheme as Wt } from "storybook/theming";
 
 // src/actions/components/ActionLogger/style.tsx
 import { opacify as Ut } from "polished";
-import { styled as ee } from "storybook/theming";
-var Ie = ee.div({
+import { styled as te } from "storybook/theming";
+var Ie = te.div({
   display: "flex",
   padding: 0,
   borderLeft: "5px solid transparent",
@@ -1081,7 +1081,7 @@ var Ie = ee.div({
   transition: "all 0.1s",
   alignItems: "flex-start",
   whiteSpace: "pre"
-}), Se = ee.div(({ theme: e }) => ({
+}), Se = te.div(({ theme: e }) => ({
   backgroundColor: Ut(0.5, e.appBorderColor),
   color: e.color.inverseText,
   fontSize: e.typography.size.s1,
@@ -1090,27 +1090,27 @@ var Ie = ee.div({
   padding: "1px 5px",
   borderRadius: 20,
   margin: "2px 0px"
-})), ve = ee.div({
+})), ve = te.div({
   flex: 1,
   padding: "0 0 0 5px"
 });
 
 // src/actions/components/ActionLogger/index.tsx
 var De = Vt(
-  ({ children: e, className: t }, r) => /* @__PURE__ */ y.createElement(Gt, { ref: r, horizontal: !0, vertical: !0, className: t }, e)
+  ({ children: e, className: t }, r) => /* @__PURE__ */ C.createElement(Gt, { ref: r, horizontal: !0, vertical: !0, className: t }, e)
 );
 De.displayName = "UnstyledWrapped";
 var Yt = Jt(De)({
   margin: 0,
   padding: "10px 5px 20px"
-}), Xt = Wt(({ theme: e, ...t }) => /* @__PURE__ */ y.createElement(he, { theme: e.addonActionsTheme || "chromeLight", table: !1, ...t })), Be = /* @__PURE__ */ l(
+}), Xt = Wt(({ theme: e, ...t }) => /* @__PURE__ */ C.createElement(he, { theme: e.addonActionsTheme || "chromeLight", table: !1, ...t })), Be = /* @__PURE__ */ l(
 ({ actions: e, onClear: t }) => {
   let r = kt(null), n = r.current, o = n && n.scrollHeight - n.scrollTop === n.clientHeight;
   return jt(() => {
     o && (r.current.scrollTop = r.current.scrollHeight);
-  }, [o, e.length]), /* @__PURE__ */ y.createElement(Ht, null, /* @__PURE__ */ y.createElement(Yt, { ref: r }, e.map((a) => /* @__PURE__ */ y.
-  createElement(Ie, { key: a.id }, a.count > 1 && /* @__PURE__ */ y.createElement(Se, null, a.count), /* @__PURE__ */ y.createElement(ve, null,
-  /* @__PURE__ */ y.createElement(
+  }, [o, e.length]), /* @__PURE__ */ C.createElement(Ht, null, /* @__PURE__ */ C.createElement(Yt, { ref: r }, e.map((a) => /* @__PURE__ */ C.
+  createElement(Ie, { key: a.id }, a.count > 1 && /* @__PURE__ */ C.createElement(Se, null, a.count), /* @__PURE__ */ C.createElement(ve, null,
+  /* @__PURE__ */ C.createElement(
     Xt,
     {
       sortObjectKeys: !0,
@@ -1118,7 +1118,7 @@ var Yt = Jt(De)({
       name: a.data.name,
       data: a.data.args ?? a.data
     }
-  ))))), /* @__PURE__ */ y.createElement(Ft, { actionItems: [{ title: "Clear", onClick: t }] }));
+  ))))), /* @__PURE__ */ C.createElement(Ft, { actionItems: [{ title: "Clear", onClick: t }] }));
 }, "ActionLogger");
 
 // src/actions/containers/ActionLogger/index.tsx
@@ -1128,7 +1128,7 @@ var zt = /* @__PURE__ */ l((e, t) => {
   } catch {
     return !1;
   }
-}, "safeDeepEqual"), te = class te extends Zt {
+}, "safeDeepEqual"), re = class re extends Zt {
   constructor(r) {
     super(r);
     this.handleStoryChange = /* @__PURE__ */ l(() => {
@@ -1143,7 +1143,7 @@ var zt = /* @__PURE__ */ l((e, t) => {
     }, "addAction");
     this.clearActions = /* @__PURE__ */ l(() => {
       let { api: r } = this.props;
-      r.emit(H), this.setState({ actions: [] });
+      r.emit(U), this.setState({ actions: [] });
     }, "clearActions");
     this.mounted = !1, this.state = { actions: [] };
   }
@@ -1165,32 +1165,31 @@ var zt = /* @__PURE__ */ l((e, t) => {
     return n ? /* @__PURE__ */ $t.createElement(Be, { ...o }) : null;
   }
 };
-l(te, "ActionLogger");
-var P = te;
+l(re, "ActionLogger");
+var P = re;
 
 // src/actions/manager.tsx
 function nr() {
-  let [{ count: e }, t] = tr(b, { count: 0 });
-  return rr({
+  let t = rr().getSelectedPanel(), [{ count: r }, n] = er(b, { count: 0 });
+  return tr({
     [D]: () => {
-      t((n) => ({ ...n, count: n.count + 1 }));
+      n((a) => ({ ...a, count: a.count + 1 }));
     },
-    [Qt]: () => {
-      t((n) => ({ ...n, count: 0 }));
+    [qt]: () => {
+      n((a) => ({ ...a, count: 0 }));
     },
-    [H]: () => {
-      t((n) => ({ ...n, count: 0 }));
+    [U]: () => {
+      n((a) => ({ ...a, count: 0 }));
     }
-  }), /* @__PURE__ */ U.createElement("div", null, /* @__PURE__ */ U.createElement(qt, { col: 1 }, /* @__PURE__ */ U.createElement("span", {
-  style: { display: "inline-block", verticalAlign: "middle" } }, "Actions"), e === 0 ? "" : /* @__PURE__ */ U.createElement(Kt, { status: "n\
-eutral" }, e)));
+  }), /* @__PURE__ */ G.createElement("div", { style: { display: "flex", alignItems: "center", gap: 6 } }, /* @__PURE__ */ G.createElement("\
+span", null, "Actions"), r === 0 ? null : /* @__PURE__ */ G.createElement(Kt, { compact: !0, status: t === J ? "active" : "neutral" }, r));
 }
 l(nr, "Title");
 Me.register(b, (e) => {
-  Me.add(ce, {
+  Me.add(J, {
     title: nr,
-    type: er.PANEL,
-    render: /* @__PURE__ */ l(({ active: t }) => /* @__PURE__ */ U.createElement(P, { api: e, active: !!t }), "render"),
-    paramKey: ie
+    type: Qt.PANEL,
+    render: /* @__PURE__ */ l(({ active: t }) => /* @__PURE__ */ G.createElement(P, { api: e, active: !!t }), "render"),
+    paramKey: ce
   });
 });