@storybook/addon-docs 10.0.0-beta.1 → 10.0.0-beta.11

package/dist/blocks.js

@@ -4,10 +4,7 @@ import {
   getControlSetterButtonId,
   pickBy,
   uniq
-} from "./_browser-chunks/chunk-67KILNXL.js";
-import {
-  tocbot_default
-} from "./_browser-chunks/chunk-TQ5Q4DDG.js";
+} from "./_browser-chunks/chunk-ZK6NW3SW.js";
 import {
   EmptyBlock,
   Source,
@@ -47,10 +44,10 @@ var require_memoizerific = __commonJS({
       }
     })(function() {
       var define2, module2, exports2;
-      return (/* @__PURE__ */ __name(function e2(t2, n2, r2) {
+      return (/* @__PURE__ */ __name(function e2(t, n2, r2) {
         function s2(o3, u2) {
           if (!n2[o3]) {
-            if (!t2[o3]) {
+            if (!t[o3]) {
               var a2 = typeof __require == "function" && __require;
               if (!u2 && a2) return a2(o3, true);
               if (i2) return i2(o3, true);
@@ -58,10 +55,10 @@ var require_memoizerific = __commonJS({
               throw f2.code = "MODULE_NOT_FOUND", f2;
             }
             var l2 = n2[o3] = { exports: {} };
-            t2[o3][0].call(l2.exports, function(e3) {
-              var n3 = t2[o3][1][e3];
+            t[o3][0].call(l2.exports, function(e3) {
+              var n3 = t[o3][1][e3];
               return s2(n3 ? n3 : e3);
-            }, l2, l2.exports, e2, t2, n2, r2);
+            }, l2, l2.exports, e2, t, n2, r2);
           }
           return n2[o3].exports;
         }
@@ -259,7 +256,7 @@ var require_memoizerific = __commonJS({
 });
 
 // src/blocks/components/ArgsTable/ArgsTable.tsx
-import React33 from "react";
+import React34 from "react";
 import { once } from "storybook/internal/client-logger";
 import { IconButton as IconButton3, Link as Link3, ResetWrapper as ResetWrapper3 } from "storybook/internal/components";
 import { includeConditionalArg } from "storybook/internal/csf";
@@ -659,10 +656,108 @@ var DocsWrapper = styled.div(({ theme }) => ({
 var DocsPageWrapper = /* @__PURE__ */ __name(({ children, toc }) => React.createElement(DocsWrapper, { className: "sbdocs sbdocs-wrapper" }, toc, React.createElement(DocsContent, { className: "sbdocs sbdocs-content" }, children)), "DocsPageWrapper");
 
 // src/blocks/components/Preview.tsx
-import React5, { Children, useCallback, useState as useState2 } from "react";
+import React6, { Children, useCallback, useContext as useContext2, useState as useState3 } from "react";
 import { ActionBar, Zoom } from "storybook/internal/components";
 import { styled as styled4 } from "storybook/theming";
 
+// src/blocks/blocks/DocsContext.ts
+import { createContext } from "react";
+if (globalThis && globalThis.__DOCS_CONTEXT__ === void 0) {
+  globalThis.__DOCS_CONTEXT__ = createContext(null);
+  globalThis.__DOCS_CONTEXT__.displayName = "DocsContext";
+}
+var DocsContext = globalThis ? globalThis.__DOCS_CONTEXT__ : createContext(null);
+
+// src/blocks/blocks/Story.tsx
+import React2, { useContext } from "react";
+
+// src/blocks/blocks/useStory.ts
+import { useEffect, useState } from "react";
+function useStory(storyId, context) {
+  const stories = useStories([storyId], context);
+  return stories && stories[0];
+}
+__name(useStory, "useStory");
+function useStories(storyIds, context) {
+  const [storiesById, setStories] = useState({});
+  useEffect(() => {
+    Promise.all(
+      storyIds.map(async (storyId) => {
+        const story = await context.loadStory(storyId);
+        setStories(
+          (current) => current[storyId] === story ? current : { ...current, [storyId]: story }
+        );
+      })
+    );
+  });
+  return storyIds.map((storyId) => {
+    if (storiesById[storyId]) {
+      return storiesById[storyId];
+    }
+    try {
+      return context.storyById(storyId);
+    } catch (err) {
+      return void 0;
+    }
+  });
+}
+__name(useStories, "useStories");
+
+// src/blocks/blocks/Story.tsx
+var getStoryId = /* @__PURE__ */ __name((props, context) => {
+  const { of, meta } = props;
+  if ("of" in props && of === void 0) {
+    throw new Error("Unexpected `of={undefined}`, did you mistype a CSF file reference?");
+  }
+  if (meta) {
+    context.referenceMeta(meta, false);
+  }
+  const resolved = context.resolveOf(of || "story", ["story"]);
+  return resolved.story.id;
+}, "getStoryId");
+var getStoryProps = /* @__PURE__ */ __name((props, story, context) => {
+  const { parameters = {} } = story || {};
+  const { docs = {} } = parameters;
+  const storyParameters = docs.story || {};
+  if (docs.disable) {
+    return null;
+  }
+  const inline = props.inline ?? storyParameters.inline ?? false;
+  if (inline) {
+    const height2 = props.height ?? storyParameters.height;
+    const autoplay = props.autoplay ?? storyParameters.autoplay ?? false;
+    return {
+      story,
+      inline: true,
+      height: height2,
+      autoplay,
+      forceInitialArgs: !!props.__forceInitialArgs,
+      primary: !!props.__primary,
+      renderStoryToElement: context.renderStoryToElement
+    };
+  }
+  const height = props.height ?? storyParameters.height ?? storyParameters.iframeHeight ?? "100px";
+  return {
+    story,
+    inline: false,
+    height,
+    primary: !!props.__primary
+  };
+}, "getStoryProps");
+var Story2 = /* @__PURE__ */ __name((props = { __forceInitialArgs: false, __primary: false }) => {
+  const context = useContext(DocsContext);
+  const storyId = getStoryId(props, context);
+  const story = useStory(storyId, context);
+  if (!story) {
+    return React2.createElement(StorySkeleton, null);
+  }
+  const storyProps = getStoryProps(props, story, context);
+  if (!storyProps) {
+    return null;
+  }
+  return React2.createElement(Story, { ...storyProps });
+}, "Story");
+
 // src/blocks/components/BlockBackgroundStyles.tsx
 var getBlockBackgroundStyle = /* @__PURE__ */ __name((theme) => ({
   borderRadius: theme.appBorderRadius,
@@ -672,12 +767,12 @@ var getBlockBackgroundStyle = /* @__PURE__ */ __name((theme) => ({
 }), "getBlockBackgroundStyle");
 
 // src/blocks/components/Story.tsx
-import React3, { useEffect, useRef, useState } from "react";
+import React4, { useEffect as useEffect2, useRef, useState as useState2 } from "react";
 import { ErrorFormatter, Loader, getStoryHref } from "storybook/internal/components";
 import { styled as styled2 } from "storybook/theming";
 
 // src/blocks/components/IFrame.tsx
-import React2, { Component } from "react";
+import React3, { Component } from "react";
 var { window: globalWindow } = globalThis;
 var _IFrame = class _IFrame extends Component {
   constructor() {
@@ -705,7 +800,7 @@ var _IFrame = class _IFrame extends Component {
   }
   render() {
     const { id, title, src, allowFullScreen, scale, ...rest } = this.props;
-    return React2.createElement(
+    return React3.createElement(
       "iframe",
       {
         id,
@@ -722,8 +817,8 @@ __name(_IFrame, "IFrame");
 var IFrame = _IFrame;
 
 // src/blocks/components/ZoomContext.tsx
-import { createContext } from "react";
-var ZoomContext = createContext({
+import { createContext as createContext2 } from "react";
+var ZoomContext = createContext2({
   scale: 1
 });
 
@@ -733,10 +828,10 @@ var BASE_URL = PREVIEW_URL || "iframe.html";
 var storyBlockIdFromId = /* @__PURE__ */ __name(({ story, primary }) => `story--${story.id}${primary ? "--primary" : ""}`, "storyBlockIdFromId");
 var InlineStory = /* @__PURE__ */ __name((props) => {
   const storyRef = useRef();
-  const [showLoader, setShowLoader] = useState(true);
-  const [error, setError] = useState();
+  const [showLoader, setShowLoader] = useState2(true);
+  const [error, setError] = useState2();
   const { story, height, autoplay, forceInitialArgs, renderStoryToElement } = props;
-  useEffect(() => {
+  useEffect2(() => {
     if (!(story && storyRef.current)) {
       return () => {
       };
@@ -759,14 +854,14 @@ var InlineStory = /* @__PURE__ */ __name((props) => {
     };
   }, [autoplay, renderStoryToElement, story]);
   if (error) {
-    return React3.createElement("pre", null, React3.createElement(ErrorFormatter, { error }));
+    return React4.createElement("pre", null, React4.createElement(ErrorFormatter, { error }));
   }
-  return React3.createElement(React3.Fragment, null, height ? React3.createElement("style", null, `#${storyBlockIdFromId(
+  return React4.createElement(React4.Fragment, null, height ? React4.createElement("style", null, `#${storyBlockIdFromId(
     props
-  )} { min-height: ${height}; transform: translateZ(0); overflow: auto }`) : null, showLoader && React3.createElement(StorySkeleton, null), React3.createElement("div", { ref: storyRef, id: `${storyBlockIdFromId(props)}-inner`, "data-name": story.name }));
+  )} { min-height: ${height}; transform: translateZ(0); overflow: auto }`) : null, showLoader && React4.createElement(StorySkeleton, null), React4.createElement("div", { ref: storyRef, id: `${storyBlockIdFromId(props)}-inner`, "data-name": story.name }));
 }, "InlineStory");
-var IFrameStory = /* @__PURE__ */ __name(({ story, height = "500px" }) => React3.createElement("div", { style: { width: "100%", height } }, React3.createElement(ZoomContext.Consumer, null, ({ scale }) => {
-  return React3.createElement(
+var IFrameStory = /* @__PURE__ */ __name(({ story, height = "500px" }) => React4.createElement("div", { style: { width: "100%", height } }, React4.createElement(ZoomContext.Consumer, null, ({ scale }) => {
+  return React4.createElement(
     IFrame,
     {
       key: "iframe",
@@ -789,16 +884,16 @@ var ErrorMessage = styled2.strong(({ theme }) => ({
 var Story = /* @__PURE__ */ __name((props) => {
   const { inline, story } = props;
   if (inline && !props.autoplay && story.usesMount) {
-    return React3.createElement(ErrorMessage, null, "This story mounts inside of play. Set", " ", React3.createElement("a", { href: "https://storybook.js.org/docs/api/doc-blocks/doc-block-story?ref=ui#autoplay" }, "autoplay"), " ", "to true to view this story.");
+    return React4.createElement(ErrorMessage, null, "This story mounts inside of play. Set", " ", React4.createElement("a", { href: "https://storybook.js.org/docs/api/doc-blocks/doc-block-story?ref=ui#autoplay" }, "autoplay"), " ", "to true to view this story.");
   }
-  return React3.createElement("div", { id: storyBlockIdFromId(props), className: "sb-story sb-unstyled", "data-story-block": "true" }, inline ? React3.createElement(InlineStory, { ...props }) : React3.createElement(IFrameStory, { ...props }));
+  return React4.createElement("div", { id: storyBlockIdFromId(props), className: "sb-story sb-unstyled", "data-story-block": "true" }, inline ? React4.createElement(InlineStory, { ...props }) : React4.createElement(IFrameStory, { ...props }));
 }, "Story");
-var StorySkeleton = /* @__PURE__ */ __name(() => React3.createElement(Loader, null), "StorySkeleton");
+var StorySkeleton = /* @__PURE__ */ __name(() => React4.createElement(Loader, null), "StorySkeleton");
 
 // src/blocks/components/Toolbar.tsx
-import React4 from "react";
-import { FlexBar, IconButton } from "storybook/internal/components";
-import { ZoomIcon, ZoomOutIcon, ZoomResetIcon } from "@storybook/icons";
+import React5 from "react";
+import { FlexBar, IconButton, getStoryHref as getStoryHref2 } from "storybook/internal/components";
+import { ShareAltIcon, ZoomIcon, ZoomOutIcon, ZoomResetIcon } from "@storybook/icons";
 import { styled as styled3 } from "storybook/theming";
 var Bar = styled3(FlexBar)({
   position: "absolute",
@@ -827,7 +922,7 @@ var Toolbar = /* @__PURE__ */ __name(({
   zoom,
   resetZoom,
   ...rest
-}) => React4.createElement(Bar, { ...rest }, React4.createElement(Wrapper, { key: "left" }, isLoading ? [1, 2, 3].map((key) => React4.createElement(IconPlaceholder, { key })) : React4.createElement(React4.Fragment, null, React4.createElement(
+}) => React5.createElement(Bar, { ...rest }, React5.createElement(Wrapper, { key: "left" }, isLoading ? [1, 2, 3].map((key) => React5.createElement(IconPlaceholder, { key })) : React5.createElement(React5.Fragment, null, React5.createElement(
   IconButton,
   {
     key: "zoomin",
@@ -837,8 +932,8 @@ var Toolbar = /* @__PURE__ */ __name(({
     },
     title: "Zoom in"
   },
-  React4.createElement(ZoomIcon, null)
-), React4.createElement(
+  React5.createElement(ZoomIcon, null)
+), React5.createElement(
   IconButton,
   {
     key: "zoomout",
@@ -848,8 +943,8 @@ var Toolbar = /* @__PURE__ */ __name(({
     },
     title: "Zoom out"
   },
-  React4.createElement(ZoomOutIcon, null)
-), React4.createElement(
+  React5.createElement(ZoomOutIcon, null)
+), React5.createElement(
   IconButton,
   {
     key: "zoomreset",
@@ -859,7 +954,16 @@ var Toolbar = /* @__PURE__ */ __name(({
     },
     title: "Reset zoom"
   },
-  React4.createElement(ZoomResetIcon, null)
+  React5.createElement(ZoomResetIcon, null)
+))), isLoading ? React5.createElement(Wrapper, { key: "right" }, React5.createElement(IconPlaceholder, null)) : baseUrl && storyId && React5.createElement(Wrapper, { key: "right" }, React5.createElement(IconButton, { key: "opener", asChild: true }, React5.createElement(
+  "a",
+  {
+    href: getStoryHref2(baseUrl, storyId),
+    target: "_blank",
+    rel: "noopener noreferrer",
+    "aria-label": "Open canvas in new tab"
+  },
+  React5.createElement(ShareAltIcon, null)
 )))), "Toolbar");
 
 // src/blocks/components/Preview.tsx
@@ -937,7 +1041,7 @@ var getSource = /* @__PURE__ */ __name((withSource, expanded, setExpanded) => {
     }
     case expanded: {
       return {
-        source: React5.createElement(StyledSource, { ...withSource, dark: true }),
+        source: React6.createElement(StyledSource, { ...withSource, dark: true }),
         actionItem: {
           title: "Hide code",
           className: "docblock-code-toggle docblock-code-toggle--expanded",
@@ -947,7 +1051,7 @@ var getSource = /* @__PURE__ */ __name((withSource, expanded, setExpanded) => {
     }
     default: {
       return {
-        source: React5.createElement(StyledSource, { ...withSource, dark: true }),
+        source: React6.createElement(StyledSource, { ...withSource, dark: true }),
         actionItem: {
           title: "Show code",
           className: "docblock-code-toggle",
@@ -957,16 +1061,16 @@ var getSource = /* @__PURE__ */ __name((withSource, expanded, setExpanded) => {
     }
   }
 }, "getSource");
-function getStoryId(children) {
+function getChildProps(children) {
   if (Children.count(children) === 1) {
     const elt = children;
     if (elt.props) {
-      return elt.props.id;
+      return elt.props;
     }
   }
   return null;
 }
-__name(getStoryId, "getStoryId");
+__name(getChildProps, "getChildProps");
 var PositionedToolbar = styled4(Toolbar)({
   position: "absolute",
   top: 0,
@@ -992,16 +1096,17 @@ var Preview = /* @__PURE__ */ __name(({
   inline = false,
   ...props
 }) => {
-  const [expanded, setExpanded] = useState2(isExpanded);
+  const [expanded, setExpanded] = useState3(isExpanded);
   const { source, actionItem } = getSource(withSource, expanded, setExpanded);
-  const [scale, setScale] = useState2(1);
+  const [scale, setScale] = useState3(1);
   const previewClasses = [className].concat(["sbdocs", "sbdocs-preview", "sb-unstyled"]);
   const defaultActionItems = withSource ? [actionItem] : [];
-  const [additionalActionItems, setAdditionalActionItems] = useState2(
+  const [additionalActionItems, setAdditionalActionItems] = useState3(
     additionalActions ? [...additionalActions] : []
   );
   const actionItems = [...defaultActionItems, ...additionalActionItems];
   const { window: globalWindow4 } = globalThis;
+  const context = useContext2(DocsContext);
   const copyToClipboard = useCallback(async (text) => {
     const { createCopyToClipboardFunction } = await import("storybook/internal/components");
     createCopyToClipboardFunction();
@@ -1031,25 +1136,26 @@ var Preview = /* @__PURE__ */ __name(({
       });
     }
   }, "onCopyCapture");
-  return React5.createElement(
+  const childProps = getChildProps(children);
+  return React6.createElement(
     PreviewContainer,
     {
       ...{ withSource, withToolbar },
       ...props,
       className: previewClasses.join(" ")
     },
-    withToolbar && React5.createElement(
+    withToolbar && React6.createElement(
       PositionedToolbar,
       {
         isLoading,
         border: true,
         zoom: (z2) => setScale(scale * z2),
         resetZoom: () => setScale(1),
-        storyId: getStoryId(children),
+        storyId: !isLoading && childProps ? getStoryId(childProps, context) : void 0,
         baseUrl: "./iframe.html"
       }
     ),
-    React5.createElement(ZoomContext.Provider, { value: { scale } }, React5.createElement(Relative, { className: "docs-story", onCopyCapture: withSource && onCopyCapture }, React5.createElement(
+    React6.createElement(ZoomContext.Provider, { value: { scale } }, React6.createElement(Relative, { className: "docs-story", onCopyCapture: withSource && onCopyCapture }, React6.createElement(
       ChildrenContainer,
       {
         isColumn: isColumn || !Array.isArray(children),
@@ -1057,8 +1163,8 @@ var Preview = /* @__PURE__ */ __name(({
         layout,
         inline
       },
-      React5.createElement(Zoom.Element, { centered: layout === "centered", scale: inline ? scale : 1 }, Array.isArray(children) ? children.map((child, i2) => React5.createElement("div", { key: i2 }, child)) : React5.createElement("div", null, children))
-    ), React5.createElement(ActionBar, { actionItems }))),
+      React6.createElement(Zoom.Element, { centered: layout === "centered", scale: inline ? scale : 1 }, Array.isArray(children) ? children.map((child, i2) => React6.createElement("div", { key: i2 }, child)) : React6.createElement("div", null, children))
+    ), React6.createElement(ActionBar, { actionItems }))),
     withSource && expanded && source
   );
 }, "Preview");
@@ -1070,24 +1176,24 @@ var StyledPreview = styled4(Preview)(() => ({
 }));
 
 // src/blocks/components/ArgsTable/TabbedArgsTable.tsx
-import React6 from "react";
+import React7 from "react";
 import { TabsState } from "storybook/internal/components";
 var TabbedArgsTable = /* @__PURE__ */ __name(({ tabs, ...props }) => {
   const entries = Object.entries(tabs);
   if (entries.length === 1) {
-    return React6.createElement(ArgsTable, { ...entries[0][1], ...props });
+    return React7.createElement(ArgsTable, { ...entries[0][1], ...props });
   }
-  return React6.createElement(TabsState, null, entries.map((entry, index) => {
+  return React7.createElement(TabsState, null, entries.map((entry, index) => {
     const [label, table] = entry;
     const id = `prop_table_div_${label}`;
     const Component4 = "div";
     const argsTableProps = index === 0 ? props : { sort: props.sort };
-    return React6.createElement(Component4, { key: id, id, title: label }, ({ active }) => active ? React6.createElement(ArgsTable, { key: `prop_table_${label}`, ...table, ...argsTableProps }) : null);
+    return React7.createElement(Component4, { key: id, id, title: label }, ({ active }) => active ? React7.createElement(ArgsTable, { key: `prop_table_${label}`, ...table, ...argsTableProps }) : null);
   }));
 }, "TabbedArgsTable");
 
 // src/blocks/components/Typeset.tsx
-import React7 from "react";
+import React8 from "react";
 import { withReset as withReset2 } from "storybook/internal/components";
 import { styled as styled5 } from "storybook/theming";
 var Label = styled5.div(({ theme }) => ({
@@ -1117,7 +1223,7 @@ var Typeset = /* @__PURE__ */ __name(({
   fontWeight,
   sampleText,
   ...props
-}) => React7.createElement(Wrapper2, { ...props, className: "docblock-typeset sb-unstyled" }, fontSizes.map((size) => React7.createElement(TypeSpecimen, { key: size }, React7.createElement(Label, null, size), React7.createElement(
+}) => React8.createElement(Wrapper2, { ...props, className: "docblock-typeset sb-unstyled" }, fontSizes.map((size) => React8.createElement(TypeSpecimen, { key: size }, React8.createElement(Label, null, size), React8.createElement(
   Sample,
   {
     style: {
@@ -1131,7 +1237,7 @@ var Typeset = /* @__PURE__ */ __name(({
 )))), "Typeset");
 
 // src/blocks/components/ColorPalette.tsx
-import React8 from "react";
+import React9 from "react";
 import { ResetWrapper } from "storybook/internal/components";
 import { styled as styled6 } from "storybook/theming";
 var ItemTitle = styled6.div(({ theme }) => ({
@@ -1230,16 +1336,16 @@ var List = styled6.div(({ theme }) => ({
   flexDirection: "column"
 }));
 function renderSwatch(color, index) {
-  return React8.createElement(Swatch, { key: `${color}-${index}`, title: color, background: color });
+  return React9.createElement(Swatch, { key: `${color}-${index}`, title: color, background: color });
 }
 __name(renderSwatch, "renderSwatch");
 function renderSwatchLabel(color, index, colorDescription) {
-  return React8.createElement(SwatchLabel, { key: `${color}-${index}`, title: color }, React8.createElement("div", null, color, colorDescription && React8.createElement("span", null, colorDescription)));
+  return React9.createElement(SwatchLabel, { key: `${color}-${index}`, title: color }, React9.createElement("div", null, color, colorDescription && React9.createElement("span", null, colorDescription)));
 }
 __name(renderSwatchLabel, "renderSwatchLabel");
 function renderSwatchSpecimen(colors) {
   if (Array.isArray(colors)) {
-    return React8.createElement(SwatchSpecimen, null, React8.createElement(SwatchColors, null, colors.map((color, index) => renderSwatch(color, index))), React8.createElement(SwatchLabels, null, colors.map((color, index) => renderSwatchLabel(color, index))));
+    return React9.createElement(SwatchSpecimen, null, React9.createElement(SwatchColors, null, colors.map((color, index) => renderSwatch(color, index))), React9.createElement(SwatchLabels, null, colors.map((color, index) => renderSwatchLabel(color, index))));
   }
   const swatchElements = [];
   const labelElements = [];
@@ -1248,16 +1354,16 @@ function renderSwatchSpecimen(colors) {
     swatchElements.push(renderSwatch(colorValue, swatchElements.length));
     labelElements.push(renderSwatchLabel(colorKey, labelElements.length, colorValue));
   }
-  return React8.createElement(SwatchSpecimen, null, React8.createElement(SwatchColors, null, swatchElements), React8.createElement(SwatchLabels, null, labelElements));
+  return React9.createElement(SwatchSpecimen, null, React9.createElement(SwatchColors, null, swatchElements), React9.createElement(SwatchLabels, null, labelElements));
 }
 __name(renderSwatchSpecimen, "renderSwatchSpecimen");
 var ColorItem = /* @__PURE__ */ __name(({ title, subtitle, colors }) => {
-  return React8.createElement(Item, null, React8.createElement(ItemDescription, null, React8.createElement(ItemTitle, null, title), React8.createElement(ItemSubtitle, null, subtitle)), React8.createElement(Swatches, null, renderSwatchSpecimen(colors)));
+  return React9.createElement(Item, null, React9.createElement(ItemDescription, null, React9.createElement(ItemTitle, null, title), React9.createElement(ItemSubtitle, null, subtitle)), React9.createElement(Swatches, null, renderSwatchSpecimen(colors)));
 }, "ColorItem");
-var ColorPalette = /* @__PURE__ */ __name(({ children, ...props }) => React8.createElement(ResetWrapper, null, React8.createElement(List, { ...props, className: "docblock-colorpalette sb-unstyled" }, React8.createElement(ListHeading, null, React8.createElement(ListName, null, "Name"), React8.createElement(ListSwatches, null, "Swatches")), children)), "ColorPalette");
+var ColorPalette = /* @__PURE__ */ __name(({ children, ...props }) => React9.createElement(ResetWrapper, null, React9.createElement(List, { ...props, className: "docblock-colorpalette sb-unstyled" }, React9.createElement(ListHeading, null, React9.createElement(ListName, null, "Name"), React9.createElement(ListSwatches, null, "Swatches")), children)), "ColorPalette");
 
 // src/blocks/components/IconGallery.tsx
-import React9 from "react";
+import React10 from "react";
 import { ResetWrapper as ResetWrapper2 } from "storybook/internal/components";
 import { styled as styled7 } from "storybook/theming";
 var ItemLabel = styled7.div(({ theme }) => ({
@@ -1300,13 +1406,843 @@ var List2 = styled7.div({
   gridAutoFlow: "row dense",
   gridAutoRows: 50
 });
-var IconItem = /* @__PURE__ */ __name(({ name, children }) => React9.createElement(Item2, null, React9.createElement(ItemSpecimen, null, children), React9.createElement(ItemLabel, null, name)), "IconItem");
-var IconGallery = /* @__PURE__ */ __name(({ children, ...props }) => React9.createElement(ResetWrapper2, null, React9.createElement(List2, { ...props, className: "docblock-icongallery sb-unstyled" }, children)), "IconGallery");
+var IconItem = /* @__PURE__ */ __name(({ name, children }) => React10.createElement(Item2, null, React10.createElement(ItemSpecimen, null, children), React10.createElement(ItemLabel, null, name)), "IconItem");
+var IconGallery = /* @__PURE__ */ __name(({ children, ...props }) => React10.createElement(ResetWrapper2, null, React10.createElement(List2, { ...props, className: "docblock-icongallery sb-unstyled" }, children)), "IconGallery");
 
 // src/blocks/components/TableOfContents.tsx
-import React10, { useEffect as useEffect2, useId } from "react";
+import React11, { useEffect as useEffect3, useId } from "react";
 import { NAVIGATE_URL } from "storybook/internal/core-events";
 import { styled as styled8 } from "storybook/theming";
+
+// ../../node_modules/tocbot/src/js/build-html.js
+function build_html_default(options) {
+  const forEach = [].forEach;
+  const some = [].some;
+  const body = typeof window !== "undefined" && document.body;
+  const SPACE_CHAR = " ";
+  let tocElement;
+  let currentlyHighlighting = true;
+  let eventCount = 0;
+  function createEl(d2, container) {
+    const link = container.appendChild(createLink(d2));
+    if (d2.children.length) {
+      const list = createList(d2.isCollapsed);
+      d2.children.forEach((child) => {
+        createEl(child, list);
+      });
+      link.appendChild(list);
+    }
+  }
+  __name(createEl, "createEl");
+  function render(parent, data) {
+    const collapsed = false;
+    const container = createList(collapsed);
+    data.forEach((d2) => {
+      createEl(d2, container);
+    });
+    tocElement = parent || tocElement;
+    if (tocElement === null) {
+      return;
+    }
+    if (tocElement.firstChild) {
+      tocElement.removeChild(tocElement.firstChild);
+    }
+    if (data.length === 0) {
+      return tocElement;
+    }
+    return tocElement.appendChild(container);
+  }
+  __name(render, "render");
+  function createLink(data) {
+    const item = document.createElement("li");
+    const a2 = document.createElement("a");
+    if (options.listItemClass) {
+      item.setAttribute("class", options.listItemClass);
+    }
+    if (options.onClick) {
+      a2.onclick = options.onClick;
+    }
+    if (options.includeTitleTags) {
+      a2.setAttribute("title", data.textContent);
+    }
+    if (options.includeHtml && data.childNodes.length) {
+      forEach.call(data.childNodes, (node) => {
+        a2.appendChild(node.cloneNode(true));
+      });
+    } else {
+      a2.textContent = data.textContent;
+    }
+    a2.setAttribute("href", `${options.basePath}#${data.id}`);
+    a2.setAttribute(
+      "class",
+      `${options.linkClass + SPACE_CHAR}node-name--${data.nodeName}${SPACE_CHAR}${options.extraLinkClasses}`
+    );
+    item.appendChild(a2);
+    return item;
+  }
+  __name(createLink, "createLink");
+  function createList(isCollapsed) {
+    const listElement = options.orderedList ? "ol" : "ul";
+    const list = document.createElement(listElement);
+    let classes = options.listClass + SPACE_CHAR + options.extraListClasses;
+    if (isCollapsed) {
+      classes = classes + SPACE_CHAR + options.collapsibleClass;
+      classes = classes + SPACE_CHAR + options.isCollapsedClass;
+    }
+    list.setAttribute("class", classes);
+    return list;
+  }
+  __name(createList, "createList");
+  function updateFixedSidebarClass() {
+    const scrollTop = getScrollTop();
+    const posFixedEl = document.querySelector(options.positionFixedSelector);
+    if (options.fixedSidebarOffset === "auto") {
+      options.fixedSidebarOffset = tocElement.offsetTop;
+    }
+    if (scrollTop > options.fixedSidebarOffset) {
+      if (posFixedEl.className.indexOf(options.positionFixedClass) === -1) {
+        posFixedEl.className += SPACE_CHAR + options.positionFixedClass;
+      }
+    } else {
+      posFixedEl.className = posFixedEl.className.replace(
+        SPACE_CHAR + options.positionFixedClass,
+        ""
+      );
+    }
+  }
+  __name(updateFixedSidebarClass, "updateFixedSidebarClass");
+  function getHeadingTopPos(obj) {
+    let position = 0;
+    if (obj !== null) {
+      position = obj.offsetTop;
+      if (options.hasInnerContainers) {
+        position += getHeadingTopPos(obj.offsetParent);
+      }
+    }
+    return position;
+  }
+  __name(getHeadingTopPos, "getHeadingTopPos");
+  function updateClassname(obj, className) {
+    if (obj && obj.className !== className) {
+      obj.className = className;
+    }
+    return obj;
+  }
+  __name(updateClassname, "updateClassname");
+  function updateToc(headingsArray, event) {
+    if (options.positionFixedSelector) {
+      updateFixedSidebarClass();
+    }
+    const headings = headingsArray;
+    const clickedHref = event?.target?.getAttribute ? event?.target?.getAttribute("href") : null;
+    const isBottomMode = clickedHref && clickedHref.charAt(0) === "#" ? getIsHeaderBottomMode(clickedHref.replace("#", "")) : false;
+    const shouldUpdate = currentlyHighlighting || isBottomMode;
+    if (event && eventCount < 5) {
+      eventCount++;
+    }
+    if (shouldUpdate && !!tocElement && headings.length > 0) {
+      const topHeader = getTopHeader(headings);
+      const oldActiveTocLink = tocElement.querySelector(
+        `.${options.activeLinkClass}`
+      );
+      const topHeaderId = topHeader.id.replace(
+        /([ #;&,.+*~':"!^$[\]()=>|/\\@])/g,
+        "\\$1"
+      );
+      const hashId = window.location.hash.replace("#", "");
+      let activeId = topHeaderId;
+      const isPageBottomMode = getIsPageBottomMode();
+      if (clickedHref && isBottomMode) {
+        activeId = clickedHref.replace("#", "");
+      } else if (hashId && hashId !== topHeaderId && isPageBottomMode && (getIsHeaderBottomMode(topHeaderId) || eventCount <= 2)) {
+        activeId = hashId;
+      }
+      const activeTocLink = tocElement.querySelector(
+        `.${options.linkClass}[href="${options.basePath}#${activeId}"]`
+      );
+      if (oldActiveTocLink === activeTocLink) {
+        return;
+      }
+      const tocLinks = tocElement.querySelectorAll(`.${options.linkClass}`);
+      forEach.call(tocLinks, (tocLink) => {
+        updateClassname(
+          tocLink,
+          tocLink.className.replace(SPACE_CHAR + options.activeLinkClass, "")
+        );
+      });
+      const tocLis = tocElement.querySelectorAll(`.${options.listItemClass}`);
+      forEach.call(tocLis, (tocLi) => {
+        updateClassname(
+          tocLi,
+          tocLi.className.replace(SPACE_CHAR + options.activeListItemClass, "")
+        );
+      });
+      if (activeTocLink && activeTocLink.className.indexOf(options.activeLinkClass) === -1) {
+        activeTocLink.className += SPACE_CHAR + options.activeLinkClass;
+      }
+      const li = activeTocLink?.parentNode;
+      if (li && li.className.indexOf(options.activeListItemClass) === -1) {
+        li.className += SPACE_CHAR + options.activeListItemClass;
+      }
+      const tocLists = tocElement.querySelectorAll(
+        `.${options.listClass}.${options.collapsibleClass}`
+      );
+      forEach.call(tocLists, (list) => {
+        if (list.className.indexOf(options.isCollapsedClass) === -1) {
+          list.className += SPACE_CHAR + options.isCollapsedClass;
+        }
+      });
+      if (activeTocLink?.nextSibling && activeTocLink.nextSibling.className.indexOf(
+        options.isCollapsedClass
+      ) !== -1) {
+        updateClassname(
+          activeTocLink.nextSibling,
+          activeTocLink.nextSibling.className.replace(
+            SPACE_CHAR + options.isCollapsedClass,
+            ""
+          )
+        );
+      }
+      removeCollapsedFromParents(activeTocLink?.parentNode.parentNode);
+    }
+  }
+  __name(updateToc, "updateToc");
+  function removeCollapsedFromParents(element) {
+    if (element && element.className.indexOf(options.collapsibleClass) !== -1 && element.className.indexOf(options.isCollapsedClass) !== -1) {
+      updateClassname(
+        element,
+        element.className.replace(SPACE_CHAR + options.isCollapsedClass, "")
+      );
+      return removeCollapsedFromParents(element.parentNode.parentNode);
+    }
+    return element;
+  }
+  __name(removeCollapsedFromParents, "removeCollapsedFromParents");
+  function disableTocAnimation(event) {
+    const target = event.target || event.srcElement;
+    if (typeof target.className !== "string" || target.className.indexOf(options.linkClass) === -1) {
+      return;
+    }
+    currentlyHighlighting = false;
+  }
+  __name(disableTocAnimation, "disableTocAnimation");
+  function enableTocAnimation() {
+    currentlyHighlighting = true;
+  }
+  __name(enableTocAnimation, "enableTocAnimation");
+  function getCurrentlyHighlighting() {
+    return currentlyHighlighting;
+  }
+  __name(getCurrentlyHighlighting, "getCurrentlyHighlighting");
+  function getIsHeaderBottomMode(headerId) {
+    const scrollEl = getScrollEl();
+    const activeHeading = document?.getElementById(headerId);
+    const isBottomMode = activeHeading.offsetTop > scrollEl.offsetHeight - scrollEl.clientHeight * 1.4 - options.bottomModeThreshold;
+    return isBottomMode;
+  }
+  __name(getIsHeaderBottomMode, "getIsHeaderBottomMode");
+  function getIsPageBottomMode() {
+    const scrollEl = getScrollEl();
+    const isScrollable = scrollEl.scrollHeight > scrollEl.clientHeight;
+    const isBottomMode = getScrollTop() + scrollEl.clientHeight > scrollEl.offsetHeight - options.bottomModeThreshold;
+    return isScrollable && isBottomMode;
+  }
+  __name(getIsPageBottomMode, "getIsPageBottomMode");
+  function getScrollEl() {
+    let el;
+    if (options.scrollContainer && document.querySelector(options.scrollContainer)) {
+      el = document.querySelector(options.scrollContainer);
+    } else {
+      el = document.documentElement || body;
+    }
+    return el;
+  }
+  __name(getScrollEl, "getScrollEl");
+  function getScrollTop() {
+    const el = getScrollEl();
+    return el?.scrollTop || 0;
+  }
+  __name(getScrollTop, "getScrollTop");
+  function getTopHeader(headings, scrollTop = getScrollTop()) {
+    let topHeader;
+    some.call(headings, (heading, i2) => {
+      if (getHeadingTopPos(heading) > scrollTop + options.headingsOffset + 10) {
+        const index = i2 === 0 ? i2 : i2 - 1;
+        topHeader = headings[index];
+        return true;
+      }
+      if (i2 === headings.length - 1) {
+        topHeader = headings[headings.length - 1];
+        return true;
+      }
+    });
+    return topHeader;
+  }
+  __name(getTopHeader, "getTopHeader");
+  function updateUrlHashForHeader(headingsArray) {
+    const scrollTop = getScrollTop();
+    const topHeader = getTopHeader(headingsArray, scrollTop);
+    const isPageBottomMode = getIsPageBottomMode();
+    if ((!topHeader || scrollTop < 5) && !isPageBottomMode) {
+      if (!(window.location.hash === "#" || window.location.hash === "")) {
+        window.history.pushState(null, null, "#");
+      }
+    } else if (topHeader && !isPageBottomMode) {
+      const newHash = `#${topHeader.id}`;
+      if (window.location.hash !== newHash) {
+        window.history.pushState(null, null, newHash);
+      }
+    }
+  }
+  __name(updateUrlHashForHeader, "updateUrlHashForHeader");
+  return {
+    enableTocAnimation,
+    disableTocAnimation,
+    render,
+    updateToc,
+    getCurrentlyHighlighting,
+    getTopHeader,
+    getScrollTop,
+    updateUrlHashForHeader
+  };
+}
+__name(build_html_default, "default");
+
+// ../../node_modules/tocbot/src/js/default-options.js
+var default_options_default = {
+  // Where to render the table of contents.
+  tocSelector: ".js-toc",
+  // Or, you can pass in a DOM node instead
+  tocElement: null,
+  // Where to grab the headings to build the table of contents.
+  contentSelector: ".js-toc-content",
+  // Or, you can pass in a DOM node instead
+  contentElement: null,
+  // Which headings to grab inside of the contentSelector element.
+  headingSelector: "h1, h2, h3",
+  // Headings that match the ignoreSelector will be skipped.
+  ignoreSelector: ".js-toc-ignore",
+  // For headings inside relative or absolute positioned
+  // containers within content.
+  hasInnerContainers: false,
+  // Main class to add to links.
+  linkClass: "toc-link",
+  // Extra classes to add to links.
+  extraLinkClasses: "",
+  // Class to add to active links,
+  // the link corresponding to the top most heading on the page.
+  activeLinkClass: "is-active-link",
+  // Main class to add to lists.
+  listClass: "toc-list",
+  // Extra classes to add to lists.
+  extraListClasses: "",
+  // Class that gets added when a list should be collapsed.
+  isCollapsedClass: "is-collapsed",
+  // Class that gets added when a list should be able
+  // to be collapsed but isn't necessarily collapsed.
+  collapsibleClass: "is-collapsible",
+  // Class to add to list items.
+  listItemClass: "toc-list-item",
+  // Class to add to active list items.
+  activeListItemClass: "is-active-li",
+  // How many heading levels should not be collapsed.
+  // For example, number 6 will show everything since
+  // there are only 6 heading levels and number 0 will collapse them all.
+  // The sections that are hidden will open
+  // and close as you scroll to headings within them.
+  collapseDepth: 0,
+  // Smooth scrolling enabled.
+  scrollSmooth: true,
+  // Smooth scroll duration.
+  scrollSmoothDuration: 420,
+  // Smooth scroll offset.
+  scrollSmoothOffset: 0,
+  // Callback for scroll end.
+  scrollEndCallback: /* @__PURE__ */ __name(function(e2) {
+  }, "scrollEndCallback"),
+  // Headings offset between the headings and the top of
+  // the document (this is meant for minor adjustments).
+  headingsOffset: 1,
+  // Enable the URL hash to update with the proper heading ID as
+  // a user scrolls the page.
+  enableUrlHashUpdateOnScroll: false,
+  // type of scroll handler to use. to make scroll event not too rapid.
+  // Options are: "debounce" or "throttle"
+  // when set auto , use debounce less than 333ms , other use throttle.
+  // for ios browser can't use history.pushState() more than 100 times per 30 seconds reason
+  scrollHandlerType: "auto",
+  //  scrollHandler delay in ms.
+  scrollHandlerTimeout: 50,
+  // Timeout between events firing to make sure it's
+  // not too rapid (for performance reasons).
+  throttleTimeout: 50,
+  // Element to add the positionFixedClass to.
+  positionFixedSelector: null,
+  // Fixed position class to add to make sidebar fixed after scrolling
+  // down past the fixedSidebarOffset.
+  positionFixedClass: "is-position-fixed",
+  // fixedSidebarOffset can be any number but by default is set
+  // to auto which sets the fixedSidebarOffset to the sidebar
+  // element's offsetTop from the top of the document on init.
+  fixedSidebarOffset: "auto",
+  // includeHtml can be set to true to include the HTML markup from the
+  // heading node instead of just including the innerText.
+  includeHtml: false,
+  // includeTitleTags automatically sets the html title tag of the link
+  // to match the title. This can be useful for SEO purposes or
+  // when truncating titles.
+  includeTitleTags: false,
+  // onclick function to apply to all links in toc. will be called with
+  // the event as the first parameter, and this can be used to stop,
+  // propagation, prevent default or perform action
+  onClick: /* @__PURE__ */ __name(function(e2) {
+  }, "onClick"),
+  // orderedList can be set to false to generate unordered lists (ul)
+  // instead of ordered lists (ol)
+  orderedList: true,
+  // If there is a fixed article scroll container, set to calculate offset.
+  scrollContainer: null,
+  // prevent ToC DOM rendering if it's already rendered by an external system.
+  skipRendering: false,
+  // Optional callback to change heading labels.
+  // For example it can be used to cut down and put ellipses on multiline headings you deem too long.
+  // Called each time a heading is parsed. Expects a string and returns the modified label to display.
+  // Additionally, the attribute `data-heading-label` may be used on a heading to specify
+  // a shorter string to be used in the TOC.
+  // function (string) => string
+  headingLabelCallback: false,
+  // ignore headings that are hidden in DOM
+  ignoreHiddenElements: false,
+  // Optional callback to modify properties of parsed headings.
+  // The heading element is passed in node parameter and information
+  // parsed by default parser is provided in obj parameter.
+  // Function has to return the same or modified obj.
+  // The heading will be excluded from TOC if nothing is returned.
+  // function (object, HTMLElement) => object | void
+  headingObjectCallback: null,
+  // Set the base path, useful if you use a `base` tag in `head`.
+  basePath: "",
+  // Only takes affect when `tocSelector` is scrolling,
+  // keep the toc scroll position in sync with the content.
+  disableTocScrollSync: false,
+  // If this is null then just use `tocElement` or `tocSelector` instead
+  // assuming `disableTocScrollSync` is set to false. This allows for
+  // scrolling an outer element (like a nav panel w/ search) containing the toc.
+  // Please pass an element, not a selector here.
+  tocScrollingWrapper: null,
+  // Offset for the toc scroll (top) position when scrolling the page.
+  // Only effective if `disableTocScrollSync` is false.
+  tocScrollOffset: 30,
+  // Threshold for when bottom mode should be enabled to handle
+  // highlighting links that cannot be scrolled to.
+  bottomModeThreshold: 30
+};
+
+// ../../node_modules/tocbot/src/js/parse-content.js
+function parseContent(options) {
+  const reduce = [].reduce;
+  function getLastItem(array2) {
+    return array2[array2.length - 1];
+  }
+  __name(getLastItem, "getLastItem");
+  function getHeadingLevel(heading) {
+    return +heading.nodeName.toUpperCase().replace("H", "");
+  }
+  __name(getHeadingLevel, "getHeadingLevel");
+  function isHTMLElement(maybeElement) {
+    try {
+      return maybeElement instanceof window.HTMLElement || maybeElement instanceof window.parent.HTMLElement;
+    } catch (e2) {
+      return maybeElement instanceof window.HTMLElement;
+    }
+  }
+  __name(isHTMLElement, "isHTMLElement");
+  function getHeadingObject(heading) {
+    if (!isHTMLElement(heading)) return heading;
+    if (options.ignoreHiddenElements && (!heading.offsetHeight || !heading.offsetParent)) {
+      return null;
+    }
+    const headingLabel = heading.getAttribute("data-heading-label") || (options.headingLabelCallback ? String(options.headingLabelCallback(heading.innerText)) : (heading.innerText || heading.textContent).trim());
+    const obj = {
+      id: heading.id,
+      children: [],
+      nodeName: heading.nodeName,
+      headingLevel: getHeadingLevel(heading),
+      textContent: headingLabel
+    };
+    if (options.includeHtml) {
+      obj.childNodes = heading.childNodes;
+    }
+    if (options.headingObjectCallback) {
+      return options.headingObjectCallback(obj, heading);
+    }
+    return obj;
+  }
+  __name(getHeadingObject, "getHeadingObject");
+  function addNode(node, nest) {
+    const obj = getHeadingObject(node);
+    const level = obj.headingLevel;
+    let array2 = nest;
+    let lastItem = getLastItem(array2);
+    const lastItemLevel = lastItem ? lastItem.headingLevel : 0;
+    let counter = level - lastItemLevel;
+    while (counter > 0) {
+      lastItem = getLastItem(array2);
+      if (lastItem && level === lastItem.headingLevel) {
+        break;
+      } else if (lastItem && lastItem.children !== void 0) {
+        array2 = lastItem.children;
+      }
+      counter--;
+    }
+    if (level >= options.collapseDepth) {
+      obj.isCollapsed = true;
+    }
+    array2.push(obj);
+    return array2;
+  }
+  __name(addNode, "addNode");
+  function selectHeadings(contentElement, headingSelector) {
+    let selectors = headingSelector;
+    if (options.ignoreSelector) {
+      selectors = headingSelector.split(",").map(/* @__PURE__ */ __name(function mapSelectors(selector) {
+        return `${selector.trim()}:not(${options.ignoreSelector})`;
+      }, "mapSelectors"));
+    }
+    try {
+      return contentElement.querySelectorAll(selectors);
+    } catch (e2) {
+      console.warn(`Headers not found with selector: ${selectors}`);
+      return null;
+    }
+  }
+  __name(selectHeadings, "selectHeadings");
+  function nestHeadingsArray(headingsArray) {
+    return reduce.call(
+      headingsArray,
+      /* @__PURE__ */ __name(function reducer(prev, curr) {
+        const currentHeading = getHeadingObject(curr);
+        if (currentHeading) {
+          addNode(currentHeading, prev.nest);
+        }
+        return prev;
+      }, "reducer"),
+      {
+        nest: []
+      }
+    );
+  }
+  __name(nestHeadingsArray, "nestHeadingsArray");
+  return {
+    nestHeadingsArray,
+    selectHeadings
+  };
+}
+__name(parseContent, "parseContent");
+
+// ../../node_modules/tocbot/src/js/scroll-smooth/index.js
+function initSmoothScrolling(options) {
+  var duration = options.duration;
+  var offset = options.offset;
+  if (typeof window === "undefined" || typeof location === "undefined") return;
+  var pageUrl = location.hash ? stripHash(location.href) : location.href;
+  delegatedLinkHijacking();
+  function delegatedLinkHijacking() {
+    document.body.addEventListener("click", onClick, false);
+    function onClick(e2) {
+      if (!isInPageLink(e2.target) || e2.target.className.indexOf("no-smooth-scroll") > -1 || e2.target.href.charAt(e2.target.href.length - 2) === "#" && e2.target.href.charAt(e2.target.href.length - 1) === "!" || e2.target.className.indexOf(options.linkClass) === -1) {
+        return;
+      }
+      jump(e2.target.hash, {
+        duration,
+        offset,
+        callback: /* @__PURE__ */ __name(function() {
+          setFocus(e2.target.hash);
+        }, "callback")
+      });
+    }
+    __name(onClick, "onClick");
+  }
+  __name(delegatedLinkHijacking, "delegatedLinkHijacking");
+  function isInPageLink(n2) {
+    return n2.tagName.toLowerCase() === "a" && (n2.hash.length > 0 || n2.href.charAt(n2.href.length - 1) === "#") && (stripHash(n2.href) === pageUrl || stripHash(n2.href) + "#" === pageUrl);
+  }
+  __name(isInPageLink, "isInPageLink");
+  function stripHash(url) {
+    return url.slice(0, url.lastIndexOf("#"));
+  }
+  __name(stripHash, "stripHash");
+  function setFocus(hash) {
+    var element = document.getElementById(hash.substring(1));
+    if (element) {
+      if (!/^(?:a|select|input|button|textarea)$/i.test(element.tagName)) {
+        element.tabIndex = -1;
+      }
+      element.focus();
+    }
+  }
+  __name(setFocus, "setFocus");
+}
+__name(initSmoothScrolling, "initSmoothScrolling");
+function jump(target, options) {
+  var start = window.pageYOffset;
+  var opt = {
+    duration: options.duration,
+    offset: options.offset || 0,
+    callback: options.callback,
+    easing: options.easing || easeInOutQuad
+  };
+  var tgt = document.querySelector(
+    '[id="' + decodeURI(target).split("#").join("") + '"]'
+  ) || document.querySelector('[id="' + target.split("#").join("") + '"]');
+  var distance = typeof target === "string" ? opt.offset + (target ? tgt && tgt.getBoundingClientRect().top || 0 : -(document.documentElement.scrollTop || document.body.scrollTop)) : target;
+  var duration = typeof opt.duration === "function" ? opt.duration(distance) : opt.duration;
+  var timeStart;
+  var timeElapsed;
+  requestAnimationFrame(function(time) {
+    timeStart = time;
+    loop(time);
+  });
+  function loop(time) {
+    timeElapsed = time - timeStart;
+    window.scrollTo(0, opt.easing(timeElapsed, start, distance, duration));
+    if (timeElapsed < duration) {
+      requestAnimationFrame(loop);
+    } else {
+      end();
+    }
+  }
+  __name(loop, "loop");
+  function end() {
+    window.scrollTo(0, start + distance);
+    if (typeof opt.callback === "function") {
+      opt.callback();
+    }
+  }
+  __name(end, "end");
+  function easeInOutQuad(t, b2, c2, d2) {
+    t /= d2 / 2;
+    if (t < 1) return c2 / 2 * t * t + b2;
+    t--;
+    return -c2 / 2 * (t * (t - 2) - 1) + b2;
+  }
+  __name(easeInOutQuad, "easeInOutQuad");
+}
+__name(jump, "jump");
+
+// ../../node_modules/tocbot/src/js/update-toc-scroll.js
+function updateTocScroll(options) {
+  const toc = options.tocScrollingWrapper || options.tocElement || document.querySelector(options.tocSelector);
+  if (toc && toc.scrollHeight > toc.clientHeight) {
+    const activeItem = toc.querySelector(`.${options.activeListItemClass}`);
+    if (activeItem) {
+      const eTop = activeItem.offsetTop;
+      const scrollAmount = eTop - options.tocScrollOffset;
+      toc.scrollTop = scrollAmount > 0 ? scrollAmount : 0;
+    }
+  }
+}
+__name(updateTocScroll, "updateTocScroll");
+
+// ../../node_modules/tocbot/src/js/index-esm.js
+var _options = {};
+var _buildHtml;
+var _parseContent;
+var _headingsArray;
+var _scrollListener;
+var clickListener;
+function init(customOptions) {
+  let hasInitialized = false;
+  _options = extend(default_options_default, customOptions || {});
+  if (_options.scrollSmooth) {
+    _options.duration = _options.scrollSmoothDuration;
+    _options.offset = _options.scrollSmoothOffset;
+    initSmoothScrolling(_options);
+  }
+  _buildHtml = build_html_default(_options);
+  _parseContent = parseContent(_options);
+  destroy();
+  const contentElement = getContentElement(_options);
+  if (contentElement === null) {
+    return;
+  }
+  const tocElement = getTocElement(_options);
+  if (tocElement === null) {
+    return;
+  }
+  _headingsArray = _parseContent.selectHeadings(
+    contentElement,
+    _options.headingSelector
+  );
+  if (_headingsArray === null) {
+    return;
+  }
+  const nestedHeadingsObj = _parseContent.nestHeadingsArray(_headingsArray);
+  const nestedHeadings = nestedHeadingsObj.nest;
+  if (!_options.skipRendering) {
+    _buildHtml.render(tocElement, nestedHeadings);
+  } else {
+    return this;
+  }
+  let isClick = false;
+  const scrollHandlerTimeout = _options.scrollHandlerTimeout || _options.throttleTimeout;
+  const scrollHandler = /* @__PURE__ */ __name((fn, delay) => getScrollHandler(fn, delay, _options.scrollHandlerType), "scrollHandler");
+  _scrollListener = scrollHandler((e2) => {
+    _buildHtml.updateToc(_headingsArray, e2);
+    !_options.disableTocScrollSync && !isClick && updateTocScroll(_options);
+    if (_options.enableUrlHashUpdateOnScroll && hasInitialized) {
+      const enableUpdatingHash = _buildHtml.getCurrentlyHighlighting();
+      enableUpdatingHash && _buildHtml.updateUrlHashForHeader(_headingsArray);
+    }
+    const isTop = e2?.target?.scrollingElement?.scrollTop === 0;
+    if (e2 && (e2.eventPhase === 0 || e2.currentTarget === null) || isTop) {
+      _buildHtml.updateToc(_headingsArray);
+      _options.scrollEndCallback?.(e2);
+    }
+  }, scrollHandlerTimeout);
+  if (!hasInitialized) {
+    _scrollListener();
+    hasInitialized = true;
+  }
+  window.onhashchange = window.onscrollend = (e2) => {
+    _scrollListener(e2);
+  };
+  if (_options.scrollContainer && document.querySelector(_options.scrollContainer)) {
+    document.querySelector(_options.scrollContainer).addEventListener("scroll", _scrollListener, false);
+    document.querySelector(_options.scrollContainer).addEventListener("resize", _scrollListener, false);
+  } else {
+    document.addEventListener("scroll", _scrollListener, false);
+    document.addEventListener("resize", _scrollListener, false);
+  }
+  let timeout = null;
+  clickListener = throttle((event) => {
+    isClick = true;
+    if (_options.scrollSmooth) {
+      _buildHtml.disableTocAnimation(event);
+    }
+    _buildHtml.updateToc(_headingsArray, event);
+    timeout && clearTimeout(timeout);
+    timeout = setTimeout(() => {
+      _buildHtml.enableTocAnimation();
+    }, _options.scrollSmoothDuration);
+    setTimeout(() => {
+      isClick = false;
+    }, _options.scrollSmoothDuration + 100);
+  }, _options.throttleTimeout);
+  if (_options.scrollContainer && document.querySelector(_options.scrollContainer)) {
+    document.querySelector(_options.scrollContainer).addEventListener("click", clickListener, false);
+  } else {
+    document.addEventListener("click", clickListener, false);
+  }
+}
+__name(init, "init");
+function destroy() {
+  const tocElement = getTocElement(_options);
+  if (tocElement === null) {
+    return;
+  }
+  if (!_options.skipRendering) {
+    if (tocElement) {
+      tocElement.innerHTML = "";
+    }
+  }
+  if (_options.scrollContainer && document.querySelector(_options.scrollContainer)) {
+    document.querySelector(_options.scrollContainer).removeEventListener("scroll", _scrollListener, false);
+    document.querySelector(_options.scrollContainer).removeEventListener("resize", _scrollListener, false);
+    if (_buildHtml) {
+      document.querySelector(_options.scrollContainer).removeEventListener("click", clickListener, false);
+    }
+  } else {
+    document.removeEventListener("scroll", _scrollListener, false);
+    document.removeEventListener("resize", _scrollListener, false);
+    if (_buildHtml) {
+      document.removeEventListener("click", clickListener, false);
+    }
+  }
+}
+__name(destroy, "destroy");
+function refresh(customOptions) {
+  destroy();
+  init(customOptions || _options);
+}
+__name(refresh, "refresh");
+var hasOwnProp = Object.prototype.hasOwnProperty;
+function extend(...args) {
+  const target = {};
+  for (let i2 = 0; i2 < args.length; i2++) {
+    const source = args[i2];
+    for (const key in source) {
+      if (hasOwnProp.call(source, key)) {
+        target[key] = source[key];
+      }
+    }
+  }
+  return target;
+}
+__name(extend, "extend");
+function throttle(fn, threshold, scope) {
+  threshold || (threshold = 250);
+  let last;
+  let deferTimer;
+  return function(...args) {
+    const context = scope || this;
+    const now = +/* @__PURE__ */ new Date();
+    if (last && now < last + threshold) {
+      clearTimeout(deferTimer);
+      deferTimer = setTimeout(() => {
+        last = now;
+        fn.apply(context, args);
+      }, threshold);
+    } else {
+      last = now;
+      fn.apply(context, args);
+    }
+  };
+}
+__name(throttle, "throttle");
+function debounce(func, wait) {
+  let timeout;
+  return (...args) => {
+    clearTimeout(timeout);
+    timeout = setTimeout(() => func.apply(this, args), wait);
+  };
+}
+__name(debounce, "debounce");
+function getScrollHandler(func, timeout, type = "auto") {
+  switch (type) {
+    case "debounce":
+      return debounce(func, timeout);
+    case "throttle":
+      return throttle(func, timeout);
+    default:
+      return timeout < 334 ? debounce(func, timeout) : throttle(func, timeout);
+  }
+}
+__name(getScrollHandler, "getScrollHandler");
+function getContentElement(options) {
+  try {
+    return options.contentElement || document.querySelector(options.contentSelector);
+  } catch (e2) {
+    console.warn(`Contents element not found: ${options.contentSelector}`);
+    return null;
+  }
+}
+__name(getContentElement, "getContentElement");
+function getTocElement(options) {
+  try {
+    return options.tocElement || document.querySelector(options.tocSelector);
+  } catch (e2) {
+    console.warn(`TOC element not found: ${options.tocSelector}`);
+    return null;
+  }
+}
+__name(getTocElement, "getTocElement");
+
+// ../../node_modules/tocbot/index.js
+var tocbot = { destroy, init, refresh };
+var tocbot_default = tocbot;
+
+// src/blocks/components/TableOfContents.tsx
 var Aside = styled8.aside(() => ({
   width: "10rem",
   "@media (max-width: 768px)": {
@@ -1382,9 +2318,9 @@ var Heading = styled8.p(({ theme }) => ({
 }));
 var Title2 = /* @__PURE__ */ __name(({ headingId, title }) => {
   if (typeof title === "string" || !title) {
-    return React10.createElement(Heading, { as: "h2", id: headingId, className: title ? "" : "sb-sr-only" }, title || "Table of contents");
+    return React11.createElement(Heading, { as: "h2", id: headingId, className: title ? "" : "sb-sr-only" }, title || "Table of contents");
   }
-  return React10.createElement("div", { id: headingId }, title);
+  return React11.createElement("div", { id: headingId }, title);
 }, "Title");
 var TableOfContents = /* @__PURE__ */ __name(({
   title,
@@ -1396,7 +2332,7 @@ var TableOfContents = /* @__PURE__ */ __name(({
   channel,
   className
 }) => {
-  useEffect2(() => {
+  useEffect3(() => {
     if (disable) {
       return () => {
       };
@@ -1429,463 +2365,482 @@ var TableOfContents = /* @__PURE__ */ __name(({
     };
   }, [channel, disable, ignoreSelector, contentsSelector, headingSelector, unsafeTocbotOptions]);
   const headingId = useId();
-  return React10.createElement(Aside, { className }, !disable ? React10.createElement(Nav, { "aria-labelledby": headingId }, React10.createElement(Title2, { headingId, title }), React10.createElement("div", { className: "toc-wrapper" })) : null);
+  return React11.createElement(Aside, { className }, !disable ? React11.createElement(Nav, { "aria-labelledby": headingId }, React11.createElement(Title2, { headingId, title }), React11.createElement("div", { className: "toc-wrapper" })) : null);
 }, "TableOfContents");
 
 // src/blocks/components/ArgsTable/ArgRow.tsx
-import React29, { useState as useState10 } from "react";
+import React30, { useState as useState11 } from "react";
 import { codeCommon as codeCommon3 } from "storybook/internal/components";
 
 // ../../node_modules/markdown-to-jsx/dist/index.modern.js
 import * as e from "react";
-function t() {
-  return t = Object.assign ? Object.assign.bind() : function(e2) {
-    for (var t2 = 1; t2 < arguments.length; t2++) {
-      var n2 = arguments[t2];
-      for (var r2 in n2) Object.prototype.hasOwnProperty.call(n2, r2) && (e2[r2] = n2[r2]);
+function n() {
+  return n = Object.assign ? Object.assign.bind() : function(e2) {
+    for (var n2 = 1; n2 < arguments.length; n2++) {
+      var r2 = arguments[n2];
+      for (var t in r2) Object.prototype.hasOwnProperty.call(r2, t) && (e2[t] = r2[t]);
     }
     return e2;
-  }, t.apply(this, arguments);
+  }, n.apply(this, arguments);
 }
-__name(t, "t");
-var n = ["children", "options"];
-var r = { blockQuote: "0", breakLine: "1", breakThematic: "2", codeBlock: "3", codeFenced: "4", codeInline: "5", footnote: "6", footnoteReference: "7", gfmTask: "8", heading: "9", headingSetext: "10", htmlBlock: "11", htmlComment: "12", htmlSelfClosing: "13", image: "14", link: "15", linkAngleBraceStyleDetector: "16", linkBareUrlDetector: "17", linkMailtoDetector: "18", newlineCoalescer: "19", orderedList: "20", paragraph: "21", ref: "22", refImage: "23", refLink: "24", table: "25", tableSeparator: "26", text: "27", textBolded: "28", textEmphasized: "29", textEscaped: "30", textMarked: "31", textStrikethroughed: "32", unorderedList: "33" };
-var i;
-!function(e2) {
-  e2[e2.MAX = 0] = "MAX", e2[e2.HIGH = 1] = "HIGH", e2[e2.MED = 2] = "MED", e2[e2.LOW = 3] = "LOW", e2[e2.MIN = 4] = "MIN";
-}(i || (i = {}));
-var l = ["allowFullScreen", "allowTransparency", "autoComplete", "autoFocus", "autoPlay", "cellPadding", "cellSpacing", "charSet", "classId", "colSpan", "contentEditable", "contextMenu", "crossOrigin", "encType", "formAction", "formEncType", "formMethod", "formNoValidate", "formTarget", "frameBorder", "hrefLang", "inputMode", "keyParams", "keyType", "marginHeight", "marginWidth", "maxLength", "mediaGroup", "minLength", "noValidate", "radioGroup", "readOnly", "rowSpan", "spellCheck", "srcDoc", "srcLang", "srcSet", "tabIndex", "useMap"].reduce((e2, t2) => (e2[t2.toLowerCase()] = t2, e2), { class: "className", for: "htmlFor" });
-var o = { amp: "&", apos: "'", gt: ">", lt: "<", nbsp: "\xA0", quot: "\u201C" };
-var a = ["style", "script"];
-var c = ["src", "href", "data", "formAction", "srcDoc", "action"];
-var s = /([-A-Z0-9_:]+)(?:\s*=\s*(?:(?:"((?:\\.|[^"])*)")|(?:'((?:\\.|[^'])*)')|(?:\{((?:\\.|{[^}]*?}|[^}])*)\})))?/gi;
-var d = /mailto:/i;
-var u = /\n{2,}$/;
-var p = /^(\s*>[\s\S]*?)(?=\n\n|$)/;
-var f = /^ *> ?/gm;
-var h = /^(?:\[!([^\]]*)\]\n)?([\s\S]*)/;
-var m = /^ {2,}\n/;
-var g = /^(?:( *[-*_])){3,} *(?:\n *)+\n/;
-var y = /^(?: {1,3})?(`{3,}|~{3,}) *(\S+)? *([^\n]*?)?\n([\s\S]*?)(?:\1\n?|$)/;
-var k = /^(?: {4}[^\n]+\n*)+(?:\n *)+\n?/;
-var x = /^(`+)((?:\\`|(?!\1)`|[^`])+)\1/;
-var b = /^(?:\n *)*\n/;
-var v = /\r\n?/g;
-var C = /^\[\^([^\]]+)](:(.*)((\n+ {4,}.*)|(\n(?!\[\^).+))*)/;
-var $ = /^\[\^([^\]]+)]/;
-var S = /\f/g;
-var w = /^---[ \t]*\n(.|\n)*\n---[ \t]*\n/;
-var E = /^\s*?\[(x|\s)\]/;
+__name(n, "n");
+var r = ["children", "options"];
+var o = ["allowFullScreen", "allowTransparency", "autoComplete", "autoFocus", "autoPlay", "cellPadding", "cellSpacing", "charSet", "classId", "colSpan", "contentEditable", "contextMenu", "crossOrigin", "encType", "formAction", "formEncType", "formMethod", "formNoValidate", "formTarget", "frameBorder", "hrefLang", "inputMode", "keyParams", "keyType", "marginHeight", "marginWidth", "maxLength", "mediaGroup", "minLength", "noValidate", "radioGroup", "readOnly", "rowSpan", "spellCheck", "srcDoc", "srcLang", "srcSet", "tabIndex", "useMap"].reduce((e2, n2) => (e2[n2.toLowerCase()] = n2, e2), { class: "className", for: "htmlFor" });
+var a = { amp: "&", apos: "'", gt: ">", lt: "<", nbsp: "\xA0", quot: "\u201C" };
+var c = ["style", "script", "pre"];
+var i = ["src", "href", "data", "formAction", "srcDoc", "action"];
+var u = /([-A-Z0-9_:]+)(?:\s*=\s*(?:(?:"((?:\\.|[^"])*)")|(?:'((?:\\.|[^'])*)')|(?:\{((?:\\.|{[^}]*?}|[^}])*)\})))?/gi;
+var l = /mailto:/i;
+var s = /\n{2,}$/;
+var f = /^(\s*>[\s\S]*?)(?=\n\n|$)/;
+var _ = /^ *> ?/gm;
+var d = /^(?:\[!([^\]]*)\]\n)?([\s\S]*)/;
+var p = /^ {2,}\n/;
+var y = /^(?:( *[-*_])){3,} *(?:\n *)+\n/;
+var h = /^(?: {1,3})?(`{3,}|~{3,}) *(\S+)? *([^\n]*?)?\n([\s\S]*?)(?:\1\n?|$)/;
+var g = /^(?: {4}[^\n]+\n*)+(?:\n *)+\n?/;
+var m = /^(`+)((?:\\`|(?!\1)`|[^`])+)\1/;
+var k = /^(?:\n *)*\n/;
+var x = /\r\n?/g;
+var v = /^\[\^([^\]]+)](:(.*)((\n+ {4,}.*)|(\n(?!\[\^).+))*)/;
+var q = /^\[\^([^\]]+)]/;
+var $ = /\f/g;
+var b = /^---[ \t]*\n(.|\n)*\n---[ \t]*\n/;
+var S = /^\s*?\[(x|\s)\]/;
 var z = /^ *(#{1,6}) *([^\n]+?)(?: +#*)?(?:\n *)*(?:\n|$)/;
-var L = /^ *(#{1,6}) +([^\n]+?)(?: +#*)?(?:\n *)*(?:\n|$)/;
-var A = /^([^\n]+)\n *(=|-){3,} *(?:\n *)+\n/;
-var O = /^ *(?!<[a-z][^ >/]* ?\/>)<([a-z][^ >/]*) ?((?:[^>]*[^/])?)>\n?(\s*(?:<\1[^>]*?>[\s\S]*?<\/\1>|(?!<\1\b)[\s\S])*?)<\/\1>(?!<\/\1>)\n*/i;
-var T = /&([a-z0-9]+|#[0-9]{1,6}|#x[0-9a-fA-F]{1,6});/gi;
-var B = /^<!--[\s\S]*?(?:-->)/;
-var M = /^(data|aria|x)-[a-z_][a-z\d_.-]*$/;
-var R = /^ *<([a-z][a-z0-9:]*)(?:\s+((?:<.*?>|[^>])*))?\/?>(?!<\/\1>)(\s*\n)?/i;
-var I = /^\{.*\}$/;
-var D = /^(https?:\/\/[^\s<]+[^<.,:;"')\]\s])/;
-var U = /^<([^ >]+@[^ >]+)>/;
-var N = /^<([^ >]+:\/[^ >]+)>/;
-var j = /-([a-z])?/gi;
-var H = /^(\|.*)\n(?: *(\|? *[-:]+ *\|[-| :]*)\n((?:.*\|.*\n)*))?\n?/;
+var E = /^ *(#{1,6}) +([^\n]+?)(?: +#*)?(?:\n *)*(?:\n|$)/;
+var A = /^([^\n]+)\n *(=|-){3,} *\n/;
+var R = /^ *(?!<[a-z][^ >/]* ?\/>)<([a-z][^ >/]*) ?((?:[^>]*[^/])?)>\n?(\s*(?:<\1[^>]*?>[\s\S]*?<\/\1>|(?!<\1\b)[\s\S])*?)<\/\1>(?!<\/\1>)\n*/i;
+var B = /&([a-z0-9]+|#[0-9]{1,6}|#x[0-9a-fA-F]{1,6});/gi;
+var L = /^<!--[\s\S]*?(?:-->)/;
+var O = /^(data|aria|x)-[a-z_][a-z\d_.-]*$/;
+var j = /^ *<([a-z][a-z0-9:]*)(?:\s+((?:<.*?>|[^>])*))?\/?>(?!<\/\1>)(\s*\n)?/i;
+var C = /^\{.*\}$/;
+var I = /^(https?:\/\/[^\s<]+[^<.,:;"')\]\s])/;
+var T = /^<([^ >]+@[^ >]+)>/;
+var M = /^<([^ >]+:\/[^ >]+)>/;
+var w = /-([a-z])?/gi;
+var D = /^(\|.*)\n(?: *(\|? *[-:]+ *\|[-| :]*)\n((?:.*\|.*\n)*))?\n?/;
+var F = /^[^\n]+(?:  \n|\n{2,})/;
 var P = /^\[([^\]]*)\]:\s+<?([^\s>]+)>?\s*("([^"]*)")?/;
-var _ = /^!\[([^\]]*)\] ?\[([^\]]*)\]/;
-var F = /^\[([^\]]*)\] ?\[([^\]]*)\]/;
-var W = /(\n|^[-*]\s|^#|^ {2,}|^-{2,}|^>\s)/;
-var G = /\t/g;
-var Z = /(^ *\||\| *$)/g;
-var q = /^ *:-+: *$/;
+var Z = /^!\[([^\]]*)\] ?\[([^\]]*)\]/;
+var N = /^\[([^\]]*)\] ?\[([^\]]*)\]/;
+var G = /(\n|^[-*]\s|^#|^ {2,}|^-{2,}|^>\s)/;
+var U = /\t/g;
+var V = /(^ *\||\| *$)/g;
+var H = /^ *:-+: *$/;
 var Q = /^ *:-+ *$/;
-var V = /^ *-+: *$/;
-var X = "((?:\\[.*?\\][([].*?[)\\]]|<.*?>(?:.*?<.*?>)?|`.*?`|\\\\\\1|[\\s\\S])+?)";
-var J = new RegExp(`^([*_])\\1${X}\\1\\1(?!\\1)`);
-var K = new RegExp(`^([*_])${X}\\1(?!\\1)`);
-var Y = new RegExp(`^(==)${X}\\1`);
-var ee = new RegExp(`^(~~)${X}\\1`);
+var W = /^ *-+: *$/;
+var J = /* @__PURE__ */ __name((e2) => `(?=[\\s\\S]+?\\1${e2 ? "\\1" : ""})`, "J");
+var K = "((?:\\[.*?\\][([].*?[)\\]]|<.*?>(?:.*?<.*?>)?|`.*?`|\\\\\\1|[\\s\\S])+?)";
+var X = RegExp(`^([*_])\\1${J(1)}${K}\\1\\1(?!\\1)`);
+var Y = RegExp(`^([*_])${J(0)}${K}\\1(?!\\1)`);
+var ee = RegExp(`^(==)${J(0)}${K}\\1`);
+var ne = RegExp(`^(~~)${J(0)}${K}\\1`);
+var re = /^(:[a-zA-Z0-9-_]+:)/;
 var te = /^\\([^0-9A-Za-z\s])/;
-var ne = /\\([^0-9A-Za-z\s])/g;
-var re = /^([\s\S](?:(?!  |[0-9]\.)[^=*_~\-\n<`\\\[!])*)/;
-var ie = /^\n+/;
-var le = /^([ \t]*)/;
-var oe = /\\([^\\])/g;
-var ae = /(?:^|\n)( *)$/;
-var ce = "(?:\\d+\\.)";
+var oe = /\\([^0-9A-Za-z\s])/g;
+var ae = /^[\s\S](?:(?!  \n|[0-9]\.|http)[^=*_~\-\n:<`\\\[!])*/;
+var ce = /^\n+/;
+var ie = /^([ \t]*)/;
+var ue = /(?:^|\n)( *)$/;
+var le = "(?:\\d+\\.)";
 var se = "(?:[*+-])";
-function de(e2) {
-  return "( *)(" + (1 === e2 ? ce : se) + ") +";
-}
-__name(de, "de");
-var ue = de(1);
-var pe = de(2);
 function fe(e2) {
-  return new RegExp("^" + (1 === e2 ? ue : pe));
+  return "( *)(" + (1 === e2 ? le : se) + ") +";
 }
 __name(fe, "fe");
-var he = fe(1);
-var me = fe(2);
+var _e = fe(1);
+var de = fe(2);
+function pe(e2) {
+  return RegExp("^" + (1 === e2 ? _e : de));
+}
+__name(pe, "pe");
+var ye = pe(1);
+var he = pe(2);
 function ge(e2) {
-  return new RegExp("^" + (1 === e2 ? ue : pe) + "[^\\n]*(?:\\n(?!\\1" + (1 === e2 ? ce : se) + " )[^\\n]*)*(\\n|$)", "gm");
+  return RegExp("^" + (1 === e2 ? _e : de) + "[^\\n]*(?:\\n(?!\\1" + (1 === e2 ? le : se) + " )[^\\n]*)*(\\n|$)", "gm");
 }
 __name(ge, "ge");
-var ye = ge(1);
+var me = ge(1);
 var ke = ge(2);
 function xe(e2) {
-  const t2 = 1 === e2 ? ce : se;
-  return new RegExp("^( *)(" + t2 + ") [\\s\\S]+?(?:\\n{2,}(?! )(?!\\1" + t2 + " (?!" + t2 + " ))\\n*|\\s*\\n*$)");
+  const n2 = 1 === e2 ? le : se;
+  return RegExp("^( *)(" + n2 + ") [\\s\\S]+?(?:\\n{2,}(?! )(?!\\1" + n2 + " (?!" + n2 + " ))\\n*|\\s*\\n*$)");
 }
 __name(xe, "xe");
-var be = xe(1);
-var ve = xe(2);
-function Ce(e2, t2) {
-  const n2 = 1 === t2, i2 = n2 ? be : ve, l2 = n2 ? ye : ke, o2 = n2 ? he : me;
-  return { match: Me(function(e3, t3) {
-    const n3 = ae.exec(t3.prevCapture);
-    return n3 && (t3.list || !t3.inline && !t3.simple) ? i2.exec(e3 = n3[1] + e3) : null;
-  }), order: 1, parse(e3, t3, r2) {
-    const i3 = n2 ? +e3[2] : void 0, a2 = e3[0].replace(u, "\n").match(l2);
-    let c2 = false;
-    return { items: a2.map(function(e4, n3) {
-      const i4 = o2.exec(e4)[0].length, l3 = new RegExp("^ {1," + i4 + "}", "gm"), s2 = e4.replace(l3, "").replace(o2, ""), d2 = n3 === a2.length - 1, u2 = -1 !== s2.indexOf("\n\n") || d2 && c2;
-      c2 = u2;
-      const p2 = r2.inline, f2 = r2.list;
-      let h2;
-      r2.list = true, u2 ? (r2.inline = false, h2 = ze(s2) + "\n\n") : (r2.inline = true, h2 = ze(s2));
-      const m2 = t3(h2, r2);
-      return r2.inline = p2, r2.list = f2, m2;
-    }), ordered: n2, start: i3 };
-  }, render: /* @__PURE__ */ __name((t3, n3, i3) => e2(t3.ordered ? "ol" : "ul", { key: i3.key, start: t3.type === r.orderedList ? t3.start : void 0 }, t3.items.map(function(t4, r2) {
-    return e2("li", { key: r2 }, n3(t4, i3));
-  })), "render") };
+var ve = xe(1);
+var qe = xe(2);
+function $e(e2, n2) {
+  const r2 = 1 === n2, t = r2 ? ve : qe, o2 = r2 ? me : ke, a2 = r2 ? ye : he;
+  return { t: /* @__PURE__ */ __name((e3) => a2.test(e3), "t"), o: Ce(function(e3, n3) {
+    const r3 = ue.exec(n3.prevCapture);
+    return r3 && (n3.list || !n3.inline && !n3.simple) ? t.exec(e3 = r3[1] + e3) : null;
+  }), i: 1, u(e3, n3, t2) {
+    const c2 = r2 ? +e3[2] : void 0, i2 = e3[0].replace(s, "\n").match(o2);
+    let u2 = false;
+    return { items: i2.map(function(e4, r3) {
+      const o3 = a2.exec(e4)[0].length, c3 = RegExp("^ {1," + o3 + "}", "gm"), l2 = e4.replace(c3, "").replace(a2, ""), s2 = r3 === i2.length - 1, f2 = -1 !== l2.indexOf("\n\n") || s2 && u2;
+      u2 = f2;
+      const _2 = t2.inline, d2 = t2.list;
+      let p2;
+      t2.list = true, f2 ? (t2.inline = false, p2 = ze(l2) + "\n\n") : (t2.inline = true, p2 = ze(l2));
+      const y2 = n3(p2, t2);
+      return t2.inline = _2, t2.list = d2, y2;
+    }), ordered: r2, start: c2 };
+  }, l: /* @__PURE__ */ __name((n3, r3, t2) => e2(n3.ordered ? "ol" : "ul", { key: t2.key, start: "20" === n3.type ? n3.start : void 0 }, n3.items.map(function(n4, o3) {
+    return e2("li", { key: o3 }, r3(n4, t2));
+  })), "l") };
 }
-__name(Ce, "Ce");
-var $e = new RegExp(`^\\[((?:\\[[^\\]]*\\]|[^\\[\\]]|\\](?=[^\\[]*\\]))*)\\]\\(\\s*<?((?:\\([^)]*\\)|[^\\s\\\\]|\\\\.)*?)>?(?:\\s+['"]([\\s\\S]*?)['"])?\\s*\\)`);
+__name($e, "$e");
+var be = RegExp(`^\\[((?:\\[[^\\[\\]]*(?:\\[[^\\[\\]]*\\][^\\[\\]]*)*\\]|[^\\[\\]])*)\\]\\(\\s*<?((?:\\([^)]*\\)|[^\\s\\\\]|\\\\.)*?)>?(?:\\s+['"]([\\s\\S]*?)['"])?\\s*\\)`);
 var Se = /^!\[(.*?)\]\( *((?:\([^)]*\)|[^() ])*) *"?([^)"]*)?"?\)/;
-var we = [p, y, k, z, A, L, H, be, ve];
-var Ee = [...we, /^[^\n]+(?:  \n|\n{2,})/, O, B, R];
 function ze(e2) {
-  let t2 = e2.length;
-  for (; t2 > 0 && e2[t2 - 1] <= " "; ) t2--;
-  return e2.slice(0, t2);
+  let n2 = e2.length;
+  for (; n2 > 0 && e2[n2 - 1] <= " "; ) n2--;
+  return e2.slice(0, n2);
 }
 __name(ze, "ze");
-function Le(e2) {
-  return e2.replace(/[ÀÁÂÃÄÅàáâãäåæÆ]/g, "a").replace(/[çÇ]/g, "c").replace(/[ðÐ]/g, "d").replace(/[ÈÉÊËéèêë]/g, "e").replace(/[ÏïÎîÍíÌì]/g, "i").replace(/[Ññ]/g, "n").replace(/[øØœŒÕõÔôÓóÒò]/g, "o").replace(/[ÜüÛûÚúÙù]/g, "u").replace(/[ŸÿÝý]/g, "y").replace(/[^a-z0-9- ]/gi, "").replace(/ /gi, "-").toLowerCase();
+function Ee(e2, n2) {
+  return e2.startsWith(n2);
 }
-__name(Le, "Le");
-function Ae(e2) {
-  return V.test(e2) ? "right" : q.test(e2) ? "center" : Q.test(e2) ? "left" : null;
+__name(Ee, "Ee");
+function Ae(e2, n2, r2) {
+  if (Array.isArray(r2)) {
+    for (let n3 = 0; n3 < r2.length; n3++) if (Ee(e2, r2[n3])) return true;
+    return false;
+  }
+  return r2(e2, n2);
 }
 __name(Ae, "Ae");
-function Oe(e2, t2, n2, r2) {
-  const i2 = n2.inTable;
-  n2.inTable = true;
-  let l2 = [[]], o2 = "";
-  function a2() {
-    if (!o2) return;
-    const e3 = l2[l2.length - 1];
-    e3.push.apply(e3, t2(o2, n2)), o2 = "";
-  }
-  __name(a2, "a");
-  return e2.trim().split(/(`[^`]*`|\\\||\|)/).filter(Boolean).forEach((e3, t3, n3) => {
-    "|" === e3.trim() && (a2(), r2) ? 0 !== t3 && t3 !== n3.length - 1 && l2.push([]) : o2 += e3;
-  }), a2(), n2.inTable = i2, l2;
+function Re(e2) {
+  return e2.replace(/[ÀÁÂÃÄÅàáâãäåæÆ]/g, "a").replace(/[çÇ]/g, "c").replace(/[ðÐ]/g, "d").replace(/[ÈÉÊËéèêë]/g, "e").replace(/[ÏïÎîÍíÌì]/g, "i").replace(/[Ññ]/g, "n").replace(/[øØœŒÕõÔôÓóÒò]/g, "o").replace(/[ÜüÛûÚúÙù]/g, "u").replace(/[ŸÿÝý]/g, "y").replace(/[^a-z0-9- ]/gi, "").replace(/ /gi, "-").toLowerCase();
 }
-__name(Oe, "Oe");
-function Te(e2, t2, n2) {
-  n2.inline = true;
-  const i2 = e2[2] ? e2[2].replace(Z, "").split("|").map(Ae) : [], l2 = e2[3] ? function(e3, t3, n3) {
+__name(Re, "Re");
+function Be(e2) {
+  return W.test(e2) ? "right" : H.test(e2) ? "center" : Q.test(e2) ? "left" : null;
+}
+__name(Be, "Be");
+function Le(e2, n2, r2, t) {
+  const o2 = r2.inTable;
+  r2.inTable = true;
+  let a2 = [[]], c2 = "";
+  function i2() {
+    if (!c2) return;
+    const e3 = a2[a2.length - 1];
+    e3.push.apply(e3, n2(c2, r2)), c2 = "";
+  }
+  __name(i2, "i");
+  return e2.trim().split(/(`[^`]*`|\\\||\|)/).filter(Boolean).forEach((e3, n3, r3) => {
+    "|" === e3.trim() && (i2(), t) ? 0 !== n3 && n3 !== r3.length - 1 && a2.push([]) : c2 += e3;
+  }), i2(), r2.inTable = o2, a2;
+}
+__name(Le, "Le");
+function Oe(e2, n2, r2) {
+  r2.inline = true;
+  const t = e2[2] ? e2[2].replace(V, "").split("|").map(Be) : [], o2 = e2[3] ? function(e3, n3, r3) {
     return e3.trim().split("\n").map(function(e4) {
-      return Oe(e4, t3, n3, true);
+      return Le(e4, n3, r3, true);
     });
-  }(e2[3], t2, n2) : [], o2 = Oe(e2[1], t2, n2, !!l2.length);
-  return n2.inline = false, l2.length ? { align: i2, cells: l2, header: o2, type: r.table } : { children: o2, type: r.paragraph };
+  }(e2[3], n2, r2) : [], a2 = Le(e2[1], n2, r2, !!o2.length);
+  return r2.inline = false, o2.length ? { align: t, cells: o2, header: a2, type: "25" } : { children: a2, type: "21" };
 }
-__name(Te, "Te");
-function Be(e2, t2) {
-  return null == e2.align[t2] ? {} : { textAlign: e2.align[t2] };
+__name(Oe, "Oe");
+function je(e2, n2) {
+  return null == e2.align[n2] ? {} : { textAlign: e2.align[n2] };
 }
-__name(Be, "Be");
-function Me(e2) {
+__name(je, "je");
+function Ce(e2) {
   return e2.inline = 1, e2;
 }
-__name(Me, "Me");
-function Re(e2) {
-  return Me(function(t2, n2) {
-    return n2.inline ? e2.exec(t2) : null;
-  });
-}
-__name(Re, "Re");
+__name(Ce, "Ce");
 function Ie(e2) {
-  return Me(function(t2, n2) {
-    return n2.inline || n2.simple ? e2.exec(t2) : null;
+  return Ce(function(n2, r2) {
+    return r2.inline ? e2.exec(n2) : null;
   });
 }
 __name(Ie, "Ie");
-function De(e2) {
-  return function(t2, n2) {
-    return n2.inline || n2.simple ? null : e2.exec(t2);
+function Te(e2) {
+  return Ce(function(n2, r2) {
+    return r2.inline || r2.simple ? e2.exec(n2) : null;
+  });
+}
+__name(Te, "Te");
+function Me(e2) {
+  return function(n2, r2) {
+    return r2.inline || r2.simple ? null : e2.exec(n2);
   };
 }
-__name(De, "De");
-function Ue(e2) {
-  return Me(function(t2) {
-    return e2.exec(t2);
+__name(Me, "Me");
+function we(e2) {
+  return Ce(function(n2) {
+    return e2.exec(n2);
   });
 }
-__name(Ue, "Ue");
-function Ne(e2, t2) {
-  if (t2.inline || t2.simple) return null;
-  let n2 = "";
-  e2.split("\n").every((e3) => (e3 += "\n", !we.some((t3) => t3.test(e3)) && (n2 += e3, !!e3.trim())));
-  const r2 = ze(n2);
-  return "" == r2 ? null : [n2, , r2];
-}
-__name(Ne, "Ne");
-var je = /(javascript|vbscript|data(?!:image)):/i;
-function He(e2) {
+__name(we, "we");
+var De = /(javascript|vbscript|data(?!:image)):/i;
+function Fe(e2) {
   try {
-    const t2 = decodeURIComponent(e2).replace(/[^A-Za-z0-9/:]/g, "");
-    if (je.test(t2)) return null;
+    const n2 = decodeURIComponent(e2).replace(/[^A-Za-z0-9/:]/g, "");
+    if (De.test(n2)) return null;
   } catch (e3) {
     return null;
   }
   return e2;
 }
-__name(He, "He");
+__name(Fe, "Fe");
 function Pe(e2) {
-  return e2.replace(oe, "$1");
+  return e2 ? e2.replace(oe, "$1") : e2;
 }
 __name(Pe, "Pe");
-function _e(e2, t2, n2) {
-  const r2 = n2.inline || false, i2 = n2.simple || false;
-  n2.inline = true, n2.simple = true;
-  const l2 = e2(t2, n2);
-  return n2.inline = r2, n2.simple = i2, l2;
+function Ze(e2, n2, r2) {
+  const t = r2.inline || false, o2 = r2.simple || false;
+  r2.inline = true, r2.simple = true;
+  const a2 = e2(n2, r2);
+  return r2.inline = t, r2.simple = o2, a2;
 }
-__name(_e, "_e");
-function Fe(e2, t2, n2) {
-  const r2 = n2.inline || false, i2 = n2.simple || false;
-  n2.inline = false, n2.simple = true;
-  const l2 = e2(t2, n2);
-  return n2.inline = r2, n2.simple = i2, l2;
+__name(Ze, "Ze");
+function Ne(e2, n2, r2) {
+  const t = r2.inline || false, o2 = r2.simple || false;
+  r2.inline = false, r2.simple = true;
+  const a2 = e2(n2, r2);
+  return r2.inline = t, r2.simple = o2, a2;
 }
-__name(Fe, "Fe");
-function We(e2, t2, n2) {
-  const r2 = n2.inline || false;
-  n2.inline = false;
-  const i2 = e2(t2, n2);
-  return n2.inline = r2, i2;
+__name(Ne, "Ne");
+function Ge(e2, n2, r2) {
+  const t = r2.inline || false;
+  r2.inline = false;
+  const o2 = e2(n2, r2);
+  return r2.inline = t, o2;
 }
-__name(We, "We");
-var Ge = /* @__PURE__ */ __name((e2, t2, n2) => ({ children: _e(t2, e2[2], n2) }), "Ge");
-function Ze() {
+__name(Ge, "Ge");
+var Ue = /* @__PURE__ */ __name((e2, n2, r2) => ({ children: Ze(n2, e2[2], r2) }), "Ue");
+function Ve() {
   return {};
 }
-__name(Ze, "Ze");
-function qe() {
+__name(Ve, "Ve");
+function He() {
   return null;
 }
-__name(qe, "qe");
+__name(He, "He");
 function Qe(...e2) {
   return e2.filter(Boolean).join(" ");
 }
 __name(Qe, "Qe");
-function Ve(e2, t2, n2) {
-  let r2 = e2;
-  const i2 = t2.split(".");
-  for (; i2.length && (r2 = r2[i2[0]], void 0 !== r2); ) i2.shift();
-  return r2 || n2;
+function We(e2, n2, r2) {
+  let t = e2;
+  const o2 = n2.split(".");
+  for (; o2.length && (t = t[o2[0]], void 0 !== t); ) o2.shift();
+  return t || r2;
 }
-__name(Ve, "Ve");
-function Xe(n2 = "", i2 = {}) {
-  function u2(e2, n3, ...r2) {
-    const l2 = Ve(i2.overrides, `${e2}.props`, {});
-    return i2.createElement(function(e3, t2) {
-      const n4 = Ve(t2, e3);
-      return n4 ? "function" == typeof n4 || "object" == typeof n4 && "render" in n4 ? n4 : Ve(t2, `${e3}.component`, e3) : e3;
-    }(e2, i2.overrides), t({}, n3, l2, { className: Qe(null == n3 ? void 0 : n3.className, l2.className) || void 0 }), ...r2);
-  }
-  __name(u2, "u");
-  function Z2(e2) {
-    e2 = e2.replace(w, "");
-    let t2 = false;
-    i2.forceInline ? t2 = true : i2.forceBlock || (t2 = false === W.test(e2));
-    const n3 = ae2(oe2(t2 ? e2 : `${ze(e2).replace(ie, "")}
-
-`, { inline: t2 }));
-    for (; "string" == typeof n3[n3.length - 1] && !n3[n3.length - 1].trim(); ) n3.pop();
-    if (null === i2.wrapper) return n3;
-    const r2 = i2.wrapper || (t2 ? "span" : "div");
-    let l2;
-    if (n3.length > 1 || i2.forceWrapper) l2 = n3;
+__name(We, "We");
+function Je(r2 = "", t = {}) {
+  t.overrides = t.overrides || {}, t.namedCodesToUnicode = t.namedCodesToUnicode ? n({}, a, t.namedCodesToUnicode) : a;
+  const s2 = t.slugify || Re, V2 = t.sanitizer || Fe, H4 = t.createElement || e.createElement, Q2 = [f, h, g, t.enforceAtxHeadings ? E : z, A, D, ve, qe], W2 = [...Q2, F, R, L, j];
+  function J2(e2, r3, ...o2) {
+    const a2 = We(t.overrides, e2 + ".props", {});
+    return H4(function(e3, n2) {
+      const r4 = We(n2, e3);
+      return r4 ? "function" == typeof r4 || "object" == typeof r4 && "render" in r4 ? r4 : We(n2, e3 + ".component", e3) : e3;
+    }(e2, t.overrides), n({}, r3, a2, { className: Qe(null == r3 ? void 0 : r3.className, a2.className) || void 0 }), ...o2);
+  }
+  __name(J2, "J");
+  function K2(e2) {
+    e2 = e2.replace(b, "");
+    let n2 = false;
+    t.forceInline ? n2 = true : t.forceBlock || (n2 = false === G.test(e2));
+    const r3 = _e2(fe2(n2 ? e2 : ze(e2).replace(ce, "") + "\n\n", { inline: n2 }));
+    for (; "string" == typeof r3[r3.length - 1] && !r3[r3.length - 1].trim(); ) r3.pop();
+    if (null === t.wrapper) return r3;
+    const o2 = t.wrapper || (n2 ? "span" : "div");
+    let a2;
+    if (r3.length > 1 || t.forceWrapper) a2 = r3;
     else {
-      if (1 === n3.length) return l2 = n3[0], "string" == typeof l2 ? u2("span", { key: "outer" }, l2) : l2;
-      l2 = null;
-    }
-    return i2.createElement(r2, { key: "outer" }, l2);
-  }
-  __name(Z2, "Z");
-  function q2(e2, t2) {
-    const n3 = t2.match(s);
-    return n3 ? n3.reduce(function(t3, n4) {
-      const r2 = n4.indexOf("=");
-      if (-1 !== r2) {
-        const o2 = function(e3) {
-          return -1 !== e3.indexOf("-") && null === e3.match(M) && (e3 = e3.replace(j, function(e4, t4) {
-            return t4.toUpperCase();
+      if (1 === r3.length) return a2 = r3[0], "string" == typeof a2 ? J2("span", { key: "outer" }, a2) : a2;
+      a2 = null;
+    }
+    return H4(o2, { key: "outer" }, a2);
+  }
+  __name(K2, "K");
+  function oe2(e2, n2) {
+    if (!n2 || !n2.trim()) return null;
+    const r3 = n2.match(u);
+    return r3 ? r3.reduce(function(n3, r4) {
+      const t2 = r4.indexOf("=");
+      if (-1 !== t2) {
+        const a2 = function(e3) {
+          return -1 !== e3.indexOf("-") && null === e3.match(O) && (e3 = e3.replace(w, function(e4, n4) {
+            return n4.toUpperCase();
           })), e3;
-        }(n4.slice(0, r2)).trim(), a2 = function(e3) {
-          const t4 = e3[0];
-          return ('"' === t4 || "'" === t4) && e3.length >= 2 && e3[e3.length - 1] === t4 ? e3.slice(1, -1) : e3;
-        }(n4.slice(r2 + 1).trim()), s2 = l[o2] || o2;
-        if ("ref" === s2) return t3;
-        const d2 = t3[s2] = function(e3, t4, n5, r3) {
-          return "style" === t4 ? function(e4) {
-            const t5 = [];
-            let n6 = "", r4 = false, i3 = false, l2 = "";
-            if (!e4) return t5;
-            for (let o4 = 0; o4 < e4.length; o4++) {
-              const a3 = e4[o4];
-              if ('"' !== a3 && "'" !== a3 || r4 || (i3 ? a3 === l2 && (i3 = false, l2 = "") : (i3 = true, l2 = a3)), "(" === a3 && n6.endsWith("url") ? r4 = true : ")" === a3 && r4 && (r4 = false), ";" !== a3 || i3 || r4) n6 += a3;
+        }(r4.slice(0, t2)).trim(), c2 = function(e3) {
+          const n4 = e3[0];
+          return ('"' === n4 || "'" === n4) && e3.length >= 2 && e3[e3.length - 1] === n4 ? e3.slice(1, -1) : e3;
+        }(r4.slice(t2 + 1).trim()), u2 = o[a2] || a2;
+        if ("ref" === u2) return n3;
+        const l2 = n3[u2] = function(e3, n4, r5, t3) {
+          return "style" === n4 ? function(e4) {
+            const n5 = [];
+            let r6 = "", t4 = false, o2 = false, a3 = "";
+            if (!e4) return n5;
+            for (let c4 = 0; c4 < e4.length; c4++) {
+              const i2 = e4[c4];
+              if ('"' !== i2 && "'" !== i2 || t4 || (o2 ? i2 === a3 && (o2 = false, a3 = "") : (o2 = true, a3 = i2)), "(" === i2 && r6.endsWith("url") ? t4 = true : ")" === i2 && t4 && (t4 = false), ";" !== i2 || o2 || t4) r6 += i2;
               else {
-                const e5 = n6.trim();
+                const e5 = r6.trim();
                 if (e5) {
-                  const n7 = e5.indexOf(":");
-                  if (n7 > 0) {
-                    const r5 = e5.slice(0, n7).trim(), i4 = e5.slice(n7 + 1).trim();
-                    t5.push([r5, i4]);
+                  const r7 = e5.indexOf(":");
+                  if (r7 > 0) {
+                    const t5 = e5.slice(0, r7).trim(), o3 = e5.slice(r7 + 1).trim();
+                    n5.push([t5, o3]);
                   }
                 }
-                n6 = "";
+                r6 = "";
               }
             }
-            const o3 = n6.trim();
-            if (o3) {
-              const e5 = o3.indexOf(":");
+            const c3 = r6.trim();
+            if (c3) {
+              const e5 = c3.indexOf(":");
               if (e5 > 0) {
-                const n7 = o3.slice(0, e5).trim(), r5 = o3.slice(e5 + 1).trim();
-                t5.push([n7, r5]);
+                const r7 = c3.slice(0, e5).trim(), t5 = c3.slice(e5 + 1).trim();
+                n5.push([r7, t5]);
               }
             }
-            return t5;
-          }(n5).reduce(function(t5, [n6, i3]) {
-            return t5[n6.replace(/(-[a-z])/g, (e4) => e4[1].toUpperCase())] = r3(i3, e3, n6), t5;
-          }, {}) : -1 !== c.indexOf(t4) ? r3(n5, e3, t4) : (n5.match(I) && (n5 = n5.slice(1, n5.length - 1)), "true" === n5 || "false" !== n5 && n5);
-        }(e2, o2, a2, i2.sanitizer);
-        "string" == typeof d2 && (O.test(d2) || R.test(d2)) && (t3[s2] = Z2(d2.trim()));
-      } else "style" !== n4 && (t3[l[n4] || n4] = true);
-      return t3;
+            return n5;
+          }(r5).reduce(function(n5, [r6, o2]) {
+            return n5[r6.replace(/(-[a-z])/g, (e4) => e4[1].toUpperCase())] = t3(o2, e3, r6), n5;
+          }, {}) : -1 !== i.indexOf(n4) ? t3(Pe(r5), e3, n4) : (r5.match(C) && (r5 = Pe(r5.slice(1, r5.length - 1))), "true" === r5 || "false" !== r5 && r5);
+        }(e2, a2, c2, V2);
+        "string" == typeof l2 && (R.test(l2) || j.test(l2)) && (n3[u2] = K2(l2.trim()));
+      } else "style" !== r4 && (n3[o[r4] || r4] = true);
+      return n3;
     }, {}) : null;
   }
-  __name(q2, "q");
-  i2.overrides = i2.overrides || {}, i2.sanitizer = i2.sanitizer || He, i2.slugify = i2.slugify || Le, i2.namedCodesToUnicode = i2.namedCodesToUnicode ? t({}, o, i2.namedCodesToUnicode) : o, i2.createElement = i2.createElement || e.createElement;
-  const Q2 = [], V2 = {}, X2 = { [r.blockQuote]: { match: De(p), order: 1, parse(e2, t2, n3) {
-    const [, r2, i3] = e2[0].replace(f, "").match(h);
-    return { alert: r2, children: t2(i3, n3) };
-  }, render(e2, t2, n3) {
-    const l2 = { key: n3.key };
-    return e2.alert && (l2.className = "markdown-alert-" + i2.slugify(e2.alert.toLowerCase(), Le), e2.children.unshift({ attrs: {}, children: [{ type: r.text, text: e2.alert }], noInnerParse: true, type: r.htmlBlock, tag: "header" })), u2("blockquote", l2, t2(e2.children, n3));
-  } }, [r.breakLine]: { match: Ue(m), order: 1, parse: Ze, render: /* @__PURE__ */ __name((e2, t2, n3) => u2("br", { key: n3.key }), "render") }, [r.breakThematic]: { match: De(g), order: 1, parse: Ze, render: /* @__PURE__ */ __name((e2, t2, n3) => u2("hr", { key: n3.key }), "render") }, [r.codeBlock]: { match: De(k), order: 0, parse: /* @__PURE__ */ __name((e2) => ({ lang: void 0, text: ze(e2[0].replace(/^ {4}/gm, "")).replace(ne, "$1") }), "parse"), render: /* @__PURE__ */ __name((e2, n3, r2) => u2("pre", { key: r2.key }, u2("code", t({}, e2.attrs, { className: e2.lang ? `lang-${e2.lang}` : "" }), e2.text)), "render") }, [r.codeFenced]: { match: De(y), order: 0, parse: /* @__PURE__ */ __name((e2) => ({ attrs: q2("code", e2[3] || ""), lang: e2[2] || void 0, text: e2[4], type: r.codeBlock }), "parse") }, [r.codeInline]: { match: Ie(x), order: 3, parse: /* @__PURE__ */ __name((e2) => ({ text: e2[2].replace(ne, "$1") }), "parse"), render: /* @__PURE__ */ __name((e2, t2, n3) => u2("code", { key: n3.key }, e2.text), "render") }, [r.footnote]: { match: De(C), order: 0, parse: /* @__PURE__ */ __name((e2) => (Q2.push({ footnote: e2[2], identifier: e2[1] }), {}), "parse"), render: qe }, [r.footnoteReference]: { match: Re($), order: 1, parse: /* @__PURE__ */ __name((e2) => ({ target: `#${i2.slugify(e2[1], Le)}`, text: e2[1] }), "parse"), render: /* @__PURE__ */ __name((e2, t2, n3) => u2("a", { key: n3.key, href: i2.sanitizer(e2.target, "a", "href") }, u2("sup", { key: n3.key }, e2.text)), "render") }, [r.gfmTask]: { match: Re(E), order: 1, parse: /* @__PURE__ */ __name((e2) => ({ completed: "x" === e2[1].toLowerCase() }), "parse"), render: /* @__PURE__ */ __name((e2, t2, n3) => u2("input", { checked: e2.completed, key: n3.key, readOnly: true, type: "checkbox" }), "render") }, [r.heading]: { match: De(i2.enforceAtxHeadings ? L : z), order: 1, parse: /* @__PURE__ */ __name((e2, t2, n3) => ({ children: _e(t2, e2[2], n3), id: i2.slugify(e2[2], Le), level: e2[1].length }), "parse"), render: /* @__PURE__ */ __name((e2, t2, n3) => u2(`h${e2.level}`, { id: e2.id, key: n3.key }, t2(e2.children, n3)), "render") }, [r.headingSetext]: { match: De(A), order: 0, parse: /* @__PURE__ */ __name((e2, t2, n3) => ({ children: _e(t2, e2[1], n3), level: "=" === e2[2] ? 1 : 2, type: r.heading }), "parse") }, [r.htmlBlock]: { match: Ue(O), order: 1, parse(e2, t2, n3) {
-    const [, r2] = e2[3].match(le), i3 = new RegExp(`^${r2}`, "gm"), l2 = e2[3].replace(i3, ""), o2 = (c2 = l2, Ee.some((e3) => e3.test(c2)) ? We : _e);
-    var c2;
-    const s2 = e2[1].toLowerCase(), d2 = -1 !== a.indexOf(s2), u3 = (d2 ? s2 : e2[1]).trim(), p2 = { attrs: q2(u3, e2[2]), noInnerParse: d2, tag: u3 };
-    return n3.inAnchor = n3.inAnchor || "a" === s2, d2 ? p2.text = e2[3] : p2.children = o2(t2, l2, n3), n3.inAnchor = false, p2;
-  }, render: /* @__PURE__ */ __name((e2, n3, r2) => u2(e2.tag, t({ key: r2.key }, e2.attrs), e2.text || (e2.children ? n3(e2.children, r2) : "")), "render") }, [r.htmlSelfClosing]: { match: Ue(R), order: 1, parse(e2) {
-    const t2 = e2[1].trim();
-    return { attrs: q2(t2, e2[2] || ""), tag: t2 };
-  }, render: /* @__PURE__ */ __name((e2, n3, r2) => u2(e2.tag, t({}, e2.attrs, { key: r2.key })), "render") }, [r.htmlComment]: { match: Ue(B), order: 1, parse: /* @__PURE__ */ __name(() => ({}), "parse"), render: qe }, [r.image]: { match: Ie(Se), order: 1, parse: /* @__PURE__ */ __name((e2) => ({ alt: e2[1], target: Pe(e2[2]), title: e2[3] }), "parse"), render: /* @__PURE__ */ __name((e2, t2, n3) => u2("img", { key: n3.key, alt: e2.alt || void 0, title: e2.title || void 0, src: i2.sanitizer(e2.target, "img", "src") }), "render") }, [r.link]: { match: Re($e), order: 3, parse: /* @__PURE__ */ __name((e2, t2, n3) => ({ children: Fe(t2, e2[1], n3), target: Pe(e2[2]), title: e2[3] }), "parse"), render: /* @__PURE__ */ __name((e2, t2, n3) => u2("a", { key: n3.key, href: i2.sanitizer(e2.target, "a", "href"), title: e2.title }, t2(e2.children, n3)), "render") }, [r.linkAngleBraceStyleDetector]: { match: Re(N), order: 0, parse: /* @__PURE__ */ __name((e2) => ({ children: [{ text: e2[1], type: r.text }], target: e2[1], type: r.link }), "parse") }, [r.linkBareUrlDetector]: { match: Me((e2, t2) => t2.inAnchor || i2.disableAutoLink ? null : Re(D)(e2, t2)), order: 0, parse: /* @__PURE__ */ __name((e2) => ({ children: [{ text: e2[1], type: r.text }], target: e2[1], title: void 0, type: r.link }), "parse") }, [r.linkMailtoDetector]: { match: Re(U), order: 0, parse(e2) {
-    let t2 = e2[1], n3 = e2[1];
-    return d.test(n3) || (n3 = "mailto:" + n3), { children: [{ text: t2.replace("mailto:", ""), type: r.text }], target: n3, type: r.link };
-  } }, [r.orderedList]: Ce(u2, 1), [r.unorderedList]: Ce(u2, 2), [r.newlineCoalescer]: { match: De(b), order: 3, parse: Ze, render: /* @__PURE__ */ __name(() => "\n", "render") }, [r.paragraph]: { match: Me(Ne), order: 3, parse: Ge, render: /* @__PURE__ */ __name((e2, t2, n3) => u2("p", { key: n3.key }, t2(e2.children, n3)), "render") }, [r.ref]: { match: Re(P), order: 0, parse: /* @__PURE__ */ __name((e2) => (V2[e2[1]] = { target: e2[2], title: e2[4] }, {}), "parse"), render: qe }, [r.refImage]: { match: Ie(_), order: 0, parse: /* @__PURE__ */ __name((e2) => ({ alt: e2[1] || void 0, ref: e2[2] }), "parse"), render: /* @__PURE__ */ __name((e2, t2, n3) => V2[e2.ref] ? u2("img", { key: n3.key, alt: e2.alt, src: i2.sanitizer(V2[e2.ref].target, "img", "src"), title: V2[e2.ref].title }) : null, "render") }, [r.refLink]: { match: Re(F), order: 0, parse: /* @__PURE__ */ __name((e2, t2, n3) => ({ children: t2(e2[1], n3), fallbackChildren: e2[0], ref: e2[2] }), "parse"), render: /* @__PURE__ */ __name((e2, t2, n3) => V2[e2.ref] ? u2("a", { key: n3.key, href: i2.sanitizer(V2[e2.ref].target, "a", "href"), title: V2[e2.ref].title }, t2(e2.children, n3)) : u2("span", { key: n3.key }, e2.fallbackChildren), "render") }, [r.table]: { match: De(H), order: 1, parse: Te, render(e2, t2, n3) {
-    const r2 = e2;
-    return u2("table", { key: n3.key }, u2("thead", null, u2("tr", null, r2.header.map(function(e3, i3) {
-      return u2("th", { key: i3, style: Be(r2, i3) }, t2(e3, n3));
-    }))), u2("tbody", null, r2.cells.map(function(e3, i3) {
-      return u2("tr", { key: i3 }, e3.map(function(e4, i4) {
-        return u2("td", { key: i4, style: Be(r2, i4) }, t2(e4, n3));
+  __name(oe2, "oe");
+  const ue2 = [], le2 = {}, se2 = { 0: { t: [">"], o: Me(f), i: 1, u(e2, n2, r3) {
+    const [, t2, o2] = e2[0].replace(_, "").match(d);
+    return { alert: t2, children: n2(o2, r3) };
+  }, l(e2, n2, r3) {
+    const t2 = { key: r3.key };
+    return e2.alert && (t2.className = "markdown-alert-" + s2(e2.alert.toLowerCase(), Re), e2.children.unshift({ attrs: {}, children: [{ type: "27", text: e2.alert }], noInnerParse: true, type: "11", tag: "header" })), J2("blockquote", t2, n2(e2.children, r3));
+  } }, 1: { o: we(p), i: 1, u: Ve, l: /* @__PURE__ */ __name((e2, n2, r3) => J2("br", { key: r3.key }), "l") }, 2: { t: /* @__PURE__ */ __name((e2) => {
+    const n2 = e2[0];
+    return "-" === n2 || "*" === n2 || "_" === n2;
+  }, "t"), o: Me(y), i: 1, u: Ve, l: /* @__PURE__ */ __name((e2, n2, r3) => J2("hr", { key: r3.key }), "l") }, 3: { t: ["    "], o: Me(g), i: 0, u: /* @__PURE__ */ __name((e2) => ({ lang: void 0, text: Pe(ze(e2[0].replace(/^ {4}/gm, ""))) }), "u"), l: /* @__PURE__ */ __name((e2, r3, t2) => J2("pre", { key: t2.key }, J2("code", n({}, e2.attrs, { className: e2.lang ? "lang-" + e2.lang : "" }), e2.text)), "l") }, 4: { t: ["```", "~~~"], o: Me(h), i: 0, u: /* @__PURE__ */ __name((e2) => ({ attrs: oe2("code", e2[3] || ""), lang: e2[2] || void 0, text: e2[4], type: "3" }), "u") }, 5: { t: ["`"], o: Te(m), i: 3, u: /* @__PURE__ */ __name((e2) => ({ text: Pe(e2[2]) }), "u"), l: /* @__PURE__ */ __name((e2, n2, r3) => J2("code", { key: r3.key }, e2.text), "l") }, 6: { t: ["[^"], o: Me(v), i: 0, u: /* @__PURE__ */ __name((e2) => (ue2.push({ footnote: e2[2], identifier: e2[1] }), {}), "u"), l: He }, 7: { t: ["[^"], o: Ie(q), i: 1, u: /* @__PURE__ */ __name((e2) => ({ target: "#" + s2(e2[1], Re), text: e2[1] }), "u"), l: /* @__PURE__ */ __name((e2, n2, r3) => J2("a", { key: r3.key, href: V2(e2.target, "a", "href") }, J2("sup", { key: r3.key }, e2.text)), "l") }, 8: { t: ["[ ]", "[x]"], o: Ie(S), i: 1, u: /* @__PURE__ */ __name((e2) => ({ completed: "x" === e2[1].toLowerCase() }), "u"), l: /* @__PURE__ */ __name((e2, n2, r3) => J2("input", { checked: e2.completed, key: r3.key, readOnly: true, type: "checkbox" }), "l") }, 9: { t: ["#"], o: Me(t.enforceAtxHeadings ? E : z), i: 1, u: /* @__PURE__ */ __name((e2, n2, r3) => ({ children: Ze(n2, e2[2], r3), id: s2(e2[2], Re), level: e2[1].length }), "u"), l: /* @__PURE__ */ __name((e2, n2, r3) => J2("h" + e2.level, { id: e2.id, key: r3.key }, n2(e2.children, r3)), "l") }, 10: { o: Me(A), i: 0, u: /* @__PURE__ */ __name((e2, n2, r3) => ({ children: Ze(n2, e2[1], r3), level: "=" === e2[2] ? 1 : 2, type: "9" }), "u") }, 11: { t: ["<"], o: we(R), i: 1, u(e2, n2, r3) {
+    const [, t2] = e2[3].match(ie), o2 = RegExp("^" + t2, "gm"), a2 = e2[3].replace(o2, ""), i2 = (u2 = a2, W2.some((e3) => e3.test(u2)) ? Ge : Ze);
+    var u2;
+    const l2 = e2[1].toLowerCase(), s3 = -1 !== c.indexOf(l2), f2 = (s3 ? l2 : e2[1]).trim(), _2 = { attrs: oe2(f2, e2[2]), noInnerParse: s3, tag: f2 };
+    if (r3.inAnchor = r3.inAnchor || "a" === l2, s3) _2.text = e2[3];
+    else {
+      const e3 = r3.inHTML;
+      r3.inHTML = true, _2.children = i2(n2, a2, r3), r3.inHTML = e3;
+    }
+    return r3.inAnchor = false, _2;
+  }, l: /* @__PURE__ */ __name((e2, r3, t2) => J2(e2.tag, n({ key: t2.key }, e2.attrs), e2.text || (e2.children ? r3(e2.children, t2) : "")), "l") }, 13: { t: ["<"], o: we(j), i: 1, u(e2) {
+    const n2 = e2[1].trim();
+    return { attrs: oe2(n2, e2[2] || ""), tag: n2 };
+  }, l: /* @__PURE__ */ __name((e2, r3, t2) => J2(e2.tag, n({}, e2.attrs, { key: t2.key })), "l") }, 12: { t: ["<!--"], o: we(L), i: 1, u: /* @__PURE__ */ __name(() => ({}), "u"), l: He }, 14: { t: ["!["], o: Te(Se), i: 1, u: /* @__PURE__ */ __name((e2) => ({ alt: Pe(e2[1]), target: Pe(e2[2]), title: Pe(e2[3]) }), "u"), l: /* @__PURE__ */ __name((e2, n2, r3) => J2("img", { key: r3.key, alt: e2.alt || void 0, title: e2.title || void 0, src: V2(e2.target, "img", "src") }), "l") }, 15: { t: ["["], o: Ie(be), i: 3, u: /* @__PURE__ */ __name((e2, n2, r3) => ({ children: Ne(n2, e2[1], r3), target: Pe(e2[2]), title: Pe(e2[3]) }), "u"), l: /* @__PURE__ */ __name((e2, n2, r3) => J2("a", { key: r3.key, href: V2(e2.target, "a", "href"), title: e2.title }, n2(e2.children, r3)), "l") }, 16: { t: ["<"], o: Ie(M), i: 0, u: /* @__PURE__ */ __name((e2) => ({ children: [{ text: e2[1], type: "27" }], target: e2[1], type: "15" }), "u") }, 17: { t: /* @__PURE__ */ __name((e2, n2) => !n2.inAnchor && !t.disableAutoLink && (Ee(e2, "http://") || Ee(e2, "https://")), "t"), o: Ie(I), i: 0, u: /* @__PURE__ */ __name((e2) => ({ children: [{ text: e2[1], type: "27" }], target: e2[1], title: void 0, type: "15" }), "u") }, 18: { t: ["<"], o: Ie(T), i: 0, u(e2) {
+    let n2 = e2[1], r3 = e2[1];
+    return l.test(r3) || (r3 = "mailto:" + r3), { children: [{ text: n2.replace("mailto:", ""), type: "27" }], target: r3, type: "15" };
+  } }, 20: $e(J2, 1), 33: $e(J2, 2), 19: { o: Me(k), i: 3, u: Ve, l: /* @__PURE__ */ __name(() => "\n", "l") }, 21: { o: Ce(function(e2, n2) {
+    if (n2.inline || n2.simple || n2.inHTML && -1 === e2.indexOf("\n\n") && -1 === n2.prevCapture.indexOf("\n\n")) return null;
+    let r3 = "";
+    e2.split("\n").every((e3) => (e3 += "\n", !Q2.some((n3) => n3.test(e3)) && (r3 += e3, !!e3.trim())));
+    const t2 = ze(r3);
+    return "" === t2 ? null : [r3, , t2];
+  }), i: 3, u: Ue, l: /* @__PURE__ */ __name((e2, n2, r3) => J2("p", { key: r3.key }, n2(e2.children, r3)), "l") }, 22: { t: ["["], o: Ie(P), i: 0, u: /* @__PURE__ */ __name((e2) => (le2[e2[1]] = { target: e2[2], title: e2[4] }, {}), "u"), l: He }, 23: { t: ["!["], o: Te(Z), i: 0, u: /* @__PURE__ */ __name((e2) => ({ alt: e2[1] ? Pe(e2[1]) : void 0, ref: e2[2] }), "u"), l: /* @__PURE__ */ __name((e2, n2, r3) => le2[e2.ref] ? J2("img", { key: r3.key, alt: e2.alt, src: V2(le2[e2.ref].target, "img", "src"), title: le2[e2.ref].title }) : null, "l") }, 24: { t: /* @__PURE__ */ __name((e2) => "[" === e2[0] && -1 === e2.indexOf("]("), "t"), o: Ie(N), i: 0, u: /* @__PURE__ */ __name((e2, n2, r3) => ({ children: n2(e2[1], r3), fallbackChildren: e2[0], ref: e2[2] }), "u"), l: /* @__PURE__ */ __name((e2, n2, r3) => le2[e2.ref] ? J2("a", { key: r3.key, href: V2(le2[e2.ref].target, "a", "href"), title: le2[e2.ref].title }, n2(e2.children, r3)) : J2("span", { key: r3.key }, e2.fallbackChildren), "l") }, 25: { t: ["|"], o: Me(D), i: 1, u: Oe, l(e2, n2, r3) {
+    const t2 = e2;
+    return J2("table", { key: r3.key }, J2("thead", null, J2("tr", null, t2.header.map(function(e3, o2) {
+      return J2("th", { key: o2, style: je(t2, o2) }, n2(e3, r3));
+    }))), J2("tbody", null, t2.cells.map(function(e3, o2) {
+      return J2("tr", { key: o2 }, e3.map(function(e4, o3) {
+        return J2("td", { key: o3, style: je(t2, o3) }, n2(e4, r3));
       }));
     })));
-  } }, [r.text]: { match: Ue(re), order: 4, parse: /* @__PURE__ */ __name((e2) => ({ text: e2[0].replace(T, (e3, t2) => i2.namedCodesToUnicode[t2] ? i2.namedCodesToUnicode[t2] : e3) }), "parse"), render: /* @__PURE__ */ __name((e2) => e2.text, "render") }, [r.textBolded]: { match: Ie(J), order: 2, parse: /* @__PURE__ */ __name((e2, t2, n3) => ({ children: t2(e2[2], n3) }), "parse"), render: /* @__PURE__ */ __name((e2, t2, n3) => u2("strong", { key: n3.key }, t2(e2.children, n3)), "render") }, [r.textEmphasized]: { match: Ie(K), order: 3, parse: /* @__PURE__ */ __name((e2, t2, n3) => ({ children: t2(e2[2], n3) }), "parse"), render: /* @__PURE__ */ __name((e2, t2, n3) => u2("em", { key: n3.key }, t2(e2.children, n3)), "render") }, [r.textEscaped]: { match: Ie(te), order: 1, parse: /* @__PURE__ */ __name((e2) => ({ text: e2[1], type: r.text }), "parse") }, [r.textMarked]: { match: Ie(Y), order: 3, parse: Ge, render: /* @__PURE__ */ __name((e2, t2, n3) => u2("mark", { key: n3.key }, t2(e2.children, n3)), "render") }, [r.textStrikethroughed]: { match: Ie(ee), order: 3, parse: Ge, render: /* @__PURE__ */ __name((e2, t2, n3) => u2("del", { key: n3.key }, t2(e2.children, n3)), "render") } };
-  true === i2.disableParsingRawHTML && (delete X2[r.htmlBlock], delete X2[r.htmlSelfClosing]);
-  const oe2 = function(e2) {
-    let t2 = Object.keys(e2);
-    function n3(r2, i3) {
-      let l2, o2, a2 = [], c2 = "", s2 = "";
-      for (i3.prevCapture = i3.prevCapture || ""; r2; ) {
-        let d2 = 0;
-        for (; d2 < t2.length; ) {
-          if (c2 = t2[d2], l2 = e2[c2], i3.inline && !l2.match.inline) {
-            d2++;
-            continue;
-          }
-          const u3 = l2.match(r2, i3);
-          if (u3) {
-            s2 = u3[0], i3.prevCapture += s2, r2 = r2.substring(s2.length), o2 = l2.parse(u3, n3, i3), null == o2.type && (o2.type = c2), a2.push(o2);
+  } }, 27: { o: Ce(function(e2, n2) {
+    let r3;
+    return Ee(e2, ":") && (r3 = re.exec(e2)), r3 || ae.exec(e2);
+  }), i: 4, u(e2) {
+    const n2 = e2[0];
+    return { text: -1 === n2.indexOf("&") ? n2 : n2.replace(B, (e3, n3) => t.namedCodesToUnicode[n3] || e3) };
+  }, l: /* @__PURE__ */ __name((e2) => e2.text, "l") }, 28: { t: ["**", "__"], o: Te(X), i: 2, u: /* @__PURE__ */ __name((e2, n2, r3) => ({ children: n2(e2[2], r3) }), "u"), l: /* @__PURE__ */ __name((e2, n2, r3) => J2("strong", { key: r3.key }, n2(e2.children, r3)), "l") }, 29: { t: /* @__PURE__ */ __name((e2) => {
+    const n2 = e2[0];
+    return ("*" === n2 || "_" === n2) && e2[1] !== n2;
+  }, "t"), o: Te(Y), i: 3, u: /* @__PURE__ */ __name((e2, n2, r3) => ({ children: n2(e2[2], r3) }), "u"), l: /* @__PURE__ */ __name((e2, n2, r3) => J2("em", { key: r3.key }, n2(e2.children, r3)), "l") }, 30: { t: ["\\"], o: Te(te), i: 1, u: /* @__PURE__ */ __name((e2) => ({ text: e2[1], type: "27" }), "u") }, 31: { t: ["=="], o: Te(ee), i: 3, u: Ue, l: /* @__PURE__ */ __name((e2, n2, r3) => J2("mark", { key: r3.key }, n2(e2.children, r3)), "l") }, 32: { t: ["~~"], o: Te(ne), i: 3, u: Ue, l: /* @__PURE__ */ __name((e2, n2, r3) => J2("del", { key: r3.key }, n2(e2.children, r3)), "l") } };
+  true === t.disableParsingRawHTML && (delete se2[11], delete se2[13]);
+  const fe2 = function(e2) {
+    var n2 = Object.keys(e2);
+    function r3(t2, o2) {
+      var a2 = [];
+      if (o2.prevCapture = o2.prevCapture || "", t2.trim()) for (; t2; ) for (var c2 = 0; c2 < n2.length; ) {
+        var i2 = n2[c2], u2 = e2[i2];
+        if (!u2.t || Ae(t2, o2, u2.t)) {
+          var l2 = u2.o(t2, o2);
+          if (l2 && l2[0]) {
+            t2 = t2.substring(l2[0].length);
+            var s3 = u2.u(l2, r3, o2);
+            o2.prevCapture += l2[0], s3.type || (s3.type = i2), a2.push(s3);
             break;
           }
-          d2++;
-        }
+          c2++;
+        } else c2++;
       }
-      return i3.prevCapture = "", a2;
-    }
-    __name(n3, "n");
-    return t2.sort(function(t3, n4) {
-      let r2 = e2[t3].order, i3 = e2[n4].order;
-      return r2 !== i3 ? r2 - i3 : t3 < n4 ? -1 : 1;
-    }), function(e3, t3) {
-      return n3(function(e4) {
-        return e4.replace(v, "\n").replace(S, "").replace(G, "    ");
-      }(e3), t3);
+      return o2.prevCapture = "", a2;
+    }
+    __name(r3, "r");
+    return n2.sort(function(n3, r4) {
+      return e2[n3].i - e2[r4].i || (n3 < r4 ? -1 : 1);
+    }), function(e3, n3) {
+      return r3(function(e4) {
+        return e4.replace(x, "\n").replace($, "").replace(U, "    ");
+      }(e3), n3);
     };
-  }(X2), ae2 = (ce2 = /* @__PURE__ */ function(e2, t2) {
-    return function(n3, r2, i3) {
-      const l2 = e2[n3.type].render;
-      return t2 ? t2(() => l2(n3, r2, i3), n3, r2, i3) : l2(n3, r2, i3);
+  }(se2), _e2 = (de2 = /* @__PURE__ */ function(e2, n2) {
+    return function(r3, t2, o2) {
+      const a2 = e2[r3.type].l;
+      return n2 ? n2(() => a2(r3, t2, o2), r3, t2, o2) : a2(r3, t2, o2);
     };
-  }(X2, i2.renderRule), /* @__PURE__ */ __name(function e2(t2, n3 = {}) {
-    if (Array.isArray(t2)) {
-      const r2 = n3.key, i3 = [];
-      let l2 = false;
-      for (let r3 = 0; r3 < t2.length; r3++) {
-        n3.key = r3;
-        const o2 = e2(t2[r3], n3), a2 = "string" == typeof o2;
-        a2 && l2 ? i3[i3.length - 1] += o2 : null !== o2 && i3.push(o2), l2 = a2;
-      }
-      return n3.key = r2, i3;
-    }
-    return ce2(t2, e2, n3);
+  }(se2, t.renderRule), /* @__PURE__ */ __name(function e2(n2, r3 = {}) {
+    if (Array.isArray(n2)) {
+      const t2 = r3.key, o2 = [];
+      let a2 = false;
+      for (let t3 = 0; t3 < n2.length; t3++) {
+        r3.key = t3;
+        const c2 = e2(n2[t3], r3), i2 = "string" == typeof c2;
+        i2 && a2 ? o2[o2.length - 1] += c2 : null !== c2 && o2.push(c2), a2 = i2;
+      }
+      return r3.key = t2, o2;
+    }
+    return de2(n2, e2, r3);
   }, "e"));
-  var ce2;
-  const se2 = Z2(n2);
-  return Q2.length ? u2("div", null, se2, u2("footer", { key: "footer" }, Q2.map(function(e2) {
-    return u2("div", { id: i2.slugify(e2.identifier, Le), key: e2.identifier }, e2.identifier, ae2(oe2(e2.footnote, { inline: true })));
-  }))) : se2;
+  var de2;
+  const pe2 = K2(r2);
+  return ue2.length ? J2("div", null, pe2, J2("footer", { key: "footer" }, ue2.map(function(e2) {
+    return J2("div", { id: s2(e2.identifier, Re), key: e2.identifier }, e2.identifier, _e2(fe2(e2.footnote, { inline: true })));
+  }))) : pe2;
 }
-__name(Xe, "Xe");
-var index_modern_default = /* @__PURE__ */ __name((t2) => {
-  let { children: r2 = "", options: i2 } = t2, l2 = function(e2, t3) {
+__name(Je, "Je");
+var index_modern_default = /* @__PURE__ */ __name((n2) => {
+  let { children: t = "", options: o2 } = n2, a2 = function(e2, n3) {
     if (null == e2) return {};
-    var n2, r3, i3 = {}, l3 = Object.keys(e2);
-    for (r3 = 0; r3 < l3.length; r3++) t3.indexOf(n2 = l3[r3]) >= 0 || (i3[n2] = e2[n2]);
-    return i3;
-  }(t2, n);
-  return e.cloneElement(Xe(r2, i2), l2);
+    var r2, t2, o3 = {}, a3 = Object.keys(e2);
+    for (t2 = 0; t2 < a3.length; t2++) n3.indexOf(r2 = a3[t2]) >= 0 || (o3[r2] = e2[r2]);
+    return o3;
+  }(n2, r);
+  return e.cloneElement(Je(t, o2), a2);
 }, "default");
 
 // src/blocks/components/ArgsTable/ArgRow.tsx
 import { styled as styled22 } from "storybook/theming";
 
 // src/blocks/components/ArgsTable/ArgControl.tsx
-import React26, { useCallback as useCallback6, useEffect as useEffect8, useState as useState8 } from "react";
+import React27, { useCallback as useCallback6, useEffect as useEffect9, useState as useState9 } from "react";
 import { Link } from "storybook/internal/components";
 
 // src/blocks/controls/index.tsx
-import React25, { Suspense, lazy } from "react";
+import React26, { Suspense, lazy } from "react";
 
 // src/blocks/controls/Boolean.tsx
-import React11, { useCallback as useCallback2 } from "react";
+import React12, { useCallback as useCallback2 } from "react";
 import { Button } from "storybook/internal/components";
 import { styled as styled9 } from "storybook/theming";
 var Label2 = styled9.label(({ theme }) => ({
@@ -1976,7 +2931,7 @@ var BooleanControl = /* @__PURE__ */ __name(({
   const onSetFalse = useCallback2(() => onChange(false), [onChange]);
   const readonly = !!argType?.table?.readonly;
   if (value2 === void 0) {
-    return React11.createElement(
+    return React12.createElement(
       Button,
       {
         variant: "outline",
@@ -1990,7 +2945,7 @@ var BooleanControl = /* @__PURE__ */ __name(({
   }
   const controlId = getControlId(name);
   const parsedValue = typeof value2 === "string" ? parse(value2) : value2;
-  return React11.createElement(Label2, { "aria-disabled": readonly, htmlFor: controlId, "aria-label": name }, React11.createElement(
+  return React12.createElement(Label2, { "aria-disabled": readonly, htmlFor: controlId, "aria-label": name }, React12.createElement(
     "input",
     {
       id: controlId,
@@ -2001,11 +2956,11 @@ var BooleanControl = /* @__PURE__ */ __name(({
       disabled: readonly,
       ...{ name, onBlur, onFocus }
     }
-  ), React11.createElement("span", { "aria-hidden": "true" }, "False"), React11.createElement("span", { "aria-hidden": "true" }, "True"));
+  ), React12.createElement("span", { "aria-hidden": "true" }, "False"), React12.createElement("span", { "aria-hidden": "true" }, "True"));
 }, "BooleanControl");
 
 // src/blocks/controls/Date.tsx
-import React12, { useEffect as useEffect3, useRef as useRef2, useState as useState3 } from "react";
+import React13, { useEffect as useEffect4, useRef as useRef2, useState as useState4 } from "react";
 import { Form } from "storybook/internal/components";
 import { styled as styled10 } from "storybook/theming";
 var parseDate = /* @__PURE__ */ __name((value2) => {
@@ -2060,11 +3015,11 @@ var FlexSpaced = styled10.div(({ theme }) => ({
   }
 }));
 var DateControl = /* @__PURE__ */ __name(({ name, value: value2, onChange, onFocus, onBlur, argType }) => {
-  const [valid, setValid] = useState3(true);
+  const [valid, setValid] = useState4(true);
   const dateRef = useRef2();
   const timeRef = useRef2();
   const readonly = !!argType?.table?.readonly;
-  useEffect3(() => {
+  useEffect4(() => {
     if (valid !== false) {
       if (dateRef && dateRef.current) {
         dateRef.current.value = value2 ? formatDate(value2) : "";
@@ -2102,7 +3057,7 @@ var DateControl = /* @__PURE__ */ __name(({ name, value: value2, onChange, onFoc
     setValid(!!time);
   }, "onTimeChange");
   const controlId = getControlId(name);
-  return React12.createElement(FlexSpaced, null, React12.createElement(
+  return React13.createElement(FlexSpaced, null, React13.createElement(
     FormInput,
     {
       type: "date",
@@ -2114,7 +3069,7 @@ var DateControl = /* @__PURE__ */ __name(({ name, value: value2, onChange, onFoc
       onChange: onDateChange,
       ...{ onFocus, onBlur }
     }
-  ), React12.createElement(
+  ), React13.createElement(
     FormInput,
     {
       type: "time",
@@ -2125,11 +3080,11 @@ var DateControl = /* @__PURE__ */ __name(({ name, value: value2, onChange, onFoc
       readOnly: readonly,
       ...{ onFocus, onBlur }
     }
-  ), !valid ? React12.createElement("div", null, "invalid") : null);
+  ), !valid ? React13.createElement("div", null, "invalid") : null);
 }, "DateControl");
 
 // src/blocks/controls/Number.tsx
-import React13, { useCallback as useCallback3, useEffect as useEffect4, useRef as useRef3, useState as useState4 } from "react";
+import React14, { useCallback as useCallback3, useEffect as useEffect5, useRef as useRef3, useState as useState5 } from "react";
 import { Button as Button2, Form as Form2 } from "storybook/internal/components";
 import { styled as styled11 } from "storybook/theming";
 var Wrapper3 = styled11.label({
@@ -2154,9 +3109,9 @@ var NumberControl = /* @__PURE__ */ __name(({
   onFocus,
   argType
 }) => {
-  const [inputValue, setInputValue] = useState4(typeof value2 === "number" ? value2 : "");
-  const [forceVisible, setForceVisible] = useState4(false);
-  const [parseError, setParseError] = useState4(null);
+  const [inputValue, setInputValue] = useState5(typeof value2 === "number" ? value2 : "");
+  const [forceVisible, setForceVisible] = useState5(false);
+  const [parseError, setParseError] = useState5(null);
   const readonly = !!argType?.table?.readonly;
   const handleChange = useCallback3(
     (event) => {
@@ -2177,19 +3132,19 @@ var NumberControl = /* @__PURE__ */ __name(({
     setForceVisible(true);
   }, [setForceVisible]);
   const htmlElRef = useRef3(null);
-  useEffect4(() => {
+  useEffect5(() => {
     if (forceVisible && htmlElRef.current) {
       htmlElRef.current.select();
     }
   }, [forceVisible]);
-  useEffect4(() => {
+  useEffect5(() => {
     const newInputValue = typeof value2 === "number" ? value2 : "";
     if (inputValue !== newInputValue) {
       setInputValue(newInputValue);
     }
   }, [value2]);
   if (value2 === void 0) {
-    return React13.createElement(
+    return React14.createElement(
       Button2,
       {
         variant: "outline",
@@ -2201,7 +3156,7 @@ var NumberControl = /* @__PURE__ */ __name(({
       "Set number"
     );
   }
-  return React13.createElement(Wrapper3, null, React13.createElement(
+  return React14.createElement(Wrapper3, null, React14.createElement(
     FormInput2,
     {
       ref: htmlElRef,
@@ -2220,10 +3175,10 @@ var NumberControl = /* @__PURE__ */ __name(({
 }, "NumberControl");
 
 // src/blocks/controls/options/Options.tsx
-import React17 from "react";
+import React18 from "react";
 
 // src/blocks/controls/options/Checkbox.tsx
-import React14, { useEffect as useEffect5, useState as useState5 } from "react";
+import React15, { useEffect as useEffect6, useState as useState6 } from "react";
 import { logger } from "storybook/internal/client-logger";
 import { styled as styled12 } from "storybook/theming";
 
@@ -2287,10 +3242,10 @@ var CheckboxControl = /* @__PURE__ */ __name(({
 }) => {
   if (!options) {
     logger.warn(`Checkbox with no options: ${name}`);
-    return React14.createElement(React14.Fragment, null, "-");
+    return React15.createElement(React15.Fragment, null, "-");
   }
   const initial = selectedKeys(value2 || [], options);
-  const [selected, setSelected] = useState5(initial);
+  const [selected, setSelected] = useState6(initial);
   const readonly = !!argType?.table?.readonly;
   const handleChange = /* @__PURE__ */ __name((e2) => {
     const option = e2.target.value;
@@ -2303,13 +3258,13 @@ var CheckboxControl = /* @__PURE__ */ __name(({
     onChange(selectedValues(updated, options));
     setSelected(updated);
   }, "handleChange");
-  useEffect5(() => {
+  useEffect6(() => {
     setSelected(selectedKeys(value2 || [], options));
   }, [value2]);
   const controlId = getControlId(name);
-  return React14.createElement(Wrapper4, { "aria-readonly": readonly, isInline }, Object.keys(options).map((key, index) => {
+  return React15.createElement(Wrapper4, { "aria-readonly": readonly, isInline }, Object.keys(options).map((key, index) => {
     const id = `${controlId}-${index}`;
-    return React14.createElement(Label3, { key: id, htmlFor: id }, React14.createElement(
+    return React15.createElement(Label3, { key: id, htmlFor: id }, React15.createElement(
       "input",
       {
         type: "checkbox",
@@ -2320,12 +3275,12 @@ var CheckboxControl = /* @__PURE__ */ __name(({
         onChange: handleChange,
         checked: selected?.includes(key)
       }
-    ), React14.createElement(Text, null, key));
+    ), React15.createElement(Text, null, key));
   }));
 }, "CheckboxControl");
 
 // src/blocks/controls/options/Radio.tsx
-import React15 from "react";
+import React16 from "react";
 import { logger as logger2 } from "storybook/internal/client-logger";
 import { styled as styled13 } from "storybook/theming";
 var Wrapper5 = styled13.div(
@@ -2379,14 +3334,14 @@ var RadioControl = /* @__PURE__ */ __name(({
 }) => {
   if (!options) {
     logger2.warn(`Radio with no options: ${name}`);
-    return React15.createElement(React15.Fragment, null, "-");
+    return React16.createElement(React16.Fragment, null, "-");
   }
   const selection = selectedKey(value2, options);
   const controlId = getControlId(name);
   const readonly = !!argType?.table?.readonly;
-  return React15.createElement(Wrapper5, { "aria-readonly": readonly, isInline }, Object.keys(options).map((key, index) => {
+  return React16.createElement(Wrapper5, { "aria-readonly": readonly, isInline }, Object.keys(options).map((key, index) => {
     const id = `${controlId}-${index}`;
-    return React15.createElement(Label4, { key: id, htmlFor: id }, React15.createElement(
+    return React16.createElement(Label4, { key: id, htmlFor: id }, React16.createElement(
       "input",
       {
         type: "radio",
@@ -2397,12 +3352,12 @@ var RadioControl = /* @__PURE__ */ __name(({
         onChange: (e2) => onChange(options[e2.currentTarget.value]),
         checked: key === selection
       }
-    ), React15.createElement(Text2, null, key));
+    ), React16.createElement(Text2, null, key));
   }));
 }, "RadioControl");
 
 // src/blocks/controls/options/Select.tsx
-import React16 from "react";
+import React17 from "react";
 import { logger as logger3 } from "storybook/internal/client-logger";
 import { ChevronSmallDownIcon } from "@storybook/icons";
 import { styled as styled14 } from "storybook/theming";
@@ -2480,7 +3435,7 @@ var SingleSelect = /* @__PURE__ */ __name(({ name, value: value2, options, onCha
   const selection = selectedKey(value2, options) || NO_SELECTION;
   const controlId = getControlId(name);
   const readonly = !!argType?.table?.readonly;
-  return React16.createElement(SelectWrapper, null, React16.createElement(ChevronSmallDownIcon, null), React16.createElement(OptionsSelect, { disabled: readonly, id: controlId, value: selection, onChange: handleChange }, React16.createElement("option", { key: "no-selection", disabled: true }, NO_SELECTION), Object.keys(options).map((key) => React16.createElement("option", { key, value: key }, key))));
+  return React17.createElement(SelectWrapper, null, React17.createElement(ChevronSmallDownIcon, null), React17.createElement(OptionsSelect, { disabled: readonly, id: controlId, value: selection, onChange: handleChange }, React17.createElement("option", { key: "no-selection", disabled: true }, NO_SELECTION), Object.keys(options).map((key) => React17.createElement("option", { key, value: key }, key))));
 }, "SingleSelect");
 var MultiSelect = /* @__PURE__ */ __name(({ name, value: value2, options, onChange, argType }) => {
   const handleChange = /* @__PURE__ */ __name((e2) => {
@@ -2490,7 +3445,7 @@ var MultiSelect = /* @__PURE__ */ __name(({ name, value: value2, options, onChan
   const selection = selectedKeys(value2, options);
   const controlId = getControlId(name);
   const readonly = !!argType?.table?.readonly;
-  return React16.createElement(SelectWrapper, null, React16.createElement(
+  return React17.createElement(SelectWrapper, null, React17.createElement(
     OptionsSelect,
     {
       disabled: readonly,
@@ -2499,16 +3454,16 @@ var MultiSelect = /* @__PURE__ */ __name(({ name, value: value2, options, onChan
       value: selection,
       onChange: handleChange
     },
-    Object.keys(options).map((key) => React16.createElement("option", { key, value: key }, key))
+    Object.keys(options).map((key) => React17.createElement("option", { key, value: key }, key))
   ));
 }, "MultiSelect");
 var SelectControl = /* @__PURE__ */ __name((props) => {
   const { name, options } = props;
   if (!options) {
     logger3.warn(`Select with no options: ${name}`);
-    return React16.createElement(React16.Fragment, null, "-");
+    return React17.createElement(React17.Fragment, null, "-");
   }
-  return props.isMulti ? React16.createElement(MultiSelect, { ...props }) : React16.createElement(SingleSelect, { ...props });
+  return props.isMulti ? React17.createElement(MultiSelect, { ...props }) : React17.createElement(SingleSelect, { ...props });
 }, "SelectControl");
 
 // src/blocks/controls/options/Options.tsx
@@ -2540,25 +3495,25 @@ var OptionsControl = /* @__PURE__ */ __name((props) => {
   };
   const Control = Controls[type];
   if (Control) {
-    return React17.createElement(Control, { ...normalized });
+    return React18.createElement(Control, { ...normalized });
   }
   throw new Error(`Unknown options type: ${type}`);
 }, "OptionsControl");
 
 // src/blocks/controls/Object.tsx
-import React21, { useCallback as useCallback4, useEffect as useEffect6, useMemo, useRef as useRef4, useState as useState6 } from "react";
+import React22, { useCallback as useCallback4, useEffect as useEffect7, useMemo, useRef as useRef4, useState as useState7 } from "react";
 import { Button as Button3, Form as Form3, IconButton as IconButton2 } from "storybook/internal/components";
 import { AddIcon, EyeCloseIcon, EyeIcon, SubtractIcon } from "@storybook/icons";
 import { styled as styled16, useTheme } from "storybook/theming";
 
 // src/blocks/controls/react-editable-json-tree/index.tsx
-import React20, { Component as Component3 } from "react";
+import React21, { Component as Component3 } from "react";
 
 // src/blocks/controls/react-editable-json-tree/JsonNodes.tsx
-import React19, { Component as Component2, cloneElement as cloneElement2 } from "react";
+import React20, { Component as Component2, cloneElement as cloneElement2 } from "react";
 
 // src/blocks/controls/react-editable-json-tree/JsonNodeAccordion.tsx
-import React18 from "react";
+import React19 from "react";
 import { styled as styled15 } from "storybook/theming";
 var Container = styled15.div(({ theme }) => ({
   position: "relative",
@@ -2629,7 +3584,7 @@ function JsonNodeAccordion({
     region: `${accordionKey}-region`
   };
   const containerTag = keyPath.length > 0 ? "li" : "div";
-  return React18.createElement(Container, { as: containerTag }, React18.createElement(
+  return React19.createElement(Container, { as: containerTag }, React19.createElement(
     Trigger,
     {
       type: "button",
@@ -2641,7 +3596,7 @@ function JsonNodeAccordion({
     },
     name,
     " :"
-  ), React18.createElement(
+  ), React19.createElement(
     Region,
     {
       role: "region",
@@ -2785,15 +3740,15 @@ var _JsonAddValue = class _JsonAddValue extends Component2 {
         onKeyDown: this.onKeydown
       });
     }
-    return React19.createElement("span", { className: "rejt-add-value-node" }, inputElementKeyLayout, inputElementValueLayout, addButtonElementLayout, cancelButtonElementLayout);
+    return React20.createElement("span", { className: "rejt-add-value-node" }, inputElementKeyLayout, inputElementValueLayout, addButtonElementLayout, cancelButtonElementLayout);
   }
 };
 __name(_JsonAddValue, "JsonAddValue");
 var JsonAddValue = _JsonAddValue;
 JsonAddValue.defaultProps = {
   onlyValue: false,
-  addButtonElement: React19.createElement("button", null, "+"),
-  cancelButtonElement: React19.createElement("button", null, "c")
+  addButtonElement: React20.createElement("button", null, "+"),
+  cancelButtonElement: React20.createElement("button", null, "c")
 };
 var _JsonArray = class _JsonArray extends Component2 {
   constructor(props) {
@@ -2862,9 +3817,10 @@ var _JsonArray = class _JsonArray extends Component2 {
       }).catch(logger4.error);
     };
   }
-  handleAddValueAdd({ key, newValue }) {
+  handleAddValueAdd({ newValue }) {
     const { data, keyPath = [], nextDeep: deep } = this.state;
     const { beforeAddAction, logger: logger4 } = this.props;
+    const key = data.length;
     (beforeAddAction || Promise.resolve.bind(Promise))(key, keyPath, deep, newValue).then(() => {
       data[key] = newValue;
       this.setState({
@@ -2922,7 +3878,7 @@ var _JsonArray = class _JsonArray extends Component2 {
       style: minus,
       "aria-label": `remove the array '${String(name)}'`
     });
-    return React19.createElement(React19.Fragment, null, React19.createElement("span", { style: collapsed }, "[...] ", data.length, " ", data.length === 1 ? "item" : "items"), !isReadOnly && removeItemButton);
+    return React20.createElement(React20.Fragment, null, React20.createElement("span", { style: collapsed }, "[...] ", data.length, " ", data.length === 1 ? "item" : "items"), !isReadOnly && removeItemButton);
   }
   renderNotCollapsed() {
     const { name, data, keyPath, deep, addFormVisible, nextDeep } = this.state;
@@ -2962,7 +3918,7 @@ var _JsonArray = class _JsonArray extends Component2 {
     const onlyValue = true;
     const startObject = "[";
     const endObject = "]";
-    return React19.createElement(React19.Fragment, null, React19.createElement("span", { className: "rejt-not-collapsed-delimiter", style: delimiter }, startObject), !addFormVisible && addItemButton, React19.createElement("ul", { className: "rejt-not-collapsed-list", style: ul }, data.map((item, index) => React19.createElement(
+    return React20.createElement(React20.Fragment, null, React20.createElement("span", { className: "rejt-not-collapsed-delimiter", style: delimiter }, startObject), !addFormVisible && addItemButton, React20.createElement("ul", { className: "rejt-not-collapsed-list", style: ul }, data.map((item, index) => React20.createElement(
       JsonNode,
       {
         key: index,
@@ -2989,7 +3945,7 @@ var _JsonArray = class _JsonArray extends Component2 {
         logger: logger4,
         onSubmitValueParser
       }
-    ))), !isReadOnly && addFormVisible && React19.createElement("div", { className: "rejt-add-form", style: addForm }, React19.createElement(
+    ))), !isReadOnly && addFormVisible && React20.createElement("div", { className: "rejt-add-form", style: addForm }, React20.createElement(
       JsonAddValue,
       {
         handleAdd: this.handleAddValueAdd,
@@ -3002,12 +3958,12 @@ var _JsonArray = class _JsonArray extends Component2 {
         deep,
         onSubmitValueParser
       }
-    )), React19.createElement("span", { className: "rejt-not-collapsed-delimiter", style: delimiter }, endObject), !isReadOnly && removeItemButton);
+    )), React20.createElement("span", { className: "rejt-not-collapsed-delimiter", style: delimiter }, endObject), !isReadOnly && removeItemButton);
   }
   render() {
     const { name, collapsed, keyPath, deep } = this.state;
     const value2 = collapsed ? this.renderCollapsed() : this.renderNotCollapsed();
-    return React19.createElement(
+    return React20.createElement(
       JsonNodeAccordion,
       {
         name,
@@ -3025,8 +3981,8 @@ var JsonArray = _JsonArray;
 JsonArray.defaultProps = {
   keyPath: [],
   deep: 0,
-  minusMenuElement: React19.createElement("span", null, " - "),
-  plusMenuElement: React19.createElement("span", null, " + ")
+  minusMenuElement: React20.createElement("span", null, " - "),
+  plusMenuElement: React20.createElement("span", null, " + ")
 };
 var _JsonFunctionValue = class _JsonFunctionValue extends Component2 {
   constructor(props) {
@@ -3131,10 +4087,10 @@ var _JsonFunctionValue = class _JsonFunctionValue extends Component2 {
         defaultValue: value2,
         onKeyDown: this.onKeydown
       });
-      result = React19.createElement("span", { className: "rejt-edit-form", style: style.editForm }, textareaElementLayout);
+      result = React20.createElement("span", { className: "rejt-edit-form", style: style.editForm }, textareaElementLayout);
       minusElement = null;
     } else {
-      result = React19.createElement(
+      result = React20.createElement(
         "span",
         {
           className: "rejt-value",
@@ -3152,7 +4108,7 @@ var _JsonFunctionValue = class _JsonFunctionValue extends Component2 {
       });
       minusElement = resultOnlyResult ? null : minusMenuLayout;
     }
-    return React19.createElement("li", { className: "rejt-value-node", style: style.li }, React19.createElement("span", { className: "rejt-name", style: style.name }, name, " :", " "), result, minusElement);
+    return React20.createElement("li", { className: "rejt-value-node", style: style.li }, React20.createElement("span", { className: "rejt-name", style: style.name }, name, " :", " "), result, minusElement);
   }
 };
 __name(_JsonFunctionValue, "JsonFunctionValue");
@@ -3162,8 +4118,8 @@ JsonFunctionValue.defaultProps = {
   deep: 0,
   handleUpdateValue: /* @__PURE__ */ __name(() => {
   }, "handleUpdateValue"),
-  cancelButtonElement: React19.createElement("button", null, "c"),
-  minusMenuElement: React19.createElement("span", null, " - ")
+  cancelButtonElement: React20.createElement("button", null, "c"),
+  minusMenuElement: React20.createElement("span", null, " - ")
 };
 var _JsonNode = class _JsonNode extends Component2 {
   constructor(props) {
@@ -3204,7 +4160,7 @@ var _JsonNode = class _JsonNode extends Component2 {
     const dataType = getObjectType(data);
     switch (dataType) {
       case ERROR:
-        return React19.createElement(
+        return React20.createElement(
           JsonObject,
           {
             data,
@@ -3232,7 +4188,7 @@ var _JsonNode = class _JsonNode extends Component2 {
           }
         );
       case OBJECT:
-        return React19.createElement(
+        return React20.createElement(
           JsonObject,
           {
             data,
@@ -3260,7 +4216,7 @@ var _JsonNode = class _JsonNode extends Component2 {
           }
         );
       case ARRAY:
-        return React19.createElement(
+        return React20.createElement(
           JsonArray,
           {
             data,
@@ -3288,7 +4244,7 @@ var _JsonNode = class _JsonNode extends Component2 {
           }
         );
       case STRING:
-        return React19.createElement(
+        return React20.createElement(
           JsonValue,
           {
             name,
@@ -3309,7 +4265,7 @@ var _JsonNode = class _JsonNode extends Component2 {
           }
         );
       case NUMBER:
-        return React19.createElement(
+        return React20.createElement(
           JsonValue,
           {
             name,
@@ -3330,7 +4286,7 @@ var _JsonNode = class _JsonNode extends Component2 {
           }
         );
       case BOOLEAN:
-        return React19.createElement(
+        return React20.createElement(
           JsonValue,
           {
             name,
@@ -3351,7 +4307,7 @@ var _JsonNode = class _JsonNode extends Component2 {
           }
         );
       case DATE:
-        return React19.createElement(
+        return React20.createElement(
           JsonValue,
           {
             name,
@@ -3372,7 +4328,7 @@ var _JsonNode = class _JsonNode extends Component2 {
           }
         );
       case NULL:
-        return React19.createElement(
+        return React20.createElement(
           JsonValue,
           {
             name,
@@ -3393,7 +4349,7 @@ var _JsonNode = class _JsonNode extends Component2 {
           }
         );
       case UNDEFINED:
-        return React19.createElement(
+        return React20.createElement(
           JsonValue,
           {
             name,
@@ -3414,7 +4370,7 @@ var _JsonNode = class _JsonNode extends Component2 {
           }
         );
       case FUNCTION:
-        return React19.createElement(
+        return React20.createElement(
           JsonFunctionValue,
           {
             name,
@@ -3435,7 +4391,7 @@ var _JsonNode = class _JsonNode extends Component2 {
           }
         );
       case SYMBOL:
-        return React19.createElement(
+        return React20.createElement(
           JsonValue,
           {
             name,
@@ -3594,7 +4550,7 @@ var _JsonObject = class _JsonObject extends Component2 {
       style: minus,
       "aria-label": `remove the object '${String(name)}'`
     });
-    return React19.createElement(React19.Fragment, null, React19.createElement("span", { style: collapsed }, "{...}", " ", keyList.length, " ", keyList.length === 1 ? "key" : "keys"), !isReadOnly && removeItemButton);
+    return React20.createElement(React20.Fragment, null, React20.createElement("span", { style: collapsed }, "{...}", " ", keyList.length, " ", keyList.length === 1 ? "key" : "keys"), !isReadOnly && removeItemButton);
   }
   renderNotCollapsed() {
     const { name, data, keyPath, deep, nextDeep, addFormVisible } = this.state;
@@ -3632,7 +4588,7 @@ var _JsonObject = class _JsonObject extends Component2 {
       style: minus,
       "aria-label": `remove the object '${String(name)}'`
     });
-    const list = keyList.map((key) => React19.createElement(
+    const list = keyList.map((key) => React20.createElement(
       JsonNode,
       {
         key,
@@ -3662,7 +4618,7 @@ var _JsonObject = class _JsonObject extends Component2 {
     ));
     const startObject = "{";
     const endObject = "}";
-    return React19.createElement(React19.Fragment, null, React19.createElement("span", { className: "rejt-not-collapsed-delimiter", style: delimiter }, startObject), !isReadOnly && addItemButton, React19.createElement("ul", { className: "rejt-not-collapsed-list", style: ul }, list), !isReadOnly && addFormVisible && React19.createElement("div", { className: "rejt-add-form", style: addForm }, React19.createElement(
+    return React20.createElement(React20.Fragment, null, React20.createElement("span", { className: "rejt-not-collapsed-delimiter", style: delimiter }, startObject), !isReadOnly && addItemButton, React20.createElement("ul", { className: "rejt-not-collapsed-list", style: ul }, list), !isReadOnly && addFormVisible && React20.createElement("div", { className: "rejt-add-form", style: addForm }, React20.createElement(
       JsonAddValue,
       {
         handleAdd: this.handleAddValueAdd,
@@ -3674,12 +4630,12 @@ var _JsonObject = class _JsonObject extends Component2 {
         deep,
         onSubmitValueParser
       }
-    )), React19.createElement("span", { className: "rejt-not-collapsed-delimiter", style: delimiter }, endObject), !isReadOnly && removeItemButton);
+    )), React20.createElement("span", { className: "rejt-not-collapsed-delimiter", style: delimiter }, endObject), !isReadOnly && removeItemButton);
   }
   render() {
     const { name, collapsed, keyPath, deep = 0 } = this.state;
     const value2 = collapsed ? this.renderCollapsed() : this.renderNotCollapsed();
-    return React19.createElement(
+    return React20.createElement(
       JsonNodeAccordion,
       {
         name,
@@ -3697,8 +4653,8 @@ var JsonObject = _JsonObject;
 JsonObject.defaultProps = {
   keyPath: [],
   deep: 0,
-  minusMenuElement: React19.createElement("span", null, " - "),
-  plusMenuElement: React19.createElement("span", null, " + ")
+  minusMenuElement: React20.createElement("span", null, " - "),
+  plusMenuElement: React20.createElement("span", null, " + ")
 };
 var _JsonValue = class _JsonValue extends Component2 {
   constructor(props) {
@@ -3808,7 +4764,7 @@ var _JsonValue = class _JsonValue extends Component2 {
       style: style.minus,
       "aria-label": `remove the property '${String(name)}' with value '${String(originalValue)}'${String(parentPropertyName) ? ` from '${String(parentPropertyName)}'` : ""}`
     });
-    return React19.createElement("li", { className: "rejt-value-node", style: style.li }, React19.createElement("span", { className: "rejt-name", style: style.name }, name, " : "), isEditing ? React19.createElement("span", { className: "rejt-edit-form", style: style.editForm }, inputElementLayout) : React19.createElement(
+    return React20.createElement("li", { className: "rejt-value-node", style: style.li }, React20.createElement("span", { className: "rejt-name", style: style.name }, name, " : "), isEditing ? React20.createElement("span", { className: "rejt-edit-form", style: style.editForm }, inputElementLayout) : React20.createElement(
       "span",
       {
         className: "rejt-value",
@@ -3825,8 +4781,8 @@ JsonValue.defaultProps = {
   keyPath: [],
   deep: 0,
   handleUpdateValue: /* @__PURE__ */ __name(() => Promise.resolve(), "handleUpdateValue"),
-  cancelButtonElement: React19.createElement("button", null, "c"),
-  minusMenuElement: React19.createElement("span", null, " - ")
+  cancelButtonElement: React20.createElement("button", null, "c"),
+  minusMenuElement: React20.createElement("span", null, " - ")
 };
 
 // src/blocks/controls/react-editable-json-tree/utils/parse.ts
@@ -3965,7 +4921,7 @@ var _JsonTree = class _JsonTree extends Component3 {
       textareaElementFunction = /* @__PURE__ */ __name(() => textareaElement, "textareaElementFunction");
     }
     if (dataType === "Object" || dataType === "Array") {
-      return React20.createElement("div", { className: "rejt-tree" }, React20.createElement(
+      return React21.createElement("div", { className: "rejt-tree" }, React21.createElement(
         JsonNode,
         {
           data,
@@ -4022,8 +4978,8 @@ JsonTree.defaultProps = {
   logger: { error: /* @__PURE__ */ __name(() => {
   }, "error") },
   onSubmitValueParser: /* @__PURE__ */ __name((isEditMode, keyPath, deep, name, rawValue) => parse3(rawValue), "onSubmitValueParser"),
-  inputElement: /* @__PURE__ */ __name(() => React20.createElement("input", null), "inputElement"),
-  textareaElement: /* @__PURE__ */ __name(() => React20.createElement("textarea", null), "textareaElement"),
+  inputElement: /* @__PURE__ */ __name(() => React21.createElement("input", null), "inputElement"),
+  textareaElement: /* @__PURE__ */ __name(() => React21.createElement("textarea", null), "textareaElement"),
   fallback: null
 };
 
@@ -4193,8 +5149,8 @@ var ObjectControl = /* @__PURE__ */ __name(({ name, value: value2, onChange, arg
   const theme = useTheme();
   const data = useMemo(() => value2 && cloneDeep(value2), [value2]);
   const hasData = data !== null && data !== void 0;
-  const [showRaw, setShowRaw] = useState6(!hasData);
-  const [parseError, setParseError] = useState6(null);
+  const [showRaw, setShowRaw] = useState7(!hasData);
+  const [parseError, setParseError] = useState7(null);
   const readonly = !!argType?.table?.readonly;
   const updateRaw = useCallback4(
     (raw) => {
@@ -4209,21 +5165,21 @@ var ObjectControl = /* @__PURE__ */ __name(({ name, value: value2, onChange, arg
     },
     [onChange]
   );
-  const [forceVisible, setForceVisible] = useState6(false);
+  const [forceVisible, setForceVisible] = useState7(false);
   const onForceVisible = useCallback4(() => {
     onChange({});
     setForceVisible(true);
   }, [setForceVisible]);
   const htmlElRef = useRef4(null);
-  useEffect6(() => {
+  useEffect7(() => {
     if (forceVisible && htmlElRef.current) {
       htmlElRef.current.select();
     }
   }, [forceVisible]);
   if (!hasData) {
-    return React21.createElement(Button3, { disabled: readonly, id: getControlSetterButtonId(name), onClick: onForceVisible }, "Set object");
+    return React22.createElement(Button3, { disabled: readonly, id: getControlSetterButtonId(name), onClick: onForceVisible }, "Set object");
   }
-  const rawJSONForm = React21.createElement(
+  const rawJSONForm = React22.createElement(
     RawInput,
     {
       ref: htmlElRef,
@@ -4238,7 +5194,7 @@ var ObjectControl = /* @__PURE__ */ __name(({ name, value: value2, onChange, arg
     }
   );
   const isObjectOrArray = Array.isArray(value2) || typeof value2 === "object" && value2?.constructor === Object;
-  return React21.createElement(Wrapper6, { "aria-readonly": readonly }, isObjectOrArray && React21.createElement(
+  return React22.createElement(Wrapper6, { "aria-readonly": readonly }, isObjectOrArray && React22.createElement(
     RawButton,
     {
       role: "switch",
@@ -4249,9 +5205,9 @@ var ObjectControl = /* @__PURE__ */ __name(({ name, value: value2, onChange, arg
         setShowRaw((isRaw) => !isRaw);
       }
     },
-    showRaw ? React21.createElement(EyeCloseIcon, null) : React21.createElement(EyeIcon, null),
-    React21.createElement("span", null, "RAW")
-  ), !showRaw ? React21.createElement(
+    showRaw ? React22.createElement(EyeCloseIcon, null) : React22.createElement(EyeIcon, null),
+    React22.createElement("span", null, "RAW")
+  ), !showRaw ? React22.createElement(
     JsonTree,
     {
       readOnly: readonly || !isObjectOrArray,
@@ -4263,18 +5219,18 @@ var ObjectControl = /* @__PURE__ */ __name(({ name, value: value2, onChange, arg
       rootName: name,
       onFullyUpdate: onChange,
       getStyle: getCustomStyleFunction(theme),
-      cancelButtonElement: React21.createElement(ButtonInline, { type: "button" }, "Cancel"),
-      addButtonElement: React21.createElement(ButtonInline, { type: "submit", primary: true }, "Save"),
-      plusMenuElement: React21.createElement(ActionButton, { type: "button" }, React21.createElement(AddIcon, null)),
-      minusMenuElement: React21.createElement(ActionButton, { type: "button" }, React21.createElement(SubtractIcon, null)),
-      inputElement: (_2, __, ___, key) => key ? React21.createElement(Input, { onFocus: selectValue, onBlur: dispatchEnterKey }) : React21.createElement(Input, null),
+      cancelButtonElement: React22.createElement(ButtonInline, { type: "button" }, "Cancel"),
+      addButtonElement: React22.createElement(ButtonInline, { type: "submit", primary: true }, "Save"),
+      plusMenuElement: React22.createElement(ActionButton, { type: "button" }, React22.createElement(AddIcon, null)),
+      minusMenuElement: React22.createElement(ActionButton, { type: "button" }, React22.createElement(SubtractIcon, null)),
+      inputElement: (_2, __, ___, key) => key ? React22.createElement(Input, { onFocus: selectValue, onBlur: dispatchEnterKey }) : React22.createElement(Input, null),
       fallback: rawJSONForm
     }
   ) : rawJSONForm);
 }, "ObjectControl");
 
 // src/blocks/controls/Range.tsx
-import React22, { useMemo as useMemo2 } from "react";
+import React23, { useMemo as useMemo2 } from "react";
 import { styled as styled17 } from "storybook/theming";
 var RangeInput = styled17.input(
   ({ theme, min, max, value: value2, disabled }) => ({
@@ -4447,7 +5403,7 @@ var RangeControl = /* @__PURE__ */ __name(({
   const hasValue = value2 !== void 0;
   const numberOFDecimalsPlaces = useMemo2(() => getNumberOfDecimalPlaces(step), [step]);
   const readonly = !!argType?.table?.readonly;
-  return React22.createElement(RangeWrapper, { "aria-readonly": readonly }, React22.createElement(RangeLabel, null, min), React22.createElement(
+  return React23.createElement(RangeWrapper, { "aria-readonly": readonly }, React23.createElement(RangeLabel, null, min), React23.createElement(
     RangeInput,
     {
       id: getControlId(name),
@@ -4457,11 +5413,11 @@ var RangeControl = /* @__PURE__ */ __name(({
       ...{ name, min, max, step, onFocus, onBlur },
       value: value2 ?? min
     }
-  ), React22.createElement(RangeCurrentAndMaxLabel, { numberOFDecimalsPlaces, max }, hasValue ? value2.toFixed(numberOFDecimalsPlaces) : "--", " / ", max));
+  ), React23.createElement(RangeCurrentAndMaxLabel, { numberOFDecimalsPlaces, max }, hasValue ? value2.toFixed(numberOFDecimalsPlaces) : "--", " / ", max));
 }, "RangeControl");
 
 // src/blocks/controls/Text.tsx
-import React23, { useCallback as useCallback5, useState as useState7 } from "react";
+import React24, { useCallback as useCallback5, useState as useState8 } from "react";
 import { Button as Button4, Form as Form4 } from "storybook/internal/components";
 import { styled as styled18 } from "storybook/theming";
 var Wrapper7 = styled18.label({
@@ -4485,13 +5441,13 @@ var TextControl = /* @__PURE__ */ __name(({
     onChange(event.target.value);
   }, "handleChange");
   const readonly = !!argType?.table?.readonly;
-  const [forceVisible, setForceVisible] = useState7(false);
+  const [forceVisible, setForceVisible] = useState8(false);
   const onForceVisible = useCallback5(() => {
     onChange("");
     setForceVisible(true);
   }, [setForceVisible]);
   if (value2 === void 0) {
-    return React23.createElement(
+    return React24.createElement(
       Button4,
       {
         variant: "outline",
@@ -4504,7 +5460,7 @@ var TextControl = /* @__PURE__ */ __name(({
     );
   }
   const isValid = typeof value2 === "string";
-  return React23.createElement(Wrapper7, null, React23.createElement(
+  return React24.createElement(Wrapper7, null, React24.createElement(
     Form4.Textarea,
     {
       id: getControlId(name),
@@ -4517,11 +5473,11 @@ var TextControl = /* @__PURE__ */ __name(({
       valid: isValid ? void 0 : "error",
       ...{ name, value: isValid ? value2 : "", onFocus, onBlur }
     }
-  ), maxLength && React23.createElement(MaxLength, { isMaxed: value2?.length === maxLength }, value2?.length ?? 0, " / ", maxLength));
+  ), maxLength && React24.createElement(MaxLength, { isMaxed: value2?.length === maxLength }, value2?.length ?? 0, " / ", maxLength));
 }, "TextControl");
 
 // src/blocks/controls/Files.tsx
-import React24, { useEffect as useEffect7, useRef as useRef5 } from "react";
+import React25, { useEffect as useEffect8, useRef as useRef5 } from "react";
 import { Form as Form5 } from "storybook/internal/components";
 import { styled as styled19 } from "storybook/theming";
 var FileInput = styled19(Form5.Input)({
@@ -4553,12 +5509,12 @@ var FilesControl = /* @__PURE__ */ __name(({
     revokeOldUrls(value2 || []);
   }
   __name(handleFileChange, "handleFileChange");
-  useEffect7(() => {
+  useEffect8(() => {
     if (value2 == null && inputElement.current) {
       inputElement.current.value = "";
     }
   }, [value2, name]);
-  return React24.createElement(
+  return React25.createElement(
     FileInput,
     {
       ref: inputElement,
@@ -4575,8 +5531,8 @@ var FilesControl = /* @__PURE__ */ __name(({
 }, "FilesControl");
 
 // src/blocks/controls/index.tsx
-var LazyColorControl = lazy(() => import("./_browser-chunks/Color-LWAWP22K.js"));
-var ColorControl = /* @__PURE__ */ __name((props) => React25.createElement(Suspense, { fallback: React25.createElement("div", null) }, React25.createElement(LazyColorControl, { ...props })), "ColorControl");
+var LazyColorControl = lazy(() => import("./_browser-chunks/Color-4NTW6CRW.js"));
+var ColorControl = /* @__PURE__ */ __name((props) => React26.createElement(Suspense, { fallback: React26.createElement("div", null) }, React26.createElement(LazyColorControl, { ...props })), "ColorControl");
 
 // src/blocks/components/ArgsTable/ArgControl.tsx
 var Controls2 = {
@@ -4596,12 +5552,12 @@ var Controls2 = {
   text: TextControl,
   file: FilesControl
 };
-var NoControl = /* @__PURE__ */ __name(() => React26.createElement(React26.Fragment, null, "-"), "NoControl");
+var NoControl = /* @__PURE__ */ __name(() => React27.createElement(React27.Fragment, null, "-"), "NoControl");
 var ArgControl = /* @__PURE__ */ __name(({ row, arg, updateArgs, isHovered }) => {
   const { key, control } = row;
-  const [isFocused, setFocused] = useState8(false);
-  const [boxedValue, setBoxedValue] = useState8({ value: arg });
-  useEffect8(() => {
+  const [isFocused, setFocused] = useState9(false);
+  const [boxedValue, setBoxedValue] = useState9({ value: arg });
+  useEffect9(() => {
     if (!isFocused) {
       setBoxedValue({ value: arg });
     }
@@ -4618,7 +5574,7 @@ var ArgControl = /* @__PURE__ */ __name(({ row, arg, updateArgs, isHovered }) =>
   const onFocus = useCallback6(() => setFocused(true), []);
   if (!control || control.disable) {
     const canBeSetup = control?.disable !== true && row?.type?.name !== "function";
-    return isHovered && canBeSetup ? React26.createElement(
+    return isHovered && canBeSetup ? React27.createElement(
       Link,
       {
         href: "https://storybook.js.org/docs/essentials/controls?ref=ui",
@@ -4626,15 +5582,15 @@ var ArgControl = /* @__PURE__ */ __name(({ row, arg, updateArgs, isHovered }) =>
         withArrow: true
       },
       "Setup controls"
-    ) : React26.createElement(NoControl, null);
+    ) : React27.createElement(NoControl, null);
   }
   const props = { name: key, argType: row, value: boxedValue.value, onChange, onBlur, onFocus };
   const Control = Controls2[control.type] || NoControl;
-  return React26.createElement(Control, { ...props, ...control, controlType: control.type });
+  return React27.createElement(Control, { ...props, ...control, controlType: control.type });
 }, "ArgControl");
 
 // src/blocks/components/ArgsTable/ArgJsDoc.tsx
-import React27 from "react";
+import React28 from "react";
 import { codeCommon } from "storybook/internal/components";
 import { styled as styled20 } from "storybook/theming";
 var Table = styled20.table(({ theme }) => ({
@@ -4694,13 +5650,13 @@ var ArgJsDoc = /* @__PURE__ */ __name(({ tags }) => {
   if (!hasDisplayableParams && !hasDisplayableReturns && !hasDisplayableDeprecated) {
     return null;
   }
-  return React27.createElement(React27.Fragment, null, React27.createElement(Table, null, React27.createElement("tbody", null, hasDisplayableDeprecated && React27.createElement("tr", { key: "deprecated" }, React27.createElement("td", { colSpan: 2 }, React27.createElement("strong", null, "Deprecated"), ": ", tags.deprecated?.toString())), hasDisplayableParams && params.map((x2) => {
-    return React27.createElement("tr", { key: x2.name }, React27.createElement("td", null, React27.createElement("code", null, x2.name)), React27.createElement("td", null, x2.description));
-  }), hasDisplayableReturns && React27.createElement("tr", { key: "returns" }, React27.createElement("td", null, React27.createElement("code", null, "Returns")), React27.createElement("td", null, tags.returns?.description)))));
+  return React28.createElement(React28.Fragment, null, React28.createElement(Table, null, React28.createElement("tbody", null, hasDisplayableDeprecated && React28.createElement("tr", { key: "deprecated" }, React28.createElement("td", { colSpan: 2 }, React28.createElement("strong", null, "Deprecated"), ": ", tags.deprecated?.toString())), hasDisplayableParams && params.map((x2) => {
+    return React28.createElement("tr", { key: x2.name }, React28.createElement("td", null, React28.createElement("code", null, x2.name)), React28.createElement("td", null, x2.description));
+  }), hasDisplayableReturns && React28.createElement("tr", { key: "returns" }, React28.createElement("td", null, React28.createElement("code", null, "Returns")), React28.createElement("td", null, tags.returns?.description)))));
 }, "ArgJsDoc");
 
 // src/blocks/components/ArgsTable/ArgValue.tsx
-import React28, { useState as useState9 } from "react";
+import React29, { useState as useState10 } from "react";
 import { SyntaxHighlighter, WithTooltipPure, codeCommon as codeCommon2 } from "storybook/internal/components";
 import { ChevronSmallDownIcon as ChevronSmallDownIcon2, ChevronSmallUpIcon } from "@storybook/icons";
 var import_memoizerific = __toESM(require_memoizerific(), 1);
@@ -4771,10 +5727,10 @@ var ChevronDownIcon = styled21(ChevronSmallDownIcon2)({
   marginLeft: 4
 });
 var EmptyArg = /* @__PURE__ */ __name(() => {
-  return React28.createElement("span", null, "-");
+  return React29.createElement("span", null, "-");
 }, "EmptyArg");
 var ArgText = /* @__PURE__ */ __name(({ text, simple }) => {
-  return React28.createElement(Text3, { simple }, text);
+  return React29.createElement(Text3, { simple }, text);
 }, "ArgText");
 var calculateDetailWidth = (0, import_memoizerific.default)(1e3)((detail) => {
   const lines = detail.split(/\r?\n/);
@@ -4793,12 +5749,12 @@ var renderSummaryItems = /* @__PURE__ */ __name((summaryItems, isExpanded = true
   if (!isExpanded) {
     items = summaryItems.slice(0, ITEMS_BEFORE_EXPANSION);
   }
-  return items.map((item) => React28.createElement(ArgText, { key: item, text: item === "" ? '""' : item }));
+  return items.map((item) => React29.createElement(ArgText, { key: item, text: item === "" ? '""' : item }));
 }, "renderSummaryItems");
 var ArgSummary = /* @__PURE__ */ __name(({ value: value2, initialExpandedArgs }) => {
   const { summary, detail } = value2;
-  const [isOpen, setIsOpen] = useState9(false);
-  const [isExpanded, setIsExpanded] = useState9(initialExpandedArgs || false);
+  const [isOpen, setIsOpen] = useState10(false);
+  const [isExpanded, setIsExpanded] = useState10(initialExpandedArgs || false);
   if (summary === void 0 || summary === null) {
     return null;
   }
@@ -4806,14 +5762,14 @@ var ArgSummary = /* @__PURE__ */ __name(({ value: value2, initialExpandedArgs })
   if (detail == null) {
     const cannotBeSafelySplitted = /[(){}[\]<>]/.test(summaryAsString);
     if (cannotBeSafelySplitted) {
-      return React28.createElement(ArgText, { text: summaryAsString });
+      return React29.createElement(ArgText, { text: summaryAsString });
     }
     const summaryItems = getSummaryItems(summaryAsString);
     const itemsCount = summaryItems.length;
     const hasManyItems = itemsCount > ITEMS_BEFORE_EXPANSION;
-    return hasManyItems ? React28.createElement(Summary, { isExpanded }, renderSummaryItems(summaryItems, isExpanded), React28.createElement(ExpandButton, { onClick: () => setIsExpanded(!isExpanded) }, isExpanded ? "Show less..." : `Show ${itemsCount - ITEMS_BEFORE_EXPANSION} more...`)) : React28.createElement(Summary, null, renderSummaryItems(summaryItems));
+    return hasManyItems ? React29.createElement(Summary, { isExpanded }, renderSummaryItems(summaryItems, isExpanded), React29.createElement(ExpandButton, { onClick: () => setIsExpanded(!isExpanded) }, isExpanded ? "Show less..." : `Show ${itemsCount - ITEMS_BEFORE_EXPANSION} more...`)) : React29.createElement(Summary, null, renderSummaryItems(summaryItems));
   }
-  return React28.createElement(
+  return React29.createElement(
     WithTooltipPure,
     {
       closeOnOutsideClick: true,
@@ -4822,13 +5778,13 @@ var ArgSummary = /* @__PURE__ */ __name(({ value: value2, initialExpandedArgs })
       onVisibleChange: (isVisible) => {
         setIsOpen(isVisible);
       },
-      tooltip: React28.createElement(Detail, { width: calculateDetailWidth(detail) }, React28.createElement(SyntaxHighlighter, { language: "jsx", format: false }, detail))
+      tooltip: React29.createElement(Detail, { width: calculateDetailWidth(detail) }, React29.createElement(SyntaxHighlighter, { language: "jsx", format: false }, detail))
     },
-    React28.createElement(Expandable, { className: "sbdocs-expandable" }, React28.createElement("span", null, summaryAsString), isOpen ? React28.createElement(ChevronUpIcon, null) : React28.createElement(ChevronDownIcon, null))
+    React29.createElement(Expandable, { className: "sbdocs-expandable" }, React29.createElement("span", null, summaryAsString), isOpen ? React29.createElement(ChevronUpIcon, null) : React29.createElement(ChevronDownIcon, null))
   );
 }, "ArgSummary");
 var ArgValue = /* @__PURE__ */ __name(({ value: value2, initialExpandedArgs }) => {
-  return value2 == null ? React28.createElement(EmptyArg, null) : React28.createElement(ArgSummary, { value: value2, initialExpandedArgs });
+  return value2 == null ? React29.createElement(EmptyArg, null) : React29.createElement(ArgSummary, { value: value2, initialExpandedArgs });
 }, "ArgValue");
 
 // src/blocks/components/ArgsTable/ArgRow.tsx
@@ -4880,7 +5836,7 @@ var toSummary = /* @__PURE__ */ __name((value2) => {
   return { summary: val };
 }, "toSummary");
 var ArgRow = /* @__PURE__ */ __name((props) => {
-  const [isHovered, setIsHovered] = useState10(false);
+  const [isHovered, setIsHovered] = useState11(false);
   const { row, updateArgs, compact, expandable, initialExpandedArgs } = props;
   const { name, description } = row;
   const table = row.table || {};
@@ -4888,11 +5844,11 @@ var ArgRow = /* @__PURE__ */ __name((props) => {
   const defaultValue = table.defaultValue || row.defaultValue;
   const required = row.type?.required;
   const hasDescription = description != null && description !== "";
-  return React29.createElement("tr", { onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false) }, React29.createElement(StyledTd, { expandable: expandable ?? false }, React29.createElement(Name, null, name), required ? React29.createElement(Required, { title: "Required" }, "*") : null), compact ? null : React29.createElement("td", null, hasDescription && React29.createElement(Description, null, React29.createElement(index_modern_default, null, description)), table.jsDocTags != null ? React29.createElement(React29.Fragment, null, React29.createElement(TypeWithJsDoc, { hasDescription }, React29.createElement(ArgValue, { value: type, initialExpandedArgs })), React29.createElement(ArgJsDoc, { tags: table.jsDocTags })) : React29.createElement(Type, { hasDescription }, React29.createElement(ArgValue, { value: type, initialExpandedArgs }))), compact ? null : React29.createElement("td", null, React29.createElement(ArgValue, { value: defaultValue, initialExpandedArgs })), updateArgs ? React29.createElement("td", null, React29.createElement(ArgControl, { ...props, isHovered })) : null);
+  return React30.createElement("tr", { onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false) }, React30.createElement(StyledTd, { expandable: expandable ?? false }, React30.createElement(Name, null, name), required ? React30.createElement(Required, { title: "Required" }, "*") : null), compact ? null : React30.createElement("td", null, hasDescription && React30.createElement(Description, null, React30.createElement(index_modern_default, null, description)), table.jsDocTags != null ? React30.createElement(React30.Fragment, null, React30.createElement(TypeWithJsDoc, { hasDescription }, React30.createElement(ArgValue, { value: type, initialExpandedArgs })), React30.createElement(ArgJsDoc, { tags: table.jsDocTags })) : React30.createElement(Type, { hasDescription }, React30.createElement(ArgValue, { value: type, initialExpandedArgs }))), compact ? null : React30.createElement("td", null, React30.createElement(ArgValue, { value: defaultValue, initialExpandedArgs })), updateArgs ? React30.createElement("td", null, React30.createElement(ArgControl, { ...props, isHovered })) : null);
 }, "ArgRow");
 
 // src/blocks/components/ArgsTable/Empty.tsx
-import React30, { useEffect as useEffect9, useState as useState11 } from "react";
+import React31, { useEffect as useEffect10, useState as useState12 } from "react";
 import { EmptyTabContent, Link as Link2 } from "storybook/internal/components";
 import { DocumentIcon } from "@storybook/icons";
 import { styled as styled23 } from "storybook/theming";
@@ -4914,8 +5870,8 @@ var Links = styled23.div(({ theme }) => ({
   gap: 25
 }));
 var Empty = /* @__PURE__ */ __name(({ inAddonPanel }) => {
-  const [isLoading, setIsLoading] = useState11(true);
-  useEffect9(() => {
+  const [isLoading, setIsLoading] = useState12(true);
+  useEffect10(() => {
     const load = setTimeout(() => {
       setIsLoading(false);
     }, 100);
@@ -4924,28 +5880,28 @@ var Empty = /* @__PURE__ */ __name(({ inAddonPanel }) => {
   if (isLoading) {
     return null;
   }
-  return React30.createElement(Wrapper8, { inAddonPanel }, React30.createElement(
+  return React31.createElement(Wrapper8, { inAddonPanel }, React31.createElement(
     EmptyTabContent,
     {
       title: inAddonPanel ? "Interactive story playground" : "Args table with interactive controls couldn't be auto-generated",
-      description: React30.createElement(React30.Fragment, null, "Controls give you an easy to use interface to test your components. Set your story args and you'll see controls appearing here automatically."),
-      footer: React30.createElement(Links, null, inAddonPanel && React30.createElement(React30.Fragment, null, React30.createElement(
+      description: React31.createElement(React31.Fragment, null, "Controls give you an easy to use interface to test your components. Set your story args and you'll see controls appearing here automatically."),
+      footer: React31.createElement(Links, null, inAddonPanel && React31.createElement(React31.Fragment, null, React31.createElement(
         Link2,
         {
           href: "https://storybook.js.org/docs/essentials/controls?ref=ui",
           target: "_blank",
           withArrow: true
         },
-        React30.createElement(DocumentIcon, null),
+        React31.createElement(DocumentIcon, null),
         " Read docs"
-      )), !inAddonPanel && React30.createElement(
+      )), !inAddonPanel && React31.createElement(
         Link2,
         {
           href: "https://storybook.js.org/docs/essentials/controls?ref=ui",
           target: "_blank",
           withArrow: true
         },
-        React30.createElement(DocumentIcon, null),
+        React31.createElement(DocumentIcon, null),
         " Learn how to set that up"
       ))
     }
@@ -4953,7 +5909,7 @@ var Empty = /* @__PURE__ */ __name(({ inAddonPanel }) => {
 }, "Empty");
 
 // src/blocks/components/ArgsTable/SectionRow.tsx
-import React31, { useState as useState12 } from "react";
+import React32, { useState as useState13 } from "react";
 import { ChevronDownIcon as ChevronDownIcon2, ChevronRightIcon } from "@storybook/icons";
 import { styled as styled24 } from "storybook/theming";
 var ExpanderIconDown = styled24(ChevronDownIcon2)(({ theme }) => ({
@@ -5035,12 +5991,12 @@ var SectionRow = /* @__PURE__ */ __name(({
   initialExpanded = true,
   colSpan = 3
 }) => {
-  const [expanded, setExpanded] = useState12(initialExpanded);
+  const [expanded, setExpanded] = useState13(initialExpanded);
   const Level = level === "subsection" ? Subsection : Section;
   const itemCount = children?.length || 0;
   const caption = level === "subsection" ? `${itemCount} item${itemCount !== 1 ? "s" : ""}` : "";
   const helperText = `${expanded ? "Hide" : "Show"} ${level === "subsection" ? itemCount : label} item${itemCount !== 1 ? "s" : ""}`;
-  return React31.createElement(React31.Fragment, null, React31.createElement(StyledTr, { title: helperText }, React31.createElement(Level, { colSpan: 1 }, React31.createElement(ClickIntercept, { onClick: (e2) => setExpanded(!expanded), tabIndex: 0 }, helperText), React31.createElement(FlexWrapper, null, expanded ? React31.createElement(ExpanderIconDown, null) : React31.createElement(ExpanderIconRight, null), label)), React31.createElement(StyledTd2, { colSpan: colSpan - 1 }, React31.createElement(
+  return React32.createElement(React32.Fragment, null, React32.createElement(StyledTr, { title: helperText }, React32.createElement(Level, { colSpan: 1 }, React32.createElement(ClickIntercept, { onClick: (e2) => setExpanded(!expanded), tabIndex: 0 }, helperText), React32.createElement(FlexWrapper, null, expanded ? React32.createElement(ExpanderIconDown, null) : React32.createElement(ExpanderIconRight, null), label)), React32.createElement(StyledTd2, { colSpan: colSpan - 1 }, React32.createElement(
     ClickIntercept,
     {
       onClick: (e2) => setExpanded(!expanded),
@@ -5052,7 +6008,7 @@ var SectionRow = /* @__PURE__ */ __name(({
 }, "SectionRow");
 
 // src/blocks/components/ArgsTable/Skeleton.tsx
-import React32 from "react";
+import React33 from "react";
 import { styled as styled25 } from "storybook/theming";
 var TableWrapper = styled25.div(({ theme }) => ({
   width: "100%",
@@ -5110,7 +6066,7 @@ var SkeletonText = styled25.div(
     borderRadius: 3
   })
 );
-var Skeleton = /* @__PURE__ */ __name(() => React32.createElement(TableWrapper, null, React32.createElement(Row, null, React32.createElement(Column, { position: "first" }, React32.createElement(SkeletonText, { width: "60%" })), React32.createElement(Column, { position: "second" }, React32.createElement(SkeletonText, { width: "30%" })), React32.createElement(Column, { position: "third" }, React32.createElement(SkeletonText, { width: "60%" })), React32.createElement(Column, { position: "last" }, React32.createElement(SkeletonText, { width: "60%" }))), React32.createElement(Row, null, React32.createElement(Column, { position: "first" }, React32.createElement(SkeletonText, { width: "60%" })), React32.createElement(Column, { position: "second" }, React32.createElement(SkeletonText, { width: "80%" }), React32.createElement(SkeletonText, { width: "30%" })), React32.createElement(Column, { position: "third" }, React32.createElement(SkeletonText, { width: "60%" })), React32.createElement(Column, { position: "last" }, React32.createElement(SkeletonText, { width: "60%" }))), React32.createElement(Row, null, React32.createElement(Column, { position: "first" }, React32.createElement(SkeletonText, { width: "60%" })), React32.createElement(Column, { position: "second" }, React32.createElement(SkeletonText, { width: "80%" }), React32.createElement(SkeletonText, { width: "30%" })), React32.createElement(Column, { position: "third" }, React32.createElement(SkeletonText, { width: "60%" })), React32.createElement(Column, { position: "last" }, React32.createElement(SkeletonText, { width: "60%" }))), React32.createElement(Row, null, React32.createElement(Column, { position: "first" }, React32.createElement(SkeletonText, { width: "60%" })), React32.createElement(Column, { position: "second" }, React32.createElement(SkeletonText, { width: "80%" }), React32.createElement(SkeletonText, { width: "30%" })), React32.createElement(Column, { position: "third" }, React32.createElement(SkeletonText, { width: "60%" })), React32.createElement(Column, { position: "last" }, React32.createElement(SkeletonText, { width: "60%" })))), "Skeleton");
+var Skeleton = /* @__PURE__ */ __name(() => React33.createElement(TableWrapper, null, React33.createElement(Row, null, React33.createElement(Column, { position: "first" }, React33.createElement(SkeletonText, { width: "60%" })), React33.createElement(Column, { position: "second" }, React33.createElement(SkeletonText, { width: "30%" })), React33.createElement(Column, { position: "third" }, React33.createElement(SkeletonText, { width: "60%" })), React33.createElement(Column, { position: "last" }, React33.createElement(SkeletonText, { width: "60%" }))), React33.createElement(Row, null, React33.createElement(Column, { position: "first" }, React33.createElement(SkeletonText, { width: "60%" })), React33.createElement(Column, { position: "second" }, React33.createElement(SkeletonText, { width: "80%" }), React33.createElement(SkeletonText, { width: "30%" })), React33.createElement(Column, { position: "third" }, React33.createElement(SkeletonText, { width: "60%" })), React33.createElement(Column, { position: "last" }, React33.createElement(SkeletonText, { width: "60%" }))), React33.createElement(Row, null, React33.createElement(Column, { position: "first" }, React33.createElement(SkeletonText, { width: "60%" })), React33.createElement(Column, { position: "second" }, React33.createElement(SkeletonText, { width: "80%" }), React33.createElement(SkeletonText, { width: "30%" })), React33.createElement(Column, { position: "third" }, React33.createElement(SkeletonText, { width: "60%" })), React33.createElement(Column, { position: "last" }, React33.createElement(SkeletonText, { width: "60%" }))), React33.createElement(Row, null, React33.createElement(Column, { position: "first" }, React33.createElement(SkeletonText, { width: "60%" })), React33.createElement(Column, { position: "second" }, React33.createElement(SkeletonText, { width: "80%" }), React33.createElement(SkeletonText, { width: "30%" })), React33.createElement(Column, { position: "third" }, React33.createElement(SkeletonText, { width: "60%" })), React33.createElement(Column, { position: "last" }, React33.createElement(SkeletonText, { width: "60%" })))), "Skeleton");
 
 // src/blocks/components/ArgsTable/ArgsTable.tsx
 var TableWrapper2 = styled26.table(({ theme, compact, inAddonPanel }) => ({
@@ -5311,10 +6267,10 @@ var ArgsTable = /* @__PURE__ */ __name((props) => {
   } = props;
   if ("error" in props) {
     const { error } = props;
-    return React33.createElement(EmptyBlock, null, error, "\xA0", React33.createElement(Link3, { href: "http://storybook.js.org/docs/?ref=ui", target: "_blank", withArrow: true }, React33.createElement(DocumentIcon2, null), " Read the docs"));
+    return React34.createElement(EmptyBlock, null, error, "\xA0", React34.createElement(Link3, { href: "http://storybook.js.org/docs/?ref=ui", target: "_blank", withArrow: true }, React34.createElement(DocumentIcon2, null), " Read the docs"));
   }
   if (isLoading) {
-    return React33.createElement(Skeleton, null);
+    return React34.createElement(Skeleton, null);
   }
   const { rows, args, globals } = "rows" in props ? props : { rows: void 0, args: void 0, globals: void 0 };
   const groups = groupRows(
@@ -5328,7 +6284,7 @@ var ArgsTable = /* @__PURE__ */ __name((props) => {
   const hasNoSections = Object.entries(groups.sections).length === 0;
   const hasNoUngroupedSubsections = Object.entries(groups.ungroupedSubsections).length === 0;
   if (hasNoUngrouped && hasNoSections && hasNoUngroupedSubsections) {
-    return React33.createElement(Empty, { inAddonPanel });
+    return React34.createElement(Empty, { inAddonPanel });
   }
   let colSpan = 1;
   if (updateArgs) {
@@ -5339,15 +6295,15 @@ var ArgsTable = /* @__PURE__ */ __name((props) => {
   }
   const expandable = Object.keys(groups.sections).length > 0;
   const common = { updateArgs, compact, inAddonPanel, initialExpandedArgs };
-  return React33.createElement(ResetWrapper3, null, React33.createElement(TablePositionWrapper, null, updateArgs && !isLoading && resetArgs && React33.createElement(ButtonPositionWrapper, null, React33.createElement(
+  return React34.createElement(ResetWrapper3, null, React34.createElement(TablePositionWrapper, null, updateArgs && !isLoading && resetArgs && React34.createElement(ButtonPositionWrapper, null, React34.createElement(
     IconButton3,
     {
       onClick: () => resetArgs(),
       "aria-label": "Reset controls",
       title: "Reset controls"
     },
-    React33.createElement(UndoIcon, null)
-  )), React33.createElement(TableWrapper2, { ...{ compact, inAddonPanel }, className: "docblock-argstable sb-unstyled" }, React33.createElement("thead", { className: "docblock-argstable-head" }, React33.createElement("tr", null, React33.createElement("th", null, React33.createElement("span", null, "Name")), compact ? null : React33.createElement("th", null, React33.createElement("span", null, "Description")), compact ? null : React33.createElement("th", null, React33.createElement("span", null, "Default")), updateArgs ? React33.createElement("th", null, React33.createElement("span", null, "Control")) : null)), React33.createElement("tbody", { className: "docblock-argstable-body" }, groups.ungrouped.map((row) => React33.createElement(ArgRow, { key: row.key, row, arg: args && args[row.key], ...common })), Object.entries(groups.ungroupedSubsections).map(([subcategory, subsection]) => React33.createElement(
+    React34.createElement(UndoIcon, null)
+  )), React34.createElement(TableWrapper2, { ...{ compact, inAddonPanel }, className: "docblock-argstable sb-unstyled" }, React34.createElement("thead", { className: "docblock-argstable-head" }, React34.createElement("tr", null, React34.createElement("th", null, React34.createElement("span", null, "Name")), compact ? null : React34.createElement("th", null, React34.createElement("span", null, "Description")), compact ? null : React34.createElement("th", null, React34.createElement("span", null, "Default")), updateArgs ? React34.createElement("th", null, React34.createElement("span", null, "Control")) : null)), React34.createElement("tbody", { className: "docblock-argstable-body" }, groups.ungrouped.map((row) => React34.createElement(ArgRow, { key: row.key, row, arg: args && args[row.key], ...common })), Object.entries(groups.ungroupedSubsections).map(([subcategory, subsection]) => React34.createElement(
     SectionRow,
     {
       key: subcategory,
@@ -5355,7 +6311,7 @@ var ArgsTable = /* @__PURE__ */ __name((props) => {
       level: "subsection",
       colSpan
     },
-    subsection.map((row) => React33.createElement(
+    subsection.map((row) => React34.createElement(
       ArgRow,
       {
         key: row.key,
@@ -5365,7 +6321,7 @@ var ArgsTable = /* @__PURE__ */ __name((props) => {
         ...common
       }
     ))
-  )), Object.entries(groups.sections).map(([category, section]) => React33.createElement(SectionRow, { key: category, label: category, level: "section", colSpan }, section.ungrouped.map((row) => React33.createElement(ArgRow, { key: row.key, row, arg: args && args[row.key], ...common })), Object.entries(section.subsections).map(([subcategory, subsection]) => React33.createElement(
+  )), Object.entries(groups.sections).map(([category, section]) => React34.createElement(SectionRow, { key: category, label: category, level: "section", colSpan }, section.ungrouped.map((row) => React34.createElement(ArgRow, { key: row.key, row, arg: args && args[row.key], ...common })), Object.entries(section.subsections).map(([subcategory, subsection]) => React34.createElement(
     SectionRow,
     {
       key: subcategory,
@@ -5373,7 +6329,7 @@ var ArgsTable = /* @__PURE__ */ __name((props) => {
       level: "subsection",
       colSpan
     },
-    subsection.map((row) => React33.createElement(
+    subsection.map((row) => React34.createElement(
       ArgRow,
       {
         key: row.key,
@@ -5387,28 +6343,18 @@ var ArgsTable = /* @__PURE__ */ __name((props) => {
 }, "ArgsTable");
 
 // src/blocks/blocks/Anchor.tsx
-import React34 from "react";
+import React35 from "react";
 var anchorBlockIdFromId = /* @__PURE__ */ __name((storyId) => `anchor--${storyId}`, "anchorBlockIdFromId");
-var Anchor = /* @__PURE__ */ __name(({ storyId, children }) => React34.createElement("div", { id: anchorBlockIdFromId(storyId), className: "sb-anchor" }, children), "Anchor");
+var Anchor = /* @__PURE__ */ __name(({ storyId, children }) => React35.createElement("div", { id: anchorBlockIdFromId(storyId), className: "sb-anchor" }, children), "Anchor");
 
 // src/blocks/blocks/ArgTypes.tsx
-import React35 from "react";
+import React36 from "react";
 import { filterArgTypes } from "storybook/preview-api";
 
 // src/blocks/blocks/useOf.ts
-import { useContext } from "react";
-
-// src/blocks/blocks/DocsContext.ts
-import { createContext as createContext2 } from "react";
-if (globalThis && globalThis.__DOCS_CONTEXT__ === void 0) {
-  globalThis.__DOCS_CONTEXT__ = createContext2(null);
-  globalThis.__DOCS_CONTEXT__.displayName = "DocsContext";
-}
-var DocsContext = globalThis ? globalThis.__DOCS_CONTEXT__ : createContext2(null);
-
-// src/blocks/blocks/useOf.ts
+import { useContext as useContext3 } from "react";
 var useOf = /* @__PURE__ */ __name((moduleExportOrType, validTypes) => {
-  const context = useContext(DocsContext);
+  const context = useContext3(DocsContext);
   return context.resolveOf(moduleExportOrType, validTypes);
 }, "useOf");
 
@@ -5485,7 +6431,7 @@ var ArgTypes = /* @__PURE__ */ __name((props) => {
   const filteredArgTypes = filterArgTypes(argTypes, include, exclude);
   const hasSubcomponents = Boolean(subcomponents) && Object.keys(subcomponents || {}).length > 0;
   if (!hasSubcomponents) {
-    return React35.createElement(ArgsTable, { rows: filteredArgTypes, sort });
+    return React36.createElement(ArgsTable, { rows: filteredArgTypes, sort });
   }
   const mainComponentName = getComponentName(component) || "Main";
   const subcomponentTabs = Object.fromEntries(
@@ -5505,18 +6451,18 @@ var ArgTypes = /* @__PURE__ */ __name((props) => {
     [mainComponentName]: { rows: filteredArgTypes, sort },
     ...subcomponentTabs
   };
-  return React35.createElement(TabbedArgsTable, { tabs, sort });
+  return React36.createElement(TabbedArgsTable, { tabs, sort });
 }, "ArgTypes");
 
 // src/blocks/blocks/Canvas.tsx
-import React39, { useContext as useContext4 } from "react";
+import React39, { useContext as useContext5 } from "react";
 
 // src/blocks/blocks/Source.tsx
-import React37, { useContext as useContext2, useMemo as useMemo3 } from "react";
+import React38, { useContext as useContext4, useMemo as useMemo3 } from "react";
 import { SourceType } from "storybook/internal/docs-tools";
 
 // src/blocks/blocks/SourceContainer.tsx
-import React36, { createContext as createContext3, useEffect as useEffect10, useState as useState13 } from "react";
+import React37, { createContext as createContext3, useEffect as useEffect11, useState as useState14 } from "react";
 import { SNIPPET_RENDERED } from "storybook/internal/docs-tools";
 
 // ../../node_modules/telejson/dist/chunk-EAFQLD22.mjs
@@ -7056,8 +8002,8 @@ var SourceContainer = /* @__PURE__ */ __name(({
   children,
   channel
 }) => {
-  const [sources, setSources] = useState13({});
-  useEffect10(() => {
+  const [sources, setSources] = useState14({});
+  useEffect11(() => {
     const handleSnippetRendered = /* @__PURE__ */ __name((idOrEvent, inputSource = null, inputFormat = false) => {
       const {
         id,
@@ -7084,15 +8030,15 @@ var SourceContainer = /* @__PURE__ */ __name(({
     channel.on(SNIPPET_RENDERED, handleSnippetRendered);
     return () => channel.off(SNIPPET_RENDERED, handleSnippetRendered);
   }, []);
-  return React36.createElement(SourceContext.Provider, { value: { sources } }, children);
+  return React37.createElement(SourceContext.Provider, { value: { sources } }, children);
 }, "SourceContainer");
 
 // src/blocks/blocks/useTransformCode.tsx
-import { useEffect as useEffect11, useState as useState14 } from "react";
+import { useEffect as useEffect12, useState as useState15 } from "react";
 function useTransformCode(source, transform, storyContext) {
-  const [transformedCode, setTransformedCode] = useState14("Transforming...");
+  const [transformedCode, setTransformedCode] = useState15("Transforming...");
   const transformed = transform ? transform?.(source, storyContext) : source;
-  useEffect11(() => {
+  useEffect12(() => {
     async function getTransformedCode() {
       const transformResult = await transformed;
       if (transformResult !== transformedCode) {
@@ -7188,106 +8134,16 @@ var useSourceProps = /* @__PURE__ */ __name((props, docsContext, sourceContext)
   };
 }, "useSourceProps");
 var Source2 = /* @__PURE__ */ __name((props) => {
-  const sourceContext = useContext2(SourceContext);
-  const docsContext = useContext2(DocsContext);
+  const sourceContext = useContext4(SourceContext);
+  const docsContext = useContext4(DocsContext);
   const sourceProps = useSourceProps(props, docsContext, sourceContext);
-  return React37.createElement(Source, { ...sourceProps });
+  return React38.createElement(Source, { ...sourceProps });
 }, "Source");
 
-// src/blocks/blocks/Story.tsx
-import React38, { useContext as useContext3 } from "react";
-
-// src/blocks/blocks/useStory.ts
-import { useEffect as useEffect12, useState as useState15 } from "react";
-function useStory(storyId, context) {
-  const stories = useStories([storyId], context);
-  return stories && stories[0];
-}
-__name(useStory, "useStory");
-function useStories(storyIds, context) {
-  const [storiesById, setStories] = useState15({});
-  useEffect12(() => {
-    Promise.all(
-      storyIds.map(async (storyId) => {
-        const story = await context.loadStory(storyId);
-        setStories(
-          (current) => current[storyId] === story ? current : { ...current, [storyId]: story }
-        );
-      })
-    );
-  });
-  return storyIds.map((storyId) => {
-    if (storiesById[storyId]) {
-      return storiesById[storyId];
-    }
-    try {
-      return context.storyById(storyId);
-    } catch (err) {
-      return void 0;
-    }
-  });
-}
-__name(useStories, "useStories");
-
-// src/blocks/blocks/Story.tsx
-var getStoryId2 = /* @__PURE__ */ __name((props, context) => {
-  const { of, meta } = props;
-  if ("of" in props && of === void 0) {
-    throw new Error("Unexpected `of={undefined}`, did you mistype a CSF file reference?");
-  }
-  if (meta) {
-    context.referenceMeta(meta, false);
-  }
-  const resolved = context.resolveOf(of || "story", ["story"]);
-  return resolved.story.id;
-}, "getStoryId");
-var getStoryProps = /* @__PURE__ */ __name((props, story, context) => {
-  const { parameters = {} } = story || {};
-  const { docs = {} } = parameters;
-  const storyParameters = docs.story || {};
-  if (docs.disable) {
-    return null;
-  }
-  const inline = props.inline ?? storyParameters.inline ?? false;
-  if (inline) {
-    const height2 = props.height ?? storyParameters.height;
-    const autoplay = props.autoplay ?? storyParameters.autoplay ?? false;
-    return {
-      story,
-      inline: true,
-      height: height2,
-      autoplay,
-      forceInitialArgs: !!props.__forceInitialArgs,
-      primary: !!props.__primary,
-      renderStoryToElement: context.renderStoryToElement
-    };
-  }
-  const height = props.height ?? storyParameters.height ?? storyParameters.iframeHeight ?? "100px";
-  return {
-    story,
-    inline: false,
-    height,
-    primary: !!props.__primary
-  };
-}, "getStoryProps");
-var Story2 = /* @__PURE__ */ __name((props = { __forceInitialArgs: false, __primary: false }) => {
-  const context = useContext3(DocsContext);
-  const storyId = getStoryId2(props, context);
-  const story = useStory(storyId, context);
-  if (!story) {
-    return React38.createElement(StorySkeleton, null);
-  }
-  const storyProps = getStoryProps(props, story, context);
-  if (!storyProps) {
-    return null;
-  }
-  return React38.createElement(Story, { ...storyProps });
-}, "Story");
-
 // src/blocks/blocks/Canvas.tsx
 var Canvas = /* @__PURE__ */ __name((props) => {
-  const docsContext = useContext4(DocsContext);
-  const sourceContext = useContext4(SourceContext);
+  const docsContext = useContext5(DocsContext);
+  const sourceContext = useContext5(SourceContext);
   const { of, source } = props;
   if ("of" in props && of === void 0) {
     throw new Error("Unexpected `of={undefined}`, did you mistype a CSF file reference?");
@@ -7316,7 +8172,7 @@ var Canvas = /* @__PURE__ */ __name((props) => {
 }, "Canvas");
 
 // src/blocks/blocks/Controls.tsx
-import React40, { useContext as useContext5 } from "react";
+import React40, { useContext as useContext6 } from "react";
 import { filterArgTypes as filterArgTypes2 } from "storybook/preview-api";
 
 // src/blocks/blocks/useArgs.ts
@@ -7387,7 +8243,7 @@ var Controls3 = /* @__PURE__ */ __name((props) => {
   if ("of" in props && of === void 0) {
     throw new Error("Unexpected `of={undefined}`, did you mistype a CSF file reference?");
   }
-  const context = useContext5(DocsContext);
+  const context = useContext6(DocsContext);
   const { story } = context.resolveOf(of || "story", ["story"]);
   const { parameters, argTypes, component, subcomponents } = story;
   const controlsParameters = parameters.docs?.controls || {};
@@ -7449,12 +8305,12 @@ import React42 from "react";
 import { dedent } from "ts-dedent";
 
 // src/blocks/blocks/mdx.tsx
-import React41, { useContext as useContext6 } from "react";
+import React41, { useContext as useContext7 } from "react";
 import { Code, components, nameSpaceClassNames } from "storybook/internal/components";
 import { NAVIGATE_URL as NAVIGATE_URL2 } from "storybook/internal/core-events";
 import { LinkIcon } from "@storybook/icons";
 import { styled as styled27 } from "storybook/theming";
-var { document } = globalThis;
+var { document: document2 } = globalThis;
 var assertIsFn = /* @__PURE__ */ __name((val) => {
   if (typeof val !== "function") {
     throw new Error(`Expected story function, got: ${val}`);
@@ -7491,7 +8347,7 @@ function navigate(context, url) {
 __name(navigate, "navigate");
 var A2 = components.a;
 var AnchorInPage = /* @__PURE__ */ __name(({ hash, children }) => {
-  const context = useContext6(DocsContext);
+  const context = useContext7(DocsContext);
   return React41.createElement(
     A2,
     {
@@ -7499,7 +8355,7 @@ var AnchorInPage = /* @__PURE__ */ __name(({ hash, children }) => {
       target: "_self",
       onClick: (event) => {
         const id = hash.substring(1);
-        const element = document.getElementById(id);
+        const element = document2.getElementById(id);
         if (element) {
           navigate(context, hash);
         }
@@ -7510,7 +8366,7 @@ var AnchorInPage = /* @__PURE__ */ __name(({ hash, children }) => {
 }, "AnchorInPage");
 var AnchorMdx = /* @__PURE__ */ __name((props) => {
   const { href, target, children, ...rest } = props;
-  const context = useContext6(DocsContext);
+  const context = useContext7(DocsContext);
   if (!href || target === "_blank" || /^https?:\/\//.test(href)) {
     return React41.createElement(A2, { ...props });
   }
@@ -7568,7 +8424,7 @@ var HeaderWithOcticonAnchor = /* @__PURE__ */ __name(({
   children,
   ...rest
 }) => {
-  const context = useContext6(DocsContext);
+  const context = useContext7(DocsContext);
   const OcticonHeader = OcticonHeaders[as];
   const hash = `#${id}`;
   return React41.createElement(OcticonHeader, { id, ...rest }, React41.createElement(
@@ -7579,7 +8435,7 @@ var HeaderWithOcticonAnchor = /* @__PURE__ */ __name(({
       tabIndex: -1,
       target: "_self",
       onClick: (event) => {
-        const element = document.getElementById(id);
+        const element = document2.getElementById(id);
         if (element) {
           navigate(context, hash);
         }
@@ -7707,7 +8563,7 @@ import React53 from "react";
 // src/blocks/blocks/DocsContainer.tsx
 import React44, { useEffect as useEffect15 } from "react";
 import { ThemeProvider, ensure as ensureTheme } from "storybook/theming";
-var { document: document2, window: globalWindow3 } = globalThis;
+var { document: document3, window: globalWindow3 } = globalThis;
 var DocsContainer = /* @__PURE__ */ __name(({
   context,
   theme,
@@ -7725,7 +8581,7 @@ var DocsContainer = /* @__PURE__ */ __name(({
     try {
       url = new URL(globalWindow3.parent.location.toString());
       if (url.hash) {
-        const element = document2.getElementById(decodeURIComponent(url.hash.substring(1)));
+        const element = document3.getElementById(decodeURIComponent(url.hash.substring(1)));
         if (element) {
           setTimeout(() => {
             scrollToElement(element);
@@ -7755,7 +8611,7 @@ var DocsContainer = /* @__PURE__ */ __name(({
 import React52 from "react";
 
 // src/blocks/blocks/Primary.tsx
-import React48, { useContext as useContext7 } from "react";
+import React48, { useContext as useContext8 } from "react";
 
 // src/blocks/blocks/DocsStory.tsx
 import React47 from "react";
@@ -7875,13 +8731,13 @@ var Primary = /* @__PURE__ */ __name((props) => {
     throw new Error("Unexpected `of={undefined}`, did you mistype a CSF file reference?");
   }
   const { csfFile } = useOf(of || "meta", ["meta"]);
-  const context = useContext7(DocsContext);
+  const context = useContext8(DocsContext);
   const primaryStory = context.componentStoriesFromCSFFile(csfFile)[0];
   return primaryStory ? React48.createElement(DocsStory, { of: primaryStory.moduleExport, expanded: false, __primary: true, withToolbar: true }) : null;
 }, "Primary");
 
 // src/blocks/blocks/Stories.tsx
-import React49, { useContext as useContext8 } from "react";
+import React49, { useContext as useContext9 } from "react";
 import { styled as styled28 } from "storybook/theming";
 var StyledHeading = styled28(Heading2)(({ theme }) => ({
   fontSize: `${theme.typography.size.s2 - 1}px`,
@@ -7898,7 +8754,7 @@ var StyledHeading = styled28(Heading2)(({ theme }) => ({
   }
 }));
 var Stories = /* @__PURE__ */ __name(({ title = "Stories", includePrimary = true }) => {
-  const { componentStories, projectAnnotations, getStoryContext } = useContext8(DocsContext);
+  const { componentStories, projectAnnotations, getStoryContext } = useContext9(DocsContext);
   let stories = componentStories();
   const { stories: { filter } = { filter: void 0 } } = projectAnnotations.parameters?.docs || {};
   if (filter) {
@@ -8066,7 +8922,8 @@ var _ExternalPreview = class _ExternalPreview extends Preview2 {
           importPath,
           title,
           name,
-          type: "story"
+          type: "story",
+          subtype: "story"
         };
       });
       this.onStoriesChanged({ storyIndex: this.storyIndex });
@@ -8124,9 +8981,9 @@ var ExternalDocsContainer = /* @__PURE__ */ __name(({ projectAnnotations, childr
 }, "ExternalDocsContainer");
 
 // src/blocks/blocks/Meta.tsx
-import React56, { useContext as useContext9 } from "react";
+import React56, { useContext as useContext10 } from "react";
 var Meta = /* @__PURE__ */ __name(({ of }) => {
-  const context = useContext9(DocsContext);
+  const context = useContext10(DocsContext);
   if (of) {
     context.referenceMeta(of, true);
   }
@@ -8206,7 +9063,7 @@ export {
   format,
   formatDate,
   formatTime,
-  getStoryId2 as getStoryId,
+  getStoryId,
   getStoryProps,
   parse2 as parse,
   parseDate,