oxiui-lib 0.2.20 → 0.2.22

package/dist/core/elements/OxiComponent.js

@@ -24,17 +24,10 @@ class OxiComponent {
         const position = parent ? parent.down.length : 0;
         this.index = parent ? `${parent.index}.${position}` : "0";
         parent === null || parent === void 0 ? void 0 : parent.down.push(this);
-        if (this.view)
-            this.body();
     }
     body(fn) {
         (0, tree_js_1.open)(this);
-        if (this.view) {
-            this.view();
-        }
-        else {
-            fn === null || fn === void 0 ? void 0 : fn(this);
-        }
+        fn === null || fn === void 0 ? void 0 : fn(this);
         (0, tree_js_1.close)();
         return this;
     }

package/dist/core/elements/OxiStateFull.d.ts

@@ -1,21 +1,8 @@
-declare const ContainerState_base: {
-    new (props?: import("../types/html.js").CommonProps | undefined): {
-        "__#private@#__states": Map<string | symbol, import("../signals.js").Signal<unknown>>;
-        type: "div";
-        props: import("../types/html.js").CommonProps;
-        up?: import("../types/component.js").IComponent<keyof import("../types/html.js").IntrinsicElements>;
-        down: import("../types/component.js").IComponent<keyof import("../types/html.js").IntrinsicElements>[];
-        cursors: Set<string>;
-        index: string;
-        view?: (() => void) | undefined;
-        body(fn?: ((component: /*elided*/ any) => void) | undefined): /*elided*/ any;
-        onAppear(fn: (component: /*elided*/ any) => void): /*elided*/ any;
-        withProps<T extends Partial<import("../types/html.js").CommonProps>>(newProps: T): /*elided*/ any;
-        withStyle(style: Partial<CSSStyleDeclaration>): /*elided*/ any;
-        withExtension(extension: (component: /*elided*/ any) => void): /*elided*/ any;
-        withState(): /*elided*/ any;
-    };
-};
-export declare class ContainerState extends ContainerState_base {
+import { VRow } from "./VRow.js";
+export declare class OxiView extends VRow {
+    #private;
+    onInit?: boolean | undefined;
+    constructor(onInit?: boolean | undefined);
+    View(): void;
+    body(): this;
 }
-export {};

package/dist/core/elements/OxiStateFull.js

@@ -1,7 +1,34 @@
 "use strict";
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
+    if (kind === "m") throw new TypeError("Private method is not writable");
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
+    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
+};
+var _OxiView_$rendered;
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ContainerState = void 0;
-const OxiComponent_js_1 = require("./OxiComponent.js");
-class ContainerState extends (0, OxiComponent_js_1.intrinsicState)("div") {
+exports.OxiView = void 0;
+const VRow_js_1 = require("./VRow.js");
+class OxiView extends VRow_js_1.VRow {
+    constructor(onInit) {
+        super();
+        this.onInit = onInit;
+        _OxiView_$rendered.set(this, false);
+        this.body();
+    }
+    View() { }
+    body() {
+        if (!__classPrivateFieldGet(this, _OxiView_$rendered, "f")) {
+            __classPrivateFieldSet(this, _OxiView_$rendered, true, "f");
+            return super.body(() => this.View());
+        }
+        return this;
+    }
 }
-exports.ContainerState = ContainerState;
+exports.OxiView = OxiView;
+_OxiView_$rendered = new WeakMap();

package/dist/core/scheduler.d.ts

@@ -1,8 +1,8 @@
-import type { ContainerState } from "./elements";
+import type { OxiView } from "./elements";
 import type { IComponent } from "./types/component";
 import type { IntrinsicElements } from "./types/html";
 type RenderCallback = (stateId: string, readers: Set<string>, root: IComponent<keyof IntrinsicElements>) => void;
-export declare function initScheduler(App: new () => ContainerState, renderer: RenderCallback): void;
+export declare function initScheduler(App: () => OxiView, renderer: RenderCallback): void;
 export declare function scheduleEffect(fn: () => void): void;
 export declare function rerender(stateId: string, readers: Set<string>): void;
 export declare function startImmediateMode(): void;

package/dist/core/scheduler.js

@@ -8,15 +8,16 @@ exports.stopImmediateMode = stopImmediateMode;
 const renderer_1 = require("./renderer");
 let running = false;
 let app = null;
+let root = null;
 let renderCallback = null;
 const postRenderQueue = [];
 const resetTree = () => {
-    if (app === null || app === void 0 ? void 0 : app.down) {
-        app.down = [];
-    }
+    if (!root)
+        return;
+    root.down = [];
 };
 function initScheduler(App, renderer) {
-    app = new App();
+    app = App;
     renderCallback = renderer;
     performRender("", new Set());
 }
@@ -46,22 +47,22 @@ function performRender(stateId, readers) {
     if (!app || !renderCallback)
         return;
     console.clear();
-    app.body();
-    renderCallback(stateId, readers, app);
+    root = app();
+    renderCallback(stateId, readers, root);
     postRenderQueue.forEach((fn) => {
         fn();
     });
     postRenderQueue.length = 0;
-    clearCursors(app);
+    clearCursors(root);
 }
 function rerender(stateId, readers) {
-    if (!renderCallback || !app)
+    if (!renderCallback || !app || !root)
         return;
     if (running)
         return;
     const validComponents = new Set();
     readers.forEach((id) => {
-        if (findByIndex(app, id)) {
+        if (findByIndex(root, id)) {
             validComponents.add(id);
         }
     });
@@ -86,13 +87,13 @@ function startImmediateMode() {
             return;
         resetTree();
         (0, renderer_1.resetCursor)();
-        app.body();
-        renderCallback === null || renderCallback === void 0 ? void 0 : renderCallback("", new Set(), app);
+        root = app();
+        renderCallback === null || renderCallback === void 0 ? void 0 : renderCallback("", new Set(), root);
         postRenderQueue.forEach((fn) => {
             fn();
         });
         postRenderQueue.length = 0;
-        clearCursors(app);
+        clearCursors(root);
         frameId = requestAnimationFrame(loop);
     };
     frameId = requestAnimationFrame(loop);

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "oxiui-lib",
-	"version": "0.2.20",
+	"version": "0.2.22",
 	"module": "src/index.ts",
 	"main": "dist/index.js",
 	"types": "dist/index.d.ts",

package/src/core/elements/OxiComponent.ts

@@ -27,18 +27,11 @@ export class OxiComponent<K extends keyof IntrinsicElements>
 		this.index = parent ? `${parent.index}.${position}` : "0";
 
 		parent?.down.push(this as IComponent<K>);
-		if (this.view) this.body();
 	}
 
 	body(fn?: (component: this) => void) {
 		open(this);
-
-		if (this.view) {
-			this.view();
-		} else {
-			fn?.(this);
-		}
-
+		fn?.(this);
 		close();
 		return this;
 	}

package/src/core/elements/OxiStateFull.ts

@@ -1,3 +1,18 @@
-import { intrinsicState } from "./OxiComponent.js";
+import { VRow } from "./VRow.js";
 
-export class ContainerState extends intrinsicState("div") {}
+export class OxiView extends VRow {
+	#$rendered = false;
+	constructor(public onInit?: boolean) {
+		super();
+		this.body();
+	}
+
+	View() {}
+	override body() {
+		if (!this.#$rendered) {
+			this.#$rendered = true;
+			return super.body(() => this.View());
+		}
+		return this;
+	}
+}

package/src/core/scheduler.ts

@@ -1,4 +1,4 @@
-import type { ContainerState } from "./elements";
+import type { OxiView } from "./elements";
 import { resetCursor } from "./renderer";
 import type { IComponent } from "./types/component";
 import type { IntrinsicElements } from "./types/html";
@@ -10,20 +10,17 @@ type RenderCallback = (
 ) => void;
 
 let running = false;
-let app: ContainerState | null = null;
+let app: (() => OxiView) | null = null;
+let root: OxiView | null = null;
 let renderCallback: RenderCallback | null = null;
 const postRenderQueue: (() => void)[] = [];
 const resetTree = () => {
-	if (app?.down) {
-		app.down = [];
-	}
+	if (!root) return;
+	root.down = [];
 };
 
-export function initScheduler(
-	App: new () => ContainerState,
-	renderer: RenderCallback,
-) {
-	app = new App();
+export function initScheduler(App: () => OxiView, renderer: RenderCallback) {
+	app = App;
 	renderCallback = renderer;
 	performRender("", new Set());
 }
@@ -59,23 +56,23 @@ function clearCursors(node?: IComponent<keyof IntrinsicElements>) {
 function performRender(stateId: string, readers: Set<string>) {
 	if (!app || !renderCallback) return;
 	console.clear();
-	app.body();
-	renderCallback(stateId, readers, app as IComponent<keyof IntrinsicElements>);
+	root = app();
+	renderCallback(stateId, readers, root as IComponent<keyof IntrinsicElements>);
 	postRenderQueue.forEach((fn) => {
 		fn();
 	});
 	postRenderQueue.length = 0;
-	clearCursors(app as IComponent<keyof IntrinsicElements>);
+	clearCursors(root as IComponent<keyof IntrinsicElements>);
 }
 
 export function rerender(stateId: string, readers: Set<string>) {
-	if (!renderCallback || !app) return;
+	if (!renderCallback || !app || !root) return;
 	if (running) return;
 
 	const validComponents: Set<string> = new Set();
 
 	readers.forEach((id) => {
-		if (findByIndex(app as IComponent<keyof IntrinsicElements>, id)) {
+		if (findByIndex(root as IComponent<keyof IntrinsicElements>, id)) {
 			validComponents.add(id);
 		}
 	});
@@ -104,13 +101,17 @@ export function startImmediateMode() {
 
 		resetTree();
 		resetCursor();
-		app.body();
-		renderCallback?.("", new Set(), app as IComponent<keyof IntrinsicElements>);
+		root = app();
+		renderCallback?.(
+			"",
+			new Set(),
+			root as IComponent<keyof IntrinsicElements>,
+		);
 		postRenderQueue.forEach((fn) => {
 			fn();
 		});
 		postRenderQueue.length = 0;
-		clearCursors(app as IComponent<keyof IntrinsicElements>);
+		clearCursors(root as IComponent<keyof IntrinsicElements>);
 		frameId = requestAnimationFrame(loop);
 	};