ReviewOS

stacks/stx

feat(typecheck): validate component props and event contracts at template call sites

#1964
Closed glennmichael123 opened this 10 days ago ·
10 days ago

Problem

stx typecheck checks template expressions, but checking an expression alone does not establish whether its value matches the receiving component's contract.

For example, if Counter declares count as a required number, passing a string through :count should fail at the parent template, and omitting count should also fail.

Evidence

Reviewed at 7d93c4c: stx-virtual-ts.ts emits a standalone expression check for :count and an event wrapper whose $event is any. The generated buffer does not connect those expressions to Counter's declared props/events.

This extends the checker introduced by #1852 and its later typing improvements; it is not a request for another checker.

Scope and acceptance criteria

  • Resolve component contracts through the same component lookup conventions as rendering.
  • Validate required props and static/dynamic prop value types at usage sites.
  • Infer declared event payload types in parent handlers.
  • Respect optional props, defaults, and permitted attribute fallthrough.
  • Report diagnostics at the original parent .stx location.
  • Share contract resolution between CLI and editor diagnostics where applicable.
  • Test invalid usages and valid defaults, aliases, imported types, and reactive bindings.

Prior art: Vue tooling.

10 days ago

Implemented in b0912f2 and shipped on main. Component call sites now validate required/defaulted props, static and dynamic values, and declared event payloads, while permitting attribute fallthrough. Rendering, CLI typechecking, and the editor share component resolution; diagnostics point to the parent .stx source, including multiline attributes. Tests cover aliases, imported types, package imports, reactive bindings, and editor invalidation of unsaved child contracts. Documentation: docs/features/component-typechecking.md. Verification: 13,106 local tests passed; typecheck, lint, tests and publish-commit all green: https://github.com/stacksjs/stx/actions/runs/35999404146. The TypeScript editor plugin also built and passed a Node smoke test; the separate full VSCode library build still has pre-existing missing CSS exports, unchanged by this issue.

Sign in to comment on this issue.