Repository navigation
v0.7.0
Summary
Nativele 0.7.0 checks more of the contract between HTML and TypeScript: a data-on-* handler's parameter is checked against the event it is bound to, a form's elements and a list item's el are typed from the template. Lint, ts-dom check, codegen and the oxlint plugin now read how templates, classes and define() calls relate from one index that follows imports, barrels and namespaces, so they agree with each other on any file layout and stay current in the editor and the Vite dev server. The accessibility rules judge an element by its composed content, including what child components render into it, and say so with unchecked-content when they cannot. This release has breaking changes; see below.
Changes
Types and checks
- A
data-on-*handler may declare its event as its first parameter (onPick(e: EmitEvent<Picker, "pick">),onKey(e: KeyboardEvent));define()checks it against the event the element declares for that name (the child'semits, the element'son<event>property, thenHTMLElementEventMap), andts-dom checkreports a mismatch ashandler-event-typeat the attribute.this.on()checks an annotated parameter the same way. - A
data-refon a<form>typeselementswith the controls inside it bynameandid; a misspelled name is a tsc error. - A list item's
elis typed by the item's root tag: the item component's class for a component list, the element type for plain items. - New errors and warnings:
each-in-svg(data-eachinside<svg>or<math>),unchecked-custom-elements(custom elements lint has no single definition of, listed once per run with the cause and fix of each), and the a11y warningunchecked-content. ts-dom lintandts-dom checktake--ignore=<rule-id>(repeatable) to leave out warnings.
Lint and tooling
- One component index follows templates and classes through re-exports, barrels and namespaces and finds a class whose
define()is in another file, so such components are ints-dom-tags.ts, have typedrefs, and get their props, events and template checked. ts-dom checkpointsmissing-binding,missing-handlerandhandler-event-typeat the template of the class the error is about, for every missing name, and keeps independent errors inside a broken class.role-tabindexandclick-semanticsno longer overlap;click-semantics,control-nameandheading-emptyread what child components render, slots filled, so<div data-on-click><button>and a button whose name comes from a child component pass.custom-event-on-nativeuses lib.dom's event names and reports only an event a component emits withoutbubbles: true.- The oxlint language server and the Vite plugin follow file changes across files (a child template, a new
define(), apackage.json) instead of keeping what they read first; the Vite plugin'sa11ygives the same results asts-dom lint --a11y. - Faster on large projects: each template is parsed once per run, a
define()save regenerates only the templates that use the changed tags, andts-dom gen --watchparses only the saved template.
Fixes
- A
data-on-*inside adata-ifblock of a list item now fires. ts-dom lintandts-dom genreport a missing folder asdir-not-foundinstead of crashing.- Templates imported from any folder, imported without
.js, or used by a generic component class are found and checked.
Documentation and Skills
- New Official Skill
nativele-web-awesome;nativele-svelte,nativele-angular,nativele-zod,nativele-tanstack-queryandnativele-tailwindare Official. - Every library rule is stated once in
docs/and linked fromllms.txt; new recipes for request cancellation, config-driven tables, form-associated components and switching the language;AGENTS.mdis a guide for agents that use the library.
Breaking Changes
Schema["events"]maps each handler to the[tag, event]pairs it is bound to instead of being a union of handler names. Migration: only a schema written by hand fortemplate<...>()changes; useevents: Record<never, never>for a template without handlers.- A handler whose first parameter does not accept the bound event (
KeyboardEventon aclick,InputEventon achange) is a tsc error (wrongHandlerParameters). Migration: declare the event type the error names, or type the parameterEventand narrow it in the body. - A list item's
elis no longerElement, so a cast such asctx.el as HTMLInputElementon an<li>item fails. Migration: remove the cast, or cast to the element the template has at the root. - The lint rule
missing-handleris removed fromts-dom lintand the oxlint plugin (ts-dom/missing-handler); tsc reports a missing handler atdefine(), andts-dom checkreports it at the template under the same id. Migration: dropts-dom/missing-handlerfrom the linter config, and runts-dom checkortscwhere onlyts-dom lintran. emitsnamedfocusin,focusout,compositionstart,compositionupdate,compositionend,touchstart,touchmove,touchendortouchcancelthrows[native-event-name]in every browser (tsc already reported it). Migration: rename the event, for example with a prefix.- A custom event emitted with
bubbles: trueis handled in the bubble phase, so astopPropagation()between its target and the handler now stops it. Migration: where the handler must still receive it, do not stop its propagation below that handler.