updated carousel docs.

apps/website/src/pages/docs/carousel.mdx

@@ -14,8 +14,6 @@ import * as AllExamples from 'examples';
 
 <p>{frontmatter.description}</p>
 
-<Placeholder componentPageName='core--carousel' />
-
 <LiveExample src='Carousel.main.tsx'>
   <AllExamples.CarouselMainExample client:load />
 </LiveExample>
@@ -27,24 +25,22 @@ The currently shown slide can also be changed using the left/right arrow keys or
 
 ## Usage
 
+### Controlled State
+
 Carousels can be controlled externally by using the properties `activeSlideIndex` and `onSlideChange`.
 
 <LiveExample src='Carousel.controlled.tsx'>
   <AllExamples.CarouselControlledExample client:load />
 </LiveExample>
 
-The subcomponents can be used outside of Carousel. The following example shows how `Carousel.DotsList` can be used without the `Carousel` component. Clicking on the right half of the slide will advance the carousel to the next slide, whereas clicking on the left half will go to the previous slide.
+### Only Dots
+
+`Carousel.DotsList` can be used without the `Carousel` component. Clicking on the right half of the slide will advance the carousel to the next slide, whereas clicking on the left half will go to the previous slide.
 
 <LiveExample src='Carousel.onlyDots.tsx'>
   <AllExamples.CarouselOnlyDotsExample client:load />
 </LiveExample>
 
-## Props
-
-Properties table is to be defined.
-
-<PropsTable path={frontmatter.propsPath} />
-
 ## Subcomponents
 
 This component uses a composition approach so it should be used with the provided subcomponents.
@@ -76,3 +72,9 @@ The `Carousel.DotsList` component shows a list of `Carousel.Dot` components whic
 `Carousel.Dot` is the actual "dot" component used to activate a slide on clicking. It should be used as a child of `Carousel.Dots`.
 
 <PropsTable path={'@itwin/itwinui-react/esm/core/Carousel/CarouselDot.d.ts'} />
+
+## Props
+
+Properties table is to be defined.
+
+<PropsTable path={frontmatter.propsPath} />