@benev/slate/x/demo/views/nesting.js

frontend web stuff

import { css } from "lit";
import { slate } from "../frontend.js";
import { html } from "../../nexus/html.js";
const styles = css `span { color: green }`;
let outerRenders = 0;
let innerRenders = 0;
export const NestingOuter = slate.shadowView(use => (start) => {
    use.styles(styles);
    const rendercount = ++outerRenders;
    const count = use.signal(start);
    const increase = () => count.value += 1;
    return html `
		<span>${count} (renders ${rendercount})</span>
		<button @click=${increase}>outer</button>
		${NestingInner([1])}
	`;
});
export const NestingInner = slate.shadowView(use => (start) => {
    use.styles(styles);
    const rendercount = ++innerRenders;
    const count = use.signal(start);
    const increase = () => count.value += 1;
    return html `
		<span>${count} (renders ${rendercount})</span>
		<button @click=${increase}>inner</button>
	`;
});
//# sourceMappingURL=nesting.js.map