@twobirds/microcomponents 0.0.83 → 0.0.84
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/assets/test/test.html +1 -1
- package/dist/MC.d.ts +10 -9
- package/dist/MC.d.ts.map +1 -1
- package/dist/MC.js +126 -158
- package/dist/MC.min.js +146 -254
- package/dist/MC.ts +182 -241
- package/dist/elements.d.ts.map +1 -1
- package/dist/elements.js +10 -4
- package/dist/elements.min.js +1 -1
- package/dist/elements.ts +17 -4
- package/dist/formValues.js +2 -2
- package/dist/formValues.min.js +1 -1
- package/dist/formValues.ts +3 -3
- package/dist/microcomponents.d.ts +0 -1
- package/dist/microcomponents.d.ts.map +1 -1
- package/dist/microcomponents.js +0 -1
- package/dist/microcomponents.min.js +1 -1
- package/dist/microcomponents.ts +1 -1
- package/dist/observables.d.ts.map +1 -1
- package/dist/observables.js +14 -12
- package/dist/observables.min.js +1 -1
- package/dist/observables.ts +32 -32
- package/package.json +1 -1
- package/public/MC.d.ts +10 -9
- package/public/MC.d.ts.map +1 -1
- package/public/MC.js +126 -158
- package/public/MC.js.map +1 -1
- package/public/MC.min.js +146 -254
- package/public/MC.ts +182 -241
- package/public/elements.d.ts.map +1 -1
- package/public/elements.js +10 -4
- package/public/elements.js.map +1 -1
- package/public/elements.min.js +1 -1
- package/public/elements.ts +17 -4
- package/public/formValues.js +2 -2
- package/public/formValues.js.map +1 -1
- package/public/formValues.min.js +1 -1
- package/public/formValues.ts +3 -3
- package/public/microcomponents.d.ts +0 -1
- package/public/microcomponents.d.ts.map +1 -1
- package/public/microcomponents.js +0 -1
- package/public/microcomponents.js.map +1 -1
- package/public/microcomponents.min.js +1 -1
- package/public/microcomponents.ts +1 -1
- package/public/observables.d.ts.map +1 -1
- package/public/observables.js +14 -12
- package/public/observables.js.map +1 -1
- package/public/observables.min.js +1 -1
- package/public/observables.ts +32 -32
- package/public/src/MC.d.ts +10 -9
- package/public/src/MC.d.ts.map +1 -1
- package/public/src/MC.js +126 -158
- package/public/src/MC.js.map +1 -1
- package/public/src/MC.ts +182 -241
- package/public/src/elements.d.ts.map +1 -1
- package/public/src/elements.js +10 -4
- package/public/src/elements.js.map +1 -1
- package/public/src/elements.ts +17 -4
- package/public/src/formValues.js +2 -2
- package/public/src/formValues.js.map +1 -1
- package/public/src/formValues.ts +3 -3
- package/public/src/microcomponents.d.ts +0 -1
- package/public/src/microcomponents.d.ts.map +1 -1
- package/public/src/microcomponents.js +0 -1
- package/public/src/microcomponents.js.map +1 -1
- package/public/src/microcomponents.ts +1 -1
- package/public/src/observables.d.ts.map +1 -1
- package/public/src/observables.js +14 -12
- package/public/src/observables.js.map +1 -1
- package/public/src/observables.ts +32 -32
- package/public/src/test/test/grandparent.d.ts.map +1 -1
- package/public/src/test/test/grandparent.js +1 -1
- package/public/src/test/test/grandparent.js.map +1 -1
- package/public/src/test/test/grandparent.ts +12 -4
- package/public/src/test/test/testform.js +1 -1
- package/public/src/test/test/testform.js.map +1 -1
- package/public/src/test/test/testform.ts +6 -8
- package/public/src/test/test.js +5 -4
- package/public/src/test/test.js.map +1 -1
- package/public/src/test/test.ts +8 -8
- package/public/test/MC.d.ts +10 -9
- package/public/test/MC.d.ts.map +1 -1
- package/public/test/MC.js +126 -158
- package/public/test/MC.min.js +146 -254
- package/public/test/MC.ts +182 -241
- package/public/test/elements.d.ts.map +1 -1
- package/public/test/elements.js +10 -4
- package/public/test/elements.min.js +1 -1
- package/public/test/elements.ts +17 -4
- package/public/test/formValues.js +2 -2
- package/public/test/formValues.min.js +1 -1
- package/public/test/formValues.ts +3 -3
- package/public/test/microcomponents.d.ts +0 -1
- package/public/test/microcomponents.d.ts.map +1 -1
- package/public/test/microcomponents.js +0 -1
- package/public/test/microcomponents.min.js +1 -1
- package/public/test/microcomponents.ts +1 -1
- package/public/test/observables.d.ts.map +1 -1
- package/public/test/observables.js +14 -12
- package/public/test/observables.min.js +1 -1
- package/public/test/observables.ts +32 -32
- package/public/test/test/grandparent.d.ts.map +1 -1
- package/public/test/test/grandparent.js +1 -1
- package/public/test/test/grandparent.js.map +1 -1
- package/public/test/test/grandparent.ts +12 -4
- package/public/test/test/testform.js +1 -1
- package/public/test/test/testform.js.map +1 -1
- package/public/test/test/testform.ts +6 -8
- package/public/test/test.html +1 -1
- package/public/test/test.js +5 -4
- package/public/test/test.js.map +1 -1
- package/public/test/test.ts +8 -8
- package/public/typedoc/assets/navigation.js +1 -1
- package/public/typedoc/assets/search.js +1 -1
- package/public/typedoc/classes/MC.DC.html +6 -4
- package/public/typedoc/classes/MC.MC.html +3 -4
- package/public/typedoc/classes/MC.McBase.html +3 -4
- package/public/typedoc/functions/MC.autoload.html +1 -1
- package/public/typedoc/functions/MC.off.html +1 -0
- package/public/typedoc/functions/MC.on.html +1 -0
- package/public/typedoc/functions/MC.one.html +1 -0
- package/public/typedoc/functions/elements.defineCE.html +1 -1
- package/public/typedoc/functions/elements.getCE.html +1 -1
- package/public/typedoc/functions/formValues.formValues.html +1 -1
- package/public/typedoc/functions/observables.observe.html +1 -1
- package/public/typedoc/interfaces/MC.HTMLMcElement.html +2 -2
- package/public/typedoc/modules/MC.html +7 -6
- package/public/typedoc/modules/elements.html +1 -1
- package/public/typedoc/modules/formValues.html +1 -1
- package/public/typedoc/modules/observables.html +1 -1
- package/public/typedoc/modules.html +0 -1
- package/public/typedoc/types/observables.Observable.html +1 -1
- package/src/MC.ts +182 -241
- package/src/elements.ts +17 -4
- package/src/formValues.ts +3 -3
- package/src/microcomponents.ts +1 -1
- package/src/observables.ts +32 -32
- package/src/test/test/grandparent.ts +12 -4
- package/src/test/test/testform.ts +6 -8
- package/src/test/test.ts +8 -8
- package/tsconfig.json +2 -2
- package/typedoc.json +1 -1
- package/webpack.config.js +2 -2
- package/dist/McEvent.d.ts +0 -15
- package/dist/McEvent.d.ts.map +0 -1
- package/dist/McEvent.js +0 -71
- package/dist/selectors.d.ts +0 -106
- package/dist/selectors.d.ts.map +0 -1
- package/dist/selectors.js +0 -759
- package/dist/selectors.min.js +0 -1
- package/public/McEvent.d.ts +0 -15
- package/public/McEvent.d.ts.map +0 -1
- package/public/McEvent.js +0 -71
- package/public/McEvent.js.map +0 -1
- package/public/selectors.d.ts +0 -106
- package/public/selectors.d.ts.map +0 -1
- package/public/selectors.js +0 -759
- package/public/selectors.js.map +0 -1
- package/public/selectors.min.js +0 -1
- package/public/src/McEvent.d.ts +0 -15
- package/public/src/McEvent.d.ts.map +0 -1
- package/public/src/McEvent.js +0 -71
- package/public/src/McEvent.js.map +0 -1
- package/public/src/selectors.d.ts +0 -106
- package/public/src/selectors.d.ts.map +0 -1
- package/public/src/selectors.js +0 -759
- package/public/src/selectors.js.map +0 -1
- package/public/test/McEvent.d.ts +0 -15
- package/public/test/McEvent.d.ts.map +0 -1
- package/public/test/McEvent.js +0 -71
- package/public/test/McEvent.ts +0 -96
- package/public/test/selectors.d.ts +0 -106
- package/public/test/selectors.d.ts.map +0 -1
- package/public/test/selectors.js +0 -759
- package/public/test/selectors.min.js +0 -1
- package/public/test/selectors.ts +0 -1269
- package/public/typedoc/classes/MC.McEvent.html +0 -9
- package/public/typedoc/functions/MC.addListener.html +0 -1
- package/public/typedoc/functions/MC.removeListener.html +0 -1
- package/public/typedoc/functions/selectors._d.html +0 -1
- package/public/typedoc/functions/selectors._t.html +0 -1
- package/public/typedoc/interfaces/selectors.DSelector.html +0 -48
- package/public/typedoc/interfaces/selectors.TSelector.html +0 -34
- package/public/typedoc/modules/selectors.html +0 -7
- package/public/typedoc/types/selectors.selection.html +0 -1
- package/public/typedoc/types/selectors.singleSelector.html +0 -1
- package/src/McEvent.ts +0 -96
- package/src/selectors.ts +0 -1269
- /package/{dist/McEvent.ts → public/McEvent._ts} +0 -0
- /package/{dist/selectors.ts → public/selectors._ts} +0 -0
- /package/public/{McEvent.ts → src/McEvent._ts} +0 -0
- /package/public/{selectors.ts → src/selectors._ts} +0 -0
- /package/{public/src/McEvent.ts → src/McEvent._ts} +0 -0
- /package/{public/src/selectors.ts → src/selectors._ts} +0 -0
package/assets/test/test.html
CHANGED
package/dist/MC.d.ts
CHANGED
|
@@ -1,36 +1,37 @@
|
|
|
1
1
|
import { LooseObject } from './helpers.js';
|
|
2
|
-
import { McEvent } from './McEvent.js';
|
|
3
2
|
export interface HTMLMcElement extends HTMLElement {
|
|
4
3
|
_mc: LooseObject;
|
|
5
4
|
}
|
|
6
|
-
declare function
|
|
7
|
-
declare function
|
|
8
|
-
declare function
|
|
5
|
+
declare function off(domNode: Node, eventName: string, handler: EventListenerOrEventListenerObject): void;
|
|
6
|
+
declare function on(domNode: Node, eventName: string, handler: EventListenerOrEventListenerObject, once?: boolean): void;
|
|
7
|
+
declare function one(domNode: Node, eventName: string, handler: EventListenerOrEventListenerObject): void;
|
|
8
|
+
declare function trigger(domNode: HTMLElement, event: CustomEvent | string, data?: any, bubble?: string): void;
|
|
9
9
|
declare class McBase {
|
|
10
10
|
private _target;
|
|
11
|
-
private __mc;
|
|
12
11
|
constructor(target?: {
|
|
13
12
|
[key: string]: any;
|
|
14
13
|
}, debug?: boolean);
|
|
15
14
|
get target(): any;
|
|
16
|
-
get _mc(): any;
|
|
17
15
|
}
|
|
18
16
|
declare class MC extends McBase {
|
|
19
17
|
constructor(target?: any);
|
|
20
18
|
static trigger: typeof trigger;
|
|
21
|
-
trigger(ev:
|
|
19
|
+
trigger(ev: string, data?: any, bubble?: string): void;
|
|
22
20
|
}
|
|
23
21
|
declare class DC extends McBase {
|
|
24
22
|
constructor(target: HTMLElement, debug?: boolean);
|
|
25
23
|
static add: Function;
|
|
26
24
|
static remove: Function;
|
|
27
25
|
static trigger: Function;
|
|
28
|
-
|
|
26
|
+
off(eventName: string, handler: EventListenerOrEventListenerObject): void;
|
|
27
|
+
on(eventName: string, handler: EventListenerOrEventListenerObject): void;
|
|
28
|
+
one(eventName: string, handler: EventListenerOrEventListenerObject): void;
|
|
29
|
+
trigger(ev: CustomEvent | string, data?: any, bubble?: string): void;
|
|
29
30
|
parent(search?: string): any[];
|
|
30
31
|
ancestors(search?: string): any[];
|
|
31
32
|
children(search?: string): any[];
|
|
32
33
|
descendants(search?: string): any[];
|
|
33
34
|
}
|
|
34
35
|
declare function autoload(enable?: boolean): boolean;
|
|
35
|
-
export {
|
|
36
|
+
export { McBase, MC, DC, autoload, on, one, off, trigger };
|
|
36
37
|
//# sourceMappingURL=MC.d.ts.map
|
package/dist/MC.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MC.d.ts","sourceRoot":"","sources":["../src/MC.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"MC.d.ts","sourceRoot":"","sources":["../src/MC.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAiB3C,MAAM,WAAW,aAAc,SAAQ,WAAW;IACjD,GAAG,EAAE,WAAW,CAAC;CACjB;AA2HD,iBAAS,GAAG,CAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,kCAAkC,QAE1F;AAED,iBAAS,EAAE,CAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,kCAAkC,EAAE,IAAI,GAAE,OAAe,QAEhH;AAED,iBAAS,GAAG,CAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,kCAAkC,QAE1F;AAGD,iBAAS,OAAO,CACf,OAAO,EAAE,WAAW,EACpB,KAAK,EAAE,WAAW,GAAG,MAAM,EAC3B,IAAI,GAAE,GAAQ,EACd,MAAM,GAAE,MAAY,QAepB;AA4ED,cAAM,MAAM;IACX,OAAO,CAAC,OAAO,CAAe;gBAElB,MAAM,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,EAAE,KAAK,GAAE,OAAe;IAUnE,IAAI,MAAM,IAAI,GAAG,CAEhB;CAED;AAED,cAAM,EAAG,SAAQ,MAAM;gBACV,MAAM,CAAC,EAAE,GAAG;IAIxB,MAAM,CAAC,OAAO,iBAAW;IAEzB,OAAO,CAAC,EAAE,EAAE,MAAM,EAAE,IAAI,GAAE,GAAQ,EAAE,MAAM,GAAE,MAAY;CAGxD;AAED,cAAM,EAAG,SAAQ,MAAM;gBACV,MAAM,EAAE,WAAW,EAAE,KAAK,GAAE,OAAe;IAIvD,MAAM,CAAC,GAAG,EAAE,QAAQ,CAAO;IAC3B,MAAM,CAAC,MAAM,EAAE,QAAQ,CAAU;IACjC,MAAM,CAAC,OAAO,EAAE,QAAQ,CAAW;IAEnC,GAAG,CAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,kCAAkC;IAInE,EAAE,CAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,kCAAkC;IAIlE,GAAG,CAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,kCAAkC;IAInE,OAAO,CAAC,EAAE,EAAE,WAAW,GAAG,MAAM,EAAE,IAAI,GAAE,GAAQ,EAAE,MAAM,GAAE,MAAY;IAOtE,MAAM,CAAC,MAAM,GAAE,MAAW,GAAG,GAAG,EAAE;IAMlC,SAAS,CAAC,MAAM,GAAE,MAAW,GAAG,GAAG,EAAE;IAMrC,QAAQ,CAAC,MAAM,GAAE,MAAW,GAAG,GAAG,EAAE;IAQpC,WAAW,CAAC,MAAM,GAAE,MAAW,GAAG,GAAG,EAAE;CAMvC;AA+GD,iBAAS,QAAQ,CAAC,MAAM,GAAE,OAAc,GAAG,OAAO,CAmBjD;AAID,OAAO,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,OAAO,EAAE,CAAC"}
|
package/dist/MC.js
CHANGED
|
@@ -1,11 +1,13 @@
|
|
|
1
1
|
'use strict';
|
|
2
|
-
import { McEvent } from './McEvent.js';
|
|
3
2
|
var isBrowser = new Function('try {return this===window;}catch(e){ return false;}');
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
.
|
|
8
|
-
|
|
3
|
+
function getNativeEventNames(domNode) {
|
|
4
|
+
let nativeEventNames = [];
|
|
5
|
+
if (isBrowser()) {
|
|
6
|
+
Object.keys(HTMLElement.prototype)
|
|
7
|
+
.filter((key) => /^on/.test(key))
|
|
8
|
+
.forEach((eventName) => nativeEventNames.push(eventName));
|
|
9
|
+
}
|
|
10
|
+
return nativeEventNames;
|
|
9
11
|
}
|
|
10
12
|
function getMicroComponents(elements, search) {
|
|
11
13
|
let mcValues = [];
|
|
@@ -44,19 +46,6 @@ function traverseNodes(node, search, firstonly = true) {
|
|
|
44
46
|
function isDOM(element) {
|
|
45
47
|
return element && element instanceof HTMLElement;
|
|
46
48
|
}
|
|
47
|
-
function addListener(domNode, eventName, handler, capture = false, once = false) {
|
|
48
|
-
let options = { once: false };
|
|
49
|
-
if (capture) {
|
|
50
|
-
options.capture = capture;
|
|
51
|
-
}
|
|
52
|
-
if (once) {
|
|
53
|
-
options.once = once;
|
|
54
|
-
}
|
|
55
|
-
domNode.addEventListener(eventName, handler, options);
|
|
56
|
-
}
|
|
57
|
-
function removeListener(domNode, eventName, handler) {
|
|
58
|
-
domNode.removeEventListener(eventName, handler);
|
|
59
|
-
}
|
|
60
49
|
function add(target, key, element = {}) {
|
|
61
50
|
let node = target;
|
|
62
51
|
if (!node._mc) {
|
|
@@ -69,8 +58,8 @@ function add(target, key, element = {}) {
|
|
|
69
58
|
const _mc = node._mc;
|
|
70
59
|
if (key.length && !_mc[key]) {
|
|
71
60
|
_mc[key] = element;
|
|
72
|
-
if (target instanceof HTMLElement && !target.getAttribute('
|
|
73
|
-
target.setAttribute('
|
|
61
|
+
if (target instanceof HTMLElement && !target.getAttribute('data-mc')) {
|
|
62
|
+
target.setAttribute('data-mc', '');
|
|
74
63
|
}
|
|
75
64
|
}
|
|
76
65
|
return element;
|
|
@@ -84,25 +73,8 @@ function remove(target, key) {
|
|
|
84
73
|
}
|
|
85
74
|
if (!Object.keys(_mc).length &&
|
|
86
75
|
target instanceof HTMLElement &&
|
|
87
|
-
target.hasAttribute('
|
|
88
|
-
target.removeAttribute('
|
|
89
|
-
}
|
|
90
|
-
return;
|
|
91
|
-
}
|
|
92
|
-
function trigger(target, ev, data = {}, bubble = 'l') {
|
|
93
|
-
let _mc = target?._mc;
|
|
94
|
-
if (!_mc)
|
|
95
|
-
return;
|
|
96
|
-
let event = ev instanceof McEvent
|
|
97
|
-
? new McEvent(ev.type, ev.data, 'l')
|
|
98
|
-
: new McEvent(ev, data, 'l'), mcEvent = typeof ev !== 'string' ? ev : new McEvent(ev, data, bubble);
|
|
99
|
-
[...Object.values(_mc)].forEach((mc) => {
|
|
100
|
-
if (mc?.trigger && typeof mc?.trigger === 'function') {
|
|
101
|
-
mc?.trigger(event);
|
|
102
|
-
}
|
|
103
|
-
});
|
|
104
|
-
if (/[ud]/.test(mcEvent.bubble)) {
|
|
105
|
-
bubbleEvent(target, mcEvent);
|
|
76
|
+
target.hasAttribute('data-mc')) {
|
|
77
|
+
target.removeAttribute('data-mc');
|
|
106
78
|
}
|
|
107
79
|
return;
|
|
108
80
|
}
|
|
@@ -113,6 +85,48 @@ function init(element) {
|
|
|
113
85
|
element.trigger('Init');
|
|
114
86
|
}, 0);
|
|
115
87
|
}
|
|
88
|
+
function getMcEventName(eventName) {
|
|
89
|
+
return '_mc' + eventName[0].toUpperCase() + eventName.substring(1);
|
|
90
|
+
}
|
|
91
|
+
function off(domNode, eventName, handler) {
|
|
92
|
+
domNode.removeEventListener(getMcEventName(eventName), handler);
|
|
93
|
+
}
|
|
94
|
+
function on(domNode, eventName, handler, once = false) {
|
|
95
|
+
domNode.addEventListener(getMcEventName(eventName), handler, { capture: false, once });
|
|
96
|
+
}
|
|
97
|
+
function one(domNode, eventName, handler) {
|
|
98
|
+
on(domNode, eventName, handler, true);
|
|
99
|
+
}
|
|
100
|
+
function trigger(domNode, event, data = {}, bubble = 'l') {
|
|
101
|
+
const ev = typeof event === 'string'
|
|
102
|
+
? new CustomEvent(getMcEventName(event), { detail: { data, bubble } })
|
|
103
|
+
: event;
|
|
104
|
+
if (bubble.length && bubble.indexOf('l') > -1) {
|
|
105
|
+
domNode.dispatchEvent(ev);
|
|
106
|
+
}
|
|
107
|
+
if (/[u|d]/.test(bubble)) {
|
|
108
|
+
bubbleEvent(domNode, ev);
|
|
109
|
+
}
|
|
110
|
+
}
|
|
111
|
+
function bubbleEvent(domNode, ev) {
|
|
112
|
+
setTimeout(() => {
|
|
113
|
+
if (ev.detail.bubble.indexOf('l') === -1) {
|
|
114
|
+
ev.detail.bubble += 'l';
|
|
115
|
+
}
|
|
116
|
+
if (ev.detail.bubble.indexOf('u') > -1) {
|
|
117
|
+
domNode.closest('[data-mc]')?.dispatchEvent(ev);
|
|
118
|
+
}
|
|
119
|
+
if (ev.detail.bubble.indexOf('d') > -1) {
|
|
120
|
+
let targets = new Set(domNode._mc
|
|
121
|
+
.children()
|
|
122
|
+
.map((c) => c?.target));
|
|
123
|
+
targets.forEach((target) => {
|
|
124
|
+
if (target)
|
|
125
|
+
DC.trigger(target, ev);
|
|
126
|
+
});
|
|
127
|
+
}
|
|
128
|
+
}, 0);
|
|
129
|
+
}
|
|
116
130
|
function autoAttachListeners(element) {
|
|
117
131
|
if (!isBrowser() || element.constructor === DC)
|
|
118
132
|
return;
|
|
@@ -123,53 +137,31 @@ function autoAttachListeners(element) {
|
|
|
123
137
|
.filter((key) => /^on[A-Z]|one[A-Z]/.test(key) &&
|
|
124
138
|
typeof that.constructor.prototype[key] === 'function')
|
|
125
139
|
.forEach((key) => {
|
|
126
|
-
let once = /^one/.test(key), withoutOnOne = key.replace(/^on[e]{0,1}/, ''), nativeEventName = withoutOnOne.toLowerCase()
|
|
127
|
-
|
|
140
|
+
let once = /^one/.test(key), withoutOnOne = key.replace(/^on[e]{0,1}/, ''), nativeEventName = withoutOnOne.toLowerCase();
|
|
141
|
+
let listener = (ev) => {
|
|
142
|
+
that[key](ev);
|
|
128
143
|
};
|
|
129
|
-
if (
|
|
130
|
-
|
|
131
|
-
configurable: true,
|
|
132
|
-
enumerable: false,
|
|
133
|
-
writable: true,
|
|
134
|
-
value: (ev) => {
|
|
135
|
-
that.constructor.prototype[key].bind(that)(ev);
|
|
136
|
-
},
|
|
137
|
-
});
|
|
144
|
+
if (!!target['on' + nativeEventName]) {
|
|
145
|
+
target.addEventListener(nativeEventName, listener);
|
|
138
146
|
}
|
|
139
|
-
|
|
140
|
-
|
|
147
|
+
else {
|
|
148
|
+
on(target, withoutOnOne, listener, once);
|
|
141
149
|
}
|
|
142
150
|
});
|
|
143
151
|
}
|
|
144
152
|
}
|
|
145
|
-
function
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
let parent = traverseNodes(target, '', true)?.[0].target;
|
|
153
|
-
if (parent)
|
|
154
|
-
DC.trigger(parent, ev);
|
|
155
|
-
}
|
|
156
|
-
if (ev.bubble.indexOf('d') > -1) {
|
|
157
|
-
let targets = new Set(target._mc
|
|
158
|
-
.children()
|
|
159
|
-
.map((c) => c?.target));
|
|
160
|
-
targets.forEach((target) => {
|
|
161
|
-
if (target)
|
|
162
|
-
DC.trigger(target, ev);
|
|
163
|
-
});
|
|
164
|
-
}
|
|
165
|
-
}, 0);
|
|
166
|
-
}
|
|
153
|
+
function getMcChildNodes(domNode) {
|
|
154
|
+
const id = Math.random().toString().replace('.', '');
|
|
155
|
+
const selector = '[data-mc]:not([temp_id="' + id + '"] [data-mc] [data-mc])';
|
|
156
|
+
domNode.setAttribute('temp_id', id);
|
|
157
|
+
const myDomElements = domNode.querySelectorAll(selector);
|
|
158
|
+
domNode.removeAttribute('temp_id');
|
|
159
|
+
return myDomElements;
|
|
167
160
|
}
|
|
168
161
|
class McBase {
|
|
169
162
|
_target;
|
|
170
|
-
__mc = {};
|
|
171
163
|
constructor(target, debug = false) {
|
|
172
|
-
let
|
|
164
|
+
let element = this;
|
|
173
165
|
this._target = new WeakRef(target || {});
|
|
174
166
|
init(element);
|
|
175
167
|
autoAttachListeners(element);
|
|
@@ -177,9 +169,6 @@ class McBase {
|
|
|
177
169
|
get target() {
|
|
178
170
|
return this._target.deref();
|
|
179
171
|
}
|
|
180
|
-
get _mc() {
|
|
181
|
-
return this.__mc;
|
|
182
|
-
}
|
|
183
172
|
}
|
|
184
173
|
class MC extends McBase {
|
|
185
174
|
constructor(target) {
|
|
@@ -187,44 +176,6 @@ class MC extends McBase {
|
|
|
187
176
|
}
|
|
188
177
|
static trigger = trigger;
|
|
189
178
|
trigger(ev, data = {}, bubble = 'l') {
|
|
190
|
-
let that = this;
|
|
191
|
-
if (that.constructor === MC || that.constructor === DC) {
|
|
192
|
-
let event = ev instanceof McEvent
|
|
193
|
-
? new McEvent(ev.type, ev.data, 'l')
|
|
194
|
-
: new McEvent(ev, data, 'l'), mcEvent = typeof ev !== 'string'
|
|
195
|
-
? ev
|
|
196
|
-
: new McEvent(ev, data, bubble);
|
|
197
|
-
[...Object.getOwnPropertyNames(that)].forEach((mc) => {
|
|
198
|
-
if (that[mc]?.trigger &&
|
|
199
|
-
typeof that[mc]?.trigger === 'function') {
|
|
200
|
-
that[mc]?.trigger(event);
|
|
201
|
-
}
|
|
202
|
-
});
|
|
203
|
-
if (/[ud]/.test(mcEvent.bubble)) {
|
|
204
|
-
bubbleEvent(that.target, mcEvent);
|
|
205
|
-
}
|
|
206
|
-
return;
|
|
207
|
-
}
|
|
208
|
-
if (that instanceof MC || that instanceof DC) {
|
|
209
|
-
const that = this, mcEvent = typeof ev !== 'string'
|
|
210
|
-
? ev
|
|
211
|
-
: new McEvent(ev, data, bubble), handlerName = 'on' + mcEvent.type[0].toUpperCase() + mcEvent.type.slice(1);
|
|
212
|
-
if (mcEvent.bubble.indexOf('l') > -1) {
|
|
213
|
-
if (!mcEvent.immediateStopped &&
|
|
214
|
-
typeof that[handlerName] === 'function') {
|
|
215
|
-
that[handlerName](mcEvent);
|
|
216
|
-
if (that.hasOwnProperty(handlerName)) {
|
|
217
|
-
delete that[handlerName];
|
|
218
|
-
}
|
|
219
|
-
}
|
|
220
|
-
}
|
|
221
|
-
if (mcEvent.stopped || mcEvent.bubble === 'l') {
|
|
222
|
-
return that;
|
|
223
|
-
}
|
|
224
|
-
if (/[ud]/.test(mcEvent.bubble)) {
|
|
225
|
-
bubbleEvent(that.target, mcEvent);
|
|
226
|
-
}
|
|
227
|
-
}
|
|
228
179
|
}
|
|
229
180
|
}
|
|
230
181
|
class DC extends McBase {
|
|
@@ -234,8 +185,18 @@ class DC extends McBase {
|
|
|
234
185
|
static add = add;
|
|
235
186
|
static remove = remove;
|
|
236
187
|
static trigger = trigger;
|
|
237
|
-
|
|
238
|
-
|
|
188
|
+
off(eventName, handler) {
|
|
189
|
+
off(this.target, eventName, handler);
|
|
190
|
+
}
|
|
191
|
+
on(eventName, handler) {
|
|
192
|
+
on(this.target, eventName, handler);
|
|
193
|
+
}
|
|
194
|
+
one(eventName, handler) {
|
|
195
|
+
one(this.target, eventName, handler);
|
|
196
|
+
}
|
|
197
|
+
trigger(ev, data = {}, bubble = 'l') {
|
|
198
|
+
if (typeof ev === 'string') {
|
|
199
|
+
}
|
|
239
200
|
}
|
|
240
201
|
parent(search = '') {
|
|
241
202
|
let target = this.target;
|
|
@@ -253,39 +214,23 @@ class DC extends McBase {
|
|
|
253
214
|
let target = this?.target;
|
|
254
215
|
if (!isDOM(target))
|
|
255
216
|
return [];
|
|
256
|
-
const
|
|
257
|
-
const selector = '[_mc]:not([temp_id="' + id + '"] [_mc] [_mc])';
|
|
258
|
-
target.setAttribute('temp_id', id);
|
|
259
|
-
const myDomElements = target.querySelectorAll(selector);
|
|
217
|
+
const myDomElements = getMcChildNodes(target);
|
|
260
218
|
const mcValues = getMicroComponents([...myDomElements], search);
|
|
261
|
-
target.removeAttribute('temp_id');
|
|
262
219
|
return mcValues;
|
|
263
220
|
}
|
|
264
221
|
descendants(search = '') {
|
|
265
222
|
let target = this?.target;
|
|
266
223
|
if (!isDOM(target))
|
|
267
224
|
return [];
|
|
268
|
-
const myDomElements = target.querySelectorAll('*[
|
|
225
|
+
const myDomElements = target.querySelectorAll('*[data-mc]');
|
|
269
226
|
return getMicroComponents([...myDomElements], search);
|
|
270
227
|
}
|
|
271
228
|
}
|
|
272
|
-
const
|
|
273
|
-
function
|
|
274
|
-
|
|
275
|
-
return;
|
|
276
|
-
loadingMCs.add(element);
|
|
277
|
-
const fileName = './' + element.split('-').join('/') + '.js';
|
|
278
|
-
const se = document.createElement('script');
|
|
279
|
-
se.setAttribute('src', fileName);
|
|
280
|
-
se.setAttribute('blocking', 'render');
|
|
281
|
-
se.async = true;
|
|
282
|
-
se.setAttribute('type', 'module');
|
|
283
|
-
se.setAttribute('data-name', element);
|
|
284
|
-
se.setAttribute('loading', '');
|
|
285
|
-
const loadedPromise = customElements.whenDefined(element);
|
|
286
|
-
loadedPromise.then(() => {
|
|
229
|
+
const loadingDCs = new Set();
|
|
230
|
+
function attachDC(element) {
|
|
231
|
+
return () => {
|
|
287
232
|
const elements = Array
|
|
288
|
-
.from(document.querySelectorAll(`[
|
|
233
|
+
.from(document.querySelectorAll(`[data-mc*="${element}"]`))
|
|
289
234
|
.filter(element => element instanceof HTMLElement);
|
|
290
235
|
if (elements.length === 0)
|
|
291
236
|
return;
|
|
@@ -293,19 +238,36 @@ function makeLoadScript(element) {
|
|
|
293
238
|
elements.forEach((node) => {
|
|
294
239
|
DC.add(node, klass.name, new klass(node));
|
|
295
240
|
const new_mc = node
|
|
296
|
-
.getAttribute('
|
|
241
|
+
.getAttribute('data-mc')
|
|
297
242
|
.split(' ')
|
|
298
243
|
.filter((name) => name !== element && name !== '')
|
|
299
|
-
.join(' ')
|
|
300
|
-
|
|
244
|
+
.join(' ')
|
|
245
|
+
.trim();
|
|
246
|
+
node.setAttribute('data-mc', new_mc);
|
|
301
247
|
});
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
248
|
+
};
|
|
249
|
+
}
|
|
250
|
+
;
|
|
251
|
+
function makeLoadScript(element) {
|
|
252
|
+
if (loadingDCs.has(element))
|
|
253
|
+
return;
|
|
254
|
+
loadingDCs.add(element);
|
|
255
|
+
const fileName = './' + element.split('-').join('/') + '.js';
|
|
256
|
+
const se = document.createElement('script');
|
|
257
|
+
se.setAttribute('src', fileName);
|
|
258
|
+
se.setAttribute('blocking', 'render');
|
|
259
|
+
se.async = true;
|
|
260
|
+
se.setAttribute('type', 'module');
|
|
261
|
+
se.setAttribute('data-name', element);
|
|
262
|
+
se.setAttribute('loading', '');
|
|
263
|
+
const loadedPromise = customElements.whenDefined(element);
|
|
264
|
+
loadedPromise.then(attachDC(element));
|
|
265
|
+
se.addEventListener('load', (ev) => {
|
|
266
|
+
loadingDCs.delete(element);
|
|
267
|
+
document.head.querySelector(`script[data-name="${element}"]`)?.remove();
|
|
306
268
|
});
|
|
307
|
-
|
|
308
|
-
console.error('could not load
|
|
269
|
+
se.addEventListener('error', (ev) => {
|
|
270
|
+
console.error('could not load DC code from', fileName);
|
|
309
271
|
});
|
|
310
272
|
document.head.append(se);
|
|
311
273
|
}
|
|
@@ -313,16 +275,22 @@ function loadUndefinedMCs() {
|
|
|
313
275
|
[...document.querySelectorAll(':not(:defined)')]
|
|
314
276
|
.filter((element) => !!element
|
|
315
277
|
&& !customElements.get(element.tagName.toLowerCase())
|
|
316
|
-
&& !
|
|
278
|
+
&& !loadingDCs.has(element.tagName.toLowerCase()))
|
|
317
279
|
.forEach((el) => {
|
|
318
280
|
makeLoadScript(el.tagName.toLowerCase());
|
|
319
281
|
});
|
|
320
|
-
[...document.querySelectorAll('[
|
|
282
|
+
[...document.querySelectorAll('[data-mc]:not([data-mc=""]')]
|
|
321
283
|
.filter((element) => !!element)
|
|
322
284
|
.forEach((el) => {
|
|
323
|
-
const _mc = el.getAttribute('
|
|
324
|
-
_mc?.forEach(
|
|
325
|
-
|
|
285
|
+
const _mc = el.getAttribute('data-mc')?.split(' ').filter(name => name !== '');
|
|
286
|
+
_mc?.forEach(element => {
|
|
287
|
+
const isDefined = customElements.get(element);
|
|
288
|
+
if (!loadingDCs.has(element) && !isDefined) {
|
|
289
|
+
makeLoadScript(element);
|
|
290
|
+
}
|
|
291
|
+
else if (isDefined) {
|
|
292
|
+
attachDC(element)();
|
|
293
|
+
}
|
|
326
294
|
});
|
|
327
295
|
});
|
|
328
296
|
}
|
|
@@ -343,6 +311,6 @@ function autoload(enable = true) {
|
|
|
343
311
|
window.autoload = window.autoload || autoload;
|
|
344
312
|
return autoloadEnabled;
|
|
345
313
|
}
|
|
346
|
-
autoload.state =
|
|
347
|
-
export {
|
|
314
|
+
autoload.state = loadingDCs;
|
|
315
|
+
export { McBase, MC, DC, autoload, on, one, off, trigger };
|
|
348
316
|
//# sourceMappingURL=MC.js.map
|