storybook 10.0.0-beta.4 → 10.0.0-beta.6

package/dist/manager-api/index.d.ts

@@ -483,6 +483,8 @@ interface API_Shortcuts {
     collapseAll: API_KeyCollection;
     expandAll: API_KeyCollection;
     remount: API_KeyCollection;
+    openInEditor: API_KeyCollection;
+    copyStoryLink: API_KeyCollection;
 }
 type API_Action = keyof API_Shortcuts;
 interface API_AddonShortcut {

package/dist/manager-api/index.js

@@ -15,19 +15,22 @@ import {
 import {
   dequal
 } from "../_browser-chunks/chunk-2DK2T7MP.js";
+import "../_browser-chunks/chunk-G33S6YM3.js";
+import {
+  require_picocolors_browser
+} from "../_browser-chunks/chunk-VUAFL5XK.js";
 import {
   mergeWith,
-  pick
-} from "../_browser-chunks/chunk-YWDKX534.js";
+  pick,
+  toMerged
+} from "../_browser-chunks/chunk-FA42P6MO.js";
 import "../_browser-chunks/chunk-WKCVJYVJ.js";
 import {
-  countBy,
-  mapValues,
-  toMerged
-} from "../_browser-chunks/chunk-E7VLET3C.js";
+  mapValues
+} from "../_browser-chunks/chunk-QK3L5AXO.js";
 import {
   isEqual
-} from "../_browser-chunks/chunk-4QPX7WIQ.js";
+} from "../_browser-chunks/chunk-JJZMHC3A.js";
 import {
   require_memoizerific
 } from "../_browser-chunks/chunk-NVV6MIOE.js";
@@ -41,22 +44,147 @@ import {
   __toESM
 } from "../_browser-chunks/chunk-MM7DTO55.js";
 
