Skip to content

Declare a component the scanner can't resolve

The scanner traces your custom components down to the HTML element they render, so a rule like image-alt fires on your wrappers too. Some components it can’t reach — a component from a third-party package with no source on disk, or one whose host is chosen at runtime. It reports these as unresolved and suggests you declare them.

If you want the scanner to treat such a component as a specific host element, map it in the components escape hatch of binclusive.json.

Open binclusive.json and add the component name and the host element it renders to the top-level components map:

{
"version": 1,
"components": {
"Avatar": "img",
"FancyButton": "button"
}
}

The host must be a single lowercase intrinsic tag (img, button, a, …). To map a compound member such as <Dialog.Close>, use its dotted name as the key: "Dialog.Close": "button".

Now a <Avatar src="/me.png" /> with no alt text is checked as an <img> and flagged, and a <FancyButton> is checked as a <button>.

Your declaration wins outright — it overrides both the built-in design-system registry and the scanner’s own source-trace. Use it when you know the host and the scanner does not.

Re-scan and check the finding you expected now appears (or the false gap is gone):

Terminal window
b8e scan .

declarations.components also feeds the generated BINCLUSIVE.md. After editing the block, regenerate so the two stay in sync:

Terminal window
b8e gen

To pre-fill declarations from the scanner’s best guesses instead of writing them by hand, run b8e init --suggest and review the result before committing. For the full contract shape, see the init reference.