@lvce-editor/virtual-dom 1.18.0 → 1.19.0
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/README.md +1 -1
- package/dist/index.js +5 -5
- package/package.json +1 -1
- package/src/parts/AttachEvent/AttachEvent.ts +2 -2
- package/src/parts/ComponentUid/ComponentUid.ts +3 -3
- package/src/parts/CreateEventListenerFunction/CreateEventListenerFunction.ts +2 -2
- package/src/parts/ElementTagMap/ElementTagMap.ts +1 -1
- package/src/parts/GetEventListenerArg/GetEventListenerArg.ts +0 -2
- package/src/parts/GetEventListenerOptions/GetEventListenerOptions.ts +1 -1
- package/src/parts/GetUidTarget/GetUidTarget.ts +4 -2
- package/src/parts/GetWrappedListener/GetWrappedListener.ts +2 -2
- package/src/parts/IpcState/IpcState.ts +1 -1
- package/src/parts/ListenerCache/ListenerCache.ts +3 -3
- package/src/parts/NameAnonymousFunction/NameAnonymousFunction.ts +1 -1
- package/src/parts/QueryInputs/QueryInputs.ts +3 -0
- package/src/parts/RegisterEventListeners/RegisterEventListeners.ts +2 -2
- package/src/parts/RememberFocus/RememberFocus.ts +5 -8
- package/src/parts/RenderInternal/RenderInternal.ts +1 -1
- package/src/parts/VirtualDom/VirtualDom.ts +7 -9
- package/src/parts/VirtualDomElementProp/VirtualDomElementProp.ts +1 -1
- package/src/parts/VirtualDomElementProps/VirtualDomElementProps.ts +1 -1
package/README.md
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
# virtual dom
|
|
1
|
+
# virtual dom
|
package/dist/index.js
CHANGED
|
@@ -598,8 +598,6 @@ var getEventListenerArg = (param, event) => {
|
|
|
598
598
|
return event.shiftKey;
|
|
599
599
|
case "event.inputType":
|
|
600
600
|
return event.inputType;
|
|
601
|
-
case "event.data":
|
|
602
|
-
return event.data;
|
|
603
601
|
default:
|
|
604
602
|
return param;
|
|
605
603
|
}
|
|
@@ -650,6 +648,11 @@ var getEventListenerMap = (id) => {
|
|
|
650
648
|
return map;
|
|
651
649
|
};
|
|
652
650
|
|
|
651
|
+
// src/parts/QueryInputs/QueryInputs.ts
|
|
652
|
+
var queryInputs = ($Viewlet) => {
|
|
653
|
+
return [...$Viewlet.querySelectorAll("input, textarea")];
|
|
654
|
+
};
|
|
655
|
+
|
|
653
656
|
// src/parts/ClearNode/ClearNode.ts
|
|
654
657
|
var clearNode = ($Node) => {
|
|
655
658
|
$Node.textContent = "";
|
|
@@ -667,9 +670,6 @@ var render2 = (elements, eventMap = {}, newEventMap = {}) => {
|
|
|
667
670
|
};
|
|
668
671
|
|
|
669
672
|
// src/parts/RememberFocus/RememberFocus.ts
|
|
670
|
-
var queryInputs = ($Viewlet) => {
|
|
671
|
-
return [...$Viewlet.querySelectorAll("input, textarea")];
|
|
672
|
-
};
|
|
673
673
|
var rememberFocus = ($Viewlet, dom, eventMap, uid = 0) => {
|
|
674
674
|
const oldLeft = $Viewlet.style.left;
|
|
675
675
|
const oldTop = $Viewlet.style.top;
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as GetEventListenerOptions from '../GetEventListenerOptions/GetEventListenerOptions.ts'
|
|
2
2
|
import * as GetWrappedListener from '../GetWrappedListener/GetWrappedListener.ts'
|
|
3
3
|
|
|
4
|
-
const getOptions = (fn: any) => {
|
|
4
|
+
const getOptions = (fn: any): any => {
|
|
5
5
|
if (fn.passive) {
|
|
6
6
|
return {
|
|
7
7
|
passive: true,
|
|
@@ -16,7 +16,7 @@ export const attachEvent = (
|
|
|
16
16
|
key: string,
|
|
17
17
|
value: string,
|
|
18
18
|
newEventMap?: any,
|
|
19
|
-
) => {
|
|
19
|
+
): void => {
|
|
20
20
|
if (newEventMap && newEventMap[value]) {
|
|
21
21
|
const fn = newEventMap[value]
|
|
22
22
|
const options: any = getOptions(fn)
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { getUidTarget } from '../GetUidTarget/GetUidTarget.ts'
|
|
2
2
|
import { uidSymbol } from '../UidSymbol/UidSymbol.ts'
|
|
3
3
|
|
|
4
|
-
export const setComponentUid = ($Element, uid) => {
|
|
4
|
+
export const setComponentUid = ($Element, uid): void => {
|
|
5
5
|
$Element[uidSymbol] = uid
|
|
6
6
|
}
|
|
7
7
|
|
|
8
|
-
export const getComponentUid = ($Element) => {
|
|
8
|
+
export const getComponentUid = ($Element): number => {
|
|
9
9
|
const $Target = getUidTarget($Element)
|
|
10
10
|
if (!$Target) {
|
|
11
11
|
return 0
|
|
@@ -13,7 +13,7 @@ export const getComponentUid = ($Element) => {
|
|
|
13
13
|
return $Target[uidSymbol]
|
|
14
14
|
}
|
|
15
15
|
|
|
16
|
-
export const getComponentUidFromEvent = (event) => {
|
|
16
|
+
export const getComponentUidFromEvent = (event): number => {
|
|
17
17
|
const { target, currentTarget } = event
|
|
18
18
|
return getComponentUid(currentTarget || target)
|
|
19
19
|
}
|
|
@@ -3,8 +3,8 @@ import * as GetEventListenerArgs from '../GetEventListenerArgs/GetEventListenerA
|
|
|
3
3
|
import * as IpcState from '../IpcState/IpcState.ts'
|
|
4
4
|
import * as NameAnonymousFunction from '../NameAnonymousFunction/NameAnonymousFunction.ts'
|
|
5
5
|
|
|
6
|
-
export const createFn = (info) => {
|
|
7
|
-
const fn = (event) => {
|
|
6
|
+
export const createFn = (info): any => {
|
|
7
|
+
const fn = (event): void => {
|
|
8
8
|
if (info.preventDefault) {
|
|
9
9
|
event.preventDefault(event)
|
|
10
10
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as ElementTag from '../ElementTags/ElementTags.ts'
|
|
2
2
|
import * as VirtualDomElements from '../VirtualDomElements/VirtualDomElements.ts'
|
|
3
3
|
|
|
4
|
-
export const getElementTag = (type) => {
|
|
4
|
+
export const getElementTag = (type: number): string => {
|
|
5
5
|
switch (type) {
|
|
6
6
|
case VirtualDomElements.Audio:
|
|
7
7
|
return ElementTag.Audio
|
|
@@ -1,11 +1,13 @@
|
|
|
1
1
|
import { uidSymbol } from '../UidSymbol/UidSymbol.ts'
|
|
2
2
|
|
|
3
|
-
export const getUidTarget = (
|
|
3
|
+
export const getUidTarget = (
|
|
4
|
+
$Element: HTMLElement,
|
|
5
|
+
): HTMLElement | undefined => {
|
|
4
6
|
while ($Element) {
|
|
5
7
|
if ($Element[uidSymbol]) {
|
|
6
8
|
return $Element
|
|
7
9
|
}
|
|
8
|
-
$Element = $Element.parentNode
|
|
10
|
+
$Element = $Element.parentNode as HTMLElement
|
|
9
11
|
}
|
|
10
12
|
return undefined
|
|
11
13
|
}
|
|
@@ -3,12 +3,12 @@ import * as IpcState from '../IpcState/IpcState.ts'
|
|
|
3
3
|
import * as ListenerCache from '../ListenerCache/ListenerCache.ts'
|
|
4
4
|
import * as NameAnonymousFunction from '../NameAnonymousFunction/NameAnonymousFunction.ts'
|
|
5
5
|
|
|
6
|
-
export const getWrappedListener = (listener, returnValue) => {
|
|
6
|
+
export const getWrappedListener = (listener, returnValue): any => {
|
|
7
7
|
if (!returnValue) {
|
|
8
8
|
return listener
|
|
9
9
|
}
|
|
10
10
|
if (!ListenerCache.has(listener)) {
|
|
11
|
-
const wrapped = (event) => {
|
|
11
|
+
const wrapped = (event): void => {
|
|
12
12
|
const uid = ComponentUid.getComponentUidFromEvent(event)
|
|
13
13
|
const result = listener(event)
|
|
14
14
|
// TODO check for empty array by value
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
const cache = new Map()
|
|
2
2
|
|
|
3
|
-
export const has = (listener) => {
|
|
3
|
+
export const has = (listener): boolean => {
|
|
4
4
|
return cache.has(listener)
|
|
5
5
|
}
|
|
6
6
|
|
|
7
|
-
export const set = (listener, value) => {
|
|
7
|
+
export const set = (listener, value): void => {
|
|
8
8
|
cache.set(listener, value)
|
|
9
9
|
}
|
|
10
10
|
|
|
11
|
-
export const get = (listener) => {
|
|
11
|
+
export const get = (listener): any => {
|
|
12
12
|
return cache.get(listener)
|
|
13
13
|
}
|
|
@@ -2,7 +2,7 @@ import * as CreateEventListenerFunction from '../CreateEventListenerFunction/Cre
|
|
|
2
2
|
|
|
3
3
|
const listeners = Object.create(null)
|
|
4
4
|
|
|
5
|
-
export const registerEventListeners = (id, eventListeners) => {
|
|
5
|
+
export const registerEventListeners = (id, eventListeners): void => {
|
|
6
6
|
const map = Object.create(null)
|
|
7
7
|
for (const info of eventListeners) {
|
|
8
8
|
const fn = CreateEventListenerFunction.createFn(info)
|
|
@@ -11,7 +11,7 @@ export const registerEventListeners = (id, eventListeners) => {
|
|
|
11
11
|
listeners[id] = map
|
|
12
12
|
}
|
|
13
13
|
|
|
14
|
-
export const getEventListenerMap = (id) => {
|
|
14
|
+
export const getEventListenerMap = (id): any => {
|
|
15
15
|
const map = listeners[id]
|
|
16
16
|
return map
|
|
17
17
|
}
|
|
@@ -1,30 +1,27 @@
|
|
|
1
1
|
import * as ComponentUid from '../ComponentUid/ComponentUid.ts'
|
|
2
|
+
import * as QueryInputs from '../QueryInputs/QueryInputs.ts'
|
|
2
3
|
import * as RegisterEventListeners from '../RegisterEventListeners/RegisterEventListeners.ts'
|
|
3
4
|
import * as VirtualDom from '../VirtualDom/VirtualDom.ts'
|
|
4
5
|
|
|
5
|
-
const queryInputs = ($Viewlet: HTMLElement) => {
|
|
6
|
-
return [...$Viewlet.querySelectorAll('input, textarea')]
|
|
7
|
-
}
|
|
8
|
-
|
|
9
6
|
export const rememberFocus = (
|
|
10
7
|
$Viewlet: HTMLElement,
|
|
11
8
|
dom: any[],
|
|
12
9
|
eventMap: any,
|
|
13
10
|
uid = 0,
|
|
14
|
-
) => {
|
|
11
|
+
): any => {
|
|
15
12
|
const oldLeft = $Viewlet.style.left
|
|
16
13
|
const oldTop = $Viewlet.style.top
|
|
17
14
|
const oldWidth = $Viewlet.style.width
|
|
18
15
|
const oldHeight = $Viewlet.style.height
|
|
19
16
|
|
|
20
|
-
const {activeElement} = document
|
|
17
|
+
const { activeElement } = document
|
|
21
18
|
const isTreeFocused = activeElement?.getAttribute('role') === 'tree'
|
|
22
19
|
const isRootTree =
|
|
23
20
|
$Viewlet.getAttribute('role') === 'tree' && activeElement === $Viewlet
|
|
24
21
|
|
|
25
22
|
const focused = activeElement?.getAttribute('name')
|
|
26
23
|
|
|
27
|
-
const $$Inputs = queryInputs($Viewlet)
|
|
24
|
+
const $$Inputs = QueryInputs.queryInputs($Viewlet)
|
|
28
25
|
const inputMap = Object.create(null)
|
|
29
26
|
for (const $Input of $$Inputs) {
|
|
30
27
|
// @ts-ignore
|
|
@@ -43,7 +40,7 @@ export const rememberFocus = (
|
|
|
43
40
|
VirtualDom.renderInto($Viewlet, dom, eventMap)
|
|
44
41
|
}
|
|
45
42
|
|
|
46
|
-
const $$NewInputs = queryInputs($Viewlet)
|
|
43
|
+
const $$NewInputs = QueryInputs.queryInputs($Viewlet)
|
|
47
44
|
for (const $Input of $$NewInputs) {
|
|
48
45
|
// @ts-ignore
|
|
49
46
|
$Input.value = inputMap[$Input.name] || $Input.value || ''
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import * as ClearNode from '../ClearNode/ClearNode.ts'
|
|
2
2
|
import * as RenderInternal from '../RenderInternal/RenderInternal.ts'
|
|
3
3
|
|
|
4
|
-
export const renderInto = ($Parent, dom, eventMap = {}) => {
|
|
4
|
+
export const renderInto = ($Parent, dom, eventMap = {}): void => {
|
|
5
5
|
ClearNode.clearNode($Parent)
|
|
6
6
|
RenderInternal.renderInternal($Parent, dom, eventMap)
|
|
7
7
|
}
|
|
8
8
|
|
|
9
|
-
export const renderIncremental = ($Parent, dom) => {
|
|
9
|
+
export const renderIncremental = ($Parent, dom): void => {
|
|
10
10
|
if ($Parent.textContent === '') {
|
|
11
11
|
// @ts-expect-error
|
|
12
12
|
renderInternal($Parent, dom)
|
|
@@ -16,12 +16,6 @@ export const renderIncremental = ($Parent, dom) => {
|
|
|
16
16
|
const $Node = $Parent
|
|
17
17
|
for (let i = 0; i < dom.length; i++) {
|
|
18
18
|
const node = dom[i]
|
|
19
|
-
if (!$Node) {
|
|
20
|
-
$Parent.append
|
|
21
|
-
}
|
|
22
|
-
console.log({ $Node, node })
|
|
23
|
-
console.log($Node.nodeValue, node.text)
|
|
24
|
-
|
|
25
19
|
if ($Node.nodeValue !== node.props.text && node.props.text) {
|
|
26
20
|
$Node.nodeValue = node.props.text
|
|
27
21
|
}
|
|
@@ -39,7 +33,11 @@ export const renderIncremental = ($Parent, dom) => {
|
|
|
39
33
|
* @param {any[]} elements
|
|
40
34
|
* @returns
|
|
41
35
|
*/
|
|
42
|
-
export const render = (
|
|
36
|
+
export const render = (
|
|
37
|
+
elements,
|
|
38
|
+
eventMap = {},
|
|
39
|
+
newEventMap = {},
|
|
40
|
+
): HTMLElement => {
|
|
43
41
|
const $Root = document.createElement('div')
|
|
44
42
|
RenderInternal.renderInternal($Root, elements, eventMap, newEventMap)
|
|
45
43
|
return $Root
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as VirtualDomElementProp from '../VirtualDomElementProp/VirtualDomElementProp.ts'
|
|
2
2
|
|
|
3
|
-
export const setProps = ($Element, props, eventMap, newEventMap) => {
|
|
3
|
+
export const setProps = ($Element, props, eventMap, newEventMap): void => {
|
|
4
4
|
for (const key in props) {
|
|
5
5
|
VirtualDomElementProp.setProp(
|
|
6
6
|
$Element,
|