Fix broken links (#6822)

mark-tate · joshwooding · web-flow · commit fd2fc755c00d · 2026-07-13T15:48:06.000+01:00
Co-authored-by: Josh &lt;12938082+joshwooding@users.noreply.github.com&gt;
diff --git a/site/docs/components/calendar/usage.mdx b/site/docs/components/calendar/usage.mdx
@@ -71,7 +71,7 @@ import { CalendarGrid } from "@salt-ds/date-components";
 
 ### Setting the date
 
-Date controls, require your application to contain a [LocalizationProvider](../LocalizationProvider).
+Date controls, require your application to contain a [LocalizationProvider](../localization-provider).
 
 Pass a date object from your configured date framework via the `defaultDate` or `date` props.
 
@@ -102,7 +102,7 @@ import {
 
 The default locale for Salt's date adapters is "enUS".
 
-`Calendar` uses the locale of the configured date adapter provided by the nearest [LocalizationProvider](../LocalizationProvider).
+`Calendar` uses the locale of the configured date adapter provided by the nearest [LocalizationProvider](../localization-provider).
 Configuration of locales is date framework specific and may require you to import specific locales from the date library you are using.
 
 Refer to the documentation of the date library you are using for information on how to configure other locales.
diff --git a/site/docs/components/card/usage.mdx b/site/docs/components/card/usage.mdx
@@ -21,7 +21,7 @@ Cards may include text, images, or interactive elements. Make sure the content a
 
 ### When not to use
 
-- To display sequential information or emphasize ranking. Instead, use [`List`](../list).
+- To display sequential information or emphasize ranking. Instead, use [`List`](../list-box).
 - As a stand-alone call to action. Instead, use [`Button`](../button).
 - For decoration purposes only.
 
diff --git a/site/docs/components/date-input/examples.mdx b/site/docs/components/date-input/examples.mdx
@@ -55,7 +55,7 @@ A custom parser can be provided through the `parse` prop.
 
 ### Locale
 
-A `DateInputSingle` component will use the locale defined by the nearest [LocalizationProvider](../LocalizationProvider) to determine locale specifics, such as date format.
+A `DateInputSingle` component will use the locale defined by the nearest [LocalizationProvider](../localization-provider) to determine locale specifics, such as date format.
 
 <LivePreview
   componentName="date-input"
@@ -103,7 +103,7 @@ A `DateInputRange` component with a border provides a visually distinct input fi
 
 ### Locale
 
-A `DateInputRange` component will use the locale defined by the nearest [LocalizationProvider](../LocalizationProvider) to determine locale specifics, such as date format.
+A `DateInputRange` component will use the locale defined by the nearest [LocalizationProvider](../localization-provider) to determine locale specifics, such as date format.
 
 <LivePreview
   componentName="date-input"
diff --git a/site/docs/components/date-input/usage.mdx b/site/docs/components/date-input/usage.mdx
@@ -41,7 +41,7 @@ import { DateInputRange } from "@salt-ds/date-components";
 
 ### Setting the date
 
-Date controls, require your application to contain a [LocalizationProvider](../LocalizationProvider).
+Date controls, require your application to contain a [LocalizationProvider](../localization-provider).
 
 Date input accept dates in two formats:
 
@@ -109,7 +109,7 @@ Additionally, you can provide your own formatter through the `format` prop.
 
 The default locale for Salt's date adapters is "enUS".
 
-`DateInputSingle` and `DateInputRange` use the locale of the configured date adapter provided by the nearest [LocalizationProvider](../LocalizationProvider).
+`DateInputSingle` and `DateInputRange` use the locale of the configured date adapter provided by the nearest [LocalizationProvider](../localization-provider).
 Configuration of locales is date framework specific and may require you to import specific locales from the date library you are using.
 
 For example, if you are using `date-fns`, you may need to import the specific locale you want to use, such as `es` or `frFR`.
diff --git a/site/docs/components/date-picker/examples.mdx b/site/docs/components/date-picker/examples.mdx
@@ -17,13 +17,13 @@ For the purpose of the examples, we use type `DateFrameworkType` so the examples
 
 ## Default
 
-An uncontrolled `DatePicker`, composed of a [DateInputSingle](../DateInput) and a [Calendar](../Calendar) component, allows users to select a single date when the `selectionVariant` prop is set to "single", without requiring explicit state management in the parent component, making it ideal for simple date selection tasks.
+An uncontrolled `DatePicker`, composed of a [DateInputSingle](../date-input) and a [Calendar](../Calendar) component, allows users to select a single date when the `selectionVariant` prop is set to "single", without requiring explicit state management in the parent component, making it ideal for simple date selection tasks.
 
 <LivePreview componentName="date-picker" exampleName="Single" />
 
 ## Controlled
 
-A controlled `DatePicker`, composed of a [DateInputSingle](../DateInput) and a [Calendar](../Calendar) component, allows users to select a single date when the `selectionVariant` prop is set to "single", with the parent component explicitly managing the date state, providing greater control over the date selection process.
+A controlled `DatePicker`, composed of a [DateInputSingle](../date-input) and a [Calendar](../Calendar) component, allows users to select a single date when the `selectionVariant` prop is set to "single", with the parent component explicitly managing the date state, providing greater control over the date selection process.
 
 <LivePreview componentName="date-picker" exampleName="SingleControlled" />
 
diff --git a/site/docs/components/date-picker/range-date-picker/accessibility.mdx b/site/docs/components/date-picker/range-date-picker/accessibility.mdx
@@ -13,11 +13,11 @@ data:
 - Wrap `DatePicker` in [`FormField`](/salt/components/form-field) to provide the field with a visible label, help text, and a status message for validation feedback. This will ensure it complies with accessibility guidelines. You can find more information [in the W3C form instructions](https://www.w3.org/WAI/tutorials/forms/instructions/).
 - Clearly indicate dates that can’t be selected, such as weekends, non-trading days, or other blocked days, if relevant to your use case.
 - Consider showing date options in a dropdown instead of a date picker if the date or range is pre-determined and cannot be specified by the user.
-- As the `DatePicker` typically composes `DateInput` controls, refer to the accessibility guidance for [DateInput](../date-input/accessibility).
+- As the `DatePicker` typically composes `DateInput` controls, refer to the accessibility guidance for [DateInput](../../date-input/accessibility).
 
 ### Focus
 
-- If the `DatePicker` uses `children` to compose other components such as [Calendar](../Calendar), move focus to the first interactive element within that overlay.
+- If the `DatePicker` uses `children` to compose other components such as [Calendar](../../calendar), move focus to the first interactive element within that overlay.
 - After a date is selected, provide feedback and move focus appropriately to enhance the user experience.
 
 ### Provide instructions and feedback
diff --git a/site/docs/components/date-picker/range-date-picker/examples.mdx b/site/docs/components/date-picker/range-date-picker/examples.mdx
@@ -17,13 +17,13 @@ For the purpose of the examples, we use type `DateFrameworkType` so the examples
 
 ## Default
 
-An uncontrolled `DatePicker`, composed of a [DateInputRange](../DateInput) and a [Calendar](../Calendar) component, allows users to select a date range when the `selectionVariant` prop is set to "range", without requiring explicit state management in the parent component, making it ideal for selecting start and end dates for various applications.
+An uncontrolled `DatePicker`, composed of a [DateInputRange](../../date-input) and a [Calendar](../../calendar) component, allows users to select a date range when the `selectionVariant` prop is set to "range", without requiring explicit state management in the parent component, making it ideal for selecting start and end dates for various applications.
 
 <LivePreview componentName="date-picker" exampleName="Range" />
 
 ## Controlled
 
-A controlled `DatePicker`, composed of a [DateInputRange](../DateInput) and a [Calendar](../Calendar) component, allows users to select a date range when the `selectionVariant` prop is set to "range", with the parent component explicitly managing the start and end date states, providing greater control over the date range selection process.
+A controlled `DatePicker`, composed of a [DateInputRange](../../date-input) and a [Calendar](../../calendar) component, allows users to select a date range when the `selectionVariant` prop is set to "range", with the parent component explicitly managing the start and end date states, providing greater control over the date range selection process.
 
 <LivePreview componentName="date-picker" exampleName="RangeControlled" />
 
diff --git a/site/docs/components/date-picker/range-date-picker/usage.mdx b/site/docs/components/date-picker/range-date-picker/usage.mdx
@@ -22,10 +22,10 @@ Salt provides the following `children` for convenience:
 
 When `selectionVariant` is "range":
 
-- `DatePickerRangeInput` - a composable [DateInputRange](../DateInput) pre-wired to the `DatePicker` selection context.
-- `DatePickerRangeGridPanel` - composable [Calendar](../Calendar) grid pre-wired to the `DatePicker` selection context.
+- `DatePickerRangeInput` - a composable [DateInputRange](../../date-input) pre-wired to the `DatePicker` selection context.
+- `DatePickerRangeGridPanel` - composable [Calendar](../../calendar) grid pre-wired to the `DatePicker` selection context.
   - Opt for `DatePickerRangeGridPanel` when dealing with short date ranges or when displaying the dates in-between enhances the user experience.
-- `DatePickerRangePanel` - composable dual [Calendar](../Calendar) view pre-wired to the `DatePicker` selection context.
+- `DatePickerRangePanel` - composable dual [Calendar](../../calendar) view pre-wired to the `DatePicker` selection context.
   - Choose `DatePickerRangePanel` for long date ranges or when the focus is primarily on the start and end dates, rather than the dates in-between.
 
 A composable API enables you to use provided child components, such as `DatePickerRangeInput` and `DatePickerRangePanel`.
@@ -58,7 +58,7 @@ import { DatePicker } from "@salt-ds/date-components";
 
 ### Setting the date
 
-Date controls, require your application to contain a [LocalizationProvider](../LocalizationProvider).
+Date controls, require your application to contain a [LocalizationProvider](../../localization-provider).
 
 Pass a range object from your configured date framework using the `defaultDate` or `date` props.
 
@@ -94,7 +94,7 @@ import {
 
 The default locale for Salt's date adapters is "enUS".
 
-`DatePicker` uses the locale of the configured date adapter provided by the nearest [LocalizationProvider] (../LocalizationProvider).
+`DatePicker` uses the locale of the configured date adapter provided by the nearest [LocalizationProvider] (../../localization-provider).
 Configuration of locales is date framework specific and may require you to import specific locales from the date library you are using.
 
 For example, if you are using `date-fns`, you may need to import the specific locale you want to use, such as `es` or `frFR`.
@@ -129,7 +129,7 @@ Valid values for `timezone` are date framework specific and can be one of the fo
   componentName="DatePickerSingleInput"
 />
 
-`DatePickerSingleInput` composes a [DateInputSingle](../DateInput) that uses the `DatePicker` context for single date selection.
+`DatePickerSingleInput` composes a [DateInputSingle](../../date-input) that uses the `DatePicker` context for single date selection.
 
 ### DatePickerRangeInput
 
@@ -138,7 +138,7 @@ Valid values for `timezone` are date framework specific and can be one of the fo
   componentName="DatePickerRangeInput"
 />
 
-`DatePickerRangeInput` composes a [DateInputRange](../DateInput) that uses the `DatePicker` context for date range selection.
+`DatePickerRangeInput` composes a [DateInputRange](../../date-input) that uses the `DatePicker` context for date range selection.
 
 ### DatePickerSingleGridPanel
 
@@ -147,7 +147,7 @@ Valid values for `timezone` are date framework specific and can be one of the fo
   componentName="DatePickerSingleGridPanel"
 />
 
-`DatePickerSingleGridPanel` composes a [Calendar](../Calendar) that uses the `DatePicker` context for single date selection.
+`DatePickerSingleGridPanel` composes a [Calendar](../../calendar) that uses the `DatePicker` context for single date selection.
 
 ### DatePickerRangePanel
 
@@ -156,7 +156,7 @@ Valid values for `timezone` are date framework specific and can be one of the fo
   componentName="DatePickerRangePanel"
 />
 
-`DatePickerRangePanel` composes a [Calendar](../Calendar) that uses the `DatePicker` context for date range selection.
+`DatePickerRangePanel` composes a [Calendar](../../calendar) that uses the `DatePicker` context for date range selection.
 
 ### DatePickerOverlay
 
diff --git a/site/docs/components/date-picker/usage.mdx b/site/docs/components/date-picker/usage.mdx
@@ -20,7 +20,7 @@ Salt provides the following `children` for convenience:
 
 When `selectionVariant` is "single":
 
-- `DatePickerSingleInput` - a composable [DateInputSingle](../DateInput) component pre-wired to the `DatePicker` selection context.
+- `DatePickerSingleInput` - a composable [DateInputSingle](../date-input) component pre-wired to the `DatePicker` selection context.
 - `DatePickerSingleGridPanel` - a composable [Calendar](../Calendar) grid pre-wired to the `DatePicker` selection context.
 
 #### When to use
@@ -57,7 +57,7 @@ import { DatePicker } from "@salt-ds/date-components";
 
 ### Setting the date
 
-Date controls, require your application to contain a [LocalizationProvider](../LocalizationProvider).
+Date controls, require your application to contain a [LocalizationProvider](../localization-provider).
 
 Pass a date object from your configured date framework via the `defaultDate` or `date` props.
 
@@ -93,7 +93,7 @@ import {
 
 The default locale for Salt's date adapters is "enUS".
 
-`DatePicker` uses the locale of the configured date adapter provided by the nearest [LocalizationProvider] (../LocalizationProvider).
+`DatePicker` uses the locale of the configured date adapter provided by the nearest [LocalizationProvider] (../localization-provider).
 Configuration of locales is date framework specific and may require you to import specific locales from the date library you are using.
 
 For example, if you are using `date-fns`, you may need to import the specific locale you want to use, such as `es` or `frFR`.
@@ -128,7 +128,7 @@ Valid values for `timezone` are date framework specific and can be one of the fo
   componentName="DatePickerSingleInput"
 />
 
-`DatePickerSingleInput` composes a [DateInputSingle](../DateInput) that uses the `DatePicker` context for single date selection.
+`DatePickerSingleInput` composes a [DateInputSingle](../date-input) that uses the `DatePicker` context for single date selection.
 
 ### DatePickerRangeInput
 
@@ -137,7 +137,7 @@ Valid values for `timezone` are date framework specific and can be one of the fo
   componentName="DatePickerRangeInput"
 />
 
-`DatePickerRangeInput` composes a [DateInputRange](../DateInput) that uses the `DatePicker` context for date range selection.
+`DatePickerRangeInput` composes a [DateInputRange](../date-input) that uses the `DatePicker` context for date range selection.
 
 ### DatePickerSingleGridPanel
 
diff --git a/site/docs/components/layouts/border-layout/usage.mdx b/site/docs/components/layouts/border-layout/usage.mdx
@@ -17,8 +17,8 @@ data:
 ### When not to use
 
 - When you're not managing the top-level layout of your application, but the layout inside one of the five border layout regions.
-- For a customized layout that you can control in both row and column dimensions (for example, a dashboard). Instead, use [`GridLayout`](./grid-layout).
-- For a side panel that temporarily reveals relevant content. Instead, use [`Drawer`](../drawer).
+- For a customized layout that you can control in both row and column dimensions (for example, a dashboard). Instead, use [`GridLayout`](../grid-layout).
+- For a side panel that temporarily reveals relevant content. Instead, use [`Drawer`](../../drawer).
 
 ## Import
 
diff --git a/site/docs/components/localization-provider/examples.mdx b/site/docs/components/localization-provider/examples.mdx
@@ -36,7 +36,7 @@ In this example, date selection is limited to 3 months.
 
 ## Locales
 
-The `LocalizationProvider` defines the locale used by Salt's date based controls such as [Calendar](../Calendar), [DateInput](../DateInput) and [DatePicker](../DatePicker).
+The `LocalizationProvider` defines the locale used by Salt's date based controls such as [Calendar](../Calendar), [DateInput](../date-input) and [DatePicker](../date-picker).
 
 Configuration of locales is date framework specific and may require you to import specific locales from the date library you are using.
 
diff --git a/site/docs/components/slider/range-slider/examples.mdx b/site/docs/components/slider/range-slider/examples.mdx
@@ -43,7 +43,7 @@ You can display marks under the `RangeSlider` track to label specific values. Th
 
 You can combine `marks` with `minLabel` and `maxLabel` to provide even more context regarding the `RangeSlider`.
 
-To add non-numeric `marks` to certain values, please refer to the [example with non-numeric values](/salt/components/range-slider/examples#with-non-numeric-values) below.
+To add non-numeric `marks` to certain values, please refer to the [example with non-numeric values](/salt/components/slider/range-slider/examples#with-non-numeric-values) below.
 
 <LivePreview componentName="range-slider" exampleName="WithMarks" />
 
diff --git a/site/docs/components/slider/range-slider/usage.mdx b/site/docs/components/slider/range-slider/usage.mdx
@@ -18,8 +18,7 @@ data:
 ### When not to use
 
 - When it’s important to select an exact numeric value that falls within a significantly large range, for example, 1-1000. Instead, use [Input](/salt/components/input).
-- When displaying progress through a series of separate steps, such as a wizard or multi-step form. Use [SteppedTracker
-  ](/salt/components/stepped-tracker) instead.
+- When displaying progress through a series of separate steps, such as a wizard or multi-step form. Use [Stepper](/salt/components/stepper) instead.
 
 ## Import
 
diff --git a/site/docs/getting-started/designing/tableau.mdx b/site/docs/getting-started/designing/tableau.mdx
@@ -15,7 +15,7 @@ This guidance outlines how you can best align your Tableau dashboards with the S
 
 ## Analytical dashboard
 
-They key principles this guidance covers derive from the [Analytical Dashboard pattern](/salt/patterns/dashboards/). We highly recommend reading the pattern prior to building a dashboard design within Tableau, as this will enable you to form a foundational understanding of the layout features and components recommended to maintain effective visual hierarchy.
+They key principles this guidance covers derive from the [Analytical Dashboard pattern](/salt/patterns/analytical-dashboards/). We highly recommend reading the pattern prior to building a dashboard design within Tableau, as this will enable you to form a foundational understanding of the layout features and components recommended to maintain effective visual hierarchy.
 
 ## Tableau template
 
@@ -76,13 +76,12 @@ The Salt example dashboard uses an eight-column MD large grid.
 
 ### Content modules
 
-The Salt [dashboard](/salt/patterns/dashboards/) pattern recommends using [`Card`](/salt/components/card/) to display data within the main body region of a dashboard. You can achieve this within Tableau instead by styling and positioning containers as panels.
+The Salt [dashboard](/salt/patterns/analytical-dashboards/) pattern recommends using [`Card`](/salt/components/card/) to display data within the main body region of a dashboard. You can achieve this within Tableau instead by styling and positioning containers as panels.
 
 <GuidanceCallout type="positive">
   Refer to the content module [spacing
-  recommendations](/salt/patterns/dashboards/analytical-dashboard#spacing)
-  within the dashboard pattern to better establish readability in your
-  dashboards.
+  recommendations](/salt/patterns/analytical-dashboard#spacing) within the
+  dashboard pattern to better establish readability in your dashboards.
 </GuidanceCallout>
 
 Objects within a Tableau dashboard typically sit in one of two container types: tiled or floating.
diff --git a/site/docs/patterns/international-address-form.mdx b/site/docs/patterns/international-address-form.mdx
@@ -47,7 +47,7 @@ Use it when your user needs to enter an address for a specific country. This cou
 * Use `Dropdown` to display the country selector.
 * Use `StackLayout` to display the pattern elements in a column. 
 
-For further layout guidance, please refer to the [form pattern](../forms).
+For further layout guidance, please refer to the [form pattern](./forms).
 
 <Diagram
     src="/img/patterns/international-address-input/iai-layout.png"
diff --git a/site/docs/patterns/international-phone-number-input.mdx b/site/docs/patterns/international-phone-number-input.mdx
@@ -94,7 +94,7 @@ When the country name exceeds the width of the input, the text is truncated. In
 
 ## Country selection dropdown
 
-The country selection dropdown uses the [list](/salt/components/list) component and should display in alphabetical order.
+The country selection dropdown uses the [list-box](/salt/components/list-box) component and should display in alphabetical order.
 
 <ImageSwitcher
   images={[
diff --git a/site/docs/patterns/vertical-navigation.mdx b/site/docs/patterns/vertical-navigation.mdx
