chore(documentation): add react components package docs

.changeset/nasty-plants-shop.md

@@ -0,0 +1,5 @@
+---
+'@swisspost/design-system-components': patch
+---
+
+Added documentation for the `design-system-components-react` package

packages/documentation/src/stories/packages/components-react/components-react.docs.mdx

@@ -0,0 +1,46 @@
+import { Meta, Source } from '@storybook/blocks';
+import * as PackageStories from './components-react.stories';
+import ReactAppModuleSample from './react-app-module.sample.ts?raw';
+import changelog from '@/../../components-react/CHANGELOG.md?raw';
+import PackageDocs from '@/shared/packages-docs-layout.mdx';
+
+<Meta of={PackageStories} />
+
+# @swisspost/design-system-components-react
+
+[![npm version](https://badge.fury.io/js/@swisspost%2Fdesign-system-components-react.svg)](https://badge.fury.io/js/@swisspost%2Fdesign-system-components-react)
+
+<div className="lead">The Design System React Components, ready for use in your React project.</div>
+
+<PackageDocs changelog={changelog}>
+  ## Dependencies
+
+  <div className="table-responsive table-fit-content text-start">
+    <table aria-describedby="dependencies" className="table">
+      <thead>
+        <tr>
+          <th scope="col">Version</th>
+          <th scope="col">React</th>
+        </tr>
+      </thead>
+
+      <tbody>
+        <tr>
+          <th scope="row">9.x</th>
+          <td>18.x</td>
+        </tr>
+      </tbody>
+    </table>
+
+  </div>
+
+## Installation
+
+<Source code={`npm install @swisspost/design-system-components-react`} language="bash" />
+
+## Usage
+
+Importing the components to your project.
+
+<Source code={ReactAppModuleSample} language="typescript" />
+</PackageDocs>

packages/documentation/src/stories/packages/components-react/components-react.stories.ts

@@ -0,0 +1,16 @@
+import { StoryObj } from '@storybook/web-components';
+import { MetaExtended } from '@root/types';
+
+const meta: MetaExtended = {
+  id: '13b9c7f1-993d-4348-a3b7-a7ceb92fd5c7',
+  title: 'Packages/Components for React',
+  parameters: {
+    badges: [],
+  },
+};
+
+export default meta;
+
+type Story = StoryObj;
+
+export const Default: Story = {};

packages/documentation/src/stories/packages/components-react/react-app-module.sample.ts

@@ -0,0 +1,11 @@
+// app.tsx
+
+import { PostComponent } from '@swisspost/design-system-components-react';
+
+function App() {
+  return (
+    <>
+      <PostComponent>My component content</PostComponent>
+    </>
+  );
+}