@tartaguti/ui-components 0.0.0-stage → 0.1.0

package/vscode.html-custom-data.json

@@ -0,0 +1,2907 @@
+{
+  "version": 1.1,
+  "tags": [
+    {
+      "name": "tt-accordion",
+      "description": "Groups `tt-accordion-item` children and owns which of them are open:\n\n  <tt-accordion>\n    <tt-accordion-item heading=\"Shipping\">...</tt-accordion-item>\n    <tt-accordion-item heading=\"Returns\">...</tt-accordion-item>\n  </tt-accordion>\n\nBy default one item is open at a time. Set `multiple` to let them stack.\nClicking an open header always closes it.\n\n**Events:** tt-accordion-change",
+      "attributes": [
+        {
+          "name": "multiple",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-accordion>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-accordion-item",
+      "description": "One row of a `tt-accordion`.\n\nIt deliberately does not own `open`. Clicking the header fires\n`tt-accordion-toggle` and the parent decides what happens, which is what\nmakes single-open mode possible: only the parent can know that opening\nthis item has to close another one.\n\nUsed on its own it will not open, because nothing is listening.\n\n**Events:** tt-accordion-toggle",
+      "attributes": [
+        {
+          "name": "open",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-accordion-item>`"
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-accordion-item>`"
+        },
+        {
+          "name": "heading",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-accordion-item>`"
+        },
+        {
+          "name": "value",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-accordion-item>`"
+        },
+        {
+          "name": "heading-level",
+          "description": "Type: `number`\n\nDefault: `3`\n\nOn `<tt-accordion-item>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-alert",
+      "description": "A message that stays on the page, in context.\n\nNot the same thing as tt-toast. A toast is transient and global: \"saved\".\nAn alert is persistent and local: it sits next to the thing it is about\nand stays until the situation changes. Use an alert for \"this listing is\nunverified\" or \"your trial ends in 3 days\".\n\n**Events:** tt-close",
+      "attributes": [
+        {
+          "name": "variant",
+          "description": "Type: `AlertVariant`\n\nDefault: `\"neutral\"`\n\nOn `<tt-alert>`",
+          "values": [
+            {
+              "name": "neutral"
+            },
+            {
+              "name": "info"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            },
+            {
+              "name": "danger"
+            }
+          ]
+        },
+        {
+          "name": "heading",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-alert>`"
+        },
+        {
+          "name": "closable",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-alert>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-aspect-ratio",
+      "description": "Holds a box at a fixed width-to-height ratio.\n\nFor anything whose height must be known before its content arrives: a\nvideo embed, a map, an image placeholder, a chart. Without it the page\nreflows the moment the content loads, which is the single largest\ncause of layout shift on a media-heavy page.\n\n---------------------------------------------------------------------\nWHY THIS IS NOT JUST `aspect-ratio` IN YOUR OWN CSS.\n\nIt nearly is, and if you control the CSS you should write it yourself.\nThis exists for the case where you do not: slotted content, a block\nsomeone copied, a cell inside a grid. It also solves the part people\nget wrong, which is that `aspect-ratio` alone does nothing unless the\nCHILD is told to fill the box. That is the `::slotted` rule below and\nit is the whole reason this is a component.\n\n---------------------------------------------------------------------\nON THE `ratio` FORMAT.\n\nTakes \"16/9\" or \"1.777\". Both land in the same CSS property, which\naccepts either. The string form is kept because \"16/9\" is what the\nratio is CALLED, and a reader recognising it at a glance is worth more\nthan saving a division.",
+      "attributes": [
+        {
+          "name": "ratio",
+          "description": "Type: `string`\n\nDefault: `\"16/9\"`\n\nOn `<tt-aspect-ratio>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-auth",
+      "description": "The four screens every application needs, as one component.\n\nOne element with a `mode` rather than four elements, the same choice\ntt-product and tt-profile-card make with `orientation`. All four share\na card, a heading, an error region and a footer; only the fields and\nthe event differ. Four components would repeat that shell four times\nand let it drift.\n\nIT NEVER TALKS TO A SERVER AND NEVER DECIDES ANYTHING. It reports what\nwas typed and what was asked for. Whether the credentials are valid,\nwhether the account exists, and what happens next all belong to\nwhoever is using it. That is what keeps it usable against any backend.\n\nThe events, for the custom-elements manifest. Its analyzer reads event\nnames from string literals at the dispatch site, and these are chosen at\nrun time, so without the tags the manifest listed a bogus event instead.\n\n**Events:** tt-sign-in, tt-sign-up, tt-forgot, tt-reset, tt-mode",
+      "attributes": [
+        {
+          "name": "mode",
+          "description": "Type: `AuthMode`\n\nDefault: `\"signIn\"`\n\nOn `<tt-auth>`",
+          "values": [
+            {
+              "name": "signIn"
+            },
+            {
+              "name": "signUp"
+            },
+            {
+              "name": "forgotPsw"
+            },
+            {
+              "name": "resetPsw"
+            }
+          ]
+        },
+        {
+          "name": "heading",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-auth>`"
+        },
+        {
+          "name": "description",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-auth>`"
+        },
+        {
+          "name": "submit-label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-auth>`"
+        },
+        {
+          "name": "email-label",
+          "description": "Type: `string`\n\nDefault: `\"Email\"`\n\nOn `<tt-auth>`"
+        },
+        {
+          "name": "password-label",
+          "description": "Type: `string`\n\nDefault: `\"Password\"`\n\nOn `<tt-auth>`"
+        },
+        {
+          "name": "name-label",
+          "description": "Type: `string`\n\nDefault: `\"Full name\"`\n\nOn `<tt-auth>`"
+        },
+        {
+          "name": "email",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-auth>`"
+        },
+        {
+          "name": "name",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-auth>`"
+        },
+        {
+          "name": "remember-me",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-auth>`"
+        },
+        {
+          "name": "loading",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-auth>`"
+        },
+        {
+          "name": "sent",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-auth>`"
+        },
+        {
+          "name": "error",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-auth>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-avatar",
+      "description": "Image with an initials fallback. The fallback is the entire point:\nlogos and profile photos fail to load constantly, and a broken image\nicon is the difference between a product that looks maintained and one\nthat does not.",
+      "attributes": [
+        {
+          "name": "src",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-avatar>`"
+        },
+        {
+          "name": "name",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-avatar>`"
+        },
+        {
+          "name": "size",
+          "description": "Type: `AvatarSize`\n\nDefault: `\"medium\"`\n\nOn `<tt-avatar>`",
+          "values": [
+            {
+              "name": "small"
+            },
+            {
+              "name": "medium"
+            },
+            {
+              "name": "large"
+            }
+          ]
+        },
+        {
+          "name": "square",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-avatar>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-badge",
+      "description": "A small status label. Presentational only: it displays state, it never\nowns it.\n\nTHREE THINGS THAT WERE WRONG AND ARE WORTH KNOWING.\n\nline-height was 1.5. On a pill that is not a paragraph, an inherited\nbody line-height adds invisible space above and below the text, so the\nbadge came out taller than it looked and sat off-centre next to a name.\nA pill sets line-height: 1 and gets its height from padding, which is\nthe only way the height is predictable.\n\nneutral was --tt-muted-foreground mixed 14% into transparent, which is\na grey wash of a grey. Neutral is the most common variant and it looked\nlike a rendering mistake. It now uses the real muted surface.\n\nwhite-space: nowrap with no escape meant a long label pushed its way\nout of whatever contained it. It still refuses to wrap, because a badge\nthat wraps stops being a badge, but it now truncates instead of\noverflowing.",
+      "attributes": [
+        {
+          "name": "variant",
+          "description": "Type: `BadgeVariant`\n\nDefault: `\"neutral\"`\n\nOn `<tt-badge>`",
+          "values": [
+            {
+              "name": "neutral"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            },
+            {
+              "name": "danger"
+            }
+          ]
+        },
+        {
+          "name": "size",
+          "description": "Type: `BadgeSize`\n\nDefault: `\"medium\"`\n\nOn `<tt-badge>`",
+          "values": [
+            {
+              "name": "small"
+            },
+            {
+              "name": "medium"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "tt-bento",
+      "description": "The grid net. Tiles span whole cells of it, so a composition reads as a\ndeliberate arrangement rather than a row of equal boxes:\n\n  <tt-bento>\n    <tt-stat bento-span=\"6\" bento-rows=\"4\"></tt-stat>\n    <tt-bento-item bento-span=\"2\" bento-rows=\"2\">module</tt-bento-item>\n  </tt-bento>\n\nIt measures ITSELF, not the viewport, so a bento in a sidebar and a bento\non a full page get the right column count with neither knowing where it\nis. Cells are square, so a span and a row count describe a shape.",
+      "attributes": [
+        {
+          "name": "columns",
+          "description": "Type: `12 | 24`\n\nDefault: `12`\n\nOn `<tt-bento>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-bento-item",
+      "description": "A tile surface for a `tt-bento`.\n\nIt owns no placement. `bento-span` and `bento-rows` are read by the grid\noff any direct child, so this component exists purely to give bare\ncontent a surface: background, border, the 2xl corner, padding, and the\nconcentric radius its own children read.\n\nAnything that already brings its own surface - a tt-card, a tt-stat, a\ntt-chart - goes straight into the grid and needs none of this:\n\n  <tt-bento>\n    <tt-stat bento-span=\"2\"></tt-stat>\n    <tt-bento-item bento-span=\"2\">bare content</tt-bento-item>\n  </tt-bento>",
+      "attributes": [
+        {
+          "name": "plain",
+          "description": "Drop the tile surface and render as a bare grid cell.\n\nType: `boolean`\n\nDefault: `false`\n\nOn `<tt-bento-item>`"
+        },
+        {
+          "name": "clickable",
+          "description": "The whole tile leads somewhere. Adds hover, focus and keyboard\nactivation. Named clickable, as on tt-card and tt-sidebar-footer.\n\nType: `boolean`\n\nDefault: `false`\n\nOn `<tt-bento-item>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-breadcrumbs",
+      "description": "Trail showing where the current page sits. Emits a navigation event\nrather than following links itself, so it works with a client router,\na server one, or neither.\n\n**Events:** tt-navigate",
+      "attributes": [
+        {
+          "name": "items",
+          "description": "Type: `Crumb[]`\n\nDefault: `[]`\n\nOn `<tt-breadcrumbs>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-button",
+      "description": "**Events:** tt-button-click",
+      "attributes": [
+        {
+          "name": "variant",
+          "description": "Type: `ButtonVariant`\n\nDefault: `\"primary\"`\n\nOn `<tt-button>`",
+          "values": [
+            {
+              "name": "primary"
+            },
+            {
+              "name": "secondary"
+            },
+            {
+              "name": "danger"
+            },
+            {
+              "name": "ghost"
+            }
+          ]
+        },
+        {
+          "name": "size",
+          "description": "Type: `ButtonSize`\n\nDefault: `\"medium\"`\n\nOn `<tt-button>`",
+          "values": [
+            {
+              "name": "small"
+            },
+            {
+              "name": "medium"
+            },
+            {
+              "name": "large"
+            }
+          ]
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-button>`"
+        },
+        {
+          "name": "loading",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-button>`"
+        },
+        {
+          "name": "full-width",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-button>`"
+        },
+        {
+          "name": "pill",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-button>`"
+        },
+        {
+          "name": "type",
+          "description": "Type: `ButtonType`\n\nDefault: `\"button\"`\n\nOn `<tt-button>`",
+          "values": [
+            {
+              "name": "button"
+            },
+            {
+              "name": "submit"
+            },
+            {
+              "name": "reset"
+            }
+          ]
+        },
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-button>`"
+        },
+        {
+          "name": "current",
+          "description": "Type: `ButtonCurrent | \"\"`\n\nDefault: `\"\"`\n\nOn `<tt-button>`"
+        },
+        {
+          "name": "expanded",
+          "description": "Type: `\"true\" | \"false\" | \"\"`\n\nDefault: `\"\"`\n\nOn `<tt-button>`",
+          "values": [
+            {
+              "name": "true"
+            },
+            {
+              "name": "false"
+            },
+            {
+              "name": ""
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "tt-button-group",
+      "description": "Attaches controls into one unit: the corners where they meet flatten,\nand their borders collapse onto a single shared edge.\n\nUse it when the buttons are alternatives to each other, or steps in one\ndecision. Do NOT use it as a way to save space between unrelated\nactions: joining \"Reload\" to \"Checkout\" tells the reader they belong\ntogether, and they do not. A plain flex row with a gap is right for\nthose, which is what tt-toolbar already does.\n\nHOW IT REACHES INSIDE ITS CHILDREN. Each control's radius lives on an\nelement in its own shadow root, and ::slotted() only ever matches the\nhost, never anything within it. So a group cannot restyle a button's\ncorners directly. What it can do is set a CUSTOM PROPERTY on the host,\nbecause custom properties inherit through the shadow boundary, and each\ngroupable control reads `--tt-group-radius` for its own radius. The\ngroup sets that per position, and the child applies it.\n\nWorks with tt-button, tt-dropdown-menu, tt-select and tt-input.",
+      "attributes": [
+        {
+          "name": "orientation",
+          "description": "Type: `\"horizontal\" | \"vertical\"`\n\nDefault: `\"horizontal\"`\n\nOn `<tt-button-group>`",
+          "values": [
+            {
+              "name": "horizontal"
+            },
+            {
+              "name": "vertical"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "tt-card",
+      "description": "",
+      "attributes": [
+        {
+          "name": "variant",
+          "description": "Type: `CardVariant`\n\nDefault: `\"default\"`\n\nOn `<tt-card>`",
+          "values": [
+            {
+              "name": "default"
+            },
+            {
+              "name": "outlined"
+            },
+            {
+              "name": "elevated"
+            }
+          ]
+        },
+        {
+          "name": "padding",
+          "description": "Type: `CardPadding`\n\nDefault: `\"medium\"`\n\nOn `<tt-card>`",
+          "values": [
+            {
+              "name": "none"
+            },
+            {
+              "name": "small"
+            },
+            {
+              "name": "medium"
+            },
+            {
+              "name": "large"
+            }
+          ]
+        },
+        {
+          "name": "radius",
+          "description": "Type: `CardRadius`\n\nDefault: `\"medium\"`\n\nOn `<tt-card>`",
+          "values": [
+            {
+              "name": "none"
+            },
+            {
+              "name": "small"
+            },
+            {
+              "name": "medium"
+            },
+            {
+              "name": "large"
+            },
+            {
+              "name": "xlarge"
+            }
+          ]
+        },
+        {
+          "name": "clickable",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-card>`"
+        },
+        {
+          "name": "inline",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-card>`"
+        },
+        {
+          "name": "heading",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-card>`"
+        },
+        {
+          "name": "description",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-card>`"
+        },
+        {
+          "name": "heading-level",
+          "description": "Type: `number`\n\nDefault: `3`\n\nOn `<tt-card>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-chart",
+      "description": "",
+      "attributes": [
+        {
+          "name": "type",
+          "description": "Type: `ChartType`\n\nDefault: `\"bar\"`\n\nOn `<tt-chart>`"
+        },
+        {
+          "name": "labels",
+          "description": "Type: `string[]`\n\nDefault: `[]`\n\nOn `<tt-chart>`"
+        },
+        {
+          "name": "series",
+          "description": "Type: `ChartSeries[]`\n\nDefault: `[]`\n\nOn `<tt-chart>`"
+        },
+        {
+          "name": "legend",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-chart>`"
+        },
+        {
+          "name": "stacked",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-chart>`"
+        },
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-chart>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-checkbox",
+      "description": "**Events:** tt-change",
+      "attributes": [
+        {
+          "name": "name",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-checkbox>`"
+        },
+        {
+          "name": "value",
+          "description": "Type: `string`\n\nDefault: `\"on\"`\n\nOn `<tt-checkbox>`"
+        },
+        {
+          "name": "checked",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-checkbox>`"
+        },
+        {
+          "name": "indeterminate",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-checkbox>`"
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-checkbox>`"
+        },
+        {
+          "name": "required",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-checkbox>`"
+        },
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-checkbox>`"
+        },
+        {
+          "name": "label-hidden",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-checkbox>`"
+        },
+        {
+          "name": "error",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-checkbox>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-checkbox-group",
+      "description": "**Events:** tt-change",
+      "attributes": [
+        {
+          "name": "name",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-checkbox-group>`"
+        },
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-checkbox-group>`"
+        },
+        {
+          "name": "label-hidden",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-checkbox-group>`"
+        },
+        {
+          "name": "options",
+          "description": "Type: `CheckboxGroupOption[]`\n\nDefault: `[]`\n\nOn `<tt-checkbox-group>`"
+        },
+        {
+          "name": "values",
+          "description": "Type: `string[]`\n\nDefault: `[]`\n\nOn `<tt-checkbox-group>`"
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-checkbox-group>`"
+        },
+        {
+          "name": "error",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-checkbox-group>`"
+        },
+        {
+          "name": "orientation",
+          "description": "Type: `\"horizontal\" | \"vertical\"`\n\nDefault: `\"vertical\"`\n\nOn `<tt-checkbox-group>`",
+          "values": [
+            {
+              "name": "horizontal"
+            },
+            {
+              "name": "vertical"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "tt-code-block",
+      "description": "",
+      "attributes": [
+        {
+          "name": "code",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-code-block>`"
+        },
+        {
+          "name": "language",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-code-block>`"
+        },
+        {
+          "name": "filename",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-code-block>`"
+        },
+        {
+          "name": "show-line-numbers",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-code-block>`"
+        },
+        {
+          "name": "tabs",
+          "description": "Type: `CodeTab[]`\n\nDefault: `[]`\n\nOn `<tt-code-block>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-collapsible",
+      "description": "One section that opens and closes. The plainest member of a family of\nthree, and the differences matter:\n\n  tt-collapsible     ONE section, no heading of its own, no styling.\n                     You supply the trigger. Use it to hide detail\n                     inside something else: \"show 3 more\", an advanced\n                     block in a form, a nested panel.\n  tt-accordion-item  a section WITH a styled heading button, meant to\n                     sit in a tt-accordion that coordinates siblings.\n  tt-menu-group      the sidebar's version, with its own uppercase\n                     heading and rail behaviour.\n\nReach for this one when you already have something to click and only\nneed the opening part.\n\n---------------------------------------------------------------------\nIT OWNS ITS OWN `open`, and that is deliberate.\n\nThe house rule is that a component reports intent and the owner\ndecides, which is why tt-accordion-item refuses to open itself: an\naccordion may need to close a sibling first, so the decision is not\nthe item's to make.\n\nNothing coordinates a collapsible. There is no sibling to close and no\nparent to ask, so a component that would not open itself would need a\nlistener on every single use to do the one thing it is for. It flips\nand then announces, the same shape as tt-switch and tt-menu-group.\n\nSet `open` from outside whenever you do want to own it; the property\nis the source of truth either way.\n\n---------------------------------------------------------------------\nTHE HEIGHT ANIMATION.\n\nA grid track from 0fr to 1fr, because nothing here knows how tall the\ncontent is and every max-height guess is either too small, which\nclips, or too large, which makes the close look slow and the open look\nlate.\n\nThe `overflow: hidden` on the inner element is NOT decoration. An fr\ntrack keeps an automatic minimum equal to its content unless the item\ninside opts out of it, so without that line the panel never collapses\nat all. That exact bug shipped in tt-menu-group and hid behind an\nopacity fade for a week.\n\nThe events, for the custom-elements manifest. Its analyzer reads event\nnames from string literals at the dispatch site, and these are chosen at\nrun time, so without the tags the manifest listed a bogus event instead.\n\n**Events:** tt-toggle, tt-open, tt-close",
+      "attributes": [
+        {
+          "name": "open",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-collapsible>`"
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-collapsible>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-combobox",
+      "description": "A select you can type into.\n\nWHERE IT SITS. tt-select is right up to roughly twenty options: you open\nit, you look, you pick. Past that, looking stops working and you need to\nnarrow the list by typing. That is the only difference in intent, but it\nchanges the control's shape: the trigger becomes a text input rather\nthan a button, which brings a filtering state, a no-results state, and\nthe problem below. Keeping tt-select simple was worth a second component.\n\nTHE AWKWARD BIT, which every combobox has to answer. One input has two\njobs: it displays the current selection, and it holds what you are\ntyping. Those conflict the moment you type, because the selection is\nstill set but the text no longer shows it.\n\nThis resolves it by treating the two as different modes rather than one\nvalue. Closed, the input shows the selected option's label. Open, it\nshows the query, which starts empty so the whole list is visible. Close\nwithout choosing and the query is discarded, so the field can never be\nleft displaying text that is not the actual value. The selection only\never changes by choosing an option.\n\n**Events:** tt-change",
+      "attributes": [
+        {
+          "name": "name",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-combobox>`"
+        },
+        {
+          "name": "value",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-combobox>`"
+        },
+        {
+          "name": "options",
+          "description": "Type: `SelectOption[]`\n\nDefault: `[]`\n\nOn `<tt-combobox>`"
+        },
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-combobox>`"
+        },
+        {
+          "name": "placeholder",
+          "description": "Type: `string`\n\nDefault: `\"Search or select\"`\n\nOn `<tt-combobox>`"
+        },
+        {
+          "name": "empty-text",
+          "description": "Type: `string`\n\nDefault: `\"No matches\"`\n\nOn `<tt-combobox>`"
+        },
+        {
+          "name": "error",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-combobox>`"
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-combobox>`"
+        },
+        {
+          "name": "required",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-combobox>`"
+        },
+        {
+          "name": "size",
+          "description": "Type: `\"small\" | \"medium\" | \"large\"`\n\nDefault: `\"medium\"`\n\nOn `<tt-combobox>`",
+          "values": [
+            {
+              "name": "small"
+            },
+            {
+              "name": "medium"
+            },
+            {
+              "name": "large"
+            }
+          ]
+        },
+        {
+          "name": "label-hidden",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-combobox>`"
+        },
+        {
+          "name": "clearable",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-combobox>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-company-card",
+      "description": "**Events:** tt-company-select, tt-company-action",
+      "attributes": [
+        {
+          "name": "value",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-company-card>`"
+        },
+        {
+          "name": "name",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-company-card>`"
+        },
+        {
+          "name": "logo",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-company-card>`"
+        },
+        {
+          "name": "verified",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-company-card>`"
+        },
+        {
+          "name": "city",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-company-card>`"
+        },
+        {
+          "name": "country",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-company-card>`"
+        },
+        {
+          "name": "description",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-company-card>`"
+        },
+        {
+          "name": "industry",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-company-card>`"
+        },
+        {
+          "name": "tags",
+          "description": "Type: `string[]`\n\nDefault: `[]`\n\nOn `<tt-company-card>`"
+        },
+        {
+          "name": "description-lines",
+          "description": "Type: `number`\n\nDefault: `2`\n\nOn `<tt-company-card>`"
+        },
+        {
+          "name": "actions",
+          "description": "Type: `MenuAction[]`\n\nDefault: `[]`\n\nOn `<tt-company-card>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-comparison-table",
+      "description": "Puts several things side by side against the same set of attributes.\n\nMost directories make you open two tabs and look back and forth. This\nis the component that removes that, which the notes call out as a\ngenuine differentiator, and it generalises well beyond suppliers:\npricing tiers, product specs, plan features.\n\nTWO THINGS MAKE IT ACTUALLY USEFUL rather than just a table turned on\nits side.\n\nFirst, the ROW LABELS ARE THE FIRST COLUMN and they stick while you\nscroll sideways. Comparing is a horizontal act, and a comparison where\nyou lose track of which attribute you are reading is worse than two\ntabs.\n\nSecond, `differencesOnly` hides every row where all items agree. On a\nprofile with thirty attributes, the four that differ are the entire\nquestion, and they are invisible among the twenty-six that do not.\n\nBooleans render as a tick or a dash rather than the words true and\nfalse, because a column of ticks is scannable and a column of \"true\" is\nnot.\n\n**Events:** tt-remove",
+      "attributes": [
+        {
+          "name": "rows",
+          "description": "Type: `CompareRow[]`\n\nDefault: `[]`\n\nOn `<tt-comparison-table>`"
+        },
+        {
+          "name": "items",
+          "description": "Type: `CompareItem[]`\n\nDefault: `[]`\n\nOn `<tt-comparison-table>`"
+        },
+        {
+          "name": "differences-only",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-comparison-table>`"
+        },
+        {
+          "name": "removable",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-comparison-table>`"
+        },
+        {
+          "name": "empty-text",
+          "description": "Type: `string`\n\nDefault: `\"Nothing to compare yet\"`\n\nOn `<tt-comparison-table>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-component-doc",
+      "description": "**Events:** tt-doc-link",
+      "attributes": [
+        {
+          "name": "heading",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-component-doc>`"
+        },
+        {
+          "name": "description",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-component-doc>`"
+        },
+        {
+          "name": "code",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-component-doc>`"
+        },
+        {
+          "name": "props",
+          "description": "Type: `TableRow[]`\n\nDefault: `[]`\n\nOn `<tt-component-doc>`"
+        },
+        {
+          "name": "events",
+          "description": "Type: `TableRow[]`\n\nDefault: `[]`\n\nOn `<tt-component-doc>`"
+        },
+        {
+          "name": "methods",
+          "description": "Type: `TableRow[]`\n\nDefault: `[]`\n\nOn `<tt-component-doc>`"
+        },
+        {
+          "name": "slots",
+          "description": "Type: `TableRow[]`\n\nDefault: `[]`\n\nOn `<tt-component-doc>`"
+        },
+        {
+          "name": "parts",
+          "description": "Type: `TableRow[]`\n\nDefault: `[]`\n\nOn `<tt-component-doc>`"
+        },
+        {
+          "name": "css-properties",
+          "description": "Type: `TableRow[]`\n\nDefault: `[]`\n\nOn `<tt-component-doc>`"
+        },
+        {
+          "name": "import-path",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-component-doc>`"
+        },
+        {
+          "name": "anatomy",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-component-doc>`"
+        },
+        {
+          "name": "examples",
+          "description": "Type: `DocExample[]`\n\nDefault: `[]`\n\nOn `<tt-component-doc>`"
+        },
+        {
+          "name": "guidelines",
+          "description": "Type: `DocGuidelines | null`\n\nDefault: `null`\n\nOn `<tt-component-doc>`"
+        },
+        {
+          "name": "accessibility",
+          "description": "Type: `DocAccessibility | null`\n\nDefault: `null`\n\nOn `<tt-component-doc>`"
+        },
+        {
+          "name": "related",
+          "description": "Type: `DocRelated[]`\n\nDefault: `[]`\n\nOn `<tt-component-doc>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-confirm",
+      "description": "Confirmation dialog with a promise-based API. Mount one near the app\nroot, then anywhere else:\n\n  if (await confirm({ heading: \"Delete request?\", danger: true })) {\n    ...\n  }\n\nThe promise is the point. The alternative is a dialog component plus\nopen state plus two event handlers plus a variable remembering what you\nwere about to do, spread across every caller. Here the decision reads\nas one line, in the order it happens.",
+      "attributes": []
+    },
+    {
+      "name": "tt-contact-list",
+      "description": "",
+      "attributes": [
+        {
+          "name": "contacts",
+          "description": "Type: `Contact[]`\n\nDefault: `[]`\n\nOn `<tt-contact-list>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-copy-button",
+      "description": "Copies a string to the clipboard and confirms it in place.\n\nThe confirmation matters more than the copying: without it nobody knows\nwhether the click worked, and they click again.\n\n**Events:** tt-copy",
+      "attributes": [
+        {
+          "name": "value",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-copy-button>`"
+        },
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"Copy\"`\n\nOn `<tt-copy-button>`"
+        },
+        {
+          "name": "copied-label",
+          "description": "Type: `string`\n\nDefault: `\"Copied\"`\n\nOn `<tt-copy-button>`"
+        },
+        {
+          "name": "icon-only",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-copy-button>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-data-table",
+      "description": "Working table: sorting, selection, row actions, sticky header, and\nloading and empty states.\n\nIt owns nothing. Sort state and selection come in as properties and\nchanges go out as events, so the page stays the single source of truth\nand can put either in a URL. Sorting itself is the page's job too: it\nknows whether the data is an in-memory array or a server query.\n\n**Events:** tt-selection-change, tt-sort, tt-row-click, tt-row-action",
+      "attributes": [
+        {
+          "name": "columns",
+          "description": "Type: `DataColumn[]`\n\nDefault: `[]`\n\nOn `<tt-data-table>`"
+        },
+        {
+          "name": "rows",
+          "description": "Type: `DataRow[]`\n\nDefault: `[]`\n\nOn `<tt-data-table>`"
+        },
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-data-table>`"
+        },
+        {
+          "name": "sort",
+          "description": "Type: `SortState | undefined`\n\nOn `<tt-data-table>`"
+        },
+        {
+          "name": "selectable",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-data-table>`"
+        },
+        {
+          "name": "selected",
+          "description": "Type: `string[]`\n\nDefault: `[]`\n\nOn `<tt-data-table>`"
+        },
+        {
+          "name": "row-actions",
+          "description": "Type: `MenuAction[]`\n\nDefault: `[]`\n\nOn `<tt-data-table>`"
+        },
+        {
+          "name": "loading",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-data-table>`"
+        },
+        {
+          "name": "loading-rows",
+          "description": "Type: `number`\n\nDefault: `5`\n\nOn `<tt-data-table>`"
+        },
+        {
+          "name": "empty-heading",
+          "description": "Type: `string`\n\nDefault: `\"Nothing here yet\"`\n\nOn `<tt-data-table>`"
+        },
+        {
+          "name": "empty-description",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-data-table>`"
+        },
+        {
+          "name": "clickable-rows",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-data-table>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-divider",
+      "description": "A separating line, optionally with a label in the middle.\n\nTrivial, and worth having: without it every page writes its own\nborder-top with slightly different spacing, and the product drifts.",
+      "attributes": [
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-divider>`"
+        },
+        {
+          "name": "vertical",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-divider>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-drawer",
+      "description": "A panel that slides in over the page.\n\nUse it instead of a modal when the thing behind still matters: editing\na row without losing your place in the list, or a filter panel you\nadjust while watching results change. A modal says \"deal with this\nfirst\"; a drawer says \"here is more, the list is still there\".\n\n**Events:** tt-close",
+      "attributes": [
+        {
+          "name": "open",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-drawer>`"
+        },
+        {
+          "name": "side",
+          "description": "Type: `DrawerSide`\n\nDefault: `\"right\"`\n\nOn `<tt-drawer>`",
+          "values": [
+            {
+              "name": "right"
+            },
+            {
+              "name": "left"
+            },
+            {
+              "name": "bottom"
+            }
+          ]
+        },
+        {
+          "name": "heading",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-drawer>`"
+        },
+        {
+          "name": "size",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-drawer>`"
+        },
+        {
+          "name": "persistent",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-drawer>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-dropdown-menu",
+      "description": "Actions attached to a thing: the row menu behind a table's dots button,\nor a settings menu in a header.\n\nDistinct from tt-select. A select edits a value and shows what is\ncurrently chosen; a menu performs an action and remembers nothing.\n\n**Events:** tt-menu-select",
+      "attributes": [
+        {
+          "name": "items",
+          "description": "Type: `MenuAction[]`\n\nDefault: `[]`\n\nOn `<tt-dropdown-menu>`"
+        },
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"Actions\"`\n\nOn `<tt-dropdown-menu>`"
+        },
+        {
+          "name": "align",
+          "description": "Type: `\"start\" | \"end\"`\n\nDefault: `\"end\"`\n\nOn `<tt-dropdown-menu>`",
+          "values": [
+            {
+              "name": "start"
+            },
+            {
+              "name": "end"
+            }
+          ]
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-dropdown-menu>`"
+        },
+        {
+          "name": "size",
+          "description": "Type: `\"small\" | \"medium\" | \"large\"`\n\nDefault: `\"small\"`\n\nOn `<tt-dropdown-menu>`",
+          "values": [
+            {
+              "name": "small"
+            },
+            {
+              "name": "medium"
+            },
+            {
+              "name": "large"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "tt-empty-state",
+      "description": "",
+      "attributes": [
+        {
+          "name": "heading",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-empty-state>`"
+        },
+        {
+          "name": "description",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-empty-state>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-example",
+      "description": "One worked example: a live rendering and the markup that produced it,\nbehind a Preview / Code switch.\n\n  <tt-example heading=\"Multiple open\" code=${snippet}>\n    <tt-accordion multiple>...</tt-accordion>\n  </tt-example>\n\nThe point is that the two halves cannot drift apart on the page the way a\nseparate preview box and a separate code block do. Both panels stay in the\nDOM and are toggled with `hidden`, so switching does not tear down and\nrebuild a live component you were in the middle of poking at.",
+      "attributes": [
+        {
+          "name": "heading",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-example>`"
+        },
+        {
+          "name": "description",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-example>`"
+        },
+        {
+          "name": "code",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-example>`"
+        },
+        {
+          "name": "language",
+          "description": "Type: `string`\n\nDefault: `\"html\"`\n\nOn `<tt-example>`"
+        },
+        {
+          "name": "align",
+          "description": "Type: `\"center\" | \"start\" | \"stretch\"`\n\nDefault: `\"center\"`\n\nOn `<tt-example>`",
+          "values": [
+            {
+              "name": "center"
+            },
+            {
+              "name": "start"
+            },
+            {
+              "name": "stretch"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "tt-file-upload",
+      "description": "Chooses files, by tapping a button or dropping them on the box. Checks\ntype, size and count before keeping a file, previews images, and\nsubmits the files with its form under `name`.\n\n**Events:** tt-change, tt-reject",
+      "attributes": [
+        {
+          "name": "name",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-file-upload>`"
+        },
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-file-upload>`"
+        },
+        {
+          "name": "label-hidden",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-file-upload>`"
+        },
+        {
+          "name": "description",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-file-upload>`"
+        },
+        {
+          "name": "accept",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-file-upload>`"
+        },
+        {
+          "name": "multiple",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-file-upload>`"
+        },
+        {
+          "name": "max-size",
+          "description": "Type: `number`\n\nDefault: `0`\n\nOn `<tt-file-upload>`"
+        },
+        {
+          "name": "max-files",
+          "description": "Type: `number`\n\nDefault: `0`\n\nOn `<tt-file-upload>`"
+        },
+        {
+          "name": "required",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-file-upload>`"
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-file-upload>`"
+        },
+        {
+          "name": "error",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-file-upload>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-filter",
+      "description": "One facet of a filter set: a pill that says what it filters, how many\nare picked, and opens a list of checkboxes.\n\nWHY THIS IS NOT A VARIANT OF SOMETHING ELSE. The library already has\ntwo things that open a list, and this is neither of them:\n\n  tt-dropdown-menu  performs an action and REMEMBERS NOTHING. It closes\n                    on choose because the choice is the whole event.\n  tt-select         edits ONE value and displays the chosen one.\n  tt-filter         holds a SET, stays open while you build it, and\n                    reports the whole set.\n\nBending either of the first two into this would have cost them the\nproperty that makes them easy to reason about.\n\nIt composes tt-checkbox-group rather than reimplementing checkboxes, and\nkeeps that component's contract: values come in, tt-change goes out\ncarrying the COMPLETE new array, and this component owns nothing.\n\nLaid out as a pill with a count because a filter has to be readable when\nit is closed. A row of loose checkboxes says what the options are; a\npill says what is actually filtering, which is the thing you need to\nknow when you are looking at a result set and wondering why.\n\n**Events:** tt-change",
+      "attributes": [
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-filter>`"
+        },
+        {
+          "name": "options",
+          "description": "Type: `CheckboxGroupOption[]`\n\nDefault: `[]`\n\nOn `<tt-filter>`"
+        },
+        {
+          "name": "values",
+          "description": "Type: `string[]`\n\nDefault: `[]`\n\nOn `<tt-filter>`"
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-filter>`"
+        },
+        {
+          "name": "align",
+          "description": "Type: `\"start\" | \"end\"`\n\nDefault: `\"start\"`\n\nOn `<tt-filter>`",
+          "values": [
+            {
+              "name": "start"
+            },
+            {
+              "name": "end"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "tt-form",
+      "description": "**Events:** tt-form-submit, tt-form-reset",
+      "attributes": [
+        {
+          "name": "name",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-form>`"
+        },
+        {
+          "name": "layout",
+          "description": "Type: `FormLayout`\n\nDefault: `\"vertical\"`\n\nOn `<tt-form>`",
+          "values": [
+            {
+              "name": "vertical"
+            },
+            {
+              "name": "horizontal"
+            }
+          ]
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-form>`"
+        },
+        {
+          "name": "loading",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-form>`"
+        },
+        {
+          "name": "novalidate",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-form>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-grid",
+      "description": "Responsive grid. By default it auto-fills as many columns as will fit\nat `minWidth`, so it reflows without media queries. Set `columns` for a\nfixed count instead.",
+      "attributes": [
+        {
+          "name": "min-width",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-grid>`"
+        },
+        {
+          "name": "gap",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-grid>`"
+        },
+        {
+          "name": "columns",
+          "description": "Type: `number`\n\nDefault: `0`\n\nOn `<tt-grid>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-icon",
+      "description": "",
+      "attributes": [
+        {
+          "name": "name",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-icon>`"
+        },
+        {
+          "name": "size",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-icon>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-image",
+      "description": "An image in a box the PARENT sizes.\n\nSix properties, and each one answers a question you actually have when\nyou place an image: how big is the box (ratio), what happens to a photo\nthat is not that shape (fit), what are the corners (radius), and is\nthis the one image worth loading early (priority).\n\nThere is deliberately no size scale. The host is a block that fills its\ncontainer, so a card wanting a 34px logo says 34px in its own CSS and\nwins, because rules from the tree that owns an element beat that\nelement's :host. A fixed scale here (icon, profile, small, medium,\nlarge) was five pixel values from one app baked into a library meant\nfor apps that do not exist yet, and three consumers ended up reaching\nthrough ::part just to undo it.\n\nThe other half of the job is that real images fail, arrive late, or\narrive already cached, so the load is treated as state: a skeleton\nwhile it downloads, a fallback if it never arrives.\n\n**Events:** tt-load, tt-error",
+      "attributes": [
+        {
+          "name": "src",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-image>`"
+        },
+        {
+          "name": "alt",
+          "description": "Describe the picture, or pass \"\" when it is decorative.\n\nType: `string`\n\nDefault: `\"\"`\n\nOn `<tt-image>`"
+        },
+        {
+          "name": "ratio",
+          "description": "Any CSS aspect-ratio: \"16 / 9\", \"4 / 5\", \"1\". Empty means intrinsic.\n\nType: `string`\n\nDefault: `\"\"`\n\nOn `<tt-image>`"
+        },
+        {
+          "name": "fit",
+          "description": "Type: `ImageFit`\n\nDefault: `\"cover\"`\n\nOn `<tt-image>`",
+          "values": [
+            {
+              "name": "cover"
+            },
+            {
+              "name": "contain"
+            }
+          ]
+        },
+        {
+          "name": "radius",
+          "description": "Type: `ImageRadius`\n\nDefault: `\"medium\"`\n\nOn `<tt-image>`"
+        },
+        {
+          "name": "priority",
+          "description": "Above the fold. Loads eagerly and asks the browser to prioritise the\nfetch, which a hero image needs and a thumbnail never does.\n\nType: `boolean`\n\nDefault: `false`\n\nOn `<tt-image>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-inbox",
+      "description": "The list side of a messaging surface: who wrote, about what, when, and\nwhether it has been read.\n\nPairs with tt-thread, which is the reading side. Split in two because\nthey live in different places on screen - side by side on a desktop,\ntwo separate routes on a phone - and a single component would have to\nown that layout decision on the app's behalf.\n\nIt owns nothing. `selected` comes in, `tt-conversation-select` goes out.\nThat matters more here than usual: which conversation is open is the\nkind of state that belongs in the URL, so a thread can be linked to.\n\nUNREAD IS THE ONLY THING IT EMPHASISES. An inbox is read by scanning\nfor what is new, so unread rows carry weight and a dot, and everything\nelse stays quiet. Styling the sender, the subject and the time all\nstrongly would leave nothing for the eye to catch.\n\n**Events:** tt-conversation-select",
+      "attributes": [
+        {
+          "name": "conversations",
+          "description": "Type: `Conversation[]`\n\nDefault: `[]`\n\nOn `<tt-inbox>`"
+        },
+        {
+          "name": "selected",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-inbox>`"
+        },
+        {
+          "name": "empty-heading",
+          "description": "Type: `string`\n\nDefault: `\"No messages\"`\n\nOn `<tt-inbox>`"
+        },
+        {
+          "name": "empty-description",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-inbox>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-input",
+      "description": "**Events:** tt-input, tt-change",
+      "attributes": [
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-input>`"
+        },
+        {
+          "name": "placeholder",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-input>`"
+        },
+        {
+          "name": "value",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-input>`"
+        },
+        {
+          "name": "name",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-input>`"
+        },
+        {
+          "name": "type",
+          "description": "Type: `InputType`\n\nDefault: `\"text\"`\n\nOn `<tt-input>`"
+        },
+        {
+          "name": "autocomplete",
+          "description": "Type: `AutoCompleteToken | undefined`\n\nOn `<tt-input>`"
+        },
+        {
+          "name": "size",
+          "description": "Type: `InputSize`\n\nDefault: `\"medium\"`\n\nOn `<tt-input>`",
+          "values": [
+            {
+              "name": "small"
+            },
+            {
+              "name": "medium"
+            },
+            {
+              "name": "large"
+            }
+          ]
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-input>`"
+        },
+        {
+          "name": "required",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-input>`"
+        },
+        {
+          "name": "full-width",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-input>`"
+        },
+        {
+          "name": "error",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-input>`"
+        },
+        {
+          "name": "label-hidden",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-input>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-kbd",
+      "description": "A keyboard key, as printed in documentation and menus.\n\nRenders a real `<kbd>`, which is the element the HTML spec defines for\n\"user input from a keyboard\". A styled `<span>` looks identical and\ntells a screen reader nothing, so this is one of the rare cases where\npicking the right tag IS the accessibility work.\n\nPresentational only. It displays a key, it never listens for one.\n\n---------------------------------------------------------------------\nON `keys`.\n\nA combination is one idea, so it is one element:\n\n  <tt-kbd keys=\"Ctrl+K\"></tt-kbd>\n\nsplits on \"+\" and renders a separator between the parts. Writing three\nelements and two literal plus signs in the markup instead would leave\nthe separator's spacing to whoever typed it, and it would be different\non every page by the end of the month.\n\nThe default slot is the escape hatch for anything that is not a\nplus-separated combination, an arrow glyph say.",
+      "attributes": [
+        {
+          "name": "keys",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-kbd>`"
+        },
+        {
+          "name": "size",
+          "description": "Type: `KbdSize`\n\nDefault: `\"medium\"`\n\nOn `<tt-kbd>`",
+          "values": [
+            {
+              "name": "small"
+            },
+            {
+              "name": "medium"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "tt-key-values",
+      "description": "",
+      "attributes": [
+        {
+          "name": "items",
+          "description": "Type: `KeyValue[]`\n\nDefault: `[]`\n\nOn `<tt-key-values>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-knowledge-doc",
+      "description": "",
+      "attributes": [
+        {
+          "name": "heading",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-knowledge-doc>`"
+        },
+        {
+          "name": "description",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-knowledge-doc>`"
+        },
+        {
+          "name": "code",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-knowledge-doc>`"
+        },
+        {
+          "name": "language",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-knowledge-doc>`"
+        },
+        {
+          "name": "patterns",
+          "description": "Type: `SwitcherItem[]`\n\nDefault: `[]`\n\nOn `<tt-knowledge-doc>`"
+        },
+        {
+          "name": "examples",
+          "description": "Type: `DocExample[]`\n\nDefault: `[]`\n\nOn `<tt-knowledge-doc>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-layout",
+      "description": "",
+      "attributes": []
+    },
+    {
+      "name": "tt-menu-group",
+      "description": "A labelled section of sidebar navigation, optionally collapsible.\n\n---------------------------------------------------------------------\nTWO MODES.\n\n  (default)              the heading is a plain label and the content\n                         is always there. This is the right shape when\n                         a group exists to name a set of links rather\n                         than to hide them.\n  collapsible            the heading is a button, the content opens\n                         and closes, and `open` is the state.\n\nOpt-in, like tt-sidebar's collapsible and every other boolean: a\nboolean attribute can only switch something ON.\n\nThe default is the old behaviour exactly, so nothing that already uses\nthis component changes.\n\n---------------------------------------------------------------------\nWHY THE HEADING ROW IS A ROW.\n\nSame reason as tt-menu-item: an actions slot next to a heading BUTTON\ncannot live inside that button, because a button inside a button is\ninvalid HTML. So the heading row holds two siblings.\n\n---------------------------------------------------------------------\nRAIL MODE.\n\nWhen tt-sidebar is collapsed it hides these headings and forces every\ngroup open. A closed group in a rail would be unreachable: its own\nheading is the only way to open it, and that heading is exactly what a\nrail has no room for. Both facts arrive as inherited custom properties,\nso this component still knows nothing about the sidebar.\n\nThe events, for the custom-elements manifest. Its analyzer reads event\nnames from string literals at the dispatch site, and these are chosen at\nrun time, so without the tags the manifest listed a bogus event instead.\n\n**Events:** tt-toggle, tt-open, tt-close",
+      "attributes": [
+        {
+          "name": "heading",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-menu-group>`"
+        },
+        {
+          "name": "open",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-menu-group>`"
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-menu-group>`"
+        },
+        {
+          "name": "collapsible",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-menu-group>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-menu-item",
+      "description": "One row of sidebar navigation.\n\n---------------------------------------------------------------------\nWHY THE ROW IS NOT ONE ELEMENT.\n\nA menu item can carry a trailing control: a count, or the three dots\nthat open a per-item menu. A button inside a button is invalid HTML and\nbreaks keyboard and screen-reader behaviour in every browser, so the\ntwo cannot nest.\n\nSo the row is a plain container, and the two controls are SIBLINGS\ninside it:\n\n  .row            the hover surface, the corner, the active bar\n    .main         a real <button> or <a>, holds the padding, flex: 1\n    .trail        the badge and the actions, only when there are any\n\nThe padding lives on .main rather than on .row so that clicking the\nblank space beside the label still activates the item. If the row\ncarried the padding, that space would belong to nothing.\n\n---------------------------------------------------------------------\nWHY IT IS NO LONGER role=\"menuitem\".\n\nmenuitem is for application menus, and it is only valid inside a\nrole=\"menu\" parent. This is site navigation inside a landmark, so the\nhonest markup is a link or a button, which also brings Enter, Space,\nmiddle-click and \"open in new tab\" for free instead of reimplementing\nthem. The custom keydown handler this component used to carry is gone\nwith it.\n\n---------------------------------------------------------------------\nRAIL MODE.\n\nNothing here knows whether the sidebar is collapsed. tt-sidebar sets a\nhandful of custom properties when it is, and every one of them is read\nbelow through var() with the expanded value as the fallback. Custom\nproperties inherit and cross shadow boundaries, so this works at any\ndepth with no props and no coordination, and an item used outside a\nsidebar simply gets the fallbacks.\n\n**Events:** tt-menu-click, tt-menu-more",
+      "attributes": [
+        {
+          "name": "variant",
+          "description": "Type: `MenuItemVariant`\n\nDefault: `\"default\"`\n\nOn `<tt-menu-item>`",
+          "values": [
+            {
+              "name": "default"
+            },
+            {
+              "name": "link"
+            }
+          ]
+        },
+        {
+          "name": "active",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-menu-item>`"
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-menu-item>`"
+        },
+        {
+          "name": "href",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-menu-item>`"
+        },
+        {
+          "name": "target",
+          "description": "Type: `string`\n\nDefault: `\"_blank\"`\n\nOn `<tt-menu-item>`"
+        },
+        {
+          "name": "value",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-menu-item>`"
+        },
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-menu-item>`"
+        },
+        {
+          "name": "more",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-menu-item>`"
+        },
+        {
+          "name": "more-label",
+          "description": "Type: `string`\n\nDefault: `\"More actions\"`\n\nOn `<tt-menu-item>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-modal",
+      "description": "**Events:** tt-close",
+      "attributes": [
+        {
+          "name": "open",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-modal>`"
+        },
+        {
+          "name": "heading",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-modal>`"
+        },
+        {
+          "name": "size",
+          "description": "Type: `ModalSize`\n\nDefault: `\"medium\"`\n\nOn `<tt-modal>`",
+          "values": [
+            {
+              "name": "small"
+            },
+            {
+              "name": "medium"
+            },
+            {
+              "name": "large"
+            }
+          ]
+        },
+        {
+          "name": "persistent",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-modal>`"
+        },
+        {
+          "name": "preview",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-modal>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-navbar",
+      "description": "**Events:** tt-menu-toggle",
+      "attributes": [
+        {
+          "name": "sticky",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-navbar>`"
+        },
+        {
+          "name": "bordered",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-navbar>`"
+        },
+        {
+          "name": "size",
+          "description": "Type: `NavbarSize`\n\nDefault: `\"medium\"`\n\nOn `<tt-navbar>`",
+          "values": [
+            {
+              "name": "small"
+            },
+            {
+              "name": "medium"
+            },
+            {
+              "name": "large"
+            }
+          ]
+        },
+        {
+          "name": "mobile-menu-open",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-navbar>`"
+        },
+        {
+          "name": "scroll-edge",
+          "description": "A soft blurred boundary below the bar instead of a hard rule, for\nwhere content actually scrolls UNDERNEATH it: a landing page, or any\nlayout where the bar floats over the scroller rather than sitting in\na column above it.\n\nNot decoration, and not a nicer border. It marks where UI meets\ncontent, so it is wrong on a bar with nothing passing under it, and\nit does nothing unless `sticky` is set. Use one per scrolling view.\n\nAttribute is `scroll-edge`, kebab-case like every multi-word\nattribute in the library.\n\nType: `boolean`\n\nDefault: `false`\n\nOn `<tt-navbar>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-page",
+      "description": "",
+      "attributes": [
+        {
+          "name": "heading",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-page>`"
+        },
+        {
+          "name": "description",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-page>`"
+        },
+        {
+          "name": "width",
+          "description": "Type: `\"narrow\" | \"default\" | \"wide\" | \"full\"`\n\nDefault: `\"default\"`\n\nOn `<tt-page>`",
+          "values": [
+            {
+              "name": "narrow"
+            },
+            {
+              "name": "default"
+            },
+            {
+              "name": "wide"
+            },
+            {
+              "name": "full"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "tt-page-header",
+      "description": "Title, optional description, optional breadcrumb, and a row of actions\npinned to the right.\n\nThis is the most repeated block in any application: every list, detail\nand settings screen opens with it. Without a component, each page\ninvents slightly different spacing and the product stops feeling like\none thing.\n\ntt-page owns the page frame and its width. This owns the top of the\ncontent.",
+      "attributes": [
+        {
+          "name": "heading",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-page-header>`"
+        },
+        {
+          "name": "description",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-page-header>`"
+        },
+        {
+          "name": "bordered",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-page-header>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-pagination",
+      "description": "Page navigation. Owns nothing: the current page comes in, and a click\nemits the page you asked for. The parent decides what that means and\npasses the new page back down.\n\n**Events:** tt-page-change",
+      "attributes": [
+        {
+          "name": "page",
+          "description": "Type: `number`\n\nDefault: `1`\n\nOn `<tt-pagination>`"
+        },
+        {
+          "name": "total",
+          "description": "Type: `number`\n\nDefault: `0`\n\nOn `<tt-pagination>`"
+        },
+        {
+          "name": "page-size",
+          "description": "Type: `number`\n\nDefault: `10`\n\nOn `<tt-pagination>`"
+        },
+        {
+          "name": "siblings",
+          "description": "Type: `number`\n\nDefault: `1`\n\nOn `<tt-pagination>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-preview",
+      "description": "",
+      "attributes": []
+    },
+    {
+      "name": "tt-product",
+      "description": "**Events:** tt-product-action",
+      "attributes": [
+        {
+          "name": "src",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-product>`"
+        },
+        {
+          "name": "ratio",
+          "description": "Type: `string`\n\nDefault: `\"1\"`\n\nOn `<tt-product>`"
+        },
+        {
+          "name": "orientation",
+          "description": "Type: `ProductOrientation`\n\nDefault: `\"vertical\"`\n\nOn `<tt-product>`",
+          "values": [
+            {
+              "name": "vertical"
+            },
+            {
+              "name": "horizontal"
+            }
+          ]
+        },
+        {
+          "name": "variant",
+          "description": "Type: `ProductVariant`\n\nDefault: `\"default\"`\n\nOn `<tt-product>`",
+          "values": [
+            {
+              "name": "default"
+            },
+            {
+              "name": "minimal"
+            },
+            {
+              "name": "elevated"
+            },
+            {
+              "name": "featured"
+            }
+          ]
+        },
+        {
+          "name": "layout",
+          "description": "Type: `ProductLayout`\n\nDefault: `\"standard\"`\n\nOn `<tt-product>`",
+          "values": [
+            {
+              "name": "standard"
+            },
+            {
+              "name": "overlay"
+            },
+            {
+              "name": "compact"
+            }
+          ]
+        },
+        {
+          "name": "heading",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-product>`"
+        },
+        {
+          "name": "description",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-product>`"
+        },
+        {
+          "name": "description-lines",
+          "description": "Type: `number`\n\nDefault: `2`\n\nOn `<tt-product>`"
+        },
+        {
+          "name": "price",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-product>`"
+        },
+        {
+          "name": "was-price",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-product>`"
+        },
+        {
+          "name": "rating",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-product>`"
+        },
+        {
+          "name": "value",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-product>`"
+        },
+        {
+          "name": "button-link",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-product>`"
+        },
+        {
+          "name": "button-label",
+          "description": "Type: `string`\n\nDefault: `\"Add to basket\"`\n\nOn `<tt-product>`"
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-product>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-profile-card",
+      "description": "**Events:** tt-profile-action",
+      "attributes": [
+        {
+          "name": "name",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-profile-card>`"
+        },
+        {
+          "name": "description",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-profile-card>`"
+        },
+        {
+          "name": "value",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-profile-card>`"
+        },
+        {
+          "name": "image",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-profile-card>`"
+        },
+        {
+          "name": "image-alt",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-profile-card>`"
+        },
+        {
+          "name": "button-label",
+          "description": "Type: `string`\n\nDefault: `\"View Profile\"`\n\nOn `<tt-profile-card>`"
+        },
+        {
+          "name": "orientation",
+          "description": "Type: `ProfileCardOrientation`\n\nDefault: `\"vertical\"`\n\nOn `<tt-profile-card>`",
+          "values": [
+            {
+              "name": "vertical"
+            },
+            {
+              "name": "horizontal"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "tt-progress",
+      "description": "A labelled progress bar for a known quantity.\n\nIts highest-value use in a directory or SaaS product is a profile\ncompleteness meter. Listing quality is the product, and a visible\n\"your profile is 60% complete\" is the most effective nudge there is\nto improve it.",
+      "attributes": [
+        {
+          "name": "value",
+          "description": "Type: `number`\n\nDefault: `0`\n\nOn `<tt-progress>`"
+        },
+        {
+          "name": "max",
+          "description": "Type: `number`\n\nDefault: `100`\n\nOn `<tt-progress>`"
+        },
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-progress>`"
+        },
+        {
+          "name": "show-value",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-progress>`"
+        },
+        {
+          "name": "grade",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-progress>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-quantity",
+      "description": "**Events:** tt-change",
+      "attributes": [
+        {
+          "name": "name",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-quantity>`"
+        },
+        {
+          "name": "value",
+          "description": "Type: `number`\n\nDefault: `1`\n\nOn `<tt-quantity>`"
+        },
+        {
+          "name": "min",
+          "description": "Type: `number`\n\nDefault: `0`\n\nOn `<tt-quantity>`"
+        },
+        {
+          "name": "max",
+          "description": "Default: `Infinity`\n\nOn `<tt-quantity>`"
+        },
+        {
+          "name": "step",
+          "description": "Type: `number`\n\nDefault: `1`\n\nOn `<tt-quantity>`"
+        },
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-quantity>`"
+        },
+        {
+          "name": "label-hidden",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-quantity>`"
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-quantity>`"
+        },
+        {
+          "name": "size",
+          "description": "Type: `\"small\" | \"medium\" | \"large\"`\n\nDefault: `\"medium\"`\n\nOn `<tt-quantity>`",
+          "values": [
+            {
+              "name": "small"
+            },
+            {
+              "name": "medium"
+            },
+            {
+              "name": "large"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "tt-radio-group",
+      "description": "Pick exactly one of a small set.\n\nThe group is the form control, not the individual radios, which is why\nthis is form-associated and there is no tt-radio. A lone radio button\nis meaningless: \"one of these\" is a property of the set.\n\n**Events:** tt-change",
+      "attributes": [
+        {
+          "name": "name",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-radio-group>`"
+        },
+        {
+          "name": "value",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-radio-group>`"
+        },
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-radio-group>`"
+        },
+        {
+          "name": "label-hidden",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-radio-group>`"
+        },
+        {
+          "name": "error",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-radio-group>`"
+        },
+        {
+          "name": "options",
+          "description": "Type: `RadioOption[]`\n\nDefault: `[]`\n\nOn `<tt-radio-group>`"
+        },
+        {
+          "name": "required",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-radio-group>`"
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-radio-group>`"
+        },
+        {
+          "name": "orientation",
+          "description": "Type: `\"horizontal\" | \"vertical\"`\n\nDefault: `\"vertical\"`\n\nOn `<tt-radio-group>`",
+          "values": [
+            {
+              "name": "horizontal"
+            },
+            {
+              "name": "vertical"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "tt-rating",
+      "description": "A star rating, readable or settable.\n\nThe library already had tt-product, tt-profile-card and tt-company-card\nand no way to say how good any of them were, which is the one number\nevery listing, review and directory entry eventually needs.\n\nTWO COMPONENTS IN ONE, ON PURPOSE. A rating is displayed far more often\nthan it is set, and the two cases want different semantics rather than\ndifferent elements. Read-only is a single image with a text\nalternative, because a screen reader needs \"4.5 out of 5\", not five\nseparate stars it has to add up. Interactive is a slider, which is the\npattern that already works with arrow keys everywhere else.\n\nFractions are supported for the read-only case only. An average of many\nratings is 4.3; nobody has ever meant to award 4.3 themselves.\n\n**Events:** tt-change",
+      "attributes": [
+        {
+          "name": "value",
+          "description": "Stars filled. Fractional values are drawn as partial stars.\n\nType: `number`\n\nDefault: `0`\n\nOn `<tt-rating>`"
+        },
+        {
+          "name": "max",
+          "description": "Type: `number`\n\nDefault: `5`\n\nOn `<tt-rating>`"
+        },
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-rating>`"
+        },
+        {
+          "name": "show-value",
+          "description": "Show the number beside the stars. An average is easier to read as digits.\n\nType: `boolean`\n\nDefault: `false`\n\nOn `<tt-rating>`"
+        },
+        {
+          "name": "count",
+          "description": "How many ratings the value averages, shown as \"(128)\".\n\nType: `number | undefined`\n\nOn `<tt-rating>`"
+        },
+        {
+          "name": "interactive",
+          "description": "Let the user set it. Off by default: display is the common case.\n\nType: `boolean`\n\nDefault: `false`\n\nOn `<tt-rating>`"
+        },
+        {
+          "name": "size",
+          "description": "Type: `string`\n\nDefault: `\"18px\"`\n\nOn `<tt-rating>`"
+        },
+        {
+          "name": "grade",
+          "description": "Colour by value rather than always gold. Off by default, because a\nproduct rating is gold everywhere and a red two-star review would\nlook like an error state rather than a low score.\n\nType: `boolean`\n\nDefault: `false`\n\nOn `<tt-rating>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-search",
+      "description": "A search field.\n\nOne field, with the magnifier INSIDE it and a clear button that appears\nonly when there is something to clear. There is no separate submit\nbutton, because search is not a form you submit: results follow typing.\nThe old layout put a filled button beside the input, which read as two\ncontrols and made the field look like it needed permission to run.\nEnter still fires tt-search for anyone who expects it to.\n\n`collapsible` is opt-in, and off by default. Collapsing to an icon on a\nphone is right in a navbar, where the row is fighting for space, and\nwrong in a page toolbar, where the field is the main control on screen.\nOnly the host knows which it is, so the host decides.\n\n**Events:** tt-search-input, tt-search",
+      "attributes": [
+        {
+          "name": "placeholder",
+          "description": "Type: `string`\n\nDefault: `\"Search\"`\n\nOn `<tt-search>`"
+        },
+        {
+          "name": "value",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-search>`"
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-search>`"
+        },
+        {
+          "name": "size",
+          "description": "Type: `\"small\" | \"medium\" | \"large\"`\n\nDefault: `\"small\"`\n\nOn `<tt-search>`",
+          "values": [
+            {
+              "name": "small"
+            },
+            {
+              "name": "medium"
+            },
+            {
+              "name": "large"
+            }
+          ]
+        },
+        {
+          "name": "collapsible",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-search>`"
+        },
+        {
+          "name": "debounce",
+          "description": "Type: `number`\n\nDefault: `250`\n\nOn `<tt-search>`"
+        },
+        {
+          "name": "min-length",
+          "description": "Type: `number`\n\nDefault: `0`\n\nOn `<tt-search>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-section",
+      "description": "",
+      "attributes": [
+        {
+          "name": "heading",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-section>`"
+        },
+        {
+          "name": "description",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-section>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-select",
+      "description": "**Events:** tt-change",
+      "attributes": [
+        {
+          "name": "name",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-select>`"
+        },
+        {
+          "name": "value",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-select>`"
+        },
+        {
+          "name": "placeholder",
+          "description": "Type: `string`\n\nDefault: `\"Select an option\"`\n\nOn `<tt-select>`"
+        },
+        {
+          "name": "options",
+          "description": "Type: `SelectOption[]`\n\nDefault: `[]`\n\nOn `<tt-select>`"
+        },
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-select>`"
+        },
+        {
+          "name": "error",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-select>`"
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-select>`"
+        },
+        {
+          "name": "required",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-select>`"
+        },
+        {
+          "name": "size",
+          "description": "Type: `SelectSize`\n\nDefault: `\"medium\"`\n\nOn `<tt-select>`",
+          "values": [
+            {
+              "name": "small"
+            },
+            {
+              "name": "medium"
+            },
+            {
+              "name": "large"
+            }
+          ]
+        },
+        {
+          "name": "label-hidden",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-select>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-sidebar",
+      "description": "The navigation column of an app shell.\n\n---------------------------------------------------------------------\nHOW COLLAPSING WORKS, AND WHY IT NEEDS NO PROPS.\n\nWith `collapsible`, the sidebar can shrink to an icon rail. Everything\ninside it has to change at once: labels disappear, rows centre, group\nheadings go, badges go, the indent goes. Passing that down would mean a\n`collapsed` prop on every child, kept in sync by hand, at every depth.\n\nInstead the collapsed state is published as ordinary CSS custom\nproperties on the host, and each child reads the ones it cares about\nthrough var() with the expanded value as the fallback:\n\n  --tt-menu-label-cols      1fr  ->  0fr      label track collapses\n  --tt-menu-gap             sp-2 ->  0px      no gap beside nothing\n  --tt-menu-justify         start->  center   icons centre in the rail\n  --tt-menu-trail-display   flex ->  none     badges and dots go\n  --tt-menu-heading-display flex ->  none     group headings go\n  --tt-menu-rail-rows       unset->  1fr      every group forced open\n  --tt-menu-rail-visibility unset->  visible  ...and its items reachable\n  --tt-menu-indent          sp-2 ->  0px      no nesting indent\n\nCustom properties inherit and they cross shadow boundaries, so this\nreaches a menu item nested three groups deep with no wiring, and a menu\nitem used outside a sidebar simply gets the fallbacks. Same mechanism\nas --tt-radius-nested in tokens.css.\n\nThey are declared in the stylesheet under :host([collapsed]) rather\nthan written from JavaScript, and that matters: a media query can\noverride a stylesheet rule, and cannot override an inline style. It is\nwhat lets the block at the bottom of this file switch the whole rail\noff on a phone, where the sidebar is a drawer and a rail would be an\nunusable 64px strip sliding over the page.\n\n---------------------------------------------------------------------\nWHO OWNS `collapsed`.\n\nThe component toggles itself and announces it with tt-sidebar-toggle,\nthe same shape tt-menu-group uses for open/close. An app that wants to\nremember the choice listens for the event and writes the property back;\none that does not gets working behaviour for free.\n\n**Events:** tt-sidebar-toggle",
+      "attributes": [
+        {
+          "name": "variant",
+          "description": "Type: `SidebarVariant`\n\nDefault: `\"default\"`\n\nOn `<tt-sidebar>`",
+          "values": [
+            {
+              "name": "default"
+            },
+            {
+              "name": "borderless"
+            },
+            {
+              "name": "floating"
+            }
+          ]
+        },
+        {
+          "name": "width",
+          "description": "Type: `number`\n\nDefault: `240`\n\nOn `<tt-sidebar>`"
+        },
+        {
+          "name": "rail-width",
+          "description": "Type: `number`\n\nDefault: `64`\n\nOn `<tt-sidebar>`"
+        },
+        {
+          "name": "collapsible",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-sidebar>`"
+        },
+        {
+          "name": "collapsed",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-sidebar>`"
+        },
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"Main\"`\n\nOn `<tt-sidebar>`"
+        },
+        {
+          "name": "collapse-label",
+          "description": "Type: `string`\n\nDefault: `\"Collapse sidebar\"`\n\nOn `<tt-sidebar>`"
+        },
+        {
+          "name": "expand-label",
+          "description": "Type: `string`\n\nDefault: `\"Expand sidebar\"`\n\nOn `<tt-sidebar>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-sidebar-footer",
+      "description": "The account row at the bottom of a sidebar.\n\nGoes in tt-sidebar's `footer` slot. Same shape as tt-sidebar-header on\npurpose: leading mark, two lines of text, trailing actions. Two rows\nthat look alike should be built alike, or they drift apart the first\ntime one of them is edited.\n\n  <tt-sidebar-footer slot=\"footer\" heading=\"Alex Rana\" description=\"alex@x.com\">\n    <tt-avatar slot=\"leading\" name=\"Alex Rana\"></tt-avatar>\n    <tt-button slot=\"actions\" variant=\"ghost\" size=\"small\">...</tt-button>\n  </tt-sidebar-footer>\n\nWith `clickable` the whole row becomes one button and emits\ntt-sidebar-account, for the common case where clicking the account\nopens a menu. It is off by default because a row that looks clickable\nand is not is worse than a plain row, and most footers are plain.\n\n`clickable` and the `actions` slot work together, because the actions\nsit BESIDE the button rather than inside it. A button inside a button\nis invalid HTML, so the row is a container holding two siblings. Same\narrangement as tt-menu-item, for the same reason.\n\n**Events:** tt-sidebar-account",
+      "attributes": [
+        {
+          "name": "heading",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-sidebar-footer>`"
+        },
+        {
+          "name": "description",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-sidebar-footer>`"
+        },
+        {
+          "name": "clickable",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-sidebar-footer>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-sidebar-header",
+      "description": "The brand row at the top of a sidebar.\n\nGoes in tt-sidebar's `header` slot. It exists because every app puts\nthe same three things there in the same order, and hand-rolling that\nrow per app means three apps with three slightly different paddings.\n\n  <tt-sidebar collapsible>\n    <tt-sidebar-header slot=\"header\" heading=\"Tartaguti\" description=\"Base\">\n      <tt-avatar slot=\"leading\" name=\"T\"></tt-avatar>\n    </tt-sidebar-header>\n  </tt-sidebar>\n\nThe `leading` slot survives rail mode and the text does not, which is\nthe whole reason the mark is a separate slot rather than part of the\nheading. Same inherited-property channel as tt-menu-item; see the note\nat the top of tt-sidebar.",
+      "attributes": [
+        {
+          "name": "heading",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-sidebar-header>`"
+        },
+        {
+          "name": "description",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-sidebar-header>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-skeleton",
+      "description": "Placeholder shape shown while data loads. Use it in the same layout as\nthe real content so nothing jumps when the data arrives: a skeleton\nthat is a different size than what replaces it is worse than a spinner.",
+      "attributes": [
+        {
+          "name": "variant",
+          "description": "Type: `\"text\" | \"title\" | \"circle\" | \"rect\"`\n\nDefault: `\"text\"`\n\nOn `<tt-skeleton>`",
+          "values": [
+            {
+              "name": "text"
+            },
+            {
+              "name": "title"
+            },
+            {
+              "name": "circle"
+            },
+            {
+              "name": "rect"
+            }
+          ]
+        },
+        {
+          "name": "width",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-skeleton>`"
+        },
+        {
+          "name": "height",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-skeleton>`"
+        },
+        {
+          "name": "lines",
+          "description": "Type: `number`\n\nDefault: `1`\n\nOn `<tt-skeleton>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-slider",
+      "description": "A value picked from a range.\n\n---------------------------------------------------------------------\nIT WRAPS A REAL `<input type=\"range\">`, AND THAT IS THE DESIGN.\n\nA div with a draggable dot is about forty lines to make look right and\nseveral hundred to make correct. The native input already ships:\n\n  - Arrow keys, Home, End, Page Up, Page Down, all with the right step\n  - role=\"slider\" with aria-valuenow / valuemin / valuemax kept in sync\n  - pointer capture, so a drag survives leaving the element\n  - touch, pen and mouse without a line of code\n  - correct behaviour in a form, including reset\n\nEvery one of those is a thing hand-rolled sliders get wrong. So this\ncomponent styles the native control rather than replacing it. The cost\nis four vendor pseudo-elements below; the alternative cost is the list\nabove.\n\n---------------------------------------------------------------------\nTWO EVENTS, BECAUSE THERE ARE TWO QUESTIONS.\n\n  tt-input   fires continuously while dragging. Use it to update a\n             preview: a live number, a colour, a zoom level.\n  tt-change  fires once, when the drag is released. Use it to save.\n\nCollapsing them into one would force every consumer that writes to a\nserver to debounce, and every consumer that draws a preview to poll.\nThe platform already draws this line and this keeps it.\n\nIt owns its own `value`, like the native input it wraps. Setting the\nproperty from outside still wins.\n\n**Events:** tt-input, tt-change",
+      "attributes": [
+        {
+          "name": "name",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-slider>`"
+        },
+        {
+          "name": "value",
+          "description": "Type: `number`\n\nDefault: `50`\n\nOn `<tt-slider>`"
+        },
+        {
+          "name": "min",
+          "description": "Type: `number`\n\nDefault: `0`\n\nOn `<tt-slider>`"
+        },
+        {
+          "name": "max",
+          "description": "Type: `number`\n\nDefault: `100`\n\nOn `<tt-slider>`"
+        },
+        {
+          "name": "step",
+          "description": "Type: `number`\n\nDefault: `1`\n\nOn `<tt-slider>`"
+        },
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-slider>`"
+        },
+        {
+          "name": "label-hidden",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-slider>`"
+        },
+        {
+          "name": "show-value",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-slider>`"
+        },
+        {
+          "name": "unit",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-slider>`"
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-slider>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-social-links",
+      "description": "A row of platform links. Trivial to write once and endlessly repeated,\nwhich is exactly what earns a component.\n\n`email` and `phone` are in the set on purpose. They are not social\nnetworks, but on a business profile they sit in the same row and behave\nthe same way, and splitting them into a second component would mean two\nrows that have to be styled to look like one.\n\nEvery href goes through safeUrl, because these come from user-entered\nprofile data. A company that types `javascript:...` into its website\nfield would otherwise get it rendered as a live link on its own page.",
+      "attributes": [
+        {
+          "name": "links",
+          "description": "Type: `SocialLink[]`\n\nDefault: `[]`\n\nOn `<tt-social-links>`"
+        },
+        {
+          "name": "size",
+          "description": "Type: `\"small\" | \"medium\"`\n\nDefault: `\"medium\"`\n\nOn `<tt-social-links>`",
+          "values": [
+            {
+              "name": "small"
+            },
+            {
+              "name": "medium"
+            }
+          ]
+        },
+        {
+          "name": "labelled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-social-links>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-sparkline",
+      "description": "",
+      "attributes": [
+        {
+          "name": "points",
+          "description": "Type: `number[]`\n\nDefault: `[]`\n\nOn `<tt-sparkline>`"
+        },
+        {
+          "name": "area",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-sparkline>`"
+        },
+        {
+          "name": "trend",
+          "description": "Type: `SparklineTrend`\n\nDefault: `\"neutral\"`\n\nOn `<tt-sparkline>`",
+          "values": [
+            {
+              "name": "positive"
+            },
+            {
+              "name": "negative"
+            },
+            {
+              "name": "neutral"
+            }
+          ]
+        },
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-sparkline>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-spinner",
+      "description": "Indeterminate loading indicator, for when you cannot say how long\nsomething will take. Prefer tt-skeleton when you know the shape of what\nis coming: a skeleton tells the user what to expect, a spinner only\ntells them to wait.",
+      "attributes": [
+        {
+          "name": "size",
+          "description": "Type: `string`\n\nDefault: `\"20px\"`\n\nOn `<tt-spinner>`"
+        },
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"Loading\"`\n\nOn `<tt-spinner>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-stack",
+      "description": "Lays its children out in a column or a row, with a gap from the\nspacing scale.\n\nThe layout every screen repeats, and the library had no general one:\ntt-grid is a responsive grid, tt-toolbar a row with two sides,\ntt-button-group joins controls into one unit. So the apps wrote their\nown `display: flex; gap: ...` in some 26 files, with the same gap\nspelled 0.75rem in one and 12px in the next. A stack can only take a\nstep of the scale, and because the steps are tokens, a stack also\nfollows the density modes, which a hand-written 12px never will.\n\nTHE HOST IS THE FLEX CONTAINER. The shadow root holds only a slot, and\na slot is display: contents, so the slotted children become flex items\nof the host itself. With no inner wrapper there is nothing to reach\nthrough: a consumer's own `gap` or `flex-wrap` on the element simply\nwins, because a rule from outside beats :host.\n\nNo reverse option, on purpose. A row drawn in the opposite order to\nits markup is read and tabbed through backwards by keyboard and screen\nreader users. Reorder the markup instead.",
+      "attributes": [
+        {
+          "name": "orientation",
+          "description": "Type: `StackOrientation`\n\nDefault: `\"vertical\"`\n\nOn `<tt-stack>`",
+          "values": [
+            {
+              "name": "vertical"
+            },
+            {
+              "name": "horizontal"
+            }
+          ]
+        },
+        {
+          "name": "gap",
+          "description": "Type: `StackGap`\n\nDefault: `\"medium\"`\n\nOn `<tt-stack>`",
+          "values": [
+            {
+              "name": "none"
+            },
+            {
+              "name": "small"
+            },
+            {
+              "name": "medium"
+            },
+            {
+              "name": "large"
+            }
+          ]
+        },
+        {
+          "name": "align",
+          "description": "Type: `StackAlign`\n\nDefault: `\"stretch\"`\n\nOn `<tt-stack>`",
+          "values": [
+            {
+              "name": "start"
+            },
+            {
+              "name": "center"
+            },
+            {
+              "name": "end"
+            },
+            {
+              "name": "stretch"
+            }
+          ]
+        },
+        {
+          "name": "justify",
+          "description": "Type: `StackJustify`\n\nDefault: `\"start\"`\n\nOn `<tt-stack>`",
+          "values": [
+            {
+              "name": "start"
+            },
+            {
+              "name": "center"
+            },
+            {
+              "name": "end"
+            },
+            {
+              "name": "between"
+            }
+          ]
+        },
+        {
+          "name": "wrap",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-stack>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-stat",
+      "description": "",
+      "attributes": [
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-stat>`"
+        },
+        {
+          "name": "value",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-stat>`"
+        },
+        {
+          "name": "delta",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-stat>`"
+        },
+        {
+          "name": "trend",
+          "description": "Type: `StatTrend`\n\nDefault: `\"neutral\"`\n\nOn `<tt-stat>`",
+          "values": [
+            {
+              "name": "positive"
+            },
+            {
+              "name": "negative"
+            },
+            {
+              "name": "neutral"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "tt-switch",
+      "description": "A switch, not a checkbox. Use it for a setting that takes effect\nimmediately (\"Email notifications on\"). Use tt-checkbox for something\nconfirmed later by a submit (\"I accept the terms\").\n\n**Events:** tt-change",
+      "attributes": [
+        {
+          "name": "name",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-switch>`"
+        },
+        {
+          "name": "value",
+          "description": "Type: `string`\n\nDefault: `\"on\"`\n\nOn `<tt-switch>`"
+        },
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-switch>`"
+        },
+        {
+          "name": "checked",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-switch>`"
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-switch>`"
+        },
+        {
+          "name": "label-first",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-switch>`"
+        },
+        {
+          "name": "label-hidden",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-switch>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-switcher",
+      "description": "",
+      "attributes": [
+        {
+          "name": "items",
+          "description": "Type: `SwitcherItem[]`\n\nDefault: `[]`\n\nOn `<tt-switcher>`"
+        },
+        {
+          "name": "active-index",
+          "description": "Type: `number`\n\nDefault: `0`\n\nOn `<tt-switcher>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-table",
+      "description": "A read-only table, written one of two ways.\n\nDATA: pass `columns` and `rows` and it draws a real table element.\nFastest for text, and what every reference table in the docs uses.\n\nCOMPOSED: leave `columns` empty and put `tt-table-row` elements inside,\neach holding `tt-table-cell` elements. A cell takes any component, so\na checkbox, a badge or a button goes exactly where it is wanted.\n\nBoth look the same. Columns win when both are given.",
+      "attributes": [
+        {
+          "name": "columns",
+          "description": "Type: `TableColumn[]`\n\nDefault: `[]`\n\nOn `<tt-table>`"
+        },
+        {
+          "name": "rows",
+          "description": "Type: `TableRow[]`\n\nDefault: `[]`\n\nOn `<tt-table>`"
+        },
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-table>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-table-cell",
+      "description": "One cell of a composed `tt-table`, inside a `tt-table-row`.\n\nIt takes anything: text, a badge, a checkbox, a button, another\ncomponent. The cell only supplies what every cell needs, the padding,\nthe vertical centring and the alignment, so the content never has to\nknow it is in a table.\n\n`header` makes it a column heading, for screen readers as well as on\nscreen, the same as a th in a plain table.",
+      "attributes": [
+        {
+          "name": "header",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-table-cell>`"
+        },
+        {
+          "name": "align",
+          "description": "Type: `TableCellAlign`\n\nDefault: `\"start\"`\n\nOn `<tt-table-cell>`",
+          "values": [
+            {
+              "name": "start"
+            },
+            {
+              "name": "center"
+            },
+            {
+              "name": "end"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "tt-table-row",
+      "description": "One row of a composed `tt-table`. Holds `tt-table-cell` elements.\n\nIt has no settings. Its whole job is to be a row twice over: a row to\na screen reader (role=\"row\") and a row of the table's grid, through\n`grid-template-columns: subgrid`. Subgrid is what makes the columns\nline up. Each row lays its cells on the TABLE's column tracks rather\nthan its own, so a wide cell in one row widens that column in every\nrow, the way a real table does.\n\n  <tt-table>\n    <tt-table-row>\n      <tt-table-cell header>Name</tt-table-cell>\n    </tt-table-row>\n    <tt-table-row>\n      <tt-table-cell>Ada Lovelace</tt-table-cell>\n    </tt-table-row>\n  </tt-table>",
+      "attributes": []
+    },
+    {
+      "name": "tt-tabs",
+      "description": "Tabbed sections. Panels are slotted by id, so the content lives with\nwhoever is using the tabs rather than being passed in as data:\n\n  <tt-tabs .tabs=${[{ id: \"about\", label: \"About\" }]} active=\"about\">\n    <div slot=\"about\">...</div>\n  </tt-tabs>\n\nOwns nothing. `active` comes in, a click emits the id you asked for.\n\n**Events:** tt-tab-change",
+      "attributes": [
+        {
+          "name": "tabs",
+          "description": "Type: `TabItem[]`\n\nDefault: `[]`\n\nOn `<tt-tabs>`"
+        },
+        {
+          "name": "active",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-tabs>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-tag-list",
+      "description": "",
+      "attributes": [
+        {
+          "name": "tags",
+          "description": "Type: `string[]`\n\nDefault: `[]`\n\nOn `<tt-tag-list>`"
+        },
+        {
+          "name": "max",
+          "description": "Type: `number`\n\nDefault: `0`\n\nOn `<tt-tag-list>`"
+        },
+        {
+          "name": "expandable",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-tag-list>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-text",
+      "description": "A heading, a paragraph or a run of text, on the type scale.\n\nEvery component styles its own text, so the library had no general\none, and the apps wrote `<h2 style=\"font-size: ...\">` by hand with a\nsize that matched no token. This one can only take a step of the\nscale, a weight token and a colour token, so it follows the theme,\ndark mode included, and never drifts.\n\n---------------------------------------------------------------------\nTWO SEPARATE QUESTIONS: WHAT IT IS, AND HOW IT LOOKS.\n\n`as` is meaning. It picks the real element in the shadow root, so an\nh2 is an h2 to a screen reader and in the page outline. `size` and\n`weight` are looks. They stay separate because the two disagree all\nthe time: the heading of a small card is an h3 for the outline but\nshould not be drawn at h3 size.\n\nLeft on \"auto\", size and weight follow the tag: h1 is 3xl bold down\nto h6 at sm semibold, a paragraph is md regular. Setting either one\noverrides only that one.\n\n---------------------------------------------------------------------\nTHE TYPE IS SET ON THE HOST.\n\nEvery rule below is a :host rule, and the element inside only\ninherits. So a consumer's own `font-size` or `color` on the element\nsimply wins, because a rule from outside beats :host, the same reason\ntt-stack keeps its layout on the host.",
+      "attributes": [
+        {
+          "name": "as",
+          "description": "Type: `TextAs`\n\nDefault: `\"p\"`\n\nOn `<tt-text>`",
+          "values": [
+            {
+              "name": "p"
+            },
+            {
+              "name": "span"
+            },
+            {
+              "name": "h1"
+            },
+            {
+              "name": "h2"
+            },
+            {
+              "name": "h3"
+            },
+            {
+              "name": "h4"
+            },
+            {
+              "name": "h5"
+            },
+            {
+              "name": "h6"
+            }
+          ]
+        },
+        {
+          "name": "size",
+          "description": "Type: `TextSize`\n\nDefault: `\"auto\"`\n\nOn `<tt-text>`",
+          "values": [
+            {
+              "name": "auto"
+            },
+            {
+              "name": "xs"
+            },
+            {
+              "name": "sm"
+            },
+            {
+              "name": "md"
+            },
+            {
+              "name": "lg"
+            },
+            {
+              "name": "xl"
+            },
+            {
+              "name": "2xl"
+            },
+            {
+              "name": "3xl"
+            }
+          ]
+        },
+        {
+          "name": "weight",
+          "description": "Type: `TextWeight`\n\nDefault: `\"auto\"`\n\nOn `<tt-text>`",
+          "values": [
+            {
+              "name": "auto"
+            },
+            {
+              "name": "regular"
+            },
+            {
+              "name": "medium"
+            },
+            {
+              "name": "semibold"
+            },
+            {
+              "name": "bold"
+            }
+          ]
+        },
+        {
+          "name": "tone",
+          "description": "Type: `TextTone`\n\nDefault: `\"default\"`\n\nOn `<tt-text>`",
+          "values": [
+            {
+              "name": "default"
+            },
+            {
+              "name": "muted"
+            },
+            {
+              "name": "brand"
+            },
+            {
+              "name": "success"
+            },
+            {
+              "name": "warning"
+            },
+            {
+              "name": "danger"
+            }
+          ]
+        },
+        {
+          "name": "align",
+          "description": "Type: `TextAlign`\n\nDefault: `\"start\"`\n\nOn `<tt-text>`",
+          "values": [
+            {
+              "name": "start"
+            },
+            {
+              "name": "center"
+            },
+            {
+              "name": "end"
+            },
+            {
+              "name": "justify"
+            }
+          ]
+        },
+        {
+          "name": "max-lines",
+          "description": "Type: `number`\n\nDefault: `0`\n\nOn `<tt-text>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-textarea",
+      "description": "**Events:** tt-input, tt-change",
+      "attributes": [
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-textarea>`"
+        },
+        {
+          "name": "placeholder",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-textarea>`"
+        },
+        {
+          "name": "value",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-textarea>`"
+        },
+        {
+          "name": "name",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-textarea>`"
+        },
+        {
+          "name": "autocomplete",
+          "description": "Type: `AutoCompleteToken | undefined`\n\nOn `<tt-textarea>`"
+        },
+        {
+          "name": "error",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-textarea>`"
+        },
+        {
+          "name": "label-hidden",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-textarea>`"
+        },
+        {
+          "name": "rows",
+          "description": "Type: `number`\n\nDefault: `4`\n\nOn `<tt-textarea>`"
+        },
+        {
+          "name": "maxlength",
+          "description": "Type: `number`\n\nDefault: `0`\n\nOn `<tt-textarea>`"
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-textarea>`"
+        },
+        {
+          "name": "required",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-textarea>`"
+        },
+        {
+          "name": "full-width",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-textarea>`"
+        },
+        {
+          "name": "auto-grow",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-textarea>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-thread",
+      "description": "The reading side of a messaging surface. Pairs with tt-inbox.\n\nSplit from the list because the two sit in different places: side by\nside on a desktop, two separate routes on a phone. One component would\nhave to make that layout decision for the app.\n\nTHREE THINGS THAT ARE EASY TO GET WRONG AND ANNOYING TO LIVE WITH.\n\nIt scrolls to the bottom on new messages, because a thread is read\nnewest-last and opening one part-way up is disorienting. It only does\nso when the reader was ALREADY at the bottom, so it never yanks\nsomebody out of older messages they were deliberately reading.\n\nConsecutive messages from the same author collapse: the avatar and name\nappear once and the following bubbles are bare. Repeating the name on\nevery line of a burst is noise.\n\nThe composer is Enter to send, Shift+Enter for a newline. That is what\nevery messaging product does, and a thread that needs a mouse click to\nsend feels broken regardless of how correct it is.\n\n**Events:** tt-send",
+      "attributes": [
+        {
+          "name": "messages",
+          "description": "Type: `Message[]`\n\nDefault: `[]`\n\nOn `<tt-thread>`"
+        },
+        {
+          "name": "heading",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-thread>`"
+        },
+        {
+          "name": "placeholder",
+          "description": "Type: `string`\n\nDefault: `\"Write a message\"`\n\nOn `<tt-thread>`"
+        },
+        {
+          "name": "send-label",
+          "description": "Type: `string`\n\nDefault: `\"Send\"`\n\nOn `<tt-thread>`"
+        },
+        {
+          "name": "readonly",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-thread>`"
+        },
+        {
+          "name": "sending",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-thread>`"
+        },
+        {
+          "name": "empty-text",
+          "description": "Type: `string`\n\nDefault: `\"No messages yet\"`\n\nOn `<tt-thread>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-toast",
+      "description": "Drop one of these anywhere in the app, then call the module-level\ntoast() from anywhere else. Notifications are global by nature, so\nrouting every message down through props would mean every component\nin the tree carrying a notify callback it does not otherwise need.",
+      "attributes": [
+        {
+          "name": "position",
+          "description": "Type: `\"top-right\" | \"top-center\" | \"bottom-right\" | \"bottom-center\"`\n\nDefault: `\"top-right\"`\n\nOn `<tt-toast>`",
+          "values": [
+            {
+              "name": "top-right"
+            },
+            {
+              "name": "top-center"
+            },
+            {
+              "name": "bottom-right"
+            },
+            {
+              "name": "bottom-center"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "tt-toggle",
+      "description": "A button that stays down.\n\nBold, italic, underline. Grid view or list view. A filter that is on.\nAnything whose state is visible in the control itself rather than\nsomewhere else on the page.\n\n---------------------------------------------------------------------\nNOT A CHECKBOX AND NOT A SWITCH, AND THE DIFFERENCE IS NOT COSMETIC.\n\n  tt-checkbox  a value being collected, confirmed later by a submit.\n               It has a label beside it and it lives in a form.\n  tt-switch    a setting that takes effect immediately. Reads as a\n               sentence: \"Email notifications, on\".\n  tt-toggle    a tool that is currently selected. Usually an icon,\n               usually in a row of siblings, and its meaning comes\n               from what it does to something else.\n\nThey carry different ARIA too, which is the real tell: a checkbox is\n`aria-checked`, a toggle is `aria-pressed`. A screen reader announces\n\"pressed\" rather than \"checked\", and that is the correct sentence for\na bold button.\n\n---------------------------------------------------------------------\nIT FLIPS ITSELF, UNLESS IT IS IN A GROUP.\n\nOn its own it toggles and announces, the same shape as tt-switch. That\nis the only sensible default for a control that has nothing\ncoordinating it.\n\nInside tt-toggle-group the group writes `pressed` back onto every\nchild after any change, so the group's answer is the one that lasts.\nThat is deliberate: single-select needs someone to un-press the\nprevious choice, and only the group can know which one that was.\n\n**Events:** tt-change",
+      "attributes": [
+        {
+          "name": "pressed",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-toggle>`"
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-toggle>`"
+        },
+        {
+          "name": "size",
+          "description": "Type: `ToggleSize`\n\nDefault: `\"medium\"`\n\nOn `<tt-toggle>`",
+          "values": [
+            {
+              "name": "small"
+            },
+            {
+              "name": "medium"
+            },
+            {
+              "name": "large"
+            }
+          ]
+        },
+        {
+          "name": "value",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-toggle>`"
+        },
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-toggle>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-toggle-group",
+      "description": "A row of tt-toggle that agree with each other.\n\n---------------------------------------------------------------------\n`values` IS ALWAYS AN ARRAY, EVEN IN SINGLE MODE.\n\nThe obvious API is `value: string` for single and `values: string[]`\nfor multiple, which is what most libraries do. It is rejected here.\n\nA property whose TYPE depends on another property is a property you\nhave to think about at every call site, and it makes the change event\ncarry two shapes as well. Every consumer then needs a branch, and half\nof them will forget it.\n\nOne shape instead: a single-select group holds an array of zero or one\nentries. `values[0] ?? null` is the whole cost, paid once by whoever\nactually wants a scalar, and `tt-change` always carries the complete\nnew array. Same contract as tt-checkbox-group.\n\n---------------------------------------------------------------------\nWHO OWNS THE SELECTION.\n\nBoth. `values` comes in, and `tt-change` goes out with the whole new\nset. The group also keeps that new set itself (Oct 2026). It used to\nstore nothing and wait for the page to echo `values` back, which\nmeant a group with no listener (a pasted snippet, a generated\ncomponent) started every click from the old set: `multiple` acted\nlike single, and `allow-empty` cleared instead of selecting. A page\nthat sets `values` still wins, the same as with a native input.\n\nBut it does WRITE to its children, immediately, in its own handler,\nrather than waiting for the page to echo `values` back. That is the\none thing worth understanding here.\n\nA tt-toggle flips itself when clicked. In single mode that leaves two\npressed toggles for as long as it takes the page to respond, and if\nthe page ignores the event it leaves them pressed forever. So the\ngroup corrects its children on the spot: the click is the child's, the\nANSWER is the group's.\n\nThat makes it work whether or not the page echoes the value back, and\n`updated()` re-applies the same result when it does, which is\nidempotent (applying it twice is the same as applying it once).\n\n**Events:** tt-change",
+      "attributes": [
+        {
+          "name": "multiple",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-toggle-group>`"
+        },
+        {
+          "name": "type",
+          "description": "The older spelling of `multiple`; type=\"multiple\" still works.\n\nType: `ToggleGroupType`\n\nDefault: `\"single\"`\n\nOn `<tt-toggle-group>`",
+          "values": [
+            {
+              "name": "single"
+            },
+            {
+              "name": "multiple"
+            }
+          ]
+        },
+        {
+          "name": "values",
+          "description": "Type: `string[]`\n\nDefault: `[]`\n\nOn `<tt-toggle-group>`"
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-toggle-group>`"
+        },
+        {
+          "name": "label",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-toggle-group>`"
+        },
+        {
+          "name": "detached",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-toggle-group>`"
+        },
+        {
+          "name": "allow-empty",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-toggle-group>`"
+        }
+      ]
+    },
+    {
+      "name": "tt-toolbar",
+      "description": "The row above a list: something to filter with on the left, actions on\nthe right, and a gap between them that collapses when the row wraps.\n\nThis is the third copy of the same flex row in this repo, which is the\npoint at which a pattern earns a component. Directory, Members and Shop\neach had their own, and each had drifted: different gaps, different\nwrap behaviour, and a hand-rolled spacer div in two of them.\n\nPure layout. It has no idea what is in it, so a search box, a segmented\ncontrol or a count all work without it knowing.",
+      "attributes": [
+        {
+          "name": "bordered",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-toolbar>`"
+        },
+        {
+          "name": "stack",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-toolbar>`"
+        },
+        {
+          "name": "align",
+          "description": "Type: `\"center\" | \"start\"`\n\nDefault: `\"center\"`\n\nOn `<tt-toolbar>`",
+          "values": [
+            {
+              "name": "center"
+            },
+            {
+              "name": "start"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "tt-tooltip",
+      "description": "A short hint attached to whatever you slot into it.\n\nOnly ever supplementary. A tooltip is invisible on touch devices and to\nanyone who does not hover, so never put information here that a user\nneeds in order to complete a task.",
+      "attributes": [
+        {
+          "name": "content",
+          "description": "Type: `string`\n\nDefault: `\"\"`\n\nOn `<tt-tooltip>`"
+        },
+        {
+          "name": "placement",
+          "description": "Type: `TooltipPlacement`\n\nDefault: `\"top\"`\n\nOn `<tt-tooltip>`",
+          "values": [
+            {
+              "name": "top"
+            },
+            {
+              "name": "bottom"
+            },
+            {
+              "name": "left"
+            },
+            {
+              "name": "right"
+            }
+          ]
+        },
+        {
+          "name": "disabled",
+          "description": "Type: `boolean`\n\nDefault: `false`\n\nOn `<tt-tooltip>`"
+        },
+        {
+          "name": "delay",
+          "description": "Type: `number`\n\nDefault: `150`\n\nOn `<tt-tooltip>`"
+        }
+      ]
+    }
+  ]
+}