2b:null 2c:["$","title",null,{"children":"Fancy tables | Tom MacWright | Observable"}] 31:T6b2,renderTable = (data, humanize = defaultHumanize, nully = () => '-') => { let columns = Object.keys(data[0]).map(name => ({ name, type: typeof data[0][name], decimalNumber: data.reduce((memo, d) => { if (typeof d[name] === 'number') { let frac = (d[name] || '').toString().split('.')[1]; if (frac) return Math.max(memo, frac.length); } return memo; }, 0) })); return html` ${columns.map(c => ``).join('')} ${data.slice(0, 250).map(datum => ` ${columns.map(c => { let val = datum[c.name]; if (c.decimalNumber && typeof val === 'number') { return ``; } if (val == null || val == undefined) val = nully(val); return ``; }).join('')} `).join('')}

${humanize(c.name)}
${val.toFixed(c.decimalNumber)}	${val}

${data.length > 250 ? `

This table has been truncated from ${data.length} rows to 250

` : ''}` }32:[] 2f:{"id":"7be8c807496b59ec","slug":"fancy-tables","title":"Fancy tables","thumbnail":"a1f528cc7f2c02e312fa0072811ca3f7e491a321921706d3657c0240608c01d8","access_level":"public","create_time":"$D2018-01-09T00:30:25.787Z","update_time":"$D2018-01-09T01:25:14.921Z","view_time":null,"first_public_time":"$D2018-01-09T01:25:18.402Z","fork":false,"stars":8,"starred":false,"owner":{"type":"team","id":"b47c3705cfcd7c1b","login":"tmcw","name":"Tom MacWright","avatar_url":"https://avatars-next.observableusercontent.com/669bdd774da8a1b9c1b7706ecbc1ea5136b9932c3d5e86b753aa5a098005f674","tier":"starter_2024"},"version":144,"publish_version":144,"role":null,"authored":false,"authors":[{"type":"individual","id":"0bf14b8d9c6eb88a","login":"tmcw","name":"Tom MacWright","avatar_url":"https://avatars-next.observableusercontent.com/669bdd774da8a1b9c1b7706ecbc1ea5136b9932c3d5e86b753aa5a098005f674","tier":null}],"members":[{"type":"individual","id":"0bf14b8d9c6eb88a","login":"tmcw","name":"Tom MacWright","avatar_url":"https://avatars-next.observableusercontent.com/669bdd774da8a1b9c1b7706ecbc1ea5136b9932c3d5e86b753aa5a098005f674","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":17,"collection":null,"type":"notebook","body":{"title":"Fancy tables","cells":[{"id":0,"value":"md`# Fancy tables`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":85,"value":"md`### Tweaks\n\n- Automatically right-align number columns\n- Humanize headers by default by replacing _ and - with ' '\n- Add 20px horizontal padding to non-first/last cells\n- Nice placeholder for null values\n- Tabular figures for number columns\n- Detects precision of columns and if they have decimal parts, sets toFixed with that for all values\n\nNote\n\n- It's weird that tabular figures don't have monospace decimal marks\n\n- TODO: comma-formatting for numbers, probably using d3\n- TOOD: consistent date formatting\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":137,"value":"renderTable(dji)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":42,"value":"renderTable(cars)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":65,"value":"defaultHumanize = str => str.replace(/[-_]/g, ' ')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":18,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":3,"value":"cars = require('@observablehq/cars')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":138,"value":"dji = require('@observablehq/dji')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"}],"files":"$W32","stdlib":"1","titling":"auto"}} 30:"$2f:body"