Precise DOM morphing
morphing
typescript
dom
Bun (#31)
* Use bun on CI
* Update package.json
* Update bun.lockb
* Reduce public API methods
authored by
Joel Drapper
and committed by
GitHub
4b2174b7
c604c2b4
+10
-24
bun.lockb
bun.lockb
This is a binary file and will not be displayed.
+2
-4
dist/morphlex.d.ts
+2
-4
dist/morphlex.d.ts
···
12
12
beforePropertyUpdated?: (node: Node, propertyName: PropertyKey, newValue: unknown) => boolean;
13
13
afterPropertyUpdated?: (node: Node, propertyName: PropertyKey, previousValue: unknown) => void;
14
14
}
15
-
export declare function morph(node: ChildNode, reference: ChildNode, options?: Options): void;
16
-
export declare function morphInner(element: Element, reference: Element, options?: Options): void;
17
-
export declare function morphFromString(node: ChildNode, reference: string, options?: Options): void;
18
-
export declare function morphInnerFromString(element: Element, reference: string, options?: Options): void;
15
+
export declare function morph(node: ChildNode, reference: ChildNode | string, options?: Options): void;
16
+
export declare function morphInner(element: Element, reference: Element | string, options?: Options): void;
19
17
export {};
+3
-8
dist/morphlex.js
+3
-8
dist/morphlex.js
···
1
1
export function morph(node, reference, options = {}) {
2
+
if (typeof reference === "string") reference = parseChildNodeFromString(reference);
2
3
new Morph(options).morph([node, reference]);
3
4
}
4
5
export function morphInner(element, reference, options = {}) {
6
+
if (typeof reference === "string") reference = parseElementFromString(reference);
5
7
new Morph(options).morphInner([element, reference]);
6
8
}
7
-
export function morphFromString(node, reference, options = {}) {
8
-
morph(node, parseChildNodeFromString(reference), options);
9
-
}
10
-
export function morphInnerFromString(element, reference, options = {}) {
11
-
morphInner(element, parseElementFromString(reference), options);
12
-
}
13
9
function parseElementFromString(string) {
14
10
const node = parseChildNodeFromString(string);
15
11
if (isElement(node)) return node;
···
18
14
function parseChildNodeFromString(string) {
19
15
const parser = new DOMParser();
20
16
const doc = parser.parseFromString(string, "text/html");
21
-
const firstChild = doc.body.firstChild;
22
-
if (doc.childNodes.length === 1) return firstChild;
17
+
if (doc.childNodes.length === 1) return doc.body.firstChild;
23
18
else throw new Error("[Morphlex] The string was not a valid HTML node.");
24
19
}
25
20
class Morph {
+5
-12
src/morphlex.ts
+5
-12
src/morphlex.ts
···
49
49
afterPropertyUpdated?: (node: Node, propertyName: PropertyKey, previousValue: unknown) => void;
50
50
}
51
51
52
-
export function morph(node: ChildNode, reference: ChildNode, options: Options = {}): void {
52
+
export function morph(node: ChildNode, reference: ChildNode | string, options: Options = {}): void {
53
+
if (typeof reference === "string") reference = parseChildNodeFromString(reference);
53
54
new Morph(options).morph([node, reference]);
54
55
}
55
56
56
-
export function morphInner(element: Element, reference: Element, options: Options = {}): void {
57
+
export function morphInner(element: Element, reference: Element | string, options: Options = {}): void {
58
+
if (typeof reference === "string") reference = parseElementFromString(reference);
57
59
new Morph(options).morphInner([element, reference]);
58
60
}
59
61
60
-
export function morphFromString(node: ChildNode, reference: string, options: Options = {}): void {
61
-
morph(node, parseChildNodeFromString(reference), options);
62
-
}
63
-
64
-
export function morphInnerFromString(element: Element, reference: string, options: Options = {}): void {
65
-
morphInner(element, parseElementFromString(reference), options);
66
-
}
67
-
68
62
function parseElementFromString(string: string): Element {
69
63
const node = parseChildNodeFromString(string);
70
64
···
75
69
function parseChildNodeFromString(string: string): ChildNode {
76
70
const parser = new DOMParser();
77
71
const doc = parser.parseFromString(string, "text/html");
78
-
const firstChild = doc.body.firstChild;
79
72
80
-
if (doc.childNodes.length === 1) return firstChild as ChildNode;
73
+
if (doc.childNodes.length === 1) return doc.body.firstChild as ChildNode;
81
74
else throw new Error("[Morphlex] The string was not a valid HTML node.");
82
75
}
83
76