From 9e604a18ef914090301b4d0cd0b602f646f5719c Mon Sep 17 00:00:00 2001
From: ling1726 <lingfangao@hotmail.com>
Date: Fri, 9 Sep 2022 15:51:50 +0200
Subject: [PATCH] chore: Add preview warning for Table component (#24731)

* chore: Add preview warning for Table component

Adds a preview warning to the Table component doc page

* changefile
---
 ...t-table-ddcc6b94-4437-438d-bddb-f7ff6a059c7b.json |  7 +++++++
 .../src/stories/Table/TableDescription.md            | 12 ++++++++++++
 .../react-table/src/stories/Table/index.stories.tsx  |  8 ++++++++
 3 files changed, 27 insertions(+)
 create mode 100644 change/@fluentui-react-table-ddcc6b94-4437-438d-bddb-f7ff6a059c7b.json
 create mode 100644 packages/react-components/react-table/src/stories/Table/TableDescription.md

diff --git a/change/@fluentui-react-table-ddcc6b94-4437-438d-bddb-f7ff6a059c7b.json b/change/@fluentui-react-table-ddcc6b94-4437-438d-bddb-f7ff6a059c7b.json
new file mode 100644
index 00000000000000..bd72b49b018d4c
--- /dev/null
+++ b/change/@fluentui-react-table-ddcc6b94-4437-438d-bddb-f7ff6a059c7b.json
@@ -0,0 +1,7 @@
+{
+  "type": "none",
+  "comment": "chore: Add preview warning for Table component",
+  "packageName": "@fluentui/react-table",
+  "email": "lingfangao@hotmail.com",
+  "dependentChangeType": "none"
+}
diff --git a/packages/react-components/react-table/src/stories/Table/TableDescription.md b/packages/react-components/react-table/src/stories/Table/TableDescription.md
new file mode 100644
index 00000000000000..ceb1ef61112628
--- /dev/null
+++ b/packages/react-components/react-table/src/stories/Table/TableDescription.md
@@ -0,0 +1,12 @@
+<!-- Don't allow prettier to collapse code block into single line -->
+<!-- prettier-ignore -->
+> **⚠️ Preview components are considered unstable:**
+>
+> ```jsx
+>
+> import { Table } from '@fluentui/react-components/unstable';
+>
+> ```
+>
+> - Features and APIs may change before final release
+> - Please contact us if you intend to use this in your product
diff --git a/packages/react-components/react-table/src/stories/Table/index.stories.tsx b/packages/react-components/react-table/src/stories/Table/index.stories.tsx
index 5ca28f8f253ecb..9e4dced7261fb0 100644
--- a/packages/react-components/react-table/src/stories/Table/index.stories.tsx
+++ b/packages/react-components/react-table/src/stories/Table/index.stories.tsx
@@ -1,4 +1,5 @@
 import { Table } from '../..';
+import descriptionMd from './TableDescription.md';
 
 export { Default } from './Default.stories';
 export { Sort } from './Sort.stories';
@@ -19,4 +20,11 @@ export { CompositeNavigationMode } from './CompositeNavigationMode.stories';
 export default {
   title: 'Preview Components/Table',
   component: Table,
+  parameters: {
+    docs: {
+      description: {
+        component: [descriptionMd].join('\n'),
+      },
+    },
+  },
 };