@praxisjs/decorators 0.1.0 → 0.3.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/CHANGELOG.md +37 -0
- package/dist/component/component.d.ts +2 -2
- package/dist/component/component.d.ts.map +1 -1
- package/dist/component/component.js +5 -2
- package/dist/component/component.js.map +1 -1
- package/dist/component/index.d.ts +0 -1
- package/dist/component/index.d.ts.map +1 -1
- package/dist/component/index.js +0 -1
- package/dist/component/index.js.map +1 -1
- package/dist/component/lazy.d.ts +2 -2
- package/dist/component/lazy.d.ts.map +1 -1
- package/dist/component/lazy.js +8 -8
- package/dist/component/lazy.js.map +1 -1
- package/dist/component/virtual.d.ts +2 -2
- package/dist/component/virtual.d.ts.map +1 -1
- package/dist/component/virtual.js +45 -14
- package/dist/component/virtual.js.map +1 -1
- package/dist/events/emit.d.ts +2 -1
- package/dist/events/emit.d.ts.map +1 -1
- package/dist/events/emit.js +11 -16
- package/dist/events/emit.js.map +1 -1
- package/dist/events/helper.d.ts +2 -2
- package/dist/events/helper.d.ts.map +1 -1
- package/dist/events/helper.js.map +1 -1
- package/dist/events/on-command.d.ts +2 -1
- package/dist/events/on-command.d.ts.map +1 -1
- package/dist/events/on-command.js +30 -27
- package/dist/events/on-command.js.map +1 -1
- package/dist/functions/bind.d.ts +2 -1
- package/dist/functions/bind.d.ts.map +1 -1
- package/dist/functions/bind.js +10 -15
- package/dist/functions/bind.js.map +1 -1
- package/dist/functions/debounce.d.ts +2 -1
- package/dist/functions/debounce.d.ts.map +1 -1
- package/dist/functions/debounce.js +20 -24
- package/dist/functions/debounce.js.map +1 -1
- package/dist/functions/log.d.ts +2 -1
- package/dist/functions/log.d.ts.map +1 -1
- package/dist/functions/log.js +5 -6
- package/dist/functions/log.js.map +1 -1
- package/dist/functions/memo.d.ts +2 -1
- package/dist/functions/memo.d.ts.map +1 -1
- package/dist/functions/memo.js +5 -6
- package/dist/functions/memo.js.map +1 -1
- package/dist/functions/once.d.ts +2 -1
- package/dist/functions/once.d.ts.map +1 -1
- package/dist/functions/once.js +3 -5
- package/dist/functions/once.js.map +1 -1
- package/dist/functions/retry.d.ts +2 -1
- package/dist/functions/retry.d.ts.map +1 -1
- package/dist/functions/retry.js +3 -5
- package/dist/functions/retry.js.map +1 -1
- package/dist/functions/throttle.d.ts +2 -1
- package/dist/functions/throttle.d.ts.map +1 -1
- package/dist/functions/throttle.js +18 -22
- package/dist/functions/throttle.js.map +1 -1
- package/dist/functions/watch.d.ts +7 -7
- package/dist/functions/watch.d.ts.map +1 -1
- package/dist/functions/watch.js +31 -35
- package/dist/functions/watch.js.map +1 -1
- package/dist/functions/when.d.ts +2 -1
- package/dist/functions/when.d.ts.map +1 -1
- package/dist/functions/when.js +24 -24
- package/dist/functions/when.js.map +1 -1
- package/dist/index.d.ts +2 -2
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -2
- package/dist/index.js.map +1 -1
- package/dist/properties/history.d.ts +4 -1
- package/dist/properties/history.d.ts.map +1 -1
- package/dist/properties/history.js +35 -33
- package/dist/properties/history.js.map +1 -1
- package/dist/properties/index.d.ts +1 -1
- package/dist/properties/index.d.ts.map +1 -1
- package/dist/properties/index.js.map +1 -1
- package/dist/properties/persisted.d.ts +3 -2
- package/dist/properties/persisted.d.ts.map +1 -1
- package/dist/properties/persisted.js +20 -23
- package/dist/properties/persisted.js.map +1 -1
- package/dist/properties/prop.d.ts +2 -1
- package/dist/properties/prop.d.ts.map +1 -1
- package/dist/properties/prop.js +24 -13
- package/dist/properties/prop.js.map +1 -1
- package/dist/properties/slot.d.ts +4 -8
- package/dist/properties/slot.d.ts.map +1 -1
- package/dist/properties/slot.js +34 -24
- package/dist/properties/slot.js.map +1 -1
- package/dist/properties/state.d.ts +2 -1
- package/dist/properties/state.d.ts.map +1 -1
- package/dist/properties/state.js +19 -19
- package/dist/properties/state.js.map +1 -1
- package/package.json +3 -4
- package/src/component/component.ts +9 -2
- package/src/component/index.ts +0 -1
- package/src/component/lazy.ts +10 -8
- package/src/component/virtual.tsx +71 -28
- package/src/events/emit.ts +15 -22
- package/src/events/helper.ts +5 -2
- package/src/events/on-command.ts +43 -44
- package/src/functions/bind.ts +14 -18
- package/src/functions/debounce.ts +23 -26
- package/src/functions/log.ts +11 -11
- package/src/functions/memo.ts +8 -9
- package/src/functions/once.ts +7 -10
- package/src/functions/retry.ts +7 -12
- package/src/functions/throttle.ts +21 -24
- package/src/functions/watch.ts +44 -48
- package/src/functions/when.ts +30 -32
- package/src/index.ts +10 -2
- package/src/properties/history.ts +50 -55
- package/src/properties/index.ts +1 -1
- package/src/properties/persisted.ts +40 -31
- package/src/properties/prop.ts +30 -13
- package/src/properties/slot.ts +46 -50
- package/src/properties/state.ts +24 -18
- package/dist/component/lifecycle.d.ts +0 -3
- package/dist/component/lifecycle.d.ts.map +0 -1
- package/dist/component/lifecycle.js +0 -35
- package/dist/component/lifecycle.js.map +0 -1
- package/dist/component/memoize.d.ts +0 -5
- package/dist/component/memoize.d.ts.map +0 -1
- package/dist/component/memoize.js +0 -23
- package/dist/component/memoize.js.map +0 -1
- package/src/component/lifecycle.ts +0 -47
- package/src/component/memoize.ts +0 -31
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"history.js","sourceRoot":"","sources":["../../src/properties/history.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"history.js","sourceRoot":"","sources":["../../src/properties/history.ts"],"names":[],"mappings":"AACA,OAAO,EAAuB,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAQvE,MAAM,UAAU,OAAO,CAAC,KAAK,GAAG,EAAE;IAChC,OAAO,UACL,MAAiB,EACjB,OAAsD;QAEtD,MAAM,SAAS,GAAG,IAAI,OAAO,EAAmC,CAAC;QAEjE,OAAO,CAAC,cAAc,CAAC;YACrB,MAAM,QAAQ,GAAG,IAA+B,CAAC;YACjD,MAAM,WAAW,GAAG,OAAO,CAAC,IAAc,CAAC;YAC3C,MAAM,UAAU,GAAG,GAAG,WAAW,SAAS,CAAC;YAE3C,MAAM,CAAC,cAAc,CAAC,QAAQ,EAAE,UAAU,EAAE;gBAC1C,GAAG;oBACD,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC;wBACzB,MAAM,MAAM,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;wBAEvC,MAAM,CAAC,GAAG,OAAO,CAAC,MAAyB,EAAE,KAAK,CAAC,CAAC;wBAEpD,MAAM,YAAY,GAAG,GAAG,EAAE;4BACxB,CAAC,CAAC,IAAI,EAAE,CAAC;wBACX,CAAC,CAAC;wBACF,MAAM,YAAY,GAAG,GAAG,EAAE;4BACxB,CAAC,CAAC,IAAI,EAAE,CAAC;wBACX,CAAC,CAAC;wBAEF,CAAC,CAAC,IAAI,GAAG,GAAG,EAAE;4BACZ,MAAM,IAAI,GAAG,CAAC,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,MAAM,EAAE,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;4BAC/C,IAAI,IAAI,KAAK,SAAS;gCAAE,OAAO;4BAC/B,YAAY,EAAE,CAAC;4BACf,IAAI,CAAC,WAAW,CAAC,GAAG,IAAI,CAAC;wBAC3B,CAAC,CAAC;wBAEF,CAAC,CAAC,IAAI,GAAG,GAAG,EAAE;4BACZ,YAAY,EAAE,CAAC;4BACf,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,CAAC;wBAClC,CAAC,CAAC;wBAEF,SAAS,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC;oBACzB,CAAC;oBACD,OAAO,SAAS,CAAC,GAAG,CAAC,IAAI,CAA4B,CAAC;gBACxD,CAAC;gBACD,UAAU,EAAE,KAAK;gBACjB,YAAY,EAAE,IAAI;aACnB,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;AACJ,CAAC"}
|
|
@@ -2,5 +2,5 @@ export { Prop } from "./prop";
|
|
|
2
2
|
export { State } from "./state";
|
|
3
3
|
export { Persisted } from "./persisted";
|
|
4
4
|
export { Slot, initSlots } from "./slot";
|
|
5
|
-
export { History } from "./history";
|
|
5
|
+
export { History, type WithHistory } from "./history";
|
|
6
6
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/properties/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/properties/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,EAAE,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,WAAW,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/properties/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,EAAE,OAAO,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/properties/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,EAAE,OAAO,EAAoB,MAAM,WAAW,CAAC"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
1
|
+
import type { StatefulComponent } from "@praxisjs/core";
|
|
2
|
+
import { type PersistedSignalOptions } from "@praxisjs/core/internal";
|
|
3
|
+
export declare function Persisted<T>(key?: string, options?: PersistedSignalOptions<T>): (_value: undefined, context: ClassFieldDecoratorContext<StatefulComponent>) => void;
|
|
3
4
|
//# sourceMappingURL=persisted.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"persisted.d.ts","sourceRoot":"","sources":["../../src/properties/persisted.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"persisted.d.ts","sourceRoot":"","sources":["../../src/properties/persisted.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACxD,OAAO,EAEL,KAAK,sBAAsB,EAC5B,MAAM,yBAAyB,CAAC;AAkCjC,wBAAgB,SAAS,CAAC,CAAC,EACzB,GAAG,CAAC,EAAE,MAAM,EACZ,OAAO,GAAE,sBAAsB,CAAC,CAAC,CAAM,IAGrC,QAAQ,SAAS,EACjB,SAAS,0BAA0B,CAAC,iBAAiB,CAAC,KACrD,IAAI,CAsCR"}
|
|
@@ -1,9 +1,6 @@
|
|
|
1
|
-
import { persistedSignal } from "@praxisjs/core";
|
|
1
|
+
import { persistedSignal, } from "@praxisjs/core/internal";
|
|
2
2
|
const signalMap = new WeakMap();
|
|
3
3
|
const initMap = new WeakMap();
|
|
4
|
-
function isInitialized(instance, propKey) {
|
|
5
|
-
return initMap.get(instance)?.has(propKey) ?? false;
|
|
6
|
-
}
|
|
7
4
|
function markInitialized(instance, propKey) {
|
|
8
5
|
if (!initMap.has(instance)) {
|
|
9
6
|
initMap.set(instance, new Set());
|
|
@@ -21,25 +18,25 @@ function getOrCreateSignal(instance, storageKey, initialValue, options) {
|
|
|
21
18
|
return map.get(storageKey);
|
|
22
19
|
}
|
|
23
20
|
export function Persisted(key, options = {}) {
|
|
24
|
-
return function (
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
21
|
+
return function (_value, context) {
|
|
22
|
+
context.addInitializer(function () {
|
|
23
|
+
const instance = this;
|
|
24
|
+
const propertyKey = context.name;
|
|
25
|
+
const storageKey = key ?? propertyKey;
|
|
26
|
+
const initialValue = instance[propertyKey];
|
|
27
|
+
Reflect.deleteProperty(instance, propertyKey);
|
|
28
|
+
markInitialized(instance, propertyKey);
|
|
29
|
+
getOrCreateSignal(instance, storageKey, initialValue, options);
|
|
30
|
+
Object.defineProperty(instance, propertyKey, {
|
|
31
|
+
get() {
|
|
32
|
+
return getOrCreateSignal(instance, storageKey, undefined, options)();
|
|
33
|
+
},
|
|
34
|
+
set(value) {
|
|
35
|
+
getOrCreateSignal(instance, storageKey, undefined, options).set(value);
|
|
36
|
+
},
|
|
37
|
+
enumerable: true,
|
|
38
|
+
configurable: true,
|
|
39
|
+
});
|
|
43
40
|
});
|
|
44
41
|
};
|
|
45
42
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"persisted.js","sourceRoot":"","sources":["../../src/properties/persisted.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"persisted.js","sourceRoot":"","sources":["../../src/properties/persisted.ts"],"names":[],"mappings":"AACA,OAAO,EACL,eAAe,GAEhB,MAAM,yBAAyB,CAAC;AAGjC,MAAM,SAAS,GAAG,IAAI,OAAO,EAAwC,CAAC;AACtE,MAAM,OAAO,GAAG,IAAI,OAAO,EAAuB,CAAC;AAEnD,SAAS,eAAe,CAAC,QAAgB,EAAE,OAAe;IACxD,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC;QAC3B,OAAO,CAAC,GAAG,CAAC,QAAQ,EAAE,IAAI,GAAG,EAAE,CAAC,CAAC;IACnC,CAAC;IACA,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAiB,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;AACtD,CAAC;AAED,SAAS,iBAAiB,CACxB,QAAgB,EAChB,UAAkB,EAClB,YAAe,EACf,OAAkC;IAElC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC;QAC7B,SAAS,CAAC,GAAG,CAAC,QAAQ,EAAE,IAAI,GAAG,EAAE,CAAC,CAAC;IACrC,CAAC;IACD,MAAM,GAAG,GAAG,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAiC,CAAC;IAEpE,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE,CAAC;QACzB,GAAG,CAAC,GAAG,CACL,UAAU,EACV,eAAe,CAAC,UAAU,EAAE,YAAY,EAAE,OAAO,CAAoB,CACtE,CAAC;IACJ,CAAC;IAED,OAAO,GAAG,CAAC,GAAG,CAAC,UAAU,CAAc,CAAC;AAC1C,CAAC;AAED,MAAM,UAAU,SAAS,CACvB,GAAY,EACZ,UAAqC,EAAE;IAEvC,OAAO,UACL,MAAiB,EACjB,OAAsD;QAEtD,OAAO,CAAC,cAAc,CAAC;YACrB,MAAM,QAAQ,GAAG,IAAc,CAAC;YAChC,MAAM,WAAW,GAAG,OAAO,CAAC,IAAc,CAAC;YAC3C,MAAM,UAAU,GAAG,GAAG,IAAI,WAAW,CAAC;YACtC,MAAM,YAAY,GAAI,QAAoC,CACxD,WAAW,CACP,CAAC;YAEP,OAAO,CAAC,cAAc,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC;YAE9C,eAAe,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC;YACvC,iBAAiB,CAAC,QAAQ,EAAE,UAAU,EAAE,YAAY,EAAE,OAAO,CAAC,CAAC;YAE/D,MAAM,CAAC,cAAc,CAAC,QAAQ,EAAE,WAAW,EAAE;gBAC3C,GAAG;oBACD,OAAO,iBAAiB,CACtB,QAAQ,EACR,UAAU,EACV,SAAc,EACd,OAAO,CACR,EAAE,CAAC;gBACN,CAAC;gBAED,GAAG,CAAC,KAAQ;oBACV,iBAAiB,CACf,QAAQ,EACR,UAAU,EACV,SAAc,EACd,OAAO,CACR,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;gBACf,CAAC;gBAED,UAAU,EAAE,IAAI;gBAChB,YAAY,EAAE,IAAI;aACnB,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;AACJ,CAAC"}
|
|
@@ -1,2 +1,3 @@
|
|
|
1
|
-
|
|
1
|
+
import type { StatefulComponent } from "@praxisjs/core";
|
|
2
|
+
export declare function Prop(): (_value: undefined, context: ClassFieldDecoratorContext<StatefulComponent>) => void;
|
|
2
3
|
//# sourceMappingURL=prop.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"prop.d.ts","sourceRoot":"","sources":["../../src/properties/prop.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"prop.d.ts","sourceRoot":"","sources":["../../src/properties/prop.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAExD,wBAAgB,IAAI,KAEhB,QAAQ,SAAS,EACjB,SAAS,0BAA0B,CAAC,iBAAiB,CAAC,KACrD,IAAI,CA4BR"}
|
package/dist/properties/prop.js
CHANGED
|
@@ -1,17 +1,28 @@
|
|
|
1
1
|
export function Prop() {
|
|
2
|
-
return function (
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
2
|
+
return function (_value, context) {
|
|
3
|
+
context.addInitializer(function () {
|
|
4
|
+
const instance = this;
|
|
5
|
+
const name = context.name;
|
|
6
|
+
const raw = instance;
|
|
7
|
+
const defaultValue = raw[name];
|
|
8
|
+
Reflect.deleteProperty(raw, name);
|
|
9
|
+
instance._defaults[name] = defaultValue;
|
|
10
|
+
Object.defineProperty(instance, name, {
|
|
11
|
+
get() {
|
|
12
|
+
const fromParent = this._rawProps[name];
|
|
13
|
+
if (fromParent !== undefined) {
|
|
14
|
+
return typeof fromParent === "function"
|
|
15
|
+
? fromParent()
|
|
16
|
+
: fromParent;
|
|
17
|
+
}
|
|
18
|
+
return this._defaults[name];
|
|
19
|
+
},
|
|
20
|
+
set(value) {
|
|
21
|
+
this._defaults[name] = value;
|
|
22
|
+
},
|
|
23
|
+
enumerable: true,
|
|
24
|
+
configurable: true,
|
|
25
|
+
});
|
|
15
26
|
});
|
|
16
27
|
};
|
|
17
28
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"prop.js","sourceRoot":"","sources":["../../src/properties/prop.ts"],"names":[],"mappings":"AAEA,MAAM,UAAU,IAAI;IAClB,OAAO,
|
|
1
|
+
{"version":3,"file":"prop.js","sourceRoot":"","sources":["../../src/properties/prop.ts"],"names":[],"mappings":"AAEA,MAAM,UAAU,IAAI;IAClB,OAAO,UACL,MAAiB,EACjB,OAAsD;QAEtD,OAAO,CAAC,cAAc,CAAC;YACrB,MAAM,QAAQ,GAAG,IAAyB,CAAC;YAC3C,MAAM,IAAI,GAAG,OAAO,CAAC,IAAc,CAAC;YACpC,MAAM,GAAG,GAAG,QAA8C,CAAC;YAC3D,MAAM,YAAY,GAAG,GAAG,CAAC,IAAI,CAAC,CAAC;YAC/B,OAAO,CAAC,cAAc,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC;YAElC,QAAQ,CAAC,SAAS,CAAC,IAAI,CAAC,GAAG,YAAY,CAAC;YAExC,MAAM,CAAC,cAAc,CAAC,QAAQ,EAAE,IAAI,EAAE;gBACpC,GAAG;oBACD,MAAM,UAAU,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;oBACxC,IAAI,UAAU,KAAK,SAAS,EAAE,CAAC;wBAC7B,OAAO,OAAO,UAAU,KAAK,UAAU;4BACrC,CAAC,CAAE,UAA4B,EAAE;4BACjC,CAAC,CAAC,UAAU,CAAC;oBACjB,CAAC;oBACD,OAAO,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;gBAC9B,CAAC;gBACD,GAAG,CAA0B,KAAc;oBACzC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC;gBAC/B,CAAC;gBACD,UAAU,EAAE,IAAI;gBAChB,YAAY,EAAE,IAAI;aACnB,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;AACJ,CAAC"}
|
|
@@ -1,9 +1,5 @@
|
|
|
1
|
-
import
|
|
2
|
-
export
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
export declare function resolveSlots(children: ChildrenInternal | ChildrenInternal[] | undefined): Map<string, ChildrenInternal[]>;
|
|
6
|
-
export declare function initSlots(instance: object, children: Children | undefined): void;
|
|
7
|
-
export declare function getSlot(instance: object, name: string): ChildrenInternal[];
|
|
8
|
-
export declare function Slot(name?: string): (target: object, propertyKey: string) => void;
|
|
1
|
+
import type { StatefulComponent } from "@praxisjs/core";
|
|
2
|
+
export declare function initSlots(instance: object, children: unknown): void;
|
|
3
|
+
export declare function getSlot(instance: object, name: string): unknown[];
|
|
4
|
+
export declare function Slot(name?: string): (_value: undefined, context: ClassFieldDecoratorContext<StatefulComponent>) => void;
|
|
9
5
|
//# sourceMappingURL=slot.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"slot.d.ts","sourceRoot":"","sources":["../../src/properties/slot.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"slot.d.ts","sourceRoot":"","sources":["../../src/properties/slot.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAgCxD,wBAAgB,SAAS,CAAC,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,GAAG,IAAI,CAEnE;AAED,wBAAgB,OAAO,CAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,OAAO,EAAE,CAEjE;AAED,wBAAgB,IAAI,CAAC,IAAI,CAAC,EAAE,MAAM,IAE9B,QAAQ,SAAS,EACjB,SAAS,0BAA0B,CAAC,iBAAiB,CAAC,KACrD,IAAI,CA0BR"}
|
package/dist/properties/slot.js
CHANGED
|
@@ -1,22 +1,27 @@
|
|
|
1
|
-
import { flattenChildren, } from "@praxisjs/shared";
|
|
2
1
|
const slotsMap = new WeakMap();
|
|
3
|
-
|
|
2
|
+
function resolveSlots(children) {
|
|
4
3
|
const slots = new Map();
|
|
5
4
|
const defaultSlot = [];
|
|
6
5
|
slots.set("default", defaultSlot);
|
|
7
|
-
if (
|
|
6
|
+
if (children == null)
|
|
8
7
|
return slots;
|
|
9
|
-
const arr =
|
|
8
|
+
const arr = Array.isArray(children)
|
|
9
|
+
? children.flat(Infinity)
|
|
10
|
+
: [children];
|
|
10
11
|
for (const child of arr) {
|
|
11
|
-
|
|
12
|
-
if (
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
12
|
+
// Named slots via `slot` attribute on DOM elements
|
|
13
|
+
if (child instanceof Element) {
|
|
14
|
+
const slotName = child.getAttribute("slot");
|
|
15
|
+
if (slotName) {
|
|
16
|
+
child.removeAttribute("slot");
|
|
17
|
+
if (!slots.has(slotName))
|
|
18
|
+
slots.set(slotName, []);
|
|
19
|
+
slots.get(slotName).push(child);
|
|
20
|
+
continue;
|
|
21
|
+
}
|
|
16
22
|
}
|
|
17
|
-
|
|
23
|
+
if (child != null)
|
|
18
24
|
defaultSlot.push(child);
|
|
19
|
-
}
|
|
20
25
|
}
|
|
21
26
|
return slots;
|
|
22
27
|
}
|
|
@@ -27,19 +32,24 @@ export function getSlot(instance, name) {
|
|
|
27
32
|
return slotsMap.get(instance)?.get(name) ?? [];
|
|
28
33
|
}
|
|
29
34
|
export function Slot(name) {
|
|
30
|
-
return function (
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
35
|
+
return function (_value, context) {
|
|
36
|
+
context.addInitializer(function () {
|
|
37
|
+
const instance = this;
|
|
38
|
+
const propKey = context.name;
|
|
39
|
+
const slotName = name ?? (propKey === "default" ? "default" : propKey);
|
|
40
|
+
Reflect.deleteProperty(instance, propKey);
|
|
41
|
+
Object.defineProperty(instance, propKey, {
|
|
42
|
+
get() {
|
|
43
|
+
return getSlot(this, slotName);
|
|
44
|
+
},
|
|
45
|
+
set(_value) {
|
|
46
|
+
if (process.env.NODE_ENV !== "production") {
|
|
47
|
+
console.warn(`[Slot] "${propKey}" is a slot and cannot be assigned directly. Slots are filled by the parent component.`);
|
|
48
|
+
}
|
|
49
|
+
},
|
|
50
|
+
enumerable: true,
|
|
51
|
+
configurable: true,
|
|
52
|
+
});
|
|
43
53
|
});
|
|
44
54
|
};
|
|
45
55
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"slot.js","sourceRoot":"","sources":["../../src/properties/slot.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"slot.js","sourceRoot":"","sources":["../../src/properties/slot.ts"],"names":[],"mappings":"AAEA,MAAM,QAAQ,GAAG,IAAI,OAAO,EAAkC,CAAC;AAE/D,SAAS,YAAY,CAAC,QAAiB;IACrC,MAAM,KAAK,GAAG,IAAI,GAAG,EAAqB,CAAC;IAC3C,MAAM,WAAW,GAAc,EAAE,CAAC;IAClC,KAAK,CAAC,GAAG,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC;IAElC,IAAI,QAAQ,IAAI,IAAI;QAAE,OAAO,KAAK,CAAC;IAEnC,MAAM,GAAG,GAAG,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC;QACjC,CAAC,CAAE,QAAsB,CAAC,IAAI,CAAC,QAAQ,CAAC;QACxC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC;IAEf,KAAK,MAAM,KAAK,IAAI,GAAG,EAAE,CAAC;QACxB,mDAAmD;QACnD,IAAI,KAAK,YAAY,OAAO,EAAE,CAAC;YAC7B,MAAM,QAAQ,GAAG,KAAK,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC;YAC5C,IAAI,QAAQ,EAAE,CAAC;gBACb,KAAK,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;gBAC9B,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,QAAQ,CAAC;oBAAE,KAAK,CAAC,GAAG,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;gBACjD,KAAK,CAAC,GAAG,CAAC,QAAQ,CAAe,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;gBAC/C,SAAS;YACX,CAAC;QACH,CAAC;QACD,IAAI,KAAK,IAAI,IAAI;YAAE,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC7C,CAAC;IAED,OAAO,KAAK,CAAC;AACf,CAAC;AAED,MAAM,UAAU,SAAS,CAAC,QAAgB,EAAE,QAAiB;IAC3D,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,YAAY,CAAC,QAAQ,CAAC,CAAC,CAAC;AACjD,CAAC;AAED,MAAM,UAAU,OAAO,CAAC,QAAgB,EAAE,IAAY;IACpD,OAAO,QAAQ,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,GAAG,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;AACjD,CAAC;AAED,MAAM,UAAU,IAAI,CAAC,IAAa;IAChC,OAAO,UACL,MAAiB,EACjB,OAAsD;QAEtD,OAAO,CAAC,cAAc,CAAC;YACrB,MAAM,QAAQ,GAAG,IAAyB,CAAC;YAC3C,MAAM,OAAO,GAAG,OAAO,CAAC,IAAc,CAAC;YACvC,MAAM,QAAQ,GAAG,IAAI,IAAI,CAAC,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC;YAEvE,OAAO,CAAC,cAAc,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;YAE1C,MAAM,CAAC,cAAc,CAAC,QAAQ,EAAE,OAAO,EAAE;gBACvC,GAAG;oBACD,OAAO,OAAO,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;gBACjC,CAAC;gBAED,GAAG,CAAC,MAAe;oBACjB,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,YAAY,EAAE,CAAC;wBAC1C,OAAO,CAAC,IAAI,CACV,WAAW,OAAO,wFAAwF,CAC3G,CAAC;oBACJ,CAAC;gBACH,CAAC;gBAED,UAAU,EAAE,IAAI;gBAChB,YAAY,EAAE,IAAI;aACnB,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;AACJ,CAAC"}
|
|
@@ -1,2 +1,3 @@
|
|
|
1
|
-
|
|
1
|
+
import type { StatefulComponent } from "@praxisjs/core";
|
|
2
|
+
export declare function State(): (_value: undefined, context: ClassFieldDecoratorContext<StatefulComponent>) => void;
|
|
2
3
|
//# sourceMappingURL=state.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"state.d.ts","sourceRoot":"","sources":["../../src/properties/state.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"state.d.ts","sourceRoot":"","sources":["../../src/properties/state.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAGxD,wBAAgB,KAAK,KAEjB,QAAQ,SAAS,EACjB,SAAS,0BAA0B,CAAC,iBAAiB,CAAC,KACrD,IAAI,CAsBR"}
|
package/dist/properties/state.js
CHANGED
|
@@ -1,23 +1,23 @@
|
|
|
1
|
-
import { signal } from "@praxisjs/core";
|
|
1
|
+
import { signal } from "@praxisjs/core/internal";
|
|
2
2
|
export function State() {
|
|
3
|
-
return function (
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
3
|
+
return function (_value, context) {
|
|
4
|
+
context.addInitializer(function () {
|
|
5
|
+
const instance = this;
|
|
6
|
+
const name = context.name;
|
|
7
|
+
const initialValue = instance[name];
|
|
8
|
+
Reflect.deleteProperty(instance, name);
|
|
9
|
+
const sig = signal(initialValue);
|
|
10
|
+
Object.defineProperty(instance, name, {
|
|
11
|
+
get() {
|
|
12
|
+
return sig();
|
|
13
|
+
},
|
|
14
|
+
set(value) {
|
|
15
|
+
instance._stateDirty = true;
|
|
16
|
+
sig.set(value);
|
|
17
|
+
},
|
|
18
|
+
enumerable: true,
|
|
19
|
+
configurable: true,
|
|
20
|
+
});
|
|
21
21
|
});
|
|
22
22
|
};
|
|
23
23
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"state.js","sourceRoot":"","sources":["../../src/properties/state.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"state.js","sourceRoot":"","sources":["../../src/properties/state.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEjD,MAAM,UAAU,KAAK;IACnB,OAAO,UACL,MAAiB,EACjB,OAAsD;QAEtD,OAAO,CAAC,cAAc,CAAC;YACrB,MAAM,QAAQ,GAAG,IAAmD,CAAC;YACrE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAc,CAAC;YACpC,MAAM,YAAY,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;YACpC,OAAO,CAAC,cAAc,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAC;YAEvC,MAAM,GAAG,GAAG,MAAM,CAAC,YAAY,CAAC,CAAC;YAEjC,MAAM,CAAC,cAAc,CAAC,QAAQ,EAAE,IAAI,EAAE;gBACpC,GAAG;oBACD,OAAO,GAAG,EAAE,CAAC;gBACf,CAAC;gBACD,GAAG,CAAC,KAAc;oBAChB,QAAQ,CAAC,WAAW,GAAG,IAAI,CAAC;oBAC5B,GAAG,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;gBACjB,CAAC;gBACD,UAAU,EAAE,IAAI;gBAChB,YAAY,EAAE,IAAI;aACnB,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;AACJ,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@praxisjs/decorators",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.3.0",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
6
|
"types": "./dist/index.d.ts",
|
|
@@ -15,9 +15,8 @@
|
|
|
15
15
|
"typescript": "^5.9.3"
|
|
16
16
|
},
|
|
17
17
|
"dependencies": {
|
|
18
|
-
"@praxisjs/core": "0.
|
|
19
|
-
"@praxisjs/
|
|
20
|
-
"@praxisjs/shared": "0.1.0"
|
|
18
|
+
"@praxisjs/core": "0.3.0",
|
|
19
|
+
"@praxisjs/shared": "0.2.0"
|
|
21
20
|
},
|
|
22
21
|
"scripts": {
|
|
23
22
|
"build": "tsc",
|
|
@@ -1,12 +1,19 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { StatelessComponent } from "@praxisjs/core";
|
|
2
|
+
import type {
|
|
3
|
+
ComponentConstructor,
|
|
4
|
+
ComponentInstance,
|
|
5
|
+
} from "@praxisjs/shared/internal";
|
|
2
6
|
|
|
3
7
|
export function Component() {
|
|
4
8
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
5
9
|
return function <T extends new (...args: any[]) => ComponentInstance>(
|
|
6
10
|
constructor: T,
|
|
11
|
+
_context: ClassDecoratorContext,
|
|
7
12
|
): T & ComponentConstructor {
|
|
13
|
+
const isStateless = constructor.prototype instanceof StatelessComponent;
|
|
8
14
|
const Enhanced = class extends constructor {
|
|
9
|
-
static
|
|
15
|
+
static __isComponent = true as const;
|
|
16
|
+
static __isStateless = isStateless;
|
|
10
17
|
} as unknown as T & ComponentConstructor;
|
|
11
18
|
|
|
12
19
|
Object.defineProperty(Enhanced, "name", {
|
package/src/component/index.ts
CHANGED
package/src/component/lazy.ts
CHANGED
|
@@ -1,22 +1,24 @@
|
|
|
1
|
-
import { type
|
|
2
|
-
import type { VNode } from "@praxisjs/shared";
|
|
1
|
+
import { type RootComponent, signal } from "@praxisjs/core/internal";
|
|
3
2
|
|
|
4
3
|
export function Lazy(placeholder = 200) {
|
|
5
4
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
6
|
-
return function <T extends new (...args: any[]) =>
|
|
5
|
+
return function <T extends new (...args: any[]) => RootComponent>(
|
|
7
6
|
constructor: T,
|
|
7
|
+
_context: ClassDecoratorContext,
|
|
8
8
|
): T {
|
|
9
9
|
return class LazyWrapper extends constructor {
|
|
10
10
|
private readonly _lazyVisible = signal(false);
|
|
11
11
|
private _observer?: IntersectionObserver;
|
|
12
|
-
private readonly _originalRender: () =>
|
|
12
|
+
private readonly _originalRender: () => Node | Node[] | null =
|
|
13
|
+
this.render.bind(this);
|
|
13
14
|
|
|
14
15
|
onMount() {
|
|
15
16
|
super.onMount?.();
|
|
16
17
|
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
18
|
+
// Use the end anchor to find the parent element
|
|
19
|
+
const el =
|
|
20
|
+
(this as unknown as { _anchor?: Comment })._anchor
|
|
21
|
+
?.parentElement ?? null;
|
|
20
22
|
if (!el) return;
|
|
21
23
|
|
|
22
24
|
if (!("IntersectionObserver" in window)) {
|
|
@@ -47,7 +49,7 @@ export function Lazy(placeholder = 200) {
|
|
|
47
49
|
this._observer?.disconnect();
|
|
48
50
|
}
|
|
49
51
|
|
|
50
|
-
render():
|
|
52
|
+
render(): Node | Node[] | null {
|
|
51
53
|
if (!this._lazyVisible()) return null;
|
|
52
54
|
return this._originalRender();
|
|
53
55
|
}
|
|
@@ -1,24 +1,30 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
1
|
+
import { computed, effect, type RootComponent, signal } from "@praxisjs/core/internal";
|
|
2
|
+
|
|
3
|
+
interface VirtualHost {
|
|
4
|
+
_anchor?: Comment;
|
|
5
|
+
items?: unknown[];
|
|
6
|
+
renderItem(item: unknown, index: number): Node | Node[] | null;
|
|
7
|
+
}
|
|
3
8
|
|
|
4
9
|
export function Virtual(itemHeight: number, buffer = 3) {
|
|
5
10
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
6
|
-
return function <T extends new (...args: any[]) =>
|
|
11
|
+
return function <T extends new (...args: any[]) => RootComponent>(
|
|
7
12
|
constructor: T,
|
|
13
|
+
_context: ClassDecoratorContext,
|
|
8
14
|
): T {
|
|
9
15
|
return class VirtualWrapper extends constructor {
|
|
10
16
|
private readonly _scrollTop = signal(0);
|
|
11
17
|
private readonly _viewHeight = signal(600);
|
|
12
18
|
private _container?: HTMLElement;
|
|
13
19
|
private _scrollHandler?: () => void;
|
|
20
|
+
private _cleanups: Array<() => void> = [];
|
|
14
21
|
|
|
15
22
|
onMount() {
|
|
16
23
|
super.onMount?.();
|
|
17
24
|
|
|
25
|
+
// Use the end anchor set by the runtime to locate the parent element
|
|
18
26
|
this._container =
|
|
19
|
-
|
|
20
|
-
`[data-component="${constructor.name}"]`,
|
|
21
|
-
) ?? undefined;
|
|
27
|
+
(this as unknown as VirtualHost)._anchor?.parentElement ?? undefined;
|
|
22
28
|
|
|
23
29
|
if (!this._container) return;
|
|
24
30
|
|
|
@@ -39,24 +45,25 @@ export function Virtual(itemHeight: number, buffer = 3) {
|
|
|
39
45
|
if (this._container && this._scrollHandler) {
|
|
40
46
|
this._container.removeEventListener("scroll", this._scrollHandler);
|
|
41
47
|
}
|
|
48
|
+
this._cleanups.forEach((c) => { c(); });
|
|
49
|
+
this._cleanups = [];
|
|
42
50
|
}
|
|
43
51
|
|
|
44
52
|
render() {
|
|
45
|
-
const
|
|
46
|
-
const items =
|
|
53
|
+
const host = this as unknown as VirtualHost;
|
|
54
|
+
const items = host.items ?? [];
|
|
47
55
|
const total = items.length;
|
|
48
56
|
const totalH = total * itemHeight;
|
|
49
57
|
|
|
50
|
-
|
|
51
|
-
| ((item: unknown, i: number) => VNode | null)
|
|
52
|
-
| undefined;
|
|
53
|
-
if (!renderItem) {
|
|
58
|
+
if (typeof host.renderItem !== "function") {
|
|
54
59
|
console.warn(
|
|
55
60
|
`[Virtual] ${constructor.name} must implement renderItem(item, index)`,
|
|
56
61
|
);
|
|
57
62
|
return null;
|
|
58
63
|
}
|
|
59
64
|
|
|
65
|
+
const renderItem = host.renderItem.bind(host);
|
|
66
|
+
|
|
60
67
|
const startIdx = computed(() => {
|
|
61
68
|
const start = Math.floor(this._scrollTop() / itemHeight) - buffer;
|
|
62
69
|
return Math.max(0, start);
|
|
@@ -70,7 +77,7 @@ export function Virtual(itemHeight: number, buffer = 3) {
|
|
|
70
77
|
});
|
|
71
78
|
|
|
72
79
|
const visibleItems = computed(() => {
|
|
73
|
-
const result = [];
|
|
80
|
+
const result: Array<{ item: unknown; index: number }> = [];
|
|
74
81
|
for (let i = startIdx(); i <= endIdx(); i++) {
|
|
75
82
|
result.push({ item: items[i], index: i });
|
|
76
83
|
}
|
|
@@ -82,22 +89,58 @@ export function Virtual(itemHeight: number, buffer = 3) {
|
|
|
82
89
|
() => (total - 1 - endIdx()) * itemHeight,
|
|
83
90
|
);
|
|
84
91
|
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
92
|
+
const outer = document.createElement("div");
|
|
93
|
+
outer.setAttribute(
|
|
94
|
+
"style",
|
|
95
|
+
`height:${String(totalH)}px; position:relative;`,
|
|
96
|
+
);
|
|
97
|
+
|
|
98
|
+
const spacerTop = document.createElement("div");
|
|
99
|
+
this._cleanups.push(
|
|
100
|
+
effect(() => {
|
|
101
|
+
spacerTop.setAttribute("style", `height:${String(offsetTop())}px;`);
|
|
102
|
+
}),
|
|
103
|
+
);
|
|
104
|
+
|
|
105
|
+
const itemsSlot = document.createElement("div");
|
|
106
|
+
this._cleanups.push(
|
|
107
|
+
effect(() => {
|
|
108
|
+
while (itemsSlot.firstChild) {
|
|
109
|
+
itemsSlot.removeChild(itemsSlot.firstChild);
|
|
97
110
|
}
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
111
|
+
visibleItems().forEach(({ item, index }) => {
|
|
112
|
+
const wrapper = document.createElement("div");
|
|
113
|
+
wrapper.setAttribute(
|
|
114
|
+
"style",
|
|
115
|
+
`height:${String(itemHeight)}px; overflow:hidden;`,
|
|
116
|
+
);
|
|
117
|
+
const rendered = renderItem(item, index);
|
|
118
|
+
if (rendered) {
|
|
119
|
+
const nodes = (
|
|
120
|
+
Array.isArray(rendered) ? rendered.flat() : [rendered]
|
|
121
|
+
);
|
|
122
|
+
nodes.forEach((n) => wrapper.appendChild(n));
|
|
123
|
+
}
|
|
124
|
+
itemsSlot.appendChild(wrapper);
|
|
125
|
+
});
|
|
126
|
+
}),
|
|
127
|
+
);
|
|
128
|
+
|
|
129
|
+
const spacerBottom = document.createElement("div");
|
|
130
|
+
this._cleanups.push(
|
|
131
|
+
effect(() => {
|
|
132
|
+
spacerBottom.setAttribute(
|
|
133
|
+
"style",
|
|
134
|
+
`height:${String(offsetBottom())}px;`,
|
|
135
|
+
);
|
|
136
|
+
}),
|
|
137
|
+
);
|
|
138
|
+
|
|
139
|
+
outer.appendChild(spacerTop);
|
|
140
|
+
outer.appendChild(itemsSlot);
|
|
141
|
+
outer.appendChild(spacerBottom);
|
|
142
|
+
|
|
143
|
+
return outer;
|
|
101
144
|
}
|
|
102
145
|
} as unknown as T;
|
|
103
146
|
};
|