{
  "add-ons": [
    {
      "name": "Reveal",
      "description": "Fades and rises its children the first time they reach the viewport. Never un-reveals.",
      "url": "https://adamjurek.com/r/tanstack/reveal.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Typed Mark",
      "description": "Types a word out one character at a time, cycling the syntax palette. No JavaScript, no state, and it runs with scripting off.",
      "url": "https://adamjurek.com/r/tanstack/typed-mark.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Smooth Scroll",
      "description": "Mounts Lenis for the page and renders nothing. Respects reduced motion.",
      "url": "https://adamjurek.com/r/tanstack/smooth-scroll.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Scroll Spin",
      "description": "Rotates its children with the page scroll, in a rAF callback rather than React state.",
      "url": "https://adamjurek.com/r/tanstack/scroll-spin.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "useScrollTurn",
      "description": "Scroll position as a rotation, delivered once per frame. Drives a CSS transform or a three.js object, never React state.",
      "url": "https://adamjurek.com/r/tanstack/use-scroll-turn.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Archive",
      "description": "A filterable grid with categories, subcategories and tags. Renders its own links through a callback so the router stays yours.",
      "url": "https://adamjurek.com/r/tanstack/archive.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "useScrollProgress",
      "description": "How far one element has travelled up the viewport, 0 to 1, once per frame. Gated by an observer so an off-screen element costs nothing.",
      "url": "https://adamjurek.com/r/tanstack/use-scroll-progress.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Device",
      "description": "A phone, a tablet or a laptop in CSS 3D, chosen by the stylesheet rather than by JavaScript, whose screen is a real scroll container with real controls in it.",
      "url": "https://adamjurek.com/r/tanstack/device.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "useDeviceKind",
      "description": "Which machine the stylesheet is currently drawing, as a value. Null until mounted, on purpose - a default would be a claim the server cannot support.",
      "url": "https://adamjurek.com/r/tanstack/use-device-kind.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Desk Window",
      "description": "A window you can drag, close and stack. Position is written to the element during a drag and to state only on release.",
      "url": "https://adamjurek.com/r/tanstack/desk-window.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Dock",
      "description": "A launcher, what is open, and a corner. Search opens upward and results are the consumer's to compute.",
      "url": "https://adamjurek.com/r/tanstack/dock.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "useDeskState",
      "description": "Which windows are open, where they sit and what has been put away, remembered without breaking a server render.",
      "url": "https://adamjurek.com/r/tanstack/use-desk-state.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Context Menu",
      "description": "One menu, reachable by right-click, by long press, and by a button. Escape and arrow keys included.",
      "url": "https://adamjurek.com/r/tanstack/context-menu.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Folder Shelf",
      "description": "A desktop of folders that open into draggable windows, several at once, remembered between visits.",
      "url": "https://adamjurek.com/r/tanstack/folder-shelf.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Boot Loader",
      "description": "A count to a hundred that stalls at ninety until what it is covering has actually arrived. Fills its parent, not the viewport.",
      "url": "https://adamjurek.com/r/tanstack/boot-loader.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Questions",
      "description": "The questions a page expects to be asked. Given an onAsk, each one is a button that puts itself to an assistant; without it, a plain list.",
      "url": "https://adamjurek.com/r/tanstack/questions.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Card",
      "description": "Title, optional meta, arbitrary body. Heading level is a prop so the outline stays correct.",
      "url": "https://adamjurek.com/r/tanstack/card.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Section",
      "description": "Kicker, heading and body, revealing top-down with an 80ms offset.",
      "url": "https://adamjurek.com/r/tanstack/section.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Doc Aside",
      "description": "An on-page table of contents: a sticky rail on desktop, a collapsed row on mobile. Collapse is CSS, not state.",
      "url": "https://adamjurek.com/r/tanstack/doc-aside.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Doc Nav",
      "description": "The left rail of a documentation page: the sections of a library, the elements in each, and the one that is open. A sticky column on a wide screen, a collapsed row below it.",
      "url": "https://adamjurek.com/r/tanstack/doc-nav.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Hero",
      "description": "The head of a documentation page: trail, element name, version, measured facts, actions and a responsive shot. Folds to one column by the room it has, not by the size of the window.",
      "url": "https://adamjurek.com/r/tanstack/hero.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Showcase",
      "description": "A component in a real iframe at every width it has to survive, side by side, with its source and install commands.",
      "url": "https://adamjurek.com/r/tanstack/showcase.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Clock",
      "description": "The reader's own day and time, in the reader's own zone, without asking anybody for a location.",
      "url": "https://adamjurek.com/r/tanstack/clock.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Credit",
      "description": "A dependency, credited, with its author required rather than optional.",
      "url": "https://adamjurek.com/r/tanstack/credit.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Markdown View",
      "description": "Renders Markdown with callouts, CSS-only tabs, custom blocks and highlighted code.",
      "url": "https://adamjurek.com/r/tanstack/markdown-view.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Code Block",
      "description": "A highlighted code slab with the CLI's colours, a lit top edge, and a copy button that confirms in place.",
      "url": "https://adamjurek.com/r/tanstack/code-block.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Copy Button",
      "description": "A glass chip that writes to the clipboard and confirms in the button itself, then hands back.",
      "url": "https://adamjurek.com/r/tanstack/copy-button.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Breadcrumb",
      "description": "The trail, told twice from one list: a visible nav with correct ARIA, and the schema.org BreadcrumbList rendered from the same array.",
      "url": "https://adamjurek.com/r/tanstack/breadcrumb.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Command Palette",
      "description": "Search over everything the host can name, in a native dialog: substring filter, arrow keys, and the host keeps the router.",
      "url": "https://adamjurek.com/r/tanstack/command-palette.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Pagination",
      "description": "Pages as links with first and last always reachable. The window everyone already knows, and nothing that breaks middle-click.",
      "url": "https://adamjurek.com/r/tanstack/pagination.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Typography",
      "description": "The type scale as components: Heading with outline and size separated, the Label eyebrow, the Lead. One decision, made once.",
      "url": "https://adamjurek.com/r/tanstack/typography.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Badge",
      "description": "A word wearing a fill, in the site's own tone pairs - a badge invents no colour of its own.",
      "url": "https://adamjurek.com/r/tanstack/badge.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Kbd",
      "description": "A key, drawn as one. Semantically <kbd>, visually the chip the command palette already wears.",
      "url": "https://adamjurek.com/r/tanstack/kbd.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Separator",
      "description": "A rule with two directions and an accessibility decision: announced when it separates content, silent when it is furniture.",
      "url": "https://adamjurek.com/r/tanstack/separator.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Skeleton",
      "description": "The wait, drawn as the thing being waited for: a line, a block or a circle, shimmering unless motion is reduced.",
      "url": "https://adamjurek.com/r/tanstack/skeleton.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Spinner",
      "description": "One ring, one border, one turn - with a visually hidden label, because a spinner with nothing to announce is just an animation.",
      "url": "https://adamjurek.com/r/tanstack/spinner.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Avatar",
      "description": "A person at glyph size: the image if it loads, initials on a toned fill if it does not.",
      "url": "https://adamjurek.com/r/tanstack/avatar.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Aspect Ratio",
      "description": "A box that keeps its shape and fills whatever is put in it. CSS aspect-ratio, as a prop.",
      "url": "https://adamjurek.com/r/tanstack/aspect-ratio.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Button",
      "description": "The pill and the ghost - one action and its alternative, with no third variant on purpose.",
      "url": "https://adamjurek.com/r/tanstack/button.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Empty",
      "description": "Nothing, said properly: what is missing, why that is fine, and what to do next - in that order, quietly.",
      "url": "https://adamjurek.com/r/tanstack/empty.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Item",
      "description": "One row of a list: tile, title, description, meta - the nav panel's anatomy, extracted for reuse.",
      "url": "https://adamjurek.com/r/tanstack/item.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Input",
      "description": "A text input, and only the drawing of one - state and labels belong to the form and to Field.",
      "url": "https://adamjurek.com/r/tanstack/input.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Textarea",
      "description": "A textarea in the same clothes as Input, growing with its content where the browser allows.",
      "url": "https://adamjurek.com/r/tanstack/textarea.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Field",
      "description": "A labelled control with one line under it - the error is announced by being pointed at, not by being red.",
      "url": "https://adamjurek.com/r/tanstack/field.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Checkbox",
      "description": "A native checkbox with its words attached, painted by accent-color rather than redrawn.",
      "url": "https://adamjurek.com/r/tanstack/checkbox.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Radio Group",
      "description": "Radios in a fieldset - the one grouping screen readers announce without help.",
      "url": "https://adamjurek.com/r/tanstack/radio-group.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Switch",
      "description": "A checkbox that admits it: a real input with role=switch, and a track :checked drives.",
      "url": "https://adamjurek.com/r/tanstack/switch.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Native Select",
      "description": "The platform's own select in the site's clothes - the phone wheel and the OS menu, kept.",
      "url": "https://adamjurek.com/r/tanstack/native-select.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Slider",
      "description": "A native range input with its label - keyboard steps and form value ship in the element.",
      "url": "https://adamjurek.com/r/tanstack/slider.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Progress",
      "description": "The native progress element, restyled - omit value and the indeterminate state is real.",
      "url": "https://adamjurek.com/r/tanstack/progress.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Accordion",
      "description": "details, stacked - every behaviour ships in the element, and items open independently on purpose.",
      "url": "https://adamjurek.com/r/tanstack/accordion.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Collapsible",
      "description": "One details, dressed - a sentence that opens, for prose rather than lists.",
      "url": "https://adamjurek.com/r/tanstack/collapsible.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Alert",
      "description": "The Markdown callout, reachable from JSX - application news in the same box the docs already use.",
      "url": "https://adamjurek.com/r/tanstack/alert.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Tooltip",
      "description": "One line on hover and focus, in the markup rather than in title= - and never carrying controls.",
      "url": "https://adamjurek.com/r/tanstack/tooltip.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Toggle",
      "description": "A button that stays down, and the single-select group of them - aria-pressed is the whole contract.",
      "url": "https://adamjurek.com/r/tanstack/toggle.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Table",
      "description": "A table that is a table: declared columns, right-aligned numbers, sideways scroll in its own frame.",
      "url": "https://adamjurek.com/r/tanstack/table.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Scroll Area",
      "description": "The named inner scroll: thin bar, and the smooth scroller handed back - the pair everyone forgets separately.",
      "url": "https://adamjurek.com/r/tanstack/scroll-area.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Dialog",
      "description": "A native dialog driven by props: top layer, focus trap and Escape from the element, click-outside from here.",
      "url": "https://adamjurek.com/r/tanstack/dialog.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Sheet",
      "description": "The dialog docked to an edge, for content tall enough that centring it would mean scrolling a floating box.",
      "url": "https://adamjurek.com/r/tanstack/sheet.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Toast",
      "description": "Strings, four seconds, bottom corner, announced politely - one provider and one hook, nothing else.",
      "url": "https://adamjurek.com/r/tanstack/toast.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Reference",
      "description": "An inline mention that carries a hover card: title, summary and meta for the thing it names, raised by CSS alone.",
      "url": "https://adamjurek.com/r/tanstack/reference.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Grid",
      "description": "A responsive grid with no breakpoints in it. One number decides the column count at every width.",
      "url": "https://adamjurek.com/r/tanstack/grid.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Theme Toggle",
      "description": "A segmented control that reports which option was pressed and knows nothing about themes. Roving focus, and `aria-checked` is the selector that draws it.",
      "url": "https://adamjurek.com/r/tanstack/theme-toggle.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Spacer",
      "description": "Vertical space on the scale, optionally with a rule and a label. For Markdown, where there is no markup to hang a margin on.",
      "url": "https://adamjurek.com/r/tanstack/spacer.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Nav Bar",
      "description": "A site header whose panels expand. Built on <details>, so it works before hydration and closes on Escape.",
      "url": "https://adamjurek.com/r/tanstack/nav-bar.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Video Player",
      "description": "A video held behind a picture of itself. The player is a child, so it mounts on play and unmounts on stop - no vendor, no bytes and no cookies until somebody asks.",
      "url": "https://adamjurek.com/r/tanstack/video-player.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    },
    {
      "name": "Frontmatter",
      "description": "A small frontmatter reader for `key: value` and inline lists. Not YAML, deliberately.",
      "url": "https://adamjurek.com/r/tanstack/frontmatter.json",
      "modes": [
        "file-router"
      ],
      "framework": "react"
    }
  ]
}