@joist/templating 4.2.4-next.9 → 4.2.4
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/LICENSE +2 -2
- package/package.json +1 -1
- package/src/lib/define.ts +26 -6
- package/src/lib/elements/async.element.test.ts +37 -1
- package/src/lib/elements/async.element.ts +12 -8
- package/src/lib/elements/bind.element.test.ts +60 -5
- package/src/lib/elements/bind.element.ts +30 -19
- package/src/lib/elements/for.element.test.ts +54 -9
- package/src/lib/elements/for.element.ts +91 -41
- package/src/lib/elements/if.element.test.ts +314 -260
- package/src/lib/elements/if.element.ts +40 -17
- package/src/lib/elements/scope.element.test.ts +1 -2
- package/src/lib/elements/scope.element.ts +0 -7
- package/src/lib/elements/value.element.test.ts +33 -1
- package/src/lib/elements/value.element.ts +13 -8
- package/src/lib/events.ts +1 -1
- package/target/lib/define.d.ts +16 -6
- package/target/lib/define.js +13 -6
- package/target/lib/define.js.map +1 -1
- package/target/lib/elements/async.element.d.ts +2 -6
- package/target/lib/elements/async.element.js +15 -3
- package/target/lib/elements/async.element.js.map +1 -1
- package/target/lib/elements/async.element.test.d.ts +1 -1
- package/target/lib/elements/async.element.test.js +30 -1
- package/target/lib/elements/async.element.test.js.map +1 -1
- package/target/lib/elements/bind.element.d.ts +2 -6
- package/target/lib/elements/bind.element.js +34 -16
- package/target/lib/elements/bind.element.js.map +1 -1
- package/target/lib/elements/bind.element.test.d.ts +1 -1
- package/target/lib/elements/bind.element.test.js +50 -5
- package/target/lib/elements/bind.element.test.js.map +1 -1
- package/target/lib/elements/for.element.d.ts +3 -12
- package/target/lib/elements/for.element.js +84 -57
- package/target/lib/elements/for.element.js.map +1 -1
- package/target/lib/elements/for.element.test.d.ts +1 -2
- package/target/lib/elements/for.element.test.js +41 -5
- package/target/lib/elements/for.element.test.js.map +1 -1
- package/target/lib/elements/if.element.d.ts +3 -6
- package/target/lib/elements/if.element.js +42 -10
- package/target/lib/elements/if.element.js.map +1 -1
- package/target/lib/elements/if.element.test.d.ts +1 -1
- package/target/lib/elements/if.element.test.js +273 -1
- package/target/lib/elements/if.element.test.js.map +1 -1
- package/target/lib/elements/scope.element.d.ts +0 -5
- package/target/lib/elements/scope.element.js +0 -1
- package/target/lib/elements/scope.element.js.map +1 -1
- package/target/lib/elements/scope.element.test.d.ts +1 -2
- package/target/lib/elements/scope.element.test.js +1 -2
- package/target/lib/elements/scope.element.test.js.map +1 -1
- package/target/lib/elements/value.element.d.ts +2 -6
- package/target/lib/elements/value.element.js +15 -3
- package/target/lib/elements/value.element.js.map +1 -1
- package/target/lib/elements/value.element.test.d.ts +1 -1
- package/target/lib/elements/value.element.test.js +26 -1
- package/target/lib/elements/value.element.test.js.map +1 -1
- package/target/lib/events.d.ts +1 -1
|
@@ -3,24 +3,27 @@ import { attr, element, queryAll, css, html } from "@joist/element";
|
|
|
3
3
|
import { JoistValueEvent } from "../events.js";
|
|
4
4
|
import { JExpression } from "../expression.js";
|
|
5
5
|
|
|
6
|
-
declare global {
|
|
7
|
-
interface HTMLElementTagNameMap {
|
|
8
|
-
"j-if": JoistIfElement;
|
|
9
|
-
}
|
|
10
|
-
}
|
|
11
|
-
|
|
12
6
|
@element({
|
|
13
|
-
tagName: "j-if",
|
|
14
7
|
// prettier-ignore
|
|
15
|
-
shadowDom: [css`:host{display: contents
|
|
8
|
+
shadowDom: [css`:host{display: contents}`, html`<slot></slot>`],
|
|
16
9
|
})
|
|
17
10
|
export class JoistIfElement extends HTMLElement {
|
|
18
11
|
@attr()
|
|
19
12
|
accessor bind = "";
|
|
20
13
|
|
|
14
|
+
@attr()
|
|
15
|
+
accessor target = "";
|
|
16
|
+
|
|
17
|
+
@attr({
|
|
18
|
+
name: "depends-on",
|
|
19
|
+
})
|
|
20
|
+
accessor dependsOn = "";
|
|
21
|
+
|
|
21
22
|
#templates = queryAll<HTMLTemplateElement>("template", this);
|
|
23
|
+
#shouldShowIf: boolean | null = null;
|
|
24
|
+
#target: Element = this;
|
|
22
25
|
|
|
23
|
-
connectedCallback(): void {
|
|
26
|
+
async connectedCallback(): Promise<void> {
|
|
24
27
|
const templates = Array.from(this.#templates());
|
|
25
28
|
|
|
26
29
|
if (templates.length === 0) {
|
|
@@ -40,11 +43,24 @@ export class JoistIfElement extends HTMLElement {
|
|
|
40
43
|
[templates[0], templates[1]] = [templates[1], templates[0]];
|
|
41
44
|
}
|
|
42
45
|
|
|
43
|
-
// make sure there are no other nodes after the template
|
|
44
|
-
this.#clean();
|
|
45
|
-
|
|
46
46
|
const token = new JExpression(this.bind);
|
|
47
47
|
|
|
48
|
+
const root = this.getRootNode() as Document | ShadowRoot;
|
|
49
|
+
|
|
50
|
+
if (this.target) {
|
|
51
|
+
const result = root.querySelector(this.target);
|
|
52
|
+
|
|
53
|
+
if (result) {
|
|
54
|
+
this.#target = result;
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
if (this.dependsOn) {
|
|
59
|
+
await Promise.all(
|
|
60
|
+
this.dependsOn.split(",").map((tag) => window.customElements.whenDefined(tag)),
|
|
61
|
+
);
|
|
62
|
+
}
|
|
63
|
+
|
|
48
64
|
this.dispatchEvent(
|
|
49
65
|
new JoistValueEvent(token, ({ newValue, oldValue, firstChange }) => {
|
|
50
66
|
if (firstChange || newValue !== oldValue) {
|
|
@@ -55,23 +71,30 @@ export class JoistIfElement extends HTMLElement {
|
|
|
55
71
|
}
|
|
56
72
|
|
|
57
73
|
apply(value: unknown, isNegative: boolean): void {
|
|
74
|
+
const shouldShowIf = isNegative ? !value : !!value;
|
|
75
|
+
|
|
76
|
+
if (shouldShowIf === this.#shouldShowIf) {
|
|
77
|
+
return;
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
this.#shouldShowIf = shouldShowIf;
|
|
81
|
+
|
|
58
82
|
this.#clean();
|
|
59
83
|
|
|
60
84
|
const templates = this.#templates();
|
|
61
85
|
|
|
62
|
-
const
|
|
63
|
-
const templateToUse = shouldShowIf ? templates[0] : templates[1];
|
|
86
|
+
const templateToUse = this.#shouldShowIf ? templates[0] : templates[1];
|
|
64
87
|
|
|
65
88
|
if (templateToUse) {
|
|
66
89
|
const content = document.importNode(templateToUse.content, true);
|
|
67
90
|
|
|
68
|
-
this.
|
|
91
|
+
this.#target.append(content);
|
|
69
92
|
}
|
|
70
93
|
}
|
|
71
94
|
|
|
72
95
|
#clean(): void {
|
|
73
|
-
while (!(this.lastChild instanceof HTMLTemplateElement)) {
|
|
74
|
-
this.lastChild
|
|
96
|
+
while (this.#target.lastChild && !(this.#target.lastChild instanceof HTMLTemplateElement)) {
|
|
97
|
+
this.#target.lastChild.remove();
|
|
75
98
|
}
|
|
76
99
|
}
|
|
77
100
|
|
|
@@ -2,14 +2,7 @@ import { element, css, html } from "@joist/element";
|
|
|
2
2
|
|
|
3
3
|
import { bind } from "../bind.js";
|
|
4
4
|
|
|
5
|
-
declare global {
|
|
6
|
-
interface HTMLElementTagNameMap {
|
|
7
|
-
"j-scope": JoistScopeElement;
|
|
8
|
-
}
|
|
9
|
-
}
|
|
10
|
-
|
|
11
5
|
@element({
|
|
12
|
-
tagName: "j-scope",
|
|
13
6
|
// prettier-ignore
|
|
14
7
|
shadowDom: [css`:host{display: contents;}`, html`<slot></slot>`],
|
|
15
8
|
})
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import "
|
|
1
|
+
import "../define.js";
|
|
2
2
|
|
|
3
3
|
import { fixtureSync, html } from "@open-wc/testing";
|
|
4
4
|
import { assert } from "chai";
|
|
@@ -46,3 +46,35 @@ it("should not write undefined values to textContent", () => {
|
|
|
46
46
|
|
|
47
47
|
assert.equal(element.textContent?.trim(), "Hello World");
|
|
48
48
|
});
|
|
49
|
+
|
|
50
|
+
it("should wait for depends-on before dispatching events", async () => {
|
|
51
|
+
let eventDispatched = false;
|
|
52
|
+
|
|
53
|
+
customElements.define("dependency-1", class extends HTMLElement {});
|
|
54
|
+
customElements.define("dependency-2", class extends HTMLElement {});
|
|
55
|
+
|
|
56
|
+
fixtureSync(html`
|
|
57
|
+
<div
|
|
58
|
+
@joist::value=${(e: JoistValueEvent) => {
|
|
59
|
+
if (e.expression.bindTo === "test") {
|
|
60
|
+
eventDispatched = true;
|
|
61
|
+
e.update({ oldValue: null, newValue: "Hello World" });
|
|
62
|
+
}
|
|
63
|
+
}}
|
|
64
|
+
>
|
|
65
|
+
<j-val bind="test" depends-on="dependency-1,dependency-2"></j-val>
|
|
66
|
+
</div>
|
|
67
|
+
`);
|
|
68
|
+
|
|
69
|
+
// Initially, no event should be dispatched
|
|
70
|
+
assert.isFalse(eventDispatched);
|
|
71
|
+
|
|
72
|
+
// Wait for the custom elements to be defined
|
|
73
|
+
await Promise.all([
|
|
74
|
+
customElements.whenDefined("dependency-1"),
|
|
75
|
+
customElements.whenDefined("dependency-2"),
|
|
76
|
+
]);
|
|
77
|
+
|
|
78
|
+
// Now the event should be dispatched
|
|
79
|
+
assert.isTrue(eventDispatched);
|
|
80
|
+
});
|
|
@@ -1,15 +1,9 @@
|
|
|
1
1
|
import { attr, element, css, html } from "@joist/element";
|
|
2
|
+
|
|
2
3
|
import { JoistValueEvent } from "../events.js";
|
|
3
4
|
import { JExpression } from "../expression.js";
|
|
4
5
|
|
|
5
|
-
declare global {
|
|
6
|
-
interface HTMLElementTagNameMap {
|
|
7
|
-
"j-val": JoistValueElement;
|
|
8
|
-
}
|
|
9
|
-
}
|
|
10
|
-
|
|
11
6
|
@element({
|
|
12
|
-
tagName: "j-val",
|
|
13
7
|
// prettier-ignore
|
|
14
8
|
shadowDom: [css`:host{display: contents;}`, html`<slot></slot>`],
|
|
15
9
|
})
|
|
@@ -17,9 +11,20 @@ export class JoistValueElement extends HTMLElement {
|
|
|
17
11
|
@attr()
|
|
18
12
|
accessor bind = "";
|
|
19
13
|
|
|
20
|
-
|
|
14
|
+
@attr({
|
|
15
|
+
name: "depends-on",
|
|
16
|
+
})
|
|
17
|
+
accessor dependsOn = "";
|
|
18
|
+
|
|
19
|
+
async connectedCallback(): Promise<void> {
|
|
21
20
|
const token = new JExpression(this.bind);
|
|
22
21
|
|
|
22
|
+
if (this.dependsOn) {
|
|
23
|
+
await Promise.all(
|
|
24
|
+
this.dependsOn.split(",").map((tag) => window.customElements.whenDefined(tag)),
|
|
25
|
+
);
|
|
26
|
+
}
|
|
27
|
+
|
|
23
28
|
this.dispatchEvent(
|
|
24
29
|
new JoistValueEvent(token, (value) => {
|
|
25
30
|
const valueToWrite = token.evaluate(value.newValue);
|
package/src/lib/events.ts
CHANGED
package/target/lib/define.d.ts
CHANGED
|
@@ -1,6 +1,16 @@
|
|
|
1
|
-
import "./elements/async.element.js";
|
|
2
|
-
import "./elements/for.element.js";
|
|
3
|
-
import "./elements/if.element.js";
|
|
4
|
-
import "./elements/bind.element.js";
|
|
5
|
-
import "./elements/value.element.js";
|
|
6
|
-
import "./elements/scope.element.js";
|
|
1
|
+
import { JoistAsyncElement } from "./elements/async.element.js";
|
|
2
|
+
import { JoistForElement } from "./elements/for.element.js";
|
|
3
|
+
import { JoistIfElement } from "./elements/if.element.js";
|
|
4
|
+
import { JoistBindElement } from "./elements/bind.element.js";
|
|
5
|
+
import { JoistValueElement } from "./elements/value.element.js";
|
|
6
|
+
import { JoistScopeElement } from "./elements/scope.element.js";
|
|
7
|
+
declare global {
|
|
8
|
+
interface HTMLElementTagNameMap {
|
|
9
|
+
"j-async": JoistAsyncElement;
|
|
10
|
+
"j-for": JoistForElement;
|
|
11
|
+
"j-if": JoistIfElement;
|
|
12
|
+
"j-bind": JoistBindElement;
|
|
13
|
+
"j-val": JoistValueElement;
|
|
14
|
+
"j-scope": JoistScopeElement;
|
|
15
|
+
}
|
|
16
|
+
}
|
package/target/lib/define.js
CHANGED
|
@@ -1,7 +1,14 @@
|
|
|
1
|
-
import "
|
|
2
|
-
import "./elements/
|
|
3
|
-
import "./elements/
|
|
4
|
-
import "./elements/
|
|
5
|
-
import "./elements/
|
|
6
|
-
import "./elements/
|
|
1
|
+
import { define } from "@joist/element/define.js";
|
|
2
|
+
import { JoistAsyncElement } from "./elements/async.element.js";
|
|
3
|
+
import { JoistForElement } from "./elements/for.element.js";
|
|
4
|
+
import { JoistIfElement } from "./elements/if.element.js";
|
|
5
|
+
import { JoistBindElement } from "./elements/bind.element.js";
|
|
6
|
+
import { JoistValueElement } from "./elements/value.element.js";
|
|
7
|
+
import { JoistScopeElement } from "./elements/scope.element.js";
|
|
8
|
+
define({ tagName: "j-async" }, JoistAsyncElement);
|
|
9
|
+
define({ tagName: "j-for" }, JoistForElement);
|
|
10
|
+
define({ tagName: "j-if" }, JoistIfElement);
|
|
11
|
+
define({ tagName: "j-bind" }, JoistBindElement);
|
|
12
|
+
define({ tagName: "j-val" }, JoistValueElement);
|
|
13
|
+
define({ tagName: "j-scope" }, JoistScopeElement);
|
|
7
14
|
//# sourceMappingURL=define.js.map
|
package/target/lib/define.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"define.js","sourceRoot":"","sources":["../../src/lib/define.ts"],"names":[],"mappings":"AAAA,OAAO,6BAA6B,CAAC;
|
|
1
|
+
{"version":3,"file":"define.js","sourceRoot":"","sources":["../../src/lib/define.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAChE,OAAO,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAC5D,OAAO,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAC1D,OAAO,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAC9D,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAChE,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAahE,MAAM,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,iBAAiB,CAAC,CAAC;AAClD,MAAM,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE,eAAe,CAAC,CAAC;AAC9C,MAAM,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,cAAc,CAAC,CAAC;AAC5C,MAAM,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,gBAAgB,CAAC,CAAC;AAChD,MAAM,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE,iBAAiB,CAAC,CAAC;AAChD,MAAM,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,iBAAiB,CAAC,CAAC"}
|
|
@@ -1,8 +1,3 @@
|
|
|
1
|
-
declare global {
|
|
2
|
-
interface HTMLElementTagNameMap {
|
|
3
|
-
"j-async": JoistAsyncElement;
|
|
4
|
-
}
|
|
5
|
-
}
|
|
6
1
|
export type AsyncState<T = unknown, E = unknown> = {
|
|
7
2
|
status: "loading" | "error" | "success";
|
|
8
3
|
data?: T;
|
|
@@ -11,7 +6,8 @@ export type AsyncState<T = unknown, E = unknown> = {
|
|
|
11
6
|
export declare class JoistAsyncElement extends HTMLElement {
|
|
12
7
|
#private;
|
|
13
8
|
accessor bind: string;
|
|
9
|
+
accessor dependsOn: string;
|
|
14
10
|
accessor state: AsyncState | null;
|
|
15
|
-
connectedCallback(): void
|
|
11
|
+
connectedCallback(): Promise<void>;
|
|
16
12
|
disconnectedCallback(): void;
|
|
17
13
|
}
|
|
@@ -5,7 +5,6 @@ import { JoistValueEvent } from "../events.js";
|
|
|
5
5
|
import { JExpression } from "../expression.js";
|
|
6
6
|
let JoistAsyncElement = (() => {
|
|
7
7
|
let _classDecorators = [element({
|
|
8
|
-
tagName: "j-async",
|
|
9
8
|
shadowDom: [css `:host{display: contents;}`, html `<slot></slot>`],
|
|
10
9
|
})];
|
|
11
10
|
let _classDescriptor;
|
|
@@ -15,6 +14,9 @@ let JoistAsyncElement = (() => {
|
|
|
15
14
|
let _bind_decorators;
|
|
16
15
|
let _bind_initializers = [];
|
|
17
16
|
let _bind_extraInitializers = [];
|
|
17
|
+
let _dependsOn_decorators;
|
|
18
|
+
let _dependsOn_initializers = [];
|
|
19
|
+
let _dependsOn_extraInitializers = [];
|
|
18
20
|
let _state_decorators;
|
|
19
21
|
let _state_initializers = [];
|
|
20
22
|
let _state_extraInitializers = [];
|
|
@@ -23,8 +25,12 @@ let JoistAsyncElement = (() => {
|
|
|
23
25
|
static {
|
|
24
26
|
const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
|
|
25
27
|
_bind_decorators = [attr()];
|
|
28
|
+
_dependsOn_decorators = [attr({
|
|
29
|
+
name: "depends-on",
|
|
30
|
+
})];
|
|
26
31
|
_state_decorators = [bind()];
|
|
27
32
|
__esDecorate(this, null, _bind_decorators, { kind: "accessor", name: "bind", static: false, private: false, access: { has: obj => "bind" in obj, get: obj => obj.bind, set: (obj, value) => { obj.bind = value; } }, metadata: _metadata }, _bind_initializers, _bind_extraInitializers);
|
|
33
|
+
__esDecorate(this, null, _dependsOn_decorators, { kind: "accessor", name: "dependsOn", static: false, private: false, access: { has: obj => "dependsOn" in obj, get: obj => obj.dependsOn, set: (obj, value) => { obj.dependsOn = value; } }, metadata: _metadata }, _dependsOn_initializers, _dependsOn_extraInitializers);
|
|
28
34
|
__esDecorate(this, null, _state_decorators, { kind: "accessor", name: "state", static: false, private: false, access: { has: obj => "state" in obj, get: obj => obj.state, set: (obj, value) => { obj.state = value; } }, metadata: _metadata }, _state_initializers, _state_extraInitializers);
|
|
29
35
|
__esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
|
|
30
36
|
JoistAsyncElement = _classThis = _classDescriptor.value;
|
|
@@ -34,7 +40,10 @@ let JoistAsyncElement = (() => {
|
|
|
34
40
|
#bind_accessor_storage = __runInitializers(this, _bind_initializers, "");
|
|
35
41
|
get bind() { return this.#bind_accessor_storage; }
|
|
36
42
|
set bind(value) { this.#bind_accessor_storage = value; }
|
|
37
|
-
#
|
|
43
|
+
#dependsOn_accessor_storage = (__runInitializers(this, _bind_extraInitializers), __runInitializers(this, _dependsOn_initializers, ""));
|
|
44
|
+
get dependsOn() { return this.#dependsOn_accessor_storage; }
|
|
45
|
+
set dependsOn(value) { this.#dependsOn_accessor_storage = value; }
|
|
46
|
+
#state_accessor_storage = (__runInitializers(this, _dependsOn_extraInitializers), __runInitializers(this, _state_initializers, null));
|
|
38
47
|
get state() { return this.#state_accessor_storage; }
|
|
39
48
|
set state(value) { this.#state_accessor_storage = value; }
|
|
40
49
|
#templates = (__runInitializers(this, _state_extraInitializers), queryAll("template", this));
|
|
@@ -44,7 +53,7 @@ let JoistAsyncElement = (() => {
|
|
|
44
53
|
error: undefined,
|
|
45
54
|
success: undefined,
|
|
46
55
|
};
|
|
47
|
-
connectedCallback() {
|
|
56
|
+
async connectedCallback() {
|
|
48
57
|
this.#clean();
|
|
49
58
|
const templates = Array.from(this.#templates());
|
|
50
59
|
this.#cachedTemplates = {
|
|
@@ -52,6 +61,9 @@ let JoistAsyncElement = (() => {
|
|
|
52
61
|
error: templates.find((t) => t.hasAttribute("error")),
|
|
53
62
|
success: templates.find((t) => t.hasAttribute("success")),
|
|
54
63
|
};
|
|
64
|
+
if (this.dependsOn) {
|
|
65
|
+
await Promise.all(this.dependsOn.split(",").map((tag) => window.customElements.whenDefined(tag)));
|
|
66
|
+
}
|
|
55
67
|
const token = new JExpression(this.bind);
|
|
56
68
|
this.dispatchEvent(new JoistValueEvent(token, ({ newValue, oldValue }) => {
|
|
57
69
|
if (newValue !== oldValue) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"async.element.js","sourceRoot":"","sources":["../../../src/lib/elements/async.element.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AAEpE,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AAClC,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAC/C,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;
|
|
1
|
+
{"version":3,"file":"async.element.js","sourceRoot":"","sources":["../../../src/lib/elements/async.element.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import "
|
|
1
|
+
import "../define.js";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import "
|
|
1
|
+
import "../define.js";
|
|
2
2
|
import { fixtureSync, html } from "@open-wc/testing";
|
|
3
3
|
import { assert } from "chai";
|
|
4
4
|
it("should show loading template when promise is pending", async () => {
|
|
@@ -148,4 +148,33 @@ it("should handle AsyncState transitions", () => {
|
|
|
148
148
|
}, 150);
|
|
149
149
|
});
|
|
150
150
|
});
|
|
151
|
+
it("should wait for depends-on before dispatching events", async () => {
|
|
152
|
+
let eventDispatched = false;
|
|
153
|
+
customElements.define("dependency-1", class extends HTMLElement {
|
|
154
|
+
});
|
|
155
|
+
customElements.define("dependency-2", class extends HTMLElement {
|
|
156
|
+
});
|
|
157
|
+
fixtureSync(html `
|
|
158
|
+
<div
|
|
159
|
+
@joist::value=${(e) => {
|
|
160
|
+
if (e.expression.bindTo === "test") {
|
|
161
|
+
eventDispatched = true;
|
|
162
|
+
e.update({ oldValue: null, newValue: Promise.resolve("data") });
|
|
163
|
+
}
|
|
164
|
+
}}
|
|
165
|
+
>
|
|
166
|
+
<j-async bind="test" depends-on="dependency-1,dependency-2">
|
|
167
|
+
<template loading>Loading...</template>
|
|
168
|
+
<template success>Success!</template>
|
|
169
|
+
<template error>Error!</template>
|
|
170
|
+
</j-async>
|
|
171
|
+
</div>
|
|
172
|
+
`);
|
|
173
|
+
assert.isFalse(eventDispatched);
|
|
174
|
+
await Promise.all([
|
|
175
|
+
customElements.whenDefined("dependency-1"),
|
|
176
|
+
customElements.whenDefined("dependency-2"),
|
|
177
|
+
]);
|
|
178
|
+
assert.isTrue(eventDispatched);
|
|
179
|
+
});
|
|
151
180
|
//# sourceMappingURL=async.element.test.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"async.element.test.js","sourceRoot":"","sources":["../../../src/lib/elements/async.element.test.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"async.element.test.js","sourceRoot":"","sources":["../../../src/lib/elements/async.element.test.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,9 +1,4 @@
|
|
|
1
1
|
import { JExpression } from "../expression.js";
|
|
2
|
-
declare global {
|
|
3
|
-
interface HTMLElementTagNameMap {
|
|
4
|
-
"j-bind": JoistBindElement;
|
|
5
|
-
}
|
|
6
|
-
}
|
|
7
2
|
export declare class JAttrToken extends JExpression {
|
|
8
3
|
mapTo: string;
|
|
9
4
|
constructor(binding: string);
|
|
@@ -13,5 +8,6 @@ export declare class JoistBindElement extends HTMLElement {
|
|
|
13
8
|
accessor props: string;
|
|
14
9
|
accessor attrs: string;
|
|
15
10
|
accessor target: string;
|
|
16
|
-
|
|
11
|
+
accessor dependsOn: string;
|
|
12
|
+
connectedCallback(): Promise<void>;
|
|
17
13
|
}
|
|
@@ -12,7 +12,6 @@ export class JAttrToken extends JExpression {
|
|
|
12
12
|
}
|
|
13
13
|
let JoistBindElement = (() => {
|
|
14
14
|
let _classDecorators = [element({
|
|
15
|
-
tagName: "j-bind",
|
|
16
15
|
shadowDom: [css `:host{display: contents;}`, html `<slot></slot>`],
|
|
17
16
|
})];
|
|
18
17
|
let _classDescriptor;
|
|
@@ -28,6 +27,9 @@ let JoistBindElement = (() => {
|
|
|
28
27
|
let _target_decorators;
|
|
29
28
|
let _target_initializers = [];
|
|
30
29
|
let _target_extraInitializers = [];
|
|
30
|
+
let _dependsOn_decorators;
|
|
31
|
+
let _dependsOn_initializers = [];
|
|
32
|
+
let _dependsOn_extraInitializers = [];
|
|
31
33
|
var JoistBindElement = class extends _classSuper {
|
|
32
34
|
static { _classThis = this; }
|
|
33
35
|
static {
|
|
@@ -35,9 +37,13 @@ let JoistBindElement = (() => {
|
|
|
35
37
|
_props_decorators = [attr()];
|
|
36
38
|
_attrs_decorators = [attr()];
|
|
37
39
|
_target_decorators = [attr()];
|
|
40
|
+
_dependsOn_decorators = [attr({
|
|
41
|
+
name: "depends-on",
|
|
42
|
+
})];
|
|
38
43
|
__esDecorate(this, null, _props_decorators, { kind: "accessor", name: "props", static: false, private: false, access: { has: obj => "props" in obj, get: obj => obj.props, set: (obj, value) => { obj.props = value; } }, metadata: _metadata }, _props_initializers, _props_extraInitializers);
|
|
39
44
|
__esDecorate(this, null, _attrs_decorators, { kind: "accessor", name: "attrs", static: false, private: false, access: { has: obj => "attrs" in obj, get: obj => obj.attrs, set: (obj, value) => { obj.attrs = value; } }, metadata: _metadata }, _attrs_initializers, _attrs_extraInitializers);
|
|
40
45
|
__esDecorate(this, null, _target_decorators, { kind: "accessor", name: "target", static: false, private: false, access: { has: obj => "target" in obj, get: obj => obj.target, set: (obj, value) => { obj.target = value; } }, metadata: _metadata }, _target_initializers, _target_extraInitializers);
|
|
46
|
+
__esDecorate(this, null, _dependsOn_decorators, { kind: "accessor", name: "dependsOn", static: false, private: false, access: { has: obj => "dependsOn" in obj, get: obj => obj.dependsOn, set: (obj, value) => { obj.dependsOn = value; } }, metadata: _metadata }, _dependsOn_initializers, _dependsOn_extraInitializers);
|
|
41
47
|
__esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
|
|
42
48
|
JoistBindElement = _classThis = _classDescriptor.value;
|
|
43
49
|
if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
|
|
@@ -52,34 +58,42 @@ let JoistBindElement = (() => {
|
|
|
52
58
|
#target_accessor_storage = (__runInitializers(this, _attrs_extraInitializers), __runInitializers(this, _target_initializers, ""));
|
|
53
59
|
get target() { return this.#target_accessor_storage; }
|
|
54
60
|
set target(value) { this.#target_accessor_storage = value; }
|
|
55
|
-
|
|
61
|
+
#dependsOn_accessor_storage = (__runInitializers(this, _target_extraInitializers), __runInitializers(this, _dependsOn_initializers, ""));
|
|
62
|
+
get dependsOn() { return this.#dependsOn_accessor_storage; }
|
|
63
|
+
set dependsOn(value) { this.#dependsOn_accessor_storage = value; }
|
|
64
|
+
async connectedCallback() {
|
|
56
65
|
const attrBindings = this.#parseBinding(this.attrs);
|
|
57
66
|
const propBindings = this.#parseBinding(this.props);
|
|
58
|
-
let
|
|
67
|
+
let children = this.children;
|
|
68
|
+
const root = this.getRootNode();
|
|
59
69
|
if (this.target) {
|
|
60
|
-
|
|
70
|
+
children = root.querySelectorAll(this.target);
|
|
61
71
|
}
|
|
62
|
-
if (
|
|
63
|
-
|
|
72
|
+
if (this.dependsOn) {
|
|
73
|
+
await Promise.all(this.dependsOn.split(",").map((tag) => window.customElements.whenDefined(tag)));
|
|
64
74
|
}
|
|
65
75
|
for (const attrValue of attrBindings) {
|
|
66
76
|
const token = new JAttrToken(attrValue);
|
|
67
77
|
this.#dispatch(token, (value) => {
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
78
|
+
for (const child of children) {
|
|
79
|
+
if (value === true) {
|
|
80
|
+
child.setAttribute(token.mapTo, "");
|
|
81
|
+
}
|
|
82
|
+
else if (value === false) {
|
|
83
|
+
child.removeAttribute(token.mapTo);
|
|
84
|
+
}
|
|
85
|
+
else {
|
|
86
|
+
child.setAttribute(token.mapTo, String(value));
|
|
87
|
+
}
|
|
76
88
|
}
|
|
77
89
|
});
|
|
78
90
|
}
|
|
79
91
|
for (const propValue of propBindings) {
|
|
80
92
|
const token = new JAttrToken(propValue);
|
|
81
93
|
this.#dispatch(token, (value) => {
|
|
82
|
-
|
|
94
|
+
for (const child of children) {
|
|
95
|
+
Reflect.set(child, token.mapTo, value);
|
|
96
|
+
}
|
|
83
97
|
});
|
|
84
98
|
}
|
|
85
99
|
}
|
|
@@ -95,6 +109,10 @@ let JoistBindElement = (() => {
|
|
|
95
109
|
return;
|
|
96
110
|
}
|
|
97
111
|
let valueToWrite = token.evaluate(newValue);
|
|
112
|
+
let oldWrittenValue = token.evaluate(oldValue);
|
|
113
|
+
if (oldWrittenValue === valueToWrite) {
|
|
114
|
+
return;
|
|
115
|
+
}
|
|
98
116
|
if (token.isNegated) {
|
|
99
117
|
valueToWrite = !valueToWrite;
|
|
100
118
|
}
|
|
@@ -103,7 +121,7 @@ let JoistBindElement = (() => {
|
|
|
103
121
|
}
|
|
104
122
|
constructor() {
|
|
105
123
|
super(...arguments);
|
|
106
|
-
__runInitializers(this,
|
|
124
|
+
__runInitializers(this, _dependsOn_extraInitializers);
|
|
107
125
|
}
|
|
108
126
|
};
|
|
109
127
|
return JoistBindElement = _classThis;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bind.element.js","sourceRoot":"","sources":["../../../src/lib/elements/bind.element.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AAE1D,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"bind.element.js","sourceRoot":"","sources":["../../../src/lib/elements/bind.element.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AAE1D,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAE/C,MAAM,OAAO,UAAW,SAAQ,WAAW;IACzC,KAAK,CAAS;IAEd,YAAY,OAAe;QACzB,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,GAAG,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QAE3C,KAAK,CAAC,MAAM,IAAI,KAAK,CAAC,CAAC;QAEvB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;IACrB,CAAC;CACF;IAMY,gBAAgB;4BAJ5B,OAAO,CAAC;YAEP,SAAS,EAAE,CAAC,GAAG,CAAA,2BAA2B,EAAE,IAAI,CAAA,eAAe,CAAC;SACjE,CAAC;;;;sBACoC,WAAW;;;;;;;;;;;;;gCAAnB,SAAQ,WAAW;;;;iCAC9C,IAAI,EAAE;iCAGN,IAAI,EAAE;kCAGN,IAAI,EAAE;qCAGN,IAAI,CAAC;oBACJ,IAAI,EAAE,YAAY;iBACnB,CAAC;YAVF,oKAAS,KAAK,6BAAL,KAAK,qFAAM;YAGpB,oKAAS,KAAK,6BAAL,KAAK,qFAAM;YAGpB,uKAAS,MAAM,6BAAN,MAAM,uFAAM;YAKrB,gLAAS,SAAS,6BAAT,SAAS,6FAAM;YAb1B,6KAyFC;;;YAzFY,uDAAgB;;QAE3B,uEAAiB,EAAE,EAAC;QAApB,IAAS,KAAK,2CAAM;QAApB,IAAS,KAAK,iDAAM;QAGpB,2HAAiB,EAAE,GAAC;QAApB,IAAS,KAAK,2CAAM;QAApB,IAAS,KAAK,iDAAM;QAGpB,6HAAkB,EAAE,GAAC;QAArB,IAAS,MAAM,4CAAM;QAArB,IAAS,MAAM,kDAAM;QAKrB,oIAAqB,EAAE,GAAC;QAAxB,IAAS,SAAS,+CAAM;QAAxB,IAAS,SAAS,qDAAM;QAExB,KAAK,CAAC,iBAAiB;YACrB,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;YACpD,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;YAEpD,IAAI,QAAQ,GAAsB,IAAI,CAAC,QAAQ,CAAC;YAEhD,MAAM,IAAI,GAAG,IAAI,CAAC,WAAW,EAA2B,CAAC;YAEzD,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;gBAChB,QAAQ,GAAG,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;YAChD,CAAC;YAED,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;gBACnB,MAAM,OAAO,CAAC,GAAG,CACf,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,MAAM,CAAC,cAAc,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC,CAC/E,CAAC;YACJ,CAAC;YAED,KAAK,MAAM,SAAS,IAAI,YAAY,EAAE,CAAC;gBACrC,MAAM,KAAK,GAAG,IAAI,UAAU,CAAC,SAAS,CAAC,CAAC;gBAExC,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE,EAAE;oBAC9B,KAAK,MAAM,KAAK,IAAI,QAAQ,EAAE,CAAC;wBAC7B,IAAI,KAAK,KAAK,IAAI,EAAE,CAAC;4BACnB,KAAK,CAAC,YAAY,CAAC,KAAK,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;wBACtC,CAAC;6BAAM,IAAI,KAAK,KAAK,KAAK,EAAE,CAAC;4BAC3B,KAAK,CAAC,eAAe,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;wBACrC,CAAC;6BAAM,CAAC;4BACN,KAAK,CAAC,YAAY,CAAC,KAAK,CAAC,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;wBACjD,CAAC;oBACH,CAAC;gBACH,CAAC,CAAC,CAAC;YACL,CAAC;YAED,KAAK,MAAM,SAAS,IAAI,YAAY,EAAE,CAAC;gBACrC,MAAM,KAAK,GAAG,IAAI,UAAU,CAAC,SAAS,CAAC,CAAC;gBAExC,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE,EAAE;oBAC9B,KAAK,MAAM,KAAK,IAAI,QAAQ,EAAE,CAAC;wBAC7B,OAAO,CAAC,GAAG,CAAC,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;oBACzC,CAAC;gBACH,CAAC,CAAC,CAAC;YACL,CAAC;QACH,CAAC;QAED,aAAa,CAAC,OAAe;YAC3B,OAAO,OAAO;iBACX,KAAK,CAAC,GAAG,CAAC;iBACV,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;iBACpB,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC;QACtB,CAAC;QAED,SAAS,CAAC,KAAkB,EAAE,KAA+B;YAC3D,IAAI,CAAC,aAAa,CAChB,IAAI,eAAe,CAAC,KAAK,EAAE,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,YAAY,EAAE,EAAE,EAAE;gBAClE,IAAI,QAAQ,KAAK,QAAQ,IAAI,CAAC,YAAY,EAAE,CAAC;oBAC3C,OAAO;gBACT,CAAC;gBAED,IAAI,YAAY,GAAG,KAAK,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;gBAC5C,IAAI,eAAe,GAAG,KAAK,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;gBAE/C,IAAI,eAAe,KAAK,YAAY,EAAE,CAAC;oBACrC,OAAO;gBACT,CAAC;gBAED,IAAI,KAAK,CAAC,SAAS,EAAE,CAAC;oBACpB,YAAY,GAAG,CAAC,YAAY,CAAC;gBAC/B,CAAC;gBAED,KAAK,CAAC,YAAY,CAAC,CAAC;YACtB,CAAC,CAAC,CACH,CAAC;QACJ,CAAC;;;;;;;;SAxFU,gBAAgB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import "
|
|
1
|
+
import "../define.js";
|