[terra-table] Merge Feature Branch into Main

packages/terra-core-docs/CHANGELOG.md

@@ -2,6 +2,10 @@
 
 ## Unreleased
 
+* Changed
+  * Changed Terra Table examples to be more applicable to new table.
+  * Deleted examples of Terra Outline View Table as it is an obsolete package.
+
 * Updated
   * Updated `terra-alert` documentation for custom titles.
 

packages/terra-core-docs/package.json

@@ -36,6 +36,7 @@
   },
   "dependencies": {
     "@cerner/terra-docs": "^1.9.0",
+    "legacy-terra-table": "npm:terra-table@^4.36.0",
     "moment": "^2.29.4",
     "terra-action-footer": "^2.65.0",
     "terra-action-header": "^2.84.0",

packages/terra-core-docs/src/terra-dev-site/doc/table/About.1.doc.mdx

@@ -1,11 +1,7 @@
-import { Badge } from 'terra-table/package.json?dev-site-package';
-import Default from './example/DefaultTable?dev-site-example';
-import CompactPaddingTable from './example/CompactPaddingTable?dev-site-example';
-import StandardPaddingTable from './example/StandardPaddingTable?dev-site-example';
-import StripedTable from './example/StripedTable?dev-site-example';
-import CustomHeaderFooterNodeTable from './example/CustomHeaderFooterNodeTable?dev-site-example';
-import ScrollingTable from './example/ScrollingTable?dev-site-example';
-import PropsTable from 'terra-table/lib/Table?dev-site-props-table';
+import { Badge } from "terra-table/package.json?dev-site-package";
+import DefaultTable from "./DefaultTable?dev-site-example";
+
+import TablePropsTable from "terra-table/lib/Table?dev-site-props-table";
 
 <Badge />
 
@@ -19,45 +15,36 @@ Terra Table is a structural component used to create data tables. Table provides
   - `npm install terra-table`
 
 <!-- AUTO-GENERATED-CONTENT:START Peer Dependencies -->
+
 ## Peer Dependencies
 
 This component requires the following peer dependencies be installed in your app for the component to properly function.
 
 | Peer Dependency | Version |
-|-|-|
-| react | ^16.8.5 |
-| react-dom | ^16.8.5 |
-| react-intl | ^2.8.0 |
+| --------------- | ------- |
+| react           | ^16.8.5 |
+| react-dom       | ^16.8.5 |
+| react-intl      | ^2.8.0  |
 
 <!-- AUTO-GENERATED-CONTENT:END -->
 
 ## Usage
 
 ```jsx
-import Table from 'terra-table';
+import Table from "terra-table";
 ```
 
 ## Component Features
 
- * [Cross-Browser Support](https://engineering.cerner.com/terra-ui/about/terra-ui/component-standards#cross-browser-support)
- * [Responsive Support](https://engineering.cerner.com/terra-ui/about/terra-ui/component-standards#responsive-support)
- * [Mobile Support](https://engineering.cerner.com/terra-ui/about/terra-ui/component-standards#mobile-support)
- * [LTR/RTL Support](https://engineering.cerner.com/terra-ui/about/terra-ui/component-standards#ltr--rtl)
+- [Cross-Browser Support](https://engineering.cerner.com/terra-ui/about/terra-ui/component-standards#cross-browser-support)
+- [Responsive Support](https://engineering.cerner.com/terra-ui/about/terra-ui/component-standards#responsive-support)
+- [Mobile Support](https://engineering.cerner.com/terra-ui/about/terra-ui/component-standards#mobile-support)
+- [LTR/RTL Support](https://engineering.cerner.com/terra-ui/about/terra-ui/component-standards#ltr--rtl)
 
-# Examples
+# Default Table
 
 <DefaultTable />
 
-<StandardPaddingTable />
-
-<CompactPaddingTable />
-
-<StripedTable title="Striped Table, No Padding Table" description="(Note: the no padding style table is intended for tables with custom cell content that includes it's own internal spacing)" />
-
-<CustomHeaderFooterNodeTable description="Additional toolbars can be placed above and/or below (e.g. pagination) any table to enhance usability:" />
-
-<ScrollingTable />
-
 ## Table Props
 
-<PropsTable />
+<TablePropsTable />

packages/terra-core-docs/src/terra-dev-site/doc/table/ChangeLog.6.doc.mdx

@@ -1,5 +1,5 @@
-import { Badge } from 'terra-table/package.json?dev-site-package';
-import ChangeLog from 'terra-table/CHANGELOG.md';
+import { Badge } from "terra-table/package.json?dev-site-package";
+import ChangeLog from "terra-table/CHANGELOG.md";
 
 <Badge />
 

packages/terra-core-docs/src/terra-dev-site/doc/table/DefaultTable.jsx

@@ -0,0 +1,62 @@
+import React from 'react';
+import Table from 'terra-table';
+
+const tableData = {
+  cols: [
+    { id: 'Column-0', displayName: 'Patient', isResizable: true },
+    { id: 'Column-1', displayName: 'Location' },
+    { id: 'Column-2', displayName: 'Illness Severity' },
+    { id: 'Column-3', displayName: 'Visit' },
+    { id: 'Column-4', displayName: 'Allergy' },
+    { id: 'Column-5', displayName: 'Primary Contact' },
+    { id: 'Column-6', displayName: 'Generic Order Counts' },
+    { id: 'Column-7', displayName: 'Patient Age' },
+    { id: 'Column-8', displayName: 'Medication History' },
+    { id: 'Column-9', displayName: 'My Relationship' },
+    { id: 'Column-10', displayName: 'Not Selectable' },
+  ],
+  rows: [
+    {
+      id: '1',
+      cells: [
+        { content: 'Fleck, Arthur' },
+        { content: '1007-MTN' },
+        { content: 'Unstable' },
+        { content: 'Inpatient, 2 months' },
+        { content: '' },
+        { content: 'Quinzell, Harleen' },
+        { content: '' },
+        { isMasked: true },
+        { isMasked: true },
+        { content: 'Admitting Physician' },
+        { content: '' },
+      ],
+    },
+    {
+      id: '2',
+      cells: [
+        { content: 'Wayne, Bruce' },
+        { content: '1007-MTN-DR' },
+        { content: 'Stable' },
+        { content: 'Outpatient, 2 days' },
+        { content: 'Phytochemicals' },
+        { content: 'Grayson, Richard' },
+        { content: '' },
+        { content: '' },
+        { isMasked: true },
+        { content: 'Admitting Physician' },
+        { content: '' },
+      ],
+    },
+  ],
+};
+
+const DefaultTable = () => (
+  <Table
+    id="my-table-id"
+    overflowColumns={tableData.cols}
+    rows={tableData.rows}
+  />
+);
+
+export default DefaultTable;

packages/terra-core-docs/src/terra-dev-site/doc/table/Examples/PinnedColumns.2.doc.mdx

@@ -0,0 +1,41 @@
+import { Badge } from "terra-table/package.json?dev-site-package";
+import PinnedColumnsTable from "./PinnedColumnsTable?dev-site-example";
+
+import TablePropsTable from "terra-table/lib/Table?dev-site-props-table";
+
+<Badge />
+
+# Pinned Columns Table
+
+Terra Table is a structural component used to create data tables. Table provides means to handle row selection and hooks for sortable columns.
+
+## Getting Started
+
+- Install with [npmjs](https://www.npmjs.com):
+  - `npm install terra-table`
+
+<!-- AUTO-GENERATED-CONTENT:START Peer Dependencies -->
+
+## Peer Dependencies
+
+This component requires the following peer dependencies be installed in your app for the component to properly function.
+
+| Peer Dependency | Version |
+| --------------- | ------- |
+| react           | ^16.8.5 |
+| react-dom       | ^16.8.5 |
+| react-intl      | ^2.8.0  |
+
+<!-- AUTO-GENERATED-CONTENT:END -->
+
+## Usage
+
+```jsx
+import Table from "terra-table";
+```
+
+<PinnedColumnsTable />
+
+## Table Props
+
+<TablePropsTable />

packages/terra-core-docs/src/terra-dev-site/doc/table/Examples/PinnedColumnsTable.jsx

@@ -0,0 +1,63 @@
+import React from 'react';
+import Table from 'terra-table';
+
+const tableData = {
+  cols: [
+    { id: 'Column-0', displayName: 'Patient' },
+    { id: 'Column-1', displayName: 'Location' },
+    { id: 'Column-2', displayName: 'Illness Severity' },
+    { id: 'Column-3', displayName: 'Visit' },
+    { id: 'Column-4', displayName: 'Allergy' },
+    { id: 'Column-5', displayName: 'Primary Contact' },
+    { id: 'Column-6', displayName: 'Generic Order Counts' },
+    { id: 'Column-7', displayName: 'Patient Age' },
+    { id: 'Column-8', displayName: 'Medication History' },
+    { id: 'Column-9', displayName: 'My Relationship' },
+    { id: 'Column-10', displayName: 'Not Selectable' },
+  ],
+  rows: [
+    {
+      id: '1',
+      cells: [
+        { content: 'Fleck, Arthur' },
+        { content: '1007-MTN' },
+        { content: 'Unstable' },
+        { content: 'Inpatient, 2 months' },
+        { content: '' },
+        { content: 'Quinzell, Harleen' },
+        { content: '' },
+        { isMasked: true },
+        { isMasked: true },
+        { content: 'Admitting Physician' },
+        { content: '' },
+      ],
+    },
+    {
+      id: '2',
+      cells: [
+        { content: 'Wayne, Bruce' },
+        { content: '1007-MTN-DR' },
+        { content: 'Stable' },
+        { content: 'Outpatient, 2 days' },
+        { content: 'Phytochemicals' },
+        { content: 'Grayson, Richard' },
+        { content: '' },
+        { content: '' },
+        { isMasked: true },
+        { content: 'Admitting Physician' },
+        { content: '' },
+      ],
+    },
+  ],
+};
+
+const PinnedColumnsTable = () => (
+  <Table
+    id="my-table-id"
+    pinnedColumns={tableData.cols.slice(0, 2)}
+    overflowColumns={tableData.cols.slice(2)}
+    rows={tableData.rows}
+  />
+);
+
+export default PinnedColumnsTable;

packages/terra-core-docs/src/terra-dev-site/doc/table/Examples/SortableTable.3.doc.mdx

@@ -0,0 +1,48 @@
+import { Badge } from "terra-table/package.json?dev-site-package";
+import SortableTable from "./SortableTable?dev-site-example";
+
+import TablePropsTable from "terra-table/lib/Table?dev-site-props-table";
+
+<Badge />
+
+# Sortable Table
+
+Terra Table is a structural component used to create data tables. Table provides means to handle row selection and hooks for sortable columns.
+
+## Getting Started
+
+- Install with [npmjs](https://www.npmjs.com):
+  - `npm install terra-table`
+
+<!-- AUTO-GENERATED-CONTENT:START Peer Dependencies -->
+
+## Peer Dependencies
+
+This component requires the following peer dependencies be installed in your app for the component to properly function.
+
+| Peer Dependency | Version |
+| --------------- | ------- |
+| react           | ^16.8.5 |
+| react-dom       | ^16.8.5 |
+| react-intl      | ^2.8.0  |
+
+<!-- AUTO-GENERATED-CONTENT:END -->
+
+## Usage
+
+```jsx
+import Table from "terra-table";
+```
+
+## Component Features
+
+- [Cross-Browser Support](https://engineering.cerner.com/terra-ui/about/terra-ui/component-standards#cross-browser-support)
+- [Responsive Support](https://engineering.cerner.com/terra-ui/about/terra-ui/component-standards#responsive-support)
+- [Mobile Support](https://engineering.cerner.com/terra-ui/about/terra-ui/component-standards#mobile-support)
+- [LTR/RTL Support](https://engineering.cerner.com/terra-ui/about/terra-ui/component-standards#ltr--rtl)
+
+<SortableTable />
+
+## Table Props
+
+<TablePropsTable />