Migrate component examples and docs to embedded GitLab UI stories
With #1175 (closed) closed, we now have a way to embed GitLab UI stories in design.gitlab.com: https://gitlab.com/gitlab-org/gitlab-services/design.gitlab.com/-/blob/main/doc/embed-gitlab-ui-stories.md.
The initial implementation migrated alerts and banners to use this new approach, but several other pages are still using legacy examples and implementation tabs. Let's migrate remaining pages, the only pre-requisite being that the corresponding GitLab UI component(s) must have been migrated to the Component Story Format (gitlab-org&5651 (closed)).
Migration steps
-
In the .md
file:-
Migrate the vueComponents
property tostories
in the frontmatter. -
Migrate [[Example:*]]
tags to[[Story:*]]
tags.
diff --git a/contents/components/accordion.md b/contents/components/accordion.md index 62da0f1..19fcdb2 100644 --- a/contents/components/accordion.md +++ b/contents/components/accordion.md @@ -1,8 +1,8 @@ --- name: Accordion description: An accordion is used to show and hide content. -vueComponents: - - GlAccordion +stories: + - base-accordion--default related: - modal - tree @@ -11,7 +11,7 @@ related: ## Examples -[[Example:accordion-basic]] +[[Story:base-accordion--default]] [View in Pajamas UI Kit →](https://www.figma.com/file/qEddyqCrI7kPSBjGmwkZzQ/Pajamas-UI-Kit?node-id=425%3A0)
-
-
Remove the associated examples from the examples/
directory.
Migration status
Component | Can be migrated | Migrated |
---|---|---|
accordion | ||
alert | ||
avatar | ||
badge | ||
banner | ||
breadcrumb | ||
broadcast-message | ||
button | ||
card | ||
checkbox | ||
color-picker | ||
date-picker | ||
drawer | ||
dropdown | ||
file-uploader | ||
filter | ||
form | ||
infinite-scroll | ||
label | ||
list | ||
modal | ||
pagination | ||
path | ||
popover | ||
progress-bar | ||
radio-button | ||
search | ||
segmented-control | ||
skeleton-loader | ||
socks | ||
sorting | ||
spinner | ||
table | ||
tabs | ||
toast | ||
toggle | ||
token | ||
tooltip | ||
tree | ||
empty-states |
Edited by Paul Gascou-Vaillancourt