All files / custom-element/mixins ChildMixin.ts

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
 
 
 
 
 
 
8x
 
 
 
 
 
23x
 
 
 
23x
 
19x
 
 
 
 
14x
 
14x
 
 
 
 
55x
 
51x
 
51x
 
109x
 
1x
 
 
108x
 
 
51x
 
 
55x
 
 
 
8x
/**
 * Mixin for the child element to attach itself to the children collection of the parent element
 * So the parent can manage is children
 * @param Base 
 * @returns 
 */
const ChildMixin = Base =>
 
    class Child extends Base {
 
        static readonly _isCustomElement: boolean = true;
 
        private _adoptingParent = null;
 
        connectedCallback(node: Node) {
 
            super.connectedCallback?.(node);
 
            (this.adoptingParent as any)?.addAdoptedChild(this); // It might be null for the topmost custom element
        }
 
        disconnectedCallback(node: Node) {
 
            super.disconnectedCallback?.(node);
 
            (this.adoptingParent as any)?.removeAdoptedChild(this); // It might be null for the topmost custom element
        }
 
        protected get adoptingParent(): Node {
 
            if (this._adoptingParent === null) {
 
                let parent = this.parentNode;
 
                while (parent !== null) {
 
                    if (parent.constructor._isCustomElement) {  // It is a custom element
 
                        break;
                    }
 
                    parent = parent.parentNode;
                }
 
                this._adoptingParent = parent;
            }
 
            return this._adoptingParent;
        }
    }
 
export default ChildMixin;