SSR (Experimental)

Render ShadowDOM on thee server with Declarative Shadow DOM. Parses HTML and recursively inserts user defined templates. The most important part of this would be the template loader. A template loader is an object that defines how the applicator will get the string values for both the html and the css. (css is optional).

``TS
import { Applicator. NoopTemplateCache, FileSysTemplateLoader } from '@joist/ssr';

// Define a template caching strategy and a template loader
const applicator = new Applicator(
new NoopTemplateCache(),
new FileSysTemplateLoader(
(tag) => elements/${tag}/${tag}.html,
(tag) => elements/${tag}/${tag}.css
)
);

// Apply to a document and provide a list of elements to search for
applicator.apply(document, [])
`

Vite

`TS
import { Applicator. NoopTemplateCache, FileSysTemplateLoader } from '@joist/ssr';
import { defineConfig } from 'vite';

const applicator = new Applicator(
new NoopTemplateCache(),
new FileSysTemplateLoader(
(tag) => elements/${tag}/${tag}.html,
(tag) => elements/${tag}/${tag}.css
)
);

export default defineConfig({
plugins: [
{
transformIndexHtml: {
enforce: "pre",
transform(html) {
return applicator.apply(html, ['my-element', 'my-dropdown']);
}
}
}
],
});
``