@hstd/wc

Hstd to WebComponents Adapter.

Usage

import { h as html } from "hstd";
import { define } from "@hstd/wc";

function MyComponent({ name, fruit }) {
	return html`
		<h1>My name is ${name} and ${fruit} is my trend!</h1>
	`;
}

define({ "my-component": MyComponent });

<my-component name="Josh" fruit="orange">
	<!-- #shadow-root -->
	<h1>My name is Josh and orange is my trend!</h1>
</my-component>

If you change attributes manually, then the value changes automatically(attributes are transferred as a pointer!).

Install

npm i @hstd/wc