Docs: Fix incorrect relative links

docs/_snippets/storybook-mdx-template-with-prop.md

@@ -5,7 +5,7 @@ import { Meta, Title, Primary, Controls, Stories } from '@storybook/blocks';
 
 {/* 
   * 👇 The isTemplate property is required to tell Storybook that this is a template
-  * See https://storybook.js.org/docs/api/doc-block-meta
+  * See https://storybook.js.org/docs/api/doc-blocks/doc-block-meta
   * to learn how to use
 */}
 

docs/_snippets/storybook-vite-builder-react-docgen.md

@@ -7,7 +7,7 @@ export default {
   },
   typescript: {
     // Enables the `react-docgen-typescript` parser.
-    // See https://storybook.js.org/docs/api/main-config-typescript for more information about this option.
+    // See https://storybook.js.org/docs/api/main-config/main-config-typescript for more information about this option.
     reactDocgen: 'react-docgen-typescript',
   },
 };

docs/addons/writing-addons.mdx

@@ -22,7 +22,7 @@ There are two main categories of addons, each with its role:
 
 ### UI-based addons
 
-The addon built in this guide is a UI-based addon, specifically a [toolbar](./addon-types.md#toolbars) addon, enabling users to draw outlines around each element in the story through a shortcut or click of a button. UI addons can create other types of UI elements, each with its function: [panels](./addon-types.md#panels) and [tabs](./addon-types.md#tabs), providing users with various ways to interact with the UI.
+The addon built in this guide is a UI-based addon, specifically a [toolbar](./addon-types.mdx#toolbars) addon, enabling users to draw outlines around each element in the story through a shortcut or click of a button. UI addons can create other types of UI elements, each with its function: [panels](./addon-types.mdx#panels) and [tabs](./addon-types.mdx#tabs), providing users with various ways to interact with the UI.
 
 {/* prettier-ignore-start */}
 
@@ -76,7 +76,7 @@ import { IconButton } from '@storybook/components';
 import { LightningIcon } from '@storybook/icons';
 ```
 
-The [`useGlobals`](./addons-api.md#useglobals) and [`useStorybookApi`](./addons-api.md#usestorybookapi) hooks from the `manager-api` package are used to access the Storybook's APIs, allowing users to interact with the addon, such as enabling or disabling it.
+The [`useGlobals`](./addons-api.mdx#useglobals) and [`useStorybookApi`](./addons-api.mdx#usestorybookapi) hooks from the `manager-api` package are used to access the Storybook's APIs, allowing users to interact with the addon, such as enabling or disabling it.
 
 The `IconButton` or `Button` component from the [`@storybook/components`](https://www.npmjs.com/package/@storybook/components) package can be used to render the buttons in the toolbar. The [`@storybook/icons`](https://github.com/storybookjs/icons) package provides a large set of appropriately sized and styled icons to choose from.
 

docs/api/doc-blocks/doc-block-argtypes.mdx

@@ -13,7 +13,7 @@ The `ArgTypes` block can be used to show a static table of [arg types](../arg-ty
   If you’re looking for a dynamic table that shows a story’s current arg values for a story and supports users changing them, see the [`Controls`](./doc-block-controls.mdx) block instead.
 </Callout>
 
-![Screenshot of ArgTypes block](../_assets/doc-blocks/doc-block-argtypes.png)
+![Screenshot of ArgTypes block](../../_assets/doc-block-argtypes.png)
 
 {/* prettier-ignore-start */}
 
@@ -39,7 +39,7 @@ import { ArgTypes } from '@storybook/blocks';
 <details>
   <summary>Configuring with props <strong>and</strong> parameters</summary>
 
-  ℹ️ Like most blocks, the `ArgTypes` block is configured with props in MDX. Many of those props derive their default value from a corresponding [parameter](../writing-stories/parameters.mdx) in the block's namespace, `parameters.docs.argTypes`.
+  ℹ️ Like most blocks, the `ArgTypes` block is configured with props in MDX. Many of those props derive their default value from a corresponding [parameter](../../writing-stories/parameters.mdx) in the block's namespace, `parameters.docs.argTypes`.
 
   The following `exclude` configurations are equivalent:
 
@@ -59,7 +59,7 @@ import { ArgTypes } from '@storybook/blocks';
 
   {/* prettier-ignore-end */}
 
-  The example above applied the parameter at the [component](../writing-stories/parameters.md#component-parameters) (or meta) level, but it could also be applied at the [project](../writing-stories/parameters.md#global-parameters) or [story](../writing-stories/parameters.md#story-parameters) level.
+  The example above applied the parameter at the [component](../../writing-stories/parameters.mdx#component-parameters) (or meta) level, but it could also be applied at the [project](../../writing-stories/parameters.mdx#global-parameters) or [story](../../writing-stories/parameters.mdx#story-parameters) level.
 </details>
 
 ### `exclude`

docs/api/doc-blocks/doc-block-canvas.mdx

@@ -9,7 +9,7 @@ sidebar:
 
 The `Canvas` block is a wrapper around a [`Story`](./doc-block-story.mdx), featuring a toolbar that allows you to interact with its content while automatically providing the required [`Source`](./doc-block-source.mdx) snippets.
 
-![Screenshot of Canvas block](../_assets/doc-blocks/doc-block-canvas.png)
+![Screenshot of Canvas block](../../_assets/doc-block-canvas.png)
 
 When using the Canvas block in MDX, it references a story with the `of` prop:
 
@@ -41,7 +41,7 @@ import { Canvas } from '@storybook/blocks';
 <details>
   <summary>Configuring with props <strong>and</strong> parameters</summary>
 
-  ℹ️ Like most blocks, the `Canvas` block is configured with props in MDX. Many of those props derive their default value from a corresponding [parameter](../writing-stories/parameters.mdx) in the block's namespace, `parameters.docs.canvas`.
+  ℹ️ Like most blocks, the `Canvas` block is configured with props in MDX. Many of those props derive their default value from a corresponding [parameter](../../writing-stories/parameters.mdx) in the block's namespace, `parameters.docs.canvas`.
 
   The following `sourceState` configurations are equivalent:
 
@@ -61,7 +61,7 @@ import { Canvas } from '@storybook/blocks';
 
   {/* prettier-ignore-end */}
 
-  The example above applied the parameter at the [story](../writing-stories/parameters.md#story-parameters) level, but it could also be applied at the [component](../writing-stories/parameters.md#component-parameters) (or meta) level or [project](../writing-stories/parameters.md#global-parameters) level.
+  The example above applied the parameter at the [story](../../writing-stories/parameters.mdx#story-parameters) level, but it could also be applied at the [component](../../writing-stories/parameters.mdx#component-parameters) (or meta) level or [project](../../writing-stories/parameters.mdx#global-parameters) level.
 </details>
 
 ### `additionalActions`

docs/api/doc-blocks/doc-block-colorpalette.mdx

@@ -9,7 +9,7 @@ sidebar:
 
 The `ColorPalette` block allows you to document all color-related items (e.g., swatches) used throughout your project.
 
-![Screenshot of ColorPalette and ColorItem blocks](../_assets/doc-blocks/doc-block-colorpalette.png)
+![Screenshot of ColorPalette and ColorItem blocks](../../_assets/doc-block-colorpalette.png)
 
 {/* prettier-ignore-start */}
 

docs/api/doc-blocks/doc-block-controls.mdx

@@ -13,7 +13,7 @@ The `Controls` block can be used to show a dynamic table of args for a given sto
   If you’re looking for a static table that shows a component's arg types with no controls, see the [`ArgTypes`](./doc-block-argtypes.mdx) block instead.
 </Callout>
 
-![Screenshot of Controls block](../_assets/doc-blocks/doc-block-controls.png)
+![Screenshot of Controls block](../../_assets/doc-block-controls.png)
 
 {/* prettier-ignore-start */}
 
@@ -33,7 +33,7 @@ import * as ButtonStories from './Button.stories'
 {/* prettier-ignore-end */}
 
 <Callout variant="warning">
-  The Controls doc block will only have functioning UI controls if you have also installed and registered [`@storybook/addon-controls`](../essentials/controls.mdx) (included in [`@storybook/addon-essentials`](../essentials/index.mdx)) and haven't turned off inline stories with the [`inline`](./doc-block-story.md#inline) configuration option.
+  The Controls doc block will only have functioning UI controls if you have also installed and registered [`@storybook/addon-controls`](../../essentials/controls.mdx) (included in [`@storybook/addon-essentials`](../../essentials/index.mdx)) and haven't turned off inline stories with the [`inline`](./doc-block-story.mdx#inline) configuration option.
 </Callout>
 
 ## Controls
@@ -45,7 +45,7 @@ import { Controls } from '@storybook/blocks';
 <details>
   <summary>Configuring with props <strong>and</strong> parameters</summary>
 
-  ℹ️ Like most blocks, the `Controls` block is configured with props in MDX. Many of those props derive their default value from a corresponding [parameter](../writing-stories/parameters.mdx) in the block's namespace, `parameters.docs.controls`.
+  ℹ️ Like most blocks, the `Controls` block is configured with props in MDX. Many of those props derive their default value from a corresponding [parameter](../../writing-stories/parameters.mdx) in the block's namespace, `parameters.docs.controls`.
 
   The following `exclude` configurations are equivalent:
 
@@ -65,7 +65,7 @@ import { Controls } from '@storybook/blocks';
 
   {/* prettier-ignore-end */}
 
-  The example above applied the parameter at the [component](../writing-stories/parameters.md#component-parameters) (or meta) level, but it could also be applied at the [project](../writing-stories/parameters.md#global-parameters) or [story](../writing-stories/parameters.md#story-parameters) level.
+  The example above applied the parameter at the [component](../../writing-stories/parameters.mdx#component-parameters) (or meta) level, but it could also be applied at the [project](../../writing-stories/parameters.mdx#global-parameters) or [story](../../writing-stories/parameters.mdx#story-parameters) level.
 </details>
 
 <Callout variant="info" icon="💡">

docs/api/doc-blocks/doc-block-description.mdx

@@ -9,7 +9,7 @@ sidebar:
 
 The `Description` block displays the description for a component, story, or meta, obtained from their respective JSDoc comments.
 
-![Screenshot of Description block](../_assets/doc-blocks/doc-block-title-subtitle-description.png)
+![Screenshot of Description block](../../_assets/doc-block-title-subtitle-description.png)
 
 {/* prettier-ignore-start */}
 

docs/api/doc-blocks/doc-block-icongallery.mdx

@@ -9,7 +9,7 @@ sidebar:
 
 The `IconGallery` block enables you to easily document React icon components associated with your project, displayed in a neat grid.
 
-![Screenshot of IconGallery and IconItem blocks](../_assets/doc-blocks/doc-block-icongallery.png)
+![Screenshot of IconGallery and IconItem blocks](../../_assets/doc-block-icongallery.png)
 
 {/* prettier-ignore-start */}
 

docs/api/doc-blocks/doc-block-markdown.mdx

@@ -7,7 +7,7 @@ sidebar:
 
 The `Markdown` block allows you to import and include plain markdown in your MDX files.
 
-![Screenshot of Markdown block](../_assets/doc-blocks/doc-block-markdown.png)
+![Screenshot of Markdown block](../../_assets/doc-block-markdown.png)
 
 When importing markdown files, it’s important to use the `?raw` suffix on the import path to ensure the content is imported as-is, and isn’t being evaluated:
 

docs/api/doc-blocks/doc-block-meta.mdx

@@ -39,7 +39,7 @@ import { Meta } from '@storybook/blocks';
 
 Type: `boolean`
 
-Determines whether the MDX file serves as an [automatic docs template](../writing-docs/autodocs.md#with-mdx). When true, the MDX file is not indexed as it normally would be.
+Determines whether the MDX file serves as an [automatic docs template](../../writing-docs/autodocs.mdx#with-mdx). When true, the MDX file is not indexed as it normally would be.
 
 ### `name`
 
@@ -86,7 +86,7 @@ Attaching an MDX file to a component’s stories with the `of` prop serves two p
 2. Attaches the component and its stories to the MDX file, allowing you to use other doc blocks in “attached” mode (for instance to use the `Stories` block).
 
 <Callout variant="info" icon="💡">
-  The `of` prop is optional. If you don’t want to attach a specific CSF file to this MDX file, you can either use the `title` prop to control the location, or emit `Meta` entirely, and let [autotitle](../configure/sidebar-and-urls.md#csf-30-auto-titles) decide where it goes.
+  The `of` prop is optional. If you don’t want to attach a specific CSF file to this MDX file, you can either use the `title` prop to control the location, or emit `Meta` entirely, and let [autotitle](../../configure/user-interface/sidebar-and-urls.mdx#csf-30-auto-titles) decide where it goes.
 </Callout>
 
 ### `title`
@@ -109,7 +109,7 @@ import { Meta } from '@storybook/blocks';
 {/* prettier-ignore-end */}
 
 <Callout variant="info" icon="💡">
-  If you want to change the sorting of the docs entry with the component’s stories, use [Story Sorting](../writing-stories/naming-components-and-hierarchy.md#sorting-stories), or add specific MDX files to your `stories` field in `main.js` in order.
+  If you want to change the sorting of the docs entry with the component’s stories, use [Story Sorting](../../writing-stories/naming-components-and-hierarchy.mdx#sorting-stories), or add specific MDX files to your `stories` field in `main.js` in order.
 </Callout>
 
 ## Attached vs. unattached

docs/api/doc-blocks/doc-block-primary.mdx

@@ -9,7 +9,7 @@ sidebar:
 
 The `Primary` block displays the primary (first defined in the stories file) story, in a [`Story`](./doc-block-story.mdx) block. It is typically rendered immediately under the title in a docs entry.
 
-![Screenshot of Primary block](../_assets/doc-blocks/doc-block-primary.png)
+![Screenshot of Primary block](../../_assets/doc-block-primary.png)
 
 {/* prettier-ignore-start */}
 

docs/api/doc-blocks/doc-block-source.mdx

@@ -9,7 +9,7 @@ sidebar:
 
 The `Source` block is used to render a snippet of source code directly.
 
-![Screenshot of Source block](../_assets/doc-blocks/doc-block-source.png)
+![Screenshot of Source block](../../_assets/doc-block-source.png)
 
 {/* prettier-ignore-start */}
 
@@ -35,7 +35,7 @@ import { Source } from '@storybook/blocks';
 <details>
   <summary>Configuring with props <strong>and</strong> parameters</summary>
 
-  ℹ️ Like most blocks, the `Source` block is configured with props in MDX. Many of those props derive their default value from a corresponding [parameter](../writing-stories/parameters.mdx) in the block's namespace, `parameters.docs.source`.
+  ℹ️ Like most blocks, the `Source` block is configured with props in MDX. Many of those props derive their default value from a corresponding [parameter](../../writing-stories/parameters.mdx) in the block's namespace, `parameters.docs.source`.
 
   The following `language` configurations are equivalent:
 
@@ -55,7 +55,7 @@ import { Source } from '@storybook/blocks';
 
   {/* prettier-ignore-end */}
 
-  The example above applied the parameter at the [story](../writing-stories/parameters.md#story-parameters) level, but it could also be applied at the [component](../writing-stories/parameters.md#component-parameters) (or meta) level or [project](../writing-stories/parameters.md#global-parameters) level.
+  The example above applied the parameter at the [story](../../writing-stories/parameters.mdx#story-parameters) level, but it could also be applied at the [component](../../writing-stories/parameters.mdx#component-parameters) (or meta) level or [project](../../writing-stories/parameters.mdx#global-parameters) level.
 </details>
 
 ### `code`
@@ -158,5 +158,5 @@ Specifies how the source code is rendered.
 * **dynamic**: Renders the story source with dynamically updated arg values
 
 <Callout variant="info" icon="💡">
-  Note that dynamic snippets will only work if the story uses [`args`](../writing-stories/args.mdx) and the [`Story` block](./doc-block-story.mdx) for that story is rendered along with the `Source` block.
+  Note that dynamic snippets will only work if the story uses [`args`](../../writing-stories/args.mdx) and the [`Story` block](./doc-block-story.mdx) for that story is rendered along with the `Source` block.
 </Callout>

docs/api/doc-blocks/doc-block-stories.mdx

@@ -9,7 +9,7 @@ sidebar:
 
 The `Stories` block renders the full collection of stories in a stories file.
 
-![Screenshot of Stories block](../_assets/doc-blocks/doc-block-stories.png)
+![Screenshot of Stories block](../../_assets/doc-block-stories.png)
 
 {/* prettier-ignore-start */}
 

docs/api/doc-blocks/doc-block-story.mdx

@@ -15,7 +15,7 @@ In Storybook Docs, you can render any of your stories from your CSF files in the
   Typically you want to use the [`Canvas` block](./doc-block-canvas.mdx) to render a story with a surrounding border and the source block, but you can use the `Story` block to render just the story.
 </Callout>
 
-![Screenshot of Story block](../_assets/doc-blocks/doc-block-story.png)
+![Screenshot of Story block](../../_assets/doc-block-story.png)
 
 {/* prettier-ignore-start */}
 

docs/api/doc-blocks/doc-block-subtitle.mdx

@@ -9,7 +9,7 @@ sidebar:
 
 The `Subtitle` block can serve as a secondary heading for your docs entry.
 
-![Screenshot of Subtitle block](../_assets/doc-blocks/doc-block-title-subtitle-description.png)
+![Screenshot of Subtitle block](../../_assets/doc-block-title-subtitle-description.png)
 
 {/* prettier-ignore-start */}
 

docs/api/doc-blocks/doc-block-title.mdx

@@ -9,7 +9,7 @@ sidebar:
 
 The `Title` block serves as the primary heading for your docs entry. It is typically used to provide the component or page name.
 
-![Screenshot of Title block](../_assets/doc-blocks/doc-block-title-subtitle-description.png)
+![Screenshot of Title block](../../_assets/doc-block-title-subtitle-description.png)
 
 {/* prettier-ignore-start */}
 

docs/api/doc-blocks/doc-block-typeset.mdx

@@ -9,7 +9,7 @@ sidebar:
 
 The `Typeset` block helps document the fonts used throughout your project.
 
-![Screenshot of Typeset block](../_assets/doc-blocks/doc-block-typeset.png)
+![Screenshot of Typeset block](../../_assets/doc-block-typeset.png)
 
 {/* prettier-ignore-start */}
 

docs/api/doc-blocks/doc-block-unstyled.mdx

@@ -35,7 +35,7 @@ import { Header } from "./Header.tsx";
 
 Yields:
 
-![Screenshot of Unstyled Doc Block](../_assets/doc-blocks/doc-block-unstyled.png)
+![Screenshot of Unstyled Doc Block](../../_assets/doc-block-unstyled.png)
 
 <Callout variant="info">
   The other blocks like [`Story`](./doc-block-story.mdx) and [`Canvas`](./doc-block-canvas.mdx) are already unstyled, so there’s no need to wrap those in the `Unstyled` block to ensure that Storybook’s styles don’t bleed into the stories. However, if you import your components directly in the MDX, you most likely want to wrap them in the Unstyled block.

docs/api/doc-blocks/doc-block-useof.mdx

@@ -84,7 +84,7 @@ Type: `ModuleExport | 'story' | 'meta' | 'component'`
 
 Provides the story export, meta export, component export, or CSF file exports from which you get annotations.
 
-When the custom block is in an [attached doc](./doc-block-meta.md#attached-vs-unattached), it’s also possible to get the primary (first) story, meta, or component by passing in a string instead. This is useful as a fallback, so the `of` prop can be omitted in your block. The most common pattern is using this as `useOf(props.of || 'story')` which will fall back to the primary story if no `of` prop is defined.
+When the custom block is in an [attached doc](./doc-block-meta.mdx#attached-vs-unattached), it’s also possible to get the primary (first) story, meta, or component by passing in a string instead. This is useful as a fallback, so the `of` prop can be omitted in your block. The most common pattern is using this as `useOf(props.of || 'story')` which will fall back to the primary story if no `of` prop is defined.
 
 * `useOf('story')` returns the annotated primary story in attached mode; error in unattached mode
 * `useOf('meta')` returns the annotated meta in attached mode; error in unattached mode