JP Journal · custom-element state contract

CSS custom states versus data attributes

One pure reducer owns idle, busy, success, error, and disabled. Styling state, explicit fallback, visible text, and ARIA/native projections update from the same accepted transition.

Component receipt

Idle: ready to begin.

Current reducer state: idle

CustomStateSet support: checking

Projection: pending upgrade

The no-JavaScript baseline is readable before upgrade.

Transition receipt

#	Previous	Action	Next	Accepted	Style projection	Semantic projection

Truth limit: CSS custom states are styling hooks. They do not replace native behavior, ARIA, public attributes, persistence, form participation, or server-readable state. This lab demonstrates fallback parity in the current browser only.

Static lifecycle: idle can start; busy can succeed or fail; error can retry; results can reset; disabled blocks work. Native and ARIA semantics remain independent of styling selectors.