From d3dc78e75cebd743aad1e830e244cc536d5ecc2b Mon Sep 17 00:00:00 2001 From: Ayo Date: Sat, 2 Dec 2023 17:00:41 +0100 Subject: [PATCH] chore: organize examples --- .../attach-effect}/Counter.mjs | 4 +-- examples/attach-effect/Decrease.mjs | 25 +++++++++++++++++++ .../attach-effect}/index.html | 4 ++- 3 files changed, 30 insertions(+), 3 deletions(-) rename {attach-effect => examples/attach-effect}/Counter.mjs (81%) create mode 100644 examples/attach-effect/Decrease.mjs rename {attach-effect => examples/attach-effect}/index.html (65%) diff --git a/attach-effect/Counter.mjs b/examples/attach-effect/Counter.mjs similarity index 81% rename from attach-effect/Counter.mjs rename to examples/attach-effect/Counter.mjs index a4f2c0f..409ddc2 100644 --- a/attach-effect/Counter.mjs +++ b/examples/attach-effect/Counter.mjs @@ -1,6 +1,6 @@ // @ts-check -import WebComponent from "../src/WebComponent.js"; -import { attachEffect } from "../src/attach-effect.js"; +import WebComponent from "../../src/WebComponent.js"; +import { attachEffect } from "../../src/attach-effect.js"; export class Counter extends WebComponent { static properties = ["count"]; diff --git a/examples/attach-effect/Decrease.mjs b/examples/attach-effect/Decrease.mjs new file mode 100644 index 0000000..e8af741 --- /dev/null +++ b/examples/attach-effect/Decrease.mjs @@ -0,0 +1,25 @@ +// @ts-check +import WebComponent from "../../src/WebComponent.js"; +import { attachEffect } from "../../src/attach-effect.js"; + +export class Decrease extends WebComponent { + static properties = ["count"]; + onInit() { + this.props.count = 999; + this.onclick = () => --this.props.count; + attachEffect( + this.props.count, + (count) => console.log(count) + ); + } + + afterViewInit(){ + attachEffect(this.props.count, (count) => console.log(count + 100)); + } + + get template() { + return ``; + } +} + +customElements.define("my-decrement", Decrease); diff --git a/attach-effect/index.html b/examples/attach-effect/index.html similarity index 65% rename from attach-effect/index.html rename to examples/attach-effect/index.html index 0b077eb..63ec0a0 100644 --- a/attach-effect/index.html +++ b/examples/attach-effect/index.html @@ -4,10 +4,12 @@ WC demo - + +

Attach Effect Test

+