Support label schemes in model directory

website/src/components/table.js

@@ -45,9 +45,10 @@ function isFootRow(children) {
 export const Table = props => <table className={classes.root} {...props} />
 export const Th = props => <th className={classes.th} {...props} />
 
-export const Tr = ({ children, ...props }) => {
+export const Tr = ({ evenodd = true, children, ...props }) => {
     const foot = isFootRow(children)
-    const trClasssNames = classNames(classes.tr, {
+    const trClasssNames = classNames({
+        [classes.tr]: evenodd,
         [classes.footer]: foot,
         'table-footer': foot,
     })

website/src/styles/grid.module.sass

@@ -37,5 +37,5 @@ $flex-gap: 2rem
 .narrow
     grid-column-gap: $grid-gap-narrow
 
-.spacing
+.spacing:not(:empty)
     margin-bottom: var(--spacing-md)

website/src/templates/models.js

@@ -14,6 +14,7 @@ import Icon from '../components/icon'
 import Link from '../components/link'
 import Grid from '../components/grid'
 import Infobox from '../components/infobox'
+import Accordion from '../components/accordion'
 import { join, arrayToObj, abbrNum, markdownToReact } from '../components/util'
 
 const MODEL_META = {
@@ -43,6 +44,12 @@ const MODEL_META = {
     compat: 'Latest compatible model version for your spaCy installation',
 }
 
+const LABEL_SCHEME_META = {
+    tagger: 'Part-of-speech tags via Token.tag_',
+    parser: 'Dependency labels via Token.dep_',
+    ner: 'Named entity labels',
+}
+
 const MARKDOWN_COMPONENTS = {
     code: InlineCode,
 }
@@ -140,6 +147,7 @@ const Model = ({ name, langId, langName, baseUrl, repo, compatibility, hasExampl
     const licenseUrl = licenses[meta.license] ? licenses[meta.license].url : null
     const license = licenseUrl ? <Link to={licenseUrl}>{meta.license}</Link> : meta.license
     const hasInteractiveCode = size === 'sm' && hasExamples && !isError
+    const labels = meta.labels
 
     const rows = [
         { label: 'Language', tag: langId, content: langName },
@@ -218,7 +226,7 @@ const Model = ({ name, langId, langName, baseUrl, repo, compatibility, hasExampl
                     )}
                 </tbody>
             </Table>
-            <Grid cols={2} gutterBottom={hasInteractiveCode}>
+            <Grid cols={2} gutterBottom={hasInteractiveCode || labels}>
                 {accuracy &&
                     accuracy.map(({ label, items }, i) =>
                         !items ? null : (
@@ -260,6 +268,42 @@ const Model = ({ name, langId, langName, baseUrl, repo, compatibility, hasExampl
                     ].join('\n')}
                 </CodeBlock>
             )}
+            {labels && (
+                <Accordion title="Label Scheme">
+                    <p>
+                        The statistical components included in this model package assign the
+                        following labels. The labels are specific to the corpus that the model was
+                        trained on. To see the description of a label, you can use{' '}
+                        <Link to="/api/top-level#spacy.explain">
+                            <InlineCode>spacy.explain</InlineCode>
+                        </Link>
+                        .
+                    </p>
+                    <Table>
+                        {Object.keys(labels).map(pipe => {
+                            const labelNames = labels[pipe] || []
+                            const help = LABEL_SCHEME_META[pipe]
+                            return (
+                                <Tr key={pipe} evenodd={false}>
+                                    <Td nowrap>
+                                        <Label>
+                                            {pipe} {help && <Help>{help}</Help>}
+                                        </Label>
+                                    </Td>
+                                    <Td>
+                                        {labelNames.map((label, i) => (
+                                            <>
+                                                {i > 0 && ', '}
+                                                <InlineCode key={label}>{label}</InlineCode>
+                                            </>
+                                        ))}
+                                    </Td>
+                                </Tr>
+                            )
+                        })}
+                    </Table>
+                </Accordion>
+            )}
         </Section>
     )
 }