@viewfly/core 0.0.31 → 0.1.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/bundles/foundation/component.d.ts +3 -2
- package/bundles/index.esm.js +44 -15
- package/bundles/index.js +44 -15
- package/bundles/viewfly.d.ts +7 -1
- package/package.json +2 -2
|
@@ -11,7 +11,7 @@ export declare class Component extends ReflectiveInjector implements JSXTypeof<J
|
|
|
11
11
|
props: Props;
|
|
12
12
|
key?: Key | undefined;
|
|
13
13
|
$$typeOf: JSXInternal.ComponentSetup<any>;
|
|
14
|
-
|
|
14
|
+
unmountedCallbacks: LifeCycleCallback[];
|
|
15
15
|
mountCallbacks: LifeCycleCallback[];
|
|
16
16
|
propsChangedCallbacks: PropsChangedCallback<any>[];
|
|
17
17
|
updatedCallbacks: LifeCycleCallback[];
|
|
@@ -99,7 +99,7 @@ export declare function onPropsChanged<T extends Props>(callback: PropsChangedCa
|
|
|
99
99
|
* 当组件销毁时调用回调函数
|
|
100
100
|
* @param callback
|
|
101
101
|
*/
|
|
102
|
-
export declare function
|
|
102
|
+
export declare function onUnmounted(callback: () => void): void;
|
|
103
103
|
export interface RefListener<T> {
|
|
104
104
|
(current: T): void | (() => void);
|
|
105
105
|
}
|
|
@@ -143,6 +143,7 @@ declare const depsKey: unique symbol;
|
|
|
143
143
|
* ```
|
|
144
144
|
*/
|
|
145
145
|
export interface Signal<T> {
|
|
146
|
+
$isSignal: true;
|
|
146
147
|
/**
|
|
147
148
|
* 直接调用一个 Signal 实例,可以获取最新状态
|
|
148
149
|
*/
|
package/bundles/index.esm.js
CHANGED
|
@@ -663,7 +663,7 @@ class Component extends ReflectiveInjector {
|
|
|
663
663
|
this.props = props;
|
|
664
664
|
this.key = key;
|
|
665
665
|
this.$$typeOf = this.type;
|
|
666
|
-
this.
|
|
666
|
+
this.unmountedCallbacks = [];
|
|
667
667
|
this.mountCallbacks = [];
|
|
668
668
|
this.propsChangedCallbacks = [];
|
|
669
669
|
this.updatedCallbacks = [];
|
|
@@ -716,7 +716,7 @@ class Component extends ReflectiveInjector {
|
|
|
716
716
|
ref.bind(this.instance);
|
|
717
717
|
}
|
|
718
718
|
});
|
|
719
|
-
this.
|
|
719
|
+
this.unmountedCallbacks.push(() => {
|
|
720
720
|
for (const ref of this.refs) {
|
|
721
721
|
ref.unBind(this.instance);
|
|
722
722
|
}
|
|
@@ -791,7 +791,7 @@ class Component extends ReflectiveInjector {
|
|
|
791
791
|
fn();
|
|
792
792
|
});
|
|
793
793
|
this.propsChangedDestroyCallbacks = [];
|
|
794
|
-
for (const fn of this.
|
|
794
|
+
for (const fn of this.unmountedCallbacks) {
|
|
795
795
|
fn();
|
|
796
796
|
}
|
|
797
797
|
this.updatedCallbacks = [];
|
|
@@ -816,7 +816,7 @@ class Component extends ReflectiveInjector {
|
|
|
816
816
|
for (const fn of this.mountCallbacks) {
|
|
817
817
|
const destroyFn = fn();
|
|
818
818
|
if (typeof destroyFn === 'function') {
|
|
819
|
-
this.
|
|
819
|
+
this.unmountedCallbacks.push(destroyFn);
|
|
820
820
|
}
|
|
821
821
|
}
|
|
822
822
|
}
|
|
@@ -912,9 +912,9 @@ function onPropsChanged(callback) {
|
|
|
912
912
|
* 当组件销毁时调用回调函数
|
|
913
913
|
* @param callback
|
|
914
914
|
*/
|
|
915
|
-
function
|
|
915
|
+
function onUnmounted(callback) {
|
|
916
916
|
const component = getSetupContext();
|
|
917
|
-
component.
|
|
917
|
+
component.unmountedCallbacks.push(callback);
|
|
918
918
|
}
|
|
919
919
|
class Ref {
|
|
920
920
|
constructor(callback) {
|
|
@@ -1000,6 +1000,7 @@ function useSignal(state) {
|
|
|
1000
1000
|
}
|
|
1001
1001
|
return state;
|
|
1002
1002
|
}
|
|
1003
|
+
signal.$isSignal = true;
|
|
1003
1004
|
signal.set = function (newState) {
|
|
1004
1005
|
if (newState === state) {
|
|
1005
1006
|
return;
|
|
@@ -1011,6 +1012,14 @@ function useSignal(state) {
|
|
|
1011
1012
|
fn();
|
|
1012
1013
|
}
|
|
1013
1014
|
};
|
|
1015
|
+
//
|
|
1016
|
+
// signal.toString = function () {
|
|
1017
|
+
// return String(state)
|
|
1018
|
+
// }
|
|
1019
|
+
//
|
|
1020
|
+
// signal.valueOf = function () {
|
|
1021
|
+
// return state
|
|
1022
|
+
// }
|
|
1014
1023
|
signal[depsKey] = new Set();
|
|
1015
1024
|
return signal;
|
|
1016
1025
|
}
|
|
@@ -1075,7 +1084,7 @@ function useDerived(callback, isContinue) {
|
|
|
1075
1084
|
const component = getSetupContext(false);
|
|
1076
1085
|
const unListen = listen(signal, deps, callback, isContinue);
|
|
1077
1086
|
if (component) {
|
|
1078
|
-
component.
|
|
1087
|
+
component.unmountedCallbacks.push(() => {
|
|
1079
1088
|
unListen();
|
|
1080
1089
|
});
|
|
1081
1090
|
}
|
|
@@ -1083,9 +1092,7 @@ function useDerived(callback, isContinue) {
|
|
|
1083
1092
|
}
|
|
1084
1093
|
/* eslint-enable max-len*/
|
|
1085
1094
|
function useEffect(deps, effect) {
|
|
1086
|
-
if (typeof deps === 'function' &&
|
|
1087
|
-
typeof deps.set === 'undefined' &&
|
|
1088
|
-
typeof deps[depsKey] === 'undefined') {
|
|
1095
|
+
if (typeof deps === 'function' && !deps.$isSignal) {
|
|
1089
1096
|
deps = useDerived(deps);
|
|
1090
1097
|
}
|
|
1091
1098
|
const signals = Array.isArray(deps) ? deps : [deps];
|
|
@@ -1110,15 +1117,15 @@ function useEffect(deps, effect) {
|
|
|
1110
1117
|
}
|
|
1111
1118
|
isClean = true;
|
|
1112
1119
|
if (component) {
|
|
1113
|
-
const index = component.
|
|
1114
|
-
component.
|
|
1120
|
+
const index = component.unmountedCallbacks.indexOf(destroyFn);
|
|
1121
|
+
component.unmountedCallbacks.splice(index, 1);
|
|
1115
1122
|
}
|
|
1116
1123
|
for (const dep of signals) {
|
|
1117
1124
|
dep[depsKey].delete(effectCallback);
|
|
1118
1125
|
}
|
|
1119
1126
|
};
|
|
1120
1127
|
if (component) {
|
|
1121
|
-
component.
|
|
1128
|
+
component.unmountedCallbacks.push(destroyFn);
|
|
1122
1129
|
}
|
|
1123
1130
|
return destroyFn;
|
|
1124
1131
|
}
|
|
@@ -1789,8 +1796,10 @@ class RootComponent extends Component {
|
|
|
1789
1796
|
}
|
|
1790
1797
|
|
|
1791
1798
|
const viewflyErrorFn = makeError('Viewfly');
|
|
1792
|
-
function viewfly(
|
|
1799
|
+
function viewfly(config) {
|
|
1800
|
+
const { context, nativeRenderer, autoUpdate, root } = Object.assign({ autoUpdate: true }, config);
|
|
1793
1801
|
const appProviders = [];
|
|
1802
|
+
const modules = [];
|
|
1794
1803
|
let destroyed = false;
|
|
1795
1804
|
const rootComponent = new RootComponent(context || null, () => {
|
|
1796
1805
|
provide(appProviders);
|
|
@@ -1820,13 +1829,29 @@ function viewfly({ context, nativeRenderer, autoUpdate, root }) {
|
|
|
1820
1829
|
}
|
|
1821
1830
|
return app;
|
|
1822
1831
|
},
|
|
1832
|
+
use(module) {
|
|
1833
|
+
if (Array.isArray(module)) {
|
|
1834
|
+
modules.push(...module);
|
|
1835
|
+
}
|
|
1836
|
+
else {
|
|
1837
|
+
modules.push(module);
|
|
1838
|
+
}
|
|
1839
|
+
return app;
|
|
1840
|
+
},
|
|
1823
1841
|
mount(host) {
|
|
1842
|
+
var _a, _b;
|
|
1824
1843
|
if (isStarted) {
|
|
1825
1844
|
throw viewflyErrorFn('application has already started.');
|
|
1826
1845
|
}
|
|
1846
|
+
for (const module of modules) {
|
|
1847
|
+
(_a = module.setup) === null || _a === void 0 ? void 0 : _a.call(module, app);
|
|
1848
|
+
}
|
|
1827
1849
|
isStarted = true;
|
|
1828
1850
|
appHost = host;
|
|
1829
1851
|
render(host);
|
|
1852
|
+
for (const module of modules) {
|
|
1853
|
+
(_b = module.onAfterStartup) === null || _b === void 0 ? void 0 : _b.call(module, app);
|
|
1854
|
+
}
|
|
1830
1855
|
if (!autoUpdate) {
|
|
1831
1856
|
return app;
|
|
1832
1857
|
}
|
|
@@ -1848,12 +1873,16 @@ function viewfly({ context, nativeRenderer, autoUpdate, root }) {
|
|
|
1848
1873
|
return app;
|
|
1849
1874
|
},
|
|
1850
1875
|
destroy() {
|
|
1876
|
+
var _a;
|
|
1851
1877
|
destroyed = true;
|
|
1852
1878
|
rootComponent.markAsDirtied();
|
|
1853
1879
|
app.render();
|
|
1880
|
+
for (const module of modules) {
|
|
1881
|
+
(_a = module.onDestroy) === null || _a === void 0 ? void 0 : _a.call(module);
|
|
1882
|
+
}
|
|
1854
1883
|
}
|
|
1855
1884
|
};
|
|
1856
1885
|
return app;
|
|
1857
1886
|
}
|
|
1858
1887
|
|
|
1859
|
-
export { Component, ForwardRef, Fragment, Inject, InjectFlags, Injectable, InjectionToken, Injector, JSXComponent, JSXElement, JSXText, NativeRenderer, NullInjector, Optional, Prop, Ref, ReflectiveInjector, RootComponent, Scope, Self, SkipSelf, THROW_IF_NOT_FOUND, Type, createRenderer, forwardRef, inject, jsx, jsxs, makeError, normalizeProvider,
|
|
1888
|
+
export { Component, ForwardRef, Fragment, Inject, InjectFlags, Injectable, InjectionToken, Injector, JSXComponent, JSXElement, JSXText, NativeRenderer, NullInjector, Optional, Prop, Ref, ReflectiveInjector, RootComponent, Scope, Self, SkipSelf, THROW_IF_NOT_FOUND, Type, createRenderer, forwardRef, inject, jsx, jsxs, makeError, normalizeProvider, onMounted, onPropsChanged, onUnmounted, onUpdated, provide, useDerived, useEffect, useRef, useSignal, viewfly, withMemo };
|
package/bundles/index.js
CHANGED
|
@@ -665,7 +665,7 @@ class Component extends ReflectiveInjector {
|
|
|
665
665
|
this.props = props;
|
|
666
666
|
this.key = key;
|
|
667
667
|
this.$$typeOf = this.type;
|
|
668
|
-
this.
|
|
668
|
+
this.unmountedCallbacks = [];
|
|
669
669
|
this.mountCallbacks = [];
|
|
670
670
|
this.propsChangedCallbacks = [];
|
|
671
671
|
this.updatedCallbacks = [];
|
|
@@ -718,7 +718,7 @@ class Component extends ReflectiveInjector {
|
|
|
718
718
|
ref.bind(this.instance);
|
|
719
719
|
}
|
|
720
720
|
});
|
|
721
|
-
this.
|
|
721
|
+
this.unmountedCallbacks.push(() => {
|
|
722
722
|
for (const ref of this.refs) {
|
|
723
723
|
ref.unBind(this.instance);
|
|
724
724
|
}
|
|
@@ -793,7 +793,7 @@ class Component extends ReflectiveInjector {
|
|
|
793
793
|
fn();
|
|
794
794
|
});
|
|
795
795
|
this.propsChangedDestroyCallbacks = [];
|
|
796
|
-
for (const fn of this.
|
|
796
|
+
for (const fn of this.unmountedCallbacks) {
|
|
797
797
|
fn();
|
|
798
798
|
}
|
|
799
799
|
this.updatedCallbacks = [];
|
|
@@ -818,7 +818,7 @@ class Component extends ReflectiveInjector {
|
|
|
818
818
|
for (const fn of this.mountCallbacks) {
|
|
819
819
|
const destroyFn = fn();
|
|
820
820
|
if (typeof destroyFn === 'function') {
|
|
821
|
-
this.
|
|
821
|
+
this.unmountedCallbacks.push(destroyFn);
|
|
822
822
|
}
|
|
823
823
|
}
|
|
824
824
|
}
|
|
@@ -914,9 +914,9 @@ function onPropsChanged(callback) {
|
|
|
914
914
|
* 当组件销毁时调用回调函数
|
|
915
915
|
* @param callback
|
|
916
916
|
*/
|
|
917
|
-
function
|
|
917
|
+
function onUnmounted(callback) {
|
|
918
918
|
const component = getSetupContext();
|
|
919
|
-
component.
|
|
919
|
+
component.unmountedCallbacks.push(callback);
|
|
920
920
|
}
|
|
921
921
|
class Ref {
|
|
922
922
|
constructor(callback) {
|
|
@@ -1002,6 +1002,7 @@ function useSignal(state) {
|
|
|
1002
1002
|
}
|
|
1003
1003
|
return state;
|
|
1004
1004
|
}
|
|
1005
|
+
signal.$isSignal = true;
|
|
1005
1006
|
signal.set = function (newState) {
|
|
1006
1007
|
if (newState === state) {
|
|
1007
1008
|
return;
|
|
@@ -1013,6 +1014,14 @@ function useSignal(state) {
|
|
|
1013
1014
|
fn();
|
|
1014
1015
|
}
|
|
1015
1016
|
};
|
|
1017
|
+
//
|
|
1018
|
+
// signal.toString = function () {
|
|
1019
|
+
// return String(state)
|
|
1020
|
+
// }
|
|
1021
|
+
//
|
|
1022
|
+
// signal.valueOf = function () {
|
|
1023
|
+
// return state
|
|
1024
|
+
// }
|
|
1016
1025
|
signal[depsKey] = new Set();
|
|
1017
1026
|
return signal;
|
|
1018
1027
|
}
|
|
@@ -1077,7 +1086,7 @@ function useDerived(callback, isContinue) {
|
|
|
1077
1086
|
const component = getSetupContext(false);
|
|
1078
1087
|
const unListen = listen(signal, deps, callback, isContinue);
|
|
1079
1088
|
if (component) {
|
|
1080
|
-
component.
|
|
1089
|
+
component.unmountedCallbacks.push(() => {
|
|
1081
1090
|
unListen();
|
|
1082
1091
|
});
|
|
1083
1092
|
}
|
|
@@ -1085,9 +1094,7 @@ function useDerived(callback, isContinue) {
|
|
|
1085
1094
|
}
|
|
1086
1095
|
/* eslint-enable max-len*/
|
|
1087
1096
|
function useEffect(deps, effect) {
|
|
1088
|
-
if (typeof deps === 'function' &&
|
|
1089
|
-
typeof deps.set === 'undefined' &&
|
|
1090
|
-
typeof deps[depsKey] === 'undefined') {
|
|
1097
|
+
if (typeof deps === 'function' && !deps.$isSignal) {
|
|
1091
1098
|
deps = useDerived(deps);
|
|
1092
1099
|
}
|
|
1093
1100
|
const signals = Array.isArray(deps) ? deps : [deps];
|
|
@@ -1112,15 +1119,15 @@ function useEffect(deps, effect) {
|
|
|
1112
1119
|
}
|
|
1113
1120
|
isClean = true;
|
|
1114
1121
|
if (component) {
|
|
1115
|
-
const index = component.
|
|
1116
|
-
component.
|
|
1122
|
+
const index = component.unmountedCallbacks.indexOf(destroyFn);
|
|
1123
|
+
component.unmountedCallbacks.splice(index, 1);
|
|
1117
1124
|
}
|
|
1118
1125
|
for (const dep of signals) {
|
|
1119
1126
|
dep[depsKey].delete(effectCallback);
|
|
1120
1127
|
}
|
|
1121
1128
|
};
|
|
1122
1129
|
if (component) {
|
|
1123
|
-
component.
|
|
1130
|
+
component.unmountedCallbacks.push(destroyFn);
|
|
1124
1131
|
}
|
|
1125
1132
|
return destroyFn;
|
|
1126
1133
|
}
|
|
@@ -1791,8 +1798,10 @@ class RootComponent extends Component {
|
|
|
1791
1798
|
}
|
|
1792
1799
|
|
|
1793
1800
|
const viewflyErrorFn = makeError('Viewfly');
|
|
1794
|
-
function viewfly(
|
|
1801
|
+
function viewfly(config) {
|
|
1802
|
+
const { context, nativeRenderer, autoUpdate, root } = Object.assign({ autoUpdate: true }, config);
|
|
1795
1803
|
const appProviders = [];
|
|
1804
|
+
const modules = [];
|
|
1796
1805
|
let destroyed = false;
|
|
1797
1806
|
const rootComponent = new RootComponent(context || null, () => {
|
|
1798
1807
|
provide(appProviders);
|
|
@@ -1822,13 +1831,29 @@ function viewfly({ context, nativeRenderer, autoUpdate, root }) {
|
|
|
1822
1831
|
}
|
|
1823
1832
|
return app;
|
|
1824
1833
|
},
|
|
1834
|
+
use(module) {
|
|
1835
|
+
if (Array.isArray(module)) {
|
|
1836
|
+
modules.push(...module);
|
|
1837
|
+
}
|
|
1838
|
+
else {
|
|
1839
|
+
modules.push(module);
|
|
1840
|
+
}
|
|
1841
|
+
return app;
|
|
1842
|
+
},
|
|
1825
1843
|
mount(host) {
|
|
1844
|
+
var _a, _b;
|
|
1826
1845
|
if (isStarted) {
|
|
1827
1846
|
throw viewflyErrorFn('application has already started.');
|
|
1828
1847
|
}
|
|
1848
|
+
for (const module of modules) {
|
|
1849
|
+
(_a = module.setup) === null || _a === void 0 ? void 0 : _a.call(module, app);
|
|
1850
|
+
}
|
|
1829
1851
|
isStarted = true;
|
|
1830
1852
|
appHost = host;
|
|
1831
1853
|
render(host);
|
|
1854
|
+
for (const module of modules) {
|
|
1855
|
+
(_b = module.onAfterStartup) === null || _b === void 0 ? void 0 : _b.call(module, app);
|
|
1856
|
+
}
|
|
1832
1857
|
if (!autoUpdate) {
|
|
1833
1858
|
return app;
|
|
1834
1859
|
}
|
|
@@ -1850,9 +1875,13 @@ function viewfly({ context, nativeRenderer, autoUpdate, root }) {
|
|
|
1850
1875
|
return app;
|
|
1851
1876
|
},
|
|
1852
1877
|
destroy() {
|
|
1878
|
+
var _a;
|
|
1853
1879
|
destroyed = true;
|
|
1854
1880
|
rootComponent.markAsDirtied();
|
|
1855
1881
|
app.render();
|
|
1882
|
+
for (const module of modules) {
|
|
1883
|
+
(_a = module.onDestroy) === null || _a === void 0 ? void 0 : _a.call(module);
|
|
1884
|
+
}
|
|
1856
1885
|
}
|
|
1857
1886
|
};
|
|
1858
1887
|
return app;
|
|
@@ -1887,9 +1916,9 @@ exports.jsx = jsx;
|
|
|
1887
1916
|
exports.jsxs = jsxs;
|
|
1888
1917
|
exports.makeError = makeError;
|
|
1889
1918
|
exports.normalizeProvider = normalizeProvider;
|
|
1890
|
-
exports.onDestroy = onDestroy;
|
|
1891
1919
|
exports.onMounted = onMounted;
|
|
1892
1920
|
exports.onPropsChanged = onPropsChanged;
|
|
1921
|
+
exports.onUnmounted = onUnmounted;
|
|
1893
1922
|
exports.onUpdated = onUpdated;
|
|
1894
1923
|
exports.provide = provide;
|
|
1895
1924
|
exports.useDerived = useDerived;
|
package/bundles/viewfly.d.ts
CHANGED
|
@@ -17,7 +17,13 @@ export interface Config {
|
|
|
17
17
|
export interface Application<T extends NativeNode = NativeNode> {
|
|
18
18
|
provide(providers: Provider | Provider[]): Application<T>;
|
|
19
19
|
mount(host: T, autoUpdate?: boolean): Application<T>;
|
|
20
|
+
use(module: Module | Module[]): Application<T>;
|
|
20
21
|
render(): Application<T>;
|
|
21
22
|
destroy(): void;
|
|
22
23
|
}
|
|
23
|
-
export
|
|
24
|
+
export interface Module {
|
|
25
|
+
setup?(app: Application): void;
|
|
26
|
+
onAfterStartup?(app: Application): void;
|
|
27
|
+
onDestroy?(): void;
|
|
28
|
+
}
|
|
29
|
+
export declare function viewfly<T extends NativeNode>(config: Config): Application<T>;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@viewfly/core",
|
|
3
|
-
"version": "0.0
|
|
3
|
+
"version": "0.1.0",
|
|
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",
|
|
@@ -46,5 +46,5 @@
|
|
|
46
46
|
"bugs": {
|
|
47
47
|
"url": "https://github.com/viewfly/viewfly.git/issues"
|
|
48
48
|
},
|
|
49
|
-
"gitHead": "
|
|
49
|
+
"gitHead": "790bb591abb02c500f54c579c7783da66a999b87"
|
|
50
50
|
}
|