-// ../node_modules/picocolors/picocolors.browser.js
-var require_picocolors_browser = __commonJS({
-  "../node_modules/picocolors/picocolors.browser.js"(exports, module) {
-    var x = String;
-    var create2 = /* @__PURE__ */ __name(function() {
-      return { isColorSupported: false, reset: x, bold: x, dim: x, italic: x, underline: x, inverse: x, hidden: x, strikethrough: x, black: x, red: x, green: x, yellow: x, blue: x, magenta: x, cyan: x, white: x, gray: x, bgBlack: x, bgRed: x, bgGreen: x, bgYellow: x, bgBlue: x, bgMagenta: x, bgCyan: x, bgWhite: x, blackBright: x, redBright: x, greenBright: x, yellowBright: x, blueBright: x, magentaBright: x, cyanBright: x, whiteBright: x, bgBlackBright: x, bgRedBright: x, bgGreenBright: x, bgYellowBright: x, bgBlueBright: x, bgMagentaBright: x, bgCyanBright: x, bgWhiteBright: x };
-    }, "create");
-    module.exports = create2();
-    module.exports.createColors = create2;
+// ../node_modules/toggle-selection/index.js
+var require_toggle_selection = __commonJS({
+  "../node_modules/toggle-selection/index.js"(exports, module) {
+    module.exports = function() {
+      var selection = document.getSelection();
+      if (!selection.rangeCount) {
+        return function() {
+        };
+      }
+      var active = document.activeElement;
+      var ranges = [];
+      for (var i = 0; i < selection.rangeCount; i++) {
+        ranges.push(selection.getRangeAt(i));
+      }
+      switch (active.tagName.toUpperCase()) {
+        // .toUpperCase handles XHTML
+        case "INPUT":
+        case "TEXTAREA":
+          active.blur();
+          break;
+        default:
+          active = null;
+          break;
+      }
+      selection.removeAllRanges();
+      return function() {
+        selection.type === "Caret" && selection.removeAllRanges();
+        if (!selection.rangeCount) {
+          ranges.forEach(function(range) {
+            selection.addRange(range);
+          });
+        }
+        active && active.focus();
+      };
+    };
+  }
+});
+
+// ../node_modules/copy-to-clipboard/index.js
+var require_copy_to_clipboard = __commonJS({
+  "../node_modules/copy-to-clipboard/index.js"(exports, module) {
+    "use strict";
+    var deselectCurrent = require_toggle_selection();
+    var clipboardToIE11Formatting = {
+      "text/plain": "Text",
+      "text/html": "Url",
+      "default": "Text"
+    };
+    var defaultMessage = "Copy to clipboard: #{key}, Enter";
+    function format(message) {
+      var copyKey = (/mac os x/i.test(navigator.userAgent) ? "\u2318" : "Ctrl") + "+C";
+      return message.replace(/#{\s*key\s*}/g, copyKey);
+    }
+    __name(format, "format");
+    function copy2(text, options) {
+      var debug, message, reselectPrevious, range, selection, mark, success = false;
+      if (!options) {
+        options = {};
+      }
+      debug = options.debug || false;
+      try {
+        reselectPrevious = deselectCurrent();
+        range = document.createRange();
+        selection = document.getSelection();
+        mark = document.createElement("span");
+        mark.textContent = text;
+        mark.ariaHidden = "true";
+        mark.style.all = "unset";
+        mark.style.position = "fixed";
+        mark.style.top = 0;
+        mark.style.clip = "rect(0, 0, 0, 0)";
+        mark.style.whiteSpace = "pre";
+        mark.style.webkitUserSelect = "text";
+        mark.style.MozUserSelect = "text";
+        mark.style.msUserSelect = "text";
+        mark.style.userSelect = "text";
+        mark.addEventListener("copy", function(e) {
+          e.stopPropagation();
+          if (options.format) {
+            e.preventDefault();
+            if (typeof e.clipboardData === "undefined") {
+              debug && console.warn("unable to use e.clipboardData");
+              debug && console.warn("trying IE specific stuff");
+              window.clipboardData.clearData();
+              var format2 = clipboardToIE11Formatting[options.format] || clipboardToIE11Formatting["default"];
+              window.clipboardData.setData(format2, text);
+            } else {
+              e.clipboardData.clearData();
+              e.clipboardData.setData(options.format, text);
+            }
+          }
+          if (options.onCopy) {
+            e.preventDefault();
+            options.onCopy(e.clipboardData);
+          }
+        });
+        document.body.appendChild(mark);
+        range.selectNodeContents(mark);
+        selection.addRange(range);
+        var successful = document.execCommand("copy");
+        if (!successful) {
+          throw new Error("copy command was unsuccessful");
+        }
+        success = true;
+      } catch (err) {
+        debug && console.error("unable to copy using execCommand: ", err);
+        debug && console.warn("trying IE specific stuff");
+        try {
+          window.clipboardData.setData(options.format || "text", text);
+          options.onCopy && options.onCopy(window.clipboardData);
+          success = true;
+        } catch (err2) {
+          debug && console.error("unable to copy using clipboardData: ", err2);
+          debug && console.error("falling back to prompt");
+          message = format("message" in options ? options.message : defaultMessage);
+          window.prompt(message, text);
+        }
+      } finally {
+        if (selection) {
+          if (typeof selection.removeRange == "function") {
+            selection.removeRange(range);
+          } else {
+            selection.removeAllRanges();
+          }
+        }
+        if (mark) {
+          document.body.removeChild(mark);
+        }
+        reselectPrevious();
+      }
+      return success;
+    }
+    __name(copy2, "copy");
+    module.exports = copy2;
   }
 });
 
 // ../node_modules/store2/dist/store2.js
 var require_store2 = __commonJS({
   "../node_modules/store2/dist/store2.js"(exports, module) {
-    (function(window, define) {
+    (function(window2, define) {
       var _ = {
         version: "2.14.4",
         areas: {},
@@ -383,17 +511,17 @@ var require_store2 = __commonJS({
       } else if (typeof module !== "undefined" && module.exports) {
         module.exports = store2;
       } else {
-        if (window.store) {
-          _.conflict = window.store;
+        if (window2.store) {
+          _.conflict = window2.store;
         }
-        window.store = store2;
+        window2.store = store2;
       }
     })(exports, exports && exports.define);
   }
 });
 
 // src/manager-api/root.tsx
-import React3, {
+import React4, {
   Component,
   Fragment,
   useCallback as useCallback2,
@@ -683,6 +811,18 @@ import { global as global2 } from "@storybook/global";
 // src/manager-api/lib/stories.ts
 import { sanitize } from "storybook/internal/csf";
 
+// ../node_modules/es-toolkit/dist/array/countBy.mjs
+function countBy(arr, mapper) {
+  const result = {};
+  for (let i = 0; i < arr.length; i++) {
+    const item = arr[i];
+    const key = mapper(item);
+    result[key] = (result[key] ?? 0) + 1;
+  }
+  return result;
+}
+__name(countBy, "countBy");
+
 // ../node_modules/es-toolkit/dist/array/partition.mjs
 function partition(arr, isInTruthy) {
   const truthy = [];
@@ -940,6 +1080,9 @@ var transformStoryIndexToStoriesHash = /* @__PURE__ */ __name((input, { provider
         return currentTags === null ? child.tags : intersect_default(currentTags, child.tags);
       }, null);
     }
+    if (item.type === "component") {
+      item.importPath = acc[item.children[0]].importPath;
+    }
     return acc;
   }
   __name(addItem, "addItem");
@@ -1323,7 +1466,7 @@ __export(layout_exports, {
 import { SET_CONFIG as SET_CONFIG2 } from "storybook/internal/core-events";
 import { global as global3 } from "@storybook/global";
 import { create } from "storybook/theming/create";
-var { document } = global3;
+var { document: document2 } = global3;
 var isFunction = /* @__PURE__ */ __name((val) => typeof val === "function", "isFunction");
 var ActiveTabs = {
   SIDEBAR: "sidebar",
@@ -1517,7 +1660,7 @@ var init5 = /* @__PURE__ */ __name(({ store: store2, provider, singleStory }) =>
       if (!elementId) {
         return;
       }
-      const element = document.getElementById(elementId);
+      const element = document2.getElementById(elementId);
       if (element) {
         element.focus();
         if (select) {
@@ -1652,15 +1795,68 @@ var init6 = /* @__PURE__ */ __name(({ store: store2 }) => {
     }, "clearNotification")
   };
   const state = { notifications: [] };
-  return { api, state };
+  return {
+    api,
+    state
+  };
+}, "init");
+
+// src/manager-api/modules/open-in-editor.tsx
+var open_in_editor_exports = {};
+__export(open_in_editor_exports, {
+  init: () => init7
+});
+import React from "react";
+import {
+  OPEN_IN_EDITOR_REQUEST,
+  OPEN_IN_EDITOR_RESPONSE
+} from "storybook/internal/core-events";
+import { FailedIcon } from "@storybook/icons";
+import { color } from "storybook/theming";
+var init7 = /* @__PURE__ */ __name(({ provider, fullAPI }) => {
+  const api = {
+    openInEditor(payload) {
+      return new Promise((resolve) => {
+        const { file, line, column } = payload;
+        const handler = /* @__PURE__ */ __name((res) => {
+          if (res.file === file && res.line === line && res.column === column) {
+            provider.channel?.off(OPEN_IN_EDITOR_RESPONSE, handler);
+            resolve(res);
+          }
+        }, "handler");
+        provider.channel?.on(OPEN_IN_EDITOR_RESPONSE, handler);
+        provider.channel?.emit(OPEN_IN_EDITOR_REQUEST, payload);
+      });
+    }
+  };
+  const state = { notifications: [] };
+  return {
+    api,
+    state,
+    init: /* @__PURE__ */ __name(async () => {
+      provider.channel?.on(OPEN_IN_EDITOR_RESPONSE, (payload) => {
+        if (payload.error !== null) {
+          fullAPI.addNotification({
+            id: "open-in-editor-error",
+            content: {
+              headline: "Failed to open in editor",
+              subHeadline: payload.error || "Check the Storybook process on the command line for more details."
+            },
+            icon: React.createElement(FailedIcon, { color: color.negative }),
+            duration: 8e3
+          });
+        }
+      });
+    }, "init")
+  };
 }, "init");
 
 // src/manager-api/modules/provider.ts
 var provider_exports = {};
 __export(provider_exports, {
-  init: () => init7
+  init: () => init8
 });
-var init7 = /* @__PURE__ */ __name(({ provider, fullAPI }) => {
+var init8 = /* @__PURE__ */ __name(({ provider, fullAPI }) => {
   return {
     api: provider.renderPreview ? { renderPreview: provider.renderPreview } : {},
     state: {},
@@ -1673,9 +1869,9 @@ var init7 = /* @__PURE__ */ __name(({ provider, fullAPI }) => {
 // src/manager-api/modules/settings.ts
 var settings_exports = {};
 __export(settings_exports, {
-  init: () => init8
+  init: () => init9
 });
-var init8 = /* @__PURE__ */ __name(({ store: store2, navigate, fullAPI }) => {
+var init9 = /* @__PURE__ */ __name(({ store: store2, navigate, fullAPI }) => {
   const isSettingsScreenActive = /* @__PURE__ */ __name(() => {
     const { path } = fullAPI.getUrlState();
     return !!(path || "").match(/^\/settings/);
@@ -1717,10 +1913,11 @@ var shortcuts_exports = {};
 __export(shortcuts_exports, {
   controlOrMetaKey: () => controlOrMetaKey2,
   defaultShortcuts: () => defaultShortcuts,
-  init: () => init9,
+  init: () => init10,
   isMacLike: () => isMacLike2,
   keys: () => keys
 });
+var import_copy_to_clipboard = __toESM(require_copy_to_clipboard(), 1);
 import {
   FORCE_REMOUNT,
   PREVIEW_KEYDOWN,
@@ -1731,8 +1928,8 @@ import { global as global5 } from "@storybook/global";
 
 // src/manager-api/lib/shortcut.ts
 import { global as global4 } from "@storybook/global";
-var { navigator } = global4;
-var isMacLike = /* @__PURE__ */ __name(() => navigator && navigator.platform ? !!navigator.platform.match(/(Mac|iPhone|iPod|iPad)/i) : false, "isMacLike");
+var { navigator: navigator2 } = global4;
+var isMacLike = /* @__PURE__ */ __name(() => navigator2 && navigator2.platform ? !!navigator2.platform.match(/(Mac|iPhone|iPod|iPad)/i) : false, "isMacLike");
 var controlOrMetaSymbol = /* @__PURE__ */ __name(() => isMacLike() ? "\u2318" : "ctrl", "controlOrMetaSymbol");
 var controlOrMetaKey = /* @__PURE__ */ __name(() => isMacLike() ? "meta" : "control", "controlOrMetaKey");
 var optionOrAltSymbol = /* @__PURE__ */ __name(() => isMacLike() ? "\u2325" : "alt", "optionOrAltSymbol");
@@ -1754,14 +1951,31 @@ var eventToShortcut = /* @__PURE__ */ __name((e) => {
   if (e.shiftKey) {
     keys2.push("shift");
   }
+  const codeUpper = e.code?.toUpperCase();
+  const codeToCharMap = {
+    MINUS: "-",
+    EQUAL: "=",
+    BRACKETLEFT: "[",
+    BRACKETRIGHT: "]",
+    BACKSLASH: "\\",
+    SEMICOLON: ";",
+    QUOTE: "'",
+    BACKQUOTE: "`",
+    COMMA: ",",
+    PERIOD: ".",
+    SLASH: "/"
+  };
+  const codeChar = codeUpper ? codeUpper.startsWith("KEY") && codeUpper.length === 4 ? codeUpper.replace("KEY", "") : codeUpper.startsWith("DIGIT") ? codeUpper.replace("DIGIT", "") : codeToCharMap[codeUpper] : void 0;
   if (e.key && e.key.length === 1 && e.key !== " ") {
     const key = e.key.toUpperCase();
-    const code = e.code?.toUpperCase().replace("KEY", "").replace("DIGIT", "");
+    const code = codeChar;
     if (code && code.length === 1 && code !== key) {
       keys2.push([key, code]);
     } else {
       keys2.push(key);
     }
+  } else if (e.key === "Dead" && codeChar) {
+    keys2.push(codeChar);
   }
   if (e.key === " ") {
     keys2.push("space");
@@ -1834,15 +2048,15 @@ var keyToSymbol = /* @__PURE__ */ __name((key) => {
   if (key === "ArrowRight") {
     return "\u2192";
   }
-  return key.toUpperCase();
+  return key?.toUpperCase();
 }, "keyToSymbol");
 var shortcutToHumanString = /* @__PURE__ */ __name((shortcut) => {
   return shortcut.map(keyToSymbol).join(" ");
 }, "shortcutToHumanString");
 
 // src/manager-api/modules/shortcuts.ts
-var { navigator: navigator2, document: document2 } = global5;
-var isMacLike2 = /* @__PURE__ */ __name(() => navigator2 && navigator2.platform ? !!navigator2.platform.match(/(Mac|iPhone|iPod|iPad)/i) : false, "isMacLike");
+var { navigator: navigator3, document: document3 } = global5;
+var isMacLike2 = /* @__PURE__ */ __name(() => navigator3 && navigator3.platform ? !!navigator3.platform.match(/(Mac|iPhone|iPod|iPad)/i) : false, "isMacLike");
 var controlOrMetaKey2 = /* @__PURE__ */ __name(() => isMacLike2() ? "meta" : "control", "controlOrMetaKey");
 function keys(o) {
   return Object.keys(o);
@@ -1868,7 +2082,11 @@ var defaultShortcuts = Object.freeze({
   // This one is not customizable
   collapseAll: [controlOrMetaKey2(), "shift", "ArrowUp"],
   expandAll: [controlOrMetaKey2(), "shift", "ArrowDown"],
-  remount: ["alt", "R"]
+  remount: ["alt", "R"],
+  openInEditor: ["alt", "shift", "E"],
+  copyStoryLink: ["alt", "shift", "L"]
+  // TODO: bring this back once we want to add shortcuts for this
+  // copyStoryName: ['alt', 'shift', 'C'],
 });
 var addonsShortcuts = {};
 function shouldSkipShortcut(event) {
@@ -1883,7 +2101,7 @@ function shouldSkipShortcut(event) {
   return false;
 }
 __name(shouldSkipShortcut, "shouldSkipShortcut");
-var init9 = /* @__PURE__ */ __name(({ store: store2, fullAPI, provider }) => {
+var init10 = /* @__PURE__ */ __name(({ store: store2, fullAPI, provider }) => {
   const api = {
     // Getting and setting shortcuts
     getShortcutKeys() {
@@ -1993,7 +2211,7 @@ var init9 = /* @__PURE__ */ __name(({ store: store2, fullAPI, provider }) => {
           break;
         }
         case "focusIframe": {
-          const element = document2.getElementById("storybook-preview-iframe");
+          const element = document3.getElementById("storybook-preview-iframe");
           if (element) {
             try {
               element.contentWindow.focus();
@@ -2074,6 +2292,26 @@ var init9 = /* @__PURE__ */ __name(({ store: store2, fullAPI, provider }) => {
           fullAPI.emit(FORCE_REMOUNT, { storyId });
           break;
         }
+        case "openInEditor": {
+          if (global5.CONFIG_TYPE === "DEVELOPMENT") {
+            fullAPI.openInEditor({
+              file: fullAPI.getCurrentStoryData().importPath
+            });
+          }
+          break;
+        }
+        // TODO: bring this back once we want to add shortcuts for this
+        // case 'copyStoryName': {
+        //   const storyData = fullAPI.getCurrentStoryData();
+        //   if (storyData.type === 'story') {
+        //     copy(storyData.exportName);
+        //   }
+        //   break;
+        // }
+        case "copyStoryLink": {
+          (0, import_copy_to_clipboard.default)(window.location.href);
+          break;
+        }
         default:
           addonsShortcuts[feature].action();
           break;
@@ -2089,7 +2327,7 @@ var init9 = /* @__PURE__ */ __name(({ store: store2, fullAPI, provider }) => {
     )
   };
   const initModule = /* @__PURE__ */ __name(() => {
-    document2.addEventListener("keydown", (event) => {
+    document3.addEventListener("keydown", (event) => {
       if (!shouldSkipShortcut(event)) {
         api.handleKeydownEvent(event);
       }
@@ -2104,7 +2342,7 @@ var init9 = /* @__PURE__ */ __name(({ store: store2, fullAPI, provider }) => {
 // src/manager-api/modules/stories.ts
 var stories_exports = {};
 __export(stories_exports, {
-  init: () => init10
+  init: () => init11
 });
 import { logger as logger5 } from "storybook/internal/client-logger";
 import {
@@ -2272,12 +2510,12 @@ function createStatusStore({
 __name(createStatusStore, "createStatusStore");
 
 // src/shared/universal-store/use-universal-store-manager.ts
-import * as React from "react";
+import * as React2 from "react";
 var useUniversalStore = /* @__PURE__ */ __name((universalStore, selector) => {
-  const snapshotRef = React.useRef(
+  const snapshotRef = React2.useRef(
     selector ? selector(universalStore.getState()) : universalStore.getState()
   );
-  const subscribe = React.useCallback(
+  const subscribe = React2.useCallback(
     (listener) => universalStore.onStateChange((state2, previousState) => {
       if (!selector) {
         snapshotRef.current = state2;
@@ -2294,7 +2532,7 @@ var useUniversalStore = /* @__PURE__ */ __name((universalStore, selector) => {
     }),
     [universalStore, selector]
   );
-  const getSnapshot = React.useCallback(() => {
+  const getSnapshot = React2.useCallback(() => {
     const currentState = universalStore.getState();
     const selectedState = selector ? selector(currentState) : currentState;
     if (isEqual(selectedState, snapshotRef.current)) {
@@ -2303,7 +2541,7 @@ var useUniversalStore = /* @__PURE__ */ __name((universalStore, selector) => {
     snapshotRef.current = selectedState;
     return snapshotRef.current;
   }, [universalStore, selector]);
-  const state = React.useSyncExternalStore(subscribe, getSnapshot);
+  const state = React2.useSyncExternalStore(subscribe, getSnapshot);
   return [state, universalStore.setState];
 }, "useUniversalStore");
 
@@ -2335,7 +2573,7 @@ function removeRemovedOptions(options) {
   return result;
 }
 __name(removeRemovedOptions, "removeRemovedOptions");
-var init10 = /* @__PURE__ */ __name(({
+var init11 = /* @__PURE__ */ __name(({
   fullAPI,
   store: store2,
   navigate,
@@ -2836,7 +3074,7 @@ var init10 = /* @__PURE__ */ __name(({
 // src/manager-api/modules/url.ts
 var url_exports = {};
 __export(url_exports, {
-  init: () => init11
+  init: () => init12
 });
 import {
   GLOBALS_UPDATED as GLOBALS_UPDATED2,
@@ -2913,7 +3151,7 @@ var initialUrlSupport = /* @__PURE__ */ __name(({
   prevParams = customQueryParams;
   return { viewMode, layout, ui, selectedPanel, location: location2, path, customQueryParams, storyId };
 }, "initialUrlSupport");
-var init11 = /* @__PURE__ */ __name((moduleArgs) => {
+var init12 = /* @__PURE__ */ __name((moduleArgs) => {
   const { store: store2, navigate, provider, fullAPI } = moduleArgs;
   const navigateTo = /* @__PURE__ */ __name((path, queryParams = {}, options = {}) => {
     const params = Object.entries(queryParams).filter(([, v]) => v).sort(([a], [b]) => a < b ? -1 : 1).map(([k, v]) => `${k}=${v}`);
@@ -3009,14 +3247,14 @@ var init11 = /* @__PURE__ */ __name((moduleArgs) => {
 // src/manager-api/modules/versions.ts
 var versions_exports = {};
 __export(versions_exports, {
-  init: () => init12
+  init: () => init13
 });
 var import_memoizerific2 = __toESM(require_memoizerific(), 1);
 import { global as global8 } from "@storybook/global";
 import semver from "semver";
 
 // src/manager-api/version.ts
-var version = "10.0.0-beta.4";
+var version = "10.0.0-beta.6";
 
 // src/manager-api/modules/versions.ts
 var { VERSIONCHECK } = global8;
@@ -3033,7 +3271,7 @@ var normalizeRendererName = /* @__PURE__ */ __name((renderer) => {
   }
   return renderer;
 }, "normalizeRendererName");
-var init12 = /* @__PURE__ */ __name(({ store: store2 }) => {
+var init13 = /* @__PURE__ */ __name(({ store: store2 }) => {
   const { dismissedVersionNotification } = store2.getState();
   const state = {
     versions: {
@@ -3122,9 +3360,9 @@ var init12 = /* @__PURE__ */ __name(({ store: store2 }) => {
 // src/manager-api/modules/whatsnew.tsx
 var whatsnew_exports = {};
 __export(whatsnew_exports, {
-  init: () => init13
+  init: () => init14
 });
-import React2 from "react";
+import React3 from "react";
 import {
   REQUEST_WHATS_NEW_DATA,
   RESULT_WHATS_NEW_DATA,
@@ -3133,8 +3371,8 @@ import {
 } from "storybook/internal/core-events";
 import { global as global9 } from "@storybook/global";
 var WHATS_NEW_NOTIFICATION_ID = "whats-new";
-var StorybookIcon = /* @__PURE__ */ __name(({ color = "currentColor", size = 14 }) => {
-  return React2.createElement(
+var StorybookIcon = /* @__PURE__ */ __name(({ color: color2 = "currentColor", size = 14 }) => {
+  return React3.createElement(
     "svg",
     {
       width: size,
@@ -3143,18 +3381,18 @@ var StorybookIcon = /* @__PURE__ */ __name(({ color = "currentColor", size = 14
       fill: "none",
       xmlns: "http://www.w3.org/2000/svg"
     },
-    React2.createElement(
+    React3.createElement(
       "path",
       {
         fillRule: "evenodd",
         clipRule: "evenodd",
         d: "M2.042.616a.704.704 0 00-.66.729L1.816 12.9c.014.367.306.66.672.677l9.395.422h.032a.704.704 0 00.704-.703V.704c0-.015 0-.03-.002-.044a.704.704 0 00-.746-.659l-.773.049.057 1.615a.105.105 0 01-.17.086l-.52-.41-.617.468a.105.105 0 01-.168-.088L9.746.134 2.042.616zm8.003 4.747c-.247.192-2.092.324-2.092.05.04-1.045-.429-1.091-.689-1.091-.247 0-.662.075-.662.634 0 .57.607.893 1.32 1.27 1.014.538 2.24 1.188 2.24 2.823 0 1.568-1.273 2.433-2.898 2.433-1.676 0-3.141-.678-2.976-3.03.065-.275 2.197-.21 2.197 0-.026.971.195 1.256.753 1.256.43 0 .624-.236.624-.634 0-.602-.633-.958-1.361-1.367-.987-.554-2.148-1.205-2.148-2.7 0-1.494 1.027-2.489 2.86-2.489 1.832 0 2.832.98 2.832 2.845z",
-        fill: color
+        fill: color2
       }
     )
   );
 }, "StorybookIcon");
-var init13 = /* @__PURE__ */ __name(({ fullAPI, store: store2, provider }) => {
+var init14 = /* @__PURE__ */ __name(({ fullAPI, store: store2, provider }) => {
   const state = {
     whatsNewData: void 0
   };
@@ -3216,7 +3454,7 @@ var init13 = /* @__PURE__ */ __name(({ fullAPI, store: store2, provider }) => {
           headline: whatsNewData.title,
           subHeadline: "Learn what's new in Storybook"
         },
-        icon: React2.createElement(StorybookIcon, null),
+        icon: React3.createElement(StorybookIcon, null),
         onClear({ dismissed }) {
           if (dismissed) {
             setWhatsNewCache({ lastDismissedPost: whatsNewData.url });
@@ -3409,7 +3647,8 @@ var _ManagerProvider = class _ManagerProvider extends Component {
       globals_exports,
       url_exports,
       versions_exports,
-      whatsnew_exports
+      whatsnew_exports,
+      open_in_editor_exports
     ].map(
       (m) => m.init({ ...routeData, ...optionsData, ...apiData, state: this.state, fullAPI: this.api })
     );
@@ -3442,14 +3681,14 @@ var _ManagerProvider = class _ManagerProvider extends Component {
       state: this.state,
       api: this.api
     };
-    return React3.createElement(EffectOnMount, { effect: this.initModules }, React3.createElement(ManagerContext.Provider, { value }, React3.createElement(ManagerConsumer, null, children)));
+    return React4.createElement(EffectOnMount, { effect: this.initModules }, React4.createElement(ManagerContext.Provider, { value }, React4.createElement(ManagerConsumer, null, children)));
   }
 };
 __name(_ManagerProvider, "ManagerProvider");
 _ManagerProvider.displayName = "Manager";
 var ManagerProvider = _ManagerProvider;
 var EffectOnMount = /* @__PURE__ */ __name(({ children, effect }) => {
-  React3.useEffect(effect, []);
+  React4.useEffect(effect, []);
   return children;
 }, "EffectOnMount");
 var defaultFilter = /* @__PURE__ */ __name((c) => c, "defaultFilter");
@@ -3462,7 +3701,7 @@ function ManagerConsumer({
   const renderer = useRef2(children);
   const filterer = useRef2(filter);
   if (typeof renderer.current !== "function") {
-    return React3.createElement(Fragment, null, renderer.current);
+    return React4.createElement(Fragment, null, renderer.current);
   }
   const comboData = filterer.current(managerContext);
   const comboDataArray = useMemo(() => {
@@ -3470,7 +3709,7 @@ function ManagerConsumer({
   }, [managerContext.state]);
   return useMemo(() => {
     const Child = renderer.current;
-    return React3.createElement(Child, { ...comboData });
+    return React4.createElement(Child, { ...comboData });
   }, comboDataArray);
 }
 __name(ManagerConsumer, "ManagerConsumer");