create table elements documentation

platform/ui/src/components/Table/Table.mdx

@@ -14,7 +14,7 @@ Tables display sets of data.
 ## Import
 
 ```javascript
-import { Table } from '@ohfi/ui';
+import { Table } from '@ohif/ui';
 ```
 
 ## Basic usage
@@ -94,7 +94,7 @@ import { Table } from '@ohfi/ui';
 
 Table has full width by default. If you want to change its width, you will have
 to set the `fullWidth` prop to `false` and then define your own table width by
-passing a `className` or by `style`.
+passing a `className` or `style`.
 
 ## Table components
 

platform/ui/src/components/TableBody/TableBody.mdx

@@ -0,0 +1,36 @@
+---
+name: Table Body
+menu: Components
+route: components/table-body
+---
+
+import { Playground, Props, Link } from 'docz';
+import { TableBody } from '@ohif/ui';
+
+# Table Body
+
+## Import
+
+```javascript
+import { TableBody } from '@ohif/ui';
+```
+
+## Basic usage
+
+<div>
+  For examples on how to use the table elements, go to the <Link className="text-blue-500 underline" to="components/table">Table</Link> page.
+</div>
+
+## Table components
+
+<Link to="components/table-head">TableHead</Link>
+<br />
+<Link to="components/table-body">TableBody</Link>
+<br />
+<Link to="components/table-row">TableRow</Link>
+<br />
+<Link to="components/table-cell">TableCell</Link>
+
+## Properties
+
+<Props of={TableBody} />

platform/ui/src/components/TableCell/TableCell.mdx

@@ -0,0 +1,36 @@
+---
+name: Table Cell
+menu: Components
+route: components/table-cell
+---
+
+import { Playground, Props, Link } from 'docz';
+import { TableCell } from '@ohif/ui';
+
+# Table Cell
+
+## Import
+
+```javascript
+import { TableCell } from '@ohif/ui';
+```
+
+## Basic usage
+
+<div>
+  For examples on how to use the table elements, go to the <Link className="text-blue-500 underline" to="components/table">Table</Link> page.
+</div>
+
+## Table components
+
+<Link to="components/table-head">TableHead</Link>
+<br />
+<Link to="components/table-body">TableBody</Link>
+<br />
+<Link to="components/table-row">TableRow</Link>
+<br />
+<Link to="components/table-cell">TableCell</Link>
+
+## Properties
+
+<Props of={TableCell} />

platform/ui/src/components/TableHead/TableHead.mdx

@@ -0,0 +1,36 @@
+---
+name: Table Head
+menu: Components
+route: components/table-head
+---
+
+import { Playground, Props, Link } from 'docz';
+import { TableHead } from '@ohif/ui';
+
+# Table Head
+
+## Import
+
+```javascript
+import { TableHead } from '@ohif/ui';
+```
+
+## Basic usage
+
+<div>
+  For examples on how to use the table elements, go to the <Link className="text-blue-500 underline" to="components/table">Table</Link> page.
+</div>
+
+## Table components
+
+<Link to="components/table-head">TableHead</Link>
+<br />
+<Link to="components/table-body">TableBody</Link>
+<br />
+<Link to="components/table-row">TableRow</Link>
+<br />
+<Link to="components/table-cell">TableCell</Link>
+
+## Properties
+
+<Props of={TableHead} />

platform/ui/src/components/TableRow/TableRow.mdx

@@ -0,0 +1,36 @@
+---
+name: Table Row
+menu: Components
+route: components/table-row
+---
+
+import { Playground, Props, Link } from 'docz';
+import { TableRow } from '@ohif/ui';
+
+# Table Row
+
+## Import
+
+```javascript
+import { TableRow } from '@ohif/ui';
+```
+
+## Basic usage
+
+<div>
+  For examples on how to use the table elements, go to the <Link className="text-blue-500 underline" to="components/table">Table</Link> page.
+</div>
+
+## Table components
+
+<Link to="components/table-head">TableHead</Link>
+<br />
+<Link to="components/table-body">TableBody</Link>
+<br />
+<Link to="components/table-row">TableRow</Link>
+<br />
+<Link to="components/table-cell">TableCell</Link>
+
+## Properties
+
+<Props of={TableRow} />