Skip to content

docs: add declarative template documentation to 3.x docs site#7495

Merged
janechu merged 3 commits intoreleases/fast-element-v3from
users/janechu/add-declarative-docs
Apr 24, 2026
Merged

docs: add declarative template documentation to 3.x docs site#7495
janechu merged 3 commits intoreleases/fast-element-v3from
users/janechu/add-declarative-docs

Conversation

@janechu
Copy link
Copy Markdown
Collaborator

@janechu janechu commented Apr 24, 2026

Pull Request

📖 Description

Adds a new Declarative HTML documentation section to the 3.x docs site with four pages covering the full declarative template authoring workflow:

  • Overview — Purpose of declarative templates, when to use them, a hello world example, and comparison with imperative html tagged templates.
  • Writing f-templates — Template syntax including content/attribute/boolean/event bindings, directives (f-when, f-repeat, f-ref, f-slotted, f-children), dot-notation paths, execution context access ($e, $c), and expression limitations.
  • Defining ElementsTemplateElement registration, templateOptions: "defer-and-hydrate", lifecycle callbacks (config()), element configuration (options()), observerMap and attributeMap usage.
  • Server-Side Rendering — The renderer-agnostic SSR contract, hydration flow, Declarative Shadow DOM output, state propagation, and @microsoft/fast-build CLI usage.

Also adds cross-references from packages/fast-element/README.md and DECLARATIVE_HTML.md to the new docs.

Based on the declarative template features from PRs #7490, #7491, #7492, and #7493.

📑 Test Plan

  • Website builds successfully with npm run build -w sites/website
  • All four pages render correctly in the 11ty output
  • npm run checkchange passes (no change files needed for docs-only changes to the website)

✅ Checklist

General

  • I have included a change request file using $ npm run change
  • I have added tests for my changes.
  • I have tested my changes.
  • I have updated the project documentation to reflect my changes.
  • I have read the CONTRIBUTING documentation and followed the standards for this project.

janechu and others added 2 commits April 24, 2026 11:59
Add a new Declarative HTML section to the 3.x documentation with four pages:
- Overview: purpose, hello world example, declarative vs imperative comparison
- Writing f-templates: binding syntax, directives, events, execution context
- Defining Elements: TemplateElement setup, lifecycle callbacks, observerMap, attributeMap
- Server-Side Rendering: SSR contract, hydration flow, fast-build CLI

Also add cross-references in fast-element README.md and DECLARATIVE_HTML.md.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
- Replace TemplateElement.define() with declarativeTemplate() resolver
- Replace templateOptions: "defer-and-hydrate" with template: declarativeTemplate()
- Use observerMap()/attributeMap() as define extensions instead of TemplateElement.options()
- Fix hydration markers example: data-fe is for attribute bindings only
- Change attribute-name-strategy default from "none" to "camelCase"
- Fix README/DECLARATIVE_HTML links to use fast.design URLs

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Comment thread sites/website/src/docs/3.x/declarative-templates/defining-elements.md Outdated
Comment thread sites/website/src/docs/3.x/declarative-templates/defining-elements.md Outdated
Comment thread sites/website/src/docs/3.x/declarative-templates/defining-elements.md Outdated
Remove all lifecycle callback documentation (TemplateElement.config,
hydrationComplete, etc.) as the API will be redesigned. Remove all
TemplateElement.options() references. Update cross-references in
overview and server-rendering pages.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
@janechu janechu marked this pull request as ready for review April 24, 2026 19:57
@janechu janechu merged commit 79c24b9 into releases/fast-element-v3 Apr 24, 2026
13 checks passed
@janechu janechu deleted the users/janechu/add-declarative-docs branch April 24, 2026 20:33
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants