storybook 10.2.0-alpha.13 → 10.2.0-alpha.15

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

@@ -49,9 +49,8 @@ import {
   PARAM_KEY
 } from "../../_browser-chunks/chunk-6XWLIJQL.js";
 import {
-  MINIMAL_VIEWPORTS,
-  responsiveViewport
-} from "../../_browser-chunks/chunk-3PJE6VLG.js";
+  MINIMAL_VIEWPORTS
+} from "../../_browser-chunks/chunk-ASKQZAOS.js";
 import {
   ADDON_ID as ADDON_ID2,
   PARAM_KEY as PARAM_KEY2,
@@ -6882,164 +6881,207 @@ import * as React67 from "react";
 import { addons as addons7, types as types7 } from "storybook/manager-api";
 
 // src/viewport/components/Tool.tsx
-import React66, { Fragment as Fragment6, useCallback as useCallback10, useEffect as useEffect18, useMemo as useMemo6 } from "react";
-import { Button as Button9, Select as Select2 } from "storybook/internal/components";
-import { GrowIcon, TransferIcon } from "@storybook/icons";
-import { useGlobals as useGlobals5, useParameter as useParameter4 } from "storybook/manager-api";
-import { Global, styled as styled34 } from "storybook/theming";
-
-// src/viewport/shortcuts.ts
-var getCurrentViewportIndex = (viewportsKeys, current) => viewportsKeys.indexOf(current), getNextViewport = (viewportsKeys, current) => {
-  let currentViewportIndex = getCurrentViewportIndex(viewportsKeys, current);
-  return currentViewportIndex === viewportsKeys.length - 1 ? viewportsKeys[0] : viewportsKeys[currentViewportIndex + 1];
-}, getPreviousViewport = (viewportsKeys, current) => {
-  let currentViewportIndex = getCurrentViewportIndex(viewportsKeys, current);
-  return currentViewportIndex < 1 ? viewportsKeys[viewportsKeys.length - 1] : viewportsKeys[currentViewportIndex - 1];
-}, registerShortcuts = async (api, viewport, updateGlobals, viewportsKeys) => {
-  await api.setAddonShortcut(ADDON_ID2, {
-    label: "Previous viewport",
-    defaultShortcut: ["alt", "shift", "V"],
-    actionName: "previous",
-    action: () => {
-      updateGlobals({
-        viewport: getPreviousViewport(viewportsKeys, viewport)
-      });
-    }
-  }), await api.setAddonShortcut(ADDON_ID2, {
-    label: "Next viewport",
-    defaultShortcut: ["alt", "V"],
-    actionName: "next",
-    action: () => {
-      updateGlobals({
-        viewport: getNextViewport(viewportsKeys, viewport)
-      });
-    }
-  }), await api.setAddonShortcut(ADDON_ID2, {
-    label: "Reset viewport",
-    defaultShortcut: ["alt", "control", "V"],
-    actionName: "reset",
-    action: () => {
-      updateGlobals({
-        viewport: { value: void 0, isRotated: !1 }
-      });
-    }
-  });
+import React66, { useMemo as useMemo7 } from "react";
+import { Select as Select2 } from "storybook/internal/components";
+import { GrowIcon } from "@storybook/icons";
+import { styled as styled33 } from "storybook/theming";
+
+// src/viewport/useViewport.ts
+import { useCallback as useCallback10, useEffect as useEffect18, useMemo as useMemo6, useRef as useRef7 } from "react";
+import { useGlobals as useGlobals5, useParameter as useParameter4, useStorybookApi as useStorybookApi10 } from "storybook/manager-api";
+var URL_VALUE_PATTERN = /^([0-9]{1,4})([a-z]{0,4})-([0-9]{1,4})([a-z]{0,4})$/, VIEWPORT_MIN_WIDTH = 40, VIEWPORT_MIN_HEIGHT = 40, cycle = (viewports, current, direction = 1) => {
+  let keys = Object.keys(viewports), nextIndex = (current ? keys.indexOf(current) : -1) + direction;
+  return nextIndex < 0 ? keys[keys.length - 1] : nextIndex >= keys.length ? keys[0] : keys[nextIndex];
+}, normalizeGlobal = (value2, defaultIsRotated) => typeof value2 == "string" ? { value: value2, isRotated: defaultIsRotated } : { value: value2?.value, isRotated: value2?.isRotated ?? defaultIsRotated }, parseGlobals = (globals, storyGlobals, userGlobals, options, lastSelectedOption, disable, viewMode) => {
+  if (viewMode !== "story")
+    return {
+      name: "Responsive",
+      type: "desktop",
+      width: "100%",
+      height: "100%",
+      value: "100pct-100pct",
+      option: void 0,
+      isCustom: !1,
+      isDefault: !0,
+      isLocked: !0,
+      isRotated: !1
+    };
+  let global4 = normalizeGlobal(globals?.[PARAM_KEY2]), userGlobal = normalizeGlobal(userGlobals?.[PARAM_KEY2]), storyGlobal = normalizeGlobal(storyGlobals?.[PARAM_KEY2]), value2 = userGlobal?.value ?? storyGlobal?.value ?? global4?.value, isRotated = userGlobal?.isRotated ?? storyGlobal?.isRotated ?? global4?.isRotated ?? !1, keys = Object.keys(options), isLocked = disable || PARAM_KEY2 in storyGlobals || !keys.length, [match, vx, ux, vy, uy] = value2?.match(URL_VALUE_PATTERN) || [];
+  if (match) {
+    let x2 = ux && ux !== "px" ? vx : Math.max(Number(vx), VIEWPORT_MIN_WIDTH), y2 = uy && uy !== "px" ? vy : Math.max(Number(vy), VIEWPORT_MIN_HEIGHT), width = `${x2}${ux === "pct" ? "%" : ux || "px"}`, height = `${y2}${uy === "pct" ? "%" : uy || "px"}`, selection = lastSelectedOption ? options[lastSelectedOption] : void 0;
+    return {
+      name: selection?.name ?? "Custom",
+      type: selection?.type ?? "other",
+      width: isRotated ? height : width,
+      height: isRotated ? width : height,
+      value: match,
+      option: void 0,
+      isCustom: !0,
+      isDefault: !1,
+      isLocked,
+      isRotated
+    };
+  }
+  if (value2 && keys.length) {
+    let { name, styles, type = "other" } = options[value2] ?? options[keys[0]];
+    return {
+      name,
+      type,
+      width: isRotated ? styles.height : styles.width,
+      height: isRotated ? styles.width : styles.height,
+      value: value2,
+      option: value2,
+      isCustom: !1,
+      isDefault: !1,
+      isLocked,
+      isRotated
+    };
+  }
+  return {
+    name: "Responsive",
+    type: "desktop",
+    width: "100%",
+    height: "100%",
+    value: "100pct-100pct",
+    option: void 0,
+    isCustom: !1,
+    isDefault: !0,
+    isLocked,
+    isRotated: !1
+  };
+}, useViewport = () => {
+  let api = useStorybookApi10(), { viewMode } = api.getUrlState(), lastSelectedOption = useRef7(), parameter = useParameter4(PARAM_KEY2), [globals, updateGlobals, storyGlobals, userGlobals] = useGlobals5(), { options = MINIMAL_VIEWPORTS, disable = !1 } = parameter || {}, { name, type, width, height, value: value2, option, isCustom, isDefault, isLocked, isRotated } = parseGlobals(
+    globals,
+    storyGlobals,
+    userGlobals,
+    options,
+    lastSelectedOption.current,
+    disable,
+    viewMode
+  ), update = useCallback10(
+    (input) => updateGlobals({ [PARAM_KEY2]: input }),
+    [updateGlobals]
+  ), resize = useCallback10(
+    (width2, height2) => {
+      let w2 = width2.replace(/px$/, "").replace(/%$/, "pct"), h2 = height2.replace(/px$/, "").replace(/%$/, "pct"), value3 = isRotated ? `${h2}-${w2}` : `${w2}-${h2}`, [match, vx, ux, vy, uy] = value3.match(URL_VALUE_PATTERN) || [];
+      match && (ux || Number(vx) >= 40) && (uy || Number(vy) >= 40) && update({ value: match, isRotated });
+    },
+    [update, isRotated]
+  );
+  return useEffect18(() => {
+    PARAM_KEY2 in storyGlobals && (update(normalizeGlobal(storyGlobals?.[PARAM_KEY2], !1)), lastSelectedOption.current = void 0);
+  }, [storyGlobals, update]), useEffect18(() => {
+    option && (Object.hasOwn(options, option) ? lastSelectedOption.current = option : (lastSelectedOption.current = void 0, update(normalizeGlobal(storyGlobals?.[PARAM_KEY2], !1))));
+  }, [storyGlobals, options, option, update]), useEffect18(() => {
+    api.setAddonShortcut(ADDON_ID2, {
+      label: "Next viewport",
+      defaultShortcut: ["alt", "V"],
+      actionName: "next",
+      action: () => update({ value: cycle(options, lastSelectedOption.current), isRotated })
+    }), api.setAddonShortcut(ADDON_ID2, {
+      label: "Previous viewport",
+      defaultShortcut: ["alt", "shift", "V"],
+      actionName: "previous",
+      action: () => update({ value: cycle(options, lastSelectedOption.current, -1), isRotated })
+    }), api.setAddonShortcut(ADDON_ID2, {
+      label: "Reset viewport",
+      defaultShortcut: ["alt", "control", "V"],
+      actionName: "reset",
+      action: () => update({ value: void 0, isRotated: !1 })
+    });
+  }, [api, update, options, isRotated]), useMemo6(
+    () => ({
+      name,
+      type,
+      width,
+      height,
+      value: value2,
+      option,
+      isCustom,
+      isDefault,
+      isLocked,
+      isRotated,
+      options,
+      lastSelectedOption: lastSelectedOption.current,
+      resize,
+      reset: () => update({ value: void 0, isRotated: !1 }),
+      rotate: () => update({ value: value2, isRotated: !isRotated }),
+      select: (value3) => update({ value: value3, isRotated })
+    }),
+    [
+      name,
+      type,
+      width,
+      height,
+      value2,
+      option,
+      isCustom,
+      isDefault,
+      isRotated,
+      isLocked,
+      options,
+      resize,
+      update
+    ]
+  );
 };
 
-// src/viewport/utils.tsx
-import React65, { Fragment as Fragment5 } from "react";
-import { BrowserIcon, MobileIcon, TabletIcon } from "@storybook/icons";
-import { styled as styled33 } from "storybook/theming";
-var ActiveViewportSize = styled33.div({
-  display: "inline-flex",
-  alignItems: "center"
-}), ActiveViewportLabel = styled33.div(({ theme: theme3 }) => ({
-  display: "inline-block",
-  textDecoration: "none",
-  padding: 10,
-  fontWeight: theme3.typography.weight.bold,
-  fontSize: theme3.typography.size.s2 - 1,
-  lineHeight: "1",
-  height: 40,
-  border: "none",
-  borderTop: "3px solid transparent",
-  borderBottom: "3px solid transparent",
-  background: "transparent"
-})), iconsMap = {
+// src/viewport/viewportIcons.tsx
+import React65 from "react";
+import { BrowserIcon, DiamondIcon, MobileIcon, TabletIcon, WatchIcon } from "@storybook/icons";
+var iconsMap = {
   desktop: React65.createElement(BrowserIcon, null),
   mobile: React65.createElement(MobileIcon, null),
   tablet: React65.createElement(TabletIcon, null),
-  other: React65.createElement(Fragment5, null)
+  watch: React65.createElement(WatchIcon, null),
+  other: React65.createElement(DiamondIcon, null)
 };
 
 // src/viewport/components/Tool.tsx
-var ViewportTool = ({ api }) => {
-  let config = useParameter4(PARAM_KEY2), [globals, updateGlobals, storyGlobals] = useGlobals5(), { options = MINIMAL_VIEWPORTS, disable } = config || {}, data = globals?.[PARAM_KEY2] || {}, viewportName = typeof data == "string" ? data : data.value, isRotated = typeof data == "string" ? !1 : !!data.isRotated, item = options[viewportName] || responsiveViewport, isLocked = PARAM_KEY2 in storyGlobals, length = Object.keys(options).length;
-  if (useEffect18(() => {
-    registerShortcuts(api, viewportName, updateGlobals, Object.keys(options));
-  }, [options, viewportName, updateGlobals, api]), item.styles === null || !options || length < 1)
-    return null;
-  if (typeof item.styles == "function")
-    return console.warn(
-      "Addon Viewport no longer supports dynamic styles using a function, use css calc() instead"
-    ), null;
-  let width = isRotated ? item.styles.height : item.styles.width, height = isRotated ? item.styles.width : item.styles.height;
-  return disable ? null : React66.createElement(
-    Pure2,
-    {
-      item,
-      updateGlobals,
-      viewportMap: options,
-      viewportName,
-      isRotated,
-      isLocked,
-      width,
-      height
-    }
-  );
-}, FirstDimension = styled34(ActiveViewportLabel)({
-  order: 1
-}), DimensionSeparator = styled34.div({
-  order: 2
-}), LastDimension = styled34(ActiveViewportLabel)({
-  order: 3
-}), Pure2 = React66.memo(function(props) {
-  let { item, viewportMap, viewportName, isRotated, updateGlobals, isLocked, width, height } = props, update = useCallback10(
-    (input) => updateGlobals({ [PARAM_KEY2]: input }),
-    [updateGlobals]
-  ), options = useMemo6(
-    () => Object.entries(viewportMap).map(([k2, value2]) => ({
+var Dimensions = styled33.div(({ theme: theme3 }) => ({
+  display: "flex",
+  gap: 2,
+  marginLeft: 20,
+  fontFamily: theme3.typography.fonts.mono,
+  fontSize: theme3.typography.size.s1 - 1,
+  fontWeight: theme3.typography.weight.regular,
+  color: theme3.textMutedColor
+})), ViewportTool = () => {
+  let { name, value: value2, isDefault, isLocked, options: viewportMap, reset, select } = useViewport(), options = useMemo7(
+    () => Object.entries(viewportMap).map(([k2, value3]) => ({
       value: k2,
-      title: value2.name,
-      icon: iconsMap[value2.type]
+      title: value3.name,
+      icon: iconsMap[value3.type],
+      right: React66.createElement(Dimensions, null, React66.createElement("span", null, value3.styles.width.replace("px", "")), React66.createElement("span", null, "\xD7"), React66.createElement("span", null, value3.styles.height.replace("px", "")))
     })),
     [viewportMap]
   );
-  return React66.createElement(Fragment6, null, React66.createElement(
+  return React66.createElement(
     Select2,
     {
       resetLabel: "Reset viewport",
-      onReset: () => update({ value: void 0, isRotated: !1 }),
+      onReset: reset,
       key: "viewport",
       disabled: isLocked,
       ariaLabel: isLocked ? "Viewport size set by story parameters" : "Viewport size",
-      ariaDescription: "Select a viewport size among predefined options for the preview area, or reset to the default size.",
-      tooltip: isLocked ? "Viewport size set by story parameters" : "Resize viewport",
-      defaultOptions: viewportName,
+      ariaDescription: "Select a viewport among predefined options for the preview area, or reset to the default viewport.",
+      tooltip: isLocked ? "Viewport set by story parameters" : "Change viewport",
+      defaultOptions: value2,
       options,
-      onSelect: (selected) => update({ value: selected, isRotated: !1 }),
+      onSelect: (selected) => select(selected),
       icon: React66.createElement(GrowIcon, null)
     },
-    item !== responsiveViewport ? React66.createElement(React66.Fragment, null, item.name, " ", isRotated ? "(L)" : "(P)") : null
-  ), React66.createElement(
-    Global,
-    {
-      styles: {
-        'iframe[data-is-storybook="true"]': { width, height }
-      }
-    }
-  ), item !== responsiveViewport ? React66.createElement(ActiveViewportSize, null, React66.createElement(FirstDimension, { title: "Viewport width" }, React66.createElement("span", { className: "sb-sr-only" }, "Viewport width: "), width.replace("px", "")), isLocked && React66.createElement(DimensionSeparator, null, "/"), React66.createElement(LastDimension, { title: "Viewport height" }, React66.createElement("span", { className: "sb-sr-only" }, "Viewport height: "), height.replace("px", "")), !isLocked && React66.createElement(DimensionSeparator, null, React66.createElement(
-    Button9,
-    {
-      key: "viewport-rotate",
-      padding: "small",
-      variant: "ghost",
-      ariaLabel: "Rotate viewport",
-      onClick: () => {
-        update({ value: viewportName, isRotated: !isRotated });
-      }
-    },
-    React66.createElement(TransferIcon, null)
-  ))) : null);
-});
+    isDefault ? null : name
+  );
+};
 
 // src/viewport/manager.tsx
-var manager_default7 = addons7.register(ADDON_ID2, (api) => {
+var manager_default7 = addons7.register(ADDON_ID2, () => {
   globalThis?.FEATURES?.viewport && addons7.add(TOOL_ID, {
     title: "viewport / media-queries",
     type: types7.TOOL,
     match: ({ viewMode, tabId }) => viewMode === "story" && !tabId,
-    render: () => React67.createElement(ViewportTool, { api })
+    render: () => React67.createElement(ViewportTool, null)
   });
 });
 

package/dist/core-server/presets/common-override-preset.js

@@ -1,21 +1,21 @@
-import CJS_COMPAT_NODE_URL_xc3mu1pf9x from 'node:url';
-import CJS_COMPAT_NODE_PATH_xc3mu1pf9x from 'node:path';
-import CJS_COMPAT_NODE_MODULE_xc3mu1pf9x from "node:module";
+import CJS_COMPAT_NODE_URL_ekkdwuux1sk from 'node:url';
+import CJS_COMPAT_NODE_PATH_ekkdwuux1sk from 'node:path';
+import CJS_COMPAT_NODE_MODULE_ekkdwuux1sk from "node:module";
 
-var __filename = CJS_COMPAT_NODE_URL_xc3mu1pf9x.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_xc3mu1pf9x.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_xc3mu1pf9x.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_ekkdwuux1sk.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_ekkdwuux1sk.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_ekkdwuux1sk.createRequire(import.meta.url);
 
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
 // ------------------------------------------------------------
 import {
   glob
-} from "../../_node-chunks/chunk-AE6TGTGX.js";
+} from "../../_node-chunks/chunk-MD52RVZX.js";
 import {
   slash
-} from "../../_node-chunks/chunk-XQU357NR.js";
-import "../../_node-chunks/chunk-KXFFKIVX.js";
+} from "../../_node-chunks/chunk-RGWB6DD7.js";
+import "../../_node-chunks/chunk-5KEIALUH.js";
 
 // src/core-server/utils/remove-mdx-entries.ts
 import { isAbsolute, join, relative } from "node:path";

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

@@ -1,54 +1,54 @@
-import CJS_COMPAT_NODE_URL_xc3mu1pf9x from 'node:url';
-import CJS_COMPAT_NODE_PATH_xc3mu1pf9x from 'node:path';
-import CJS_COMPAT_NODE_MODULE_xc3mu1pf9x from "node:module";
+import CJS_COMPAT_NODE_URL_ekkdwuux1sk from 'node:url';
+import CJS_COMPAT_NODE_PATH_ekkdwuux1sk from 'node:path';
+import CJS_COMPAT_NODE_MODULE_ekkdwuux1sk from "node:module";
 
-var __filename = CJS_COMPAT_NODE_URL_xc3mu1pf9x.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_xc3mu1pf9x.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_xc3mu1pf9x.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_ekkdwuux1sk.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_ekkdwuux1sk.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_ekkdwuux1sk.createRequire(import.meta.url);
 
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
 // ------------------------------------------------------------
-import "../../_node-chunks/chunk-FCBELYHM.js";
+import "../../_node-chunks/chunk-2FQAOAQ6.js";
 import {
   parseStaticDir,
   sendTelemetryError,
   throttle
-} from "../../_node-chunks/chunk-OWZXELHP.js";
-import "../../_node-chunks/chunk-JUCUYWH2.js";
-import "../../_node-chunks/chunk-TOLCEUYZ.js";
-import "../../_node-chunks/chunk-5E6TIJW7.js";
+} from "../../_node-chunks/chunk-PI7P5HFH.js";
+import "../../_node-chunks/chunk-MM7Z4SG7.js";
+import "../../_node-chunks/chunk-BRW7NFUP.js";
+import "../../_node-chunks/chunk-TN3Q52LO.js";
 import {
   globalSettings
-} from "../../_node-chunks/chunk-TWCN75ID.js";
+} from "../../_node-chunks/chunk-4GKVZO2T.js";
 import {
   invariant
-} from "../../_node-chunks/chunk-VOVBTC53.js";
-import "../../_node-chunks/chunk-NRCGIPSW.js";
+} from "../../_node-chunks/chunk-Q6WUEJ4S.js";
+import "../../_node-chunks/chunk-HFKM7JHQ.js";
 import {
   resolvePackageDir
-} from "../../_node-chunks/chunk-ZSUT22UW.js";
+} from "../../_node-chunks/chunk-E3Y5MHXD.js";
 import {
   isAbsolute,
   join
-} from "../../_node-chunks/chunk-NL75DTGM.js";
+} from "../../_node-chunks/chunk-FKBWQGIF.js";
 import {
   loadConfig
-} from "../../_node-chunks/chunk-BIJENBOW.js";
-import "../../_node-chunks/chunk-B3NH4IRY.js";
+} from "../../_node-chunks/chunk-SZWIX5YC.js";
+import "../../_node-chunks/chunk-2BHD5YKF.js";
 import {
   require_dist
-} from "../../_node-chunks/chunk-2VHYFREG.js";
-import "../../_node-chunks/chunk-5CARBEGS.js";
-import "../../_node-chunks/chunk-NGFKU3PK.js";
+} from "../../_node-chunks/chunk-QPKBPYOY.js";
+import "../../_node-chunks/chunk-BOY3TNPC.js";
+import "../../_node-chunks/chunk-45UIB4YF.js";
 import {
   require_picocolors
-} from "../../_node-chunks/chunk-X2PNK4N4.js";
+} from "../../_node-chunks/chunk-T57UCO67.js";
 import {
   __commonJS,
   __require,
   __toESM
-} from "../../_node-chunks/chunk-KXFFKIVX.js";
+} from "../../_node-chunks/chunk-5KEIALUH.js";
 
 // ../../node_modules/shell-quote/quote.js
 var require_quote = __commonJS({
@@ -516,7 +516,7 @@ import { isCsfFactoryPreview } from "storybook/internal/csf-tools";
 var import_ts_dedent = __toESM(require_dist(), 1);
 
 // src/core-server/utils/get-component-variable-name.ts
-var getComponentVariableName = async (name) => (await import("../../_node-chunks/camelcase-ALOK3DTL.js")).default(name.replace(/^[^a-zA-Z_$]*/, ""), { pascalCase: !0 }).replace(/[^a-zA-Z_$]+/, "");
+var getComponentVariableName = async (name) => (await import("../../_node-chunks/camelcase-SXQWF7PW.js")).default(name.replace(/^[^a-zA-Z_$]*/, ""), { pascalCase: !0 }).replace(/[^a-zA-Z_$]+/, "");
 
 // src/core-server/utils/new-story-templates/csf-factory-template.ts
 async function getCsfFactoryTemplateForNewStoryFile(data) {
@@ -781,7 +781,7 @@ async function searchFiles({
   ignoredFiles = IGNORED_FILES,
   fileExtensions = FILE_EXTENSIONS
 }) {
-  let { globby, isDynamicPattern } = await import("../../_node-chunks/globby-RG2TFVNI.js"), hasSearchSpecialGlobChars = isDynamicPattern(searchQuery, { cwd }), searchQueryHasExtension = /(\.[a-z]+)$/i.test(searchQuery), fileExtensionsPattern = `{${fileExtensions.join(",")}}`, globbedSearchQuery = hasSearchSpecialGlobChars ? searchQuery : searchQueryHasExtension ? [`**/*${searchQuery}*`, `**/*${searchQuery}*/**`] : [
+  let { globby, isDynamicPattern } = await import("../../_node-chunks/globby-LGQ5P2JB.js"), hasSearchSpecialGlobChars = isDynamicPattern(searchQuery, { cwd }), searchQueryHasExtension = /(\.[a-z]+)$/i.test(searchQuery), fileExtensionsPattern = `{${fileExtensions.join(",")}}`, globbedSearchQuery = hasSearchSpecialGlobChars ? searchQuery : searchQueryHasExtension ? [`**/*${searchQuery}*`, `**/*${searchQuery}*/**`] : [
     `**/*${searchQuery}*.${fileExtensionsPattern}`,
     `**/*${searchQuery}*/**/*.${fileExtensionsPattern}`
   ];
@@ -1495,7 +1495,8 @@ var interpolate = (string, data = {}) => Object.entries(data).reduce((acc, [k, v
   actions: !0,
   backgrounds: !0,
   outline: !0,
-  measure: !0
+  measure: !0,
+  sidebarOnboardingChecklist: !0
 }), csfIndexer = {
   test: /(stories|story)\.(m?js|ts)x?$/,
   createIndex: async (fileName, options) => (await readCsf2(fileName, options)).parse().indexInputs

package/dist/csf/index.d.ts

@@ -515,8 +515,9 @@ interface TestTypes {
 interface Viewport {
     name: string;
     styles: ViewportStyles;
-    type?: 'desktop' | 'mobile' | 'tablet' | 'other';
+    type?: ViewportType;
 }
+type ViewportType = 'desktop' | 'mobile' | 'tablet' | 'watch' | 'other';
 interface ViewportStyles {
     height: string;
     width: string;
@@ -524,7 +525,8 @@ interface ViewportStyles {
 type GlobalState = {
     /**
      * When set, the viewport is applied and cannot be changed using the toolbar. Must match the key
-     * of one of the available viewports.
+     * of one of the available viewports or follow the format '{width}-{height}', e.g. '320-480' which
+     * may include a unit (e.g. '100vw' or '100pct').
      */
     value: string | undefined;
     /**
@@ -671,8 +673,8 @@ interface InputType {
         category?: string;
         /** @see https://storybook.js.org/docs/api/arg-types#tabledefaultvalue */
         defaultValue?: {
-            summary?: string;
-            detail?: string;
+            summary?: string | undefined;
+            detail?: string | undefined;
         };
         /** @see https://storybook.js.org/docs/api/arg-types#tabledisable */
         disable?: boolean;
@@ -680,8 +682,8 @@ interface InputType {
         subcategory?: string;
         /** @see https://storybook.js.org/docs/api/arg-types#tabletype */
         type?: {
-            summary?: string;
-            detail?: string;
+            summary?: string | undefined;
+            detail?: string | undefined;
         };
     };
     /** @see https://storybook.js.org/docs/api/arg-types#type */

package/dist/csf/index.js

@@ -10,7 +10,7 @@ import {
   mountDestructured,
   normalizeArrays,
   normalizeProjectAnnotations
-} from "../_browser-chunks/chunk-BGSDJMFM.js";
+} from "../_browser-chunks/chunk-NVLTWT3B.js";
 import "../_browser-chunks/chunk-MEXTPDJG.js";
 import {
   Tag

package/dist/csf-tools/index.js

@@ -1,10 +1,10 @@
-import CJS_COMPAT_NODE_URL_xc3mu1pf9x from 'node:url';
-import CJS_COMPAT_NODE_PATH_xc3mu1pf9x from 'node:path';
-import CJS_COMPAT_NODE_MODULE_xc3mu1pf9x from "node:module";
+import CJS_COMPAT_NODE_URL_ekkdwuux1sk from 'node:url';
+import CJS_COMPAT_NODE_PATH_ekkdwuux1sk from 'node:path';
+import CJS_COMPAT_NODE_MODULE_ekkdwuux1sk from "node:module";
 
-var __filename = CJS_COMPAT_NODE_URL_xc3mu1pf9x.fileURLToPath(import.meta.url);
-var __dirname = CJS_COMPAT_NODE_PATH_xc3mu1pf9x.dirname(__filename);
-var require = CJS_COMPAT_NODE_MODULE_xc3mu1pf9x.createRequire(import.meta.url);
+var __filename = CJS_COMPAT_NODE_URL_ekkdwuux1sk.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_ekkdwuux1sk.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_ekkdwuux1sk.createRequire(import.meta.url);
 
 // ------------------------------------------------------------
 // end of CJS compatibility banner, injected by Storybook's esbuild configuration
@@ -38,10 +38,10 @@ import {
   vitestTransform,
   writeConfig,
   writeCsf
-} from "../_node-chunks/chunk-BIJENBOW.js";
-import "../_node-chunks/chunk-B3NH4IRY.js";
-import "../_node-chunks/chunk-2VHYFREG.js";
-import "../_node-chunks/chunk-KXFFKIVX.js";
+} from "../_node-chunks/chunk-SZWIX5YC.js";
+import "../_node-chunks/chunk-2BHD5YKF.js";
+import "../_node-chunks/chunk-QPKBPYOY.js";
+import "../_node-chunks/chunk-5KEIALUH.js";
 export {
   BadMetaError,
   ConfigFile,

package/dist/docs-tools/index.d.ts

@@ -15,8 +15,8 @@ interface JsDocTags {
     returns?: JsDocReturns | null;
 }
 interface PropSummaryValue {
-    summary?: string;
-    detail?: string;
+    summary?: string | undefined;
+    detail?: string | undefined;
 }
 type PropType = PropSummaryValue;
 type PropDefaultValue = PropSummaryValue;