Coming from Alpine or htmx
Most of what the Alpine and htmx ecosystems add as plugins or extensions exists here as an opt-in directive or function. Register only what you use. Anything marked “not provided” below is a candidate for a directive of your own; see Writing plugins.
Alpine.js
Section titled “Alpine.js”| Alpine | sigmx | notes |
|---|---|---|
x-cloak |
data-cloak |
same CSS rule, [data-cloak] { display: none !important } |
x-collapse |
data-collapse |
standalone, no x-show needed; __duration |
x-transition |
data-transition |
fade only; class-based transitions are not provided |
x-mask |
data-mask |
__dynamic for x-mask:dynamic |
x-teleport |
data-teleport |
selector value |
x-html |
data-html |
|
x-intersect |
data-on-intersect |
|
x-resize |
data-on-resize |
|
$persist |
data-persist |
|
$dispatch |
@dispatch |
|
$watch |
data-on-signal-patch |
|
x-anchor, x-sort |
not provided | both wrap a large third-party library; use it directly from a data-init, or wrap it in a directive of your own |
x-for, x-if |
not provided | render on the server and patch; sigmx has no client templating |
| htmx | sigmx | notes |
|---|---|---|
hx-boost |
data-boost |
whole-document morph with history |
hx-confirm |
@confirm |
@confirm('…') && @post('/x') |
hx-ext="ws" |
@ws |
messages in event-stream form |
hx-ext="sse" |
built in | any @get whose response is text/event-stream |
remove-me |
data-remove-me |
|
hx-indicator, loading states |
data-indicator with data-show, data-class, data-attr:disabled |
|
hx-trigger="every 2s" |
data-on-interval |
|
hx-trigger="revealed" |
data-on-intersect__once |
|
hx-trigger="keyup changed delay:300ms" |
data-on:keyup__debounce.300ms |
|
hx-swap-oob |
built in | top-level elements in a response morph by id |
hx-preserve |
data-ignore-morph, data-preserve-attr |
|
hx-push-url, hx-replace-url |
data-query-string, data-replace-url |
|
hx-sync |
the abort request option |
|
hx-vals, hx-headers |
payload and headers request options |
|
hx-ext="json-enc" |
default; contentType: 'form' for forms |
|
head-support |
built in | full-document responses morph the head |
Datastar
Section titled “Datastar”Everything in the reference, plus the plugins above. Markup is compatible; see Migration.