/**
 * The rules about this package's source — and about the shape of the
 * workspace around it — that no compiler and no axe run can see.
 *
 * They come straight from the plan's verification list, and each one
 * is a thing the fleet does today that the library exists to stop.
 *
 * The last two reach past `@charcuterie/ui` into its siblings on
 * purpose. `ui` sits at the top of the dependency graph, so it is the
 * one package whose tests can see all three at once — which is why
 * the plan's cross-package assertions live here rather than in a
 * `packages/conformance` of their own
 * ([decision](../../../docs/decisions/2026-07-31-conformance-is-not-a-package.md)).
 */

import { readdir, readFile } from "node:fs/promises"
import { dirname, join, relative, resolve } from "node:path"

import { expect, test } from "vitest"

const sourceDirectory = resolve(import.meta.dirname)

const packageDirectory = resolve(sourceDirectory, "..")

const packagesDirectory = resolve(packageDirectory, "..")

type PackageManifest = {
  dependencies?: Record<string, string>
  exports?: Record<string, string | { source?: string }>
  peerDependencies?: Record<string, string>
}

const readManifest = async (
  name: string,
): Promise<PackageManifest> =>
  JSON.parse(
    await readFile(
      join(packagesDirectory, name, "package.json"),
      "utf8",
    ),
  ) as PackageManifest

const getSourceFiles = async (
  directory: string,
): Promise<{ contents: string; file: string }[]> => {
  const entries = await readdir(directory, {
    withFileTypes: true,
  })

  const files = await Promise.all(
    entries.map(async (entry) => {
      const path = join(directory, entry.name)

      if (entry.isDirectory()) {
        return getSourceFiles(path)
      }

      if (!/\.(css|tsx?)$/.test(entry.name)) {
        return []
      }

      return [
        {
          contents: await readFile(path, "utf8"),
          file: relative(sourceDirectory, path),
        },
      ]
    }),
  )

  return files.flat()
}

const sourceFiles = await getSourceFiles(sourceDirectory)

const componentFiles = sourceFiles.filter(
  (one) =>
    !one.file.endsWith(".test.ts") &&
    !one.file.endsWith(".test.tsx"),
)

/**
 * Comments are prose about the fleet, not code. `intentStyles.ts`
 * quotes mux-magic's `bg-blue-950 text-blue-300` as the evidence for
 * the intent scale existing at all, and a rule that cannot tell a
 * citation from a usage is a rule that gets switched off.
 */
