@viewfly/core 2.0.0-alpha.5 → 2.0.0-alpha.6
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/bundles/index.d.ts +13 -6
- package/bundles/index.esm.js +76 -69
- package/bundles/index.js +76 -69
- package/package.json +2 -2
package/bundles/index.d.ts
CHANGED
|
@@ -211,7 +211,7 @@ declare function comparePropsWithCallbacks(oldProps: Record<string, any>, newPro
|
|
|
211
211
|
declare const TextAtomType: unique symbol;
|
|
212
212
|
declare const ElementAtomType: unique symbol;
|
|
213
213
|
declare const ComponentAtomType: unique symbol;
|
|
214
|
-
type ElementNamespace = string |
|
|
214
|
+
type ElementNamespace = string | void;
|
|
215
215
|
interface TextAtom {
|
|
216
216
|
type: typeof TextAtomType;
|
|
217
217
|
index: number;
|
|
@@ -264,6 +264,7 @@ declare abstract class NativeRenderer<ElementNode = NativeNode, TextNode = Nativ
|
|
|
264
264
|
abstract cleanChildren(node: ElementNode, namespace: ElementNamespace): void;
|
|
265
265
|
abstract syncTextContent(target: TextNode, content: string, namespace: ElementNamespace): void;
|
|
266
266
|
abstract insertAfter(newNode: ElementNode | TextNode, ref: ElementNode | TextNode, namespace: ElementNamespace): void;
|
|
267
|
+
abstract getNameSpace(type: string, namespace: ElementNamespace): string | void;
|
|
267
268
|
}
|
|
268
269
|
|
|
269
270
|
interface RefListener<T> {
|
|
@@ -439,6 +440,16 @@ declare function getCurrentInstance(): Component;
|
|
|
439
440
|
declare function registryComponentDestroyCallback(fn: () => void): void;
|
|
440
441
|
|
|
441
442
|
declare function createContext(providers: Provider[], scope?: Scope | null, parentInjector?: Injector): (props: Props) => () => JSXNode | JSXNode[];
|
|
443
|
+
interface ContextProviderParams<T> {
|
|
444
|
+
provide: Type<T> | AbstractType<T> | InjectionToken<T>;
|
|
445
|
+
}
|
|
446
|
+
interface ContextProvider<T> extends Props {
|
|
447
|
+
useClass?: ClassProvider<T>['useClass'];
|
|
448
|
+
useFactory?: FactoryProvider<T>['useFactory'];
|
|
449
|
+
useValue?: ValueProvider<T>['useValue'];
|
|
450
|
+
useExisting?: ExistingProvider<T>['useExisting'];
|
|
451
|
+
}
|
|
452
|
+
declare function createContextProvider<T>(params: ContextProviderParams<T>): (props: ContextProvider<T>) => () => ViewFlyNode<string | ComponentSetup<any>>;
|
|
442
453
|
/**
|
|
443
454
|
* 通过组件上下文获取 IoC 容器内数据的勾子方法
|
|
444
455
|
*/
|
|
@@ -480,10 +491,6 @@ declare function popDepContext(): void;
|
|
|
480
491
|
|
|
481
492
|
declare function withMemo<T extends Props = Props>(canUseMemo: ComponentInstance<T>['$useMemo'], render: () => JSXNode): ComponentInstance<T>;
|
|
482
493
|
|
|
483
|
-
declare const ElementNamespaceMap: {
|
|
484
|
-
readonly svg: "svg";
|
|
485
|
-
readonly math: "mathml";
|
|
486
|
-
};
|
|
487
494
|
declare function createRenderer(component: Component, nativeRenderer: NativeRenderer, namespace: ElementNamespace): (host: NativeNode) => void;
|
|
488
495
|
|
|
489
496
|
/**
|
|
@@ -711,4 +718,4 @@ declare function createEffect<T, T1, T2, T3, T4, T5, T6, T7>(deps: [Signal<T>, S
|
|
|
711
718
|
declare function createEffect<T>(deps: () => T, callback: EffectCallback<T>): () => void;
|
|
712
719
|
declare function createEffect<T = any>(deps: Signal<any>[], callback: EffectCallback<T[]>): () => void;
|
|
713
720
|
|
|
714
|
-
export { type AbstractInstanceType, type AbstractProvider, type AbstractType, type Application, ArrayReactiveHandler, type Atom, type ClassNames, type ClassProvider, Component, type ComponentAnnotation, type ComponentInstance, type ComponentSetup, type ComponentViewMetadata, type Computed, type Config, type ConstructorProvider, Dep, DynamicRef, type EffectCallback, type ElementNamespace,
|
|
721
|
+
export { type AbstractInstanceType, type AbstractProvider, type AbstractType, type Application, ArrayReactiveHandler, type Atom, type ClassNames, type ClassProvider, Component, type ComponentAnnotation, type ComponentInstance, type ComponentSetup, type ComponentViewMetadata, type Computed, type Config, type ConstructorProvider, type ContextProvider, type ContextProviderParams, Dep, DynamicRef, type EffectCallback, type ElementNamespace, type ExistingProvider, type ExtractInstanceType, type ExtractValueType, type FactoryProvider, ForwardRef, Fragment, Inject, type InjectDecorator, InjectFlags, Injectable, type InjectableDecorator, type InjectableOptions, InjectionToken, Injector, JSX, type JSXNode, JSXNodeFactory, type Key, type LifeCycleCallback, MapReactiveHandler, type Module, type NativeNode, NativeRenderer, type NormalizedProvider, NullInjector, ObjectReactiveHandler, Optional, type OptionalDecorator, Prop, type PropDecorator, type Props, type ProvideScope, type Provider, type ReactiveConfig, type RefListener, type ReflectiveDependency, ReflectiveInjector, RootComponent, Scope, Self, type SelfDecorator, SetReactiveHandler, type Signal, SkipSelf, type SkipSelfDecorator, type StaticProvider, StaticRef, THROW_IF_NOT_FOUND, TrackOpTypes, TriggerOpTypes, Type, type TypeProvider, type ValueProvider, type ViewFlyNode, comparePropsWithCallbacks, computed, createContext, createContextProvider, createDerived, createDynamicRef, createEffect, createRef, createRenderer, createSignal, defaultArrayReactiveHandler, defaultMapReactiveHandler, defaultObjectReactiveHandler, defaultSetReactiveHandler, defaultShallowArrayReactiveHandler, defaultShallowMapReactiveHandler, defaultShallowObjectReactiveHandler, defaultShallowSetReactiveHandler, forwardRef, getCurrentInstance, getDepContext, getSetupContext, inject, internalWrite, isReactive, jsx, jsxs, makeError, normalizeProvider, onMounted, onUnmounted, onUpdated, popDepContext, proxyToRawCache, pushDepContext, rawToProxyCache, reactive, readonlyProxyHandler, registryComponentDestroyCallback, shallowReactive, toRaw, track, trigger, viewfly, watch, withAnnotation, withMemo };
|
package/bundles/index.esm.js
CHANGED
|
@@ -1634,6 +1634,53 @@ function registryComponentDestroyCallback(fn) {
|
|
|
1634
1634
|
}
|
|
1635
1635
|
}
|
|
1636
1636
|
|
|
1637
|
+
function Fragment(props) {
|
|
1638
|
+
return () => {
|
|
1639
|
+
return props.children;
|
|
1640
|
+
};
|
|
1641
|
+
}
|
|
1642
|
+
function jsx(type, props, key) {
|
|
1643
|
+
return JSXNodeFactory.createNode(type, props, key);
|
|
1644
|
+
}
|
|
1645
|
+
const jsxs = jsx;
|
|
1646
|
+
const JSXNodeFactory = {
|
|
1647
|
+
createNode(type, props, key) {
|
|
1648
|
+
return {
|
|
1649
|
+
type,
|
|
1650
|
+
props,
|
|
1651
|
+
key
|
|
1652
|
+
};
|
|
1653
|
+
}
|
|
1654
|
+
};
|
|
1655
|
+
|
|
1656
|
+
function watch(trigger, callback) {
|
|
1657
|
+
let prevFn;
|
|
1658
|
+
const dep = new Dep(() => {
|
|
1659
|
+
pushDepContext(dep);
|
|
1660
|
+
const newValue = trigger();
|
|
1661
|
+
popDepContext();
|
|
1662
|
+
if (newValue === oldValue) {
|
|
1663
|
+
return;
|
|
1664
|
+
}
|
|
1665
|
+
if (prevFn) {
|
|
1666
|
+
prevFn();
|
|
1667
|
+
}
|
|
1668
|
+
prevFn = callback(newValue, oldValue);
|
|
1669
|
+
oldValue = newValue;
|
|
1670
|
+
});
|
|
1671
|
+
pushDepContext(dep);
|
|
1672
|
+
let oldValue = trigger();
|
|
1673
|
+
popDepContext();
|
|
1674
|
+
dep.destroyCallbacks.push(() => {
|
|
1675
|
+
prevFn === null || prevFn === void 0 ? void 0 : prevFn();
|
|
1676
|
+
});
|
|
1677
|
+
function unWatch() {
|
|
1678
|
+
dep.destroy();
|
|
1679
|
+
}
|
|
1680
|
+
registryComponentDestroyCallback(unWatch);
|
|
1681
|
+
return unWatch;
|
|
1682
|
+
}
|
|
1683
|
+
|
|
1637
1684
|
const injectMap = new WeakMap();
|
|
1638
1685
|
function getInjector(start) {
|
|
1639
1686
|
while (start) {
|
|
@@ -1655,6 +1702,19 @@ function createContext(providers, scope, parentInjector) {
|
|
|
1655
1702
|
};
|
|
1656
1703
|
};
|
|
1657
1704
|
}
|
|
1705
|
+
function createContextProvider(params) {
|
|
1706
|
+
return function contextProvider(props) {
|
|
1707
|
+
let Context = createContext([Object.assign({ provide: params.provide }, props)]);
|
|
1708
|
+
watch(() => {
|
|
1709
|
+
return props.useClass || props.useFactory || props.useValue || props.useExisting;
|
|
1710
|
+
}, () => {
|
|
1711
|
+
Context = createContext([Object.assign({ provide: params.provide }, props)]);
|
|
1712
|
+
});
|
|
1713
|
+
return () => {
|
|
1714
|
+
return jsx(Context, { children: props.children });
|
|
1715
|
+
};
|
|
1716
|
+
};
|
|
1717
|
+
}
|
|
1658
1718
|
/**
|
|
1659
1719
|
* 通过组件上下文获取 IoC 容器内数据的勾子方法
|
|
1660
1720
|
*/
|
|
@@ -1700,25 +1760,6 @@ function withAnnotation(annotation, componentSetup) {
|
|
|
1700
1760
|
class NativeRenderer {
|
|
1701
1761
|
}
|
|
1702
1762
|
|
|
1703
|
-
function Fragment(props) {
|
|
1704
|
-
return () => {
|
|
1705
|
-
return props.children;
|
|
1706
|
-
};
|
|
1707
|
-
}
|
|
1708
|
-
function jsx(type, props, key) {
|
|
1709
|
-
return JSXNodeFactory.createNode(type, props, key);
|
|
1710
|
-
}
|
|
1711
|
-
const jsxs = jsx;
|
|
1712
|
-
const JSXNodeFactory = {
|
|
1713
|
-
createNode(type, props, key) {
|
|
1714
|
-
return {
|
|
1715
|
-
type,
|
|
1716
|
-
props,
|
|
1717
|
-
key
|
|
1718
|
-
};
|
|
1719
|
-
}
|
|
1720
|
-
};
|
|
1721
|
-
|
|
1722
1763
|
function withMemo(canUseMemo, render) {
|
|
1723
1764
|
return {
|
|
1724
1765
|
$useMemo: canUseMemo,
|
|
@@ -1726,10 +1767,6 @@ function withMemo(canUseMemo, render) {
|
|
|
1726
1767
|
};
|
|
1727
1768
|
}
|
|
1728
1769
|
|
|
1729
|
-
const ElementNamespaceMap = {
|
|
1730
|
-
svg: 'svg',
|
|
1731
|
-
math: 'mathml',
|
|
1732
|
-
};
|
|
1733
1770
|
const listenerReg = /^on[A-Z]/;
|
|
1734
1771
|
function createRenderer(component, nativeRenderer, namespace) {
|
|
1735
1772
|
let isInit = true;
|
|
@@ -1780,7 +1817,7 @@ function buildElementChildren(atom, nativeRenderer, parentComponent, context) {
|
|
|
1780
1817
|
}
|
|
1781
1818
|
function patchComponent(nativeRenderer, component, oldChildAtom, newAtom, context, needMove) {
|
|
1782
1819
|
const newTemplate = component.rerender();
|
|
1783
|
-
newAtom.child = createChildChain(newTemplate, newAtom.namespace);
|
|
1820
|
+
newAtom.child = createChildChain(newTemplate, nativeRenderer, newAtom.namespace);
|
|
1784
1821
|
diff(nativeRenderer, component, newAtom.child, oldChildAtom, context, needMove);
|
|
1785
1822
|
}
|
|
1786
1823
|
function deepUpdateByComponentDirtyTree(nativeRenderer, component, needMove) {
|
|
@@ -2003,7 +2040,7 @@ function cleanChildren(atom, nativeRenderer, needClean) {
|
|
|
2003
2040
|
}
|
|
2004
2041
|
function componentRender(nativeRenderer, component, from, context) {
|
|
2005
2042
|
component.render((template, portalHost) => {
|
|
2006
|
-
from.child = createChildChain(template, from.namespace);
|
|
2043
|
+
from.child = createChildChain(template, nativeRenderer, from.namespace);
|
|
2007
2044
|
context = portalHost ? { isParent: true, host: portalHost, rootHost: portalHost } : context;
|
|
2008
2045
|
component.viewMetadata = Object.assign({ atom: from }, context);
|
|
2009
2046
|
let child = from.child;
|
|
@@ -2028,7 +2065,7 @@ function createChainByJSXNode(type, jsxNode, nodeType, prevAtom, namespace, key)
|
|
|
2028
2065
|
prevAtom.sibling = atom;
|
|
2029
2066
|
return atom;
|
|
2030
2067
|
}
|
|
2031
|
-
function createChainByNode(jsxNode, prevAtom, elementNamespace) {
|
|
2068
|
+
function createChainByNode(jsxNode, prevAtom, nativeRenderer, elementNamespace) {
|
|
2032
2069
|
const type = typeof jsxNode;
|
|
2033
2070
|
if (jsxNode != null && type !== 'boolean') {
|
|
2034
2071
|
if (type === 'string') {
|
|
@@ -2036,11 +2073,11 @@ function createChainByNode(jsxNode, prevAtom, elementNamespace) {
|
|
|
2036
2073
|
}
|
|
2037
2074
|
if (type === 'object') {
|
|
2038
2075
|
if (Array.isArray(jsxNode)) {
|
|
2039
|
-
return createChainByChildren(jsxNode, prevAtom, elementNamespace);
|
|
2076
|
+
return createChainByChildren(jsxNode, prevAtom, nativeRenderer, elementNamespace);
|
|
2040
2077
|
}
|
|
2041
2078
|
const nodeType = typeof jsxNode.type;
|
|
2042
2079
|
if (nodeType === 'string') {
|
|
2043
|
-
return createChainByJSXNode(ElementAtomType, jsxNode, jsxNode.type, prevAtom,
|
|
2080
|
+
return createChainByJSXNode(ElementAtomType, jsxNode, jsxNode.type, prevAtom, nativeRenderer.getNameSpace(jsxNode.type, elementNamespace), jsxNode.key);
|
|
2044
2081
|
}
|
|
2045
2082
|
else if (nodeType === 'function') {
|
|
2046
2083
|
return createChainByJSXNode(ComponentAtomType, jsxNode, jsxNode.type, prevAtom, elementNamespace, jsxNode.key);
|
|
@@ -2051,17 +2088,17 @@ function createChainByNode(jsxNode, prevAtom, elementNamespace) {
|
|
|
2051
2088
|
}
|
|
2052
2089
|
return prevAtom;
|
|
2053
2090
|
}
|
|
2054
|
-
function createChainByChildren(children, prevAtom, elementNamespace) {
|
|
2091
|
+
function createChainByChildren(children, prevAtom, nativeRenderer, elementNamespace) {
|
|
2055
2092
|
const len = children.length;
|
|
2056
2093
|
for (let i = 0; i < len; i++) {
|
|
2057
2094
|
const item = children[i];
|
|
2058
|
-
prevAtom = createChainByNode(item, prevAtom, elementNamespace);
|
|
2095
|
+
prevAtom = createChainByNode(item, prevAtom, nativeRenderer, elementNamespace);
|
|
2059
2096
|
}
|
|
2060
2097
|
return prevAtom;
|
|
2061
2098
|
}
|
|
2062
|
-
function createChildChain(template, namespace) {
|
|
2099
|
+
function createChildChain(template, nativeRenderer, namespace) {
|
|
2063
2100
|
const beforeAtom = { sibling: null, index: -1 };
|
|
2064
|
-
createChainByNode(template, beforeAtom, namespace);
|
|
2101
|
+
createChainByNode(template, beforeAtom, nativeRenderer, namespace);
|
|
2065
2102
|
return beforeAtom.sibling;
|
|
2066
2103
|
}
|
|
2067
2104
|
function insertNode(nativeRenderer, atom, context) {
|
|
@@ -2077,11 +2114,9 @@ function insertNode(nativeRenderer, atom, context) {
|
|
|
2077
2114
|
nativeRenderer.insertAfter(atom.nativeNode, context.host, atom.namespace);
|
|
2078
2115
|
}
|
|
2079
2116
|
}
|
|
2080
|
-
function createElementChildren(type, children, namespace) {
|
|
2081
|
-
|
|
2082
|
-
|
|
2083
|
-
}
|
|
2084
|
-
return createChildChain(children, namespace);
|
|
2117
|
+
function createElementChildren(type, children, nativeRenderer, namespace) {
|
|
2118
|
+
const ns = nativeRenderer.getNameSpace(type, namespace);
|
|
2119
|
+
return createChildChain(children, nativeRenderer, ns);
|
|
2085
2120
|
}
|
|
2086
2121
|
function createElement(nativeRenderer, atom, parentComponent, context) {
|
|
2087
2122
|
const { namespace, jsxNode } = atom;
|
|
@@ -2090,7 +2125,7 @@ function createElement(nativeRenderer, atom, parentComponent, context) {
|
|
|
2090
2125
|
let bindingRefs;
|
|
2091
2126
|
for (const key in props) {
|
|
2092
2127
|
if (key === 'children') {
|
|
2093
|
-
atom.child = createElementChildren(jsxNode.type, props.children, namespace);
|
|
2128
|
+
atom.child = createElementChildren(jsxNode.type, props.children, nativeRenderer, namespace);
|
|
2094
2129
|
continue;
|
|
2095
2130
|
}
|
|
2096
2131
|
if (key === 'class') {
|
|
@@ -2181,7 +2216,7 @@ function updateNativeNodeProperties(nativeRenderer, newAtom, oldAtom, parentComp
|
|
|
2181
2216
|
}, (key, value) => {
|
|
2182
2217
|
if (key === 'children') {
|
|
2183
2218
|
updatedChildren = true;
|
|
2184
|
-
newAtom.child = createElementChildren(newVNode.type, value, isSvg);
|
|
2219
|
+
newAtom.child = createElementChildren(newVNode.type, value, nativeRenderer, isSvg);
|
|
2185
2220
|
buildElementChildren(newAtom, nativeRenderer, parentComponent, context);
|
|
2186
2221
|
return;
|
|
2187
2222
|
}
|
|
@@ -2210,7 +2245,7 @@ function updateNativeNodeProperties(nativeRenderer, newAtom, oldAtom, parentComp
|
|
|
2210
2245
|
}, (key, newValue, oldValue) => {
|
|
2211
2246
|
if (key === 'children') {
|
|
2212
2247
|
updatedChildren = true;
|
|
2213
|
-
newAtom.child = createElementChildren(newVNode.type, newValue, isSvg);
|
|
2248
|
+
newAtom.child = createElementChildren(newVNode.type, newValue, nativeRenderer, isSvg);
|
|
2214
2249
|
if (!newAtom.child) {
|
|
2215
2250
|
cleanElementChildren(oldAtom, nativeRenderer);
|
|
2216
2251
|
}
|
|
@@ -2471,34 +2506,6 @@ function shallowReactive(raw) {
|
|
|
2471
2506
|
return proxy;
|
|
2472
2507
|
}
|
|
2473
2508
|
|
|
2474
|
-
function watch(trigger, callback) {
|
|
2475
|
-
let prevFn;
|
|
2476
|
-
const dep = new Dep(() => {
|
|
2477
|
-
pushDepContext(dep);
|
|
2478
|
-
const newValue = trigger();
|
|
2479
|
-
popDepContext();
|
|
2480
|
-
if (newValue === oldValue) {
|
|
2481
|
-
return;
|
|
2482
|
-
}
|
|
2483
|
-
if (prevFn) {
|
|
2484
|
-
prevFn();
|
|
2485
|
-
}
|
|
2486
|
-
prevFn = callback(newValue, oldValue);
|
|
2487
|
-
oldValue = newValue;
|
|
2488
|
-
});
|
|
2489
|
-
pushDepContext(dep);
|
|
2490
|
-
let oldValue = trigger();
|
|
2491
|
-
popDepContext();
|
|
2492
|
-
dep.destroyCallbacks.push(() => {
|
|
2493
|
-
prevFn === null || prevFn === void 0 ? void 0 : prevFn();
|
|
2494
|
-
});
|
|
2495
|
-
function unWatch() {
|
|
2496
|
-
dep.destroy();
|
|
2497
|
-
}
|
|
2498
|
-
registryComponentDestroyCallback(unWatch);
|
|
2499
|
-
return unWatch;
|
|
2500
|
-
}
|
|
2501
|
-
|
|
2502
2509
|
/**
|
|
2503
2510
|
* 组件状态管理器
|
|
2504
2511
|
* @param state 初始状态
|
|
@@ -2618,4 +2625,4 @@ function createEffect(deps, callback) {
|
|
|
2618
2625
|
return unWatch;
|
|
2619
2626
|
}
|
|
2620
2627
|
|
|
2621
|
-
export { ArrayReactiveHandler, Component, Dep, DynamicRef,
|
|
2628
|
+
export { ArrayReactiveHandler, Component, Dep, DynamicRef, ForwardRef, Fragment, Inject, InjectFlags, Injectable, InjectionToken, Injector, JSXNodeFactory, MapReactiveHandler, NativeRenderer, NullInjector, ObjectReactiveHandler, Optional, Prop, ReflectiveInjector, RootComponent, Scope, Self, SetReactiveHandler, SkipSelf, StaticRef, THROW_IF_NOT_FOUND, TrackOpTypes, TriggerOpTypes, Type, comparePropsWithCallbacks, computed, createContext, createContextProvider, createDerived, createDynamicRef, createEffect, createRef, createRenderer, createSignal, defaultArrayReactiveHandler, defaultMapReactiveHandler, defaultObjectReactiveHandler, defaultSetReactiveHandler, defaultShallowArrayReactiveHandler, defaultShallowMapReactiveHandler, defaultShallowObjectReactiveHandler, defaultShallowSetReactiveHandler, forwardRef, getCurrentInstance, getDepContext, getSetupContext, inject, internalWrite, isReactive, jsx, jsxs, makeError, normalizeProvider, onMounted, onUnmounted, onUpdated, popDepContext, proxyToRawCache, pushDepContext, rawToProxyCache, reactive, readonlyProxyHandler, registryComponentDestroyCallback, shallowReactive, toRaw, track, trigger, viewfly, watch, withAnnotation, withMemo };
|
package/bundles/index.js
CHANGED
|
@@ -1636,6 +1636,53 @@ function registryComponentDestroyCallback(fn) {
|
|
|
1636
1636
|
}
|
|
1637
1637
|
}
|
|
1638
1638
|
|
|
1639
|
+
function Fragment(props) {
|
|
1640
|
+
return () => {
|
|
1641
|
+
return props.children;
|
|
1642
|
+
};
|
|
1643
|
+
}
|
|
1644
|
+
function jsx(type, props, key) {
|
|
1645
|
+
return JSXNodeFactory.createNode(type, props, key);
|
|
1646
|
+
}
|
|
1647
|
+
const jsxs = jsx;
|
|
1648
|
+
const JSXNodeFactory = {
|
|
1649
|
+
createNode(type, props, key) {
|
|
1650
|
+
return {
|
|
1651
|
+
type,
|
|
1652
|
+
props,
|
|
1653
|
+
key
|
|
1654
|
+
};
|
|
1655
|
+
}
|
|
1656
|
+
};
|
|
1657
|
+
|
|
1658
|
+
function watch(trigger, callback) {
|
|
1659
|
+
let prevFn;
|
|
1660
|
+
const dep = new Dep(() => {
|
|
1661
|
+
pushDepContext(dep);
|
|
1662
|
+
const newValue = trigger();
|
|
1663
|
+
popDepContext();
|
|
1664
|
+
if (newValue === oldValue) {
|
|
1665
|
+
return;
|
|
1666
|
+
}
|
|
1667
|
+
if (prevFn) {
|
|
1668
|
+
prevFn();
|
|
1669
|
+
}
|
|
1670
|
+
prevFn = callback(newValue, oldValue);
|
|
1671
|
+
oldValue = newValue;
|
|
1672
|
+
});
|
|
1673
|
+
pushDepContext(dep);
|
|
1674
|
+
let oldValue = trigger();
|
|
1675
|
+
popDepContext();
|
|
1676
|
+
dep.destroyCallbacks.push(() => {
|
|
1677
|
+
prevFn === null || prevFn === void 0 ? void 0 : prevFn();
|
|
1678
|
+
});
|
|
1679
|
+
function unWatch() {
|
|
1680
|
+
dep.destroy();
|
|
1681
|
+
}
|
|
1682
|
+
registryComponentDestroyCallback(unWatch);
|
|
1683
|
+
return unWatch;
|
|
1684
|
+
}
|
|
1685
|
+
|
|
1639
1686
|
const injectMap = new WeakMap();
|
|
1640
1687
|
function getInjector(start) {
|
|
1641
1688
|
while (start) {
|
|
@@ -1657,6 +1704,19 @@ function createContext(providers, scope, parentInjector) {
|
|
|
1657
1704
|
};
|
|
1658
1705
|
};
|
|
1659
1706
|
}
|
|
1707
|
+
function createContextProvider(params) {
|
|
1708
|
+
return function contextProvider(props) {
|
|
1709
|
+
let Context = createContext([Object.assign({ provide: params.provide }, props)]);
|
|
1710
|
+
watch(() => {
|
|
1711
|
+
return props.useClass || props.useFactory || props.useValue || props.useExisting;
|
|
1712
|
+
}, () => {
|
|
1713
|
+
Context = createContext([Object.assign({ provide: params.provide }, props)]);
|
|
1714
|
+
});
|
|
1715
|
+
return () => {
|
|
1716
|
+
return jsx(Context, { children: props.children });
|
|
1717
|
+
};
|
|
1718
|
+
};
|
|
1719
|
+
}
|
|
1660
1720
|
/**
|
|
1661
1721
|
* 通过组件上下文获取 IoC 容器内数据的勾子方法
|
|
1662
1722
|
*/
|
|
@@ -1702,25 +1762,6 @@ function withAnnotation(annotation, componentSetup) {
|
|
|
1702
1762
|
class NativeRenderer {
|
|
1703
1763
|
}
|
|
1704
1764
|
|
|
1705
|
-
function Fragment(props) {
|
|
1706
|
-
return () => {
|
|
1707
|
-
return props.children;
|
|
1708
|
-
};
|
|
1709
|
-
}
|
|
1710
|
-
function jsx(type, props, key) {
|
|
1711
|
-
return JSXNodeFactory.createNode(type, props, key);
|
|
1712
|
-
}
|
|
1713
|
-
const jsxs = jsx;
|
|
1714
|
-
const JSXNodeFactory = {
|
|
1715
|
-
createNode(type, props, key) {
|
|
1716
|
-
return {
|
|
1717
|
-
type,
|
|
1718
|
-
props,
|
|
1719
|
-
key
|
|
1720
|
-
};
|
|
1721
|
-
}
|
|
1722
|
-
};
|
|
1723
|
-
|
|
1724
1765
|
function withMemo(canUseMemo, render) {
|
|
1725
1766
|
return {
|
|
1726
1767
|
$useMemo: canUseMemo,
|
|
@@ -1728,10 +1769,6 @@ function withMemo(canUseMemo, render) {
|
|
|
1728
1769
|
};
|
|
1729
1770
|
}
|
|
1730
1771
|
|
|
1731
|
-
const ElementNamespaceMap = {
|
|
1732
|
-
svg: 'svg',
|
|
1733
|
-
math: 'mathml',
|
|
1734
|
-
};
|
|
1735
1772
|
const listenerReg = /^on[A-Z]/;
|
|
1736
1773
|
function createRenderer(component, nativeRenderer, namespace) {
|
|
1737
1774
|
let isInit = true;
|
|
@@ -1782,7 +1819,7 @@ function buildElementChildren(atom, nativeRenderer, parentComponent, context) {
|
|
|
1782
1819
|
}
|
|
1783
1820
|
function patchComponent(nativeRenderer, component, oldChildAtom, newAtom, context, needMove) {
|
|
1784
1821
|
const newTemplate = component.rerender();
|
|
1785
|
-
newAtom.child = createChildChain(newTemplate, newAtom.namespace);
|
|
1822
|
+
newAtom.child = createChildChain(newTemplate, nativeRenderer, newAtom.namespace);
|
|
1786
1823
|
diff(nativeRenderer, component, newAtom.child, oldChildAtom, context, needMove);
|
|
1787
1824
|
}
|
|
1788
1825
|
function deepUpdateByComponentDirtyTree(nativeRenderer, component, needMove) {
|
|
@@ -2005,7 +2042,7 @@ function cleanChildren(atom, nativeRenderer, needClean) {
|
|
|
2005
2042
|
}
|
|
2006
2043
|
function componentRender(nativeRenderer, component, from, context) {
|
|
2007
2044
|
component.render((template, portalHost) => {
|
|
2008
|
-
from.child = createChildChain(template, from.namespace);
|
|
2045
|
+
from.child = createChildChain(template, nativeRenderer, from.namespace);
|
|
2009
2046
|
context = portalHost ? { isParent: true, host: portalHost, rootHost: portalHost } : context;
|
|
2010
2047
|
component.viewMetadata = Object.assign({ atom: from }, context);
|
|
2011
2048
|
let child = from.child;
|
|
@@ -2030,7 +2067,7 @@ function createChainByJSXNode(type, jsxNode, nodeType, prevAtom, namespace, key)
|
|
|
2030
2067
|
prevAtom.sibling = atom;
|
|
2031
2068
|
return atom;
|
|
2032
2069
|
}
|
|
2033
|
-
function createChainByNode(jsxNode, prevAtom, elementNamespace) {
|
|
2070
|
+
function createChainByNode(jsxNode, prevAtom, nativeRenderer, elementNamespace) {
|
|
2034
2071
|
const type = typeof jsxNode;
|
|
2035
2072
|
if (jsxNode != null && type !== 'boolean') {
|
|
2036
2073
|
if (type === 'string') {
|
|
@@ -2038,11 +2075,11 @@ function createChainByNode(jsxNode, prevAtom, elementNamespace) {
|
|
|
2038
2075
|
}
|
|
2039
2076
|
if (type === 'object') {
|
|
2040
2077
|
if (Array.isArray(jsxNode)) {
|
|
2041
|
-
return createChainByChildren(jsxNode, prevAtom, elementNamespace);
|
|
2078
|
+
return createChainByChildren(jsxNode, prevAtom, nativeRenderer, elementNamespace);
|
|
2042
2079
|
}
|
|
2043
2080
|
const nodeType = typeof jsxNode.type;
|
|
2044
2081
|
if (nodeType === 'string') {
|
|
2045
|
-
return createChainByJSXNode(ElementAtomType, jsxNode, jsxNode.type, prevAtom,
|
|
2082
|
+
return createChainByJSXNode(ElementAtomType, jsxNode, jsxNode.type, prevAtom, nativeRenderer.getNameSpace(jsxNode.type, elementNamespace), jsxNode.key);
|
|
2046
2083
|
}
|
|
2047
2084
|
else if (nodeType === 'function') {
|
|
2048
2085
|
return createChainByJSXNode(ComponentAtomType, jsxNode, jsxNode.type, prevAtom, elementNamespace, jsxNode.key);
|
|
@@ -2053,17 +2090,17 @@ function createChainByNode(jsxNode, prevAtom, elementNamespace) {
|
|
|
2053
2090
|
}
|
|
2054
2091
|
return prevAtom;
|
|
2055
2092
|
}
|
|
2056
|
-
function createChainByChildren(children, prevAtom, elementNamespace) {
|
|
2093
|
+
function createChainByChildren(children, prevAtom, nativeRenderer, elementNamespace) {
|
|
2057
2094
|
const len = children.length;
|
|
2058
2095
|
for (let i = 0; i < len; i++) {
|
|
2059
2096
|
const item = children[i];
|
|
2060
|
-
prevAtom = createChainByNode(item, prevAtom, elementNamespace);
|
|
2097
|
+
prevAtom = createChainByNode(item, prevAtom, nativeRenderer, elementNamespace);
|
|
2061
2098
|
}
|
|
2062
2099
|
return prevAtom;
|
|
2063
2100
|
}
|
|
2064
|
-
function createChildChain(template, namespace) {
|
|
2101
|
+
function createChildChain(template, nativeRenderer, namespace) {
|
|
2065
2102
|
const beforeAtom = { sibling: null, index: -1 };
|
|
2066
|
-
createChainByNode(template, beforeAtom, namespace);
|
|
2103
|
+
createChainByNode(template, beforeAtom, nativeRenderer, namespace);
|
|
2067
2104
|
return beforeAtom.sibling;
|
|
2068
2105
|
}
|
|
2069
2106
|
function insertNode(nativeRenderer, atom, context) {
|
|
@@ -2079,11 +2116,9 @@ function insertNode(nativeRenderer, atom, context) {
|
|
|
2079
2116
|
nativeRenderer.insertAfter(atom.nativeNode, context.host, atom.namespace);
|
|
2080
2117
|
}
|
|
2081
2118
|
}
|
|
2082
|
-
function createElementChildren(type, children, namespace) {
|
|
2083
|
-
|
|
2084
|
-
|
|
2085
|
-
}
|
|
2086
|
-
return createChildChain(children, namespace);
|
|
2119
|
+
function createElementChildren(type, children, nativeRenderer, namespace) {
|
|
2120
|
+
const ns = nativeRenderer.getNameSpace(type, namespace);
|
|
2121
|
+
return createChildChain(children, nativeRenderer, ns);
|
|
2087
2122
|
}
|
|
2088
2123
|
function createElement(nativeRenderer, atom, parentComponent, context) {
|
|
2089
2124
|
const { namespace, jsxNode } = atom;
|
|
@@ -2092,7 +2127,7 @@ function createElement(nativeRenderer, atom, parentComponent, context) {
|
|
|
2092
2127
|
let bindingRefs;
|
|
2093
2128
|
for (const key in props) {
|
|
2094
2129
|
if (key === 'children') {
|
|
2095
|
-
atom.child = createElementChildren(jsxNode.type, props.children, namespace);
|
|
2130
|
+
atom.child = createElementChildren(jsxNode.type, props.children, nativeRenderer, namespace);
|
|
2096
2131
|
continue;
|
|
2097
2132
|
}
|
|
2098
2133
|
if (key === 'class') {
|
|
@@ -2183,7 +2218,7 @@ function updateNativeNodeProperties(nativeRenderer, newAtom, oldAtom, parentComp
|
|
|
2183
2218
|
}, (key, value) => {
|
|
2184
2219
|
if (key === 'children') {
|
|
2185
2220
|
updatedChildren = true;
|
|
2186
|
-
newAtom.child = createElementChildren(newVNode.type, value, isSvg);
|
|
2221
|
+
newAtom.child = createElementChildren(newVNode.type, value, nativeRenderer, isSvg);
|
|
2187
2222
|
buildElementChildren(newAtom, nativeRenderer, parentComponent, context);
|
|
2188
2223
|
return;
|
|
2189
2224
|
}
|
|
@@ -2212,7 +2247,7 @@ function updateNativeNodeProperties(nativeRenderer, newAtom, oldAtom, parentComp
|
|
|
2212
2247
|
}, (key, newValue, oldValue) => {
|
|
2213
2248
|
if (key === 'children') {
|
|
2214
2249
|
updatedChildren = true;
|
|
2215
|
-
newAtom.child = createElementChildren(newVNode.type, newValue, isSvg);
|
|
2250
|
+
newAtom.child = createElementChildren(newVNode.type, newValue, nativeRenderer, isSvg);
|
|
2216
2251
|
if (!newAtom.child) {
|
|
2217
2252
|
cleanElementChildren(oldAtom, nativeRenderer);
|
|
2218
2253
|
}
|
|
@@ -2473,34 +2508,6 @@ function shallowReactive(raw) {
|
|
|
2473
2508
|
return proxy;
|
|
2474
2509
|
}
|
|
2475
2510
|
|
|
2476
|
-
function watch(trigger, callback) {
|
|
2477
|
-
let prevFn;
|
|
2478
|
-
const dep = new Dep(() => {
|
|
2479
|
-
pushDepContext(dep);
|
|
2480
|
-
const newValue = trigger();
|
|
2481
|
-
popDepContext();
|
|
2482
|
-
if (newValue === oldValue) {
|
|
2483
|
-
return;
|
|
2484
|
-
}
|
|
2485
|
-
if (prevFn) {
|
|
2486
|
-
prevFn();
|
|
2487
|
-
}
|
|
2488
|
-
prevFn = callback(newValue, oldValue);
|
|
2489
|
-
oldValue = newValue;
|
|
2490
|
-
});
|
|
2491
|
-
pushDepContext(dep);
|
|
2492
|
-
let oldValue = trigger();
|
|
2493
|
-
popDepContext();
|
|
2494
|
-
dep.destroyCallbacks.push(() => {
|
|
2495
|
-
prevFn === null || prevFn === void 0 ? void 0 : prevFn();
|
|
2496
|
-
});
|
|
2497
|
-
function unWatch() {
|
|
2498
|
-
dep.destroy();
|
|
2499
|
-
}
|
|
2500
|
-
registryComponentDestroyCallback(unWatch);
|
|
2501
|
-
return unWatch;
|
|
2502
|
-
}
|
|
2503
|
-
|
|
2504
2511
|
/**
|
|
2505
2512
|
* 组件状态管理器
|
|
2506
2513
|
* @param state 初始状态
|
|
@@ -2624,7 +2631,6 @@ exports.ArrayReactiveHandler = ArrayReactiveHandler;
|
|
|
2624
2631
|
exports.Component = Component;
|
|
2625
2632
|
exports.Dep = Dep;
|
|
2626
2633
|
exports.DynamicRef = DynamicRef;
|
|
2627
|
-
exports.ElementNamespaceMap = ElementNamespaceMap;
|
|
2628
2634
|
exports.ForwardRef = ForwardRef;
|
|
2629
2635
|
exports.Fragment = Fragment;
|
|
2630
2636
|
exports.Inject = Inject;
|
|
@@ -2650,6 +2656,7 @@ exports.Type = Type;
|
|
|
2650
2656
|
exports.comparePropsWithCallbacks = comparePropsWithCallbacks;
|
|
2651
2657
|
exports.computed = computed;
|
|
2652
2658
|
exports.createContext = createContext;
|
|
2659
|
+
exports.createContextProvider = createContextProvider;
|
|
2653
2660
|
exports.createDerived = createDerived;
|
|
2654
2661
|
exports.createDynamicRef = createDynamicRef;
|
|
2655
2662
|
exports.createEffect = createEffect;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@viewfly/core",
|
|
3
|
-
"version": "2.0.0-alpha.
|
|
3
|
+
"version": "2.0.0-alpha.6",
|
|
4
4
|
"description": "Viewfly is a simple and easy-to-use JavaScript framework with an intuitive development experience.",
|
|
5
5
|
"main": "./bundles/index.js",
|
|
6
6
|
"module": "./bundles/index.esm.js",
|
|
@@ -50,7 +50,7 @@
|
|
|
50
50
|
"bugs": {
|
|
51
51
|
"url": "https://github.com/viewfly/viewfly.git/issues"
|
|
52
52
|
},
|
|
53
|
-
"gitHead": "
|
|
53
|
+
"gitHead": "287516a11d9fddbe9f38c341e06d1b7256cfe7ac",
|
|
54
54
|
"dependencies": {
|
|
55
55
|
"reflect-metadata": "^0.2.2"
|
|
56
56
|
}
|