zenith 1.0.0-beta.15 → 1.0.0-rc.2

package/README.md

@@ -1,17 +1,17 @@
 # Zenith
 
-Zenith is a tiny reactive JavaScript framework with a virtual DOM, keyed reconciliation, and targeted component redraws. Its rendering model can update an entire application or a specific component, which is useful when parts of a page manage their own content, such as canvas, WebGL, and SVG interfaces.
+Zenith is a tiny JavaScript virtual DOM framework with keyed reconciliation and targeted component redraws. Its rendering model can update an entire application or a specific component, making it easy to integrate independently managed content such as canvas, WebGL, and SVG interfaces.
 
 Zenith supports component lifecycle hooks, memoization, DOM events, SVG and MathML, and optional helpers. It is inspired by [Mithril.js](https://github.com/MithrilJS/mithril.js).
 
-**Status:** Zenith is currently in beta. We aim to keep the API stable through 1.0.0, but breaking changes may still occur during the beta period.
+**Status:** Zenith 1.0.0 is currently in release candidate. The API is expected to remain stable through the final 1.0 release, with changes focused primarily on bug fixes.
 
 ## Installation
 
-Install the beta package:
+Install the release candidate:
 
 ```sh
-npm install zenith@beta
+npm install zenith@rc
 ```
 
 Import the functions you need:
@@ -20,7 +20,7 @@ Import the functions you need:
 import { bind, comp, compDef, elem } from 'zenith';
 ```
 
-Prebuilt browser files are also included in `dist/`. The `zenith.global.js` build is intended for direct browser use; the `zenith.js` build is an ES module.
+Prebuilt browser files are also included in `dist/`. The `zenith.js` build is an ES module, while `zenith.global.js` exposes the Zenith API through window.z for direct browser use.
 
 ## Example: counter
 
@@ -50,14 +50,14 @@ Prebuilt browser files are also included in `dist/`. The `zenith.global.js` buil
 </html>
 ```
 
-The example assumes an environment that resolves npm package imports, such as a bundler or development server. Event handlers automatically schedule a redraw unless the event's `draw` property is set to `false`.
+The example assumes an environment that resolves npm package imports, such as a bundler or development server. Event handlers automatically schedule a redraw unless the event's `redraw` property is set to `false`.
 
 ## Components and redraws
 
-Create components with `compDef()` and `comp()`, then mount them using `bind()`. Call `draw()` when external state changes outside an event handler:
+Create components with `compDef()` and `comp()`, then mount them using `bind()`. Call `redraw()` when application state changes outside an event handler:
 
 ```js
-import { bind, comp, compDef, draw, elem } from 'zenith';
+import { bind, comp, compDef, redraw, elem } from 'zenith';
 
 let message = 'Hello';
 
@@ -69,19 +69,21 @@ const view = comp(Message);
 bind(document.querySelector('#app'), view);
 
 message = 'Updated';
-draw(view);
+redraw(view);
 ```
 
-Redraws are scheduled in a microtask. Call `sync()` if you need to apply queued redraws immediately. `draw(view, true)` requests a targeted redraw of a component.
+Redraws are batched and scheduled in a microtask. Call `sync()` to apply queued redraws immediately. Use `redraw(view, true)` to redraw only the specified component subtree.
 
-Component definitions can use `init`, `draw`, `drawn`, `remove`, and `removed` lifecycle hooks. `remove` may return a Promise to defer removal. Components also support optional memoization through `$memo`.
+Component definitions support `init`, `draw`, `drawn`, `remove`, and `removed` lifecycle hooks. The `remove` hook may return a Promise to defer removal; deferred removal requires keyed components. Components also support optional memoization through `$memo`.
+
+Zenith does not manage application state or automatically track dependencies. State can be stored and updated using ordinary JavaScript, external state managers, or optional helpers.
 
 ## Package builds
 
 The npm package includes prebuilt files under `dist/`, including:
 
 - `zenith.js` — ES module
-- `zenith.global.js` — global browser build
+- `zenith.global.js` — browser build exposing window.z
 - `zenith.development.js` — development build
 - `zenith-helpers.js` — optional helpers (import from `zenith/helpers`)
 
@@ -89,7 +91,7 @@ The library is designed for a very small compressed footprint; actual size depen
 
 ## Documentation
 
-Additional information: [Zenith website](https://aleph-1.com/zenith) (work in progress).
+Additional information: [Zenith website](https://aleph-1.com/zenith).
 
 Report bugs and request features through [GitHub Issues](https://github.com/aleph1/Zenith/issues).
 

package/dist/types/helpers/derived.d.ts

@@ -16,4 +16,6 @@ export interface DerivedSignal<T> extends Signal<T> {
  * // In component cleanup:
  * removed: () => fullName.destroy()
  */
-export declare const derived: <T>(fn: () => T, deps: Signal<any>[]) => DerivedSignal<T>;
+export declare const derived: <T>(fn: () => T, deps: {
+    sub(fn: () => void): () => void;
+}[]) => DerivedSignal<T>;

package/dist/types/helpers/detached-root.d.ts

@@ -0,0 +1,28 @@
+/**
+ * Renders children into another DOM location using an independent
+ * Zenith root. Useful for modals, popovers, and overlays.
+ *
+ * Unlike native portals:
+ * - Children do not inherit the originating component's ancestry
+ *   or injected context.
+ * - Events follow the destination DOM tree.
+ * - An extra wrapper <div> is inserted into the target.
+ * - Rendering into the target is deferred to a microtask.
+ *
+ * The helper manages mounting, updates, and cleanup, but not
+ * stacking, positioning, focus, or accessibility.
+ *
+ * @example
+ * comp(DetachedRoot, {
+ *   to: document.body, // Or a CSS selector such as '#modals'
+ *   children: comp(Modal)
+ * });
+ */
+import type { VNodeCompAttributes, VNodeCompDefinition, VNodeAny, VNodeArray } from '../vnode.defs';
+interface DetachedRootAttrs extends VNodeCompAttributes {
+    to: string | Element;
+    children: VNodeAny | VNodeArray;
+}
+declare const definition: VNodeCompDefinition<DetachedRootAttrs>;
+export declare const DetachedRoot: typeof definition;
+export {};

package/dist/types/helpers/index.d.ts

@@ -10,4 +10,4 @@ export type { Signal } from './signal';
 export { derived } from './derived';
 export type { DerivedSignal } from './derived';
 export { router } from './router';
-export { Portal } from './portal';
+export { DetachedRoot } from './detached-root';

package/dist/types/index.d.ts

@@ -15,7 +15,10 @@ export declare const diff: {
     all: number;
 };
 export declare const sync: () => void;
-export declare const draw: (vNode: VNodeContainer, surgical?: boolean) => void;
+export declare const redraw: {
+    (vNode: VNodeContainer, surgical?: false): void;
+    (vNode: VNodeComp, surgical: true): void;
+};
 export declare const elem: {
     (tag: string): VNodeElem;
     (tag: string, attrs: VNodeElemAttributes, ...args: VNodeArray): VNodeElem;

package/dist/types/vnode.defs.d.ts

@@ -1,8 +1,9 @@
 export declare const VNODE_ELEM = 1;
 export declare const VNODE_TEXT = 2;
-export declare const VNODE_COMP = 3;
-export declare const VNODE_NODE = 4;
-export declare const VNODE_COMPDEF = 5;
+export declare const VNODE_COMP = 4;
+export declare const VNODE_NODE = 8;
+export declare const VNODE_COMPDEF = 16;
+export declare const VNODE_TYPE_MASK = 31;
 export interface VNodeElemAttributes {
     class?: string | string[];
     style?: string | Record<string, string | number | null | undefined>;
@@ -16,15 +17,11 @@ export interface VNodeElemAttributes {
 export interface VNodeCompAttributes {
     $key?: string | number;
     $remove?: boolean;
-    to?: string | Element;
     [property: string]: any;
 }
 export type VNodeAttrs = VNodeElemAttributes | VNodeCompAttributes;
-export interface VNodeNodeAttributes {
-    [property: string]: any;
-}
 export interface VNodeCompDefinition<A extends VNodeCompAttributes = VNodeCompAttributes> {
-    $tag?: number;
+    $t?: number;
     init?: (vNode: VNodeComp<A>) => void;
     draw: (vNode: VNodeComp<A>, oldChildren?: VNodeFlatArray) => VNodeAnyOrArray;
     drawn?: (vNode: VNodeComp<A>, isFirstDraw?: boolean) => void;
@@ -34,36 +31,39 @@ export interface VNodeCompDefinition<A extends VNodeCompAttributes = VNodeCompAt
 }
 interface VNodeBase {
     $h?: boolean;
-    up: VNodeContainer | null;
+    $p: VNodeContainer | null;
     nodes: VNodeFlatArray | null;
     el: any;
 }
 export interface VNodeElem extends VNodeBase {
     is: typeof VNODE_ELEM;
-    $tag: string;
-    $def: null;
+    $t: string;
+    $d: null;
     attrs: VNodeElemAttributes;
     nodes: VNodeFlatArray;
 }
 export interface VNodeText extends VNodeBase {
     is: typeof VNODE_TEXT;
-    $tag: string;
-    $def: null;
+    $t: string;
+    $d: null;
     attrs: null;
     nodes: null;
 }
 export interface VNodeComp<A extends VNodeCompAttributes = VNodeCompAttributes> extends VNodeBase {
     is: typeof VNODE_COMP;
-    $tag: number;
-    $def: VNodeCompDefinition;
+    $t: number;
+    $d: VNodeCompDefinition;
+    $r?: object | null;
     attrs: A;
     nodes: VNodeFlatArray;
     provide?: Record<string, any>;
+    /** Optional, application-managed instance state. */
+    state?: Record<string, any>;
 }
 export interface VNodeNode extends VNodeBase {
     is: typeof VNODE_NODE;
-    $tag: number;
-    $def: null;
+    $t: number;
+    $d: null;
     attrs: null;
     nodes: null;
 }
@@ -77,6 +77,6 @@ export type VNodeChild = VNodeAny | string | number | boolean | null | undefined
 export type VNodeArray = Array<VNodeChild | VNodeArray>;
 export type VNodeAnyOrArray = VNodeChild | VNodeArray;
 export interface VNodeFlatArray extends Array<VNodeAny> {
-    $keys?: Map<any, any> | null;
+    $keys?: boolean;
 }
 export {};