A complete implementation of Sileo's native depictions in TypeScript.
$ npm i @parcility/kennel
Kennel was written to be as easy to interact with as possible.
render(depiction: any, options?: Parital<RenderOptions>): Promise<HTMLElement | string>
Render a depiction to either a HTMLElement or a string.
depiction
: An object that stores the native depiction's contents.
options
: The settings used for rendering.options.ssr
: Output a string instead of a DOM element.options.defaultTintColor
: The css color used for the tint.
hydrate(target?: ParentNode): void
Runs the hydrate function on views that need to be hydrate. Can only be ran on the client side.
target
: The root element for hydration. Defaults todocument.body
.
// Import Kennel
import { render, hydrate } from "@parcility/kennel";
// Assumes the `depiction` variables exists elsewhere. The second argument (options) can be omitted.
let output = await render(depiction, { ssr: true });
// sometime on the client.
hydrate();
A full demo is available by running yarn dev
.
Run the test page, which loads depictions from the test/
directory.
yarn dev
This is not required if you installed Kennel through NPM.
1: Install dependencies
yarn install
2: Build module
yarn build