{
  "id": "@typed/template#html",
  "canonicalId": "@typed/template#html",
  "symbol": {
    "id": "@typed/template#html",
    "packageName": "@typed/template",
    "moduleName": ".",
    "exportName": "html",
    "kind": "function",
    "signatures": [
      "export declare function html<const Values extends ReadonlyArray<Renderable.Any>>(template: TemplateStringsArray, ...values: Values): Fx<RenderEvent, Renderable.Error<Values[number]>, Renderable.Services<Values[number]> | Scope | RenderTemplate>;"
    ],
    "summary": "The main template tag function.\n\nIt creates a reactive `Fx` stream that renders the template. The actual rendering logic\ndepends on the provided `RenderTemplate` service.",
    "sections": {
      "Why": "`html` describes one renderer-independent template program. The\n`RenderTemplate` Effect service decides whether that program produces DOM for\na browser, HTML chunks for SSR, or hydration against existing nodes. Dynamic\nvalues keep their own typed error and service channels instead of being\nhidden behind component state.",
      "Ownership and lifetime": "Calling the tag is inert. Rendering its returned Fx acquires dynamic values\ninside the running Effect `Scope`; interruption closes their subscriptions\nand finalizers. Each renderer owns only the dynamic parts it creates, leaving\nexternal classes, unowned DOM nodes, and native platform behavior intact.",
      "Escaping and trust": "Static template strings are authored markup. Ordinary interpolated strings\nare rendered as data, not treated as raw HTML. Renderer-owned HTML transport\nuses the separate branded `HtmlRenderEvent` boundary."
    },
    "examples": [
      {
        "language": "ts",
        "code": "import { Effect } from \"effect\"\nimport { html } from \"@typed/template\"\nimport { DomRenderTemplate, render } from \"@typed/template/Render\"\nimport { Fx } from \"@typed/fx\"\nimport { Layer } from \"effect\"\nimport { RefSubject } from \"@typed/fx/RefSubject\"\n\n// Simple static template\nconst staticTemplate = html`<div>Hello, world!</div>`\n\n// Template with dynamic values\nconst name = \"Alice\"\nconst dynamicTemplate = html`<div>Hello, ${name}!</div>`\n\n// Template with reactive values\nconst program = Effect.gen(function* () {\n  const count = yield* RefSubject.make(0)\n\n  const template = html`<div>\n    <p>Count: ${count}</p>\n    <button onclick=${RefSubject.increment(count)}>Increment</button>\n  </div>`\n\n  return yield* render(template, document.body).pipe(\n    Fx.drainLayer,\n    Layer.provide(DomRenderTemplate),\n    Layer.launch\n  )\n})"
      }
    ],
    "relations": [],
    "source": {
      "file": "packages/template/src/RenderTemplate.ts",
      "line": 139
    },
    "since": "1.0.0",
    "category": "Template authoring"
  },
  "exposure": {
    "recordKind": "declaration",
    "id": "@typed/template#html",
    "packageName": "@typed/template",
    "packageVersion": "1.0.0-beta.7",
    "moduleName": ".",
    "consumerSpecifier": "@typed/template",
    "exportName": "html",
    "qualifiedName": "html",
    "declarationKey": "declaration:d81ab78715967583d31a7c28",
    "family": "function",
    "signatures": [
      "export declare function html<const Values extends ReadonlyArray<Renderable.Any>>(template: TemplateStringsArray, ...values: Values): Fx<RenderEvent, Renderable.Error<Values[number]>, Renderable.Services<Values[number]> | Scope | RenderTemplate>;"
    ],
    "sourceSpans": [
      {
        "file": "packages/template/src/RenderTemplate.ts",
        "start": {
          "line": 139,
          "column": 1
        },
        "end": {
          "line": 148,
          "column": 2
        }
      }
    ],
    "aliases": [
      "@typed/template/RenderTemplate#html"
    ],
    "isAlias": false,
    "static": false
  },
  "declaration": {
    "declarationKey": "declaration:d81ab78715967583d31a7c28",
    "name": "html",
    "family": "function",
    "facets": [
      {
        "family": "function",
        "syntaxKind": "FunctionDeclaration",
        "signatures": [
          "export declare function html<const Values extends ReadonlyArray<Renderable.Any>>(template: TemplateStringsArray, ...values: Values): Fx<RenderEvent, Renderable.Error<Values[number]>, Renderable.Services<Values[number]> | Scope | RenderTemplate>;"
        ],
        "typeParameters": [
          "const Values extends ReadonlyArray<Renderable.Any>"
        ],
        "sourceSpans": [
          {
            "file": "packages/template/src/RenderTemplate.ts",
            "start": {
              "line": 139,
              "column": 1
            },
            "end": {
              "line": 148,
              "column": 2
            }
          }
        ],
        "static": false,
        "readonly": false,
        "optional": false
      }
    ],
    "signatures": [
      "export declare function html<const Values extends ReadonlyArray<Renderable.Any>>(template: TemplateStringsArray, ...values: Values): Fx<RenderEvent, Renderable.Error<Values[number]>, Renderable.Services<Values[number]> | Scope | RenderTemplate>;"
    ],
    "typeParameters": [
      "const Values extends ReadonlyArray<Renderable.Any>"
    ],
    "summary": "The main template tag function.\n\nIt creates a reactive `Fx` stream that renders the template. The actual rendering logic\ndepends on the provided `RenderTemplate` service.",
    "sections": {
      "Why": "`html` describes one renderer-independent template program. The\n`RenderTemplate` Effect service decides whether that program produces DOM for\na browser, HTML chunks for SSR, or hydration against existing nodes. Dynamic\nvalues keep their own typed error and service channels instead of being\nhidden behind component state.",
      "Ownership and lifetime": "Calling the tag is inert. Rendering its returned Fx acquires dynamic values\ninside the running Effect `Scope`; interruption closes their subscriptions\nand finalizers. Each renderer owns only the dynamic parts it creates, leaving\nexternal classes, unowned DOM nodes, and native platform behavior intact.",
      "Escaping and trust": "Static template strings are authored markup. Ordinary interpolated strings\nare rendered as data, not treated as raw HTML. Renderer-owned HTML transport\nuses the separate branded `HtmlRenderEvent` boundary."
    },
    "examples": [
      {
        "language": "ts",
        "code": "import { Effect } from \"effect\"\nimport { html } from \"@typed/template\"\nimport { DomRenderTemplate, render } from \"@typed/template/Render\"\nimport { Fx } from \"@typed/fx\"\nimport { Layer } from \"effect\"\nimport { RefSubject } from \"@typed/fx/RefSubject\"\n\n// Simple static template\nconst staticTemplate = html`<div>Hello, world!</div>`\n\n// Template with dynamic values\nconst name = \"Alice\"\nconst dynamicTemplate = html`<div>Hello, ${name}!</div>`\n\n// Template with reactive values\nconst program = Effect.gen(function* () {\n  const count = yield* RefSubject.make(0)\n\n  const template = html`<div>\n    <p>Count: ${count}</p>\n    <button onclick=${RefSubject.increment(count)}>Increment</button>\n  </div>`\n\n  return yield* render(template, document.body).pipe(\n    Fx.drainLayer,\n    Layer.provide(DomRenderTemplate),\n    Layer.launch\n  )\n})"
      }
    ],
    "sourceSpans": [
      {
        "file": "packages/template/src/RenderTemplate.ts",
        "start": {
          "line": 139,
          "column": 1
        },
        "end": {
          "line": 148,
          "column": 2
        }
      }
    ],
    "since": "1.0.0",
    "category": "Template authoring"
  }
}