be-hive 0.0.121 → 0.0.122

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.
Files changed (5) hide show
  1. package/README.md +1 -1
  2. package/be-hive.js +187 -187
  3. package/getLocalName.js +24 -24
  4. package/package.json +3 -3
  5. package/toTempl.js +24 -24
package/README.md CHANGED
@@ -15,7 +15,7 @@
15
15
 
16
16
  be-hive allows us to manage and coordinate the [family, or HTML frimework](https://github.com/bahrus/may-it-be) of [be-enhanced](https://github.com/bahrus/be-enhanced) custom enhancements.
17
17
 
18
- Without be-hive, the developer is burdened with plopping an instance of each decorator inside each shadow DOM realm.
18
+ Without be-hive, the developer is burdened with plopping an instance of each enhancement inside each shadow DOM realm.
19
19
 
20
20
  With the help of the be-hive component, the developer only has to plop a single instance of be-hive inside the Shadow DOM realm, like so:
21
21
 
package/be-hive.js CHANGED
@@ -1,187 +1,187 @@
1
- import 'be-enhanced/beEnhanced.js';
2
- export class BeHive extends HTMLElement {
3
- constructor() {
4
- super();
5
- this.registeredBehaviors = {};
6
- }
7
- async connectedCallback() {
8
- this.hidden = true;
9
- const overridesAttr = this.getAttribute('overrides');
10
- if (overridesAttr !== null) {
11
- this.overrides = JSON.parse(overridesAttr);
12
- }
13
- else {
14
- this.overrides = {};
15
- }
16
- this.#getInheritedBehaviors();
17
- this.#addMutationObserver();
18
- }
19
- disconnectedCallback() {
20
- if (this.#mutationObserver !== undefined) {
21
- this.#mutationObserver.disconnect();
22
- }
23
- }
24
- #getInheritedBehaviors() {
25
- const rn = this.getRootNode();
26
- const host = rn.host;
27
- if (!host)
28
- return;
29
- const parentShadowRealm = host.getRootNode();
30
- const parentBeHiveInstance = parentShadowRealm.querySelector('be-hive');
31
- if (parentBeHiveInstance !== null) {
32
- const { registeredBehaviors } = parentBeHiveInstance;
33
- for (const key in registeredBehaviors) {
34
- this.register(registeredBehaviors[key]);
35
- }
36
- parentBeHiveInstance.addEventListener('latest-behavior-changed', (e) => {
37
- this.register(e.detail.value);
38
- });
39
- }
40
- }
41
- #mutationObserver;
42
- #addMutationObserver() {
43
- const rn = this.getRootNode();
44
- const config = { attributes: true, childList: true, subtree: true };
45
- const callback = (mutationList, observer) => {
46
- for (const mutation of mutationList) {
47
- if (mutation.type === "childList") {
48
- for (const node of mutation.addedNodes) {
49
- if (node instanceof Element && node.hasAttribute('data--ignore')) {
50
- //console.log('ignore');
51
- continue;
52
- }
53
- this.#inspectNewNode(node);
54
- }
55
- for (const node of mutation.removedNodes) {
56
- const beEnhanced = node.beEnhanced;
57
- if (beEnhanced === undefined)
58
- continue;
59
- for (const key in beEnhanced) {
60
- const enhancement = beEnhanced[key];
61
- const detach = enhancement['detach'];
62
- if (typeof (detach) === 'function') {
63
- const boundDetach = detach.bind(enhancement);
64
- boundDetach(node);
65
- }
66
- }
67
- }
68
- }
69
- else if (mutation.type === "attributes") {
70
- const { target } = mutation;
71
- if (target instanceof Element && target.hasAttribute('data--ignore')) {
72
- //console.log('ignore');
73
- continue;
74
- }
75
- this.#inspectNewNode(target);
76
- }
77
- }
78
- };
79
- // Create an observer instance linked to the callback function
80
- const observer = new MutationObserver(callback);
81
- observer.observe(rn, config);
82
- this.#mutationObserver = observer;
83
- }
84
- #inspectNewNode(node) {
85
- if (!(node instanceof Element))
86
- return;
87
- const { beEnhanced } = node;
88
- const { registeredBehaviors } = this;
89
- for (const key in registeredBehaviors) {
90
- const registeredBehavior = registeredBehaviors[key];
91
- const { upgrade } = registeredBehavior;
92
- if (!node.matches(upgrade))
93
- continue;
94
- const namespacedName = beEnhanced.getFQName(key);
95
- if (namespacedName === undefined)
96
- continue;
97
- beEnhanced.whenAttached(key);
98
- //beEnhanced.attachAttr(namespacedName, key);
99
- }
100
- for (const child of node.children) {
101
- this.#inspectNewNode(child);
102
- }
103
- }
104
- // #getPreciseMatch(key: string, node: Element, allowNonNamespaced = true){
105
- // if(allowNonNamespaced && node.matches(`[${key}]`)) return key;
106
- // let testKey = `enh-by-${key}`;
107
- // let test = `[${testKey}]`;
108
- // if(node.matches(test)) return testKey;
109
- // testKey = `data-enh-by-${key}`;
110
- // test = `[${testKey}]`;
111
- // if(node.matches(test)) return testKey;
112
- // return undefined;
113
- // }
114
- #scanForSingleRegisteredBehavior(localName, behaviorKeys) {
115
- const { ifWantsToBe, upgrade } = behaviorKeys;
116
- const attr = `${upgrade}[${localName}],${upgrade}[enh-by-${localName}],${upgrade}[data-enh-by-${localName}]`;
117
- const rn = this.getRootNode();
118
- rn.querySelectorAll(attr).forEach(el => {
119
- const { beEnhanced } = el;
120
- const namespacedName = beEnhanced.getFQName(localName);
121
- if (namespacedName === undefined)
122
- return;
123
- //console.log({namespacedName});
124
- beEnhanced.whenAttached(namespacedName);
125
- });
126
- }
127
- async beatify(content) {
128
- const { beatify } = await import('./beatify.js');
129
- return await beatify(content, this);
130
- }
131
- register(parentInstance) {
132
- const parentInstanceLocalName = parentInstance.localName;
133
- if (this.querySelector(parentInstanceLocalName) !== null)
134
- return;
135
- const override = this.overrides[parentInstanceLocalName];
136
- let newInstanceTagName = parentInstanceLocalName;
137
- let newIfWantsToBe = parentInstance.ifWantsToBe;
138
- let newDisabled = parentInstance.disabled;
139
- if (override !== undefined) {
140
- const { ifWantsToBe, block, unblock } = override;
141
- if (block) {
142
- newDisabled = true;
143
- }
144
- else if (unblock) {
145
- newDisabled = false;
146
- }
147
- if (ifWantsToBe) {
148
- newIfWantsToBe = ifWantsToBe;
149
- newInstanceTagName = 'be-' + ifWantsToBe;
150
- }
151
- }
152
- const beSevered = this.hasAttribute('be-severed');
153
- if (beSevered)
154
- newDisabled = true;
155
- const newBehaviorEl = document.createElement('template');
156
- Object.assign(newBehaviorEl.dataset, {
157
- localName: parentInstanceLocalName,
158
- ifWantsToBe: newIfWantsToBe,
159
- upgrade: parentInstance.upgrade,
160
- });
161
- //parentInstanceLocalName
162
- // newBehaviorEl.setAttribute('if-wants-to-be', newIfWantsToBe);
163
- // newBehaviorEl.setAttribute('upgrade', parentInstance.upgrade);
164
- if (newDisabled)
165
- newBehaviorEl.setAttribute('disabled', '');
166
- this.appendChild(newBehaviorEl);
167
- const newRegisteredBehavior = {
168
- ...parentInstance,
169
- ifWantsToBe: newIfWantsToBe,
170
- disabled: newDisabled,
171
- };
172
- this.registeredBehaviors[parentInstanceLocalName] = newRegisteredBehavior;
173
- this.#scanForSingleRegisteredBehavior(parentInstanceLocalName, newRegisteredBehavior);
174
- //console.log({newRegisteredBehavior});
175
- this.dispatchEvent(new CustomEvent('latest-behavior-changed', {
176
- detail: {
177
- value: newRegisteredBehavior,
178
- }
179
- }));
180
- //this.latestBehaviors = [...this.latestBehaviors, newRegisteredBehavior];
181
- //this.#doSweepingScan();
182
- return newBehaviorEl;
183
- }
184
- }
185
- if (!customElements.get('be-hive')) {
186
- customElements.define('be-hive', BeHive);
187
- }
1
+ import 'be-enhanced/beEnhanced.js';
2
+ export class BeHive extends HTMLElement {
3
+ constructor() {
4
+ super();
5
+ this.registeredBehaviors = {};
6
+ }
7
+ async connectedCallback() {
8
+ this.hidden = true;
9
+ const overridesAttr = this.getAttribute('overrides');
10
+ if (overridesAttr !== null) {
11
+ this.overrides = JSON.parse(overridesAttr);
12
+ }
13
+ else {
14
+ this.overrides = {};
15
+ }
16
+ this.#getInheritedBehaviors();
17
+ this.#addMutationObserver();
18
+ }
19
+ disconnectedCallback() {
20
+ if (this.#mutationObserver !== undefined) {
21
+ this.#mutationObserver.disconnect();
22
+ }
23
+ }
24
+ #getInheritedBehaviors() {
25
+ const rn = this.getRootNode();
26
+ const host = rn.host;
27
+ if (!host)
28
+ return;
29
+ const parentShadowRealm = host.getRootNode();
30
+ const parentBeHiveInstance = parentShadowRealm.querySelector('be-hive');
31
+ if (parentBeHiveInstance !== null) {
32
+ const { registeredBehaviors } = parentBeHiveInstance;
33
+ for (const key in registeredBehaviors) {
34
+ this.register(registeredBehaviors[key]);
35
+ }
36
+ parentBeHiveInstance.addEventListener('latest-behavior-changed', (e) => {
37
+ this.register(e.detail.value);
38
+ });
39
+ }
40
+ }
41
+ #mutationObserver;
42
+ #addMutationObserver() {
43
+ const rn = this.getRootNode();
44
+ const config = { attributes: true, childList: true, subtree: true };
45
+ const callback = (mutationList, observer) => {
46
+ for (const mutation of mutationList) {
47
+ if (mutation.type === "childList") {
48
+ for (const node of mutation.addedNodes) {
49
+ if (node instanceof Element && node.hasAttribute('data--ignore')) {
50
+ //console.log('ignore');
51
+ continue;
52
+ }
53
+ this.#inspectNewNode(node);
54
+ }
55
+ for (const node of mutation.removedNodes) {
56
+ const beEnhanced = node.beEnhanced;
57
+ if (beEnhanced === undefined)
58
+ continue;
59
+ for (const key in beEnhanced) {
60
+ const enhancement = beEnhanced[key];
61
+ const detach = enhancement['detach'];
62
+ if (typeof (detach) === 'function') {
63
+ const boundDetach = detach.bind(enhancement);
64
+ boundDetach(node);
65
+ }
66
+ }
67
+ }
68
+ }
69
+ else if (mutation.type === "attributes") {
70
+ const { target } = mutation;
71
+ if (target instanceof Element && target.hasAttribute('data--ignore')) {
72
+ //console.log('ignore');
73
+ continue;
74
+ }
75
+ this.#inspectNewNode(target);
76
+ }
77
+ }
78
+ };
79
+ // Create an observer instance linked to the callback function
80
+ const observer = new MutationObserver(callback);
81
+ observer.observe(rn, config);
82
+ this.#mutationObserver = observer;
83
+ }
84
+ #inspectNewNode(node) {
85
+ if (!(node instanceof Element))
86
+ return;
87
+ const { beEnhanced } = node;
88
+ const { registeredBehaviors } = this;
89
+ for (const key in registeredBehaviors) {
90
+ const registeredBehavior = registeredBehaviors[key];
91
+ const { upgrade } = registeredBehavior;
92
+ if (!node.matches(upgrade))
93
+ continue;
94
+ const namespacedName = beEnhanced.getFQName(key);
95
+ if (namespacedName === undefined)
96
+ continue;
97
+ beEnhanced.whenAttached(key);
98
+ //beEnhanced.attachAttr(namespacedName, key);
99
+ }
100
+ for (const child of node.children) {
101
+ this.#inspectNewNode(child);
102
+ }
103
+ }
104
+ // #getPreciseMatch(key: string, node: Element, allowNonNamespaced = true){
105
+ // if(allowNonNamespaced && node.matches(`[${key}]`)) return key;
106
+ // let testKey = `enh-by-${key}`;
107
+ // let test = `[${testKey}]`;
108
+ // if(node.matches(test)) return testKey;
109
+ // testKey = `data-enh-by-${key}`;
110
+ // test = `[${testKey}]`;
111
+ // if(node.matches(test)) return testKey;
112
+ // return undefined;
113
+ // }
114
+ #scanForSingleRegisteredBehavior(localName, behaviorKeys) {
115
+ const { ifWantsToBe, upgrade } = behaviorKeys;
116
+ const attr = `${upgrade}[${localName}],${upgrade}[enh-by-${localName}],${upgrade}[data-enh-by-${localName}]`;
117
+ const rn = this.getRootNode();
118
+ rn.querySelectorAll(attr).forEach(el => {
119
+ const { beEnhanced } = el;
120
+ const namespacedName = beEnhanced.getFQName(localName);
121
+ if (namespacedName === undefined)
122
+ return;
123
+ //console.log({namespacedName});
124
+ beEnhanced.whenAttached(namespacedName);
125
+ });
126
+ }
127
+ async beatify(content) {
128
+ const { beatify } = await import('./beatify.js');
129
+ return await beatify(content, this);
130
+ }
131
+ register(parentInstance) {
132
+ const parentInstanceLocalName = parentInstance.localName;
133
+ if (this.querySelector(parentInstanceLocalName) !== null)
134
+ return;
135
+ const override = this.overrides[parentInstanceLocalName];
136
+ let newInstanceTagName = parentInstanceLocalName;
137
+ let newIfWantsToBe = parentInstance.ifWantsToBe;
138
+ let newDisabled = parentInstance.disabled;
139
+ if (override !== undefined) {
140
+ const { ifWantsToBe, block, unblock } = override;
141
+ if (block) {
142
+ newDisabled = true;
143
+ }
144
+ else if (unblock) {
145
+ newDisabled = false;
146
+ }
147
+ if (ifWantsToBe) {
148
+ newIfWantsToBe = ifWantsToBe;
149
+ newInstanceTagName = 'be-' + ifWantsToBe;
150
+ }
151
+ }
152
+ const beSevered = this.hasAttribute('be-severed');
153
+ if (beSevered)
154
+ newDisabled = true;
155
+ const newBehaviorEl = document.createElement('template');
156
+ Object.assign(newBehaviorEl.dataset, {
157
+ localName: parentInstanceLocalName,
158
+ ifWantsToBe: newIfWantsToBe,
159
+ upgrade: parentInstance.upgrade,
160
+ });
161
+ //parentInstanceLocalName
162
+ // newBehaviorEl.setAttribute('if-wants-to-be', newIfWantsToBe);
163
+ // newBehaviorEl.setAttribute('upgrade', parentInstance.upgrade);
164
+ if (newDisabled)
165
+ newBehaviorEl.setAttribute('disabled', '');
166
+ this.appendChild(newBehaviorEl);
167
+ const newRegisteredBehavior = {
168
+ ...parentInstance,
169
+ ifWantsToBe: newIfWantsToBe,
170
+ disabled: newDisabled,
171
+ };
172
+ this.registeredBehaviors[parentInstanceLocalName] = newRegisteredBehavior;
173
+ this.#scanForSingleRegisteredBehavior(parentInstanceLocalName, newRegisteredBehavior);
174
+ //console.log({newRegisteredBehavior});
175
+ this.dispatchEvent(new CustomEvent('latest-behavior-changed', {
176
+ detail: {
177
+ value: newRegisteredBehavior,
178
+ }
179
+ }));
180
+ //this.latestBehaviors = [...this.latestBehaviors, newRegisteredBehavior];
181
+ //this.#doSweepingScan();
182
+ return newBehaviorEl;
183
+ }
184
+ }
185
+ if (!customElements.get('be-hive')) {
186
+ customElements.define('be-hive', BeHive);
187
+ }
package/getLocalName.js CHANGED
@@ -1,24 +1,24 @@
1
- export function getLocalName(peerCitizen, decoratorName) {
2
- return new Promise((resolve, reject) => {
3
- const rn = peerCitizen.getRootNode();
4
- const bh = rn.querySelector('be-hive');
5
- if (bh === null) {
6
- reject('404');
7
- return;
8
- }
9
- const wc = bh.querySelector(decoratorName);
10
- if (wc !== null) {
11
- resolve(bh.ifWantsToBe);
12
- return;
13
- }
14
- const controller = new AbortController();
15
- bh.addEventListener('latest-behavior-changed', e => {
16
- const detail = e.detail;
17
- const { localName, ifWantsToBe } = detail.value;
18
- if (localName === decoratorName) {
19
- resolve(ifWantsToBe);
20
- controller.abort();
21
- }
22
- });
23
- });
24
- }
1
+ export function getLocalName(peerCitizen, decoratorName) {
2
+ return new Promise((resolve, reject) => {
3
+ const rn = peerCitizen.getRootNode();
4
+ const bh = rn.querySelector('be-hive');
5
+ if (bh === null) {
6
+ reject('404');
7
+ return;
8
+ }
9
+ const wc = bh.querySelector(decoratorName);
10
+ if (wc !== null) {
11
+ resolve(bh.ifWantsToBe);
12
+ return;
13
+ }
14
+ const controller = new AbortController();
15
+ bh.addEventListener('latest-behavior-changed', e => {
16
+ const detail = e.detail;
17
+ const { localName, ifWantsToBe } = detail.value;
18
+ if (localName === decoratorName) {
19
+ resolve(ifWantsToBe);
20
+ controller.abort();
21
+ }
22
+ });
23
+ });
24
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "be-hive",
3
- "version": "0.0.121",
3
+ "version": "0.0.122",
4
4
  "keywords": [
5
5
  "web-components",
6
6
  "web-component",
@@ -28,11 +28,11 @@
28
28
  "update": "ncu -u && npm install"
29
29
  },
30
30
  "dependencies": {
31
- "be-enhanced": "0.0.50",
31
+ "be-enhanced": "0.0.51",
32
32
  "trans-render": "0.0.705"
33
33
  },
34
34
  "devDependencies": {
35
- "may-it-serve": "0.0.5"
35
+ "may-it-serve": "0.0.6"
36
36
  },
37
37
  "repository": {
38
38
  "type": "git",
package/toTempl.js CHANGED
@@ -1,24 +1,24 @@
1
- export async function toTempl(templ, fromShadow, relativeTo) {
2
- let templateToClone = templ;
3
- if (templateToClone.localName !== 'template') {
4
- templateToClone = document.createElement('template');
5
- if (fromShadow) {
6
- const beHive = (templ.shadowRoot).querySelector('be-hive');
7
- if (beHive) {
8
- const div = document.createElement('div');
9
- div.innerHTML = templ.shadowRoot.innerHTML;
10
- const beatified = await beHive.beatify(div);
11
- templateToClone.innerHTML = beatified.innerHTML;
12
- }
13
- else {
14
- templateToClone.innerHTML = templ.shadowRoot.innerHTML;
15
- }
16
- }
17
- else {
18
- const beHive = relativeTo.getRootNode().querySelector('be-hive');
19
- const beatified = await beHive.beatify(templ);
20
- templateToClone.innerHTML = beatified.innerHTML;
21
- }
22
- }
23
- return templateToClone;
24
- }
1
+ export async function toTempl(templ, fromShadow, relativeTo) {
2
+ let templateToClone = templ;
3
+ if (templateToClone.localName !== 'template') {
4
+ templateToClone = document.createElement('template');
5
+ if (fromShadow) {
6
+ const beHive = (templ.shadowRoot).querySelector('be-hive');
7
+ if (beHive) {
8
+ const div = document.createElement('div');
9
+ div.innerHTML = templ.shadowRoot.innerHTML;
10
+ const beatified = await beHive.beatify(div);
11
+ templateToClone.innerHTML = beatified.innerHTML;
12
+ }
13
+ else {
14
+ templateToClone.innerHTML = templ.shadowRoot.innerHTML;
15
+ }
16
+ }
17
+ else {
18
+ const beHive = relativeTo.getRootNode().querySelector('be-hive');
19
+ const beatified = await beHive.beatify(templ);
20
+ templateToClone.innerHTML = beatified.innerHTML;
21
+ }
22
+ }
23
+ return templateToClone;
24
+ }