A hybrid client-side/server-side approach to generating dynamic HTML.
npm install @domchristie/compositeA tiny web template system for the browser.
Compose your HTML in elements. Use placeholders (${…}) to mark dynamic content. Call fill to generate a new HTML string which interpolates the template's content with the given properties.
``sh`
npm install @domchristie/composite
`html`
/ rendered somewhere in the DOM /
${greeting}, ${name}!
`js`
import { fill } from '@domchristie/composite'
const Hello = document.getElementById('hello')
fill(Hello, { greeting: 'Hello', name: 'World' }) // 'Hello, World!
'
#### Table of Contents
* fill
* Parameters
* html
* Parameters
* escape
* Parameters
* unescape
* Parameters
* raw
* Parameters
Renders a template with given properties.
#### Parameters
* template (HTMLTemplateElement | string) The HTML template to be rendered.props
* Object An object containing properties to be interpolated into the template.
Returns string The rendered HTML string with properties interpolated.
A tag function for template literals that escapes HTML special characters in
values unless they are marked as raw.
#### Parameters
* strings TemplateStringsArray An array of string literals.values
* ...any The values to be interpolated into the template.
Returns string The final string with values safely interpolated.
Escapes special characters in a string for use in HTML.
The characters escaped are: & < > " ' \ = /
#### Parameters
* string string The input string to escape.
Returns string The escaped string.
Unescapes a given HTML-encoded string.
#### Parameters
* string string The HTML-encoded string to unescape.
Returns string The unescaped string.
Marks a string as raw HTML to prevent escaping of special characters.
#### Parameters
* html string The HTML string to wrap.
Returns RawString The wrapped HTML string as a RawString object.
Composite uses new Function to generate HTML from templates. This approach can fail when using strict Content Security Policies (CSPs).
Copyright © 2024+ Dom Christie and released under the MIT license.