Skip to main content

HtmxBuiltinExtensions

An extensible directory of htmx extensions.

Declaring a new extension​

tsx
// in foo.d.ts:
 
declare global {
  namespace JSX {
    interface HtmxExtensions {
      myExtension: "my-extension";
    }
    interface HtmlTag {
      /** Describe your attribute */
      ["my-extension-attr"]?: "true" | "false";
      // Add any other attributes your extension uses here
    }
  }
}
 
<div hx-ext="my-extension">
  <span my-extension-attr="true">Hello</span>
               
(property) JSX.HtmlTag["my-extension-attr"]?: "true" | "false" | undefined
</div>
tsx
// in foo.d.ts:
 
declare global {
  namespace JSX {
    interface HtmxExtensions {
      myExtension: "my-extension";
    }
    interface HtmlTag {
      /** Describe your attribute */
      ["my-extension-attr"]?: "true" | "false";
      // Add any other attributes your extension uses here
    }
  }
}
 
<div hx-ext="my-extension">
  <span my-extension-attr="true">Hello</span>
               
(property) JSX.HtmlTag["my-extension-attr"]?: "true" | "false" | undefined
</div>

Properties​

ajaxHeaders​

ajaxHeaders: "ajax-headers"

Includes the commonly-used X-Requested-With header that identifies ajax requests in many backend frameworks.

CDN: https://unpkg.com/htmx.org/dist/ext/ajax-header.js

See​

https://htmx.org/extensions/ajax-header/

Source​

src/jsx.d.ts:151

alpineMorph​

alpineMorph: "alpine-morph"

Uses the Alpine.js morph plugin to swap content.

CDN: https://unpkg.com/htmx.org/dist/ext/alpine-morph.js

See​

https://htmx.org/extensions/alpine-morph/

Source​

src/jsx.d.ts:158

classTools​

classTools: "class-tools"

Class utilities.

CDN: https://unpkg.com/htmx.org/dist/ext/class-tools.js

See​

https://htmx.org/extensions/class-tools/

Source​

src/jsx.d.ts:181

clientSideTemplates​

clientSideTemplates: "client-side-templates"

Transforms JSON/XML responses into HTML.

CDN: https://unpkg.com/htmx.org/dist/ext/client-side-templates.js

See​

https://htmx.org/extensions/client-side-templates/

Source​

src/jsx.d.ts:188

debug​

debug: "debug"

Tool for debugging htmx requests.

CDN: https://unpkg.com/htmx.org/dist/ext/debug.js

See​

https://htmx.org/extensions/debug/

Source​

src/jsx.d.ts:195

disableElement​

disableElement: "disable-element"

Disable elements during requests.

CDN: https://unpkg.com/htmx.org/dist/ext/disable-element.js

See​

https://htmx.org/extensions/disable-element/

Deprecated​

1.9.6: Included into htmx core as hx-disabled-elt.

Source​

src/jsx.d.ts:203

eventHeader​

eventHeader: "event-header"

Includes the JSON of the event that triggered a request to the Triggering-Event header.

CDN: https://unpkg.com/htmx.org/dist/ext/event-header.js

See​

https://htmx.org/extensions/event-header/

Source​

src/jsx.d.ts:211

headSupport​

headSupport: "head-support"

Support for adding tags to <head>.

CDN: https://unpkg.com/htmx.org/dist/ext/head-support.js

See​

https://htmx.org/extensions/head-support/

Source​

src/jsx.d.ts:218

idiomorph​

idiomorph: "morph"

Support for Idiomorph, an alternative swapping mechanism for htmx.

CDN: https://unpkg.com/idiomorph/dist/idiomorph-ext.min.js

See​

https://github.com/bigskysoftware/idiomorph#htmx

Source​

src/jsx.d.ts:231

includeVals​

includeVals: "include-vals"

Include additional data in requests.

CDN: https://unpkg.com/htmx.org/dist/ext/include-vals.js

Source​

src/jsx.d.ts:224

jsonEncode​

jsonEncode: "json-enc"

Use JSON encoding in the body of requests, rather than the default x-www-form-urlencoded.

CDN: https://unpkg.com/htmx.org/dist/ext/json-enc.js

See​

https://htmx.org/extensions/json-enc/

Source​

src/jsx.d.ts:238

loadingStates​

loadingStates: "loading-states"

Support for inflight loading states.

CDN: https://unpkg.com/htmx.org/dist/ext/loading-states.js

See​

https://htmx.org/extensions/loading-states/

Source​

src/jsx.d.ts:245

methodOverride​

methodOverride: "method-override"

Use X-HTTP-Method-Override for non-GET and -POST requests. Useful for bypassing firewalls or proxies.

CDN: https://unpkg.com/htmx.org/dist/ext/method-override.js

See​

https://htmx.org/extensions/method-override/

Source​

src/jsx.d.ts:261

morphdomSwap​

morphdomSwap: "morphdom-swap"

Support for morphdom, an alternative swapping mechanism for htmx.

CDN: https://unpkg.com/htmx.org/dist/ext/morphdom-swap.js

See​

https://htmx.org/extensions/morphdom-swap/

Source​

src/jsx.d.ts:253

multiSwap​

multiSwap: "multi-swap"

Swap multiple elements marked with IDs, each optionally followed by a swap style.

CDN: https://unpkg.com/htmx.org/dist/ext/multi-swap.js

See​

https://htmx.org/extensions/multi-swap/

Source​

src/jsx.d.ts:268

pathDeps​

pathDeps: "path-deps"

Express dependencies between requests.

CDN: https://unpkg.com/htmx.org/dist/ext/path-deps.js

See​

https://htmx.org/extensions/path-deps/

Source​

src/jsx.d.ts:275

pathParams​

pathParams: "path-params"

Use specific parameters as path variables.

CDN: https://unpkg.com/htmx.org/dist/ext/path-params.js

See​

https://htmx.org/extensions/path-params/

Source​

src/jsx.d.ts:310

preload​

preload: "preload"

Preload HTML fragments.

CDN: https://unpkg.com/htmx.org/dist/ext/preload.js

See​

https://htmx.org/extensions/preload/

Source​

src/jsx.d.ts:282

removeMe​

removeMe: "remove-me"

Remove this element after a set duration.

CDN: https://unpkg.com/htmx.org/dist/ext/remove-me.js

See​

https://htmx.org/extensions/remove-me/

Source​

src/jsx.d.ts:289

responseTargets​

responseTargets: "response-targets"

Specify different target elements for different HTTP response codes.

CDN: https://unpkg.com/htmx.org/dist/ext/response-targets.js

See​

https://htmx.org/extensions/response-targets/

Source​

src/jsx.d.ts:296

restored​

restored: "restored"

Triggers an event restored when a back button event is detected while using hx-boost.

CDN: https://unpkg.com/htmx.org/dist/ext/restored.js

See​

https://htmx.org/extensions/restored/

Source​

src/jsx.d.ts:303

serverSentEvents​

serverSentEvents: "sse"

Ingest server-sent events.

CDN: https://unpkg.com/htmx.org/dist/ext/sse.js

See​

https://htmx.org/extensions/server-sent-events/

Source​

src/jsx.d.ts:167

ws​

ws: "ws"

WebSockets support.

CDN: https://unpkg.com/htmx.org/dist/ext/ws.js

See​

https://htmx.org/extensions/web-sockets/

Source​

src/jsx.d.ts:174