const stripComments = (contents: string) =>
  contents
    .replace(/\/\*[\s\S]*?\*\//g, "")
    .replace(/^\s*\/\/.*$/gm, "")

test("`data-testid` appears nowhere in @charcuterie/ui", () => {
  // A rule, not a preference. A testid is a name only the test suite
  // can see, so reaching for one is how a component ends up
  // unnameable by a screen reader *and* undrivable by an agent — the
  // exact gap that makes the fleet's current UIs unautomatable. If a
  // control is hard to query, the fix is an accessible name.
  // `data-testid=` — the attribute in *use*. `testing/` mentions the
  // name in a selector and an error message, which is the opposite
  // of the offence; and this file has to spell it to search for it,
  // which is why the scan is over shipped source and stories rather
  // than over the tests.
  const offenders = componentFiles
    .filter((one) => /data-testid=/.test(one.contents))
    .map((one) => one.file)

  expect(offenders).toEqual([])
})

test("no component reaches past tier 2 for a colour", () => {
  // The M6 problem, prevented here rather than repeated: mux-magic
  // has **993 hardcoded `*-slate-*` utilities across 134 files**, and
  // every one of them is why that app cannot have a light mode. A
  // component may name a semantic role — `bg-surface-raised`,
  // `text-intent-danger-content` — and nothing else.
  //
  // Tier 1 ramps (`colour.slate.500`) exist so a *variant author*
  // has something to build tier 2 out of. A component naming one
  // pins itself to a palette.
  const palettePattern =
    /\b(?:bg|text|border|from|to|via|outline|ring|fill|stroke|shadow|decoration|accent|caret|divide)-(?:slate|gray|zinc|neutral|stone|red|orange|amber|yellow|lime|green|emerald|teal|cyan|sky|blue|indigo|violet|purple|fuchsia|pink|rose)-\d{2,3}\b/

  const hexPattern = /#[0-9a-fA-F]{3,8}\b/

  const offenders = componentFiles
    .filter(
      (one) =>
        // The story fixtures are allowed literal hexes: the SVG
        // poster data-URI in `MediaTile.stories.tsx` is a stand-in
        // for an app's own image, not component styling.
        !one.file.endsWith(".stories.tsx"),
    )
    .filter((one) => {
      const code = stripComments(one.contents)

      return (
        palettePattern.test(code) || hexPattern.test(code)
      )
    })
    .map((one) => one.file)

  expect(offenders).toEqual([])
})

test("nothing queries a container it declares itself", () => {
  // A container query matches **descendants of the container**, never
  // the container element. So `className="@container cq-md:px-8"`
  // compiles, generates real CSS, passes `tailwindCandidates.test.ts`
  // — and never fires. Nothing errors; the padding is simply always
  // the small one, forever.
  //
  // Caught here because it is invisible everywhere else: axe does not
  // care, the class exists, and a reviewer sees a plausible-looking
  // className. It cost this milestone one round of screenshots.
  const offenders = componentFiles
    .filter((one) => /\.tsx$/.test(one.file))
    .flatMap((one) => {
      const classStrings =
        stripComments(one.contents).match(/"[^"\n]*"/g) ??
        []

      return classStrings
        .filter(
          (candidate) =>
            candidate.includes("@container") &&
            /\bcq-(?:xs|sm|md|lg|xl):/.test(candidate),
        )
        .map((candidate) => `${one.file}: ${candidate}`)
    })

  expect(offenders).toEqual([])
})

test("a container-query component is never storied in a shrink-to-fit cell", () => {
  // The twin of the rule above, and the one the M3 screenshots
  // actually caught: the component is right, the *story* is wrong.
  //
  // `container-type: inline-size` implies `contain: inline-size`,
  // which forbids the element from being sized by its own contents.
  // In a default `StoryCell` — `items-start`, so shrink-to-fit — the
  // card has no width to shrink *to*, collapses to min-content, and
  // every line of text wraps after one word. Valid CSS, no error, no
  // axe violation, and it only shows up if somebody looks at a
  // screenshot. `align="stretch"` hands it a definite inline size
  // from the grid track.
  //
  // The container list is derived rather than hardcoded, so the
  // component M4 adds with an `@container` on it joins this rule the
  // moment it lands.
  const containerComponents = componentFiles
    .flatMap((one) => {
      const match = /^([A-Z]\w+)\/\1\.tsx$/.exec(one.file)

      return match?.[1] &&
        stripComments(one.contents).includes("@container")
        ? [match[1]]
        : []
    })
    .sort()

  // A canary on the derivation itself: if this ever comes back
  // empty the rule silently passes forever.
  // `Main` joins them with the app shell. It is the one whose
  // `contain: inline-size` is *wanted* rather than tolerated —
  // content may no longer widen the content column, which is half
  // of why the shell does not scroll sideways at 390px — and the
  // `contain: layout` that rides along with it is documented in
  // `Main.tsx` and `Main.mdx`, because it makes `<main>` the
  // containing block for any `position: fixed` an app renders
  // inside it.
  expect(containerComponents).toEqual([
    "Alert",
    // `Board` declares **two** containers and neither is the element
    // that queries it: the board's own box decides how many lanes are
    // on screen, and each lane's list — in `BoardLaneList.tsx`, which
    // is a member rather than a component by the `<Name>/<Name>.tsx`
    // rule — decides what shape a card is. Only the first of those is
    // in this list, and that is enough: it is `<Board` a story renders,
    // so `<Board` is what a shrink-to-fit `StoryCell` would collapse.
    "Board",
    "Card",
    // `DataTable` joins them as the first component whose *layout*
    // is the container query rather than its padding: below `--cq-md`
    // a row stops being a row and becomes a labelled block, so the
    // whole point of the component is a query it declares itself.
    "DataTable",
    // `DatePicker`'s panel is the container, and it is the first one
    // here whose container is *not* the element a caller sized. A
    // portalled panel is clamped to the space floating-ui found for
    // it, so the calendar reads that and not the window — which is
    // the case a media query cannot express at all, and the case the
    // owner is in whenever he browses zoomed in.
    "DatePicker",
    "EmptyState",
    // `LaneTimeline` declares one and **never queries it**, which is
    // the `Main` case rather than a mistake: it wants the
    // `contain: inline-size` that rides along, because the component
    // measures its own box to decide whether to draw a date axis at
    // all. Without the containment a shrink-wrapping parent makes
    // that answer its own input.
    "LaneTimeline",
    "Main",
    "MarkdownEditor",
    "MediaTile",
    // `PortraitTiles` declares its container on the SET rather than
    // on a tile, and that is the whole design: the question is not
    // "how wide is this one face" but "does this picker have room to
    // stack". A phone shows one full-width column of rows; a wall
    // display shows a row of tall columns. Querying a tile would
    // answer neither, because a track is about the same width in
    // both.
    "PortraitTiles",
    // Metrics query the space remaining beside the media, not the entire card.
    "ProgressCard",
    "ScheduleBoard",
    // `Stepper`'s container is the one that decides whether a
    // `horizontal` sequence is actually horizontal. Below `--cq-md`
    // it falls back to the vertical column, because four steps side
    // by side in a narrow container squash into `2. / De- / dupe` —
    // measured in Docket, before any of the steps contained
    // anything.
    "Stepper",
    // `TimecodeInput` queries its own box to decide whether a section
    // is `[start] to [end]` in a row or two captioned fields stacked.
    // The width that decides it is a modal's, not a window's: the
    // report came from a 390px dialog, and the same dialog on a
    // 2560px monitor is the Wide View by every media query and the
    // Narrow View by the only measurement that matters.
    "TimecodeInput",
  ])

  // `StoryCell`s are never nested, so the lazy match really does
  // pair each opening tag with its own closing one.
  const cellPattern =
    /<StoryCell\b([^>]*)>([\s\S]*?)<\/StoryCell>/g

  const offenders = componentFiles
    .filter((one) => one.file.endsWith(".stories.tsx"))
    .flatMap((one) =>
      Array.from(
        stripComments(one.contents).matchAll(cellPattern),
      )
        .filter(
          ([, attributes, body]) =>
            !attributes.includes('align="stretch"') &&
            containerComponents.some((name) =>
              body.includes(`<${name}`),
            ),
        )
        .map(
          ([, attributes]) =>
            `${one.file}: <StoryCell${attributes}>`,
        ),
    )

  expect(offenders).toEqual([])
})

test("the barrel is the only place components are re-exported", async () => {
  // One sanctioned barrel per package. A component importing a
  // sibling *through* `index.ts` turns every component into a
  // dependency of every other one, which is how a 3 KB `Spinner`
  // starts pulling in `MediaTile`.
  //
  // Comments are stripped first, for the same reason the colour rule
  // strips them: a docstring showing a *consumer* how to wire
  // `RouterLinkProvider` has to spell `from "@charcuterie/ui"`, and a
  // rule that cannot tell a citation from an import is a rule that
  // gets switched off. An actual import is never inside a comment.
  const offenders = componentFiles
    .filter((one) => one.file !== "index.ts")
    .filter((one) => {
      const code = stripComments(one.contents)

      return (
        /from "\.\.?\/index\.ts"/.test(code) ||
        /from "@charcuterie\/ui"/.test(code)
      )
    })
    .map((one) => one.file)

  expect(offenders).toEqual([])

  // And the barrel really does export every component, so a new one
  // cannot land unexported — which would make it invisible to every
  // consumer while all its own tests pass.
  const barrel = await readFile(
    join(sourceDirectory, "index.ts"),
    "utf8",
  )

  // `Button/Button.tsx` — the component files, as distinct from
  // their stories and helpers.
  const componentNames = componentFiles
    .map((one) => /^([A-Z]\w+)\/\1\.tsx$/.exec(one.file))
    .flatMap((match) => (match?.[1] ? [match[1]] : []))

  // M3's ten P0 components, plus `VisuallyHidden` — a Layer-0
  // primitive `Spinner`, `ProgressBar`, and `LiveStatusIndicator` all
  // need, so it shipped here rather than being stubbed three times.
  // M4 adds the three overlays: `Modal`, `Popover`, `Tabs`.
  //
  // M5 adds the two the first consumer proved were shared rather
  // than app-specific: `Alert` (rip-deck spells it four times, twice
  // with a byte-identical `TONE_CLASS`) and `SegmentedControl`.
  //
  // M6 adds the nine P1 components: `Accordion`, `Field`,
  // `FileDropZone`, `LogViewer`, `Menu`, `Select`,
  // `SortableTableHeader`, `Toast`, and `Tooltip`.
  //
  // `TabTrigger`, `SegmentedOption`, `AccordionSection`, and
  // `MenuAction` are deliberately not in this count and not
  // exported. Each is its own component's member — its own file only
  // because both registrations are effects and an effect cannot run
  // in a loop — and the `<Name>/<Name>.tsx` pattern this regex
  // matches is what keeps them out.
  //
  // `ToastRegion` is the one exception worth naming: it *is*
  // exported, and it lives in `Toast/` rather than owning a
  // directory because a region with no toasts in it is not a thing
  // anybody renders. It is therefore outside this count by the same
  // rule, and the barrel assertion below does not reach it.
  //
  // 2026-08-03 adds the two colour-scheme controls — `ColorSchemeToggle`
  // (Layer 2, presentational) and `ColorSchemeSwitcher` (Layer 3,
  // connected) — and `Lightbox`, the thumbnail-over-`Dialog` viewer —
  // taking the count to 28.
  //
  // The M8 overlay rebuild renames the old chrome-bearing `Modal` to
  // `Dialog` and reintroduces `Modal` as the base layer, so both are
  // components: +1 → 29. The picker family adds `Listbox` (single-select)
  // and `Combobox` (searchable/virtualized): +2 → 31.
  // `Swatch` — a colour as content with a required name, the one
  // colour the system does not own — comes out of `portly-controllers`,
  // the fleet's newest consumer: +1 -> 32.
  //
  // The boolean-input family fills the gap `mux-magic`'s `BooleanField`
  // hand-rolled around: `Checkbox` and `Switch` (the same state kind,
  // a submitted value versus a setting that takes effect on flip) and
  // `RadioGroup` (the stacked sibling of `SegmentedControl`, same
  // `SinglePicker` + `RovingFocus` composition): +3 -> 35.
  // `RadioGroupOption` is `RadioGroup`'s member — its own file only
  // because both registrations are effects — and stays out of this
  // count and the barrel by the `<Name>/<Name>.tsx` rule, exactly as
  // `SegmentedOption` does.
  //
  // `AdaptiveGrid` is the library's first *layout* component, and the
  // first one whose reason to exist is a rule rather than a widget:
  // the wrapping grids in this fleet are `auto-fill, minmax()`, which
  // takes every column the window allows and lands on seven items
  // strung across an ultrawide. It spends height first instead, and
  // it is a component rather than only a hook because three things
  // about the markup are silent when they are wrong — the
  // measured box must not be the capped box, `min-w-0` has to reach
  // children the caller owns, and the track list must be an inline
  // style because Tailwind cannot scan an interpolated class: +1 -> 36.
  // The link family closes the gap that made seven repos hand-roll a
  // back-link and made `Button` get used for navigation: `TextLink`
  // and `ButtonLink`, both a real `<a href>`, differing in paint
  // rather than semantics: +2 -> 38, on top of `AdaptiveGrid`'s 36.
  // `AnchorLink`, `UnstyledLink`,
  // `RouterLinkProvider`, `ReactRouterLink`, `ScrollMemoryProvider`
  // and `ReactRouterAdapter` are the router seam rather
  // than painted components, and live in `RouterLink/`, `Main/` and
  // `reactRouter/` — outside this count by the `<Name>/<Name>.tsx`
  // rule, exactly as `Overlay/`'s parts are.
  // The unified app shell adds four: `Shell`, `Header`, `Rail`,
  // `Main` — the fleet's largest single duplication, where ten of
  // twelve UI repos hand-roll the page chrome and three of them
  // have a file called `AppShell.tsx`: +4 -> 42, on top of the link family's 38. `contentWidth.ts`
  // and `shellContext.ts` are `Shell`'s members and stay out of
  // this count by the `<Name>/<Name>.tsx` rule, exactly as
  // `mediaStatus.ts` does.
  // `Toolbar` unifies the fourth-largest duplication — four repos
  // with a toolbar-and-overflow, three of them collapsing by
  // rendering every action twice: +1 -> 43. `ToolbarSlot.tsx`,
  // `useToolbarOverflow.ts` and `chooseVisibleCount.ts` are its
  // members and stay out of this count by the `<Name>/<Name>.tsx`
  // rule.
  //
  // `QueryBuilder` — the generic nestable AND/OR (any-combinator) group
  // editor Mail Sifter's nested rules and mux-magic's job DSL both need
  // — is the library's first recursive component and its first with a
  // fully opaque value *and* combinator: +1 -> 44. `QueryBuilderGroup`
  // and `QueryBuilderRow` are its members — a group renders groups, and
  // both are rendered inside a `.map` — and stay out of this count and
  // the barrel by the `<Name>/<Name>.tsx` rule, exactly as
  // `SegmentedOption` and `ListboxOption` do.
  //
  // `MarkdownEditor` — Docket's live hybrid editor, a real
  // `<textarea>` with a painted layer behind it — is +1 -> 46. Its
  // `markdownSpans.ts` and `markdownCommands.ts` are pure modules
  // rather than components and stay out of this count by the
  // `<Name>/<Name>.tsx` rule.
  //
  // `Picker` — a `Listbox` with its trigger already attached — is +1 ->
  // 45. It is a component rather than a recipe in the docs because the
  // fleet wrote it four separate times (plex-channels' `SelectListbox`,
  // board-games' `SelectMenu`, mux-magic's `ListboxPicker`, and twice
  // inside this package), each with its own hand-rolled chevron.
  // `DatePicker` — a typed date field with a calendar dialog — is +1
  // -> 47. `DateGrid.tsx`, `plainDate.ts` and `parseDateInput.ts` are
  // its members and stay out of this count by the `<Name>/<Name>.tsx`
  // rule, exactly as `SegmentedOption` and `ListboxOption` do. The
  // two `.ts` ones are still exported from the barrel: the calendar
  // arithmetic and the input grammar are the parts a consumer needs
  // *outside* the field (Docket counts staleness in days), and they
  // reach nothing but `Intl`.
  //
  // `DataTable` — the reflowing table Docket's task lists, backlog and
  // search results need — is +1 -> 48. It **composes**
  // `SortableTableHeader` rather than subsuming it: that component is
  // already in a published 1.0.0 with a consumer of its own, so
  // removing it would be a breaking change bought for nothing, and
  // both stay in this count.
  //
  // `Board` — lanes of cards, sized by their container and moved by
  // keyboard or by pointer — is +1 -> 49. It is the library's first
  // component whose own operation is a **write** rather than a
  // selection, and the first to declare two nested containers.
  // `BoardCard.tsx`, `BoardLaneList.tsx`, `boardMove.ts` and
  // `useBoardDrag.ts` are its members and stay out of this count and
  // the barrel by the `<Name>/<Name>.tsx` rule, exactly as
  // `ToolbarSlot` and `QueryBuilderRow` do.
  //
  // `VirtualizedGrid` — `AdaptiveGrid`'s layout with only the
  // visible rows mounted — is +1 -> 51. It **calls**
  // `useAdaptiveColumns` rather than forking it, so the two grids
  // cannot answer the column question differently; windowing is the
  // whole of the difference. `gridGap.ts` is its member and stays
  // out of this count by the `<Name>/<Name>.tsx` rule, while still
  // being exported from the barrel — a consumer measuring its own
  // `itemBlockSize` needs the number the rows are spaced by.
  //
  // `Slider` — the range control the fleet had no way to ask for — is
  // +1 -> 52. `sliderValue.ts` is its member and stays out of this
  // count by the `<Name>/<Name>.tsx` rule; it is not exported from the
  // barrel either, because a consumer sets `min`/`max`/`step` and never
  // does the arithmetic itself.
  //
  // `BadgeButton` — a `Badge` you can press — is +1 -> 53. It is to
  // `Badge` what `ButtonLink` is to `Button`: a sibling element
  // sharing one paint, here through `useBadgeShape`, which is a
  // member of `Badge/` and so stays out of this count and out of the
  // barrel as a component. Its PROPS type is exported, because a
  // consumer writing a wrapper needs to name the visual half.
  //
  // `CopyButton` — the clipboard write, with a failure state — is
  // +1 -> 54. `copyText.ts` is its member: it stays out of this
  // count by the `<Name>/<Name>.tsx` rule, and it IS exported from
  // the barrel as a function, because a host with its own clipboard
  // bridge needs the fallback chain without the button.
  //
  // `Avatar` — a person as a coloured chip, so a board stops
  // printing the same name on every card — is +1 -> 55. It has no
  // members: the initials derivation is a private function in
  // `Avatar.tsx`, and the colour it falls back to is
  // `getCategoricalIndex`, which already lives in
  // `@charcuterie/tokens` because a Node service and a Satori render
  // both need to answer the colour question with no React in scope.
  //
  // `MarkdownLine` — one line of markdown, drawn with its inline
  // marks and nothing else — is +1 -> 56. It is the second markdown
  // renderer in the package and the first outside the optional
  // CodeMirror entry point, which is the whole reason it exists: a
  // *name* cannot afford an editor state and a syntax tree per card,
  // and the main entry may not reach the CodeMirror stack at all.
  // `inlineMarkdown.ts` is its member and stays out of this count by
  // the `<Name>/<Name>.tsx` rule, while still being exported from the
  // barrel — `toPlainMarkdownText` is what every `aria-label` and
  // `title` attribute naming one of these lines has to call, and it
  // must be the same parse or the tooltip drifts from the card.
  //
  // It is also why `safeUrls.ts` moved up out of
  // `markdownEditorCodeMirror/`: two surfaces taking a URL out of a
  // document and putting it in an `href` is one allowlist, not two.
  //
  // `DropRail` — every move destination at once, as a listbox that a
  // pointer, a tap or the arrow keys all drive — is +1 -> 57. It has
  // no members, and it takes no drag-and-drop dependency: the
  // hit test is `elementFromPoint` over its own chips, which is the
  // only geometric question a rail has. `Board` keeps its `Menu`,
  // which is the right control at three lanes; this is the one for a
  // page with thirty-four groups on it.
  //
  // `NavBar` — the app's destinations as real links, folding whole
  // into one menu button when the row stops fitting — is +1 -> 58.
  // It **reuses** `Toolbar`'s `useToolbarOverflow` rather than
  // forking the measurement, and exists as its own component for one
  // reason the type system makes plain: a `ToolbarAction` is
  // `{ label, onSelect }` and a collapsed one becomes a `MenuItem`,
  // which is also `{ label, onSelect }` — so a nav folded into a
  // `Toolbar` is a row of `<button>`s, which is the fleet's most
  // common navigation defect and screenshots identically to the
  // correct thing. `NavBarLink.tsx` is its member and stays out of
  // this count by the `<Name>/<Name>.tsx` rule; `navBarCurrent.ts`
  // is too, while still being exported from the barrel — an app that
  // marks a destination current anywhere else must ask the same
  // question the same way.
  //
  // `ReorderList` — a vertical list put in a different order, by
  // two buttons or by dragging a handle — is +1 -> 59. It is the
  // clearest case yet for the fleet's build-it-here rule: Docket
  // had written the shape twice (a subtask checklist on HTML5
  // `draggable`, which does not fire on touch at all, and a phase
  // queue with the buttons and no drag), and `Board` had written
  // it a third time correctly. So this one does not fork the
  // geometry — it CALLS `useBoardDrag` with a single registered
  // lane and the item selector pointed at its own rows, the way
  // `VirtualizedGrid` calls `useAdaptiveColumns`. It renders no
  // row, no handle and no buttons; `renderItem` is what lets one
  // component serve three grids that have nothing in common.
  //
  // `Nav` — the destinations as a rail, a collapsed icon rail or a
  // bottom strip — is +1 -> 60. It is the other half of `NavBar`,
  // which folds a horizontal row and cannot become a vertical one:
  // no media query moves an element across `Shell`'s grid, so the
  // rail is a different corner of the page rather than a restyling
  // of the same one. Two members stay out of this count by the
  // `<Name>/<Name>.tsx` rule and are exported from the barrel
  // anyway — `navItems.ts`, because `resolveActiveKey` is the
  // active-path rule an app's tests want to assert directly, and
  // `useNavLayout.ts`, because the app has to read the width rule to
  // know which corner to render into.
  //
  // `ActionTiles` is +1 -> 62. It is `RadioGroup itemShape="tile"`
  // with the radio taken away: the box is shared through
  // `tileStyles.ts`, and nothing else is. The 2026-08-25 record that
  // made the choice tile a `RadioGroup` shape named this case under
  // what it deliberately does not cover — a tile that navigates is
  // not a radio, and giving one `aria-checked` would be worse than
  // the paint it replaced.
  //
  // `TimecodeInput` — a typed media position, with an `isRange` mode
  // for a section of a file — is +1 -> 63. `timecode.ts` is its
  // member and stays out of this count by the `<Name>/<Name>.tsx`
  // rule, while still being exported from the barrel: the fleet
  // spells the *printing* half five times over (queuepilot twice,
  // castkit, mux-magic twice) and a read-only surface needs the
  // formatter without the field.
  //
  // `RangeSlider` is +1 -> 64. `Slider`'s own record said a two-thumb
  // range is *"a different widget with its own focus model"*, and the
  // focus model is exactly what makes it a component rather than an
  // `isRange` mode: one `role="slider"` on the track becomes two of
  // them on the thumbs inside a `role="group"`, and one tab stop
  // becomes two. So this shares the ARITHMETIC (`sliderValue.ts`,
  // called rather than copied) and the BAR (`sliderStyles.ts`, the
  // same extraction `tileStyles.ts` is), and nothing else.
  // `rangeSliderValue.ts` is its member and stays out of this count
  // by the `<Name>/<Name>.tsx` rule. It lands beside `TimecodeInput`
  // rather than instead of it: the two halves of QueuePilot's clip
  // editor are a typed field and a dragged bar over one value, and
  // `isRange` is right there and wrong here for a reason that is
  // written down — a second text field is still a text field, while a
  // second thumb cannot share one `aria-valuenow`.
  //
  // `PortraitTiles` is +1 -> 65. It is the points-market kid picker:
  // a face, a name and one number, which is a different question
  // from `ActionTiles`' "what do you want to do" and would have
  // meant one component whose icon is sometimes a 20px glyph beside
  // a title and sometimes a 144px circle above it.
  //
  // `LaneTimeline` — one horizontal lane per group across a date
  // axis, with a multi-day thing drawn as a bar — is +1 -> 66. It is
  // the first component that folds on a **measurement of its own
  // box** rather than on a container query, and the reason is in the
  // arithmetic: the question is not how wide the box is but how wide
  // one day is, which is the width divided by a number that lives in
  // the data. `laneTimelineGeometry.ts`, `LaneTimelineBar.tsx`,
  // `LaneTimelineLane.tsx` and `useTrackMeasurements.ts` are its
  // members and stay out of this count by the `<Name>/<Name>.tsx`
  // rule. The geometry module is still exported from the barrel — a
  // consumer deciding whether an item is on screen must ask the
  // question the same way the bars are placed, or the two answers
  // drift by a day and nothing says so.
  // ProgressCard composes Card and ProgressBar for progress-first dashboards.
  // Breadcrumbs composes TextLink for the path back up a hierarchy.
  // ActionMenu composes IconButton and Menu for the overflow control.
  // ValuePairs owns compact label-over-value summaries.
  // Chart shares portable SVG geometry with Preact and image consumers.
  // TableViewport owns readable comparisons and full-window expansion.
  // MetricCard shares prominent values and category-coloured icons through Card.
  // ComparisonChart and TableColumns share compact comparisons and column controls.
  // GroupedList owns rows under group headings; castkit, tally-marks
  // and whereabouts each drew it by hand. `GroupedListRow.tsx` is its
  // member and stays out of this count by the `<Name>/<Name>.tsx` rule.
  // CommandPalette composes Modal and SearchInput into the launcher.
  // ColorPicker composes Combobox and Swatch with a custom-color panel;
  // `ColorPickerCustomPanel.tsx` is its member.
  expect(componentNames.length).toBe(80)

  for (const name of componentNames) {
    expect(barrel).toContain(`export { ${name} }`)
  }
})

test("dependency direction is tokens ← logic ← ui", async () => {
  // CI-enforced by the plan, and this is the enforcement. `ui` may
  // depend on both; `logic` may depend on `tokens`; `tokens` depends
  // on nothing, which is what lets `castkit/packages/views` read a
  // colour without a React tree.
  const getCharcuterieDependencies = (
    manifest: PackageManifest,
  ) =>
    Object.keys({
      ...manifest.dependencies,
      ...manifest.peerDependencies,
    }).filter((name) => name.startsWith("@charcuterie/"))

  expect(
    getCharcuterieDependencies(
      await readManifest("tokens"),
    ),
  ).toEqual([])

  expect(
    getCharcuterieDependencies(await readManifest("logic")),
  ).toEqual([])

  expect(
    getCharcuterieDependencies(
      await readManifest("ui"),
    ).sort(),
  ).toEqual(["@charcuterie/logic", "@charcuterie/tokens"])
})

/**
 * What every published entry point is allowed to reach at runtime.
 *
 * This is what survives of the plan's `@charcuterie/conformance`
 * package — "builds React19+TWv4 / Preact / Satori profiles" — once
 * the three profiles are checked against what the library actually
 * became. Two of them are already built and gated by name (`docs` is
 * the React 19 + Tailwind v4 build; `logic`'s five-adapter suite is
 * the Preact one), and the third has no components to render because
 * the ePaper-safe subset was never built. What no gate covered is the
 * claim each of those profiles actually rests on: **which runtime a
 * consumer is forced to install by importing a given entry point.**
 * That is the assertion below.
 *
 * Each of these numbers is load-bearing somewhere:
 *
 * - `tokens` reaches **nothing**. `castkit/packages/views` renders
 *   through Satori and must read a colour without a React tree.
 * - `logic/core` reaches **nothing**, and `logic/preact` never
 *   reaches `react` — `preact/compat` is most of `slatecast`'s 60 KB
 *   gz budget, and an accidental `react` import there is a bundle
 *   blow-up that typechecks.
 * - `ui/testing` reaches **nothing**, which is the promise
 *   `expectAgentDrivable.ts` makes in prose: it ships for consumers
 *   to hold *their* components to, and a published package must not
 *   drag a test framework into an app's dependency graph.
 *
 * A type-only import counts. It is erased from the bundle but not
 * from the `.d.ts`, so a consumer still needs the package installed
 * for their own typecheck to pass.
 */
const ENTRY_POINT_RUNTIMES: Record<
  string,
  Record<string, string[]>
> = {
  logic: {
    ".": ["react"],
    // The DOM defaults for `useColorScheme`. It reaches no bare
    // specifier at all: `matchMedia`/`localStorage`/`document` are
    // globals, not imports, and its only imports are type-only ones
    // into `core` — which is why `ColorSchemeApplier` lives in the
    // core rather than beside the hook, so this entry never pulls
    // `react`.
    "./charts": [
      "@tanstack/charts",
      "@tanstack/charts/scales/band",
      "@tanstack/charts/scales/linear",
      "@tanstack/charts/svg",
    ],
    "./charts/preact": [
      "@tanstack/charts",
      "@tanstack/charts/adapter/renderer",
      "@tanstack/charts/motion",
      "@tanstack/charts/scales/band",
      "@tanstack/charts/scales/linear",
      "@tanstack/charts/svg/renderer",
      "@tanstack/charts/tooltip",
      "preact",
      "preact/hooks",
    ],
    "./charts/react": [
      "@tanstack/charts",
      "@tanstack/charts/motion",
      "@tanstack/charts/react/core",
      "@tanstack/charts/scales/band",
      "@tanstack/charts/scales/linear",
      "@tanstack/charts/svg/renderer",
      "@tanstack/charts/tooltip",
      "react",
    ],
    "./browser": [],
    "./core": [],
    "./jotai": ["jotai"],
    "./preact": ["preact", "preact/hooks"],
    // The typed OpenAPI seam, split out of `./query` so that only an
    // app whose backend publishes a spec resolves these two. This
    // table is the thing that makes that split legible: what the row
    // costs is the whole argument for it being its own entry point.
    // See the [split
    // decision](../../../docs/decisions/2026-08-13-the-openapi-seam-is-its-own-subpath-not-part-of-query.md).
    "./openapi": ["openapi-fetch", "openapi-react-query"],
    // The request/response data layer: react-query and `react` (the
    // provider's `useState`), both optional peers, so an app that
    // never imports `./query` resolves neither. It deliberately does
    // NOT reach the openapi-* packages — when it did (via the
    // re-export this row used to list), the type-only edge above was
    // enough to force every non-OpenAPI consumer to install both.
    // `react/jsx-runtime` is added only at emit, so it is not a
    // source specifier here.
    "./query": ["@tanstack/react-query", "react"],
    "./signals": ["@preact/signals-core"],
  },
  tokens: {
    ".": [],
    "./epaper": [],
  },
  ui: {
    ".": [
      "@charcuterie/logic",
      // `ColorSchemeSwitcher` is the one component that reaches the
      // browser, and it does so through this subpath so the coupling
      // is named rather than smuggled in through the main entry.
      "@charcuterie/logic/browser",
      "@charcuterie/logic/charts/react",
      "@charcuterie/logic/core",
      "@charcuterie/tokens",
      "@floating-ui/react",
      // `Combobox`'s virtualization — the second runtime dependency
      // this package has ever taken. MIT, US-origin (Tanner Linsley),
      // tree-shakeable, ~4 KB gz.
      "@tanstack/react-virtual",
      "react",
      // `toClassName`'s conflict resolution — the third runtime
      // dependency this package has ever taken. MIT, German origin
      // (Dany Castillo), ~7 KB gz, no transitive deps.
      //
      // It earns the entry: without it `className` is not an escape
      // hatch. A caller's `hidden` and the base `inline-flex` are
      // display utilities at equal specificity, so the winner came
      // from stylesheet source order and the caller could not win —
      // silently, which is how it shipped broken in three repos.
      "tailwind-merge",
    ],
    // Retained HTML has its own format family and optional rich editor
    // peers. The main entry never reaches this parser or editor core.
    "./html-view": [
      "@charcuterie/tokens",
      "parse5",
      "react",
      "tailwind-merge",
    ],
    "./html-editor": [
      "@charcuterie/logic",
      "@charcuterie/logic/browser",
      "@charcuterie/tokens",
      "@floating-ui/react",
      "@tiptap/extension-image",
      "@tiptap/extension-text-align",
      "@tiptap/extension-text-style",
      "@tiptap/react",
      "@tiptap/starter-kit",
      "parse5",
      "react",
      "tailwind-merge",
    ],
    // The opt-in live-preview editor. Every `@codemirror/*` and
    // `@lezer/*` package appears **only** here, as an optional peer,
    // which is the entire reason it is a subpath: measured at ~176 KB
    // gz, it is 2.5x the total bundle budget of `slatecast`, and a
    // consumer that renders a description field should not pay it to
    // get one. The main entry's `MarkdownEditor` stays dependency-free
    // and stays the default.
    "./markdown-editor-codemirror": [
      "@charcuterie/logic",
      // The editor's toolbar renders a `Menu`, and every panel row now
      // asks `usePanelItemSize` whether the window is short enough to
      // step down — which is a `matchMedia` read, and `matchMedia` is
      // behind this subpath by the same rule that keeps it out of
      // `@charcuterie/logic`'s main entry. The main `ui` entry already
      // reached it (`ColorSchemeSwitcher`); this one now does too. It is
      // ~1 KB of feature-detected wrapper, not a runtime the subpath
      // exists to keep out — that is the `@codemirror/*` set below.
      "@charcuterie/logic/browser",
      "@charcuterie/tokens",
      "@codemirror/commands",
      "@codemirror/lang-markdown",
      "@codemirror/language",
      "@codemirror/state",
      "@codemirror/view",
      "@floating-ui/react",
      "@lezer/common",
      "react",
      "tailwind-merge",
    ],
    // The router seam's one shipped adapter, and the reason it is a
    // subpath rather than part of the barrel: `react-router` appears
    // **only** here, as an optional peer, so the eleven consumers of
    // the main entry never resolve it. Six of them do not have a
    // react-router at all.
    "./react-router": ["react", "react-router"],
    "./testing": [],
    "./tokens": ["@charcuterie/tokens"],
  },
}

/**
 * Every bare specifier reachable from `entryFile`, following relative
 * imports and stopping at package boundaries.
 *
 * Every relative import in this workspace carries its extension, so
 * "resolution" is a `join` — no `.js`/`index` guessing, and a typo
 * fails loudly as a missing file rather than silently pruning the
 * graph.
 */
const collectRuntimeImports = async (entryFile: string) => {
  const visited = new Set<string>()

  const bareSpecifiers = new Set<string>()

  const visit = async (file: string) => {
    if (visited.has(file)) {
      return
    }

    visited.add(file)

    // Template literals go too. `createStatus`'s error message
    // spells `from "${current}"`, which is prose about a state
    // machine and not an import of a package called `${current}`.
    const contents = stripComments(
      await readFile(file, "utf8"),
    ).replace(/`(?:[^`\\]|\\.)*`/g, "")

    const specifiers = [
      ...contents.matchAll(/\bfrom\s+"([^"]+)"/g),
      ...contents.matchAll(/\bimport\s+"([^"]+)"/g),
    ].map(([, specifier]) => specifier as string)

    for (const specifier of specifiers) {
      if (!specifier.startsWith(".")) {
        bareSpecifiers.add(specifier)

        continue
      }

      if (/\.css$/.test(specifier)) {
        continue
      }

      await visit(resolve(dirname(file), specifier))
    }
  }

  await visit(entryFile)

  return [...bareSpecifiers].sort()
}

test.each(Object.keys(ENTRY_POINT_RUNTIMES))(
  "every @charcuterie/%s entry point reaches only its own runtime",
  async (packageName) => {
    const manifest = await readManifest(packageName)

    const entryPoints = Object.entries(
      manifest.exports ?? {},
    ).flatMap(([name, target]) =>
      typeof target === "object" && target.source
        ? [[name, target.source] as const]
        : [],
    )

    // The table is exhaustive, so a new entry point cannot land
    // without somebody deciding what it is allowed to pull in.
    expect(
      entryPoints.map(([name]) => name).sort(),
    ).toEqual(
      Object.keys(
        ENTRY_POINT_RUNTIMES[packageName] ?? {},
      ).sort(),
    )

    const declared = Object.keys({
      ...manifest.dependencies,
      ...manifest.peerDependencies,
    })

    for (const [name, source] of entryPoints) {
      const reached = await collectRuntimeImports(
        join(packagesDirectory, packageName, source),
      )

      expect({
        entryPoint: `${packageName}${name.slice(1)}`,
        reached,
      }).toEqual({
        entryPoint: `${packageName}${name.slice(1)}`,
        reached: ENTRY_POINT_RUNTIMES[packageName]?.[name],
      })

      // And nothing reached is a phantom dependency —
      // `preact/hooks` is declared as `preact`, which is the unit an
      // install actually has.
      for (const specifier of reached) {
        const packageOfSpecifier = specifier.startsWith("@")
          ? specifier.split("/").slice(0, 2).join("/")
          : specifier.split("/")[0]

        expect(declared).toContain(packageOfSpecifier)
      }
    }
  },
)