From 38b4ecc0effe159e85341fe9ce164283a5b9cc5d Mon Sep 17 00:00:00 2001 From: Phoenix Eliot Date: Mon, 15 Jun 2020 18:39:16 -0600 Subject: [PATCH 1/4] WIP Add reference storyshot for expanded with no scroll --- src/__snapshots__/11-Table.stories.storyshot | 3051 ++++++++++++++---- 1 file changed, 2478 insertions(+), 573 deletions(-) diff --git a/src/__snapshots__/11-Table.stories.storyshot b/src/__snapshots__/11-Table.stories.storyshot index e23adfd1e..b2b8005cf 100644 --- a/src/__snapshots__/11-Table.stories.storyshot +++ b/src/__snapshots__/11-Table.stories.storyshot @@ -264,656 +264,2561 @@ exports[`Storyshots Data Display/MLTable Embedded Tables 1`] = ` class="ant-table-content" >
-
- + + + + + + + + + - - - - - - - - - - - - - - + - + - + + - + - + - - - + + Salary History + + + + + + + + + - + 12315 + + + + - - - - - + + + + + + + + + + + + + + + + + + + + + + +
+ + - -
- - Employee Number - - -
- - - - - - -
- -
- - 		- -
+ - - First Name - - -
- - + + + + -
- -
- - 		+ + + + + + + + - -
- - Last Name - - + +
-
- - + + + + -
- -
- -
+ + + + + + + + - -
- + Last Name + + +
- Gender - - -
- -
+ + + + + + + + + + + - + + Gender + + + + + + +
-
- - Hire Date - - + +
-
- - + + + + -
- -
- -
+ + + + + + + + - -
- - Work Experience - - -
- - 		+ + Work Experience + + + + + + - -
- - Salary History - - -
- -
+ Firsty + + Lasty + - - 12315 - - Firsty - - Lasty - - X - - 2000-01-21 - + + 2000-01-21 + +
- - - - - - - - - - - - +
+
-
- - -
- Employee Number - -
- Department Number - -
- Department Name - -
- Job Titles - -
+
+ +
+ + Employee Number + + +
+ + + + + + +
+ +
+ + 		+ +
+ + Department Number + + +
+ + + + + + +
+ +
+ + 		+ +
+ + Department Name + + +
+ + + + + + +
+ +
+ + 		+ +
+ + Job Titles + + +
+ +
+ 12315 + + d008 + + Research + +
+
+
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
+ + Job Title + + +
+ + + + + + +
+ +
+ + 		+ +
+ + From + + +
+ + + + + + +
+ +
+ + 		+ +
+ + To + + +
+ + + + + + +
+ +
+ +
+ Staff + + 1988-01-21 + + 1996-01-21 +
+ Senior Staff + + 1996-01-21 + + 9999-01-01 +
+
+
+
+
+
+
+
+
+
+ - - + + +
- - - +
+
-
- - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
- Salary - -
+ +
+ + Salary + + +
+ + + + + + +
+ +
+ + 		+ +
+ + From + + +
+ + + + + + +
+ +
+ + 		+ +
+ + To + + +
+ + + + + + +
+ +
+ +
+ 56926 + + 1995-01-19 + + 1996-01-19 +
+ 51184 + + 1989-01-20 + + 1990-01-20 +
+ 60014 + + 1999-01-18 + + 2000-01-18 +
+ 47619 + + 1988-01-21 + + 1989-01-20 +
+ 58153 + + 1996-01-19 + + 1997-01-18 +
+ 51837 + + 1990-01-20 + + 1991-01-20 +
+ 56264 + + 1993-01-19 + + 1994-01-19 +
+ 59706 + + 1998-01-18 + + 1999-01-18 +
+ 62624 + + 2001-01-17 + + 2002-01-17 +
+ 63223 + + 2002-01-17 + + 9999-01-01 +
+
+
+
+ - - - + + + + - - 281328 - - - Eishiro - - - Trachtenberg - - - M - - - 1988-01-21 - - + + Eishiro + + + Trachtenberg + + + M + + + 1988-01-21 + + +
- - - - - - - - - - - - +
+
-
- - -
- Employee Number - -
- Department Number - -
- Department Name - -
- Job Titles - -
+ + + + + + + + + + +
+ + Employee Number + + +
+ + + + + + +
+ +
+ + + + +
+ + Department Number + + +
+ + + + + + +
+ +
+ + + + +
+ + Department Name + + +
+ + + + + + +
+ +
+ + + + +
+ + Job Titles + + +
+ + + + + + + + 281328 + + + d008 + + + Research + + +
+
+
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
+ + Job Title + + +
+ + + + + + +
+ +
+ + 		+ +
+ + From + + +
+ + + + + + +
+ +
+ + 		+ +
+ + To + + +
+ + + + + + +
+ +
+ +
+ Staff + + 1988-01-21 + + 1996-01-21 +
+ Senior Staff + + 1996-01-21 + + 9999-01-01 +
+
+
+
+
+
+
+ + + + +
+
+
- - + + +
- - - +
+
-
- - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
- Salary - -
+ +
+ + Salary + + +
+ + + + + + +
+ +
+ + 		+ +
+ + From + + +
+ + + + + + +
+ +
+ + 		+ +
+ + To + + +
+ + + + + + +
+ +
+ +
+ 56926 + + 1995-01-19 + + 1996-01-19 +
+ 51184 + + 1989-01-20 + + 1990-01-20 +
+ 60014 + + 1999-01-18 + + 2000-01-18 +
+ 47619 + + 1988-01-21 + + 1989-01-20 +
+ 58153 + + 1996-01-19 + + 1997-01-18 +
+ 51837 + + 1990-01-20 + + 1991-01-20 +
+ 56264 + + 1993-01-19 + + 1994-01-19 +
+ 59706 + + 1998-01-18 + + 1999-01-18 +
+ 62624 + + 2001-01-17 + + 2002-01-17 +
+ 63223 + + 2002-01-17 + + 9999-01-01 +
+
+
+
+ - - - - - + + + + + From 085532ac4cbb2c3c4314db29f4bb7c809fdb46bb Mon Sep 17 00:00:00 2001 From: Phoenix Eliot Date: Mon, 15 Jun 2020 18:42:04 -0600 Subject: [PATCH 2/4] WIP Add reference storyshot for expanded with scroll x --- src/__snapshots__/11-Table.stories.storyshot | 4491 +++++++++--------- 1 file changed, 2249 insertions(+), 2242 deletions(-) diff --git a/src/__snapshots__/11-Table.stories.storyshot b/src/__snapshots__/11-Table.stories.storyshot index b2b8005cf..285db714f 100644 --- a/src/__snapshots__/11-Table.stories.storyshot +++ b/src/__snapshots__/11-Table.stories.storyshot @@ -264,2561 +264,2568 @@ exports[`Storyshots Data Display/MLTable Embedded Tables 1`] = ` class="ant-table-content" >
- - - - - - - - - - - - - + + + + + + + + + + - + - + - + + - + - - + - - - - +
+ + Salary History + + +
+ + + + + - - - - - - + + + + + - - -
- +
-
- - Employee Number - - -
- + +
- - - - + + - - - -
- -
- -
- + + + -
- - First Name - - -
- + +
- - - - + + - - - -
- -
- -
- + + + -
- - Last Name - - -
- + +
- - - - + + - - - -
- -
- -
- + + + -
- +
+ + Gender + + +
+ +
+ +
- Gender - - -
- - 		- + Hire Date + + +
+ + + + + + +
+ + + + 		-
- - Hire Date - - -
+ - - - - - - -
- -
- - 		- -
- - Work Experience - - -
- - 		- + + + + -
- - Salary History - - -
- -
- 12315 - - Firsty - - Lasty - - X - - 2000-01-21 - -
+ 12315 +
+ Firsty + + Lasty + + X + + 2000-01-21 +
- - - - - - - - - - + + + + + + + - + - + - + - - - - +
+ + Job Titles + + +
+ + + + + - - - - + + + + + + + +
- +
-
- - Employee Number - - -
+ Employee Number + + - - - - - + + - - - -
- -
- - 		- + + + -
- - Department Number - - -
+ Department Number + + - - - - - + + - - - -
- -
- - 		- + + + -
- - Department Name - - -
+ Department Name + + - - - - - + + - - - -
- -
- - 		- + + + -
- - Job Titles - - -
- -
- 12315 - - d008 - - Research - -
+ 12315 +
+ d008 + + Research +
- - - - - - - - - + + + + + + - + - + - - - - - - - - - + + + + + + + + + + + - - - + + + + - 9999-01-01 - - - -
- +
-
- - Job Title - - -
+ Job Title + + - - - - - + + - - - -
- -
- - 		- + + + -
- - From - - -
+ From + + - - - - - + + - - - -
- -
- - 		- + + + -
- - To - - -
+ To + + - - - - - + + - - - -
- -
- -
- Staff - - 1988-01-21 - - 1996-01-21 -
- Senior Staff - - 1996-01-21 - + Staff + + 1988-01-21 + + 1996-01-21 +
+
+ Senior Staff + + 1996-01-21 + + 9999-01-01 +
+
- -
+ + + + +
- - - -
+
- - - - - - - - - + + + + + + - + - + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + - - - - - - + + + + - 59706 - - + + + + - 1998-01-18 - - + + + + - 1999-01-18 - - - - + + + + - 62624 - - + + + + - 2001-01-17 - - + + + + - 2002-01-17 - - - - + + + + - 63223 - - + + + + - 2002-01-17 - - + + + + - 9999-01-01 - - - -
- +
-
- - Salary - - -
+ Salary + + - - - - - + + - - - -
- -
- - 		- + + + -
- - From - - -
+ From + + - - - - - + + - - - -
- -
- - 		- + + + -
- - To - - -
+ To + + - - - - - + + - - - -
- -
- -
- 56926 - - 1995-01-19 - - 1996-01-19 -
- 51184 - - 1989-01-20 - - 1990-01-20 -
- 60014 - - 1999-01-18 - - 2000-01-18 -
- 47619 - - 1988-01-21 - - 1989-01-20 -
- 58153 - - 1996-01-19 - - 1997-01-18 -
- 51837 - - 1990-01-20 - - 1991-01-20 -
- 56264 - - 1993-01-19 - - 1994-01-19 -
+ 56926 + + 1995-01-19 + + 1996-01-19 +
+ 51184 + + 1989-01-20 + + 1990-01-20 +
+ 60014 + + 1999-01-18 + + 2000-01-18 +
+ 47619 + + 1988-01-21 + + 1989-01-20 +
+ 58153 + + 1996-01-19 + + 1997-01-18 +
+ 51837 + + 1990-01-20 + + 1991-01-20 +
+ 56264 + + 1993-01-19 + + 1994-01-19 +
+ 59706 + + 1998-01-18 + + 1999-01-18 +
+ 62624 + + 2001-01-17 + + 2002-01-17 +
+ + 63223 + + + 2002-01-17 + + + 9999-01-01 + + + + +
-
- + + + + + +
- - - - - - 281328 - - - Eishiro - - - Trachtenberg - - - M - - - 1988-01-21 - - + + -
+ 281328 + + + Eishiro + + + Trachtenberg + + + M + + + 1988-01-21 + +
- - - - - - - - - - + + + + + + + - + - + - + - - - - +
+ + Job Titles + + +
+ + + + + - - - - + + + + + + + +
- +
-
- - Employee Number - - -
+ Employee Number + + - - - - - + + - - - -
- -
- - 		- + + + -
- - Department Number - - -
+ Department Number + + - - - - - + + - - - -
- -
- - 		- + + + -
- - Department Name - - -
+ Department Name + + - - - - - + + - - - -
- -
- - 		- + + + -
- - Job Titles - - -
- -
- 281328 - - d008 - - Research - -
+ 281328 +
+ d008 + + Research +
- - - - - - - - - + + + + + + - + - + - - - - - - - - - + + + + + + + + + + + - - - + + + + - 9999-01-01 - - - -
- +
-
- - Job Title - - -
+ Job Title + + - - - - - + + - - - -
- -
- - 		- + + + -
- - From - - -
+ From + + - - - - - + + - - - -
- -
- - 		- + + + -
- - To - - -
+ To + + - - - - - + + - - - -
- -
- -
- Staff - - 1988-01-21 - - 1996-01-21 -
- Senior Staff - - 1996-01-21 - + Staff + + 1988-01-21 + + 1996-01-21 +
+
+ Senior Staff + + 1996-01-21 + + 9999-01-01 +
+
- - - - - + + + + + - - - -
+
- - - - - - - - - + + + + + + - + - + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + - - - - - - + + + + - 59706 - - + + + + - 1998-01-18 - - + + + + - 1999-01-18 - - - - + + + + - 62624 - - + + + + - 2001-01-17 - - + + + + - 2002-01-17 - - - - + + + + - 63223 - - + + + + - 2002-01-17 - - + + + + - 9999-01-01 - - - -
- +
-
- - Salary - - -
+ Salary + + - - - - - + + - - - -
- -
- - 		- + + + -
- - From - - -
+ From + + - - - - - + + - - - -
- -
- - 		- + + + -
- - To - - -
+ To + + - - - - - + + - - - -
- -
- -
- 56926 - - 1995-01-19 - - 1996-01-19 -
- 51184 - - 1989-01-20 - - 1990-01-20 -
- 60014 - - 1999-01-18 - - 2000-01-18 -
- 47619 - - 1988-01-21 - - 1989-01-20 -
- 58153 - - 1996-01-19 - - 1997-01-18 -
- 51837 - - 1990-01-20 - - 1991-01-20 -
- 56264 - - 1993-01-19 - - 1994-01-19 -
+ 56926 + + 1995-01-19 + + 1996-01-19 +
+ 51184 + + 1989-01-20 + + 1990-01-20 +
+ 60014 + + 1999-01-18 + + 2000-01-18 +
+ 47619 + + 1988-01-21 + + 1989-01-20 +
+ 58153 + + 1996-01-19 + + 1997-01-18 +
+ 51837 + + 1990-01-20 + + 1991-01-20 +
+ 56264 + + 1993-01-19 + + 1994-01-19 +
+ 59706 + + 1998-01-18 + + 1999-01-18 +
+ 62624 + + 2001-01-17 + + 2002-01-17 +
+ + 63223 + + + 2002-01-17 + + + 9999-01-01 + + + + +
-
- + + + + + +
- - - - - + + + + + From b41f3ae9154465ff0c7f568eb7654755b1188a70 Mon Sep 17 00:00:00 2001 From: Phoenix Eliot Date: Mon, 15 Jun 2020 18:50:43 -0600 Subject: [PATCH 3/4] Add widths and hardcoded scroll numbers --- src/__snapshots__/11-Table.stories.storyshot | 26 +++++++++++++++++--- stories/11-Table.sample-data.js | 3 +++ stories/11-Table.stories.jsx | 5 +++- 3 files changed, 29 insertions(+), 5 deletions(-) diff --git a/src/__snapshots__/11-Table.stories.storyshot b/src/__snapshots__/11-Table.stories.storyshot index 285db714f..75b15b265 100644 --- a/src/__snapshots__/11-Table.stories.storyshot +++ b/src/__snapshots__/11-Table.stories.storyshot @@ -258,7 +258,7 @@ exports[`Storyshots Data Display/MLTable Embedded Tables 1`] = ` class="ant-spin-container" >
+
+
+
+ + + + + + + + + + diff --git a/stories/11-Table.sample-data.js b/stories/11-Table.sample-data.js index 02aeb3dd4..ad7b9b065 100644 --- a/stories/11-Table.sample-data.js +++ b/stories/11-Table.sample-data.js @@ -256,6 +256,7 @@ export const sampleNestedData = { title: 'Work Experience', dataIndex: 'work_experience', key: 'work_experience', + width: 500, columns: [ { title: 'Employee Number', dataIndex: 'emp_no', key: 'emp_no', sorter: lessThanSorter('emp_no') }, { title: 'Department Number', dataIndex: 'dept_no', key: 'dept_no', sorter: lessThanSorter('dept_no') }, @@ -264,6 +265,7 @@ export const sampleNestedData = { title: 'Job Titles', dataIndex: 'titles', key: 'titles', + width: 200, columns: [ { title: 'Job Title', dataIndex: 'title', key: 'title', sorter: lessThanSorter('title') }, { title: 'From', dataIndex: 'from_date', key: 'from_date', sorter: dateSorter('from_date') }, @@ -276,6 +278,7 @@ export const sampleNestedData = { title: 'Salary History', dataIndex: 'salary', key: 'salary', + width: 350, columns: [ { title: 'Salary', dataIndex: 'salary', key: 'salary2', sorter: lessThanSorter('salary') }, { title: 'From', dataIndex: 'from_date', key: 'from_date', sorter: dateSorter('from_date') }, diff --git a/stories/11-Table.stories.jsx b/stories/11-Table.stories.jsx index 52b7db9c2..df057b3ae 100644 --- a/stories/11-Table.stories.jsx +++ b/stories/11-Table.stories.jsx @@ -43,7 +43,10 @@ export const embeddedTables = () => { return (
From ea6a54ecd42ceb7096107f9a4c4dfc32d84a7898 Mon Sep 17 00:00:00 2001 From: Phoenix Eliot Date: Fri, 24 Jul 2020 19:23:33 -0600 Subject: [PATCH 4/4] Add expandedWidth column prop --- src/MLTable/MLTable.js | 1 + stories/11-Table.sample-data.js | 6 +++--- stories/11-Table.stories.jsx | 10 +++++----- 3 files changed, 9 insertions(+), 8 deletions(-) diff --git a/src/MLTable/MLTable.js b/src/MLTable/MLTable.js index 7b25aea0c..d68449d02 100644 --- a/src/MLTable/MLTable.js +++ b/src/MLTable/MLTable.js @@ -288,6 +288,7 @@ class MLTable extends React.Component { // onChange={(e) => this.handleEmbeddedTableChange(e, restructuredColumn, record)} /> ) + restructuredColumn.width = (this.state.columnExpandedStates[originalColumn.dataIndex] ? originalColumn.expandedWidth : originalColumn.width) } return restructuredColumn }) diff --git a/stories/11-Table.sample-data.js b/stories/11-Table.sample-data.js index 9b6d81f8f..2b0cdd7e8 100644 --- a/stories/11-Table.sample-data.js +++ b/stories/11-Table.sample-data.js @@ -329,7 +329,7 @@ export const sampleNestedData = { title: 'Work Experience', dataIndex: 'work_experience', key: 'work_experience', - width: 500, + expandedWidth: 500, columns: [ { title: 'Employee Number', dataIndex: 'emp_no', key: 'emp_no', sorter: lessThanSorter('emp_no') }, { title: 'Department Number', dataIndex: 'dept_no', key: 'dept_no', sorter: lessThanSorter('dept_no') }, @@ -338,7 +338,7 @@ export const sampleNestedData = { title: 'Job Titles', dataIndex: 'titles', key: 'titles', - width: 200, + expandedWidth: 200, columns: [ { title: 'Job Title', dataIndex: 'title', key: 'title', sorter: lessThanSorter('title') }, { title: 'From', dataIndex: 'from_date', key: 'from_date', sorter: dateSorter('from_date') }, @@ -351,7 +351,7 @@ export const sampleNestedData = { title: 'Salary History', dataIndex: 'salary', key: 'salary', - width: 350, + expandedWidth: 350, columns: [ { title: 'Salary', dataIndex: 'salary', key: 'salary2', sorter: lessThanSorter('salary') }, { title: 'From', dataIndex: 'from_date', key: 'from_date', sorter: dateSorter('from_date') }, diff --git a/stories/11-Table.stories.jsx b/stories/11-Table.stories.jsx index 30b13fd49..efce9211a 100644 --- a/stories/11-Table.stories.jsx +++ b/stories/11-Table.stories.jsx @@ -73,11 +73,11 @@ export const embeddedTables = () => { return (