Artifact
4ce30921f2d071701474cda2f0ce551224045ba7aff0471b307cefa3fea9ec28:
0000: 3c 21 2d 2d 0a 20 20 54 68 65 20 6d 61 69 6e 20 <!--. The main
0010: 63 6f 6e 74 61 69 6e 65 72 2e 20 49 74 20 69 73 container. It is
0020: 20 6e 6f 74 20 6e 65 63 63 65 73 61 72 79 20 62 not neccesary b
0030: 75 74 20 68 6f 6c 64 73 20 63 6f 6d 6d 6f 6e 20 ut holds common
0040: 64 61 74 61 20 61 6e 64 20 61 6c 6c 20 74 68 65 data and all the
0050: 0a 20 20 74 68 65 20 74 61 67 73 2c 20 73 6f 20 . the tags, so
0060: 74 68 65 20 74 65 73 74 20 6f 6e 6c 79 20 6e 65 the test only ne
0070: 65 64 73 20 6f 6e 65 20 63 61 6c 6c 20 74 6f 20 eds one call to
0080: 6d 6f 75 6e 74 28 22 74 61 62 6c 65 2d 74 65 73 mount("table-tes
0090: 74 22 29 20 74 6f 20 77 6f 72 6b 2e 0a 2d 2d 3e t") to work..-->
00a0: 0a 3c 74 61 62 6c 65 2d 74 65 73 74 3e 0a 0a 20 .<table-test>..
00b0: 20 3c 74 61 62 6c 65 20 64 61 74 61 2d 69 73 3d <table data-is=
00c0: 22 74 61 62 6c 65 2d 63 61 70 74 69 6f 6e 22 0a "table-caption".
00d0: 20 20 20 20 68 65 61 64 65 72 3d 7b 20 68 65 61 header={ hea
00e0: 64 65 72 20 7d 0a 20 20 20 20 66 6f 6f 74 65 72 der }. footer
00f0: 3d 7b 20 66 6f 6f 74 65 72 20 7d 20 72 6f 77 73 ={ footer } rows
0100: 3d 7b 20 72 6f 77 73 20 7d 20 77 69 64 74 68 73 ={ rows } widths
0110: 3d 7b 20 77 69 64 74 68 73 20 7d 2f 3e 0a 0a 20 ={ widths }/>..
0120: 20 3c 74 61 62 6c 65 20 64 61 74 61 2d 69 73 3d <table data-is=
0130: 22 74 61 62 6c 65 2d 63 6f 6c 67 72 6f 75 70 22 "table-colgroup"
0140: 0a 20 20 20 20 68 65 61 64 65 72 3d 7b 20 68 65 . header={ he
0150: 61 64 65 72 20 7d 0a 20 20 20 20 66 6f 6f 74 65 ader }. foote
0160: 72 3d 7b 20 66 6f 6f 74 65 72 20 7d 20 72 6f 77 r={ footer } row
0170: 73 3d 7b 20 72 6f 77 73 20 7d 20 77 69 64 74 68 s={ rows } width
0180: 73 3d 7b 20 77 69 64 74 68 73 20 7d 2f 3e 0a 0a s={ widths }/>..
0190: 20 20 3c 74 61 62 6c 65 20 64 61 74 61 2d 69 73 <table data-is
01a0: 3d 22 74 61 62 6c 65 2d 6c 6f 6f 70 65 64 2d 63 ="table-looped-c
01b0: 6f 6c 22 0a 20 20 20 20 68 65 61 64 65 72 3d 7b ol". header={
01c0: 20 68 65 61 64 65 72 20 7d 0a 20 20 20 20 66 6f header }. fo
01d0: 6f 74 65 72 3d 7b 20 66 6f 6f 74 65 72 20 7d 20 oter={ footer }
01e0: 72 6f 77 73 3d 7b 20 72 6f 77 73 20 7d 20 77 69 rows={ rows } wi
01f0: 64 74 68 73 3d 7b 20 77 69 64 74 68 73 20 7d 2f dths={ widths }/
0200: 3e 0a 0a 20 20 3c 74 61 62 6c 65 20 64 61 74 61 >.. <table data
0210: 2d 69 73 3d 22 74 61 62 6c 65 2d 6d 75 6c 74 69 -is="table-multi
0220: 2d 63 6f 6c 22 0a 20 20 20 20 68 65 61 64 65 72 -col". header
0230: 3d 7b 20 68 65 61 64 65 72 20 7d 0a 20 20 20 20 ={ header }.
0240: 66 6f 6f 74 65 72 3d 7b 20 66 6f 6f 74 65 72 20 footer={ footer
0250: 7d 20 72 6f 77 73 3d 7b 20 72 6f 77 73 20 7d 20 } rows={ rows }
0260: 77 69 64 74 68 73 3d 7b 20 77 69 64 74 68 73 20 widths={ widths
0270: 7d 2f 3e 0a 0a 20 20 3c 74 61 62 6c 65 20 64 61 }/>.. <table da
0280: 74 61 2d 69 73 3d 22 74 61 62 6c 65 2d 74 66 6f ta-is="table-tfo
0290: 6f 74 22 0a 20 20 20 20 68 65 61 64 65 72 3d 7b ot". header={
02a0: 20 68 65 61 64 65 72 20 7d 0a 20 20 20 20 66 6f header }. fo
02b0: 6f 74 65 72 3d 7b 20 66 6f 6f 74 65 72 20 7d 20 oter={ footer }
02c0: 72 6f 77 73 3d 7b 20 72 6f 77 73 20 7d 20 77 69 rows={ rows } wi
02d0: 64 74 68 73 3d 7b 20 77 69 64 74 68 73 20 7d 2f dths={ widths }/
02e0: 3e 0a 0a 20 20 3c 74 61 62 6c 65 20 64 61 74 61 >.. <table data
02f0: 2d 69 73 3d 22 74 61 62 6c 65 2d 74 72 2d 62 6f -is="table-tr-bo
0300: 64 79 2d 6f 6e 6c 79 22 0a 20 20 20 20 68 65 61 dy-only". hea
0310: 64 65 72 3d 7b 20 68 65 61 64 65 72 20 7d 0a 20 der={ header }.
0320: 20 20 20 66 6f 6f 74 65 72 3d 7b 20 66 6f 6f 74 footer={ foot
0330: 65 72 20 7d 20 72 6f 77 73 3d 7b 20 72 6f 77 73 er } rows={ rows
0340: 20 7d 20 77 69 64 74 68 73 3d 7b 20 77 69 64 74 } widths={ widt
0350: 68 73 20 7d 2f 3e 0a 0a 20 20 3c 74 61 62 6c 65 hs }/>.. <table
0360: 20 64 61 74 61 2d 69 73 3d 22 74 61 62 6c 65 2d data-is="table-
0370: 74 72 2d 61 6c 6f 6e 65 22 0a 20 20 20 20 68 65 tr-alone". he
0380: 61 64 65 72 3d 7b 20 68 65 61 64 65 72 20 7d 0a ader={ header }.
0390: 20 20 20 20 66 6f 6f 74 65 72 3d 7b 20 66 6f 6f footer={ foo
03a0: 74 65 72 20 7d 20 72 6f 77 73 3d 7b 20 72 6f 77 ter } rows={ row
03b0: 73 20 7d 20 77 69 64 74 68 73 3d 7b 20 77 69 64 s } widths={ wid
03c0: 74 68 73 20 7d 2f 3e 0a 0a 20 20 3c 74 61 62 6c ths }/>.. <tabl
03d0: 65 20 64 61 74 61 2d 69 73 3d 22 74 61 62 6c 65 e data-is="table
03e0: 2d 63 75 73 74 6f 6d 2d 74 68 65 61 64 2d 74 66 -custom-thead-tf
03f0: 6f 6f 74 22 0a 20 20 20 20 68 65 61 64 65 72 3d oot". header=
0400: 7b 20 68 65 61 64 65 72 20 7d 0a 20 20 20 20 66 { header }. f
0410: 6f 6f 74 65 72 3d 7b 20 66 6f 6f 74 65 72 20 7d ooter={ footer }
0420: 20 72 6f 77 73 3d 7b 20 72 6f 77 73 20 7d 20 77 rows={ rows } w
0430: 69 64 74 68 73 3d 7b 20 77 69 64 74 68 73 20 7d idths={ widths }
0440: 2f 3e 0a 0a 20 20 3c 73 63 72 69 70 74 3e 0a 20 />.. <script>.
0450: 20 74 68 69 73 2e 77 69 64 74 68 73 20 3d 20 5b this.widths = [
0460: 31 35 30 2c 20 32 30 30 5d 0a 20 20 74 68 69 73 150, 200]. this
0470: 2e 68 65 61 64 65 72 20 3d 20 5b 27 48 2d 31 27 .header = ['H-1'
0480: 2c 20 27 48 2d 32 27 5d 0a 20 20 74 68 69 73 2e , 'H-2']. this.
0490: 66 6f 6f 74 65 72 20 3d 20 5b 27 46 2d 31 27 2c footer = ['F-1',
04a0: 20 27 46 2d 32 27 5d 0a 20 20 74 68 69 73 2e 72 'F-2']. this.r
04b0: 6f 77 73 20 3d 20 5b 5b 27 52 31 2d 43 31 27 2c ows = [['R1-C1',
04c0: 20 27 52 31 2d 43 32 27 5d 2c 20 5b 27 52 32 2d 'R1-C2'], ['R2-
04d0: 43 31 27 2c 20 27 52 32 2d 43 32 27 5d 5d 0a 20 C1', 'R2-C2']].
04e0: 20 3c 2f 73 63 72 69 70 74 3e 0a 3c 2f 74 61 62 </script>.</tab
04f0: 6c 65 2d 74 65 73 74 3e 0a 0a 3c 21 2d 2d 20 54 le-test>..<!-- T
0500: 68 65 20 6e 65 73 74 65 64 20 72 69 6f 74 20 74 he nested riot t
0510: 61 67 73 20 2d 2d 3e 0a 0a 3c 74 61 62 6c 65 2d ags -->..<table-
0520: 63 61 70 74 69 6f 6e 3e 0a 20 20 3c 63 61 70 74 caption>. <capt
0530: 69 6f 6e 3e 54 69 74 6c 65 3c 2f 63 61 70 74 69 ion>Title</capti
0540: 6f 6e 3e 0a 20 20 3c 63 6f 6c 67 72 6f 75 70 3e on>. <colgroup>
0550: 0a 20 20 20 20 3c 63 6f 6c 20 65 61 63 68 3d 7b . <col each={
0560: 20 77 69 64 74 68 20 69 6e 20 6f 70 74 73 2e 77 width in opts.w
0570: 69 64 74 68 73 20 7d 20 77 69 64 74 68 3d 22 7b idths } width="{
0580: 20 77 69 64 74 68 20 7d 22 3e 0a 20 20 3c 2f 63 width }">. </c
0590: 6f 6c 67 72 6f 75 70 3e 0a 20 20 3c 74 62 6f 64 olgroup>. <tbod
05a0: 79 3e 0a 20 20 20 20 3c 74 72 20 65 61 63 68 3d y>. <tr each=
05b0: 7b 20 72 6f 77 20 69 6e 20 6f 70 74 73 2e 72 6f { row in opts.ro
05c0: 77 73 20 7d 3e 0a 20 20 20 20 20 20 3c 74 64 20 ws }>. <td
05d0: 65 61 63 68 3d 7b 20 63 65 6c 6c 20 69 6e 20 72 each={ cell in r
05e0: 6f 77 20 7d 3e 7b 20 63 65 6c 6c 20 7d 3c 2f 74 ow }>{ cell }</t
05f0: 64 3e 0a 20 20 20 20 3c 2f 74 72 3e 0a 20 20 3c d>. </tr>. <
0600: 2f 74 62 6f 64 79 3e 0a 3c 2f 74 61 62 6c 65 2d /tbody>.</table-
0610: 63 61 70 74 69 6f 6e 3e 0a 0a 3c 74 61 62 6c 65 caption>..<table
0620: 2d 63 6f 6c 67 72 6f 75 70 3e 0a 20 20 3c 63 6f -colgroup>. <co
0630: 6c 67 72 6f 75 70 3e 0a 20 20 20 20 3c 63 6f 6c lgroup>. <col
0640: 20 65 61 63 68 3d 7b 20 77 69 64 74 68 20 69 6e each={ width in
0650: 20 6f 70 74 73 2e 77 69 64 74 68 73 20 7d 20 77 opts.widths } w
0660: 69 64 74 68 3d 22 7b 20 77 69 64 74 68 20 7d 22 idth="{ width }"
0670: 3e 0a 20 20 3c 2f 63 6f 6c 67 72 6f 75 70 3e 0a >. </colgroup>.
0680: 20 20 3c 74 68 65 61 64 3e 0a 20 20 20 20 3c 74 <thead>. <t
0690: 72 3e 3c 74 68 20 65 61 63 68 3d 7b 20 63 65 6c r><th each={ cel
06a0: 6c 20 69 6e 20 6f 70 74 73 2e 68 65 61 64 65 72 l in opts.header
06b0: 20 7d 3e 7b 20 63 65 6c 6c 20 7d 3c 2f 74 68 3e }>{ cell }</th>
06c0: 3c 2f 74 72 3e 0a 20 20 3c 2f 74 68 65 61 64 3e </tr>. </thead>
06d0: 0a 20 20 3c 74 62 6f 64 79 3e 0a 20 20 20 20 3c . <tbody>. <
06e0: 74 72 20 65 61 63 68 3d 7b 20 72 6f 77 20 69 6e tr each={ row in
06f0: 20 6f 70 74 73 2e 72 6f 77 73 20 7d 3e 0a 20 20 opts.rows }>.
0700: 20 20 20 20 3c 74 64 20 65 61 63 68 3d 7b 20 63 <td each={ c
0710: 65 6c 6c 20 69 6e 20 72 6f 77 20 7d 3e 7b 20 63 ell in row }>{ c
0720: 65 6c 6c 20 7d 3c 2f 74 64 3e 0a 20 20 20 20 3c ell }</td>. <
0730: 2f 74 72 3e 0a 20 20 3c 2f 74 62 6f 64 79 3e 0a /tr>. </tbody>.
0740: 3c 2f 74 61 62 6c 65 2d 63 6f 6c 67 72 6f 75 70 </table-colgroup
0750: 3e 0a 0a 3c 74 61 62 6c 65 2d 6c 6f 6f 70 65 64 >..<table-looped
0760: 2d 63 6f 6c 3e 0a 20 20 3c 63 6f 6c 20 65 61 63 -col>. <col eac
0770: 68 3d 7b 20 77 69 64 74 68 20 69 6e 20 6f 70 74 h={ width in opt
0780: 73 2e 77 69 64 74 68 73 20 7d 20 77 69 64 74 68 s.widths } width
0790: 3d 22 7b 20 77 69 64 74 68 20 7d 22 3e 0a 20 20 ="{ width }">.
07a0: 3c 74 68 65 61 64 3e 0a 20 20 20 20 3c 74 72 3e <thead>. <tr>
07b0: 3c 74 68 20 65 61 63 68 3d 7b 20 63 65 6c 6c 20 <th each={ cell
07c0: 69 6e 20 6f 70 74 73 2e 68 65 61 64 65 72 20 7d in opts.header }
07d0: 3e 7b 20 63 65 6c 6c 20 7d 3c 2f 74 68 3e 3c 2f >{ cell }</th></
07e0: 74 72 3e 0a 20 20 3c 2f 74 68 65 61 64 3e 0a 20 tr>. </thead>.
07f0: 20 3c 74 62 6f 64 79 3e 0a 20 20 20 20 3c 74 72 <tbody>. <tr
0800: 20 65 61 63 68 3d 7b 20 72 6f 77 20 69 6e 20 6f each={ row in o
0810: 70 74 73 2e 72 6f 77 73 20 7d 3e 0a 20 20 20 20 pts.rows }>.
0820: 20 20 3c 74 64 20 65 61 63 68 3d 7b 20 63 65 6c <td each={ cel
0830: 6c 20 69 6e 20 72 6f 77 20 7d 3e 7b 20 63 65 6c l in row }>{ cel
0840: 6c 20 7d 3c 2f 74 64 3e 0a 20 20 20 20 3c 2f 74 l }</td>. </t
0850: 72 3e 0a 20 20 3c 2f 74 62 6f 64 79 3e 0a 3c 2f r>. </tbody>.</
0860: 74 61 62 6c 65 2d 6c 6f 6f 70 65 64 2d 63 6f 6c table-looped-col
0870: 3e 0a 0a 3c 21 2d 2d 20 74 61 62 6c 65 20 73 74 >..<!-- table st
0880: 61 72 74 69 6e 67 20 77 69 74 68 20 61 20 6d 75 arting with a mu
0890: 6c 74 69 70 6c 65 20 63 6f 6c 73 2c 20 77 69 74 ltiple cols, wit
08a0: 68 6f 75 74 20 63 6f 6c 67 72 6f 75 70 20 2d 2d hout colgroup --
08b0: 3e 0a 3c 74 61 62 6c 65 2d 6d 75 6c 74 69 2d 63 >.<table-multi-c
08c0: 6f 6c 3e 0a 20 20 3c 63 6f 6c 20 77 69 64 74 68 ol>. <col width
08d0: 3d 22 7b 20 6f 70 74 73 2e 77 69 64 74 68 73 5b ="{ opts.widths[
08e0: 30 5d 20 7d 22 3e 0a 20 20 3c 63 6f 6c 20 77 69 0] }">. <col wi
08f0: 64 74 68 3d 22 7b 20 6f 70 74 73 2e 77 69 64 74 dth="{ opts.widt
0900: 68 73 5b 31 5d 20 7d 22 3e 0a 20 20 3c 74 68 65 hs[1] }">. <the
0910: 61 64 3e 0a 20 20 20 20 3c 74 72 3e 3c 74 68 20 ad>. <tr><th
0920: 65 61 63 68 3d 7b 20 63 65 6c 6c 20 69 6e 20 6f each={ cell in o
0930: 70 74 73 2e 68 65 61 64 65 72 20 7d 3e 7b 20 63 pts.header }>{ c
0940: 65 6c 6c 20 7d 3c 2f 74 68 3e 3c 2f 74 72 3e 0a ell }</th></tr>.
0950: 20 20 3c 2f 74 68 65 61 64 3e 0a 20 20 3c 74 62 </thead>. <tb
0960: 6f 64 79 3e 0a 20 20 20 20 3c 74 72 20 65 61 63 ody>. <tr eac
0970: 68 3d 7b 20 72 6f 77 20 69 6e 20 6f 70 74 73 2e h={ row in opts.
0980: 72 6f 77 73 20 7d 3e 0a 20 20 20 20 20 20 3c 74 rows }>. <t
0990: 64 20 65 61 63 68 3d 7b 20 63 65 6c 6c 20 69 6e d each={ cell in
09a0: 20 72 6f 77 20 7d 3e 7b 20 63 65 6c 6c 20 7d 3c row }>{ cell }<
09b0: 2f 74 64 3e 0a 20 20 20 20 3c 2f 74 72 3e 0a 20 /td>. </tr>.
09c0: 20 3c 2f 74 62 6f 64 79 3e 0a 3c 2f 74 61 62 6c </tbody>.</tabl
09d0: 65 2d 6d 75 6c 74 69 2d 63 6f 6c 3e 0a 0a 3c 21 e-multi-col>..<!
09e0: 2d 2d 20 74 61 62 6c 65 20 73 74 61 72 74 69 6e -- table startin
09f0: 67 20 77 69 74 68 20 61 20 74 66 6f 6f 74 20 2d g with a tfoot -
0a00: 2d 3e 0a 3c 74 61 62 6c 65 2d 74 66 6f 6f 74 3e ->.<table-tfoot>
0a10: 0a 20 20 3c 74 66 6f 6f 74 3e 0a 20 20 20 20 3c . <tfoot>. <
0a20: 74 72 3e 3c 74 64 20 65 61 63 68 3d 7b 20 63 65 tr><td each={ ce
0a30: 6c 6c 20 69 6e 20 6f 70 74 73 2e 66 6f 6f 74 65 ll in opts.foote
0a40: 72 20 7d 3e 7b 20 63 65 6c 6c 20 7d 3c 2f 74 64 r }>{ cell }</td
0a50: 3e 3c 2f 74 72 3e 0a 20 20 3c 2f 74 66 6f 6f 74 ></tr>. </tfoot
0a60: 3e 0a 20 20 3c 74 62 6f 64 79 3e 0a 20 20 20 20 >. <tbody>.
0a70: 3c 74 72 20 65 61 63 68 3d 7b 20 72 6f 77 20 69 <tr each={ row i
0a80: 6e 20 6f 70 74 73 2e 72 6f 77 73 20 7d 3e 0a 20 n opts.rows }>.
0a90: 20 20 20 20 20 3c 74 64 20 65 61 63 68 3d 7b 20 <td each={
0aa0: 63 65 6c 6c 20 69 6e 20 72 6f 77 20 7d 3e 7b 20 cell in row }>{
0ab0: 63 65 6c 6c 20 7d 3c 2f 74 64 3e 0a 20 20 20 20 cell }</td>.
0ac0: 3c 2f 74 72 3e 0a 20 20 3c 2f 74 62 6f 64 79 3e </tr>. </tbody>
0ad0: 0a 3c 2f 74 61 62 6c 65 2d 74 66 6f 6f 74 3e 0a .</table-tfoot>.
0ae0: 0a 3c 21 2d 2d 20 74 61 62 6c 65 20 77 69 74 68 .<!-- table with
0af0: 20 61 20 6c 6f 6f 70 65 64 20 54 52 2c 20 77 69 a looped TR, wi
0b00: 74 68 6f 75 74 20 54 42 4f 44 59 20 2d 2d 3e 0a thout TBODY -->.
0b10: 3c 74 61 62 6c 65 2d 74 72 2d 62 6f 64 79 2d 6f <table-tr-body-o
0b20: 6e 6c 79 3e 0a 20 20 3c 74 72 20 65 61 63 68 3d nly>. <tr each=
0b30: 7b 20 72 6f 77 20 69 6e 20 6f 70 74 73 2e 72 6f { row in opts.ro
0b40: 77 73 20 7d 3e 0a 20 20 20 20 3c 74 64 20 65 61 ws }>. <td ea
0b50: 63 68 3d 7b 20 63 65 6c 6c 20 69 6e 20 72 6f 77 ch={ cell in row
0b60: 20 7d 3e 7b 20 63 65 6c 6c 20 7d 3c 2f 74 64 3e }>{ cell }</td>
0b70: 0a 20 20 3c 2f 74 72 3e 0a 3c 2f 74 61 62 6c 65 . </tr>.</table
0b80: 2d 74 72 2d 62 6f 64 79 2d 6f 6e 6c 79 3e 0a 0a -tr-body-only>..
0b90: 3c 21 2d 2d 20 74 61 62 6c 65 20 77 69 74 68 20 <!-- table with
0ba0: 73 69 6e 67 6c 65 20 6c 69 74 65 72 61 6c 20 54 single literal T
0bb0: 52 2c 20 77 69 74 68 6f 75 74 20 65 78 70 72 65 R, without expre
0bc0: 73 73 69 6f 6e 73 20 2d 2d 3e 0a 3c 74 61 62 6c ssions -->.<tabl
0bd0: 65 2d 74 72 2d 61 6c 6f 6e 65 3e 0a 20 20 3c 74 e-tr-alone>. <t
0be0: 72 3e 3c 74 64 3e 52 31 2d 43 31 3c 2f 74 64 3e r><td>R1-C1</td>
0bf0: 3c 74 64 3e 52 31 2d 43 32 3c 2f 74 64 3e 3c 2f <td>R1-C2</td></
0c00: 74 72 3e 0a 3c 2f 74 61 62 6c 65 2d 74 72 2d 61 tr>.</table-tr-a
0c10: 6c 6f 6e 65 3e 0a 0a 3c 21 2d 2d 20 74 61 62 6c lone>..<!-- tabl
0c20: 65 20 77 69 74 68 20 61 6c 6c 20 74 68 65 20 6d e with all the m
0c30: 61 69 6e 20 65 6c 65 6d 65 6e 74 73 20 61 73 20 ain elements as
0c40: 72 69 6f 74 20 74 61 67 73 20 28 32 20 74 62 6f riot tags (2 tbo
0c50: 64 79 29 20 2d 2d 3e 0a 3c 74 61 62 6c 65 2d 63 dy) -->.<table-c
0c60: 75 73 74 6f 6d 2d 74 68 65 61 64 2d 74 66 6f 6f ustom-thead-tfoo
0c70: 74 3e 0a 20 20 3c 63 6f 6c 67 72 6f 75 70 20 64 t>. <colgroup d
0c80: 61 74 61 2d 69 73 3d 22 74 61 67 2d 63 6f 6c 67 ata-is="tag-colg
0c90: 72 6f 75 70 22 20 77 69 64 74 68 73 3d 7b 20 6f roup" widths={ o
0ca0: 70 74 73 2e 77 69 64 74 68 73 20 7d 2f 3e 0a 20 pts.widths }/>.
0cb0: 20 3c 74 68 65 61 64 20 64 61 74 61 2d 69 73 3d <thead data-is=
0cc0: 22 74 61 67 2d 74 68 65 61 64 22 20 72 6f 77 73 "tag-thead" rows
0cd0: 3d 7b 20 6f 70 74 73 2e 68 65 61 64 65 72 20 7d ={ opts.header }
0ce0: 2f 3e 0a 20 20 3c 74 66 6f 6f 74 20 64 61 74 61 />. <tfoot data
0cf0: 2d 69 73 3d 22 74 61 67 2d 74 66 6f 6f 74 22 20 -is="tag-tfoot"
0d00: 72 6f 77 73 3d 7b 20 6f 70 74 73 2e 66 6f 6f 74 rows={ opts.foot
0d10: 65 72 20 7d 2f 3e 0a 20 20 3c 74 62 6f 64 79 20 er }/>. <tbody
0d20: 64 61 74 61 2d 69 73 3d 22 74 61 67 2d 74 62 6f data-is="tag-tbo
0d30: 64 79 22 20 72 6f 77 73 3d 7b 20 6f 70 74 73 2e dy" rows={ opts.
0d40: 72 6f 77 73 20 7d 2f 3e 0a 20 20 3c 74 62 6f 64 rows }/>. <tbod
0d50: 79 20 64 61 74 61 2d 69 73 3d 22 74 61 67 2d 74 y data-is="tag-t
0d60: 62 6f 64 79 22 20 72 6f 77 73 3d 7b 20 6f 70 74 body" rows={ opt
0d70: 73 2e 72 6f 77 73 20 7d 2f 3e 0a 3c 2f 74 61 62 s.rows }/>.</tab
0d80: 6c 65 2d 63 75 73 74 6f 6d 2d 74 68 65 61 64 2d le-custom-thead-
0d90: 74 66 6f 6f 74 3e 0a 0a 3c 21 2d 2d 20 72 69 6f tfoot>..<!-- rio
0da0: 74 20 74 61 67 73 20 66 6f 72 20 74 68 65 20 6d t tags for the m
0db0: 61 69 6e 20 74 61 62 6c 65 20 65 6c 65 6d 65 6e ain table elemen
0dc0: 74 73 20 2d 2d 3e 0a 3c 74 61 67 2d 63 6f 6c 67 ts -->.<tag-colg
0dd0: 72 6f 75 70 3e 0a 20 20 3c 63 6f 6c 20 65 61 63 roup>. <col eac
0de0: 68 3d 7b 20 77 69 64 74 68 20 69 6e 20 6f 70 74 h={ width in opt
0df0: 73 2e 77 69 64 74 68 73 20 7d 20 77 69 64 74 68 s.widths } width
0e00: 3d 7b 20 77 69 64 74 68 20 7d 3e 0a 3c 2f 74 61 ={ width }>.</ta
0e10: 67 2d 63 6f 6c 67 72 6f 75 70 3e 0a 3c 74 61 67 g-colgroup>.<tag
0e20: 2d 74 68 65 61 64 3e 0a 20 20 3c 74 72 3e 3c 74 -thead>. <tr><t
0e30: 64 20 65 61 63 68 3d 7b 20 63 65 6c 6c 20 69 6e d each={ cell in
0e40: 20 6f 70 74 73 2e 72 6f 77 73 20 7d 3e 7b 20 63 opts.rows }>{ c
0e50: 65 6c 6c 20 7d 3c 2f 74 64 3e 3c 2f 74 72 3e 0a ell }</td></tr>.
0e60: 3c 2f 74 61 67 2d 74 68 65 61 64 3e 0a 3c 74 61 </tag-thead>.<ta
0e70: 67 2d 74 66 6f 6f 74 3e 0a 20 20 3c 74 72 3e 3c g-tfoot>. <tr><
0e80: 74 64 20 65 61 63 68 3d 7b 20 63 65 6c 6c 20 69 td each={ cell i
0e90: 6e 20 6f 70 74 73 2e 72 6f 77 73 20 7d 3e 7b 20 n opts.rows }>{
0ea0: 63 65 6c 6c 20 7d 3c 2f 74 64 3e 3c 2f 74 72 3e cell }</td></tr>
0eb0: 0a 3c 2f 74 61 67 2d 74 66 6f 6f 74 3e 0a 3c 74 .</tag-tfoot>.<t
0ec0: 61 67 2d 74 62 6f 64 79 3e 0a 20 20 3c 74 72 20 ag-tbody>. <tr
0ed0: 65 61 63 68 3d 7b 20 72 6f 77 20 69 6e 20 6f 70 each={ row in op
0ee0: 74 73 2e 72 6f 77 73 20 7d 3e 0a 20 20 20 20 3c ts.rows }>. <
0ef0: 74 64 20 65 61 63 68 3d 7b 20 63 65 6c 6c 20 69 td each={ cell i
0f00: 6e 20 72 6f 77 20 7d 3e 7b 20 63 65 6c 6c 20 7d n row }>{ cell }
0f10: 3c 2f 74 64 3e 0a 20 20 3c 2f 74 72 3e 0a 3c 2f </td>. </tr>.</
0f20: 74 61 67 2d 74 62 6f 64 79 3e 0a tag-tbody>.