NAC v1.8 drive UIs by voice, chat, AI

Talk to this page. Or click. Or let Yujin do it.

Every button, field and modal here speaks NAC. A voice runner, a chat agent or an accessibility tool can drive the page without scraping pixels and without DOM hacks. Hit the button below and watch the page drive itself.

Sumi-e gallery

3 icons, 3 ink drawings. Click an icon to expand it; click again to minimize.

Click and watch the lifecycle events fly.

Form fields

Text, select, checkbox -- all driveable by NAC.fill.

Tabs & accordion

Tablist, tabpanel and accordion-section -- v1.1.

Overview content. Try saying "passa a la tab Details".

Combobox & slider

Autocomplete + continuous range -- v1.1.

Sortable / filterable table

sort-control, filter-control, pagination-control -- v1.1.

Page 1 / 2

Drag & drop + file zone

draggable, drop-target, dropzone -- v1.1.

  • Alpha
  • Beta
  • Gamma
  • drop here
Drop a file here, or click to pick. (no real upload -- demo only)

Remote autocomplete

5000 cities, server-fetched. options_source=remote -- v1.2.

    Ready. Type to search. Picked: (none)

    First-contact discovery: views, transitions, capabilities -- v1.2.

    (empty -- click a button)

    Self-test & introspect

    Run the runner against this same page. See the system map. Take an AI agent tour.

    (empty -- click any button)
    Gap report

      NAC events live

      Every interaction emits a NAC lifecycle event. Watch.

        Stepper -- sumi-e cycler

        v1.7 sec 6.2.8 -- nac:step:advanced / :back

        Sakura -- step 1 of 3

        Tree

        v1.7 sec 6.2.9 -- nac:tree:expanded/collapsed/selected

        • Fruits
        • Vegetables
        • Grains

        Toast

        v1.7 sec 6.2.10 -- nac:toast:shown/dismissed

        Drawer

        v1.7 sec 6.2.11 -- nac:drawer:opened/closed

        Calendar

        v1.7 sec 6.2.12 -- nac:calendar:view_changed/event_selected

        Mon 04
        Tue 05
        Wed 06
        Thu 07
        Fri 08
        Sat 09
        Sun 10

        View: week, 2 events

        Chart

        v1.7 sec 6.2.13 -- nac:chart:data_loaded/series_toggled

        2 series, 6 points each

        Map

        v1.7 sec 6.2.14 -- nac:map:focused/marker_selected

        No marker selected

        Richtext

        v1.7 sec 6.2.15 -- nac:richtext:formatted/link_inserted

        Type here. Use B/I/Link buttons.

        Breadcrumb

        v1.7 sec 6.2.16 -- nac:breadcrumb:navigated

        Showing: Item 42

        Timeline

        v1.7 sec 6.2.18 -- nac:timeline:loaded

        • 2026-05-07 -- v1.7 sec 6.2 spec
        • 2026-05-06 -- v1.6.1 hard-error drift
        • 2026-05-06 -- v1.6.0 reset primitive

        Skip-validate region

        v1.8 sec 3.1 -- data-nac-validate="skip"

        The grey region below mocks a third-party widget the host cannot retrofit with NAC. The validator does NOT raise hard-errors on its contents but DOES warn about the interactives it hides.

        3rd-party
        idle

        Dangerous action with a11y hint

        v1.8 sec 3.1 -- data-nac-a11y-hint

        The button below declares its risk via data-nac-a11y-hint. Voice tools, screen readers and AI agents read this from NAC.describe() and SHOULD interpose a confirmation BEFORE invoking. The inert button next to it has no hint and is just a normal action.

        idle

        describe() on the delete button: a11y_hint: ["irreversible","requires_confirmation","data_loss"]

        Drag-type accept / reject

        v1.8 sec 13.4 -- data-nac-drag-type / -drag-accept

        Drag the typed cards into one of the two zones. The "files only" zone accepts only file; the "any" zone accepts everything. A type mismatch fires nac:command:rejected with reason="drag_type_mismatch".

        file
        tag
        note
        files only
        any
        idle