Update to Lit 2.0.0 (manually)

Will attempt to get this back to syncing with monorepo history per https://github.com/lit/lit#exporting-starter-templates in a follow-up.
This commit is contained in:
Kevin Schaaf
2021-09-20 21:01:02 -07:00
parent 1f62cf47ed
commit a2c387402d
19 changed files with 31059 additions and 28678 deletions

View File

@@ -11,80 +11,117 @@ module.exports = class Docs {
}
render(data) {
const customElements = data.api['11tydata'].customElements;
const tags = customElements.tags;
const manifest = data.api['11tydata'].customElements;
const elements = manifest.modules.reduce(
(els, module) =>
els.concat(
module.declarations?.filter((dec) => dec.customElement) ?? []
),
[]
);
return `
<h1>API</h1>
${tags
.map(
(tag) => `
<h2>&lt;${tag.name}></h2>
<div>
${tag.description}
</div>
${renderTable(
'Attributes',
['name', 'description', 'type', 'default'],
tag.attributes
)}
${renderTable(
'Properties',
['name', 'attribute', 'description', 'type', 'default'],
tag.properties
)}
${
/*
* Methods are not output by web-component-analyzer yet (a bug), so
* this is a placeholder so that at least _something_ will be output
* when that is fixed, and element maintainers will hopefully have a
* signal to update this file to add the neccessary columns.
*/
renderTable('Methods', ['name', 'description'], tag.methods)
}
${renderTable('Events', ['name', 'description'], tag.events)}
${renderTable('Slots', ['name', 'description'], tag.slots)}
${renderTable(
'CSS Shadow Parts',
['name', 'description'],
tag.cssParts
)}
${renderTable(
'CSS Custom Properties',
['name', 'description'],
tag.cssProperties
)}
`
)
.join('')}
`;
<h1>API</h1>
${elements
.map(
(element) => `
<h2>&lt;${element.tagName}></h2>
<div>
${element.description}
</div>
${renderTable(
'Attributes',
['name', 'description', 'type.text', 'default'],
element.attributes
)}
${renderTable(
'Properties',
['name', 'attribute', 'description', 'type.text', 'default'],
element.members.filter((m) => m.kind === 'field')
)}
${renderTable(
'Methods',
['name', 'parameters', 'description', 'return.type.text'],
element.members
.filter((m) => m.kind === 'method' && m.privacy !== 'private')
.map((m) => ({
...m,
parameters: renderTable(
'',
['name', 'description', 'type.text'],
m.parameters
),
}))
)}
${renderTable('Events', ['name', 'description'], element.events)}
${renderTable(
'Slots',
[['name', '(default)'], 'description'],
element.slots
)}
${renderTable(
'CSS Shadow Parts',
['name', 'description'],
element.cssParts
)}
${renderTable(
'CSS Custom Properties',
['name', 'description'],
element.cssProperties
)}
`
)
.join('')}
`;
}
};
/**
* Reads a (possibly deep) path off of an object.
*/
const get = (obj, path) => {
let fallback = '';
if (Array.isArray(path)) {
[path, fallback] = path;
}
const parts = path.split('.');
while (obj && parts.length) {
obj = obj[parts.shift()];
}
return obj == null || obj === '' ? fallback : obj;
};
/**
* Renders a table of data, plucking the given properties from each item in
* `data`.
*/
const renderTable = (name, properties, data) => {
if (data === undefined) {
if (data === undefined || data.length === 0) {
return '';
}
return `
<h3>${name}</h3>
<table>
<tr>
${properties.map((p) => `<th>${capitalize(p)}</th>`).join('')}
</tr>
${data
.map(
(i) => `
<tr>
${properties.map((p) => `<td>${i[p]}</td>`).join('')}
</tr>
`
)
.join('')}
</table>
`;
${name ? `<h3>${name}</h3>` : ''}
<table>
<tr>
${properties
.map(
(p) =>
`<th>${capitalize(
(Array.isArray(p) ? p[0] : p).split('.')[0]
)}</th>`
)
.join('')}
</tr>
${data
.map(
(i) => `
<tr>
${properties.map((p) => `<td>${get(i, p)}</td>`).join('')}
</tr>
`
)
.join('')}
</table>
`;
};
const capitalize = (s) => s[0].toUpperCase() + s.substring(1);