@prestack/thread-ui 0.1.10 → 0.1.12

package/dist/ui/attach.ts

@@ -1,553 +0,0 @@
-import type { Attaching } from '@prestack/thread/core/attach'
-import { SHAPED } from '@prestack/thread/core/init'
-import { NAMED, named } from '@prestack/thread/core/scope'
-import type { Threaded } from '@prestack/thread/core/thread'
-
-import { ANIMATIONS } from './animations.ts'
-import { COMPOSITIONS } from './compositions.ts'
-import { FONTS } from './fonts.ts'
-import { ICONS, SET_ROW, setNamed } from './icons.ts'
-import { LOCALIZATIONS } from './localizations.ts'
-import { ELEMENTS } from './elements.ts'
-import { MATERIALS } from './materials.ts'
-import { MODES } from './modes.ts'
-import { SCREENS } from './screens.ts'
-import { STYLEGUIDES } from './styleguides.ts'
-import { SIGNALS } from './signals.ts'
-import { THEMES } from './themes.ts'
-import { TOKENS } from './tokens.ts'
-import { VARIANTS } from './variants.ts'
-
-const SEEDED = {
-  attaches: ['@prestack/thread'] as const,
-  id: 'ui',
-  declares: [
-    '    {',
-    '      id: \'ui\',',
-    '      at: \'_threads/ui.ts\',',
-    '      describes: \'Draws things. An app declares its elements, variants and screens, and the components, stylesheet and translations follow.\',',
-    '      version: 1,',
-    '    },',
-  ].join('\n'),
-}
-
-const SHIPPED: readonly { readonly into: string; readonly list: string; readonly id: string; readonly source: string }[] = [
-  {
-    into: 'ui.ts',
-    list: 'GENERATORS',
-    id: 'styles-generator',
-    source: "  {\n    id: 'styles-generator',\n    at: 'node_modules/@prestack/thread-ui/dist/ui/generators/styles.js',\n    describes: 'The generator of the stylesheet — it reads the tokens, materials, variants and style guide an app declares and writes one class per variant, so what an app looks like is a consequence of its declarations rather than a file somebody maintains beside them.',\n    version: 1,\n    by: 'thread styles',\n    runs: 'thread styles --check',\n    derives: [\n      {\n        id: 'stylesheet',\n        at: 'app/_generated/tokens.css',\n        describes: 'One class per variant and one variable per value, written from the declarations rather than kept beside them.',\n        version: 1,\n        by: 'thread styles',\n        runs: 'thread styles --check',\n      },\n      {\n        id: 'declared',\n        at: 'app/_generated/declared.ts',\n        describes: 'What this app declared for itself, said in types so an element offers it — a variant an app wrote is a member on the element that wears it, the way a shipped one is. A declaration file because it weighs nothing: it is gone at build, so an app gets its own variants without a registry being shipped into the artifact.',\n        version: 1,\n        by: 'thread styles',\n        runs: 'thread styles --check',\n      },\n    ],\n  },",
-  },
-  {
-    into: 'ui.ts',
-    list: 'GENERATORS',
-    id: 'tokens-generator',
-    source: "  {\n    id: 'tokens-generator',\n    at: 'node_modules/@prestack/thread-ui/dist/ui/tokens.js',\n    describes: 'The seeder of token files — it reads the tokens an app declares and writes the file each `declares` row names when that file is not there yet, so a token that carries a rule begins by being declared rather than by somebody remembering to add a file beside the row. A `holds` row names no file, because a token that is only a name has nothing to seed. Run with `--check`, the mode the gate runs it in, it writes nothing and refuses instead: a file that disagrees with its row, a file under tokens no row names, or a row with no file at all — so an unseeded token is a gate failure, not something the gate quietly fixes.',\n    version: 1,\n    by: 'thread tokens',\n    runs: 'thread tokens --check',\n  },",
-  },
-  {
-    into: 'ui.ts',
-    list: 'GENERATORS',
-    id: 'materials-generator',
-    source: "  {\n    id: 'materials-generator',\n    at: 'node_modules/@prestack/thread-ui/dist/ui/materials.js',\n    describes: 'The seeder of material files — it reads the materials an app declares and writes the `mat_` file each row names when that file is not there yet. Run with `--check`, the mode the gate runs it in, it writes nothing and refuses instead: a file that disagrees with its row, a `mat_` file no row names, or a row with no file at all — so an unseeded material is a gate failure, not something the gate quietly fixes.',\n    version: 1,\n    by: 'thread materials',\n    runs: 'thread materials --check',\n  },",
-  },
-  {
-    into: 'ui.ts',
-    list: 'GENERATORS',
-    id: 'i18n-generator',
-    source: "  {\n    id: 'i18n-generator',\n    at: 'node_modules/@prestack/thread-ui/dist/ui/generators/i18n.js',\n    describes: 'The generator of an app\\'s wording — it reads the languages the app declares and every message key its interface names, and writes one file per language holding a line for each. It cannot invent a sentence, so a key it has just found arrives holding nothing; run with `--check`, the mode the gate runs it in, it writes nothing and refuses a language file that is not what the declarations produce, and refuses any key left unanswered. It also writes the module the app imports, which states the keys the interface uses as a type, so a language missing one is a compiler error before it is a gate error.',\n    version: 1,\n    by: 'thread i18n',\n    runs: 'thread i18n --check',\n    derives: [\n      {\n        id: 'wording',\n        at: 'app/_generated/wording.ts',\n        describes: 'Every language this app is in, as one module the layout hands to the provider, with the keys the interface names stated as a type so a language missing one is a compiler error. That type is written as an assignment rather than a satisfies clause, because satisfies would also refuse the extra keys a filled wording always carries.',\n        version: 1,\n        by: 'thread i18n',\n        runs: 'thread i18n --check',\n      },\n    ],\n  },",
-  },
-  {
-    into: 'ui.ts',
-    list: 'GENERATORS',
-    id: 'routes-generator',
-    source: "  {\n    id: 'routes-generator',\n    at: 'node_modules/@prestack/thread-ui/dist/ui/generators/routes.js',\n    describes: 'The generator of the routes, the map, the pages a browser reaches, and the root layout. Nobody types a route. The first page an app declares answers `/`, every other page answers its own name, and a sheet, popover, overlay or toast has no route, so the page under each route follows from the screens sheet. It writes the row on each screen that names that page too, so a screen that stops being the first page, or stops being a page at all, takes its page with it. It reads every `navigateTo` the screens and their compositions hold and writes the map: from which screen, through which button, to which screen. A button is the only thing that makes a link. A press that names a sheet, popover, overlay or toast is a link like any other, and the client half opens that screen where somebody already is. A name no screen has, a destination not written out as a name, and a route typed into a screen are each refused by name. The layout imports what the other generators produce. Run with `--check`, the mode the gate runs it in, it writes nothing and refuses a hand edit to any of these files, exactly as the stylesheet is refused.',\n    version: 1,\n    by: 'thread routes',\n    runs: 'thread routes --check',\n    derives: [\n      {\n        id: 'layout',\n        at: 'app/layout.tsx',\n        describes: 'The root layout — it imports what the other generators produce and hands the wording to the provider, so the one file every page passes through is a consequence of the declarations rather than something somebody keeps in step with them.',\n        version: 1,\n        by: 'thread routes',\n        runs: 'thread routes --check',\n      },\n      {\n        id: 'door',\n        at: 'app/_generated/door.tsx',\n        describes: 'This app\\'s own client half. It is written when the app has operations a page can reach, or screens a press can move between. The provider takes something to run an operation with and something to move between screens with, and the layout cannot hand either over: the layout is a server component and the provider is a client one, and a function does not cross that line — \"Functions cannot be passed directly to Client Components\", measured 2026-09-01 as a page that returned 500 on every request while the gate was green. So both are made on the side that uses them. This file imports what the operations half derived and the map, and hands them over itself. The layout renders this and passes only the actor, which is data and crosses the way data does.',\n        version: 1,\n        by: 'thread routes',\n        runs: 'thread routes --check',\n      },\n      {\n        id: 'bundler',\n        at: 'next.config.js',\n        describes: 'What Next reads to serve this app. It is written whenever the manifest runs Next, whether or not this app declares a screen, because it states three things a served app needs and one of them is that Next may not write files of its own into a tree where every file is declared. It also refuses to compile anything until the gate has passed, and names where the bundler resolves from when the packages live outside this app — which is when a bundler cannot see them and every import fails at run time while the compiler is content. It opens the disk itself rather than through the disk this framework declares, because Next reads this file before any TypeScript in this tree has been loaded — a file that gates the build cannot import the thing it is gating.',\n        version: 1,\n        by: 'thread routes',\n        runs: 'thread routes --check',\n      },\n      {\n        id: 'map',\n        at: 'app/_generated/map.ts',\n        describes: 'Every screen this app has, where each one lives, and every way from one to another: from which screen, through which button, to which screen. It is read off every `navigateTo` the screens and their compositions hold, so a button is the only thing that makes a link. The client half moves through it: a press that names a page goes to the address held here, and a press that names a sheet, popover, overlay or toast opens it where somebody already is. A screen no button reaches is printed by `thread routes` rather than found by somebody looking for it.',\n        version: 1,\n        by: 'thread routes',\n        runs: 'thread routes --check',\n      },\n    ],\n  },",
-  },
-  {
-    into: 'ui.ts',
-    list: 'GENERATORS',
-    id: 'dev-generator',
-    source: "  {\n    id: 'dev-generator',\n    at: 'node_modules/@prestack/thread-ui/dist/ui/generators/dev.js',\n    describes: 'The command that runs the app, and the only one here that puts a pixel on a screen — until it existed the framework could build an interface nothing in it could start, because a gate answers whether declarations agree with files and cannot answer whether a button is where somebody says it is not. It is two halves in one word. First it settles this tree: every generator the declarations name is run until the checks stop complaining, which is what `thread create` and `thread run trial` already did and what starting the app was alone in not doing — an app had `thread gate` in front of `next dev`, and a gate refuses a stale file rather than writing it. Then it runs the gate, and then starts Next itself, because Next is what this package installs to serve an app and the manifest carries no script for it. The generators are read off the rows, and `next dev` is the one thing written down here: this package serves an app with Next and nothing else. `--ship` swaps the entry for the build. Alone among the generators it carries no `runs:`, because a server stays up until it is stopped and a gate step that never returns is a gate that hangs.',\n    version: 1,\n    by: 'thread dev',\n  },",
-  },
-  {
-    into: 'ui.ts',
-    list: 'GENERATORS',
-    id: 'show-generator',
-    source: "  {\n    id: 'show-generator',\n    at: 'node_modules/@prestack/thread-ui/dist/ui/generators/show.js',\n    describes: 'The reader of what nothing reaches — style guide rows nothing names, variants no element accepts, elements wearing nothing, and signals no element is seen to raise. It writes nothing and refuses nothing, because none of those is wrong on its own: a value declared ahead of the thing that will use it is ordinary, and a report that refused it would teach people to stop reading. It exists because the gate answers whether declarations agree with each other and cannot answer whether anything reaches them, and the difference between those two questions cost six capabilities in one week — each declared, typechecked, generated, and unable to run.',\n    version: 1,\n    by: 'thread show',\n  },",
-  },
-  {
-    into: 'ui.ts',
-    list: 'GENERATORS',
-    id: 'variants-generator',
-    source: "  {\n    id: 'variants-generator',\n    at: 'node_modules/@prestack/thread-ui/dist/ui/generators/variants.js',\n    describes: 'The seeder of variant files — it reads the variants an app declares and writes the `var_` file each row names when that file is not there yet. Run with `--check`, the mode the gate runs it in, it writes nothing and refuses instead: a file that disagrees with its row, a `var_` file no row names, or a row with no file at all. It is the last of the three file-backed sheets to get this, and it was the one that needed it — a variant file nothing declared sat in the framework unnoticed until two readers found it by hand, because no gate could.',\n    version: 1,\n    by: 'thread variants',\n    runs: 'thread variants --check',\n  },",
-  },
-  {
-    into: 'ui.ts',
-    list: 'GENERATORS',
-    id: 'elements-generator',
-    source: "  {\n    id: 'elements-generator',\n    at: 'node_modules/@prestack/thread-ui/dist/ui/generators/elements.js',\n    describes: 'The writer of element files — it reads the tag an element row states, whether it arranges other things and the signals it raises, and writes the component out of those three facts. An element file stops being a place a tag is typed and becomes a derived thing. Founder, 2026-08-31: \"elements does not hold anything that can render anything, its functionality only . only our compiler can translate things into proper css and html and only at build time do we produce a renderable result.\" Only a row that names this generator in its own `derives` is written, so an element carrying real behaviour is left exactly as it is until it is converted. Run with `--check`, the mode the gate runs it in, it writes nothing and refuses a file that differs from what its row produces.',\n    version: 1,\n    by: 'thread elements',\n    runs: 'thread elements --check',\n  },",
-  },
-  {
-    into: 'ui.ts',
-    list: 'GENERATORS',
-    id: 'icons-generator',
-    source: "  {\n    id: 'icons-generator',\n    at: 'node_modules/@prestack/thread-ui/dist/ui/generators/icons.js',\n    describes: 'The generator of the icon module — it reads which library the icon rows name and which meanings they declare, and writes the one module that imports exactly those symbols and installs them. A meaning is what an element asks for, so changing the library row redraws every icon in the app and rewrites nothing else. Run with `--check`, the mode the gate runs it in, it writes nothing and refuses a generated file that does not match the rows.',\n    version: 1,\n    by: 'thread icons',\n    runs: 'thread icons --check',\n    derives: [\n      {\n        id: 'symbols',\n        at: 'app/_generated/icons.ts',\n        describes: 'The one module importing exactly the symbols the icon rows name, from the one library they name. The layout renders it rather than merely importing it, because a bare import of a client module from a server layout is a reference that never runs — the install never happens and every icon on the page refuses.',\n        version: 1,\n        by: 'thread icons',\n        runs: 'thread icons --check',\n      },\n    ],\n  },",
-  },
-  {
-    into: 'ui.ts',
-    list: 'GENERATORS',
-    id: 'animations-generator',
-    source: "  {\n    id: 'animations-generator',\n    at: 'node_modules/@prestack/thread-ui/dist/ui/animations.js',\n    describes: 'The seeder of animation files — it reads the animations an app declares and writes the `anm_` file each row names when that file is not there yet. Run with `--check`, the mode the gate runs it in, it writes nothing and refuses instead: a file that disagrees with its row, an `anm_` file no row names, or a row with no file at all — so an unseeded animation is a gate failure, not something the gate quietly fixes.',\n    version: 1,\n    by: 'thread animations',\n    runs: 'thread animations --check',\n  },",
-  },
-  {
-    into: 'ui.ts',
-    list: 'GENERATORS',
-    id: 'compositions-generator',
-    source: "  {\n    id: 'compositions-generator',\n    at: 'node_modules/@prestack/thread-ui/dist/ui/compositions.js',\n    describes: 'The seeder of composition files — it reads the compositions an app declares and writes the `cmp_` file each row names when that file is not there yet, so a composition begins by being declared rather than by somebody remembering to add a file beside the row. Run with `--check`, the mode the gate runs it in, it writes nothing and refuses instead: a row whose file is absent, a `cmp_` file no row names, and an import that is not a declared element, a declared composition or the door — so a composition that did not come from the CLI, or that reaches something nothing declares, stops the build rather than rendering. It also writes each of them compiled, into `app/_generated/compiled` — a variant worn as a tag becomes the class it resolves to and a named place becomes the class its arrangement declares, so a page imports a file this framework wrote rather than one a bundler plugin rewrites on the way past.',\n    version: 1,\n    by: 'thread compositions',\n    runs: 'thread compositions --check',\n    derives: [\n      {\n        id: 'compiled',\n        at: '_threads/compiled.ts',\n        describes: 'The sheet declaring every file the interface runs from in this app, one row each: the parts of the framework a page needs, copied in, and every composition and screen compiled from the file a person wrote. A page imports only these, so the app builds with no part of this framework installed. `thread compositions` writes the sheet, because a folder declares nothing beneath it. Each row names the command that writes its file: `thread screens` for a compiled screen, `thread compositions` for everything else.',\n        version: 1,\n        by: 'thread compositions',\n        runs: 'thread compositions --check',\n      },\n    ],\n  },",
-  },
-  {
-    into: 'ui.ts',
-    list: 'GENERATORS',
-    id: 'screens-generator',
-    source: "  {\n    id: 'screens-generator',\n    at: 'node_modules/@prestack/thread-ui/dist/ui/screens.js',\n    describes: 'The seeder of screen files — it reads the screens an app declares and writes the `scr_` file each row names when that file is not there yet, so a screen begins by being declared and wears the arrangement its row states rather than carrying one somebody wrote beside it. Run with `--check`, the mode the gate runs it in, it writes nothing and refuses instead: a row whose file is absent, a `scr_` file no row names, and an import that is not a declared composition, a declared element or the door.',\n    version: 1,\n    by: 'thread screens',\n    runs: 'thread screens --check',\n  },",
-  },
-  {
-    into: 'ui.ts',
-    list: 'GENERATORS',
-    id: 'react-compiler',
-    source: "  {\n    id: 'react-compiler',\n    at: 'node_modules/@prestack/thread-ui/dist/ui/generators/react.js',\n    describes: 'The compiler of compositions and screens — it runs inside `thread build`, on every file on its way into the artifact, and turns what a person wrote into what React runs. `Button.primary` becomes a tag wearing the class its variant resolves to, and a name of a place becomes the class the composition or screen around it arranges, so neither is worked out again on every render. It writes nothing to disk: the file a person wrote stays the file a person wrote, and the compiled form exists only in the artifact. Everything it does not own — a condition, a list, a hook somebody wrote — is copied through unchanged.',\n    version: 1,\n    by: 'thread build',\n  },",
-  },
-]
-export const ATTACH_HOME = `node_modules/${named('ui')}/dist`
-
-interface Row {
-  readonly id: string
-  readonly at?: string
-  readonly describes: string
-  readonly section?: string
-  readonly token?: string
-  readonly is?: string
-  readonly asks?: Readonly<Record<string, string | number>>
-  readonly sets?: Readonly<Record<string, string>>
-  readonly modes?: Readonly<Record<string, string | Readonly<Record<string, string>>>>
-  readonly places?: Readonly<Record<string, Readonly<Record<string, string>>>>
-  readonly themes?: Readonly<Record<string, { readonly is?: string; readonly modes?: Readonly<Record<string, string>> }>>
-  readonly wears?: readonly string[]
-  readonly selector?: string
-  readonly arranges?: boolean
-  readonly tag?: string | Readonly<Record<string, string>>
-  readonly raises?: readonly string[]
-  readonly carries?: Readonly<Record<string, string>>
-  readonly always?: readonly string[]
-  readonly works?: string
-  readonly measures?: readonly string[]
-  readonly reads?: string
-  readonly gives?: readonly string[]
-  readonly keeps?: boolean
-  readonly animates?: boolean
-  readonly shows?: string
-  readonly called?: string
-  readonly wires?: string
-  readonly dresses?: string
-  readonly plays?: Readonly<Record<string, string>>
-  readonly by?: string
-  readonly runs?: string
-  readonly derives?: readonly Threaded[]
-}
-
-const SAID = {
-  on: '2026-09-09',
-  said: 'No reason at all for 15....elements are all ONE THING, screens ONE THING, ompositions ONE THING, tokens ONE THING....and so on.',
-}
-
-const FIELDS: Readonly<Record<string, { readonly is: string; readonly means?: string }>> = {
-  section: { is: 'string', means: 'The heading a row sits under in its sheet, so rows that belong together are read together.' },
-  token: { is: 'string' },
-  is: {
-    is: 'string',
-    means: 'What a row is, written out as its value: a colour, a media query, the name of a language, the library every icon is drawn from.',
-  },
-  asks: {
-    is: 'Readonly<Record<string, string | number>>',
-    means: 'What a token\'s rule is handed instead of a value, written name=value and separated by commas: offset=2, blur=4.',
-  },
-  sets: {
-    is: 'Readonly<Record<string, string>>',
-    means:
-      'What a row sets, written name=value and separated by commas. For a font role, a composition or an element it is a property and the style guide row it takes, gap=space-3; for an icon it is a library and what this meaning is called there.',
-  },
-  modes: {
-    is: 'Readonly<Record<string, string | Readonly<Record<string, string>>>>',
-    means:
-      'How what a row sets changes under a mode, written mode.property=row and separated by commas, dark.background=colour-surface, or mode=row where the row itself is the value.',
-  },
-  places: {
-    is: 'Readonly<Record<string, Readonly<Record<string, string>>>>',
-    means: 'The named places inside a thing and what each one sets, written place.property=row and separated by commas: hero.display=layout-flex.',
-  },
-  works: {
-    is: 'string',
-    means: 'The file beside an element that holds the code it runs, as a path from the element\'s own file: ./price-tag.works.tsx.',
-  },
-  measures: {
-    is: 'readonly string[]',
-    means: 'The values an element works out while it runs and hands to the stylesheet by name, separated by commas.',
-  },
-  reads: { is: 'string', means: 'What an element reads as to assistive technology: picture, progress, divider, grouping.' },
-  gives: { is: 'readonly string[]', means: 'The attributes an element hands its tag from what it carries, separated by commas.' },
-  keeps: { is: 'boolean', means: 'Whether an element keeps state of its own between renders.' },
-  animates: { is: 'boolean', means: 'Whether an element plays the animation the variant it wears names.' },
-  shows: { is: 'string', means: 'Which of the things an element carries is shown as its wording.' },
-  called: { is: 'string', means: 'The landmark an element is announced as: nav.breadcrumb.' },
-  wires: { is: 'string', means: 'The function in an element\'s works file that wires its events.' },
-  dresses: {
-    is: 'string',
-    means: 'The named place inside an element that wears the variant, when the variant is not worn by the element itself.',
-  },
-  themes: {
-    is: 'Readonly<Record<string, { readonly is?: string; readonly modes?: Readonly<Record<string, string>> }>>',
-    means:
-      'How a value changes under a theme, written theme.is=value, or theme.modes.mode=value where the theme has a dark and a light of its own, separated by commas.',
-  },
-  wears: { is: 'readonly string[]', means: 'The elements that accept a variant, by their names and separated by commas: Button, Link.' },
-  selector: {
-    is: 'string',
-    means:
-      'The CSS selector that is true while a signal holds. One the browser sets has its own, :hover; one an element raises is a data attribute named after the signal, and that is what is used when this is left blank.',
-  },
-  arranges: { is: 'boolean', means: 'Whether a thing arranges other things inside it, which is what lets it take children.' },
-  tag: {
-    is: 'string | Readonly<Record<string, string>>',
-    means:
-      'The HTML tag an element is written as: button, div, svg. When the tag depends on what the element carries, name that prop as by and give one entry per value, separated by commas: by=as, image=img, video=video.',
-  },
-  raises: { is: 'readonly string[]', means: 'The signals an element raises, separated by commas, each one a row in the signals sheet.' },
-  carries: {
-    is: 'Readonly<Record<string, string>>',
-    means: 'What an element takes as props, written name=kind and separated by commas: label=wording, disabled=flag.',
-  },
-  always: { is: 'readonly string[]', means: 'The signals that hold for as long as an element is on screen, separated by commas.' },
-
-  plays: {
-    is: 'Readonly<Record<string, string>>',
-    means: 'What a screen or a composition plays arriving and leaving, each naming an animation: in=rise, out=fall.',
-  },
-
-  derives: { is: 'readonly Threaded[]' },
-}
-
-const SHAPES: Readonly<Record<string, string>> = Object.fromEntries(
-  Object.entries(FIELDS).map(([key, one]) => [key, `    readonly ${key}?: ${one.is}`]),
-)
-
-const CONCEPTS: readonly { readonly id: string; readonly means: string }[] = Object.entries(FIELDS).flatMap(([id, one]) =>
-  one.means === undefined ? [] : [{ id, means: one.means }],
-)
-
-function concept(one: { readonly id: string; readonly means: string }): string {
-  return [
-    '  {',
-    `    id: ${quoted(one.id)},`,
-    "    at: '_threads/concepts.ts',",
-    `    describes: ${quoted(one.means)},`,
-    '    version: 1,',
-    '    cites: [',
-    `      { on: ${quoted(SAID.on)}, said: ${quoted(SAID.said)} },`,
-    '    ],',
-    '  },',
-  ].join('\n')
-}
-
-function stated(rows: readonly Row[], always: readonly string[] = []): readonly string[] {
-  const held = new Set<string>(always)
-  for (const one of rows) {
-    for (const key of Object.keys(SHAPES)) {
-      if (one[key as keyof Row] !== undefined) held.add(key)
-    }
-  }
-  return Object.keys(SHAPES).filter((key) => held.has(key))
-}
-
-interface Node {
-  readonly id: string
-  readonly at: string
-  readonly describes: string
-  readonly files?: string
-  readonly declares?: readonly Row[]
-  readonly derives?: readonly Row[]
-  readonly holds?: readonly Row[]
-}
-
-function inside(node: Node): readonly Row[] {
-  return [...(node.holds ?? []), ...(node.declares ?? []), ...(node.derives ?? [])]
-}
-
-function quoted(value: string): string {
-  return `'${value.replace(/\\/g, '\\\\').replace(/'/g, "\\'")}'`
-}
-
-function installed(at: string): string {
-  return at.replace(/^thread\/(.*)\.tsx?$/, `${ATTACH_HOME}/$1.js`)
-}
-
-function literal(value: string | number): string {
-  return typeof value === 'number' ? String(value) : quoted(value)
-}
-
-type Pair = string | number | Readonly<Record<string, string | number>>
-
-const BARE = /^[A-Za-z_$][A-Za-z0-9_$]*$/
-
-function pairs(held: Readonly<Record<string, Pair>>): string {
-  const each = Object.entries(held).map(
-    ([key, value]) =>
-      `${BARE.test(key) ? key : quoted(key)}: ${typeof value === 'object' ? pairs(value) : literal(value)}`,
-  )
-  return `{ ${each.join(', ')} }`
-}
-
-function listed(held: readonly string[]): string {
-  return `[${held.map(quoted).join(', ')}]`
-}
-
-function themed(
-  held: Readonly<Record<string, { readonly is?: string; readonly modes?: Readonly<Record<string, string>> }>>,
-): string {
-  const each = Object.entries(held).map(([key, one]) => {
-    const parts = [
-      ...(one.is === undefined ? [] : [`is: ${quoted(one.is)}`]),
-      ...(one.modes === undefined ? [] : [`modes: ${pairs(one.modes)}`]),
-    ]
-    return `${key}: { ${parts.join(', ')} }`
-  })
-  return `{ ${each.join(', ')} }`
-}
-
-const WRITTEN = new Set([
-  'id', 'at', 'describes', 'version', 'derives', 'holds', 'runs',
-  'section', 'token', 'is', 'asks', 'sets', 'modes', 'places', 'themes', 'wears', 'selector',
-  'arranges', 'plays',
-])
-
-function valued(held: unknown): string | undefined {
-  if (typeof held === 'string') return quoted(held)
-  if (typeof held === 'boolean' || typeof held === 'number') return String(held)
-  if (Array.isArray(held)) return held.every((one) => typeof one === 'string') ? listed(held as string[]) : undefined
-  if (held !== null && typeof held === 'object') {
-    return pairs(held as Readonly<Record<string, string | number>>)
-  }
-  return undefined
-}
-
-function rest(one: Row): readonly string[] {
-  const out: string[] = []
-  for (const [key, held] of Object.entries(one)) {
-    if (WRITTEN.has(key) || held === undefined) continue
-    const said = valued(held)
-    if (said !== undefined) out.push(`      ${key}: ${said},`)
-  }
-  return out
-}
-
-function row(one: Row, file: string, sheet: string): string {
-  const held = one.at === undefined || one.at === sheet
-  const derives = (one.derives ?? []).filter((each) => installed(each.at) === each.at)
-  return [
-    '    {',
-    `      id: ${quoted(one.id)},`,
-    ...(one.section === undefined ? [] : [`      section: ${quoted(one.section)},`]),
-    ...(one.token === undefined ? [] : [`      token: ${quoted(one.token)},`]),
-    ...(one.is === undefined ? [] : [`      is: ${quoted(one.is)},`]),
-    ...(one.asks === undefined ? [] : [`      asks: ${pairs(one.asks)},`]),
-    ...(one.sets === undefined ? [] : [`      sets: ${pairs(one.sets)},`]),
-    ...(one.modes === undefined ? [] : [`      modes: ${pairs(one.modes)},`]),
-    ...(one.places === undefined ? [] : [`      places: ${pairs(one.places)},`]),
-    ...(one.themes === undefined ? [] : [`      themes: ${themed(one.themes)},`]),
-    ...(one.wears === undefined ? [] : [`      wears: ${listed(one.wears)},`]),
-    ...(one.selector === undefined ? [] : [`      selector: ${quoted(one.selector)},`]),
-    ...(one.arranges === undefined ? [] : [`      arranges: ${String(one.arranges)},`]),
-    ...(one.plays === undefined ? [] : [`      plays: ${pairs(one.plays)},`]),
-    ...rest(one),
-    ...(derives.length === 0
-      ? []
-      : [
-          '      derives: [',
-          ...derives.flatMap((each) => [
-            '        {',
-            `          id: ${quoted(each.id)},`,
-            `          at: ${quoted(each.at)},`,
-            ...(each.by === undefined ? [] : [`          by: ${quoted(each.by)},`]),
-            ...(each.runs === undefined ? [] : [`          runs: ${quoted(each.runs)},`]),
-            `          describes: ${quoted(each.describes)},`,
-            '          version: 1,',
-            '        },',
-          ]),
-          '      ],',
-        ]),
-    ...(held ? [] : [`      at: ${quoted(installed(one.at ?? ''))},`]),
-    ...(one.runs === undefined ? [] : [`      runs: ${quoted(one.runs.split(' --own').join(''))},`]),
-    `      describes: ${quoted(one.describes)},`,
-    '      version: 1,',
-    '    },',
-  ].join('\n')
-}
-
-const ARRANGES: Readonly<Record<string, readonly string[]>> = {
-  composition: ['sets', 'modes', 'places', 'plays'],
-  screen: ['sets', 'modes', 'places', 'plays'],
-  styleguide: ['themes'],
-
-  element: ['tag', 'raises', 'carries', 'always', 'places', 'works', 'measures', 'reads', 'gives', 'keeps', 'animates', 'shows', 'called', 'wires', 'dresses'],
-}
-
-function source(node: Node, file: string, rows: readonly Row[]): string {
-  const extra = stated(rows, ARRANGES[node.id] ?? []).map((key) => SHAPES[key] ?? '')
-
-  const authors = node.declares !== undefined || node.derives !== undefined || rows.some((one) => one.at !== undefined && one.at !== node.at)
-  const values = node.holds !== undefined || rows.some((one) => one.at === undefined || one.at === node.at)
-
-  const own = node.id
-    .split('-')
-    .map((part) => `${part.charAt(0).toUpperCase()}${part.slice(1)}`)
-    .join('')
-
-  const widened = (base: string): string =>
-    extra.length === 0 ? base : `(${base} & {\n${extra.join('\n')}\n  })`
-
-  const lists = [
-    ...(authors || !values ? [`  readonly declares?: readonly ${widened('Threaded')}[]`] : []),
-    ...(values ? [`  readonly holds?: readonly ${widened("Omit<Threaded, 'at'>")}[]`] : []),
-  ]
-
-  const bespoke = extra.length > 0 || values || node.files !== undefined
-
-  const shape = bespoke
-    ? `
-export interface ${own} extends Threaded {
-${[...(node.files === undefined ? [] : ['  readonly files?: string']), ...lists].join('\n')}
-}
-`
-    : ''
-
-  const held = [
-    ...(node.files === undefined ? [] : [`  files: ${quoted(node.files)},`]),
-    ...(authors || !values ? ['  declares: [],'] : []),
-    ...(values ? ['  holds: [],'] : []),
-  ]
-
-  const wants = shape.includes('Condition')
-
-  return `import type { Threaded } from '${SHAPED}'${wants ? `\nimport type { Condition } from '${NAMED}/core/condition'` : ''}
-${shape}
-export const ${node.id.toUpperCase()}: ${bespoke ? own : 'Threaded'} = {
-  id: ${quoted(node.id)},
-  at: ${quoted(`_threads/${file}`)},
-  describes: ${quoted(node.describes)},
-  version: 1,
-${held.join('\n')}
-}
-`
-}
-
-const LISTS: readonly { readonly node: Node; readonly file: string; readonly rows?: readonly Row[] }[] = [
-  { node: TOKENS, file: 'tokens.ts' },
-  { node: FONTS, file: 'fonts.ts' },
-  { node: ICONS, file: 'icons.ts' },
-  { node: ANIMATIONS, file: 'animations.ts' },
-  { node: SIGNALS, file: 'signals.ts' },
-  { node: MATERIALS, file: 'materials.ts' },
-  { node: VARIANTS, file: 'variants.ts' },
-  { node: STYLEGUIDES, file: 'styleguides.ts' },
-  { node: LOCALIZATIONS, file: 'localizations.ts' },
-  { node: MODES, file: 'modes.ts' },
-  { node: THEMES, file: 'themes.ts' },
-  { node: ELEMENTS, file: 'elements.ts' },
-  { node: COMPOSITIONS, file: 'compositions.ts' },
-  { node: SCREENS, file: 'screens.ts' },
-]
-
-function child(one: { readonly node: Node; readonly file: string }): string {
-  return [
-    '    {',
-    `      id: ${quoted(one.node.id)},`,
-    `      at: ${quoted(`_threads/${one.file}`)},`,
-    `      describes: ${quoted(one.node.describes)},`,
-    '      version: 1,',
-    '    },',
-  ].join('\n')
-}
-
-function sectioned(one: { readonly node: Node; readonly file: string; readonly rows?: readonly Row[] }): readonly {
-  readonly into: string
-  readonly list: string
-  readonly id: string
-  readonly source: string
-}[] {
-  const last = new Map<string, string>()
-
-  return (one.rows ?? inside(one.node)).map((held) => {
-    const list = held.at === undefined || held.at === one.node.at ? 'holds' : 'declares'
-    const before = last.get(list)
-    const section = held.section ?? ''
-    last.set(list, section)
-    const turned = before !== undefined && before !== section
-    return {
-      into: one.file,
-      list,
-      id: held.id,
-      source: `${turned ? '\n' : ''}${row(held, one.file, one.node.at)}`,
-    }
-  })
-}
-
-const UI_SOURCE = `import type { Threaded } from '${SHAPED}'
-
-export const UI: Threaded = {
-${SEEDED.declares.split('\n').slice(1, -1).map((line) => line.slice(4)).join('\n')}
-  declares: [],
-}
-
-export const GENERATORS: readonly Threaded[] = []
-`
-
-const LIBRARY = setNamed(ICONS.holds.find((one) => one.id === SET_ROW)?.is ?? '').module
-
-export const ATTACH: Attaching = {
-  attaches: SEEDED.attaches,
-  id: SEEDED.id,
-
-  needs: {
-    '@floating-ui/dom': '^1.7.0',
-    '@floating-ui/react-dom': '^2.1.0',
-    '@types/react': '^19.0.0',
-    '@types/react-dom': '^19.0.0',
-    next: '^16.0.0',
-    react: '^19.0.0',
-    'react-dom': '^19.0.0',
-    zod: '^4.5.4',
-    [LIBRARY]: 'latest',
-  },
-  rows: [
-    ...CONCEPTS.map((one) => ({
-      into: 'concepts.ts',
-      list: 'CONCEPTS',
-      id: one.id,
-      source: concept(one),
-    })),
-    ...LISTS.map((one) => ({
-      into: 'ui.ts',
-      list: 'declares',
-      id: one.node.id,
-      source: child(one),
-    })),
-    ...LISTS.flatMap((one) => sectioned(one)),
-    ...SHIPPED,
-  ],
-  declares: SEEDED.declares,
-  writes: [
-    { file: 'ui.ts', source: UI_SOURCE },
-    ...LISTS.map((one) => ({
-      file: one.file,
-      source: source(one.node, one.file, one.rows ?? inside(one.node)),
-    })),
-  ],
-}

