@e280/sly 0.2.3 → 0.2.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/s/base/element.ts +5 -2
- package/s/base/types.ts +1 -1
- package/s/base/use.ts +5 -5
- package/s/demo/views/demo.ts +5 -0
- package/s/demo/views/mounting.ts +36 -0
- package/s/view/utils/parts/capsule.ts +9 -2
- package/x/base/element.js +4 -1
- package/x/base/element.js.map +1 -1
- package/x/base/types.d.ts +1 -1
- package/x/base/use.d.ts +1 -1
- package/x/base/use.js +4 -4
- package/x/base/use.js.map +1 -1
- package/x/demo/demo.bundle.min.js +17 -12
- package/x/demo/demo.bundle.min.js.map +4 -4
- package/x/demo/views/counter.d.ts +1 -0
- package/x/demo/views/demo.js +4 -0
- package/x/demo/views/demo.js.map +1 -1
- package/x/demo/views/mounting.d.ts +3 -0
- package/x/demo/views/mounting.js +28 -0
- package/x/demo/views/mounting.js.map +1 -0
- package/x/index.html +2 -2
- package/x/view/utils/parts/capsule.js +8 -2
- package/x/view/utils/parts/capsule.js.map +1 -1
|
@@ -10,6 +10,7 @@ declare const CounterComponent_base: import("../../index.js").ComponentClass<{
|
|
|
10
10
|
"__#private@#mountCount": number;
|
|
11
11
|
"__#private@#reactor": import("../../base/utils/reactor.js").Reactor;
|
|
12
12
|
"__#private@#attrWatcher": import("../../base/utils/attr-watcher.js").AttrWatcher;
|
|
13
|
+
"__#private@#part"?: import("lit-html").RootPart;
|
|
13
14
|
createShadow(): ShadowRoot;
|
|
14
15
|
render(_use: import("../../index.js").Use): import("../../index.js").Content;
|
|
15
16
|
updateNow: () => void;
|
package/x/demo/views/demo.js
CHANGED
|
@@ -2,15 +2,19 @@ import { css, html } from "lit";
|
|
|
2
2
|
import { view } from "../../view/view.js";
|
|
3
3
|
import { CounterView } from "./counter.js";
|
|
4
4
|
import { LoadersView } from "./loaders.js";
|
|
5
|
+
import { MountingTest } from "./mounting.js";
|
|
5
6
|
import { cssReset } from "../../base/css-reset.js";
|
|
6
7
|
export class DemoComponent extends (view.component(use => {
|
|
7
8
|
use.name("demo");
|
|
8
9
|
use.styles(cssReset, styles);
|
|
9
10
|
return html `
|
|
11
|
+
${MountingTest()}
|
|
12
|
+
|
|
10
13
|
${CounterView
|
|
11
14
|
.props(768, 3)
|
|
12
15
|
.children("view")
|
|
13
16
|
.render()}
|
|
17
|
+
|
|
14
18
|
${LoadersView()}
|
|
15
19
|
`;
|
|
16
20
|
})) {
|
package/x/demo/views/demo.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"demo.js","sourceRoot":"","sources":["../../../s/demo/views/demo.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,GAAG,EAAE,IAAI,EAAC,MAAM,KAAK,CAAA;AAE7B,OAAO,EAAC,IAAI,EAAC,MAAM,oBAAoB,CAAA;AACvC,OAAO,EAAC,WAAW,EAAC,MAAM,cAAc,CAAA;AACxC,OAAO,EAAC,WAAW,EAAC,MAAM,cAAc,CAAA;AACxC,OAAO,EAAC,QAAQ,EAAC,MAAM,yBAAyB,CAAA;AAEhD,MAAM,OAAO,aAAc,SAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,EAAE;IACxD,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;IAChB,GAAG,CAAC,MAAM,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAA;
|
|
1
|
+
{"version":3,"file":"demo.js","sourceRoot":"","sources":["../../../s/demo/views/demo.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,GAAG,EAAE,IAAI,EAAC,MAAM,KAAK,CAAA;AAE7B,OAAO,EAAC,IAAI,EAAC,MAAM,oBAAoB,CAAA;AACvC,OAAO,EAAC,WAAW,EAAC,MAAM,cAAc,CAAA;AACxC,OAAO,EAAC,WAAW,EAAC,MAAM,cAAc,CAAA;AACxC,OAAO,EAAC,YAAY,EAAC,MAAM,eAAe,CAAA;AAC1C,OAAO,EAAC,QAAQ,EAAC,MAAM,yBAAyB,CAAA;AAEhD,MAAM,OAAO,aAAc,SAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,EAAE;IACxD,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;IAChB,GAAG,CAAC,MAAM,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAA;IAE5B,OAAO,IAAI,CAAA;IACR,YAAY,EAAE;;IAEd,WAAW;SACX,KAAK,CAAC,GAAG,EAAE,CAAC,CAAC;SACb,QAAQ,CAAC,MAAM,CAAC;SAChB,MAAM,EAAE;;IAER,WAAW,EAAE;EACf,CAAA;AACF,CAAC,CAAC,CAAC;CAAG;AAEN,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;CAOjB,CAAA"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { html } from "lit";
|
|
2
|
+
import { cycle, nap } from "@e280/stz";
|
|
3
|
+
import { view } from "../../view/view.js";
|
|
4
|
+
export const MountingTest = view(use => () => {
|
|
5
|
+
const $toggle = use.signal(false);
|
|
6
|
+
use.mount(() => cycle(async () => {
|
|
7
|
+
await nap(1000);
|
|
8
|
+
$toggle(!$toggle());
|
|
9
|
+
}));
|
|
10
|
+
return $toggle()
|
|
11
|
+
? TestAlpha()
|
|
12
|
+
: html `bravo`;
|
|
13
|
+
});
|
|
14
|
+
export const TestAlpha = view(() => () => {
|
|
15
|
+
return html `
|
|
16
|
+
<span>${TestCharlie()}</span>
|
|
17
|
+
`;
|
|
18
|
+
});
|
|
19
|
+
export const TestCharlie = view(use => () => {
|
|
20
|
+
use.mount(() => {
|
|
21
|
+
// console.log("mount")
|
|
22
|
+
return () => {
|
|
23
|
+
// console.log("unmount")
|
|
24
|
+
};
|
|
25
|
+
});
|
|
26
|
+
return html `charlie`;
|
|
27
|
+
});
|
|
28
|
+
//# sourceMappingURL=mounting.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"mounting.js","sourceRoot":"","sources":["../../../s/demo/views/mounting.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAA;AACxB,OAAO,EAAC,KAAK,EAAE,GAAG,EAAC,MAAM,WAAW,CAAA;AACpC,OAAO,EAAC,IAAI,EAAC,MAAM,oBAAoB,CAAA;AAEvC,MAAM,CAAC,MAAM,YAAY,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,EAAE;IAC5C,MAAM,OAAO,GAAG,GAAG,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;IAEjC,GAAG,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,KAAK,IAAG,EAAE;QAC/B,MAAM,GAAG,CAAC,IAAI,CAAC,CAAA;QACf,OAAO,CAAC,CAAC,OAAO,EAAE,CAAC,CAAA;IACpB,CAAC,CAAC,CAAC,CAAA;IAEH,OAAO,OAAO,EAAE;QACf,CAAC,CAAC,SAAS,EAAE;QACb,CAAC,CAAC,IAAI,CAAA,OAAO,CAAA;AACf,CAAC,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,GAAG,EAAE;IACxC,OAAO,IAAI,CAAA;UACF,WAAW,EAAE;EACrB,CAAA;AACF,CAAC,CAAC,CAAA;AAGF,MAAM,CAAC,MAAM,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,EAAE;IAC3C,GAAG,CAAC,KAAK,CAAC,GAAG,EAAE;QACd,uBAAuB;QACvB,OAAO,GAAG,EAAE;YACX,yBAAyB;QAC1B,CAAC,CAAA;IACF,CAAC,CAAC,CAAA;IAEF,OAAO,IAAI,CAAA,SAAS,CAAA;AACrB,CAAC,CAAC,CAAA"}
|
package/x/index.html
CHANGED
|
@@ -111,7 +111,7 @@ body {
|
|
|
111
111
|
}
|
|
112
112
|
|
|
113
113
|
</style>
|
|
114
|
-
<script type=module src="demo/demo.bundle.min.js?v=
|
|
114
|
+
<script type=module src="demo/demo.bundle.min.js?v=500b10b90ec1"></script>
|
|
115
115
|
<link rel="icon" href="assets/favicon.png?v=4dc161ed79b3"/>
|
|
116
116
|
|
|
117
117
|
<meta name="theme-color" content="#95ff7b">
|
|
@@ -131,7 +131,7 @@ body {
|
|
|
131
131
|
<img class=icon alt="" src="/assets/favicon.png"/>
|
|
132
132
|
<h1>sly testing page</h1>
|
|
133
133
|
<p><a href="https://github.com/e280/sly">github.com/e280/sly</a></p>
|
|
134
|
-
<p class=lil>v0.2.
|
|
134
|
+
<p class=lil>v0.2.5</p>
|
|
135
135
|
|
|
136
136
|
<fastcount-element></fastcount-element>
|
|
137
137
|
<counter-component start=280 step=2>component</counter-component>
|
|
@@ -14,6 +14,8 @@ export class ViewCapsule {
|
|
|
14
14
|
#shadow;
|
|
15
15
|
#context;
|
|
16
16
|
#attrWatcher;
|
|
17
|
+
#partShadow;
|
|
18
|
+
#partElement;
|
|
17
19
|
constructor(host, viewFn, settings) {
|
|
18
20
|
this.viewFn = viewFn;
|
|
19
21
|
this.settings = settings;
|
|
@@ -31,13 +33,15 @@ export class ViewCapsule {
|
|
|
31
33
|
this.#use[_wrap](() => {
|
|
32
34
|
const content = this.#reactor.effect(() => this.viewFn(this.#use)(...this.#context.props), () => this.#renderDebounced());
|
|
33
35
|
attrSet.entries(this.#element, this.#context.attrs);
|
|
34
|
-
dom.render(this.#shadow, content);
|
|
35
|
-
dom.render(this.#element, this.#context.children);
|
|
36
|
+
this.#partShadow = dom.render(this.#shadow, content);
|
|
37
|
+
this.#partElement = dom.render(this.#element, this.#context.children);
|
|
36
38
|
this.#attrWatcher.start();
|
|
37
39
|
});
|
|
38
40
|
};
|
|
39
41
|
#renderDebounced = debounce(0, this.#renderNow);
|
|
40
42
|
disconnected() {
|
|
43
|
+
this.#partShadow?.setConnected(false);
|
|
44
|
+
this.#partElement?.setConnected(false);
|
|
41
45
|
this.#use[_disconnect]();
|
|
42
46
|
this.#reactor.clear();
|
|
43
47
|
this.#attrWatcher.stop();
|
|
@@ -45,6 +49,8 @@ export class ViewCapsule {
|
|
|
45
49
|
reconnected() {
|
|
46
50
|
this.#use[_reconnect]();
|
|
47
51
|
this.#attrWatcher.start();
|
|
52
|
+
this.#partShadow?.setConnected(true);
|
|
53
|
+
this.#partElement?.setConnected(true);
|
|
48
54
|
}
|
|
49
55
|
}
|
|
50
56
|
//# sourceMappingURL=capsule.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"capsule.js","sourceRoot":"","sources":["../../../../s/view/utils/parts/capsule.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"capsule.js","sourceRoot":"","sources":["../../../../s/view/utils/parts/capsule.ts"],"names":[],"mappings":"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"}
|