11import type { Meta as MetaObj , StoryObj } from '@storybook/react-webpack5' ;
22
33const tableData = [
4- [ 'Data 1' , 'Data 2' , 'Data 3' ] ,
5- [ 'Data 1' , 'Data 2' , 'Data 3' ] ,
6- [ 'Data 1' , 'Data 2' , 'Data 3' ] ,
4+ { id : 'row-1' , cells : [ 'Data 1' , 'Data 2' , 'Data 3' ] } ,
5+ { id : 'row-2' , cells : [ 'Data 1' , 'Data 2' , 'Data 3' ] } ,
6+ { id : 'row-3' , cells : [ 'Data 1' , 'Data 2' , 'Data 3' ] } ,
77] ;
88
99export const Table : StoryObj = {
@@ -12,16 +12,16 @@ export const Table: StoryObj = {
1212 < table >
1313 < thead >
1414 < tr >
15- { [ 'Column 1' , 'Column 2' , 'Column 3' ] . map ( ( col , idx ) => (
16- < th key = { idx } > { col } </ th >
15+ { [ 'Column 1' , 'Column 2' , 'Column 3' ] . map ( col => (
16+ < th key = { col } > { col } </ th >
1717 ) ) }
1818 </ tr >
1919 </ thead >
2020 < tbody >
21- { tableData . map ( ( row , rowIndex ) => (
22- < tr key = { rowIndex } >
23- { row . map ( ( cell , cellIndex ) => (
24- < td key = { cellIndex } > { cell } </ td >
21+ { tableData . map ( row => (
22+ < tr key = { row . id } >
23+ { row . cells . map ( cell => (
24+ < td key = { ` ${ row . id } - ${ cell } ` } > { cell } </ td >
2525 ) ) }
2626 </ tr >
2727 ) ) }
0 commit comments