HTMX

    Estimated reading time: less than 1 minute

    Kita Html provides type definitions for all HTMX attributes. Once enabled, attributes like hx-get, hx-post, hx-trigger, hx-target, and hx-swap are available on all HTML elements with full autocomplete.

    Setup

    Create a src/kita.d.ts file in your project and add the triple-slash directive:

    src/kita.d.ts
    /// <reference types="@kitajs/html/htmx.d.ts" />

    Or enable it globally in tsconfig.json:

    tsconfig.json
    {
  "compilerOptions": {
    "types": ["@kitajs/html/htmx.d.ts"]
  }
}

    Usage

    <button hx-post="/api/click" hx-target="#count" hx-swap="innerHTML">
  Click me
</button>

<div id="count">0</div>

    All standard HTMX attributes are typed, including hx-trigger event specifications, hx-swap modifiers, and extension attributes like hx-ext.