cyberneticlibrary
← library

Scaffold new Lit web component

new-componentcommandsetup L2★3
reidevbx/govtw ↗
What it does

Scaffold Lit web component with type-safe patterns and documentation

Best for

Design System component development when you need scaffolded Lit patterns (formAssociated, delegatesFocus, token CSS, ARIA) and mandatory documentation.

Inputs
  • · [object Object]
  • · [object Object]
  • · [object Object]
Outputs
  • · [object Object]
  • · [object Object]
  • · [object Object]
  • · [object Object]
Requires
  • · pnpm new:component scaffolder
  • · pnpm build (compile + sync)
  • · pnpm check:components (audit completeness)
Preconditions

Task file created first; scaffolder installed and working; component name follows govtw-* convention

Failure modes
  • · Scaffolder not run (manual file creation leads to missing patterns)
  • · formAssociated declaration missing on form components
  • · CSS uses non-token fallbacks (breaks theming)
  • · Focus ring uses outline instead of box-shadow
  • · Preview HTML missing /tokens.css or /gov-tw.iife.js
  • · Completeness audit fails (missing properties table, accessibility section)
Trust signals
  • · Type: basic|form|layout determines which lifecycle hooks included
  • · Checklist enforces accessibility (aria-invalid, target="_blank" → rel)
  • · Form components auto-include FormAssociated + internals() setup
  • · Preview uses IIFE build (verifies bundling works)
  • · Completeness audit runs (pnpm check:components)