From d9606442423055183f5ec3b0ac01e59598d851f3 Mon Sep 17 00:00:00 2001
From: Leo <36849323+leotoll@users.noreply.github.com>
Date: Fri, 8 May 2020 16:04:42 +0300
Subject: [PATCH] fix: Url for component documentation (#77)

---
 src/carousel/Carousel.js           | 4 ++--
 src/carousel/CarouselArrows.js     | 2 +-
 src/carousel/CarouselDots.js       | 2 +-
 src/carousel/CarouselThumbnails.js | 2 +-
 src/carousel/Lightbox.js           | 2 +-
 src/carousel/MagnifyHint.js        | 2 +-
 src/carousel/Media.js              | 2 +-
 7 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/carousel/Carousel.js b/src/carousel/Carousel.js
index a749bed4..c09ef964 100644
--- a/src/carousel/Carousel.js
+++ b/src/carousel/Carousel.js
@@ -58,8 +58,8 @@ function useSelected(props) {
 /**
  * A grouped display of elements that shows one element at a time, and changes to peer elements by
  * swiping to the left or right, or by clicking arrows on the sides of the component. Generally used
- * as a non-Amp option for the [`CarouselComponent`](/apiReference/carousel%f2MediaCarousel#prop-CarouselComponent)
- * prop within a [`MediaCarousel`](/apiReference/carousel%f2MediaCarousel).
+ * as a non-Amp option for the [`CarouselComponent`](/apiReference/carousel/MediaCarousel#prop-CarouselComponent)
+ * prop within a [`MediaCarousel`](/apiReference/carousel/MediaCarousel).
  */
 const Carousel = React.forwardRef((props, ref) => {
   let {
diff --git a/src/carousel/CarouselArrows.js b/src/carousel/CarouselArrows.js
index e93f1a79..2da47e6f 100644
--- a/src/carousel/CarouselArrows.js
+++ b/src/carousel/CarouselArrows.js
@@ -43,7 +43,7 @@ export const styles = theme => ({
 const useStyles = makeStyles(styles, { name: 'RSFCarouselArrows' })
 
 /**
- * Arrows that are overlaid onto a [`Carousel`](/apiReference/carousel%f2Carousel) that will change
+ * Arrows that are overlaid onto a [`Carousel`](/apiReference/carousel/Carousel) that will change
  * the slide shown when clicked.
  */
 export default function CarouselArrows({ className, classes, selected, count, setSelected }) {
diff --git a/src/carousel/CarouselDots.js b/src/carousel/CarouselDots.js
index ea15b8bd..d9ddb1b2 100644
--- a/src/carousel/CarouselDots.js
+++ b/src/carousel/CarouselDots.js
@@ -43,7 +43,7 @@ const styles = theme => ({
 const useStyles = makeStyles(styles, { name: 'RSFCarouselDots' })
 
 /**
- * An overlay shown at the bottom of a [`Carousel`](/apiReference/carousel%f2Carousel) that shows a
+ * An overlay shown at the bottom of a [`Carousel`](/apiReference/carousel/Carousel) that shows a
  * sequence of dots representing the slides in the Carousel.
  */
 function CarouselDots({ selected, count, classes }) {
diff --git a/src/carousel/CarouselThumbnails.js b/src/carousel/CarouselThumbnails.js
index e49688a5..6a962754 100644
--- a/src/carousel/CarouselThumbnails.js
+++ b/src/carousel/CarouselThumbnails.js
@@ -116,7 +116,7 @@ export const styles = theme => ({
 const useStyles = makeStyles(styles, { name: 'RSFCarouselThumbnails' })
 
 /**
- * A set of thumbnails to show below a [`Carousel`](/apiReference/carousel%f2Carousel). Thumbnails can
+ * A set of thumbnails to show below a [`Carousel`](/apiReference/carousel/Carousel). Thumbnails can
  * be clicked to switch to the given slide. Internally, `CarouselThumbnails` uses MaterialUI's
  * [`Tabs`](https://material-ui.com/api/tabs) component to indicate which slide is selected
  */
diff --git a/src/carousel/Lightbox.js b/src/carousel/Lightbox.js
index f25e236a..1c76b442 100644
--- a/src/carousel/Lightbox.js
+++ b/src/carousel/Lightbox.js
@@ -38,7 +38,7 @@ const useStyles = makeStyles(styles, { name: 'RSFLightbox' })
 
 /**
  * A modal that opens to give a full-screen view of the elements within a
- * [`Carousel`](/apiReference/carousel%f2Carousel).
+ * [`Carousel`](/apiReference/carousel/Carousel).
  */
 function Lightbox({ classes, children, onClose, open, TransitionComponent }) {
   classes = useStyles({ classes })
diff --git a/src/carousel/MagnifyHint.js b/src/carousel/MagnifyHint.js
index 3a792c1d..6f59be96 100644
--- a/src/carousel/MagnifyHint.js
+++ b/src/carousel/MagnifyHint.js
@@ -112,7 +112,7 @@ const styles = theme => ({
 const useStyles = makeStyles(styles, { name: 'RSFMagnifyHint' })
 
 /**
- * An element overlaid on a [`Carousel`](/apiReference/carousel%f2Carousel) that displays a tip for a
+ * An element overlaid on a [`Carousel`](/apiReference/carousel/Carousel) that displays a tip for a
  * user to hover/click the Carousel in order to zoom in.
  */
 export default function MagnifyHint({
diff --git a/src/carousel/Media.js b/src/carousel/Media.js
index 051f7754..24e63749 100644
--- a/src/carousel/Media.js
+++ b/src/carousel/Media.js
@@ -18,7 +18,7 @@ const useStyles = makeStyles(theme => ({
 
 /**
  * An element that determines the proper tag to use for a media node within a
- * [`Carousel`](/apiReference/carousel%f2Carousel).
+ * [`Carousel`](/apiReference/carousel/Carousel).
  */
 export default function Media({
   magnifyProps,