package/dist/ui/charts.tsx

@@ -1,69 +0,0 @@
-'use client'
-
-import { seriesRamp } from './series.ts'
-import { classOfElement } from './variant.ts'
-
-import { useUi } from './wrappers.tsx'
-import type { MessageKey } from './content.tsx'
-
-export type Row = Readonly<Record<string, unknown>>
-
-export type WhenTight = 'scroll' | 'bucket' | 'wrap' | 'shrink'
-
-export interface ChartBase {
-  readonly rows: readonly Row[]
-  readonly titleKey?: MessageKey
-
-  readonly whenTight?: WhenTight
-
-  readonly format?: string
-}
-
-export const num = (row: Row, key: string): number => {
-  const v = row[key]
-  return typeof v === 'number' ? v : Number(v ?? 0)
-}
-export const str = (row: Row, key: string): string => String(row[key] ?? '')
-
-export function useRamp(count: number): readonly string[] {
-  const { palette } = useUi()
-  return seriesRamp(palette.accent, palette.surface, Math.max(1, count))
-}
-
-export function placed(element: string, place: string): string {
-  return `${classOfElement(element)}-${place}`
-}
-
-export function measured(held: Readonly<Record<string, string | number>>): Record<string, string | number> {
-  const out: Record<string, string | number> = {}
-  for (const [name, value] of Object.entries(held)) out[`--${name}`] = value
-  return out
-}
-
-export interface SeriesProps extends ChartBase {
-  readonly value: string
-  readonly at: string
-
-  readonly by?: string
-}
-
-export function polyline(values: readonly number[], width: number, height: number): string {
-  if (values.length === 0) return ''
-  const max = Math.max(...values)
-  const min = Math.min(...values, 0)
-  const span = max - min || 1
-  const step = values.length === 1 ? 0 : width / (values.length - 1)
-  return values.map((v, i) => `${(i * step).toFixed(2)},${(height - ((v - min) / span) * height).toFixed(2)}`).join(' ')
-}
-
-export interface CategoryProps extends ChartBase {
-  readonly value: string
-  readonly by: string
-}
-
-export interface TwoAxisProps extends ChartBase {
-  readonly x: string
-  readonly y: string
-  readonly value?: string
-}
-