Skip to content

Commit 75c1522

Browse files
tay1orjoneskodiakhq[bot]
andauthoredFeb 10, 2022
docs(progressindicator): migrate docs from info addon to .mdx docs (#10703)
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
1 parent 6f5bca3 commit 75c1522

File tree

2 files changed

+31
-27
lines changed

2 files changed

+31
-27
lines changed
 

‎packages/react/src/components/ProgressIndicator/ProgressIndicator-story.js

-26
Original file line numberDiff line numberDiff line change
@@ -87,16 +87,6 @@ export const Default = () => (
8787
</ProgressIndicator>
8888
);
8989

90-
Default.parameters = {
91-
info: {
92-
text: `
93-
For React usage, ProgressIndicator holds the currentIndex state to indicate which ProgressStep is the current step. The ProgressIndicator component should always be used with ProgressStep components as its children. Changing currentIndex prop will automatically set the ProgressStep components props (complete, incomplete, current).
94-
For general usage, Progress Indicators display steps in a process. It should indicate when steps have been complete, the active step,
95-
and the steps to come.
96-
`,
97-
},
98-
};
99-
10090
export const Interactive = () => (
10191
<ProgressIndicator
10292
currentIndex={number('Current progress (currentIndex)', 1)}
@@ -133,22 +123,6 @@ export const Interactive = () => (
133123

134124
Interactive.storyName = 'interactive';
135125

136-
Interactive.parameters = {
137-
info: {
138-
text: `
139-
If you register an onChange handler, the Progress Indicator will become interactive. Your parent component should update the currentIndex prop within the onChange handler.
140-
`,
141-
},
142-
};
143-
144126
export const Skeleton = () => <ProgressIndicatorSkeleton />;
145127

146128
Skeleton.storyName = 'skeleton';
147-
148-
Skeleton.parameters = {
149-
info: {
150-
text: `
151-
Placeholder skeleton state to use when content is loading.
152-
`,
153-
},
154-
};

‎packages/react/src/components/ProgressIndicator/ProgressIndicator.mdx

+31-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Props } from '@storybook/addon-docs/blocks';
1+
import { Story, Preview, Props } from '@storybook/addon-docs/blocks';
22

33
# ProgressIndicator
44

@@ -10,8 +10,38 @@ import { Props } from '@storybook/addon-docs/blocks';
1010

1111
## Table of Contents
1212

13+
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
14+
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
15+
16+
## Table of Contents
17+
18+
- [ProgressIndicator](#progressindicator)
19+
- [Table of Contents](#table-of-contents)
20+
- [Overview](#overview)
21+
- [Component API](#component-api)
22+
- [Feedback](#feedback)
23+
24+
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
25+
1326
## Overview
1427

28+
<Preview>
29+
<Story id="components-progressindicator--default" />
30+
</Preview>
31+
32+
For React usage, `ProgressIndicator` holds the `currentIndex` state to indicate
33+
which `ProgressStep` is the current step. The `ProgressIndicator` component
34+
should always be used with `ProgressStep` components as its children.
35+
36+
Changing the `currentIndex` prop will automatically set the `ProgressStep`
37+
components props (`complete`, `incomplete`, `current`). For general usage,
38+
Progress Indicators display steps in a process. It should indicate when steps
39+
have been complete, the active step, and the steps to come.
40+
41+
If you register an `onChange` handler, the Progress Indicator will become
42+
interactive. Your parent component should update the `currentIndex` prop within
43+
the `onChange` handler.
44+
1545
## Component API
1646

1747
<Props />

0 commit comments

Comments
 (0)
Please sign in to comment.