Behavior
Interactions / vanilla JS
artist.js progressively enhances native, readable HTML. It does not render components, manage application data, or require a library.
Load it once
<script src="/assets/js/artist.js" defer></script>The script discovers component markup after the document is parsed. Copy the author HTML shown in these docs; do not copy enhanced clones, runtime state classes, or private --_* measurements from browser inspection.
Enhancement map
| Component | Without JavaScript | With Artist |
|---|---|---|
| Accordion / Dropdown | Native details/summary. | Reversible motion; Dropdown adds outside-click and Escape dismissal. |
| Navbar | Links and nested native disclosures remain available. | Mobile menu, drill-down, final-link dismissal, and floating visibility. |
| Tabs | Every panel remains readable. | One selected panel, roving keyboard focus, and restrained transitions. |
| Modal | Dialog content exists, but Artist open buttons do not act. | Native dialog opening, animated dismissal, and focus containment. |
| Track / Marquee | Native scrolling or a static readable set. | Item navigation or continuous, reduced-motion-aware proof lanes. |
| Scroll-Story / Selector | Original text-and-Figure pairs stay in reading order. | Coordinated active media and narrative state. |
| Tooltip / feedback / forms | Native title, validation, and visible messages. | Positioned hints, dismiss motion, and invalid-state feedback. |
What your application owns
Artist does not submit forms, fetch data, route pages, process payments, provide authentication, or decide what a button does. Those responsibilities remain with the application. Artist supplies documented presentation and interaction behavior for the HTML you provide.
artist.js after every render. Plan that integration explicitly.Accessibility and motion
Use real buttons, links, labels, headings, details/summary, and dialog. Artist preserves keyboard access and native fallbacks, and reduces or removes decorative movement when the user prefers reduced motion. Application logic still owns correct names, states, error messages, and focus decisions outside the documented components.