Skip to main content
Deno 2 is finally here 🎉️
Learn more

voks web elements

deno.land/x version npm version

Voks Web Elements is a list of atomic voks components, reflecting every standard HTML Element tag as described at the MDN. It does not include deprecated (and yet) no experimental tags.

API Docs: https://deno.land/x/voks_web_elements/mod.ts

All elements provide an attributes parameter, that is typed to include all global HTML attributes as well as the specific attributes for each element.


NOTE!: please be aware, that attributes are no longer passed via attributes sub-property. Instead, they are passed directly to the element function.

Deno

import { html, renderToString } from "https://deno.land/x/voks/mod.ts";
import {
  body,
  h1,
  head,
  htmlElement,
} from "https://deno.land/x/voks_web_elements";

// deno-fmt-ignore
const template = htmlElement(html`
  ${head()}
  ${body(html`
    ${h1("Hello World!", { class: "title" })}
  `)}
`)

await renderToString(template);

npm

npm i @voks/voks
npm i @voks/voks-web-elements
import { html, renderToString } from "@voks/voks";
import { body, h1, head, htmlElement } from "@voks/voks-web-elements";

// deno-fmt-ignore
const template = htmlElement(html`
  ${head()}
  ${body(html`
    ${h1("Hello World!", { class: "title" })}
  `)}
`)

await renderToString(template);

Development

Testing

deno test