diff --git a/docs/ProjectTemplates.mdx b/docs/ProjectTemplates.mdx index 6314a1f196d..6bd1ec52a08 100644 --- a/docs/ProjectTemplates.mdx +++ b/docs/ProjectTemplates.mdx @@ -1,9 +1,18 @@ -import { Footer, LabelWithWrapping, ProjectTemplate, TableOfContent } from '@sb/components'; +import { Footer, ProjectTemplate, TableOfContent } from '@sb/components'; import NextLogo from '@sb/images/logo-nextjs.svg'; import ReactRouterLogo from '@sb/images/logo-react-router.svg'; import ViteLogo from '@sb/images/logo-vitejs.svg'; import { Meta } from '@storybook/addon-docs/blocks'; import { FlexBox, FlexBoxJustifyContent, FlexBoxWrap, Label } from '@ui5/webcomponents-react'; +import projectTemplates from './project-templates.json'; + +export const logos = { + nextjs: NextLogo, + vite: ViteLogo, + 'react-router': ReactRouterLogo, +}; + +export const repoBase = 'https://github.com/UI5/webcomponents-react/tree/main/'; @@ -18,34 +27,21 @@ A curated list of minimal project templates and examples to get started using UI
- - - + {projectTemplates + .filter((t) => t.type === 'template') + .map((t) => ( + + ))} ## Examples @@ -53,78 +49,30 @@ A curated list of minimal project templates and examples to get started using UI
- - - - - - - - - - - - + {projectTemplates + .filter((t) => t.type === 'example') + .map((t) => ( + + {t.features && ( + + )} + + ))}