undocumented-part

Documented CSS parts

exposed part="…" elements are documented with @csspart.

Rule id undocumented-part — run only this rule with banira lint src/*.ts --rules undocumented-part.

Why it matters

A part="…" attribute is a styling contract: it lets consumers target inner elements with ::part(). Document each exposed part with a class-level @csspart tag so the contract is discoverable. banira mounts the element and flags any rendered part name that isn't documented.

✗ Flagged

src/my-button.ts — exposes a part but does not document it
export class MyButton extends HTMLElement {
  connectedCallback() {
    this.attachShadow({ mode: 'open' }).innerHTML =
      '<button part="button"><slot></slot></button>';
  }
}
customElements.define('my-button', MyButton);

✓ Good

src/my-button.ts — @csspart documents the exposed part
/**
 * @csspart button - the inner native button
 */
export class MyButton extends HTMLElement {
  connectedCallback() {
    this.attachShadow({ mode: 'open' }).innerHTML =
      '<button part="button"><slot></slot></button>';
  }
}
customElements.define('my-button', MyButton);