Compiler profiles

HTX 1.5.0-alpha.2 (reference implementation 0.3.0-alpha.3) — Features below are available in the htx CLI unless noted as browser-only.

Status: Shipped — html, html-sanitize, and web-components profiles available in CLI

Concept

One AST, multiple backends. Profiles define how block_directive and inline_directive nodes compile.

flowchart LR
  HTX[HTX Source] --> Parser
  Parser --> AST[Canonical AST]
  AST --> Transform[Transform Layer]
  Transform --> HTML[html profile]
  Transform --> Sanitize[html-sanitize]
  Transform --> WC[web-components]
  Transform --> React[react profile]

Transforms run before compilation: tag-registry validation, trust annotation, reference resolution, and optional GFM preprocessing.

Built-in profiles

html (default)

• HTML5 structural tags pass through
• Custom tags → <div class="{tag}"> + classes from attributes
• card + [argument] → prepends <h3>
• Inline :span → <span>
• Used by the browser playground (@htx/core WASM)

html-sanitize

• Same as html + strips dangerous URLs and event handlers
• Recommended for user-generated content preview

web-components

• Custom tags → registered custom elements (e.g. htx-alert)
• Configurable tag map in compiler config

react / astro (future)

• Static component mapping only — no arbitrary JSX
• Component registry with validated props schema (tag registry / schemars)
• Inspired by Markdoc’s declarative tag → component map

Configuration example

{
  "profile": "html",
  "tagMap": {
    "row": { "element": "div", "class": "row" },
    "grid": { "element": "div", "class": "grid" },
    "card": { "element": "div", "class": "card", "titleElement": "h3" }
  }
}

Layout shorthand plugin

Optional preprocessor expands shorthand before compile:

::row { g-4 center }  →  ::row { .flex .flex-row .gap-4 .items-center }

Not part of core grammar. See the streaming parsing research note.

Prior art

• Markdoc config.tags render mapping
• unified/remark-rehype plugin pipelines
• Pandoc writers