New repo code review

CONRTIBUTING.md

@@ -2,20 +2,20 @@
 
 ## Reporting Bugs
 
-When submitting a new bug report, please first [search](https://github.com/oclif/multi-stage-output/issues) for an existing or similar report & then use one of our existing [issue templates](https://github.com/oclif/multi-stage-output/issues/new/choose) if you believe you've come across a unique problem. Duplicate issues, or issues that don't use one of our templates may get closed without a response.
+When submitting a new bug report, please first [search](https://github.com/oclif/table/issues) for an existing or similar report & then use one of our existing [issue templates](https://github.com/oclif/table/issues/new/choose) if you believe you've come across a unique problem. Duplicate issues, or issues that don't use one of our templates may get closed without a response.
 
 ## Development
 
 **1. Clone this repository...**
 
 ```bash
-$ git clone [email protected]:oclif/multi-stage-output.git
+$ git clone [email protected]:oclif/table.git
 ```
 
 **2. Navigate into project & install development-specific dependencies...**
 
 ```bash
-$ cd ./multi-stage-output && yarn
+$ cd ./table && yarn
 ```
 
 **3. Write some code &/or add some tests...**
@@ -30,7 +30,7 @@ $ cd ./multi-stage-output && yarn
 $ yarn test
 ```
 
-**5. Open a [Pull Request](https://github.com/oclif/multi-stage-output/pulls) for your work & become the newest contributor to `@oclif/multi-stage-output`! 🎉**
+**5. Open a [Pull Request](https://github.com/oclif/table/pulls) for your work & become the newest contributor to `@oclif/table`! 🎉**
 
 ## Pull Request Conventions
 

examples/multiple.ts

@@ -63,6 +63,9 @@ const projects = [
   },
 ]
 
+// Occasionally, if you have two maxWidths that add up to 100% they will stack vertically instead of horizontally.
+// At first I thought this might be when the window has an odd number of pixels, but it seems to be more random than that.
+
 const employeesTable: TableOptions<(typeof employees)[number]> = {
   columns: ['id', 'name', 'age', 'description'],
   data: employees,

examples/orientation.ts

@@ -33,6 +33,27 @@ printTable({
   titleOptions: {bold: true},
 })
 
+// When the vertical orientation table wraps, the "value" does not stay in its column
+// Example (note the "description" column):
+//
+// ──────────────────────────────────────────────────────────────────────────────────────
+// Item        Item 1
+// Description
+// Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor
+// incididunt ut labore et dolore magna aliqua.
+// Url         https://www.example.com/item/1
+//
+// I would expect it to look like this:
+//
+// Example (note the "description" column):
+// ------------------------------------------------
+// Item        Item 1
+// Description Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do
+//             eiusmod tempor incididunt ut labore et dolore magna aliqua.
+// Url         https://www.example.com/item/1
+
+
+
 printTable({
   columns: ['item', 'description', 'url'],
   data,

examples/overflow.ts

@@ -60,6 +60,22 @@ printTable({
   titleOptions: {bold: true},
 })
 
+// I would expect this for wrapping on align-center:
+//
+// Wrap (aligned center)
+// ┌───────┬─────────┬─────┬───────────────────────────────────────────────────────────────────────────┐
+// │  Id   │  Name   │ Age │                                Description                                │
+// ├───────┼─────────┼─────┼───────────────────────────────────────────────────────────────────────────┤
+// │ 36329 │  Alice  │ 20  │  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod  │
+// │       │         │     │            tempor incididunt ut labore et dolore magna aliqua.            │
+// ├───────┼─────────┼─────┼───────────────────────────────────────────────────────────────────────────┤
+// │ 49032 │   Bob   │ 21  │  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod  │
+// │       │         │     │            tempor incididunt ut labore et dolore magna aliqua.            │
+// ├───────┼─────────┼─────┼───────────────────────────────────────────────────────────────────────────┤
+// │ 51786 │ Charlie │ 22  │  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod  │
+// │       │         │     │            tempor incididunt ut labore et dolore magna aliqua.            │
+// └───────┴─────────┴─────┴───────────────────────────────────────────────────────────────────────────┘
+
 printTable({
   columns: ['id', 'name', 'age', 'description'],
   data,
@@ -84,6 +100,22 @@ printTable({
   titleOptions: {bold: true},
 })
 
+// Similar for align-right:
+//
+// Wrap (aligned right)
+// ┌───────┬─────────┬─────┬───────────────────────────────────────────────────────────────────────────┐
+// │    Id │    Name │ Age │                                                               Description │
+// ├───────┼─────────┼─────┼───────────────────────────────────────────────────────────────────────────┤
+// │ 36329 │   Alice │  20 │   Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod │
+// │       │         │     │                       tempor incididunt ut labore et dolore magna aliqua. │
+// ├───────┼─────────┼─────┼───────────────────────────────────────────────────────────────────────────┤
+// │ 49032 │     Bob │  21 │   Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod │
+// │       │         │     │                       tempor incididunt ut labore et dolore magna aliqua. │
+// ├───────┼─────────┼─────┼───────────────────────────────────────────────────────────────────────────┤
+// │ 51786 │ Charlie │  22 │   Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod │
+// │       │         │     │                       tempor incididunt ut labore et dolore magna aliqua. │
+// └───────┴─────────┴─────┴───────────────────────────────────────────────────────────────────────────┘
+
 printTable({
   columns: ['id', 'name', 'age', 'description'],
   data,

examples/sort-and-filter.ts

@@ -1,8 +1,8 @@
 import {printTable} from '../src/index.js'
 
 const data = [
-  {age: 25, id: '10245', name: 'Bob'},
-  {age: 26, id: '10345', name: 'Bill'},
+  {age: 100, id: '10245', name: 'Bob'},
+  {age: 10, id: '10345', name: 'Bill'},
   {age: 30, id: '20245', name: 'Alice'},
   {age: 20, id: '20345', name: 'Amy'},
   {age: 30, id: '30245', name: 'Charlie'},

examples/styles.ts

@@ -33,3 +33,16 @@
   })
   console.log()
 }
+
+printTable({
+  borderStyle: 'all',
+  columns: ['id', {key: 'name', name: 'First Name'}, 'age'],
+  data,
+  headerOptions: {
+    formatter: 'capitalCase',
+  },
+  horizontalAlignment: 'center',
+  title: 'Remove style with "noStyle: true"',
+  titleOptions: {bold: true},
+  noStyle: true,
+})

package.json

@@ -3,10 +3,9 @@
   "description": "Display table in terminal",
   "version": "0.1.10",
   "author": "Salesforce",
-  "bugs": "https://github.com/oclif/multi-stage-output/issues",
+  "bugs": "https://github.com/oclif/table/issues",
   "dependencies": {
     "@oclif/core": "^4",
-    "@types/react": "^18.3.10",
     "change-case": "^5.4.4",
     "cli-truncate": "^4.0.0",
     "ink": "^5.0.1",
@@ -23,6 +22,7 @@
     "@types/mocha": "^10.0.8",
     "@types/node": "^18",
     "@types/object-hash": "^3.0.6",
+    "@types/react": "^18.3.10",
     "@types/sinon": "^17.0.3",
     "ansis": "^3.3.2",
     "chai": "^4.5.0",
@@ -52,7 +52,7 @@
   "files": [
     "/lib"
   ],
-  "homepage": "https://github.com/oclif/core",
+  "homepage": "https://github.com/oclif/table",
   "keywords": [
     "oclif",
     "cli",
@@ -62,7 +62,7 @@
   "exports": {
     ".": "./lib/index.js"
   },
-  "repository": "oclif/core",
+  "repository": "oclif/table",
   "publishConfig": {
     "access": "public"
   },

src/table.tsx

@@ -407,6 +407,7 @@ export function Skeleton(props: React.PropsWithChildren & {readonly height?: num
 export function printTable<T extends Record<string, unknown>>(options: TableOptions<T>): void {
   const instance = render(<Table {...options} />)
   instance.unmount()
+  // It might be nice to have a "paddingBefore" and "paddingAfter" option for the number of newlines to enter.
   process.stdout.write('\n')
 }