@twobirds/microcomponents 0.0.57 → 0.0.58
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/.vscode/settings.json +3 -0
- package/README.md +6 -2
- package/assets/documentation/observables.md +105 -0
- package/assets/test.html +1 -1
- package/dist/MC.d.ts.map +1 -1
- package/dist/MC.min.js +1 -2
- package/dist/MC.ts +1 -5
- package/dist/formValues.d.ts +1 -3
- package/dist/formValues.d.ts.map +1 -1
- package/dist/formValues.ts +23 -24
- package/dist/formvValues.min.js +1 -1
- package/dist/microcomponents.min.js +1 -1
- package/dist/observables.d.ts.map +1 -1
- package/dist/observables.min.js +1 -1
- package/dist/observables.ts +5 -6
- package/dist/test.ts +1 -1
- package/package.json +2 -2
- package/public/MC.js +1 -2
- package/public/MC.js.map +1 -1
- package/public/MC.min.js +1 -2
- package/public/documentation/observables.md +105 -0
- package/public/formValues.js +15 -17
- package/public/formValues.js.map +1 -1
- package/public/formvValues.min.js +1 -1
- package/public/microcomponents.min.js +1 -1
- package/public/observables.js +1 -2
- package/public/observables.js.map +1 -1
- package/public/observables.min.js +1 -1
- package/public/src/MC.ts +1 -5
- package/public/src/autoloader.ts +55 -55
- package/public/src/formValues.ts +23 -24
- package/public/src/observables.ts +5 -6
- package/public/src/test.ts +1 -1
- package/public/test/grandparent.js +1 -0
- package/public/test/testform.js +1 -0
- package/public/test.html +1 -1
- package/public/test.js +1 -1
- package/public/test.js.map +1 -1
- package/src/MC.ts +1 -5
- package/src/formValues.ts +23 -24
- package/src/observables.ts +5 -6
- package/src/test/{Child.ts → child.ts} +3 -3
- package/src/test/{Grandchild.ts → grandchild.ts} +3 -3
- package/src/test/{Grandparent.ts → grandparent.ts} +3 -3
- package/src/test/{Greatgrandchild.ts → greatgrandchild.ts} +1 -1
- package/src/test/{Parent.ts → parent.ts} +4 -4
- package/src/test/{Testform.ts → testform.ts} +3 -9
- package/src/test.ts +1 -1
- package/webpack.config.js +5 -5
- package/dist/autoloader.d.ts +0 -2
- package/dist/autoloader.d.ts.map +0 -1
- package/dist/autoloader.ts +0 -98
- package/public/assets/highlight.css +0 -99
- package/public/assets/main.js +0 -58
- package/public/assets/search.js +0 -1
- package/public/assets/style.css +0 -1280
- package/public/autoloader.js +0 -53
- package/public/autoloader.js.map +0 -1
- package/public/classes/MC.DC.html +0 -228
- package/public/classes/MC.MC.html +0 -171
- package/public/classes/MC.McBase.html +0 -117
- package/public/classes/MC.McEvent.html +0 -187
- package/public/classes/formValues.FormValues.html +0 -86
- package/public/functions/MC.addListener.html +0 -77
- package/public/functions/MC.autoload.html +0 -69
- package/public/functions/MC.removeListener.html +0 -73
- package/public/functions/elements.defineCE.html +0 -78
- package/public/functions/elements.getCE.html +0 -63
- package/public/functions/observables.observe.html +0 -65
- package/public/functions/selectors._d.html +0 -69
- package/public/functions/selectors._t.html +0 -69
- package/public/index.html +0 -126
- package/public/interfaces/MC.HTMLMcElement.html +0 -3608
- package/public/interfaces/selectors.DSelector.html +0 -1013
- package/public/interfaces/selectors.TSelector.html +0 -712
- package/public/modules/MC.html +0 -80
- package/public/modules/elements.html +0 -62
- package/public/modules/formValues.html +0 -60
- package/public/modules/observables.html +0 -65
- package/public/modules/selectors.html +0 -76
- package/public/modules.html +0 -54
- package/public/test/Grandparent.js +0 -1
- package/public/test/Testform.js +0 -1
- package/public/types/observables.Observable.html +0 -91
- package/public/types/selectors.selection.html +0 -58
- package/public/types/selectors.singleSelector.html +0 -58
- package/src/autoloader.ts +0 -98
- /package/assets/{Grandparent.css → grandparent.css} +0 -0
- /package/public/{Grandparent.css → grandparent.css} +0 -0
- /package/src/test/{Grandparent.css → grandparent.css} +0 -0
- /package/src/test/{Testform.css → testform.css} +0 -0
- /package/src/test/{Testform.html → testform.html} +0 -0
- /package/src/test/{Testform.json → testform.json} +0 -0
package/README.md
CHANGED
|
@@ -8,10 +8,14 @@ Using micro components enforces **DRY, KISS and SOLID** principles in Javascript
|
|
|
8
8
|
|
|
9
9
|
## Think **Building Blocks**
|
|
10
10
|
|
|
11
|
-
|
|
11
|
+
In general this is a **HTML / Web Standards first** system. There is almost no abstraction, especially not for templating, except state binding to the DOM.
|
|
12
|
+
|
|
13
|
+
When coding with this system, you create classes that extend either the **[MC](https://gitlab.com/twoBirds/microcomponents/-/blob/main/assets/documentation/MC.md?ref_type=heads#mc-class-extends-mcbase)** or **[DC](https://gitlab.com/twoBirds/microcomponents/-/blob/main/assets/documentation/MC.md?ref_type=heads#dc-class-extends-mcbase)** superclasses provided here. These classes provide the structure you need to build your wonderland. You can attach instances of your custom code to any HTMLElement, and there can be as many as you want connected to a single HTML tag.
|
|
12
14
|
|
|
13
15
|
In an almost literal sense they work like childrens building blocks, where a chest full of unassuming parts lets you compose whatever functionality lies in your imagination.
|
|
14
16
|
|
|
17
|
+
Also you can easily define native JS custom elements, and since these are just another instance of DC, you can enhance them even at runtime, as they are displayed in the browser.
|
|
18
|
+
|
|
15
19
|
This systems **modular** approach gives you full control over your software, without the need to rely on other frameworks. On the other hand, its **minimalistic** stance enables you to use the resulting functionality in any other framework, and makes the **learning curve neglectable**.
|
|
16
20
|
|
|
17
21
|
## Status
|
|
@@ -27,7 +31,7 @@ This repository exports 5 independent functionalities:
|
|
|
27
31
|
|
|
28
32
|
1. **[Micro Components](https://gitlab.com/twoBirds/microcomponents/-/blob/main/assets/documentation/MC.md?ref_type=heads)** contains the **MC** and **DC** classes you can use as super classes.
|
|
29
33
|
2. **[Elements](https://gitlab.com/twoBirds/microcomponents/-/blob/main/assets/documentation/elements.md?ref_type=heads)** lets you define and use your own native web components. Uses (1).
|
|
30
|
-
3. (
|
|
34
|
+
3. **[Observables](https://gitlab.com/twoBirds/microcomponents/-/blob/main/assets/documentation/observables.md?ref_type=heads)** add **observability** and **run time type safety** to object properties. Also they provide **1-way binding** to placeholders in your template HTML.
|
|
31
35
|
4. (wip) **FormValues** gives you **2-way binding** between a HTML form and an observable object. Uses (3).
|
|
32
36
|
5. (wip) **Selectors** provide chainable jQuery like selectors for both the DOM and micro components.
|
|
33
37
|
|
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
# Observables Documentation
|
|
2
|
+
|
|
3
|
+
This module provides utilities for observing and binding data to DOM elements using placeholders. It supports reactive updates when data changes.
|
|
4
|
+
|
|
5
|
+
## Table of Contents
|
|
6
|
+
|
|
7
|
+
- [Overview](#overview)
|
|
8
|
+
- [Functions](#functions)
|
|
9
|
+
- [Types](#types)
|
|
10
|
+
- [Example Usage](#example-usage)
|
|
11
|
+
|
|
12
|
+
---
|
|
13
|
+
|
|
14
|
+
## Overview
|
|
15
|
+
|
|
16
|
+
The module defines an `observe` function that makes object properties observable.
|
|
17
|
+
|
|
18
|
+
You can use this function to turn a single property or all properties of an object into observables.
|
|
19
|
+
|
|
20
|
+
This functionality can be used standalone in any framework.
|
|
21
|
+
|
|
22
|
+
## Functions
|
|
23
|
+
|
|
24
|
+
### `observe( target: LooseObject, propertyName?: string ): LooseObject`
|
|
25
|
+
|
|
26
|
+
**Description**
|
|
27
|
+
|
|
28
|
+
Registers a distinct property or all object properties as an observable, making them reactive.
|
|
29
|
+
|
|
30
|
+
Those properties are dual use:
|
|
31
|
+
|
|
32
|
+
- **Direct Assign Native Values**:
|
|
33
|
+
- Directly assign native values to the property, and the observable will be notified of the change.
|
|
34
|
+
|
|
35
|
+
- **Use as an Instance of Observable**
|
|
36
|
+
- Use the property as an instance of the `Observable` class. This allows you to attach callbacks and react to changes. You can bind the property to DOM elements.
|
|
37
|
+
|
|
38
|
+
## Types
|
|
39
|
+
|
|
40
|
+
### `Observable`
|
|
41
|
+
|
|
42
|
+
**Definition**
|
|
43
|
+
```typescript
|
|
44
|
+
export type Observable = {
|
|
45
|
+
observe: (cb: Callback) => void; // attach a callback to be notified of changes
|
|
46
|
+
notify: () => void; // mostly internal use, but can be called to trigger all callbacks
|
|
47
|
+
bind: (target: HTMLElement | DocumentFragment | ShadowRoot) => void; // the target DOM element to bind the observable to. {placeholder} will be replaced with the actual data value.
|
|
48
|
+
};
|
|
49
|
+
```
|
|
50
|
+
|
|
51
|
+
**Methods**
|
|
52
|
+
|
|
53
|
+
- `observe(cb: Callback)`
|
|
54
|
+
Registers a callback to be notified of changes.
|
|
55
|
+
|
|
56
|
+
- `notify( enable?: boolean)`
|
|
57
|
+
- Enables / Disables notifications.
|
|
58
|
+
- By default, notifications are enabled.
|
|
59
|
+
- If `enable` is `false`, notifications are disabled. You need to explicitly call `notify(true)` to re-enable notifications.
|
|
60
|
+
- Triggers all registered callbacks with the current data.
|
|
61
|
+
|
|
62
|
+
- `bind(target: HTMLElement | DocumentFragment | ShadowRoot)`
|
|
63
|
+
Binds the observable to a DOM element, replacing placeholders with data values.
|
|
64
|
+
|
|
65
|
+
|
|
66
|
+
## Example Usage
|
|
67
|
+
|
|
68
|
+
```typescript
|
|
69
|
+
import { observe } from './src/observables';
|
|
70
|
+
|
|
71
|
+
const data = {
|
|
72
|
+
name: 'John',
|
|
73
|
+
age: 30,
|
|
74
|
+
};
|
|
75
|
+
|
|
76
|
+
observe(data);
|
|
77
|
+
|
|
78
|
+
const element = document.getElementById('user-card');
|
|
79
|
+
data.bind(element);
|
|
80
|
+
```
|
|
81
|
+
|
|
82
|
+
In HTML:
|
|
83
|
+
```html
|
|
84
|
+
<div id="user-card">
|
|
85
|
+
<p>Hello, {name}</p>
|
|
86
|
+
<p>Age: {age}</p>
|
|
87
|
+
</div>
|
|
88
|
+
```
|
|
89
|
+
|
|
90
|
+
When `data.name` or `data.age` changes, the DOM updates automatically.
|
|
91
|
+
|
|
92
|
+
---
|
|
93
|
+
|
|
94
|
+
## Dependencies
|
|
95
|
+
|
|
96
|
+
- `helpers.js` - Provides utilities like `deepEqual`, `debounce`, `flattenObject`, etc.
|
|
97
|
+
- `MC.js` - Contains `DC`, `HTMLMcElement`, and `McEvent` for DOM manipulation and event handling.
|
|
98
|
+
|
|
99
|
+
---
|
|
100
|
+
|
|
101
|
+
## Notes
|
|
102
|
+
|
|
103
|
+
- Only objects can be bound to the DOM.
|
|
104
|
+
- Native values (strings, numbers, booleans) are wrapped in observable proxies.
|
|
105
|
+
- Changes to observable properties trigger updates in bound DOM elements.
|
package/assets/test.html
CHANGED
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
href="MicroComponents.svg"
|
|
12
12
|
/>
|
|
13
13
|
<link href="./my-tag.css" rel="stylesheet" />
|
|
14
|
-
<link href="./
|
|
14
|
+
<link href="./grandparent.css" rel="stylesheet" />
|
|
15
15
|
<script src="./microcomponents.min.js"></script>
|
|
16
16
|
<script>
|
|
17
17
|
Object.assign(window, microcomponents); // make system global, for debugging
|
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;AAC3C,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAevC,MAAM,WAAW,aAAc,SAAQ,WAAW;IACjD,GAAG,EAAE,WAAW,CAAC;CACjB;AA8CD,iBAAS,WAAW,CACnB,OAAO,EAAE,IAAI,EACb,SAAS,EAAE,MAAM,EACjB,OAAO,EAAE,kCAAkC,GAAG,IAAI,EAClD,OAAO,GAAE,OAAe,EACxB,IAAI,GAAE,OAAe,QAarB;AAED,iBAAS,cAAc,CACtB,OAAO,EAAE,IAAI,EACb,SAAS,EAAE,MAAM,EACjB,OAAO,EAAE,kCAAkC,GAAG,IAAI,QAGlD;AAmDD,iBAAS,OAAO,CACf,MAAM,EAAE,WAAW,EACnB,EAAE,EAAE,OAAO,GAAG,MAAM,EACpB,IAAI,GAAE,GAAQ,EACd,MAAM,GAAE,MAAY,QAwBpB;AAiGD,cAAM,MAAM;;gBAGC,MAAM,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,EAAE,KAAK,GAAE,OAAe;IAWnE,IAAI,MAAM,IAAI,GAAG,CAEhB;CACD;AAED,cAAM,EAAG,SAAQ,MAAM;IACtB,GAAG,CAAC,EAAE,WAAW,CAAM;gBAEX,MAAM,CAAC,EAAE,GAAG;IAIxB,MAAM,CAAC,OAAO,iBAAW;IAEzB,OAAO,CAAC,EAAE,EAAE,OAAO,GAAG,MAAM,EAAE,IAAI,GAAE,GAAQ,EAAE,MAAM,GAAE,MAAY;CAmElE;AAED,cAAM,EAAG,SAAQ,MAAM;IACtB,GAAG,CAAC,EAAE,WAAW,CAAM;gBAEX,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,OAAO,CAAC,EAAE,EAAE,OAAO,GAAG,MAAM,EAAE,IAAI,GAAE,GAAQ,EAAE,MAAM,CAAC,EAAE,MAAM;IAI7D,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;IAYpC,WAAW,CAAC,MAAM,GAAE,MAAW,GAAG,GAAG,EAAE;CAMvC;AAED,OAAO,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,EAAE,OAAO,EAAE,CAAC;
|
|
1
|
+
{"version":3,"file":"MC.d.ts","sourceRoot":"","sources":["../src/MC.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAC3C,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAevC,MAAM,WAAW,aAAc,SAAQ,WAAW;IACjD,GAAG,EAAE,WAAW,CAAC;CACjB;AA8CD,iBAAS,WAAW,CACnB,OAAO,EAAE,IAAI,EACb,SAAS,EAAE,MAAM,EACjB,OAAO,EAAE,kCAAkC,GAAG,IAAI,EAClD,OAAO,GAAE,OAAe,EACxB,IAAI,GAAE,OAAe,QAarB;AAED,iBAAS,cAAc,CACtB,OAAO,EAAE,IAAI,EACb,SAAS,EAAE,MAAM,EACjB,OAAO,EAAE,kCAAkC,GAAG,IAAI,QAGlD;AAmDD,iBAAS,OAAO,CACf,MAAM,EAAE,WAAW,EACnB,EAAE,EAAE,OAAO,GAAG,MAAM,EACpB,IAAI,GAAE,GAAQ,EACd,MAAM,GAAE,MAAY,QAwBpB;AAiGD,cAAM,MAAM;;gBAGC,MAAM,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,EAAE,KAAK,GAAE,OAAe;IAWnE,IAAI,MAAM,IAAI,GAAG,CAEhB;CACD;AAED,cAAM,EAAG,SAAQ,MAAM;IACtB,GAAG,CAAC,EAAE,WAAW,CAAM;gBAEX,MAAM,CAAC,EAAE,GAAG;IAIxB,MAAM,CAAC,OAAO,iBAAW;IAEzB,OAAO,CAAC,EAAE,EAAE,OAAO,GAAG,MAAM,EAAE,IAAI,GAAE,GAAQ,EAAE,MAAM,GAAE,MAAY;CAmElE;AAED,cAAM,EAAG,SAAQ,MAAM;IACtB,GAAG,CAAC,EAAE,WAAW,CAAM;gBAEX,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,OAAO,CAAC,EAAE,EAAE,OAAO,GAAG,MAAM,EAAE,IAAI,GAAE,GAAQ,EAAE,MAAM,CAAC,EAAE,MAAM;IAI7D,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;IAYpC,WAAW,CAAC,MAAM,GAAE,MAAW,GAAG,GAAG,EAAE;CAMvC;AAED,OAAO,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,EAAE,OAAO,EAAE,CAAC;AA6ChE,wBAAgB,QAAQ,CAAC,MAAM,GAAE,OAAc,GAAG,OAAO,CAgBxD"}
|
package/dist/MC.min.js
CHANGED
|
@@ -411,8 +411,7 @@ function loadit() {
|
|
|
411
411
|
? [el.tagName.toLowerCase()]
|
|
412
412
|
: el.getAttribute('_mc').trim().split(' ');
|
|
413
413
|
load.forEach((elementName) => {
|
|
414
|
-
let fileName = elementName.toLowerCase().split('-')
|
|
415
|
-
fileName[fileName.length - 1] = renameLastElement;
|
|
414
|
+
let fileName = elementName.toLowerCase().split('-');
|
|
416
415
|
fileName = fileName.join('/') + '.js';
|
|
417
416
|
if (el.tagName.includes('-') &&
|
|
418
417
|
!unresolved.has(el.tagName.toLowerCase())) {
|
package/dist/MC.ts
CHANGED
|
@@ -424,11 +424,7 @@ function loadit() {
|
|
|
424
424
|
: el.getAttribute('_mc')!.trim().split(' ');
|
|
425
425
|
|
|
426
426
|
load.forEach((elementName) => {
|
|
427
|
-
let fileName: any = elementName.toLowerCase().split('-')
|
|
428
|
-
lastElement = fileName[fileName.length - 1],
|
|
429
|
-
renameLastElement =
|
|
430
|
-
lastElement[0].toUpperCase() + lastElement.slice(1);
|
|
431
|
-
fileName[fileName.length - 1] = renameLastElement;
|
|
427
|
+
let fileName: any = elementName.toLowerCase().split('-');
|
|
432
428
|
fileName = fileName.join('/') + '.js';
|
|
433
429
|
|
|
434
430
|
// autoload web components
|
package/dist/formValues.d.ts
CHANGED
|
@@ -1,5 +1,3 @@
|
|
|
1
1
|
import { LooseObject } from './helpers.js';
|
|
2
|
-
export declare
|
|
3
|
-
constructor(targetObject: LooseObject, propertyName: string, dom: HTMLElement | ShadowRoot);
|
|
4
|
-
}
|
|
2
|
+
export declare function formValues(targetObject: LooseObject, propertyName: string, dom: HTMLElement | ShadowRoot): void;
|
|
5
3
|
//# sourceMappingURL=formValues.d.ts.map
|
package/dist/formValues.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"formValues.d.ts","sourceRoot":"","sources":["../src/formValues.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAsB,MAAM,cAAc,CAAC;AA0M/D,
|
|
1
|
+
{"version":3,"file":"formValues.d.ts","sourceRoot":"","sources":["../src/formValues.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAsB,MAAM,cAAc,CAAC;AA0M/D,wBAAgB,UAAU,CACzB,YAAY,EAAE,WAAW,EACzB,YAAY,EAAE,MAAM,EACpB,GAAG,EAAE,WAAW,GAAG,UAAU,QAwB7B"}
|
package/dist/formValues.ts
CHANGED
|
@@ -202,33 +202,32 @@ const getInputHandlers = (e: HTMLElement | ShadowRoot): LooseObject => {
|
|
|
202
202
|
return handlers;
|
|
203
203
|
};
|
|
204
204
|
|
|
205
|
-
export
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
)
|
|
211
|
-
let handlers = getInputHandlers(dom);
|
|
205
|
+
export function formValues(
|
|
206
|
+
targetObject: LooseObject,
|
|
207
|
+
propertyName: string,
|
|
208
|
+
dom: HTMLElement | ShadowRoot
|
|
209
|
+
) {
|
|
210
|
+
let handlers = getInputHandlers(dom);
|
|
212
211
|
|
|
213
|
-
|
|
212
|
+
targetObject[propertyName] = Object.assign({}, handlers);
|
|
214
213
|
|
|
215
|
-
|
|
214
|
+
observe(targetObject, propertyName);
|
|
216
215
|
|
|
217
|
-
|
|
216
|
+
copyGettersSetters(handlers, targetObject[propertyName]);
|
|
218
217
|
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
});
|
|
224
|
-
addListener(input as HTMLElement, 'change', (ev: Event) => {
|
|
225
|
-
//console.log('change', ev);
|
|
226
|
-
targetObject[propertyName].notify();
|
|
227
|
-
});
|
|
228
|
-
addListener(input as inputTypes, 'select', (ev: Event) => {
|
|
229
|
-
//console.log('select', ev);
|
|
230
|
-
targetObject[propertyName].notify();
|
|
231
|
-
});
|
|
218
|
+
[...dom.querySelectorAll('input, textarea, select')].forEach((input) => {
|
|
219
|
+
addListener(input as inputTypes, 'keyup', (ev: Event) => {
|
|
220
|
+
//console.log('keyup', ev);
|
|
221
|
+
targetObject[propertyName].notify();
|
|
232
222
|
});
|
|
233
|
-
|
|
223
|
+
addListener(input as HTMLElement, 'change', (ev: Event) => {
|
|
224
|
+
//console.log('change', ev);
|
|
225
|
+
targetObject[propertyName].notify();
|
|
226
|
+
});
|
|
227
|
+
addListener(input as inputTypes, 'select', (ev: Event) => {
|
|
228
|
+
//console.log('select', ev);
|
|
229
|
+
targetObject[propertyName].notify();
|
|
230
|
+
});
|
|
231
|
+
});
|
|
234
232
|
}
|
|
233
|
+
|
package/dist/formvValues.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.formValues=t():e.formValues=t()}(this,(()=>(()=>{"use strict";var e={d:(t,r)=>{for(var n in r)e.o(r,n)&&!e.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:r[n]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};function r(e){let t={};return[...Object.keys(e)].sort().forEach((n=>{var o;(o=e[n])&&o.constructor&&o.constructor===Object?t[n]=r(e[n]):t[n]=e[n]})),t}function n(e,t=!0){let o={};return[...Object.getOwnPropertyNames(e)].forEach((t=>{if(e[t]&&e[t].constructor&&e[t].constructor===Object){const r=n(e[t],!1);for(const e in r)o[t+"."+e]=r[e]}else o[t]=e[t]})),t?r(o):o}function o(e,t){return JSON.stringify(n(e))===JSON.stringify(n(t))}function c(e,t){let r;return()=>{clearTimeout(r),r=setTimeout((function(){e(...arguments)}),t)}}function a(e,t){const r=Object.getOwnPropertyDescriptors(e);for(const[e,n]of Object.entries(r))("get"in n||"set"in n)&&Object.defineProperty(t,e,n)}e.r(t),e.d(t,{FormValues:()=>C});var s=new Function("try {return this===window;}catch(e){ return false;}");let i=new Set;s()&&Object.keys(HTMLElement.prototype).filter((e=>/^on/.test(e))).forEach((e=>i.add(e)));class l{#e;#t=!1;#r=!1;constructor(e,t={},r="l"){this.#e=e,this.data=t,this.bubble=r}get type(){return this.#e}get stopped(){return this.#t}get immediateStopped(){return this.#r}stopPropagation(){this.#t=!0}stopImmediatePropagation(){this.stopPropagation(),this.#r=!0}}var u=new Function("try {return this===window;}catch(e){ return false;}");let f=new Set;function d(e,t){let r=[];return e.forEach((e=>{if(e&&e instanceof HTMLElement){const n=e?._mc;!t&&n?r=r.concat(Object.values(e._mc)):t&&n&&n[t]&&r.push(n[t])}})),r}function p(e,t,r=!0){let n=[];for(;e;){if(e._mc&&(t?t&&e._mc[t]&&n.push(e._mc[t]):n=n.concat(Object.values(e._mc)),r))return n;e=e.parentNode}return n}function b(e){return e&&e instanceof HTMLElement}function g(e,t,r,n=!1,o=!1){let c={once:!1};n&&(c.capture=n),o&&(c.once=o),e.addEventListener(t,r,c)}function h(e,t,r={}){let n=e;if(!n._mc){let t=E?.debug;E.debug=!1,n._mc=new E(e),E.debug=t,delete n._mc._mc}const o=n._mc;return t.length&&!o[t]&&(o[t]=r,e instanceof HTMLElement&&e.setAttribute("_mc","")),r}function m(e,t){if(!t)return;const r=e?._mc||{};r&&r[t]&&delete r[t],!Object.keys(r).length&&e instanceof HTMLElement&&e.hasAttribute("_mc")&&e.removeAttribute("_mc")}function y(e,t,r={},n="l"){let o=e?._mc;if(!o)return;let c=t instanceof l?new l(t.type,t.data,"l"):new l(t,r,"l"),a="string"!=typeof t?t:new l(t,r,n);[...Object.values(o)].forEach((e=>{e?.trigger&&"function"==typeof e?.trigger&&e?.trigger(c)})),/[ud]/.test(a.bubble)&&O(e,a)}function O(e,t){/[ud]/.test(t.bubble)&&setTimeout((()=>{if(-1===t.bubble.indexOf("l")&&(t.bubble+="l"),t.bubble.indexOf("u")>-1){let r=p(e,"",!0)?.[0].target;r&&E.trigger(r,t)}t.bubble.indexOf("d")>-1&&new Set(e._mc.children().map((e=>e?.target))).forEach((e=>{e&&E.trigger(e,t)}))}),0)}u()&&Object.keys(HTMLElement.prototype).filter((e=>/^on/.test(e))).forEach((e=>f.add(e)));class v{#n;constructor(e,t=!1){var r;this.#n=new WeakRef(e||{}),(r=this).constructor!==E&&setTimeout((()=>{r.trigger("Init")}),0),function(e){if(!u()||e.constructor===E)return;const t=e.target;if(t instanceof HTMLElement){let r=e;Object.getOwnPropertyNames(r.constructor.prototype).filter((e=>/^on[A-Z]|one[A-Z]/.test(e)&&"function"==typeof r.constructor.prototype[e])).forEach((n=>{let o=/^one/.test(n),c=n.replace(/^on[e]{0,1}/,""),a=c.toLowerCase();o&&Object.defineProperty(e,"on"+c,{configurable:!0,enumerable:!1,writable:!0,value:e=>{r.constructor.prototype[n].bind(r)(e)}}),f.has("on"+a)&&g(t,a,(e=>{r.trigger(c,e)}),!1,o)}))}}(this)}get target(){return this.#n.deref()}}class w extends v{_mc={};constructor(e){super(e)}static trigger=y;trigger(e,t={},r="l"){let n=this;if(n.constructor===w||n.constructor===E){let o=e instanceof l?new l(e.type,e.data,"l"):new l(e,t,"l"),c="string"!=typeof e?e:new l(e,t,r);return[...Object.getOwnPropertyNames(n)].forEach((e=>{n[e]?.trigger&&"function"==typeof n[e]?.trigger&&n[e]?.trigger(o)})),void(/[ud]/.test(c.bubble)&&O(n.target,c))}if(n instanceof w||n instanceof E){const n=this,o="string"!=typeof e?e:new l(e,t,r),c="on"+o.type[0].toUpperCase()+o.type.slice(1);if(o.bubble.indexOf("l")>-1&&(o.immediateStopped||"function"!=typeof n[c]||(n[c](o),n.hasOwnProperty(c)&&delete n[c])),o.stopped||"l"===o.bubble)return n;/[ud]/.test(o.bubble)&&O(n.target,o)}}}class E extends v{_mc={};constructor(e,t=!1){super(e)}static add=h;static remove=m;static trigger=y;trigger(e,t={},r){w.prototype.trigger.call(this,e,t,r)}parent(e=""){let t=this.target;return b(t)?p(t.parentNode,e,!0):[]}ancestors(e=""){let t=this?.target;return b(t)?p(this.target.parentNode,e,!1):[]}children(e=""){let t=this?.target;if(!b(t))return[];const r=Math.random().toString().replace(".",""),n='[_mc]:not([temp_id="'+r+'"] [_mc] [_mc])';t.setAttribute("temp_id",r);const o=d([...t.querySelectorAll(n)],e);return t.removeAttribute("temp_id"),o}descendants(e=""){let t=this?.target;return b(t)?d([...t.querySelectorAll("*[_mc]")],e):[]}}function j(e){return null!=e&&"object"==typeof e}function S(e){let t=new Set,r=/\{[^\{\}]*\}/g;return e.getAttributeNames().filter((t=>e.getAttribute(t)?.match(r))).forEach((n=>{new Set(e.getAttribute(n)?.match(r)).forEach((e=>t.add(e.replace(/[\{\}]/g,""))))})),[...e.childNodes].filter((e=>3===e.nodeType&&(e.nodeValue||"").match(r))).forEach((e=>{(e.nodeValue||"").match(r).forEach((e=>{t.add(e.replace(/[\{\}]/g,""))}))})),[...t].map((e=>e.replace(/[\{\}]/g,""))),[...t]}new Map;const _=[HTMLInputElement,HTMLSelectElement,HTMLTextAreaElement];class A extends E{data={};oldDisplay="";constructor(e){super(e);let t=this;S(e).forEach((e=>t.data[e]="")),k(t),t.#o(),delete t._mc}#o(){let e=this,t=e.target,r=!1;t.getAttributeNames().filter((e=>t.getAttribute(e)?.match(/\{[^\{\}]*\}/g))).forEach((r=>{let n=new Set(t.getAttribute(r)?.match(/\{[^\{\}]*\}/g));var o;e.data.observe((o=t.getAttribute(r),e=>{let c=o;n.forEach((t=>{c=c.replace(t,e[t.replace(/[\{\}]/g,"")])})),t.setAttribute(r,c)}))})),[...t.childNodes].filter((e=>3===e.nodeType&&(e.nodeValue||"").match(/\{[^\{\}]*\}/g))).forEach((n=>{r=!0;let o=new Set(n.nodeValue.match(/\{[^\{\}]*\}/g));var c;e.data.observe((c=n.nodeValue,r=>{let a=c;o.forEach((e=>{a=a.replace(e,r[e.replace(/[\{\}]/g,"")])})),Object.keys(r).some((e=>!!r[e]))&&(e.oldDisplay?t.style=e.oldDisplay:t.removeAttribute("style"),delete e.oldDisplay),n.nodeValue=a})),e.oldDisplay=t.getAttribute("style)")||"",r&&!_.includes(t.constructor)&&"FIELDSET"!==t.tagName&&(t.style.display="none")}))}onData(e){let t=this,r={};Object.keys(e.data).forEach((n=>{t.data.hasOwnProperty(n)&&(r[n]=e.data[n])})),JSON.stringify(r)!==JSON.stringify(t.data)&&Object.assign(t.data,r)}}const k=(e,t)=>((t?[t]:[...Object.getOwnPropertyNames(e)]).forEach((t=>{if("_"===t[0]||void 0===e?.[t])return e;let r,s=e[t];if(!s.prototype)switch(typeof s){case"string":r=String;break;case"number":r=Number;break;case"boolean":r=Boolean;break;case"object":r=s instanceof Array?Array:Object;break;default:return}let i=class extends r{#c=!0;constructor(e){super(e),this.constructor.callbacks=[],j(e)&&Object.getOwnPropertyNames(e).forEach((t=>{this[t]=e[t]}))}observe(e){return this.constructor.callbacks.push(e),this}bind(e){const t=this;if(j(t.valueOf())){!function(e){var t;(t=e,(t instanceof HTMLElement?[t]:[]).concat([...t.querySelectorAll("*")]).filter((e=>!!S(e).length)).filter((e=>"STYLE"!==e.tagName))).forEach((e=>{e?._mc?._placeholders||E.add(e,"_placeholders",new A(e))}))}(e);const r=[...e.querySelectorAll("[_mc]")].filter((e=>!!e?._mc?._placeholders)),o=function(e){let t=n(e);r.forEach((e=>{e&&e._mc.trigger("data",t)}))};t.constructor.callbacks.push(o),t.notify()}else console.warn("IGNORED - cannot bind a non-Object to the dom, IS:",typeof t.valueOf(),t);return this}notify(e){let t=this,r=j(t.valueOf())&&t.valueOf()instanceof Array==0?structuredClone(Object.assign({},t)):t.valueOf();return void 0!==e&&(t.#c=e),t.constructor.callbacks.forEach((e=>{e(r)})),t}},l=new i(s);Object.defineProperty(e,t,{enumerable:!0,get(){if(j(l.valueOf())){let e=structuredClone(Object.assign({},l));setTimeout(c((function(){o(structuredClone(Object.assign({},l)),e)||l.notify()}),0),0)}return l},set(e){if(typeof e==typeof l.valueOf())if(j(l.valueOf())&&l.valueOf()instanceof Array==0){let t=structuredClone(Object.assign({},l));l instanceof i==0&&(l=new i(structuredClone(Object.assign({},e))),a(e,l),l.seal()),Object.assign(l,e),setTimeout(c((function(){o(structuredClone(Object.assign({},l)),t)||l.notify()}),0),0)}else{let t=l.valueOf(),r=l.constructor.callbacks;l=new i(e),l.constructor.callbacks=r,e!==t&&l.notify()}else console.warn("IGNORED - cannot change observable types, IS:",typeof l.valueOf(),l,"- CANNOT BECOME:",typeof e)}}),e[t]=s})),e);class N{constructor(e){}}class T extends N{#a;constructor(e){super(e),this.#a=e}get val(){return new FormData(this.#a.form).get(this.#a.name)}set val(e){[...this.#a.form.querySelectorAll(`input[type="radio"][name="${this.#a.name}"]`)].filter((t=>t.getAttribute("value")===e)).shift().checked=!0}}class x extends N{#a;constructor(e){super(e),this.#a=e}get val(){return this.#a.checked}set val(e){this.#a.checked=e}}class P extends N{#a;constructor(e){super(e),this.#a=e}get val(){return this.#a.value}set val(e){this.#a.value=e}}class L extends N{#a;#s=!1;constructor(e){super(e),this.#a=e,this.#s=e.multiple}get val(){const e=[];return[...this.#a.querySelectorAll("option")].filter((e=>e.selected)).forEach((t=>{e.push(t.value)})),this.#s?e:e.length?e[0]:""}set val(e){e="string"==typeof e?[e]:e,[...this.#a.querySelectorAll("option")].forEach((t=>{e.indexOf(t.value)>-1?t.selected=!0:t.selected=!1}))}}class M extends N{#a;constructor(e){super(e),this.#a=e}get val(){return this.#a.value||""}set val(e){this.#a.value=e}}class C{constructor(e,t,r){let n=(e=>{let t=[...(e||document).querySelectorAll("input,select,textarea")],r={};return t.forEach((e=>{const t=e.getAttribute("name");if(t){let n=!1;switch((e=>e.tagName.toLowerCase())(e)){case"input":switch(e.type){case"radio":n=new T(e);break;case"checkbox":n=new x(e);break;default:n=new P(e)}break;case"select":n=new L(e);break;case"textarea":n=new M(e);break;default:console.warn("handler missing:",t,"for",e.tagName.toLowerCase(),e)}n&&(E.add(e,t,n),Object.defineProperty(r,t,{enumerable:!0,configurable:!0,get:()=>n.val,set:e=>{n.val!==e&&(n.val=e)}}))}})),r})(r);e[t]=Object.assign({},n),k(e,t),a(n,e[t]),[...r.querySelectorAll("input, textarea, select")].forEach((r=>{g(r,"keyup",(r=>{e[t].notify()})),g(r,"change",(r=>{e[t].notify()})),g(r,"select",(r=>{e[t].notify()}))}))}}return t})()));
|
|
1
|
+
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.formValues=t():e.formValues=t()}(this,(()=>(()=>{"use strict";var e={d:(t,r)=>{for(var n in r)e.o(r,n)&&!e.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:r[n]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};function r(e){let t={};return[...Object.keys(e)].sort().forEach((n=>{var o;(o=e[n])&&o.constructor&&o.constructor===Object?t[n]=r(e[n]):t[n]=e[n]})),t}function n(e,t=!0){let o={};return[...Object.getOwnPropertyNames(e)].forEach((t=>{if(e[t]&&e[t].constructor&&e[t].constructor===Object){const r=n(e[t],!1);for(const e in r)o[t+"."+e]=r[e]}else o[t]=e[t]})),t?r(o):o}function o(e,t){return JSON.stringify(n(e))===JSON.stringify(n(t))}function c(e,t){let r;return()=>{clearTimeout(r),r=setTimeout((function(){e(...arguments)}),t)}}function a(e,t){const r=Object.getOwnPropertyDescriptors(e);for(const[e,n]of Object.entries(r))("get"in n||"set"in n)&&Object.defineProperty(t,e,n)}e.r(t),e.d(t,{formValues:()=>D});var s=new Function("try {return this===window;}catch(e){ return false;}");let i=new Set;s()&&Object.keys(HTMLElement.prototype).filter((e=>/^on/.test(e))).forEach((e=>i.add(e)));class l{#e;#t=!1;#r=!1;constructor(e,t={},r="l"){this.#e=e,this.data=t,this.bubble=r}get type(){return this.#e}get stopped(){return this.#t}get immediateStopped(){return this.#r}stopPropagation(){this.#t=!0}stopImmediatePropagation(){this.stopPropagation(),this.#r=!0}}var u=new Function("try {return this===window;}catch(e){ return false;}");let f=new Set;function d(e,t){let r=[];return e.forEach((e=>{if(e&&e instanceof HTMLElement){const n=e?._mc;!t&&n?r=r.concat(Object.values(e._mc)):t&&n&&n[t]&&r.push(n[t])}})),r}function p(e,t,r=!0){let n=[];for(;e;){if(e._mc&&(t?t&&e._mc[t]&&n.push(e._mc[t]):n=n.concat(Object.values(e._mc)),r))return n;e=e.parentNode}return n}function b(e){return e&&e instanceof HTMLElement}function g(e,t,r,n=!1,o=!1){let c={once:!1};n&&(c.capture=n),o&&(c.once=o),e.addEventListener(t,r,c)}function h(e,t,r={}){let n=e;if(!n._mc){let t=E?.debug;E.debug=!1,n._mc=new E(e),E.debug=t,delete n._mc._mc}const o=n._mc;return t.length&&!o[t]&&(o[t]=r,e instanceof HTMLElement&&e.setAttribute("_mc","")),r}function m(e,t){if(!t)return;const r=e?._mc||{};r&&r[t]&&delete r[t],!Object.keys(r).length&&e instanceof HTMLElement&&e.hasAttribute("_mc")&&e.removeAttribute("_mc")}function y(e,t,r={},n="l"){let o=e?._mc;if(!o)return;let c=t instanceof l?new l(t.type,t.data,"l"):new l(t,r,"l"),a="string"!=typeof t?t:new l(t,r,n);[...Object.values(o)].forEach((e=>{e?.trigger&&"function"==typeof e?.trigger&&e?.trigger(c)})),/[ud]/.test(a.bubble)&&O(e,a)}function O(e,t){/[ud]/.test(t.bubble)&&setTimeout((()=>{if(-1===t.bubble.indexOf("l")&&(t.bubble+="l"),t.bubble.indexOf("u")>-1){let r=p(e,"",!0)?.[0].target;r&&E.trigger(r,t)}t.bubble.indexOf("d")>-1&&new Set(e._mc.children().map((e=>e?.target))).forEach((e=>{e&&E.trigger(e,t)}))}),0)}u()&&Object.keys(HTMLElement.prototype).filter((e=>/^on/.test(e))).forEach((e=>f.add(e)));class v{#n;constructor(e,t=!1){var r;this.#n=new WeakRef(e||{}),(r=this).constructor!==E&&setTimeout((()=>{r.trigger("Init")}),0),function(e){if(!u()||e.constructor===E)return;const t=e.target;if(t instanceof HTMLElement){let r=e;Object.getOwnPropertyNames(r.constructor.prototype).filter((e=>/^on[A-Z]|one[A-Z]/.test(e)&&"function"==typeof r.constructor.prototype[e])).forEach((n=>{let o=/^one/.test(n),c=n.replace(/^on[e]{0,1}/,""),a=c.toLowerCase();o&&Object.defineProperty(e,"on"+c,{configurable:!0,enumerable:!1,writable:!0,value:e=>{r.constructor.prototype[n].bind(r)(e)}}),f.has("on"+a)&&g(t,a,(e=>{r.trigger(c,e)}),!1,o)}))}}(this)}get target(){return this.#n.deref()}}class w extends v{_mc={};constructor(e){super(e)}static trigger=y;trigger(e,t={},r="l"){let n=this;if(n.constructor===w||n.constructor===E){let o=e instanceof l?new l(e.type,e.data,"l"):new l(e,t,"l"),c="string"!=typeof e?e:new l(e,t,r);return[...Object.getOwnPropertyNames(n)].forEach((e=>{n[e]?.trigger&&"function"==typeof n[e]?.trigger&&n[e]?.trigger(o)})),void(/[ud]/.test(c.bubble)&&O(n.target,c))}if(n instanceof w||n instanceof E){const n=this,o="string"!=typeof e?e:new l(e,t,r),c="on"+o.type[0].toUpperCase()+o.type.slice(1);if(o.bubble.indexOf("l")>-1&&(o.immediateStopped||"function"!=typeof n[c]||(n[c](o),n.hasOwnProperty(c)&&delete n[c])),o.stopped||"l"===o.bubble)return n;/[ud]/.test(o.bubble)&&O(n.target,o)}}}class E extends v{_mc={};constructor(e,t=!1){super(e)}static add=h;static remove=m;static trigger=y;trigger(e,t={},r){w.prototype.trigger.call(this,e,t,r)}parent(e=""){let t=this.target;return b(t)?p(t.parentNode,e,!0):[]}ancestors(e=""){let t=this?.target;return b(t)?p(this.target.parentNode,e,!1):[]}children(e=""){let t=this?.target;if(!b(t))return[];const r=Math.random().toString().replace(".",""),n='[_mc]:not([temp_id="'+r+'"] [_mc] [_mc])';t.setAttribute("temp_id",r);const o=d([...t.querySelectorAll(n)],e);return t.removeAttribute("temp_id"),o}descendants(e=""){let t=this?.target;return b(t)?d([...t.querySelectorAll("*[_mc]")],e):[]}}function j(e){return null!=e&&"object"==typeof e}function S(e){let t=new Set,r=/\{[^\{\}]*\}/g;return e.getAttributeNames().filter((t=>e.getAttribute(t)?.match(r))).forEach((n=>{new Set(e.getAttribute(n)?.match(r)).forEach((e=>t.add(e.replace(/[\{\}]/g,""))))})),[...e.childNodes].filter((e=>3===e.nodeType&&(e.nodeValue||"").match(r))).forEach((e=>{(e.nodeValue||"").match(r).forEach((e=>{t.add(e.replace(/[\{\}]/g,""))}))})),[...t].map((e=>e.replace(/[\{\}]/g,"")))}new Map;const _=[HTMLInputElement,HTMLSelectElement,HTMLTextAreaElement];class A extends E{data={};oldDisplay="";constructor(e){super(e);let t=this;S(e).forEach((e=>t.data[e]="")),k(t),t.#o(),delete t._mc}#o(){let e=this,t=e.target,r=!1;t.getAttributeNames().filter((e=>t.getAttribute(e)?.match(/\{[^\{\}]*\}/g))).forEach((r=>{let n=new Set(t.getAttribute(r)?.match(/\{[^\{\}]*\}/g));var o;e.data.observe((o=t.getAttribute(r),e=>{let c=o;n.forEach((t=>{c=c.replace(t,e[t.replace(/[\{\}]/g,"")])})),t.setAttribute(r,c)}))})),[...t.childNodes].filter((e=>3===e.nodeType&&(e.nodeValue||"").match(/\{[^\{\}]*\}/g))).forEach((n=>{r=!0;let o=new Set(n.nodeValue.match(/\{[^\{\}]*\}/g));var c;e.data.observe((c=n.nodeValue,r=>{let a=c;o.forEach((e=>{a=a.replace(e,r[e.replace(/[\{\}]/g,"")])})),Object.keys(r).some((e=>!!r[e]))&&(e.oldDisplay?t.style=e.oldDisplay:t.removeAttribute("style"),delete e.oldDisplay),n.nodeValue=a})),e.oldDisplay=t.getAttribute("style)")||"",r&&!_.includes(t.constructor)&&"FIELDSET"!==t.tagName&&(t.style.display="none")}))}onData(e){let t=this,r={};Object.keys(e.data).forEach((n=>{t.data.hasOwnProperty(n)&&(r[n]=e.data[n])})),JSON.stringify(r)!==JSON.stringify(t.data)&&Object.assign(t.data,r)}}const k=(e,t)=>((t?[t]:[...Object.getOwnPropertyNames(e)]).forEach((t=>{if("_"===t[0]||void 0===e?.[t])return e;let r,s=e[t];if(!s.prototype)switch(typeof s){case"string":r=String;break;case"number":r=Number;break;case"boolean":r=Boolean;break;case"object":r=s instanceof Array?Array:Object;break;default:return}let i=class extends r{#c=!0;constructor(e){super(e),this.constructor.callbacks=[],j(e)&&Object.getOwnPropertyNames(e).forEach((t=>{this[t]=e[t]}))}observe(e){return this.constructor.callbacks.push(e),this}bind(e){const t=this;if(j(t.valueOf())){!function(e){var t;(t=e,(t instanceof HTMLElement?[t]:[]).concat([...t.querySelectorAll("*")]).filter((e=>!!S(e).length)).filter((e=>"STYLE"!==e.tagName))).forEach((e=>{e?._mc?._placeholders||E.add(e,"_placeholders",new A(e))}))}(e);const r=[...e.querySelectorAll("[_mc]")].filter((e=>!!e?._mc?._placeholders)),o=function(e){let t=n(e);r.forEach((e=>{e&&e._mc.trigger("data",t)}))};t.constructor.callbacks.push(o),t.notify()}else console.warn("IGNORED - cannot bind a non-Object to the dom, IS:",typeof t.valueOf(),t);return this}notify(e){let t=this,r=j(t.valueOf())&&t.valueOf()instanceof Array==0?structuredClone(Object.assign({},t)):t.valueOf();return void 0!==e&&(t.#c=e),t.constructor.callbacks.forEach((e=>{e(r)})),t}},l=new i(s);Object.defineProperty(e,t,{enumerable:!0,get(){if(j(l.valueOf())){let e=structuredClone(Object.assign({},l));setTimeout(c((function(){o(structuredClone(Object.assign({},l)),e)||l.notify()}),0),0)}return l},set(e){if(typeof e==typeof l.valueOf())if(j(l.valueOf())&&l.valueOf()instanceof Array==0){let t=structuredClone(Object.assign({},l));l instanceof i==0&&(l=new i(structuredClone(Object.assign({},e))),a(e,l),l.seal()),Object.assign(l,e),setTimeout(c((function(){o(structuredClone(Object.assign({},l)),t)||l.notify()}),0),0)}else{let t=l.valueOf(),r=l.constructor.callbacks;l=new i(e),l.constructor.callbacks=r,e!==t&&l.notify()}else console.warn("IGNORED - cannot change observable types, IS:",typeof l.valueOf(),l,"- CANNOT BECOME:",typeof e)}}),e[t]=s})),e);class N{constructor(e){}}class T extends N{#a;constructor(e){super(e),this.#a=e}get val(){return new FormData(this.#a.form).get(this.#a.name)}set val(e){[...this.#a.form.querySelectorAll(`input[type="radio"][name="${this.#a.name}"]`)].filter((t=>t.getAttribute("value")===e)).shift().checked=!0}}class x extends N{#a;constructor(e){super(e),this.#a=e}get val(){return this.#a.checked}set val(e){this.#a.checked=e}}class P extends N{#a;constructor(e){super(e),this.#a=e}get val(){return this.#a.value}set val(e){this.#a.value=e}}class L extends N{#a;#s=!1;constructor(e){super(e),this.#a=e,this.#s=e.multiple}get val(){const e=[];return[...this.#a.querySelectorAll("option")].filter((e=>e.selected)).forEach((t=>{e.push(t.value)})),this.#s?e:e.length?e[0]:""}set val(e){e="string"==typeof e?[e]:e,[...this.#a.querySelectorAll("option")].forEach((t=>{e.indexOf(t.value)>-1?t.selected=!0:t.selected=!1}))}}class M extends N{#a;constructor(e){super(e),this.#a=e}get val(){return this.#a.value||""}set val(e){this.#a.value=e}}const C=e=>{let t=[...(e||document).querySelectorAll("input,select,textarea")],r={};return t.forEach((e=>{const t=e.getAttribute("name");if(t){let n=!1;switch((e=>e.tagName.toLowerCase())(e)){case"input":switch(e.type){case"radio":n=new T(e);break;case"checkbox":n=new x(e);break;default:n=new P(e)}break;case"select":n=new L(e);break;case"textarea":n=new M(e);break;default:console.warn("handler missing:",t,"for",e.tagName.toLowerCase(),e)}n&&(E.add(e,t,n),Object.defineProperty(r,t,{enumerable:!0,configurable:!0,get:()=>n.val,set:e=>{n.val!==e&&(n.val=e)}}))}})),r};function D(e,t,r){let n=C(r);e[t]=Object.assign({},n),k(e,t),a(n,e[t]),[...r.querySelectorAll("input, textarea, select")].forEach((r=>{g(r,"keyup",(r=>{e[t].notify()})),g(r,"change",(r=>{e[t].notify()})),g(r,"select",(r=>{e[t].notify()}))}))}return t})()));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.microcomponents=t():e.microcomponents=t()}(this,(()=>(()=>{"use strict";var e={d:(t,r)=>{for(var n in r)e.o(r,n)&&!e.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:r[n]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};function r(e){return e&&e.constructor&&e.constructor===Object}function n(e){let t={};return[...Object.keys(e)].sort().forEach((a=>{r(e[a])?t[a]=n(e[a]):t[a]=e[a]})),t}function a(e,t=!0){let r={};return[...Object.getOwnPropertyNames(e)].forEach((t=>{if(e[t]&&e[t].constructor&&e[t].constructor===Object){const n=a(e[t],!1);for(const e in n)r[t+"."+e]=n[e]}else r[t]=e[t]})),t?n(r):r}function s(e,t){return JSON.stringify(a(e))===JSON.stringify(a(t))}function o(e,t={}){let r=e.constructor===String?e.split("."):e;if(t&&r[0]&&t[r[0]])return t[r[0]].constructor===Object&&r.length>1?o(r.splice(1),t[r[0]]):t[r[0]];console.warn("ns",r[0],"not in",t)}function c(e,t){var n=Array.from(arguments);if(n.length>2){for(;n.length>1;)n[0]=c(n[0],n[1]),n.splice(1,1);return n[0]}if("string"==typeof e)e.match(/\{[^\{\}]*\}/g)?.forEach((function(r){var n=o(r.substring(1,r.length-1),t);void 0!==n&&(e=e.replace(r,n))}));else if(r(e))switch(e.constructor){case Object:Object.keys(e).forEach((function(r){e.hasOwnProperty(r)&&(e[r]=c(e[r],t))}));break;case Array:e.forEach((function(r,n,a){a[n]=c(e[n],t)}))}return e}function i(e){return e.split("-").map((e=>e.charAt(0).toUpperCase()+e.slice(1))).join("")}function l(e,t){let r;return()=>{clearTimeout(r),r=setTimeout((function(){e(...arguments)}),t)}}function u(e){let t=document.createElement("template");return e=e.replace(/<([A-Za-z0-9\-]*)([^>\/]*)(\/>)/gi,"<$1$2></$1>"),t.innerHTML=e,t.content.normalize(),Array.from(t.content.childNodes)}function h(e,t){const r=Object.getOwnPropertyDescriptors(e);for(const[e,n]of Object.entries(r))("get"in n||"set"in n)&&Object.defineProperty(t,e,n)}e.r(t),e.d(t,{$d:()=>Y,$t:()=>K,DC:()=>N,FormValues:()=>ae,MC:()=>k,McBase:()=>x,McEvent:()=>p,addListener:()=>v,autoload:()=>M,copyGettersSetters:()=>h,debounce:()=>l,deepEqual:()=>s,defineCE:()=>$,flattenObject:()=>a,getCE:()=>H,htmlToElements:()=>u,isNativeObject:()=>r,kebabToPascal:()=>i,nameSpace:()=>o,observe:()=>V,parse:()=>c,removeListener:()=>O,sortObject:()=>n});var f=new Function("try {return this===window;}catch(e){ return false;}");let d=new Set;f()&&Object.keys(HTMLElement.prototype).filter((e=>/^on/.test(e))).forEach((e=>d.add(e)));class p{#e;#t=!1;#r=!1;constructor(e,t={},r="l"){this.#e=e,this.data=t,this.bubble=r}get type(){return this.#e}get stopped(){return this.#t}get immediateStopped(){return this.#r}stopPropagation(){this.#t=!0}stopImmediatePropagation(){this.stopPropagation(),this.#r=!0}}var m=new Function("try {return this===window;}catch(e){ return false;}");let g=new Set;function b(e,t){let r=[];return e.forEach((e=>{if(e&&e instanceof HTMLElement){const n=e?._mc;!t&&n?r=r.concat(Object.values(e._mc)):t&&n&&n[t]&&r.push(n[t])}})),r}function y(e,t,r=!0){let n=[];for(;e;){if(e._mc&&(t?t&&e._mc[t]&&n.push(e._mc[t]):n=n.concat(Object.values(e._mc)),r))return n;e=e.parentNode}return n}function E(e){return e&&e instanceof HTMLElement}function v(e,t,r,n=!1,a=!1){let s={once:!1};n&&(s.capture=n),a&&(s.once=a),e.addEventListener(t,r,s)}function O(e,t,r){e.removeEventListener(t,r)}function w(e,t,r={}){let n=e;if(!n._mc){let t=N?.debug;N.debug=!1,n._mc=new N(e),N.debug=t,delete n._mc._mc}const a=n._mc;return t.length&&!a[t]&&(a[t]=r,e instanceof HTMLElement&&e.setAttribute("_mc","")),r}function S(e,t){if(!t)return;const r=e?._mc||{};r&&r[t]&&delete r[t],!Object.keys(r).length&&e instanceof HTMLElement&&e.hasAttribute("_mc")&&e.removeAttribute("_mc")}function A(e,t,r={},n="l"){let a=e?._mc;if(!a)return;let s=t instanceof p?new p(t.type,t.data,"l"):new p(t,r,"l"),o="string"!=typeof t?t:new p(t,r,n);[...Object.values(a)].forEach((e=>{e?.trigger&&"function"==typeof e?.trigger&&e?.trigger(s)})),/[ud]/.test(o.bubble)&&j(e,o)}function j(e,t){/[ud]/.test(t.bubble)&&setTimeout((()=>{if(-1===t.bubble.indexOf("l")&&(t.bubble+="l"),t.bubble.indexOf("u")>-1){let r=y(e,"",!0)?.[0].target;r&&N.trigger(r,t)}t.bubble.indexOf("d")>-1&&new Set(e._mc.children().map((e=>e?.target))).forEach((e=>{e&&N.trigger(e,t)}))}),0)}m()&&Object.keys(HTMLElement.prototype).filter((e=>/^on/.test(e))).forEach((e=>g.add(e)));class x{#n;constructor(e,t=!1){var r;this.#n=new WeakRef(e||{}),(r=this).constructor!==N&&setTimeout((()=>{r.trigger("Init")}),0),function(e){if(!m()||e.constructor===N)return;const t=e.target;if(t instanceof HTMLElement){let r=e;Object.getOwnPropertyNames(r.constructor.prototype).filter((e=>/^on[A-Z]|one[A-Z]/.test(e)&&"function"==typeof r.constructor.prototype[e])).forEach((n=>{let a=/^one/.test(n),s=n.replace(/^on[e]{0,1}/,""),o=s.toLowerCase();a&&Object.defineProperty(e,"on"+s,{configurable:!0,enumerable:!1,writable:!0,value:e=>{r.constructor.prototype[n].bind(r)(e)}}),g.has("on"+o)&&v(t,o,(e=>{r.trigger(s,e)}),!1,a)}))}}(this)}get target(){return this.#n.deref()}}class k extends x{_mc={};constructor(e){super(e)}static trigger=A;trigger(e,t={},r="l"){let n=this;if(n.constructor===k||n.constructor===N){let a=e instanceof p?new p(e.type,e.data,"l"):new p(e,t,"l"),s="string"!=typeof e?e:new p(e,t,r);return[...Object.getOwnPropertyNames(n)].forEach((e=>{n[e]?.trigger&&"function"==typeof n[e]?.trigger&&n[e]?.trigger(a)})),void(/[ud]/.test(s.bubble)&&j(n.target,s))}if(n instanceof k||n instanceof N){const n=this,a="string"!=typeof e?e:new p(e,t,r),s="on"+a.type[0].toUpperCase()+a.type.slice(1);if(a.bubble.indexOf("l")>-1&&(a.immediateStopped||"function"!=typeof n[s]||(n[s](a),n.hasOwnProperty(s)&&delete n[s])),a.stopped||"l"===a.bubble)return n;/[ud]/.test(a.bubble)&&j(n.target,a)}}}class N extends x{_mc={};constructor(e,t=!1){super(e)}static add=w;static remove=S;static trigger=A;trigger(e,t={},r){k.prototype.trigger.call(this,e,t,r)}parent(e=""){let t=this.target;return E(t)?y(t.parentNode,e,!0):[]}ancestors(e=""){let t=this?.target;return E(t)?y(this.target.parentNode,e,!1):[]}children(e=""){let t=this?.target;if(!E(t))return[];const r=Math.random().toString().replace(".",""),n='[_mc]:not([temp_id="'+r+'"] [_mc] [_mc])';t.setAttribute("temp_id",r);const a=b([...t.querySelectorAll(n)],e);return t.removeAttribute("temp_id"),a}descendants(e=""){let t=this?.target;return E(t)?b([...t.querySelectorAll("*[_mc]")],e):[]}}let _=null;const T=new Map;function C(){document.querySelectorAll(':not(:defined),[_mc]:not([_mc=""])').forEach((e=>{(e.tagName.includes("-")?[e.tagName.toLowerCase()]:e.getAttribute("_mc").trim().split(" ")).forEach((t=>{let r=t.toLowerCase().split("-"),n=r[r.length-1],a=n[0].toUpperCase()+n.slice(1);if(r[r.length-1]=a,r=r.join("/")+".js",e.tagName.includes("-")&&!T.has(e.tagName.toLowerCase())){const e=document.createElement("script");T.set(t,r),e.setAttribute("src",r),e.setAttribute("blocking","render"),e.setAttribute("type","module"),e.onload=()=>{T.delete(t)},document.head.append(e)}}))}))}let L=!1;function M(e=!0){return e?(L=e,_=new MutationObserver(C),setTimeout((()=>{_.observe(document.body,{childList:!0,subtree:!0}),C()}),5),L):(_?.disconnect(),_=null,L)}class P extends HTMLElement{constructor(){super()}connectedCallback(){N.trigger(this,"Connected")}disconnectedCallback(){N.trigger(this,"Disconnected")}adoptedCallback(){N.trigger(this,"Adopted")}attributeChangedCallback(e,t,r){N.trigger(this,"AttributeChanged",{name:e,oldValue:t,newValue:r})}}function $(e,t,r=[]){if(customElements.get(e))return void console.warn(`IGNORED: Custom element "${e}" is already defined!`);if(!e.includes("-"))throw new Error('createCustomElement: tagName must contain at least one hyphen ("-").');let n=i(e);customElements.define(e,function(e,t){return Object.defineProperty(t,"name",{value:e})}(n,class extends P{instance;constructor(e){super();let r=new t(this,e);N.add(this,n,r)}static get observedAttributes(){return r}}))}function H(e){return customElements.get(e)}function q(e){return null!=e&&"object"==typeof e}function D(e){let t=new Set,r=/\{[^\{\}]*\}/g;return e.getAttributeNames().filter((t=>e.getAttribute(t)?.match(r))).forEach((n=>{new Set(e.getAttribute(n)?.match(r)).forEach((e=>t.add(e.replace(/[\{\}]/g,""))))})),[...e.childNodes].filter((e=>3===e.nodeType&&(e.nodeValue||"").match(r))).forEach((e=>{(e.nodeValue||"").match(r).forEach((e=>{t.add(e.replace(/[\{\}]/g,""))}))})),[...t].map((e=>e.replace(/[\{\}]/g,""))),[...t]}const I=[HTMLInputElement,HTMLSelectElement,HTMLTextAreaElement];class B extends N{data={};oldDisplay="";constructor(e){super(e);let t=this;D(e).forEach((e=>t.data[e]="")),V(t),t.#a(),delete t._mc}#a(){let e=this,t=e.target,r=!1;t.getAttributeNames().filter((e=>t.getAttribute(e)?.match(/\{[^\{\}]*\}/g))).forEach((r=>{let n=new Set(t.getAttribute(r)?.match(/\{[^\{\}]*\}/g));var a;e.data.observe((a=t.getAttribute(r),e=>{let s=a;n.forEach((t=>{s=s.replace(t,e[t.replace(/[\{\}]/g,"")])})),t.setAttribute(r,s)}))})),[...t.childNodes].filter((e=>3===e.nodeType&&(e.nodeValue||"").match(/\{[^\{\}]*\}/g))).forEach((n=>{r=!0;let a=new Set(n.nodeValue.match(/\{[^\{\}]*\}/g));var s;e.data.observe((s=n.nodeValue,r=>{let o=s;a.forEach((e=>{o=o.replace(e,r[e.replace(/[\{\}]/g,"")])})),Object.keys(r).some((e=>!!r[e]))&&(e.oldDisplay?t.style=e.oldDisplay:t.removeAttribute("style"),delete e.oldDisplay),n.nodeValue=o})),e.oldDisplay=t.getAttribute("style)")||"",r&&!I.includes(t.constructor)&&"FIELDSET"!==t.tagName&&(t.style.display="none")}))}onData(e){let t=this,r={};Object.keys(e.data).forEach((n=>{t.data.hasOwnProperty(n)&&(r[n]=e.data[n])})),JSON.stringify(r)!==JSON.stringify(t.data)&&Object.assign(t.data,r)}}const V=(e,t)=>((t?[t]:[...Object.getOwnPropertyNames(e)]).forEach((t=>{if("_"===t[0]||void 0===e?.[t])return e;let r,n=e[t];if(!n.prototype)switch(typeof n){case"string":r=String;break;case"number":r=Number;break;case"boolean":r=Boolean;break;case"object":r=n instanceof Array?Array:Object;break;default:return}let o=class extends r{#s=!0;constructor(e){super(e),this.constructor.callbacks=[],q(e)&&Object.getOwnPropertyNames(e).forEach((t=>{this[t]=e[t]}))}observe(e){return this.constructor.callbacks.push(e),this}bind(e){const t=this;if(q(t.valueOf())){!function(e){var t;(t=e,(t instanceof HTMLElement?[t]:[]).concat([...t.querySelectorAll("*")]).filter((e=>!!D(e).length)).filter((e=>"STYLE"!==e.tagName))).forEach((e=>{e?._mc?._placeholders||N.add(e,"_placeholders",new B(e))}))}(e);const r=[...e.querySelectorAll("[_mc]")].filter((e=>!!e?._mc?._placeholders)),n=function(e){let t=a(e);r.forEach((e=>{e&&e._mc.trigger("data",t)}))};t.constructor.callbacks.push(n),t.notify()}else console.warn("IGNORED - cannot bind a non-Object to the dom, IS:",typeof t.valueOf(),t);return this}notify(e){let t=this,r=q(t.valueOf())&&t.valueOf()instanceof Array==0?structuredClone(Object.assign({},t)):t.valueOf();return void 0!==e&&(t.#s=e),t.constructor.callbacks.forEach((e=>{e(r)})),t}},c=new o(n);Object.defineProperty(e,t,{enumerable:!0,get(){if(q(c.valueOf())){let e=structuredClone(Object.assign({},c));setTimeout(l((function(){s(structuredClone(Object.assign({},c)),e)||c.notify()}),0),0)}return c},set(e){if(typeof e==typeof c.valueOf())if(q(c.valueOf())&&c.valueOf()instanceof Array==0){let t=structuredClone(Object.assign({},c));c instanceof o==0&&(c=new o(structuredClone(Object.assign({},e))),h(e,c),c.seal()),Object.assign(c,e),setTimeout(l((function(){s(structuredClone(Object.assign({},c)),t)||c.notify()}),0),0)}else{let t=c.valueOf(),r=c.constructor.callbacks;c=new o(e),c.constructor.callbacks=r,e!==t&&c.notify()}else console.warn("IGNORED - cannot change observable types, IS:",typeof c.valueOf(),c,"- CANNOT BECOME:",typeof e)}}),e[t]=n})),e),z=e=>{let t=new Set;return e.forEach((e=>{(e=e.trim()).split(" ").forEach((e=>{""!==e&&t.add(e)}))})),Array.from(t)},F=e=>{let t=Y("input,select,textarea",e).array,r={};return t.forEach((t=>{const n=t.getAttribute("name")||"undefined";if(n){let a;switch((e=>e instanceof HTMLInputElement?"input":e instanceof HTMLSelectElement?"select":e instanceof HTMLTextAreaElement?"textarea":"")(t)){case"input":a=new G(t,e),Object.defineProperty(r,n,{enumerable:!0,configurable:!0,get:()=>a.val,set:e=>{a.val=e}});break;case"select":a=new R(t),Object.defineProperty(r,n,{enumerable:!0,configurable:!0,get:()=>a.val,set:e=>{a.val=e}});break;case"textarea":a=new U(t),Object.defineProperty(r,n,{enumerable:!0,configurable:!0,get:()=>a.val,set:e=>{a.val=e}});break;default:console.warn("handler missing:",n,"for",t)}}})),r};class J{constructor(e){}}class G extends J{#o;#e;#c;constructor(e,t){super(e),this.#o=e,this.#e=e.type,this.#c=t}get val(){let e,t=this;switch(t.#e){case"radio":const r=Y(`input[type="radio"][name="${this.#o.getAttribute("name")}"]`,this.#c).filter((e=>e.checked));return r.length?(e=r.array[0],e.value):"";case"checkbox":return t.#o.checked;default:return t.#o.value}return""}set val(e){let t=this;switch(t.#e){case"radio":const r=`input[type="radio"][name="${this.#o.getAttribute("name")}"]`,n=Y(r,this.#c);if(!n.length)return;if(""===e)return void n.forEach((e=>{e.checked&&(e.checked=!1)}));const a=n.filter((t=>t.getAttribute("value")===e));if(!a.length)return;return void(a.array[0].checked=!0);case"checkbox":t.#o.checked=e;break;default:t.#o.value=e}}}class R extends J{#o;#i=!1;constructor(e){super(e),this.#o=e,this.#i="select-multiple"===e.type}get val(){const e=[];return Y(this.#o.querySelectorAll("option")).filter((e=>e.selected)).forEach((t=>{t.selected&&e.push(t.value)})),this.#i?e:e.length?e[0]:""}set val(e){e="string"==typeof e?[e]:e,Y(this.#o.querySelectorAll("option")).forEach((t=>{e.indexOf(t.value)>-1?(t.setAttribute("selected",!0),t.selected=!0):(t.removeAttribute("selected"),t.selected=!1)}))}}class U extends J{#o;constructor(e){super(e),this.#o=e}get val(){return this.#o.value}set val(e){this.#o.value=e}}class W{#l=new Set;get set(){return this.#l}get array(){return Array.from(this.#l)}set set(e){this.#l=e}get length(){return this.#l.size}constructor(e,t=document.body){if(new Set,!e)return this}$t(e){let t=new Z;return this.#l.forEach((e=>{e._mc&&Object.values(e._mc).forEach((e=>{t.set.add(e)}))})),e&&t.filter((t=>t.nameSpace===e)),t}add(e,t){let r=this;return Y(e,t).forEach((e=>{r.#l.add(e)})),r}addClass(...e){return e=z(e),this.forEach((t=>{t.classList.add(...e)})),this}after(e,t){let r=this,n=Y(e,t);return n.length?(n.first().forEach((e=>{r.array.reverse().forEach((t=>{t.after(e)}))})),r):r}append(e,t){let r=this.array[0],n=Y(e,t);return r&&n.forEach((e=>{r.append(e)})),this}appendTo(e,t){let r=Y(e,t).array[0];return r&&this.forEach((e=>{r.append(e)})),this}attr(e,t){let r=this,n={};return r.length?arguments.length?"string"==typeof e?void 0===t?[...r.set][0].getAttribute(e):null===t?([...r.set].forEach((t=>{t.removeAttribute(e)})),r):("object"==typeof t&&(t=JSON.stringify(t)),[...r.set].forEach((r=>{r.setAttribute(e,t)})),r):"object"==typeof e?([...r.set].forEach((t=>{Object.keys(e).forEach((r=>{Y(t).attr(r,e.key)}))})),r):r:(Array.from([...r.set][0].attributes).forEach((e=>{n[e.name]=e.value})),n):r}before(e,t){let r=this,n=Y(e,t);return n.length?(n.first().forEach((e=>{r.forEach((t=>{t.before(e)}))})),r):r}children(e,t){let r=this,n=new Set;if(r.#l.forEach((e=>{Array.from(e.children).forEach((e=>{n.add(e)}))})),r=Y([...n]),e){let n=Y(e,t);r.filter((e=>n.has(e)))}return r}descendants(e,t){let r=this,n=new Set;if(r.#l.forEach((e=>{e.querySelectorAll("*").forEach((e=>{n.add(e)}))})),r=Y([...n]),e){let n=Y(e,t);r.filter((e=>n.has(e)))}return r}empty(){return this.filter((e=>!1))}first(e,t){let r=this,n=new Set,a=!1;return e&&(a=Y(e,t)),r.#l.forEach((e=>{e.parentNode&&n.add(e.parentNode.children[0])})),r=Y([...n]),e&&r.filter((e=>a.has(e))),r}has(e){return this.#l.has(e)}hasClass(...e){return e=z(e),this.every((e=>Array.from(e.classList).every((t=>e.contains(t)))))}html(e){let t=this;return e?(t.forEach((t=>{t.parentNode?t.innerHTML=e:(()=>{console.warn("Cannot access the .innerHTML of a HTMLElement that hasnt been inserted yet",t),console.trace(t,this),console.info("If you called this from inside a Web Component constructor, consider using the %c[connected] event callback!","color: blue;")})()})),t):t.array[0].innerHTML}last(e,t){let r=this,n=new Set;if(r.#l.forEach((e=>{let t=e.parentNode?.children;t&&n.add(Array.from(t).at(-1))})),r=Y([...n]),e){let n=Y(e,t);r.filter((e=>n.has(e)))}return r}next(e,t){let r=this,n=new Set;if(r.#l.forEach((e=>{let t=e.parentNode?.children;if(t){let r=Array.from(t),a=r.indexOf(e)+1;a<r.length&&n.add(r.at(a))}})),r=Y([...n]),e){let n=Y(e,t);r.filter((e=>n.has(e)))}return r}normalize(){return this.#l.forEach((e=>{e.normalize()})),this}off(e,t){let r=e.indexOf(" ")>-1?e.split(" "):[e];return this.array.forEach((e=>{r.forEach((function(r){O(e,r,t)}))})),this}on(e,t,r=!1,n=!1){let a=this,s=e.indexOf(" ")>-1?e.split(" ").filter((e=>""!==e)):[e];function o(){o.cb.apply(a,Array.from(arguments))}return o.cb=t,a.forEach((e=>{s.forEach((function(t){v(e,t,o,r,n)}))})),o}one(e,t,r=!1){let n=this,a=e.indexOf(" ")>-1?e.split(" ").filter((e=>""!==e)):[e];function s(){s.cb.apply(n,Array.from(arguments))}return s.cb=t,n.forEach((e=>{a.forEach((function(t){v(e,t,s,r,!0)}))})),s}parent(e,t){let r=this,n=new Set;if(r.#l.forEach((e=>{e.parentNode&&"HTML"!==e.parentNode.tagName&&n.add(e.parentNode)})),r=Y([...n]),e){let n=Y(e,t);r.filter((e=>n.has(e)))}return r}parents(e,t){let r=this,n=new Set;if(r.#l.forEach((e=>{let t=e;for(;t.parentNode&&"HTML"!==t.parentNode.tagName;)t=t.parentNode,n.add(t)})),r=Y([...n]),e){let n=Y(e,t);r.filter((e=>n.has(e)))}return r}prepend(e,t){let r=this.array[0],n=Y(e,t);return r&&n.forEach((e=>{r.prepend(e)})),this}prev(e,t){let r=this,n=new Set;if(r.#l.forEach((e=>{let t=e.parentNode?.children;if(t){let r=Array.from(t),a=r.indexOf(e)-1;a>-1&&n.add(r.at(a))}})),r=Y([...n]),e){let n=Y(e,t);r.filter((e=>n.has(e)))}return r}removeClass(...e){return e=z(e),this.forEach((t=>{t.classList.remove(...e)})),this}text(e){let t=this;return e?(t.forEach((t=>{t.parentNode?t.innerText=e:(()=>{console.warn("Cannot access the .textContent of a HTMLElement that hasnt been inserted yet",t),console.trace(t,this),console.info("If you called this from inside a Web Component constructor, consider using the %c[connected] event callback!","color: blue;")})()})),t):t.array[0].innerText??""}toggleClass(...e){return e=z(e),this.forEach((t=>{t.classList.toggle(...e)})),this}trigger(e,t={},r=!1,n=!1,a=!1){let s,o={bubbles:r,cancelable:n,composed:a},c=e.indexOf(" ")>-1?e.split(" "):[e];return this.#l.forEach((e=>{c.forEach((function(r){s=new Event(r,o),s.data=t,e.dispatchEvent(s)}))})),this}val(e,t){if(!this.length)return this;const r=this;let n,a=F(r.array[0]);var s;return e?null!=(s=e)&&"object"==typeof s?(Object.assign(a,e),n=r):"string"==typeof e&&(void 0===t?n=a[e]:(a[e]=t,n=r)):n=Object.assign({},a),n}values(e){const t=this;let r={};if(!t.length)return console.warn("no dom selection to search inputs in"),{};let n=F(t.array[0]);return Object.keys(n).forEach((e=>{r[e]=n[e]})),0===Object.keys(r).length&&console.warn("no inputs in this dom selection",t.array[0],r),e&&Object.keys(e).forEach((t=>{n.hasOwnProperty(t)&&(console.log("key found",t),n[t]=e[t])})),structuredClone(Object.assign(n))}at(e){return Y(this.array.at(e))}concat(e){let t=this;return(e instanceof W?e.array:e).forEach((e=>{t.#l.add(e)})),t}entries(){return this.array.entries()}every(e,t){return this.array.every(e,t)}filter(e,t){return this.#l=new Set(this.array.filter(e,t)),this}forEach(e,t){return this.array.forEach(e,t),this}includes(e){return-1!==this.array.indexOf(e,0)}indexOf(e,t){return this.array.indexOf(e,t)}map(e,t){return this.array.map(e,t)}pop(){return this.array.pop()}push(...e){return e.forEach((e=>{this.#l.add(e)})),this}shift(){let e=this,t=e.#l.size?e.array[0]:void 0;return t&&e.#l.delete(t),t}slice(e,t){return Y(this.array.slice(e,t))}some(e,t){return this.array.some(e,t)}splice(e,t,...r){let n=this.array;return n.splice(e,t,...r),Y(n)}}class Z{#l=new Set;get set(){return this.#l}get array(){return Array.from(this.#l)}set set(e){this.#l=e}get length(){return this.#l.size}set length(e){}constructor(e,t=document.body){if(!e)return this;Y(e,t).forEach((e=>{K(e).forEach((e=>{this.#l.add(e)}))}))}$d(e,t=document.body){let r=new W,n=new Set,a=!!e||!1,s=new Set;return a&&(s=Y(e,t).set),this.#l.forEach((e=>{a&&!s.has(e._tg)||n.add(e._tg)})),r.set=n,r}children(e){let t=this,r=new Set;return t.#l.forEach((t=>{t.children(e).forEach((e=>{r.add(e)}))})),t.#l=r,t}descendants(e){let t=this,r=new Set;return t.#l.forEach((t=>{t.descendants(e).forEach((e=>{r.add(e)}))})),t.#l=r,t}first(e){let t=this,r=new Set;return t.#l.forEach((e=>{e.parent().children().$d().first().$t().forEach((e=>{r.add(e)}))})),t.#l=r,e&&t.filter((t=>t.nameSpace=e)),t}has(e){return this.#l.has(e)}last(e){let t=this,r=new Set;return t.#l.forEach((e=>{e.parent().children().$d().last().$t().forEach((e=>{r.add(e)}))})),t.#l=r,e&&t.filter((t=>t.nameSpace=e)),t}next(e){let t=this,r=new Set;return t.#l.forEach((e=>{let t,n=new Set;for(t=e._tg;null!==t.nextElementSibling;)t=t.nextElementSibling,n.add(t);K([...n]).$d().first().$t().forEach((e=>{r.add(e)}))})),t.#l=r,e&&t.filter((t=>t.nameSpace=e)),t}ns(e){return this.filter((t=>t.nameSpace===e))}off(e,t){let r=e.indexOf(" ")>-1?e.split(" ").filter((e=>""!==e)):[e];return this.$d().array.forEach((e=>{r.forEach((function(r){O(e,`[TB]${r}`,t)}))})),this}on(e,t,r=!1){let n=this,a=e.indexOf(" ")>-1?e.split(" ").filter((e=>""!==e)):[e];function s(){s.cb.apply(n,Array.from(arguments))}return s.cb=t,n.forEach((e=>{a.forEach((function(t){v(e._tg,`[TB]${t}`,s,!1,r)}))})),s}one(e,t){let r=this,n=e.indexOf(" ")>-1?e.split(" ").filter((e=>""!==e)):[e];function a(){a.cb.apply(r,Array.from(arguments))}return a.cb=t,r.forEach((e=>{n.forEach((function(t){v(e._tg,`[TB]${t}`,a,!1,!0)}))})),a}parent(e){let t=this,r=new Set;return t.#l.forEach((t=>{t.parent(e).forEach((e=>{r.add(e)}))})),t.#l=r,t}parents(e){let t=this,r=new Set;return t.#l.forEach((t=>{t.parents(e).forEach((e=>{r.add(e)}))})),t.#l=r,t}prev(e){let t=this,r=new Set;return t.#l.forEach((e=>{let t,n=new Set;for(t=e._tg;null!==t.previousElementSibling;)t=t.previousElementSibling,n.add(t);K([...n]).$d().last().$t().forEach((e=>{r.add(e)}))})),t.#l=r,e&&t.filter((t=>t.nameSpace=e)),t}trigger(e,t={},r="l"){return this.forEach((n=>{n.trigger(e,t,r)})),this}at(e){return K(this.array.at(e))}concat(e){let t=this;return e.forEach((e=>{t.#l.add(e)})),t}entries(){return this.array.entries()}every(e,t){return this.array.every(e,t)}filter(e,t){return K(this.array.filter(e,t))}forEach(e,t){return this.array.forEach(e,t),this}includes(e){return-1!==this.array.indexOf(e)}indexOf(e,t){return this.array.indexOf(e,t)}map(e,t){return this.array.map(e,t)}pop(){let e=this.array,t=e.pop();return this.#l=new Set(e),t}push(e){return this.#l.add(e),this}shift(){let e=this.array.shift();return this.#l.delete(e),e}slice(e,t){return K(this.array.slice(e,t))}some(e,t){return this.array.some(e,t)}splice(e,t,...r){let n=this.array.splice(e,t,...r);return K(n)}}const Y=(e,t=document)=>{let r=new Set;return e instanceof Array?(e.forEach((e=>{Y(e,t).forEach((e=>{r.add(e)}))})),new W([...r])):new W(e,t)},K=(e,t=document)=>Y(e,t).$t();class Q{constructor(e){}}class X extends Q{#o;constructor(e){super(e),this.#o=e}get val(){return new FormData(this.#o.form).get(this.#o.name)}set val(e){[...this.#o.form.querySelectorAll(`input[type="radio"][name="${this.#o.name}"]`)].filter((t=>t.getAttribute("value")===e)).shift().checked=!0}}class ee extends Q{#o;constructor(e){super(e),this.#o=e}get val(){return this.#o.checked}set val(e){this.#o.checked=e}}class te extends Q{#o;constructor(e){super(e),this.#o=e}get val(){return this.#o.value}set val(e){this.#o.value=e}}class re extends Q{#o;#i=!1;constructor(e){super(e),this.#o=e,this.#i=e.multiple}get val(){const e=[];return[...this.#o.querySelectorAll("option")].filter((e=>e.selected)).forEach((t=>{e.push(t.value)})),this.#i?e:e.length?e[0]:""}set val(e){e="string"==typeof e?[e]:e,[...this.#o.querySelectorAll("option")].forEach((t=>{e.indexOf(t.value)>-1?t.selected=!0:t.selected=!1}))}}class ne extends Q{#o;constructor(e){super(e),this.#o=e}get val(){return this.#o.value||""}set val(e){this.#o.value=e}}class ae{constructor(e,t,r){let n=(e=>{let t=[...(e||document).querySelectorAll("input,select,textarea")],r={};return t.forEach((e=>{const t=e.getAttribute("name");if(t){let n=!1;switch((e=>e.tagName.toLowerCase())(e)){case"input":switch(e.type){case"radio":n=new X(e);break;case"checkbox":n=new ee(e);break;default:n=new te(e)}break;case"select":n=new re(e);break;case"textarea":n=new ne(e);break;default:console.warn("handler missing:",t,"for",e.tagName.toLowerCase(),e)}n&&(N.add(e,t,n),Object.defineProperty(r,t,{enumerable:!0,configurable:!0,get:()=>n.val,set:e=>{n.val!==e&&(n.val=e)}}))}})),r})(r);e[t]=Object.assign({},n),V(e,t),h(n,e[t]),[...r.querySelectorAll("input, textarea, select")].forEach((r=>{v(r,"keyup",(r=>{e[t].notify()})),v(r,"change",(r=>{e[t].notify()})),v(r,"select",(r=>{e[t].notify()}))}))}}return t})()));
|
|
1
|
+
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.microcomponents=t():e.microcomponents=t()}(this,(()=>(()=>{"use strict";var e={d:(t,r)=>{for(var n in r)e.o(r,n)&&!e.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:r[n]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};function r(e){return e&&e.constructor&&e.constructor===Object}function n(e){let t={};return[...Object.keys(e)].sort().forEach((a=>{r(e[a])?t[a]=n(e[a]):t[a]=e[a]})),t}function a(e,t=!0){let r={};return[...Object.getOwnPropertyNames(e)].forEach((t=>{if(e[t]&&e[t].constructor&&e[t].constructor===Object){const n=a(e[t],!1);for(const e in n)r[t+"."+e]=n[e]}else r[t]=e[t]})),t?n(r):r}function s(e,t){return JSON.stringify(a(e))===JSON.stringify(a(t))}function o(e,t={}){let r=e.constructor===String?e.split("."):e;if(t&&r[0]&&t[r[0]])return t[r[0]].constructor===Object&&r.length>1?o(r.splice(1),t[r[0]]):t[r[0]];console.warn("ns",r[0],"not in",t)}function c(e,t){var n=Array.from(arguments);if(n.length>2){for(;n.length>1;)n[0]=c(n[0],n[1]),n.splice(1,1);return n[0]}if("string"==typeof e)e.match(/\{[^\{\}]*\}/g)?.forEach((function(r){var n=o(r.substring(1,r.length-1),t);void 0!==n&&(e=e.replace(r,n))}));else if(r(e))switch(e.constructor){case Object:Object.keys(e).forEach((function(r){e.hasOwnProperty(r)&&(e[r]=c(e[r],t))}));break;case Array:e.forEach((function(r,n,a){a[n]=c(e[n],t)}))}return e}function i(e){return e.split("-").map((e=>e.charAt(0).toUpperCase()+e.slice(1))).join("")}function l(e,t){let r;return()=>{clearTimeout(r),r=setTimeout((function(){e(...arguments)}),t)}}function u(e){let t=document.createElement("template");return e=e.replace(/<([A-Za-z0-9\-]*)([^>\/]*)(\/>)/gi,"<$1$2></$1>"),t.innerHTML=e,t.content.normalize(),Array.from(t.content.childNodes)}function h(e,t){const r=Object.getOwnPropertyDescriptors(e);for(const[e,n]of Object.entries(r))("get"in n||"set"in n)&&Object.defineProperty(t,e,n)}e.r(t),e.d(t,{$d:()=>Y,$t:()=>K,DC:()=>N,MC:()=>k,McBase:()=>x,McEvent:()=>p,addListener:()=>v,autoload:()=>M,copyGettersSetters:()=>h,debounce:()=>l,deepEqual:()=>s,defineCE:()=>$,flattenObject:()=>a,formValues:()=>se,getCE:()=>H,htmlToElements:()=>u,isNativeObject:()=>r,kebabToPascal:()=>i,nameSpace:()=>o,observe:()=>V,parse:()=>c,removeListener:()=>O,sortObject:()=>n});var f=new Function("try {return this===window;}catch(e){ return false;}");let d=new Set;f()&&Object.keys(HTMLElement.prototype).filter((e=>/^on/.test(e))).forEach((e=>d.add(e)));class p{#e;#t=!1;#r=!1;constructor(e,t={},r="l"){this.#e=e,this.data=t,this.bubble=r}get type(){return this.#e}get stopped(){return this.#t}get immediateStopped(){return this.#r}stopPropagation(){this.#t=!0}stopImmediatePropagation(){this.stopPropagation(),this.#r=!0}}var m=new Function("try {return this===window;}catch(e){ return false;}");let b=new Set;function g(e,t){let r=[];return e.forEach((e=>{if(e&&e instanceof HTMLElement){const n=e?._mc;!t&&n?r=r.concat(Object.values(e._mc)):t&&n&&n[t]&&r.push(n[t])}})),r}function y(e,t,r=!0){let n=[];for(;e;){if(e._mc&&(t?t&&e._mc[t]&&n.push(e._mc[t]):n=n.concat(Object.values(e._mc)),r))return n;e=e.parentNode}return n}function E(e){return e&&e instanceof HTMLElement}function v(e,t,r,n=!1,a=!1){let s={once:!1};n&&(s.capture=n),a&&(s.once=a),e.addEventListener(t,r,s)}function O(e,t,r){e.removeEventListener(t,r)}function w(e,t,r={}){let n=e;if(!n._mc){let t=N?.debug;N.debug=!1,n._mc=new N(e),N.debug=t,delete n._mc._mc}const a=n._mc;return t.length&&!a[t]&&(a[t]=r,e instanceof HTMLElement&&e.setAttribute("_mc","")),r}function S(e,t){if(!t)return;const r=e?._mc||{};r&&r[t]&&delete r[t],!Object.keys(r).length&&e instanceof HTMLElement&&e.hasAttribute("_mc")&&e.removeAttribute("_mc")}function A(e,t,r={},n="l"){let a=e?._mc;if(!a)return;let s=t instanceof p?new p(t.type,t.data,"l"):new p(t,r,"l"),o="string"!=typeof t?t:new p(t,r,n);[...Object.values(a)].forEach((e=>{e?.trigger&&"function"==typeof e?.trigger&&e?.trigger(s)})),/[ud]/.test(o.bubble)&&j(e,o)}function j(e,t){/[ud]/.test(t.bubble)&&setTimeout((()=>{if(-1===t.bubble.indexOf("l")&&(t.bubble+="l"),t.bubble.indexOf("u")>-1){let r=y(e,"",!0)?.[0].target;r&&N.trigger(r,t)}t.bubble.indexOf("d")>-1&&new Set(e._mc.children().map((e=>e?.target))).forEach((e=>{e&&N.trigger(e,t)}))}),0)}m()&&Object.keys(HTMLElement.prototype).filter((e=>/^on/.test(e))).forEach((e=>b.add(e)));class x{#n;constructor(e,t=!1){var r;this.#n=new WeakRef(e||{}),(r=this).constructor!==N&&setTimeout((()=>{r.trigger("Init")}),0),function(e){if(!m()||e.constructor===N)return;const t=e.target;if(t instanceof HTMLElement){let r=e;Object.getOwnPropertyNames(r.constructor.prototype).filter((e=>/^on[A-Z]|one[A-Z]/.test(e)&&"function"==typeof r.constructor.prototype[e])).forEach((n=>{let a=/^one/.test(n),s=n.replace(/^on[e]{0,1}/,""),o=s.toLowerCase();a&&Object.defineProperty(e,"on"+s,{configurable:!0,enumerable:!1,writable:!0,value:e=>{r.constructor.prototype[n].bind(r)(e)}}),b.has("on"+o)&&v(t,o,(e=>{r.trigger(s,e)}),!1,a)}))}}(this)}get target(){return this.#n.deref()}}class k extends x{_mc={};constructor(e){super(e)}static trigger=A;trigger(e,t={},r="l"){let n=this;if(n.constructor===k||n.constructor===N){let a=e instanceof p?new p(e.type,e.data,"l"):new p(e,t,"l"),s="string"!=typeof e?e:new p(e,t,r);return[...Object.getOwnPropertyNames(n)].forEach((e=>{n[e]?.trigger&&"function"==typeof n[e]?.trigger&&n[e]?.trigger(a)})),void(/[ud]/.test(s.bubble)&&j(n.target,s))}if(n instanceof k||n instanceof N){const n=this,a="string"!=typeof e?e:new p(e,t,r),s="on"+a.type[0].toUpperCase()+a.type.slice(1);if(a.bubble.indexOf("l")>-1&&(a.immediateStopped||"function"!=typeof n[s]||(n[s](a),n.hasOwnProperty(s)&&delete n[s])),a.stopped||"l"===a.bubble)return n;/[ud]/.test(a.bubble)&&j(n.target,a)}}}class N extends x{_mc={};constructor(e,t=!1){super(e)}static add=w;static remove=S;static trigger=A;trigger(e,t={},r){k.prototype.trigger.call(this,e,t,r)}parent(e=""){let t=this.target;return E(t)?y(t.parentNode,e,!0):[]}ancestors(e=""){let t=this?.target;return E(t)?y(this.target.parentNode,e,!1):[]}children(e=""){let t=this?.target;if(!E(t))return[];const r=Math.random().toString().replace(".",""),n='[_mc]:not([temp_id="'+r+'"] [_mc] [_mc])';t.setAttribute("temp_id",r);const a=g([...t.querySelectorAll(n)],e);return t.removeAttribute("temp_id"),a}descendants(e=""){let t=this?.target;return E(t)?g([...t.querySelectorAll("*[_mc]")],e):[]}}let _=null;const T=new Map;function C(){document.querySelectorAll(':not(:defined),[_mc]:not([_mc=""])').forEach((e=>{(e.tagName.includes("-")?[e.tagName.toLowerCase()]:e.getAttribute("_mc").trim().split(" ")).forEach((t=>{let r=t.toLowerCase().split("-");if(r=r.join("/")+".js",e.tagName.includes("-")&&!T.has(e.tagName.toLowerCase())){const e=document.createElement("script");T.set(t,r),e.setAttribute("src",r),e.setAttribute("blocking","render"),e.setAttribute("type","module"),e.onload=()=>{T.delete(t)},document.head.append(e)}}))}))}let L=!1;function M(e=!0){return e?(L=e,_=new MutationObserver(C),setTimeout((()=>{_.observe(document.body,{childList:!0,subtree:!0}),C()}),5),L):(_?.disconnect(),_=null,L)}class P extends HTMLElement{constructor(){super()}connectedCallback(){N.trigger(this,"Connected")}disconnectedCallback(){N.trigger(this,"Disconnected")}adoptedCallback(){N.trigger(this,"Adopted")}attributeChangedCallback(e,t,r){N.trigger(this,"AttributeChanged",{name:e,oldValue:t,newValue:r})}}function $(e,t,r=[]){if(customElements.get(e))return void console.warn(`IGNORED: Custom element "${e}" is already defined!`);if(!e.includes("-"))throw new Error('createCustomElement: tagName must contain at least one hyphen ("-").');let n=i(e);customElements.define(e,function(e,t){return Object.defineProperty(t,"name",{value:e})}(n,class extends P{instance;constructor(e){super();let r=new t(this,e);N.add(this,n,r)}static get observedAttributes(){return r}}))}function H(e){return customElements.get(e)}function q(e){return null!=e&&"object"==typeof e}function D(e){let t=new Set,r=/\{[^\{\}]*\}/g;return e.getAttributeNames().filter((t=>e.getAttribute(t)?.match(r))).forEach((n=>{new Set(e.getAttribute(n)?.match(r)).forEach((e=>t.add(e.replace(/[\{\}]/g,""))))})),[...e.childNodes].filter((e=>3===e.nodeType&&(e.nodeValue||"").match(r))).forEach((e=>{(e.nodeValue||"").match(r).forEach((e=>{t.add(e.replace(/[\{\}]/g,""))}))})),[...t].map((e=>e.replace(/[\{\}]/g,"")))}const I=[HTMLInputElement,HTMLSelectElement,HTMLTextAreaElement];class B extends N{data={};oldDisplay="";constructor(e){super(e);let t=this;D(e).forEach((e=>t.data[e]="")),V(t),t.#a(),delete t._mc}#a(){let e=this,t=e.target,r=!1;t.getAttributeNames().filter((e=>t.getAttribute(e)?.match(/\{[^\{\}]*\}/g))).forEach((r=>{let n=new Set(t.getAttribute(r)?.match(/\{[^\{\}]*\}/g));var a;e.data.observe((a=t.getAttribute(r),e=>{let s=a;n.forEach((t=>{s=s.replace(t,e[t.replace(/[\{\}]/g,"")])})),t.setAttribute(r,s)}))})),[...t.childNodes].filter((e=>3===e.nodeType&&(e.nodeValue||"").match(/\{[^\{\}]*\}/g))).forEach((n=>{r=!0;let a=new Set(n.nodeValue.match(/\{[^\{\}]*\}/g));var s;e.data.observe((s=n.nodeValue,r=>{let o=s;a.forEach((e=>{o=o.replace(e,r[e.replace(/[\{\}]/g,"")])})),Object.keys(r).some((e=>!!r[e]))&&(e.oldDisplay?t.style=e.oldDisplay:t.removeAttribute("style"),delete e.oldDisplay),n.nodeValue=o})),e.oldDisplay=t.getAttribute("style)")||"",r&&!I.includes(t.constructor)&&"FIELDSET"!==t.tagName&&(t.style.display="none")}))}onData(e){let t=this,r={};Object.keys(e.data).forEach((n=>{t.data.hasOwnProperty(n)&&(r[n]=e.data[n])})),JSON.stringify(r)!==JSON.stringify(t.data)&&Object.assign(t.data,r)}}const V=(e,t)=>((t?[t]:[...Object.getOwnPropertyNames(e)]).forEach((t=>{if("_"===t[0]||void 0===e?.[t])return e;let r,n=e[t];if(!n.prototype)switch(typeof n){case"string":r=String;break;case"number":r=Number;break;case"boolean":r=Boolean;break;case"object":r=n instanceof Array?Array:Object;break;default:return}let o=class extends r{#s=!0;constructor(e){super(e),this.constructor.callbacks=[],q(e)&&Object.getOwnPropertyNames(e).forEach((t=>{this[t]=e[t]}))}observe(e){return this.constructor.callbacks.push(e),this}bind(e){const t=this;if(q(t.valueOf())){!function(e){var t;(t=e,(t instanceof HTMLElement?[t]:[]).concat([...t.querySelectorAll("*")]).filter((e=>!!D(e).length)).filter((e=>"STYLE"!==e.tagName))).forEach((e=>{e?._mc?._placeholders||N.add(e,"_placeholders",new B(e))}))}(e);const r=[...e.querySelectorAll("[_mc]")].filter((e=>!!e?._mc?._placeholders)),n=function(e){let t=a(e);r.forEach((e=>{e&&e._mc.trigger("data",t)}))};t.constructor.callbacks.push(n),t.notify()}else console.warn("IGNORED - cannot bind a non-Object to the dom, IS:",typeof t.valueOf(),t);return this}notify(e){let t=this,r=q(t.valueOf())&&t.valueOf()instanceof Array==0?structuredClone(Object.assign({},t)):t.valueOf();return void 0!==e&&(t.#s=e),t.constructor.callbacks.forEach((e=>{e(r)})),t}},c=new o(n);Object.defineProperty(e,t,{enumerable:!0,get(){if(q(c.valueOf())){let e=structuredClone(Object.assign({},c));setTimeout(l((function(){s(structuredClone(Object.assign({},c)),e)||c.notify()}),0),0)}return c},set(e){if(typeof e==typeof c.valueOf())if(q(c.valueOf())&&c.valueOf()instanceof Array==0){let t=structuredClone(Object.assign({},c));c instanceof o==0&&(c=new o(structuredClone(Object.assign({},e))),h(e,c),c.seal()),Object.assign(c,e),setTimeout(l((function(){s(structuredClone(Object.assign({},c)),t)||c.notify()}),0),0)}else{let t=c.valueOf(),r=c.constructor.callbacks;c=new o(e),c.constructor.callbacks=r,e!==t&&c.notify()}else console.warn("IGNORED - cannot change observable types, IS:",typeof c.valueOf(),c,"- CANNOT BECOME:",typeof e)}}),e[t]=n})),e),z=e=>{let t=new Set;return e.forEach((e=>{(e=e.trim()).split(" ").forEach((e=>{""!==e&&t.add(e)}))})),Array.from(t)},J=e=>{let t=Y("input,select,textarea",e).array,r={};return t.forEach((t=>{const n=t.getAttribute("name")||"undefined";if(n){let a;switch((e=>e instanceof HTMLInputElement?"input":e instanceof HTMLSelectElement?"select":e instanceof HTMLTextAreaElement?"textarea":"")(t)){case"input":a=new G(t,e),Object.defineProperty(r,n,{enumerable:!0,configurable:!0,get:()=>a.val,set:e=>{a.val=e}});break;case"select":a=new R(t),Object.defineProperty(r,n,{enumerable:!0,configurable:!0,get:()=>a.val,set:e=>{a.val=e}});break;case"textarea":a=new W(t),Object.defineProperty(r,n,{enumerable:!0,configurable:!0,get:()=>a.val,set:e=>{a.val=e}});break;default:console.warn("handler missing:",n,"for",t)}}})),r};class F{constructor(e){}}class G extends F{#o;#e;#c;constructor(e,t){super(e),this.#o=e,this.#e=e.type,this.#c=t}get val(){let e,t=this;switch(t.#e){case"radio":const r=Y(`input[type="radio"][name="${this.#o.getAttribute("name")}"]`,this.#c).filter((e=>e.checked));return r.length?(e=r.array[0],e.value):"";case"checkbox":return t.#o.checked;default:return t.#o.value}return""}set val(e){let t=this;switch(t.#e){case"radio":const r=`input[type="radio"][name="${this.#o.getAttribute("name")}"]`,n=Y(r,this.#c);if(!n.length)return;if(""===e)return void n.forEach((e=>{e.checked&&(e.checked=!1)}));const a=n.filter((t=>t.getAttribute("value")===e));if(!a.length)return;return void(a.array[0].checked=!0);case"checkbox":t.#o.checked=e;break;default:t.#o.value=e}}}class R extends F{#o;#i=!1;constructor(e){super(e),this.#o=e,this.#i="select-multiple"===e.type}get val(){const e=[];return Y(this.#o.querySelectorAll("option")).filter((e=>e.selected)).forEach((t=>{t.selected&&e.push(t.value)})),this.#i?e:e.length?e[0]:""}set val(e){e="string"==typeof e?[e]:e,Y(this.#o.querySelectorAll("option")).forEach((t=>{e.indexOf(t.value)>-1?(t.setAttribute("selected",!0),t.selected=!0):(t.removeAttribute("selected"),t.selected=!1)}))}}class W extends F{#o;constructor(e){super(e),this.#o=e}get val(){return this.#o.value}set val(e){this.#o.value=e}}class Z{#l=new Set;get set(){return this.#l}get array(){return Array.from(this.#l)}set set(e){this.#l=e}get length(){return this.#l.size}constructor(e,t=document.body){if(new Set,!e)return this}$t(e){let t=new U;return this.#l.forEach((e=>{e._mc&&Object.values(e._mc).forEach((e=>{t.set.add(e)}))})),e&&t.filter((t=>t.nameSpace===e)),t}add(e,t){let r=this;return Y(e,t).forEach((e=>{r.#l.add(e)})),r}addClass(...e){return e=z(e),this.forEach((t=>{t.classList.add(...e)})),this}after(e,t){let r=this,n=Y(e,t);return n.length?(n.first().forEach((e=>{r.array.reverse().forEach((t=>{t.after(e)}))})),r):r}append(e,t){let r=this.array[0],n=Y(e,t);return r&&n.forEach((e=>{r.append(e)})),this}appendTo(e,t){let r=Y(e,t).array[0];return r&&this.forEach((e=>{r.append(e)})),this}attr(e,t){let r=this,n={};return r.length?arguments.length?"string"==typeof e?void 0===t?[...r.set][0].getAttribute(e):null===t?([...r.set].forEach((t=>{t.removeAttribute(e)})),r):("object"==typeof t&&(t=JSON.stringify(t)),[...r.set].forEach((r=>{r.setAttribute(e,t)})),r):"object"==typeof e?([...r.set].forEach((t=>{Object.keys(e).forEach((r=>{Y(t).attr(r,e.key)}))})),r):r:(Array.from([...r.set][0].attributes).forEach((e=>{n[e.name]=e.value})),n):r}before(e,t){let r=this,n=Y(e,t);return n.length?(n.first().forEach((e=>{r.forEach((t=>{t.before(e)}))})),r):r}children(e,t){let r=this,n=new Set;if(r.#l.forEach((e=>{Array.from(e.children).forEach((e=>{n.add(e)}))})),r=Y([...n]),e){let n=Y(e,t);r.filter((e=>n.has(e)))}return r}descendants(e,t){let r=this,n=new Set;if(r.#l.forEach((e=>{e.querySelectorAll("*").forEach((e=>{n.add(e)}))})),r=Y([...n]),e){let n=Y(e,t);r.filter((e=>n.has(e)))}return r}empty(){return this.filter((e=>!1))}first(e,t){let r=this,n=new Set,a=!1;return e&&(a=Y(e,t)),r.#l.forEach((e=>{e.parentNode&&n.add(e.parentNode.children[0])})),r=Y([...n]),e&&r.filter((e=>a.has(e))),r}has(e){return this.#l.has(e)}hasClass(...e){return e=z(e),this.every((e=>Array.from(e.classList).every((t=>e.contains(t)))))}html(e){let t=this;return e?(t.forEach((t=>{t.parentNode?t.innerHTML=e:(()=>{console.warn("Cannot access the .innerHTML of a HTMLElement that hasnt been inserted yet",t),console.trace(t,this),console.info("If you called this from inside a Web Component constructor, consider using the %c[connected] event callback!","color: blue;")})()})),t):t.array[0].innerHTML}last(e,t){let r=this,n=new Set;if(r.#l.forEach((e=>{let t=e.parentNode?.children;t&&n.add(Array.from(t).at(-1))})),r=Y([...n]),e){let n=Y(e,t);r.filter((e=>n.has(e)))}return r}next(e,t){let r=this,n=new Set;if(r.#l.forEach((e=>{let t=e.parentNode?.children;if(t){let r=Array.from(t),a=r.indexOf(e)+1;a<r.length&&n.add(r.at(a))}})),r=Y([...n]),e){let n=Y(e,t);r.filter((e=>n.has(e)))}return r}normalize(){return this.#l.forEach((e=>{e.normalize()})),this}off(e,t){let r=e.indexOf(" ")>-1?e.split(" "):[e];return this.array.forEach((e=>{r.forEach((function(r){O(e,r,t)}))})),this}on(e,t,r=!1,n=!1){let a=this,s=e.indexOf(" ")>-1?e.split(" ").filter((e=>""!==e)):[e];function o(){o.cb.apply(a,Array.from(arguments))}return o.cb=t,a.forEach((e=>{s.forEach((function(t){v(e,t,o,r,n)}))})),o}one(e,t,r=!1){let n=this,a=e.indexOf(" ")>-1?e.split(" ").filter((e=>""!==e)):[e];function s(){s.cb.apply(n,Array.from(arguments))}return s.cb=t,n.forEach((e=>{a.forEach((function(t){v(e,t,s,r,!0)}))})),s}parent(e,t){let r=this,n=new Set;if(r.#l.forEach((e=>{e.parentNode&&"HTML"!==e.parentNode.tagName&&n.add(e.parentNode)})),r=Y([...n]),e){let n=Y(e,t);r.filter((e=>n.has(e)))}return r}parents(e,t){let r=this,n=new Set;if(r.#l.forEach((e=>{let t=e;for(;t.parentNode&&"HTML"!==t.parentNode.tagName;)t=t.parentNode,n.add(t)})),r=Y([...n]),e){let n=Y(e,t);r.filter((e=>n.has(e)))}return r}prepend(e,t){let r=this.array[0],n=Y(e,t);return r&&n.forEach((e=>{r.prepend(e)})),this}prev(e,t){let r=this,n=new Set;if(r.#l.forEach((e=>{let t=e.parentNode?.children;if(t){let r=Array.from(t),a=r.indexOf(e)-1;a>-1&&n.add(r.at(a))}})),r=Y([...n]),e){let n=Y(e,t);r.filter((e=>n.has(e)))}return r}removeClass(...e){return e=z(e),this.forEach((t=>{t.classList.remove(...e)})),this}text(e){let t=this;return e?(t.forEach((t=>{t.parentNode?t.innerText=e:(()=>{console.warn("Cannot access the .textContent of a HTMLElement that hasnt been inserted yet",t),console.trace(t,this),console.info("If you called this from inside a Web Component constructor, consider using the %c[connected] event callback!","color: blue;")})()})),t):t.array[0].innerText??""}toggleClass(...e){return e=z(e),this.forEach((t=>{t.classList.toggle(...e)})),this}trigger(e,t={},r=!1,n=!1,a=!1){let s,o={bubbles:r,cancelable:n,composed:a},c=e.indexOf(" ")>-1?e.split(" "):[e];return this.#l.forEach((e=>{c.forEach((function(r){s=new Event(r,o),s.data=t,e.dispatchEvent(s)}))})),this}val(e,t){if(!this.length)return this;const r=this;let n,a=J(r.array[0]);var s;return e?null!=(s=e)&&"object"==typeof s?(Object.assign(a,e),n=r):"string"==typeof e&&(void 0===t?n=a[e]:(a[e]=t,n=r)):n=Object.assign({},a),n}values(e){const t=this;let r={};if(!t.length)return console.warn("no dom selection to search inputs in"),{};let n=J(t.array[0]);return Object.keys(n).forEach((e=>{r[e]=n[e]})),0===Object.keys(r).length&&console.warn("no inputs in this dom selection",t.array[0],r),e&&Object.keys(e).forEach((t=>{n.hasOwnProperty(t)&&(console.log("key found",t),n[t]=e[t])})),structuredClone(Object.assign(n))}at(e){return Y(this.array.at(e))}concat(e){let t=this;return(e instanceof Z?e.array:e).forEach((e=>{t.#l.add(e)})),t}entries(){return this.array.entries()}every(e,t){return this.array.every(e,t)}filter(e,t){return this.#l=new Set(this.array.filter(e,t)),this}forEach(e,t){return this.array.forEach(e,t),this}includes(e){return-1!==this.array.indexOf(e,0)}indexOf(e,t){return this.array.indexOf(e,t)}map(e,t){return this.array.map(e,t)}pop(){return this.array.pop()}push(...e){return e.forEach((e=>{this.#l.add(e)})),this}shift(){let e=this,t=e.#l.size?e.array[0]:void 0;return t&&e.#l.delete(t),t}slice(e,t){return Y(this.array.slice(e,t))}some(e,t){return this.array.some(e,t)}splice(e,t,...r){let n=this.array;return n.splice(e,t,...r),Y(n)}}class U{#l=new Set;get set(){return this.#l}get array(){return Array.from(this.#l)}set set(e){this.#l=e}get length(){return this.#l.size}set length(e){}constructor(e,t=document.body){if(!e)return this;Y(e,t).forEach((e=>{K(e).forEach((e=>{this.#l.add(e)}))}))}$d(e,t=document.body){let r=new Z,n=new Set,a=!!e||!1,s=new Set;return a&&(s=Y(e,t).set),this.#l.forEach((e=>{a&&!s.has(e._tg)||n.add(e._tg)})),r.set=n,r}children(e){let t=this,r=new Set;return t.#l.forEach((t=>{t.children(e).forEach((e=>{r.add(e)}))})),t.#l=r,t}descendants(e){let t=this,r=new Set;return t.#l.forEach((t=>{t.descendants(e).forEach((e=>{r.add(e)}))})),t.#l=r,t}first(e){let t=this,r=new Set;return t.#l.forEach((e=>{e.parent().children().$d().first().$t().forEach((e=>{r.add(e)}))})),t.#l=r,e&&t.filter((t=>t.nameSpace=e)),t}has(e){return this.#l.has(e)}last(e){let t=this,r=new Set;return t.#l.forEach((e=>{e.parent().children().$d().last().$t().forEach((e=>{r.add(e)}))})),t.#l=r,e&&t.filter((t=>t.nameSpace=e)),t}next(e){let t=this,r=new Set;return t.#l.forEach((e=>{let t,n=new Set;for(t=e._tg;null!==t.nextElementSibling;)t=t.nextElementSibling,n.add(t);K([...n]).$d().first().$t().forEach((e=>{r.add(e)}))})),t.#l=r,e&&t.filter((t=>t.nameSpace=e)),t}ns(e){return this.filter((t=>t.nameSpace===e))}off(e,t){let r=e.indexOf(" ")>-1?e.split(" ").filter((e=>""!==e)):[e];return this.$d().array.forEach((e=>{r.forEach((function(r){O(e,`[TB]${r}`,t)}))})),this}on(e,t,r=!1){let n=this,a=e.indexOf(" ")>-1?e.split(" ").filter((e=>""!==e)):[e];function s(){s.cb.apply(n,Array.from(arguments))}return s.cb=t,n.forEach((e=>{a.forEach((function(t){v(e._tg,`[TB]${t}`,s,!1,r)}))})),s}one(e,t){let r=this,n=e.indexOf(" ")>-1?e.split(" ").filter((e=>""!==e)):[e];function a(){a.cb.apply(r,Array.from(arguments))}return a.cb=t,r.forEach((e=>{n.forEach((function(t){v(e._tg,`[TB]${t}`,a,!1,!0)}))})),a}parent(e){let t=this,r=new Set;return t.#l.forEach((t=>{t.parent(e).forEach((e=>{r.add(e)}))})),t.#l=r,t}parents(e){let t=this,r=new Set;return t.#l.forEach((t=>{t.parents(e).forEach((e=>{r.add(e)}))})),t.#l=r,t}prev(e){let t=this,r=new Set;return t.#l.forEach((e=>{let t,n=new Set;for(t=e._tg;null!==t.previousElementSibling;)t=t.previousElementSibling,n.add(t);K([...n]).$d().last().$t().forEach((e=>{r.add(e)}))})),t.#l=r,e&&t.filter((t=>t.nameSpace=e)),t}trigger(e,t={},r="l"){return this.forEach((n=>{n.trigger(e,t,r)})),this}at(e){return K(this.array.at(e))}concat(e){let t=this;return e.forEach((e=>{t.#l.add(e)})),t}entries(){return this.array.entries()}every(e,t){return this.array.every(e,t)}filter(e,t){return K(this.array.filter(e,t))}forEach(e,t){return this.array.forEach(e,t),this}includes(e){return-1!==this.array.indexOf(e)}indexOf(e,t){return this.array.indexOf(e,t)}map(e,t){return this.array.map(e,t)}pop(){let e=this.array,t=e.pop();return this.#l=new Set(e),t}push(e){return this.#l.add(e),this}shift(){let e=this.array.shift();return this.#l.delete(e),e}slice(e,t){return K(this.array.slice(e,t))}some(e,t){return this.array.some(e,t)}splice(e,t,...r){let n=this.array.splice(e,t,...r);return K(n)}}const Y=(e,t=document)=>{let r=new Set;return e instanceof Array?(e.forEach((e=>{Y(e,t).forEach((e=>{r.add(e)}))})),new Z([...r])):new Z(e,t)},K=(e,t=document)=>Y(e,t).$t();class Q{constructor(e){}}class X extends Q{#o;constructor(e){super(e),this.#o=e}get val(){return new FormData(this.#o.form).get(this.#o.name)}set val(e){[...this.#o.form.querySelectorAll(`input[type="radio"][name="${this.#o.name}"]`)].filter((t=>t.getAttribute("value")===e)).shift().checked=!0}}class ee extends Q{#o;constructor(e){super(e),this.#o=e}get val(){return this.#o.checked}set val(e){this.#o.checked=e}}class te extends Q{#o;constructor(e){super(e),this.#o=e}get val(){return this.#o.value}set val(e){this.#o.value=e}}class re extends Q{#o;#i=!1;constructor(e){super(e),this.#o=e,this.#i=e.multiple}get val(){const e=[];return[...this.#o.querySelectorAll("option")].filter((e=>e.selected)).forEach((t=>{e.push(t.value)})),this.#i?e:e.length?e[0]:""}set val(e){e="string"==typeof e?[e]:e,[...this.#o.querySelectorAll("option")].forEach((t=>{e.indexOf(t.value)>-1?t.selected=!0:t.selected=!1}))}}class ne extends Q{#o;constructor(e){super(e),this.#o=e}get val(){return this.#o.value||""}set val(e){this.#o.value=e}}const ae=e=>{let t=[...(e||document).querySelectorAll("input,select,textarea")],r={};return t.forEach((e=>{const t=e.getAttribute("name");if(t){let n=!1;switch((e=>e.tagName.toLowerCase())(e)){case"input":switch(e.type){case"radio":n=new X(e);break;case"checkbox":n=new ee(e);break;default:n=new te(e)}break;case"select":n=new re(e);break;case"textarea":n=new ne(e);break;default:console.warn("handler missing:",t,"for",e.tagName.toLowerCase(),e)}n&&(N.add(e,t,n),Object.defineProperty(r,t,{enumerable:!0,configurable:!0,get:()=>n.val,set:e=>{n.val!==e&&(n.val=e)}}))}})),r};function se(e,t,r){let n=ae(r);e[t]=Object.assign({},n),V(e,t),h(n,e[t]),[...r.querySelectorAll("input, textarea, select")].forEach((r=>{v(r,"keyup",(r=>{e[t].notify()})),v(r,"change",(r=>{e[t].notify()})),v(r,"select",(r=>{e[t].notify()}))}))}return t})()));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"observables.d.ts","sourceRoot":"","sources":["../src/observables.ts"],"names":[],"mappings":"AAEA,OAAO,EACN,WAAW,EAKX,MAAM,cAAc,CAAC;AAQtB,KAAK,QAAQ,GAAG,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;
|
|
1
|
+
{"version":3,"file":"observables.d.ts","sourceRoot":"","sources":["../src/observables.ts"],"names":[],"mappings":"AAEA,OAAO,EACN,WAAW,EAKX,MAAM,cAAc,CAAC;AAQtB,KAAK,QAAQ,GAAG,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;AAoLrC,MAAM,MAAM,UAAU,GAAG;IACxB,OAAO,EAAE,CAAC,EAAE,EAAE,QAAQ,KAAK,IAAI,CAAC;IAChC,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,IAAI,EAAE,CAAC,MAAM,EAAE,WAAW,GAAG,gBAAgB,GAAG,UAAU,KAAK,IAAI,CAAC;CACpE,CAAC;AAEF,eAAO,MAAM,OAAO,WACX,WAAW,iBACJ,MAAM,KACnB,WAsMF,CAAC"}
|
package/dist/observables.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.observables=t():e.observables=t()}(this,(()=>(()=>{"use strict";var e={d:(t,r)=>{for(var n in r)e.o(r,n)&&!e.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:r[n]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};function r(e){let t={};return[...Object.keys(e)].sort().forEach((n=>{var o;(o=e[n])&&o.constructor&&o.constructor===Object?t[n]=r(e[n]):t[n]=e[n]})),t}function n(e,t=!0){let o={};return[...Object.getOwnPropertyNames(e)].forEach((t=>{if(e[t]&&e[t].constructor&&e[t].constructor===Object){const r=n(e[t],!1);for(const e in r)o[t+"."+e]=r[e]}else o[t]=e[t]})),t?r(o):o}function o(e,t){return JSON.stringify(n(e))===JSON.stringify(n(t))}function c(e,t){let r;return()=>{clearTimeout(r),r=setTimeout((function(){e(...arguments)}),t)}}e.r(t),e.d(t,{observe:()=>S});var a=new Function("try {return this===window;}catch(e){ return false;}");let s=new Set;a()&&Object.keys(HTMLElement.prototype).filter((e=>/^on/.test(e))).forEach((e=>s.add(e)));class i{#e;#t=!1;#r=!1;constructor(e,t={},r="l"){this.#e=e,this.data=t,this.bubble=r}get type(){return this.#e}get stopped(){return this.#t}get immediateStopped(){return this.#r}stopPropagation(){this.#t=!0}stopImmediatePropagation(){this.stopPropagation(),this.#r=!0}}var l=new Function("try {return this===window;}catch(e){ return false;}");let u=new Set;function f(e,t){let r=[];return e.forEach((e=>{if(e&&e instanceof HTMLElement){const n=e?._mc;!t&&n?r=r.concat(Object.values(e._mc)):t&&n&&n[t]&&r.push(n[t])}})),r}function d(e,t,r=!0){let n=[];for(;e;){if(e._mc&&(t?t&&e._mc[t]&&n.push(e._mc[t]):n=n.concat(Object.values(e._mc)),r))return n;e=e.parentNode}return n}function p(e){return e&&e instanceof HTMLElement}function b(e,t,r={}){let n=e;if(!n._mc){let t=E?.debug;E.debug=!1,n._mc=new E(e),E.debug=t,delete n._mc._mc}const o=n._mc;return t.length&&!o[t]&&(o[t]=r,e instanceof HTMLElement&&e.setAttribute("_mc","")),r}function g(e,t){if(!t)return;const r=e?._mc||{};r&&r[t]&&delete r[t],!Object.keys(r).length&&e instanceof HTMLElement&&e.hasAttribute("_mc")&&e.removeAttribute("_mc")}function m(e,t,r={},n="l"){let o=e?._mc;if(!o)return;let c=t instanceof i?new i(t.type,t.data,"l"):new i(t,r,"l"),a="string"!=typeof t?t:new i(t,r,n);[...Object.values(o)].forEach((e=>{e?.trigger&&"function"==typeof e?.trigger&&e?.trigger(c)})),/[ud]/.test(a.bubble)&&h(e,a)}function h(e,t){/[ud]/.test(t.bubble)&&setTimeout((()=>{if(-1===t.bubble.indexOf("l")&&(t.bubble+="l"),t.bubble.indexOf("u")>-1){let r=d(e,"",!0)?.[0].target;r&&E.trigger(r,t)}t.bubble.indexOf("d")>-1&&new Set(e._mc.children().map((e=>e?.target))).forEach((e=>{e&&E.trigger(e,t)}))}),0)}l()&&Object.keys(HTMLElement.prototype).filter((e=>/^on/.test(e))).forEach((e=>u.add(e)));class y{#n;constructor(e,t=!1){var r;this.#n=new WeakRef(e||{}),(r=this).constructor!==E&&setTimeout((()=>{r.trigger("Init")}),0),function(e){if(!l()||e.constructor===E)return;const t=e.target;if(t instanceof HTMLElement){let r=e;Object.getOwnPropertyNames(r.constructor.prototype).filter((e=>/^on[A-Z]|one[A-Z]/.test(e)&&"function"==typeof r.constructor.prototype[e])).forEach((n=>{let o=/^one/.test(n),c=n.replace(/^on[e]{0,1}/,""),a=c.toLowerCase();o&&Object.defineProperty(e,"on"+c,{configurable:!0,enumerable:!1,writable:!0,value:e=>{r.constructor.prototype[n].bind(r)(e)}}),u.has("on"+a)&&function(e,t,r,n=!1,o=!1){let c={once:!1};n&&(c.capture=n),o&&(c.once=o),e.addEventListener(t,r,c)}(t,a,(e=>{r.trigger(c,e)}),!1,o)}))}}(this)}get target(){return this.#n.deref()}}class O extends y{_mc={};constructor(e){super(e)}static trigger=m;trigger(e,t={},r="l"){let n=this;if(n.constructor===O||n.constructor===E){let o=e instanceof i?new i(e.type,e.data,"l"):new i(e,t,"l"),c="string"!=typeof e?e:new i(e,t,r);return[...Object.getOwnPropertyNames(n)].forEach((e=>{n[e]?.trigger&&"function"==typeof n[e]?.trigger&&n[e]?.trigger(o)})),void(/[ud]/.test(c.bubble)&&h(n.target,c))}if(n instanceof O||n instanceof E){const n=this,o="string"!=typeof e?e:new i(e,t,r),c="on"+o.type[0].toUpperCase()+o.type.slice(1);if(o.bubble.indexOf("l")>-1&&(o.immediateStopped||"function"!=typeof n[c]||(n[c](o),n.hasOwnProperty(c)&&delete n[c])),o.stopped||"l"===o.bubble)return n;/[ud]/.test(o.bubble)&&h(n.target,o)}}}class E extends y{_mc={};constructor(e,t=!1){super(e)}static add=b;static remove=g;static trigger=m;trigger(e,t={},r){O.prototype.trigger.call(this,e,t,r)}parent(e=""){let t=this.target;return p(t)?d(t.parentNode,e,!0):[]}ancestors(e=""){let t=this?.target;return p(t)?d(this.target.parentNode,e,!1):[]}children(e=""){let t=this?.target;if(!p(t))return[];const r=Math.random().toString().replace(".",""),n='[_mc]:not([temp_id="'+r+'"] [_mc] [_mc])';t.setAttribute("temp_id",r);const o=f([...t.querySelectorAll(n)],e);return t.removeAttribute("temp_id"),o}descendants(e=""){let t=this?.target;return p(t)?f([...t.querySelectorAll("*[_mc]")],e):[]}}function v(e){return null!=e&&"object"==typeof e}function w(e){let t=new Set,r=/\{[^\{\}]*\}/g;return e.getAttributeNames().filter((t=>e.getAttribute(t)?.match(r))).forEach((n=>{new Set(e.getAttribute(n)?.match(r)).forEach((e=>t.add(e.replace(/[\{\}]/g,""))))})),[...e.childNodes].filter((e=>3===e.nodeType&&(e.nodeValue||"").match(r))).forEach((e=>{(e.nodeValue||"").match(r).forEach((e=>{t.add(e.replace(/[\{\}]/g,""))}))})),[...t].map((e=>e.replace(/[\{\}]/g,"")))
|
|
1
|
+
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.observables=t():e.observables=t()}(this,(()=>(()=>{"use strict";var e={d:(t,r)=>{for(var n in r)e.o(r,n)&&!e.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:r[n]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};function r(e){let t={};return[...Object.keys(e)].sort().forEach((n=>{var o;(o=e[n])&&o.constructor&&o.constructor===Object?t[n]=r(e[n]):t[n]=e[n]})),t}function n(e,t=!0){let o={};return[...Object.getOwnPropertyNames(e)].forEach((t=>{if(e[t]&&e[t].constructor&&e[t].constructor===Object){const r=n(e[t],!1);for(const e in r)o[t+"."+e]=r[e]}else o[t]=e[t]})),t?r(o):o}function o(e,t){return JSON.stringify(n(e))===JSON.stringify(n(t))}function c(e,t){let r;return()=>{clearTimeout(r),r=setTimeout((function(){e(...arguments)}),t)}}e.r(t),e.d(t,{observe:()=>S});var a=new Function("try {return this===window;}catch(e){ return false;}");let s=new Set;a()&&Object.keys(HTMLElement.prototype).filter((e=>/^on/.test(e))).forEach((e=>s.add(e)));class i{#e;#t=!1;#r=!1;constructor(e,t={},r="l"){this.#e=e,this.data=t,this.bubble=r}get type(){return this.#e}get stopped(){return this.#t}get immediateStopped(){return this.#r}stopPropagation(){this.#t=!0}stopImmediatePropagation(){this.stopPropagation(),this.#r=!0}}var l=new Function("try {return this===window;}catch(e){ return false;}");let u=new Set;function f(e,t){let r=[];return e.forEach((e=>{if(e&&e instanceof HTMLElement){const n=e?._mc;!t&&n?r=r.concat(Object.values(e._mc)):t&&n&&n[t]&&r.push(n[t])}})),r}function d(e,t,r=!0){let n=[];for(;e;){if(e._mc&&(t?t&&e._mc[t]&&n.push(e._mc[t]):n=n.concat(Object.values(e._mc)),r))return n;e=e.parentNode}return n}function p(e){return e&&e instanceof HTMLElement}function b(e,t,r={}){let n=e;if(!n._mc){let t=E?.debug;E.debug=!1,n._mc=new E(e),E.debug=t,delete n._mc._mc}const o=n._mc;return t.length&&!o[t]&&(o[t]=r,e instanceof HTMLElement&&e.setAttribute("_mc","")),r}function g(e,t){if(!t)return;const r=e?._mc||{};r&&r[t]&&delete r[t],!Object.keys(r).length&&e instanceof HTMLElement&&e.hasAttribute("_mc")&&e.removeAttribute("_mc")}function m(e,t,r={},n="l"){let o=e?._mc;if(!o)return;let c=t instanceof i?new i(t.type,t.data,"l"):new i(t,r,"l"),a="string"!=typeof t?t:new i(t,r,n);[...Object.values(o)].forEach((e=>{e?.trigger&&"function"==typeof e?.trigger&&e?.trigger(c)})),/[ud]/.test(a.bubble)&&h(e,a)}function h(e,t){/[ud]/.test(t.bubble)&&setTimeout((()=>{if(-1===t.bubble.indexOf("l")&&(t.bubble+="l"),t.bubble.indexOf("u")>-1){let r=d(e,"",!0)?.[0].target;r&&E.trigger(r,t)}t.bubble.indexOf("d")>-1&&new Set(e._mc.children().map((e=>e?.target))).forEach((e=>{e&&E.trigger(e,t)}))}),0)}l()&&Object.keys(HTMLElement.prototype).filter((e=>/^on/.test(e))).forEach((e=>u.add(e)));class y{#n;constructor(e,t=!1){var r;this.#n=new WeakRef(e||{}),(r=this).constructor!==E&&setTimeout((()=>{r.trigger("Init")}),0),function(e){if(!l()||e.constructor===E)return;const t=e.target;if(t instanceof HTMLElement){let r=e;Object.getOwnPropertyNames(r.constructor.prototype).filter((e=>/^on[A-Z]|one[A-Z]/.test(e)&&"function"==typeof r.constructor.prototype[e])).forEach((n=>{let o=/^one/.test(n),c=n.replace(/^on[e]{0,1}/,""),a=c.toLowerCase();o&&Object.defineProperty(e,"on"+c,{configurable:!0,enumerable:!1,writable:!0,value:e=>{r.constructor.prototype[n].bind(r)(e)}}),u.has("on"+a)&&function(e,t,r,n=!1,o=!1){let c={once:!1};n&&(c.capture=n),o&&(c.once=o),e.addEventListener(t,r,c)}(t,a,(e=>{r.trigger(c,e)}),!1,o)}))}}(this)}get target(){return this.#n.deref()}}class O extends y{_mc={};constructor(e){super(e)}static trigger=m;trigger(e,t={},r="l"){let n=this;if(n.constructor===O||n.constructor===E){let o=e instanceof i?new i(e.type,e.data,"l"):new i(e,t,"l"),c="string"!=typeof e?e:new i(e,t,r);return[...Object.getOwnPropertyNames(n)].forEach((e=>{n[e]?.trigger&&"function"==typeof n[e]?.trigger&&n[e]?.trigger(o)})),void(/[ud]/.test(c.bubble)&&h(n.target,c))}if(n instanceof O||n instanceof E){const n=this,o="string"!=typeof e?e:new i(e,t,r),c="on"+o.type[0].toUpperCase()+o.type.slice(1);if(o.bubble.indexOf("l")>-1&&(o.immediateStopped||"function"!=typeof n[c]||(n[c](o),n.hasOwnProperty(c)&&delete n[c])),o.stopped||"l"===o.bubble)return n;/[ud]/.test(o.bubble)&&h(n.target,o)}}}class E extends y{_mc={};constructor(e,t=!1){super(e)}static add=b;static remove=g;static trigger=m;trigger(e,t={},r){O.prototype.trigger.call(this,e,t,r)}parent(e=""){let t=this.target;return p(t)?d(t.parentNode,e,!0):[]}ancestors(e=""){let t=this?.target;return p(t)?d(this.target.parentNode,e,!1):[]}children(e=""){let t=this?.target;if(!p(t))return[];const r=Math.random().toString().replace(".",""),n='[_mc]:not([temp_id="'+r+'"] [_mc] [_mc])';t.setAttribute("temp_id",r);const o=f([...t.querySelectorAll(n)],e);return t.removeAttribute("temp_id"),o}descendants(e=""){let t=this?.target;return p(t)?f([...t.querySelectorAll("*[_mc]")],e):[]}}function v(e){return null!=e&&"object"==typeof e}function w(e){let t=new Set,r=/\{[^\{\}]*\}/g;return e.getAttributeNames().filter((t=>e.getAttribute(t)?.match(r))).forEach((n=>{new Set(e.getAttribute(n)?.match(r)).forEach((e=>t.add(e.replace(/[\{\}]/g,""))))})),[...e.childNodes].filter((e=>3===e.nodeType&&(e.nodeValue||"").match(r))).forEach((e=>{(e.nodeValue||"").match(r).forEach((e=>{t.add(e.replace(/[\{\}]/g,""))}))})),[...t].map((e=>e.replace(/[\{\}]/g,"")))}new Map;const j=[HTMLInputElement,HTMLSelectElement,HTMLTextAreaElement];class _ extends E{data={};oldDisplay="";constructor(e){super(e);let t=this;w(e).forEach((e=>t.data[e]="")),S(t),t.#o(),delete t._mc}#o(){let e=this,t=e.target,r=!1;t.getAttributeNames().filter((e=>t.getAttribute(e)?.match(/\{[^\{\}]*\}/g))).forEach((r=>{let n=new Set(t.getAttribute(r)?.match(/\{[^\{\}]*\}/g));var o;e.data.observe((o=t.getAttribute(r),e=>{let c=o;n.forEach((t=>{c=c.replace(t,e[t.replace(/[\{\}]/g,"")])})),t.setAttribute(r,c)}))})),[...t.childNodes].filter((e=>3===e.nodeType&&(e.nodeValue||"").match(/\{[^\{\}]*\}/g))).forEach((n=>{r=!0;let o=new Set(n.nodeValue.match(/\{[^\{\}]*\}/g));var c;e.data.observe((c=n.nodeValue,r=>{let a=c;o.forEach((e=>{a=a.replace(e,r[e.replace(/[\{\}]/g,"")])})),Object.keys(r).some((e=>!!r[e]))&&(e.oldDisplay?t.style=e.oldDisplay:t.removeAttribute("style"),delete e.oldDisplay),n.nodeValue=a})),e.oldDisplay=t.getAttribute("style)")||"",r&&!j.includes(t.constructor)&&"FIELDSET"!==t.tagName&&(t.style.display="none")}))}onData(e){let t=this,r={};Object.keys(e.data).forEach((n=>{t.data.hasOwnProperty(n)&&(r[n]=e.data[n])})),JSON.stringify(r)!==JSON.stringify(t.data)&&Object.assign(t.data,r)}}const S=(e,t)=>((t?[t]:[...Object.getOwnPropertyNames(e)]).forEach((t=>{if("_"===t[0]||void 0===e?.[t])return e;let r,a=e[t];if(!a.prototype)switch(typeof a){case"string":r=String;break;case"number":r=Number;break;case"boolean":r=Boolean;break;case"object":r=a instanceof Array?Array:Object;break;default:return}let s=class extends r{#c=!0;constructor(e){super(e),this.constructor.callbacks=[],v(e)&&Object.getOwnPropertyNames(e).forEach((t=>{this[t]=e[t]}))}observe(e){return this.constructor.callbacks.push(e),this}bind(e){const t=this;if(v(t.valueOf())){!function(e){var t;(t=e,(t instanceof HTMLElement?[t]:[]).concat([...t.querySelectorAll("*")]).filter((e=>!!w(e).length)).filter((e=>"STYLE"!==e.tagName))).forEach((e=>{e?._mc?._placeholders||E.add(e,"_placeholders",new _(e))}))}(e);const r=[...e.querySelectorAll("[_mc]")].filter((e=>!!e?._mc?._placeholders)),o=function(e){let t=n(e);r.forEach((e=>{e&&e._mc.trigger("data",t)}))};t.constructor.callbacks.push(o),t.notify()}else console.warn("IGNORED - cannot bind a non-Object to the dom, IS:",typeof t.valueOf(),t);return this}notify(e){let t=this,r=v(t.valueOf())&&t.valueOf()instanceof Array==0?structuredClone(Object.assign({},t)):t.valueOf();return void 0!==e&&(t.#c=e),t.constructor.callbacks.forEach((e=>{e(r)})),t}},i=new s(a);Object.defineProperty(e,t,{enumerable:!0,get(){if(v(i.valueOf())){let e=structuredClone(Object.assign({},i));setTimeout(c((function(){o(structuredClone(Object.assign({},i)),e)||i.notify()}),0),0)}return i},set(e){if(typeof e==typeof i.valueOf())if(v(i.valueOf())&&i.valueOf()instanceof Array==0){let t=structuredClone(Object.assign({},i));i instanceof s==0&&(i=new s(structuredClone(Object.assign({},e))),function(e,t){const r=Object.getOwnPropertyDescriptors(e);for(const[e,n]of Object.entries(r))("get"in n||"set"in n)&&Object.defineProperty(t,e,n)}(e,i),i.seal()),Object.assign(i,e),setTimeout(c((function(){o(structuredClone(Object.assign({},i)),t)||i.notify()}),0),0)}else{let t=i.valueOf(),r=i.constructor.callbacks;i=new s(e),i.constructor.callbacks=r,e!==t&&i.notify()}else console.warn("IGNORED - cannot change observable types, IS:",typeof i.valueOf(),i,"- CANNOT BECOME:",typeof e)}}),e[t]=a})),e);return t})()));
|
package/dist/observables.ts
CHANGED
|
@@ -48,14 +48,13 @@ function getPlaceholders(target: HTMLElement): string[] {
|
|
|
48
48
|
});
|
|
49
49
|
});
|
|
50
50
|
|
|
51
|
-
|
|
52
|
-
let result: string[] = [...placeholders].map((placeholder) =>
|
|
53
|
-
placeholder.replace(/[\{\}]/g, '')
|
|
54
|
-
);
|
|
55
|
-
|
|
51
|
+
|
|
56
52
|
//console.log('getPlaceholders()', target, result);
|
|
57
53
|
|
|
58
|
-
return
|
|
54
|
+
// extract {} and return result
|
|
55
|
+
return [...placeholders].map((placeholder) =>
|
|
56
|
+
placeholder.replace(/[\{\}]/g, '')
|
|
57
|
+
);
|
|
59
58
|
}
|
|
60
59
|
|
|
61
60
|
const inputs = [HTMLInputElement, HTMLSelectElement, HTMLTextAreaElement];
|
package/dist/test.ts
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@twobirds/microcomponents",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.58",
|
|
4
4
|
"description": "Micro Components Organization Class",
|
|
5
5
|
"main": "./dist/microcomponents.ts",
|
|
6
6
|
"types": "./dist/microcomponents.d.ts",
|
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
"webpack": "webpack",
|
|
11
11
|
"clean": "rm -rf build/*; rm -rf dist/*;",
|
|
12
12
|
"prep": "cp -R assets/* public || true; cp src/* build || true;",
|
|
13
|
-
"build": "npm run clean; npm run prep; tsc; npm run copyToDist; npm run webpack; cp dist/*.js public; cp
|
|
13
|
+
"build": "npm run clean; npm run prep; tsc; npm run copyToDist; npm run webpack; cp dist/*.js public; cp build/*.js public; cp build/*.js.map public;",
|
|
14
14
|
"copyToDist": "mkdir public/src || true; cp src/*.ts public/src || true; cp -R assets/* public || true; cp build/*.ts* dist; cp *.svg dist; cp *.svg public/fiddle; cp dist/MicroComponents.svg public; cp dist/microcomponents.js public;"
|
|
15
15
|
},
|
|
16
16
|
"author": "",
|
package/public/MC.js
CHANGED
|
@@ -278,8 +278,7 @@ function loadit() {
|
|
|
278
278
|
? [el.tagName.toLowerCase()]
|
|
279
279
|
: el.getAttribute('_mc').trim().split(' ');
|
|
280
280
|
load.forEach((elementName) => {
|
|
281
|
-
let fileName = elementName.toLowerCase().split('-')
|
|
282
|
-
fileName[fileName.length - 1] = renameLastElement;
|
|
281
|
+
let fileName = elementName.toLowerCase().split('-');
|
|
283
282
|
fileName = fileName.join('/') + '.js';
|
|
284
283
|
if (el.tagName.includes('-') &&
|
|
285
284
|
!unresolved.has(el.tagName.toLowerCase())) {
|