Directives & Public API
These lists are closed. PulsePoint has no other directives, template syntax or globals. If something is not listed here, it does not exist — do not infer it from React, Vue or Alpine.
Template syntax
| Syntax | Where it goes | Purpose |
|---|---|---|
{expression} |
Text nodes and quoted attribute values | Interpolate a value as text or attribute content. |
on* (onclick, oninput, onchange, onsubmit, …) |
Any element | Event binding for any native DOM event. |
pp-for="item in items" / "(item, index) in items" |
<template> only | Keyed list rendering. |
key="{expr}" |
The repeated element inside a pp-for template | Keyed diffing identity. |
pp-ref="name" / pp-ref="{expr}" |
Elements and component roots | Imperative element access. |
hidden="{!cond}" |
Any element | Conditional rendering — the one and only conditional form. |
defaultvalue="{expr}" (lowercase) |
input, textarea, select | Seed an uncontrolled field once. |
defaultchecked="{expr}" (lowercase) |
checkbox, radio | Seed an uncontrolled check once. |
pp-style="{cssText}" |
Any element | Dynamic inline style as a CSS string. |
pp-spread="{...obj}" |
Any element | Spread an object into attributes. |
<token.provider value="{v}"> |
Anywhere in markup | Context provider element. |
<template pp-owner="owner_id"> |
Inside a child component's boundary | Slot content (children) — resolves in the owner's scope, rendered in place. |
pp-ref-forward="true" |
A composition host (display: contents component root) | Forward a pp-ref through the host to the first concrete component root. |
<!--pp:id--> … <!--/pp--> |
Around a run of sibling roots | Fragment (multi-root component) boundary markers — server-emitted. |
pp-spa="false" |
An <a> element | Opt one link out of SPA interception. |
pp-reset-scroll="true" |
A scroll container or <body> | Reset that container's scroll on navigation. |
pp-scroll-key="stable-name" |
A scroll container | Stable scroll-restoration identity. |
pp-loading-content="true" |
The region swapped during navigation | Marks the SPA navigation content region. |
pp-loading-url="/route" |
A loading-state element | Route-specific loading lookup. |
There is no pp-if, pp-show, pp-else,
pp-model, pp-bind, pp-class, pp-text,
pp-html, pp-on or pp-key. Conditionals are
hidden="{...}"; two-way binding is value="{state}"
plus an oninput handler.
Always quote brace attributes. class="{expr}" is correct;
class={expr} is invalid HTML — the parser splits the value into junk
attributes and the component silently fails to compile. A valid PulsePoint template is
still valid HTML with every {} deleted.
Component-script hooks
Available on pp inside a component <script>:
| Hook | Returns / behavior |
|---|---|
pp.state(initial) |
[value, setValue] — setter accepts a value or an updater function. |
pp.effect(cb, deps?) |
Runs after render; may return a synchronous cleanup function. |
pp.layoutEffect(cb, deps?) |
Runs synchronously after DOM mutation, before pp.effect. |
pp.ref(initial?) |
{ current } — mutable, never causes a render. |
pp.memo(factory, deps) |
Memoized computed value. |
pp.callback(fn, deps) |
Memoized function identity. |
pp.reducer(reducer, initialState) |
[state, dispatch]. |
pp.context(token) |
Resolves a provided context value from ancestor components. |
pp.portal(ref, target?) |
Renders a ref-managed element elsewhere; target defaults to document.body. |
pp.id() |
Stable DOM-safe unique id per hook slot — use for id/for/aria-* pairing. |
pp.syncExternalStore(subscribe, getSnapshot) |
Subscribe to a source PulsePoint does not own. |
pp.imperativeHandle(ref, createHandle, deps?) |
Publish an imperative API on a parent-owned ref. |
pp.transition() |
[isPending, startTransition] — pending flag for sync or async scopes. |
pp.deferredValue(value, initial?) |
A copy of value that catches up one commit later. |
pp.optimistic(passthrough, reducer?) |
[optimisticState, addOptimistic] — pending guesses dropped when passthrough changes. |
pp.errorBoundary() |
[error, reset] — marks this component as an error boundary. |
pp.props |
The props bag for a nested component (not a function). |
Runtime utilities
| Utility | Purpose |
|---|---|
pp.createContext(defaultValue) |
Create a context token to provide and consume. |
pp.mount() |
Idempotently mount the global runtime; use ComponentInit.bootstrap() for a standalone module import. |
pp.redirect(url) |
SPA-aware navigation. |
pp.rpc(name, data?, options?) |
Call a named server function — see Backend Integration. |
pp.socket(name, args?, handlers?) |
Open a named bidirectional server channel. |
pp.enablePerf() / pp.disablePerf() |
Toggle render-timing collection. |
pp.getPerfStats() / pp.resetPerfStats() |
Read or clear collected render timings. |
Identifiers inside event handlers
Inside an on* attribute the runtime provides event, plus the
aliases e, $event, target (→ event.target),
currentTarget and el (both → event.currentTarget).
An alias is skipped when your component scope already declares that name.
<button onclick="choose(item, event)">Pick</button>
<input oninput="setQuery(target.value)" />
<form onsubmit="save(e)">…</form>Not in PulsePoint
React hooks with no PulsePoint equivalent — do not generate them:
forwardRef (ref forwarding exists, but as the
pp-ref-forward attribute on a composition host — see
Components —
not a function), memo() as a wrapper, lazy,
Suspense, useInsertionEffect, useDebugValue,
useActionState, useFormStatus, startTransition
as a free function.