storybook 10.1.0-beta.1 → 10.1.0-beta.3

package/dist/manager/runtime.js

@@ -293,9 +293,9 @@ var require_memoizerific = __commonJS({
         module3.exports = function(limit) {
           var cache = new MapOrSimilar(!1), lru = [];
           return function(fn) {
-            var memoizerific2 = function() {
+            var memoizerific3 = function() {
               var currentCache = cache, newMap, fnResult, argsLengthMinusOne = arguments.length - 1, lruPath = Array(argsLengthMinusOne + 1), isMemoized = !0, i2;
-              if ((memoizerific2.numArgs || memoizerific2.numArgs === 0) && memoizerific2.numArgs !== argsLengthMinusOne + 1)
+              if ((memoizerific3.numArgs || memoizerific3.numArgs === 0) && memoizerific3.numArgs !== argsLengthMinusOne + 1)
                 throw new Error("Memoizerific functions should always be called with the same number of arguments");
               for (i2 = 0; i2 < argsLengthMinusOne; i2++) {
                 if (lruPath[i2] = {
@@ -310,9 +310,9 @@ var require_memoizerific = __commonJS({
               return isMemoized && (currentCache.has(arguments[argsLengthMinusOne]) ? fnResult = currentCache.get(arguments[argsLengthMinusOne]) : isMemoized = !1), isMemoized || (fnResult = fn.apply(null, arguments), currentCache.set(arguments[argsLengthMinusOne], fnResult)), limit > 0 && (lruPath[argsLengthMinusOne] = {
                 cacheItem: currentCache,
                 arg: arguments[argsLengthMinusOne]
-              }, isMemoized ? moveToMostRecentLru(lru, lruPath) : lru.push(lruPath), lru.length > limit && removeCachedResult(lru.shift())), memoizerific2.wasMemoized = isMemoized, memoizerific2.numArgs = argsLengthMinusOne + 1, fnResult;
+              }, isMemoized ? moveToMostRecentLru(lru, lruPath) : lru.push(lruPath), lru.length > limit && removeCachedResult(lru.shift())), memoizerific3.wasMemoized = isMemoized, memoizerific3.numArgs = argsLengthMinusOne + 1, fnResult;
             };
-            return memoizerific2.limit = limit, memoizerific2.wasMemoized = !1, memoizerific2.cache = cache, memoizerific2.lru = lru, memoizerific2;
+            return memoizerific3.limit = limit, memoizerific3.wasMemoized = !1, memoizerific3.cache = cache, memoizerific3.lru = lru, memoizerific3;
           };
         };
         function moveToMostRecentLru(lru, lruPath) {
@@ -2259,7 +2259,7 @@ var icons_default = __STORYBOOK_ICONS__, { AccessibilityAltIcon, AccessibilityIc
 var manager_api_default = __STORYBOOK_API__, { ActiveTabs, Consumer, ManagerContext, Provider, RequestResponseError, addons, combineParameters, controlOrMetaKey, controlOrMetaSymbol, eventMatchesShortcut, eventToShortcut, experimental_MockUniversalStore, experimental_UniversalStore, experimental_getStatusStore, experimental_getTestProviderStore, experimental_requestResponse, experimental_useStatusStore, experimental_useTestProviderStore, experimental_useUniversalStore, internal_checklistStore, internal_fullStatusStore, internal_fullTestProviderStore, internal_universalChecklistStore, internal_universalStatusStore, internal_universalTestProviderStore, isMacLike, isShortcutTaken, keyToSymbol, merge, mockChannel, optionOrAltSymbol, shortcutMatchesShortcut, shortcutToAriaKeyshortcuts, shortcutToHumanString, types, useAddonState, useArgTypes, useArgs, useChannel, useGlobalTypes, useGlobals, useParameter, useSharedState, useStoryPrepared, useStorybookApi, useStorybookState } = __STORYBOOK_API__;
 
 // global-externals:storybook/theming
-var theming_default = __STORYBOOK_THEMING__, { CacheProvider, ClassNames, Global, ThemeProvider, background, color, convert, create, createCache, createGlobal, createReset, css, darken, ensure, getPreferredColorScheme, ignoreSsrWarning, isPropValid, jsx, keyframes, lighten, styled, themes, typography, useTheme, withTheme } = __STORYBOOK_THEMING__;
+var theming_default = __STORYBOOK_THEMING__, { CacheProvider, ClassNames, Global, ThemeProvider, background, color, convert, create, createCache, createGlobal, createReset, css, darken, ensure, getPreferredColorScheme, ignoreSsrWarning, isPropValid, jsx, keyframes, lighten, styled, themes, tokens, typography, useTheme, withTheme } = __STORYBOOK_THEMING__;
 
 // global-externals:storybook/internal/components
 var components_default = __STORYBOOK_COMPONENTS__, { A, AbstractToolbar, ActionBar, AddonPanel, Badge, Bar, Blockquote, Button, Card, ClipboardCode, Code, Collapsible, DL, Div, DocumentWrapper, EmptyTabContent, ErrorFormatter, FlexBar, Form, H1, H2, H3, H4, H5, H6, HR, IconButton, Img, LI, Link, ListItem, Listbox, Loader, Modal, ModalDecorator, OL, P, Placeholder, Popover, PopoverProvider, Pre, ProgressSpinner, ResetWrapper, ScrollArea, Select, Separator, Spaced, Span, StatelessTab, StatelessTabList, StatelessTabPanel, StatelessTabsView, StorybookIcon: StorybookIcon2, StorybookLogo, SyntaxHighlighter, TT, TabBar, TabButton, TabList, TabPanel, TabWrapper, Table, Tabs, TabsState, TabsView, ToggleButton, Toolbar, Tooltip, TooltipLinkList, TooltipMessage, TooltipNote, TooltipProvider, UL, WithTooltip, WithTooltipPure, Zoom, codeCommon, components, convertToReactAriaPlacement, createCopyToClipboardFunction, getStoryHref, interleaveSeparators, nameSpaceClassNames, resetComponents, useTabsState, withReset } = __STORYBOOK_COMPONENTS__;
@@ -13919,6 +13919,9 @@ var { document: document4, window: globalWindow3 } = scope, IndicatorPlacement =
   return react_default.createElement(Message, { href: "https://storybook.js.org/docs/sharing/storybook-composition?ref=ui" }, react_default.createElement(LightningIcon, { color: theme.color.gold }), react_default.createElement("div", null, react_default.createElement(MessageTitle, null, "Reduce lag"), react_default.createElement("div", null, "Learn how to speed up Composition performance.")));
 };
 
+// src/manager/utils/status.tsx
+var import_memoizerific3 = __toESM(require_memoizerific(), 1);
+
 // src/manager/components/sidebar/IconSymbols.tsx
 var Svg2 = styled.svg`
   position: absolute;
@@ -14015,7 +14018,7 @@ var SmallIcons = styled(CircleIcon)({
   "status-value:success",
   "status-value:warning",
   "status-value:error"
-], statusMapping = {
+], getStatus = (0, import_memoizerific3.default)(5)((theme, status) => ({
   "status-value:unknown": [null, null],
   "status-value:pending": [react_default.createElement(LoadingIcons, { key: "icon" }), "currentColor"],
   "status-value:success": [
@@ -14024,13 +14027,13 @@ var SmallIcons = styled(CircleIcon)({
   ],
   "status-value:warning": [
     react_default.createElement("svg", { key: "icon", viewBox: "0 0 14 14", width: "14", height: "14" }, react_default.createElement(UseSymbol, { type: "warning" })),
-    "#A15C20"
+    theme.fgColor.warning
   ],
   "status-value:error": [
     react_default.createElement("svg", { key: "icon", viewBox: "0 0 14 14", width: "14", height: "14" }, react_default.createElement(UseSymbol, { type: "error" })),
-    "#D43900"
+    theme.fgColor.negative
   ]
-}, getMostCriticalStatusValue = (statusValues) => statusPriority.reduce(
+})[status]), getMostCriticalStatusValue = (statusValues) => statusPriority.reduce(
   (acc, value) => statusValues.includes(value) ? value : acc,
   "status-value:unknown"
 );
@@ -14575,7 +14578,7 @@ var statusOrder = [
     setExpanded,
     onSelectStoryId,
     api
-  } = props, { isDesktop, isMobile: isMobile2, setMobileMenuOpen } = useLayout(), { counts, statusesByValue } = useStatusSummary(item);
+  } = props, theme = useTheme(), { isDesktop, isMobile: isMobile2, setMobileMenuOpen } = useLayout(), { counts, statusesByValue } = useStatusSummary(item);
   if (!isDisplayed)
     return null;
   let statusLinks = useMemo(() => {
@@ -14617,6 +14620,52 @@ var statusOrder = [
     return [];
   }, [counts, item.id, item.type, onSelectStoryId, statuses, statusesByValue]), id = createId(item.id, refId), contextMenu = refId === "storybook_internal" ? useContextMenu(item, statusLinks, api) : { node: null, onMouseEnter: () => {
   } };
+  if (item.type === "story" && !("children" in item && item.children) && (!("subtype" in item) || item.subtype !== "test") || item.type === "docs") {
+    let LeafNode3 = item.type === "docs" ? DocumentNode : StoryNode, statusValue = getMostCriticalStatusValue(
+      Object.values(statuses || {}).map((s2) => s2.value)
+    ), [icon, textColor] = getStatus(theme, statusValue);
+    return react_default.createElement(
+      LeafNodeStyleWrapper,
+      {
+        key: id,
+        className: "sidebar-item",
+        "data-selected": isSelected,
+        "data-ref-id": refId,
+        "data-item-id": item.id,
+        "data-parent-id": item.parent,
+        "data-nodetype": item.type === "docs" ? "document" : "story",
+        "data-highlightable": isDisplayed,
+        onMouseEnter: contextMenu.onMouseEnter
+      },
+      react_default.createElement(
+        LeafNode3,
+        {
+          style: isSelected ? {} : { color: textColor },
+          href: getLink(item, refId),
+          id,
+          depth: isOrphan ? item.depth : item.depth - 1,
+          onClick: (event) => {
+            event.preventDefault(), onSelectStoryId(item.id), isMobile2 && setMobileMenuOpen(!1);
+          },
+          ...item.type === "docs" && { docsMode }
+        },
+        item.renderLabel?.(item, api) || item.name
+      ),
+      isSelected && react_default.createElement(SkipToContentLink, { asChild: !0, ariaLabel: !1 }, react_default.createElement("a", { href: "#storybook-preview-wrapper" }, "Skip to canvas")),
+      contextMenu.node,
+      icon ? react_default.createElement(
+        StatusButton,
+        {
+          ariaLabel: `Test status: ${statusValue.replace("status-value:", "")}`,
+          "data-testid": "tree-status-button",
+          type: "button",
+          status: statusValue,
+          selectedItem: isSelected
+        },
+        icon
+      ) : null
+    );
+  }
   if (item.type === "root")
     return react_default.createElement(
       RootNode,
@@ -14658,7 +14707,7 @@ var statusOrder = [
         isFullyExpanded ? react_default.createElement(CollapseIcon, null) : react_default.createElement(ExpandAltIcon, null)
       )
     );
-  let itemStatus = getMostCriticalStatusValue(Object.values(statuses || {}).map((s2) => s2.value)), [itemIcon, itemColor] = statusMapping[itemStatus], itemStatusButton = itemIcon ? react_default.createElement(
+  let itemStatus = getMostCriticalStatusValue(Object.values(statuses || {}).map((s2) => s2.value)), [itemIcon, itemColor] = getStatus(theme, itemStatus), itemStatusButton = itemIcon ? react_default.createElement(
     StatusButton,
     {
       ariaLabel: `Test status: ${itemStatus.replace("status-value:", "")}`,
@@ -14671,7 +14720,7 @@ var statusOrder = [
     itemIcon
   ) : null;
   if (item.type === "component" || item.type === "group" || item.type === "story" && "children" in item && item.children) {
-    let { children = [] } = item, BranchNode2 = { component: ComponentNode, group: GroupNode, story: StoryNode }[item.type], status = getMostCriticalStatusValue([itemStatus, groupStatus?.[item.id]]), color2 = status ? statusMapping[status][1] : null, showBranchStatus = status === "status-value:error" || status === "status-value:warning";
+    let { children = [] } = item, BranchNode2 = { component: ComponentNode, group: GroupNode, story: StoryNode }[item.type], status = getMostCriticalStatusValue([itemStatus, groupStatus?.[item.id]]), color2 = status ? getStatus(theme, status)[1] : null, showBranchStatus = status === "status-value:error" || status === "status-value:warning";
     return react_default.createElement(
       LeafNodeStyleWrapper,
       {
@@ -14745,8 +14794,7 @@ var statusOrder = [
         depth: isOrphan ? item.depth : item.depth - 1,
         onClick: (event) => {
           event.preventDefault(), onSelectStoryId(item.id), isMobile2 && setMobileMenuOpen(!1);
-        },
-        ...item.type === "docs" && { docsMode }
+        }
       },
       item.renderLabel?.(item, api) || item.name
     ),
@@ -17581,13 +17629,13 @@ var { document: document7 } = scope, DEFAULT_MAX_SEARCH_RESULTS = 50, options =
         openMenu,
         closeMenu,
         inputValue,
-        clearSelection,
         getInputProps,
         getItemProps,
         getLabelProps,
         getMenuProps,
         getRootProps,
-        highlightedIndex
+        highlightedIndex,
+        reset
       }) => {
         let input = inputValue ? inputValue.trim() : "", results = input ? getResults(input) : [], lastViewed = !input && getLastViewed();
         lastViewed && lastViewed.length && (results = lastViewed.reduce((acc, { storyId, refId }) => {
@@ -17630,7 +17678,9 @@ var { document: document7 } = scope, DEFAULT_MAX_SEARCH_RESULTS = 50, options =
               padding: "small",
               variant: "ghost",
               ariaLabel: "Clear search",
-              onClick: () => clearSelection()
+              onClick: () => {
+                reset({ inputValue: "" }), closeMenu();
+              }
             },
             react_default.createElement(CloseIcon, null)
           ), searchFieldContent)
@@ -17745,7 +17795,7 @@ var { document: document8 } = scope, ResultsList = styled.ol({
     }
   }
 })), Result = react_default.memo(function({ item, matches, onClick, ...props }) {
-  let click = useCallback(
+  let theme = useTheme(), click = useCallback(
     (event) => {
       event.preventDefault(), onClick?.(event);
     },
@@ -17753,8 +17803,8 @@ var { document: document8 } = scope, ResultsList = styled.ol({
   ), api = useStorybookApi();
   useEffect(() => {
     api && props.isHighlighted && item.type === "component" && api.emit(PRELOAD_ENTRIES, { ids: [item.children[0]] }, { options: { target: item.refId } });
-  }, [props.isHighlighted, item]);
-  let nameMatch = matches.find((match) => match.key === "name"), pathMatches = matches.filter((match) => match.key === "path"), [icon] = item.status ? statusMapping[item.status] : [];
+  }, [api, props.isHighlighted, item]);
+  let nameMatch = matches.find((match) => match.key === "name"), pathMatches = matches.filter((match) => match.key === "path"), [icon] = item.status ? getStatus(theme, item.status) : [];
   return react_default.createElement(ResultRow, { ...props, onClick: click }, react_default.createElement(IconWrapper2, null, item.type === "component" && react_default.createElement(TypeIcon2, { viewBox: "0 0 14 14", width: "14", height: "14", type: "component" }, react_default.createElement(UseSymbol, { type: "component" })), item.type === "story" && react_default.createElement(TypeIcon2, { viewBox: "0 0 14 14", width: "14", height: "14", type: item.subtype }, react_default.createElement(UseSymbol, { type: item.subtype })), !(item.type === "component" || item.type === "story") && react_default.createElement(TypeIcon2, { viewBox: "0 0 14 14", width: "14", height: "14", type: "document" }, react_default.createElement(UseSymbol, { type: "document" }))), react_default.createElement(ResultRowContent, { className: "search-result-item--label" }, react_default.createElement(Title, null, react_default.createElement(Highlight, { match: nameMatch }, item.name)), react_default.createElement(Path, null, item.path.map((group, index) => react_default.createElement("span", { key: index }, react_default.createElement(Highlight, { match: pathMatches.find((match) => match.arrayIndex === index) }, group))))), item.status ? react_default.createElement(StatusLabel, { status: item.status }, icon) : null);
 }), SearchResults = react_default.memo(function({
   query,

package/dist/manager-api/index.js

@@ -2329,7 +2329,7 @@ import { global as global8 } from "@storybook/global";
 import semver from "semver";
 
 // src/manager-api/version.ts
-var version = "10.1.0-beta.1";
+var version = "10.1.0-beta.3";
 
 // src/manager-api/modules/versions.ts
 var { VERSIONCHECK } = global8, getVersionCheckData = (0, import_memoizerific2.default)(1)(() => {
@@ -2362,15 +2362,12 @@ var { VERSIONCHECK } = global8, getVersionCheckData = (0, import_memoizerific2.d
     },
     // TODO: Move this to it's own "info" module later
     getDocsUrl: ({ asset, subpath = asset, versioned, renderer, ref = "ui" }) => {
-      let {
-        versions: { latest, current }
-      } = store2.getState(), url = `https://storybook.js.org/${asset ? "docs-assets" : "docs"}/`;
-      if (asset && current?.version)
-        url += `${semver.major(current.version)}.${semver.minor(current.version)}/`;
-      else if (versioned && current?.version && latest?.version) {
-        let versionDiff = semver.diff(latest.version, current.version);
-        versionDiff === "patch" || versionDiff === null || // assume latest version when current version is a 0.0.0 canary
-        semver.satisfies(current.version, "0.0.0", { includePrerelease: !0 }) || (url += `${semver.major(current.version)}.${semver.minor(current.version)}/`);
+      let { versions } = store2.getState(), latestVersion = versions.latest?.version, currentVersion = versions.current?.version, activeVersion = currentVersion?.startsWith("0.0.0") && latestVersion || currentVersion, url = `https://storybook.js.org/${asset ? "docs-assets" : "docs"}/`;
+      if (asset && activeVersion)
+        url += `${semver.major(activeVersion)}.${semver.minor(activeVersion)}/`;
+      else if (versioned && activeVersion && latestVersion) {
+        let versionDiff = semver.diff(latestVersion, activeVersion);
+        versionDiff === "patch" || versionDiff === null || (url += `${semver.major(activeVersion)}.${semver.minor(activeVersion)}/`);
       }
       let [cleanedSubpath, hash] = subpath?.split("#") || [];
       if (cleanedSubpath && (url += asset ? cleanedSubpath : `${cleanedSubpath}/`), renderer && typeof global8.STORYBOOK_RENDERER < "u") {

package/dist/mocking-utils/index.js

@@ -1,10 +1,10 @@
-import CJS_COMPAT_NODE_URL_jdojl2z4eei from 'node:url';
-import CJS_COMPAT_NODE_PATH_jdojl2z4eei from 'node:path';
-import CJS_COMPAT_NODE_MODULE_jdojl2z4eei from "node:module";
+import CJS_COMPAT_NODE_URL_d4nrjz93tmm from 'node:url';
+import CJS_COMPAT_NODE_PATH_d4nrjz93tmm from 'node:path';
+import CJS_COMPAT_NODE_MODULE_d4nrjz93tmm from "node:module";
 
-var __filename = CJS_COMPAT_NODE_URL_jdojl2z4eei.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_jdojl2z4eei.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_jdojl2z4eei.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_d4nrjz93tmm.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_d4nrjz93tmm.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_d4nrjz93tmm.createRequire(import.meta.url);
 
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
@@ -16,8 +16,8 @@ import {
   join,
   normalize,
   resolve
-} from "../_node-chunks/chunk-WIWWMCEU.js";
-import "../_node-chunks/chunk-2OVULPK3.js";
+} from "../_node-chunks/chunk-UWK6Z4VL.js";
+import "../_node-chunks/chunk-745GFLCZ.js";
 
 // ../node_modules/@jridgewell/sourcemap-codec/dist/sourcemap-codec.mjs
 var comma = 44, semicolon = 59, chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/", intToChar = new Uint8Array(64), charToInt = new Uint8Array(128);

package/dist/node-logger/index.js

@@ -1,10 +1,10 @@
-import CJS_COMPAT_NODE_URL_jdojl2z4eei from 'node:url';
-import CJS_COMPAT_NODE_PATH_jdojl2z4eei from 'node:path';
-import CJS_COMPAT_NODE_MODULE_jdojl2z4eei from "node:module";
+import CJS_COMPAT_NODE_URL_d4nrjz93tmm from 'node:url';
+import CJS_COMPAT_NODE_PATH_d4nrjz93tmm from 'node:path';
+import CJS_COMPAT_NODE_MODULE_d4nrjz93tmm from "node:module";
 
-var __filename = CJS_COMPAT_NODE_URL_jdojl2z4eei.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_jdojl2z4eei.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_jdojl2z4eei.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_d4nrjz93tmm.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_d4nrjz93tmm.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_d4nrjz93tmm.createRequire(import.meta.url);
 
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
@@ -22,9 +22,9 @@ import {
   once,
   prompt,
   protectUrls
-} from "../_node-chunks/chunk-RURZIE3W.js";
-import "../_node-chunks/chunk-XGNRK7QB.js";
-import "../_node-chunks/chunk-2OVULPK3.js";
+} from "../_node-chunks/chunk-A5VW7257.js";
+import "../_node-chunks/chunk-TUQOGYET.js";
+import "../_node-chunks/chunk-745GFLCZ.js";
 var export_instance = import_npmlog.default;
 export {
   CLI_COLORS,

package/dist/server-errors.js

@@ -1,10 +1,10 @@
-import CJS_COMPAT_NODE_URL_jdojl2z4eei from 'node:url';
-import CJS_COMPAT_NODE_PATH_jdojl2z4eei from 'node:path';
-import CJS_COMPAT_NODE_MODULE_jdojl2z4eei from "node:module";
+import CJS_COMPAT_NODE_URL_d4nrjz93tmm from 'node:url';
+import CJS_COMPAT_NODE_PATH_d4nrjz93tmm from 'node:path';
+import CJS_COMPAT_NODE_MODULE_d4nrjz93tmm from "node:module";
 
-var __filename = CJS_COMPAT_NODE_URL_jdojl2z4eei.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_jdojl2z4eei.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_jdojl2z4eei.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_d4nrjz93tmm.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_d4nrjz93tmm.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_d4nrjz93tmm.createRequire(import.meta.url);
 
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
@@ -42,11 +42,11 @@ import {
   WebpackCompilationError,
   WebpackInvocationError,
   WebpackMissingStatsError
-} from "./_node-chunks/chunk-O5FMCQHP.js";
-import "./_node-chunks/chunk-N3BJOOY5.js";
-import "./_node-chunks/chunk-SQSFX47N.js";
-import "./_node-chunks/chunk-XGNRK7QB.js";
-import "./_node-chunks/chunk-2OVULPK3.js";
+} from "./_node-chunks/chunk-STYUJSG3.js";
+import "./_node-chunks/chunk-NOTIBODG.js";
+import "./_node-chunks/chunk-7WOMK33B.js";
+import "./_node-chunks/chunk-TUQOGYET.js";
+import "./_node-chunks/chunk-745GFLCZ.js";
 export {
   AddonVitestPostinstallError,
   AddonVitestPostinstallPrerequisiteCheckError,

package/dist/telemetry/index.js

@@ -1,10 +1,10 @@
-import CJS_COMPAT_NODE_URL_jdojl2z4eei from 'node:url';
-import CJS_COMPAT_NODE_PATH_jdojl2z4eei from 'node:path';
-import CJS_COMPAT_NODE_MODULE_jdojl2z4eei from "node:module";
+import CJS_COMPAT_NODE_URL_d4nrjz93tmm from 'node:url';
+import CJS_COMPAT_NODE_PATH_d4nrjz93tmm from 'node:path';
+import CJS_COMPAT_NODE_MODULE_d4nrjz93tmm from "node:module";
 
-var __filename = CJS_COMPAT_NODE_URL_jdojl2z4eei.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_jdojl2z4eei.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_jdojl2z4eei.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_d4nrjz93tmm.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_d4nrjz93tmm.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_d4nrjz93tmm.createRequire(import.meta.url);
 
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
@@ -22,25 +22,25 @@ import {
   sanitizeAddonName,
   sanitizeError,
   telemetry
-} from "../_node-chunks/chunk-RVII4SK6.js";
-import "../_node-chunks/chunk-Z4BMBA5L.js";
-import "../_node-chunks/chunk-Y4UYN72K.js";
-import "../_node-chunks/chunk-KJAFCNZ3.js";
-import "../_node-chunks/chunk-5V4A6MSI.js";
-import "../_node-chunks/chunk-RURZIE3W.js";
+} from "../_node-chunks/chunk-SKFAHEPX.js";
+import "../_node-chunks/chunk-DRN5YXX5.js";
+import "../_node-chunks/chunk-CRJ7M6EO.js";
+import "../_node-chunks/chunk-LJRIVT23.js";
+import "../_node-chunks/chunk-U24W5IIW.js";
+import "../_node-chunks/chunk-A5VW7257.js";
 import {
   getPrecedingUpgrade
-} from "../_node-chunks/chunk-VRICJPXY.js";
-import "../_node-chunks/chunk-3JJPSDXI.js";
-import "../_node-chunks/chunk-IUYZQKSX.js";
-import "../_node-chunks/chunk-FNYKBULZ.js";
-import "../_node-chunks/chunk-RIKQZHV3.js";
-import "../_node-chunks/chunk-WIWWMCEU.js";
-import "../_node-chunks/chunk-Y2FOTPAE.js";
-import "../_node-chunks/chunk-ZMCJS2GU.js";
-import "../_node-chunks/chunk-SQSFX47N.js";
-import "../_node-chunks/chunk-XGNRK7QB.js";
-import "../_node-chunks/chunk-2OVULPK3.js";
+} from "../_node-chunks/chunk-JOOO54RB.js";
+import "../_node-chunks/chunk-RABBUYPA.js";
+import "../_node-chunks/chunk-NKT3R6IH.js";
+import "../_node-chunks/chunk-Y7VDA7NY.js";
+import "../_node-chunks/chunk-WSIZMTN2.js";
+import "../_node-chunks/chunk-UWK6Z4VL.js";
+import "../_node-chunks/chunk-XS5QCZP7.js";
+import "../_node-chunks/chunk-Q65ED3UK.js";
+import "../_node-chunks/chunk-7WOMK33B.js";
+import "../_node-chunks/chunk-TUQOGYET.js";
+import "../_node-chunks/chunk-745GFLCZ.js";
 export {
   ErrorCollector,
   addToGlobalContext,

package/dist/theming/create.d.ts

@@ -45,7 +45,7 @@ interface Themes {
 }
 declare const themes: Themes;
 interface Rest {
-    [key: string]: any;
+    [key: string]: unknown;
 }
 declare const create: (vars?: ThemeVarsPartial, rest?: Rest) => ThemeVars;
 

package/dist/theming/create.js

@@ -1,7 +1,7 @@
 import {
   create,
   themes
-} from "../_browser-chunks/chunk-L4RMQ7D7.js";
+} from "../_browser-chunks/chunk-BRX2HXH7.js";
 import "../_browser-chunks/chunk-AXG2BOBL.js";
 import "../_browser-chunks/chunk-CHUV5WSW.js";
 import "../_browser-chunks/chunk-A242L54C.js";

package/dist/theming/index.d.ts

@@ -12486,6 +12486,66 @@ declare const typography: {
         code: number;
     };
 };
+declare const tokens: {
+    light: {
+        fgColor: {
+            default: string;
+            muted: string;
+            accent: string;
+            inverse: string;
+            positive: string;
+            warning: string;
+            negative: string;
+            critical: string;
+        };
+        bgColor: {
+            default: string;
+            muted: string;
+            positive: string;
+            warning: string;
+            negative: string;
+            critical: string;
+        };
+        borderColor: {
+            default: string;
+            muted: string;
+            inverse: string;
+            positive: string;
+            warning: string;
+            negative: string;
+            critical: string;
+        };
+    };
+    dark: {
+        fgColor: {
+            default: string;
+            muted: string;
+            accent: string;
+            inverse: string;
+            positive: string;
+            warning: string;
+            negative: string;
+            critical: string;
+        };
+        bgColor: {
+            default: string;
+            muted: string;
+            positive: string;
+            warning: string;
+            negative: string;
+            critical: string;
+        };
+        borderColor: {
+            default: string;
+            muted: string;
+            inverse: string;
+            positive: string;
+            warning: string;
+            negative: string;
+            critical: string;
+        };
+    };
+};
 
 interface ThemeVars extends ThemeVarsBase, ThemeVarsColors {
 }
@@ -12540,6 +12600,9 @@ interface Brand {
 }
 interface StorybookTheme {
     color: Color;
+    fgColor: typeof tokens.light.fgColor;
+    bgColor: typeof tokens.light.bgColor;
+    borderColor: typeof tokens.light.borderColor;
     background: Background;
     typography: Typography;
     animation: Animation;
@@ -12681,7 +12744,7 @@ interface Themes {
 }
 declare const themes: Themes;
 interface Rest {
-    [key: string]: any;
+    [key: string]: unknown;
 }
 declare const create: (vars?: ThemeVarsPartial, rest?: Rest) => ThemeVars;
 
@@ -12702,7 +12765,7 @@ type InterpolationEnhanced<T = {}> = Interpolation<T & {
 
 declare const ignoreSsrWarning = "/* emotion-disable-server-rendering-unsafe-selector-warning-please-do-not-use-this-the-warning-exists-for-a-reason */";
 
-export { type Animation, type Background, type Brand, type CSSObject, CacheProvider, ClassNames, type Color, type Easing, type FunctionInterpolationEnhanced as FunctionInterpolation, Global, type InterpolationEnhanced as Interpolation, type Keyframes$1 as Keyframes, type StorybookTheme, type StyledComponent, type TextSize, ThemeProvider, type ThemeVars, type ThemeVarsColors, type ThemeVarsPartial, type Typography, background, color, convert, create, createCache, createGlobal, createReset, css, darkenColor as darken, ensure, getPreferredColorScheme, ignoreSsrWarning, isPropValid, jsx, keyframes, lightenColor as lighten, styled, themes, typography, useTheme, withTheme };
+export { type Animation, type Background, type Brand, type CSSObject, CacheProvider, ClassNames, type Color, type Easing, type FunctionInterpolationEnhanced as FunctionInterpolation, Global, type InterpolationEnhanced as Interpolation, type Keyframes$1 as Keyframes, type StorybookTheme, type StyledComponent, type TextSize, ThemeProvider, type ThemeVars, type ThemeVarsColors, type ThemeVarsPartial, type Typography, background, color, convert, create, createCache, createGlobal, createReset, css, darkenColor as darken, ensure, getPreferredColorScheme, ignoreSsrWarning, isPropValid, jsx, keyframes, lightenColor as lighten, styled, themes, tokens, typography, useTheme, withTheme };
 
 
 interface Theme extends StorybookTheme {}

package/dist/theming/index.js

@@ -8,8 +8,9 @@ import {
   lightenColor,
   mkColor,
   themes,
+  tokens,
   typography
-} from "../_browser-chunks/chunk-L4RMQ7D7.js";
+} from "../_browser-chunks/chunk-BRX2HXH7.js";
 import {
   curriedOpacify$1
 } from "../_browser-chunks/chunk-AXG2BOBL.js";
@@ -1984,6 +1985,7 @@ var lightSyntaxColors = {
   return {
     ...rest,
     base,
+    ...base === "dark" ? tokens.dark : tokens.light,
     color: createColors(inherit),
     background: {
       app: appBg,
@@ -2038,13 +2040,13 @@ var lightSyntaxColors = {
       target: brandTarget
     },
     code: create2({
-      colors: base === "light" ? lightSyntaxColors : darkSyntaxColors,
+      colors: base === "dark" ? darkSyntaxColors : lightSyntaxColors,
       mono: fontCode
     }),
     // Addon actions theme
     // API example https://github.com/storybookjs/react-inspector/blob/master/src/styles/themes/chromeLight.tsx
     addonActionsTheme: {
-      ...base === "light" ? chromeLight : chromeDark,
+      ...base === "dark" ? chromeDark : chromeLight,
       BASE_FONT_FAMILY: fontCode,
       BASE_FONT_SIZE: typography.size.s2 - 1,
       BASE_LINE_HEIGHT: "18px",
@@ -2117,6 +2119,7 @@ export {
   lightenColor as lighten,
   styled,
   themes,
+  tokens,
   typography,
   useTheme,
   withTheme

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "storybook",
-  "version": "10.1.0-beta.1",
+  "version": "10.1.0-beta.3",
   "description": "Storybook: Develop, document, and test UI components in isolation",
   "keywords": [
     "storybook",
@@ -261,7 +261,6 @@
     "@types/semver": "^7.5.8",
     "@types/ws": "^8",
     "@vitest/utils": "^3.2.4",
-    "@yarnpkg/esbuild-plugin-pnp": "^3.0.0-rc.10",
     "@yarnpkg/fslib": "2.10.3",
     "@yarnpkg/libzip": "2.3.0",
     "ansi-to-html": "^0.7.2",

package/dist/_node-chunks/chunk-DWA53E73.js

@@ -1,23 +0,0 @@
-import CJS_COMPAT_NODE_URL_jdojl2z4eei from 'node:url';
-import CJS_COMPAT_NODE_PATH_jdojl2z4eei from 'node:path';
-import CJS_COMPAT_NODE_MODULE_jdojl2z4eei from "node:module";
-
-var __filename = CJS_COMPAT_NODE_URL_jdojl2z4eei.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_jdojl2z4eei.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_jdojl2z4eei.createRequire(import.meta.url);
-
-// ------------------------------------------------------------
-// end of CJS compatibility banner, injected by Storybook's esbuild configuration
-// ------------------------------------------------------------
-import {
-  any
-} from "./chunk-IUYZQKSX.js";
-
-// src/cli/detect.ts
-async function detectPnp() {
-  return !!any([".pnp.js", ".pnp.cjs"]);
-}
-
-export {
-  detectPnp
-};