Fixed examples link redirection

docs/framework/react/api/basic.md

@@ -5,9 +5,10 @@ menu: API
 ---
 
 ## Examples
+
 Want to skip to the implementation? Check out these examples:
 
-- [basic](../../examples/react/basic)
+- [basic](https://tanstack.com/ranger/latest/docs/framework/react/examples/basic)
 
 The API below described how to use the **basic** features.
 
@@ -18,51 +19,67 @@ The API below described how to use the **basic** features.
 ```tsx
 values: ReadonlyArray<number>
 ```
+
 **Required** The current value (or values) for the range.
 
 ### min
 
 ```tsx
 min: number
 ```
+
 **Required** The minimum limit for the range.
 
 ### max
 
 ```tsx
 max: number
 ```
+
 **Required** The maximum limit for the range.
 
 ### stepSize
 
 ```ts
 stepSize: number
 ```
+
 **Required** The distance between selectable steps.
 
 ### onChange
 
 ```ts
 onChange: (instance: Ranger<TTrackElement>) => void
 ```
+
 A function that is called when the handle is released.
 
 ## API
 
 ### handles
+
 ```tsx
-handles: ReadonlyArray<{value: number; isActive: boolean; onKeyDownHandler(event): function; onMouseDownHandler(event): function; onTouchStart(event): function}>
+handles: ReadonlyArray<{
+  value: number
+  isActive: boolean
+  onKeyDownHandler(event): function
+  onMouseDownHandler(event): function
+  onTouchStart(event): function
+}>
 ```
+
 Handles to be rendered. Each `handle` has the following props:
- - `value: number` - The current value for the handle.
- - `isActive: boolean` - Denotes if the handle is currently being dragged.
- - `onKeyDownHandler(event): func`
- - `onMouseDownHandler(event): func`
- - `onTouchStart(event): func`
+
+- `value: number` - The current value for the handle.
+- `isActive: boolean` - Denotes if the handle is currently being dragged.
+- `onKeyDownHandler(event): func`
+- `onMouseDownHandler(event): func`
+- `onTouchStart(event): func`
 
 ### activeHandleIndex
+
 ```tsx
 activeHandleIndex: null | number
 ```
+
 The zero-based index of the handle that is currently being dragged, or `null` if no handle is being dragged.

docs/framework/react/api/custom-steps.md

@@ -5,9 +5,10 @@ menu: API
 ---
 
 ## Examples
+
 Want to skip to the implementation? Check out these examples:
 
-- [custom-steps](../examples/custom-steps)
+- [custom-steps](https://tanstack.com/ranger/latest/docs/framework/react/examples/custom-steps)
 
 The API below described how to use the **custom-steps** features.
 
@@ -18,22 +19,28 @@ The API below described how to use the **custom-steps** features.
 ```ts
 steps: Array<number>
 ```
+
 An array of custom steps to use. This will override `stepSize`
 
 ### ticks
 
 ```ts
 ticks: Array<number>
 ```
+
 An array of custom ticks to use. This will override `tickSize`
 
 ## API
 
 ### getTicks
+
 ```tsx
-getTicks: () => ReadonlyArray<{value: number; key: number; percentage: number}>
+getTicks: () =>
+  ReadonlyArray<{ value: number; key: number; percentage: number }>
 ```
+
 Ticks to be rendered. Each `tick` has the following props:
-  - `value: number` - The tick number to be displayed
-  - `key: number` - The key of a tick
-  - `percentage: number` - Percentage value of where tick should be placed on ranger
+
+- `value: number` - The tick number to be displayed
+- `key: number` - The key of a tick
+- `percentage: number` - Percentage value of where tick should be placed on ranger

docs/framework/react/api/custom-styles.md

@@ -5,18 +5,22 @@ menu: API
 ---
 
 ## Examples
+
 Want to skip to the implementation? Check out these examples:
 
-- [custom-styles](../examples/custom-styles)
+- [custom-styles](https://tanstack.com/ranger/latest/docs/framework/react/examples/custom-styles)
 
 The API below described how to use the **custom-steps** features.
 
 ## API
 
 ### getSegments
+
 ```tsx
-getSegments: () => ReadonlyArray<{left: number; width: number}>
+getSegments: () => ReadonlyArray<{ left: number; width: number }>
 ```
+
 Segments to be rendered. Each `segment` has the following props:
-  - `left: number` - Percentage value of where segment should start on ranger
-  - `width: number` - Percentage value of segment width 
+
+- `left: number` - Percentage value of where segment should start on ranger
+- `width: number` - Percentage value of segment width

docs/framework/react/api/logarithmic-interpolator.md

@@ -5,9 +5,10 @@ menu: API
 ---
 
 ## Examples
+
 Want to skip to the implementation? Check out these examples:
 
-- [logarithmic-interpolator](../examples/logarithmic-interpolator)
+- [logarithmic-interpolator](https://tanstack.com/ranger/latest/docs/framework/react/examples/logarithmic-interpolator)
 
 The API below described how to use the **logarithmic-interpolator** features.
 
@@ -23,6 +24,8 @@ interpolator: {
     getValueForClientX: (clientX: number, trackDims: object, min: number, max: number): number;
 }
 ```
+
 The Interpolator to use. Defaults to the bundled linear-scale interpolator
- - `getPercentageForValue` - Takes the value & range and returns a percentage [0, 100] where the value sits from left to right.
- - `getValueForClientX`- Takes the clientX (offset from the left edge of the ranger) along with the dimensions and range settings and transforms a pixel coordinate back into a value.
+
+- `getPercentageForValue` - Takes the value & range and returns a percentage [0, 100] where the value sits from left to right.
+- `getValueForClientX`- Takes the clientX (offset from the left edge of the ranger) along with the dimensions and range settings and transforms a pixel coordinate back into a value.

docs/framework/react/api/update-on-drag.md

@@ -5,9 +5,10 @@ menu: API
 ---
 
 ## Examples
+
 Want to skip to the implementation? Check out these examples:
 
-- [update-on-drag](../../examples/react/update-on-drag)
+- [update-on-drag](https://tanstack.com/ranger/latest/docs/framework/react/examples/update-on-drag)
 
 The API below described how to use the **update-on-drag** features.
 
@@ -18,4 +19,5 @@ The API below described how to use the **update-on-drag** features.
 ```ts
 onDrag: (instance: Ranger<TTrackElement>) => void
 ```
+
 A function that is called when a handled is dragged