diff --git a/docs/accordion.md b/docs/accordion.md
index 063c1970f..b113c7c24 100644
--- a/docs/accordion.md
+++ b/docs/accordion.md
@@ -65,9 +65,9 @@ export function App(props) {
export default App;
```
-[Accordion Basic - Open on Sandbox](https://codesandbox.io/s/scil2)
+[Accordion Styled - Open on Sandbox](https://codesandbox.io/s/69twh)
-[Accordion Styled - Open on Sandbox](https://codesandbox.io/s/lonmk)
+[Accordion Basic - Open on Sandbox](https://codesandbox.io/s/dso90)
## Accessibility Requirements
diff --git a/docs/breadcrumb.md b/docs/breadcrumb.md
index cc1963fa3..a4b137cbc 100644
--- a/docs/breadcrumb.md
+++ b/docs/breadcrumb.md
@@ -57,7 +57,7 @@ export const App = props => {
export default App;
```
-[Breadcrumbs Basic - Open on Sandbox](https://codesandbox.io/s/t3ygx)
+[Breadcrumbs Basic - Open on Sandbox](https://codesandbox.io/s/we32g)
## Accessibility Requirement
diff --git a/docs/calendar.md b/docs/calendar.md
index 4393f8d43..693e53684 100644
--- a/docs/calendar.md
+++ b/docs/calendar.md
@@ -265,9 +265,9 @@ const DoubleChevronRight = props => (
);
```
-[Calendar - Open On Sandbox](https://codesandbox.io/s/qutws)
+[RangeCalendar - Open On Sandbox](https://codesandbox.io/s/myy3o)
-[RangeCalendar - Open On Sandbox](https://codesandbox.io/s/g035s)
+[Calendar - Open On Sandbox](https://codesandbox.io/s/nr4o9)
## Composition
diff --git a/docs/datepicker.md b/docs/datepicker.md
index 2e9eb312f..d72738e26 100644
--- a/docs/datepicker.md
+++ b/docs/datepicker.md
@@ -366,9 +366,9 @@ const DoubleChevronRight = props => (
);
```
-[RangeDatePicker - Open On Sandbox](https://codesandbox.io/s/7r8jv)
+[RangeDatePicker - Open On Sandbox](https://codesandbox.io/s/94npf)
-[DatePicker - Open On Sandbox](https://codesandbox.io/s/x7w6p)
+[DatePicker - Open On Sandbox](https://codesandbox.io/s/dkrqk)
## Composition
diff --git a/docs/drawer.md b/docs/drawer.md
index 0dded82e1..332a3378b 100644
--- a/docs/drawer.md
+++ b/docs/drawer.md
@@ -95,7 +95,7 @@ const cssTransforms = {
};
```
-[Drawer - Open On Sandbox](https://codesandbox.io/s/ostxr)
+[Drawer - Open On Sandbox](https://codesandbox.io/s/q9njc)
## Composition
diff --git a/docs/link.md b/docs/link.md
index da0802d15..82a6563bd 100644
--- a/docs/link.md
+++ b/docs/link.md
@@ -28,7 +28,7 @@ export const App = props => {
export default App;
```
-[Link - Open on Sandbox](https://codesandbox.io/s/5gwlm)
+[Link - Open on Sandbox](https://codesandbox.io/s/seki2)
## Composition
diff --git a/docs/meter.md b/docs/meter.md
index 7426ce303..5c24cc6e5 100644
--- a/docs/meter.md
+++ b/docs/meter.md
@@ -110,7 +110,7 @@ function meterBarStyle(meter, props) {
}
```
-[Meter - Open On Sandbox](https://codesandbox.io/s/8mxwv)
+[Meter - Open On Sandbox](https://codesandbox.io/s/6b6s7)
## Accessibility Requirement
@@ -131,21 +131,21 @@ function meterBarStyle(meter, props) {
- **`value`** number
The `value` of the meter indicator.
- If `undefined`/`not valid` the meter bar will be equal to `min`
+If `undefined`/`not valid` the meter bar will be equal to `min`
- **`min`** number
The minimum value of the meter
- **`max`** number
The maximum value of the meter
- **`low`** number
The higher limit of min range.
- Defaults to `min`.
+Defaults to `min`.
- **`optimum`** number
The lower limit of max range.
- Defaults to `median of low & high`.
+Defaults to `median of low & high`.
- **`high`** number
The lower limit of max range.
- Defaults to `max`.
+Defaults to `max`.
### `Meter`
@@ -154,7 +154,7 @@ function meterBarStyle(meter, props) {
- **`value`** number
The `value` of the meter indicator.
- If `undefined`/`not valid` the meter bar will be equal to `min`
+If `undefined`/`not valid` the meter bar will be equal to `min`
- **`min`** number
The minimum value of the meter
- **`max`** number
The maximum value of the meter
diff --git a/docs/number-input.md b/docs/number-input.md
index 47f8cbbdc..7e5b05819 100644
--- a/docs/number-input.md
+++ b/docs/number-input.md
@@ -52,7 +52,7 @@ export const App = props => {
export default App;
```
-[NumberInput - Open On Sandbox](https://codesandbox.io/s/j0wly)
+[NumberInput - Open On Sandbox](https://codesandbox.io/s/0twyb)
## Accessibility Requirement
@@ -71,16 +71,15 @@ export default App;
- **`value`** string | number
The value of the counter. Should be
less than `max` and greater than `min`
- If no value, initial value is set to `""`
+If no value, initial value is set to `""`
- **`keepWithinRange`** boolean
This controls the value update
behavior in general.
- - If `true` and you use the stepper or up/down arrow keys, the value will not
- exceed the `max` or go lower than `min`
-
- - If `false`, the value will be allowed to go out of range.
+- If `true` and you use the stepper or up/down arrow keys, the value will not
+ exceed the `max` or go lower than `min`
+- If `false`, the value will be allowed to go out of range.
- **`min`** number
The minimum value of the counter
- **`max`** number
The maximum value of the counter
- **`step`** number
The step used to increment or decrement the
@@ -88,8 +87,7 @@ export default App;
- **`precision`** number
The number of decimal points used to round
the value
- If no precision, initial value is from the decimal places from value/step -
- `0`
+If no precision, initial value is from the decimal places from value/step - `0`
- **`defaultValue`** string | number | undefined
The initial value
of the counter. Should be less than `max` and greater than `min`
@@ -119,15 +117,14 @@ value will change based on mouse wheel
- **`keepWithinRange`** boolean
This controls the value update
behavior in general.
- - If `true` and you use the stepper or up/down arrow keys, the value will not
- exceed the `max` or go lower than `min`
-
- - If `false`, the value will be allowed to go out of range.
+- If `true` and you use the stepper or up/down arrow keys, the value will not
+ exceed the `max` or go lower than `min`
+- If `false`, the value will be allowed to go out of range.
- **`value`** string | number
The value of the counter. Should be
less than `max` and greater than `min`
- If no value, initial value is set to `""`
+If no value, initial value is set to `""`
- **`min`** number
The minimum value of the counter
- **`max`** number
The maximum value of the counter
@@ -161,11 +158,10 @@ form elements. In this case, only `aria-disabled` will be set.
- **`keepWithinRange`** boolean
This controls the value update
behavior in general.
- - If `true` and you use the stepper or up/down arrow keys, the value will not
- exceed the `max` or go lower than `min`
-
- - If `false`, the value will be allowed to go out of range.
+- If `true` and you use the stepper or up/down arrow keys, the value will not
+ exceed the `max` or go lower than `min`
+- If `false`, the value will be allowed to go out of range.
- **`isAtMin`** boolean
Truw, if value is equal to min.
- **`focusInput`** () => void
Focus input if focus input on
value change is `true`
@@ -188,11 +184,10 @@ form elements. In this case, only `aria-disabled` will be set.
- **`keepWithinRange`** boolean
This controls the value update
behavior in general.
- - If `true` and you use the stepper or up/down arrow keys, the value will not
- exceed the `max` or go lower than `min`
-
- - If `false`, the value will be allowed to go out of range.
+- If `true` and you use the stepper or up/down arrow keys, the value will not
+ exceed the `max` or go lower than `min`
+- If `false`, the value will be allowed to go out of range.
- **`isAtMax`** boolean
True, if value is equal to max.
- **`focusInput`** () => void
Focus input if focus input on
value change is `true`
diff --git a/docs/pagination.md b/docs/pagination.md
index 7a0cb35b8..051f1d0e0 100644
--- a/docs/pagination.md
+++ b/docs/pagination.md
@@ -77,7 +77,7 @@ export const App = props => {
export default App;
```
-[Pagination - Open On Sandbox](https://codesandbox.io/s/cwuhv)
+[Pagination - Open On Sandbox](https://codesandbox.io/s/p92pq)
## Accessibility Requirement
diff --git a/docs/picker-base.md b/docs/picker-base.md
index e1858b636..333db3754 100644
--- a/docs/picker-base.md
+++ b/docs/picker-base.md
@@ -41,7 +41,7 @@ export const App = props => {
export default App;
```
-[PickerBase - Open On Sandbox](https://codesandbox.io/s/h7pxf)
+[PickerBase - Open On Sandbox](https://codesandbox.io/s/ocnie)
## Composition
diff --git a/docs/progress.md b/docs/progress.md
index e73097985..418da7dcd 100644
--- a/docs/progress.md
+++ b/docs/progress.md
@@ -150,9 +150,9 @@ const indeterminateStyles = css({
});
```
-[Progress Circular - Open On Sandbox](https://codesandbox.io/s/e3eun)
+[Progress Circular - Open On Sandbox](https://codesandbox.io/s/n1nyq)
-[Progress Linear- Open On Sandbox](https://codesandbox.io/s/0p2yo)
+[Progress Linear- Open On Sandbox](https://codesandbox.io/s/veo6j)
## Accessibility Requirement
@@ -170,7 +170,7 @@ const indeterminateStyles = css({
- **`value`** number | null
The `value` of the progress indicator.
- If `null` the progress bar will be in `indeterminate` state
+If `null` the progress bar will be in `indeterminate` state
- **`min`** number
The minimum value of the progress
- **`max`** number
The maximum value of the
@@ -182,7 +182,7 @@ const indeterminateStyles = css({
- **`value`** number | null
The `value` of the progress indicator.
- If `null` the progress bar will be in `indeterminate` state
+If `null` the progress bar will be in `indeterminate` state
- **`min`** number
The minimum value of the progress
- **`max`** number
The maximum value of the
diff --git a/docs/segment.md b/docs/segment.md
index 30f0ef3b4..99527891b 100644
--- a/docs/segment.md
+++ b/docs/segment.md
@@ -42,7 +42,7 @@ export const App = props => {
export default App;
```
-[Segment - Open On Sandbox](https://codesandbox.io/s/3wjgt)
+[Segment - Open On Sandbox](https://codesandbox.io/s/629us)
## Composition
diff --git a/docs/select.md b/docs/select.md
index 0e8ce0e04..137d853df 100644
--- a/docs/select.md
+++ b/docs/select.md
@@ -54,7 +54,7 @@ export const App = props => {
export default App;
```
-[Select - Open On Sandbox](https://codesandbox.io/s/mfpy7)
+[Select - Open On Sandbox](https://codesandbox.io/s/zszcn)
## Props
diff --git a/docs/slider.md b/docs/slider.md
index 47d895270..0c7e8936b 100644
--- a/docs/slider.md
+++ b/docs/slider.md
@@ -144,7 +144,7 @@ export const App = args => {
export default App;
```
-[Slider - Open On Sandbox](https://codesandbox.io/s/eng7z)
+[Slider - Open On Sandbox](https://codesandbox.io/s/mp22z)
## Accessibility Requirement
@@ -163,7 +163,7 @@ export default App;
- **`values`** number[]
The `value` of the slider indicator.
- If `undefined`/`not valid` the slider bar will be the optimum of min & max
+If `undefined`/`not valid` the slider bar will be the optimum of min & max
- **`min`** number
The minimum value of the slider
- **`max`** number
The maximum value of the slider
@@ -262,7 +262,7 @@ export default App;
- **`values`** number[]
The `value` of the slider indicator.
- If `undefined`/`not valid` the slider bar will be the optimum of min & max
+If `undefined`/`not valid` the slider bar will be the optimum of min & max
- **`isDisabled`** boolean
If `true`, the slider will be disabled
- **`orientation`** "horizontal" | "vertical"
diff --git a/docs/timepicker.md b/docs/timepicker.md
index 7a035a2f5..5e79d3040 100644
--- a/docs/timepicker.md
+++ b/docs/timepicker.md
@@ -116,7 +116,7 @@ export const App = props => {
export default App;
```
-[TimePicker - Open On Sandbox](https://codesandbox.io/s/jph5c)
+[TimePicker - Open On Sandbox](https://codesandbox.io/s/vymtn)
## Composition
diff --git a/docs/toast.md b/docs/toast.md
index 798d9f9ad..49ebf6f21 100644
--- a/docs/toast.md
+++ b/docs/toast.md
@@ -53,6 +53,6 @@ export const App = () => {
export default App;
```
-[Toast CSS Animated - Open On Sandbox](https://codesandbox.io/s/i0emy)
+[Toast - Open On Sandbox](https://codesandbox.io/s/2fbm9)
-[Toast - Open On Sandbox](https://codesandbox.io/s/l2i1y)
+[Toast CSS Animated - Open On Sandbox](https://codesandbox.io/s/8vkcv)
diff --git a/scripts/utils/inject-csb-links.js b/scripts/utils/inject-csb-links.js
index 70d4584ec..7fea194ec 100644
--- a/scripts/utils/inject-csb-links.js
+++ b/scripts/utils/inject-csb-links.js
@@ -22,17 +22,19 @@ const injectCsbLinks = async docsTemplate => {
const linkTitle = parsed.link_title || "Open On CodeSandbox";
const sandboxLink = await getSandboxShortURL(parsed);
-
- docsTemplate = docsTemplate.replace(
- CODESANDBOX_REPLACE_FLAG,
- `[${linkTitle}](${sandboxLink})`,
- );
+ return { sandboxLink, linkTitle };
} catch (e) {
console.log(e);
}
});
- await Promise.all(promises);
+ const result = await Promise.allSettled(promises);
+ result.forEach(({ value: { sandboxLink, linkTitle } }) => {
+ docsTemplate = docsTemplate.replace(
+ CODESANDBOX_REPLACE_FLAG,
+ `[${linkTitle}](${sandboxLink})`,
+ );
+ });
return docsTemplate;
};