vasille-jsx 3.0.1

package/lib-node/objects.js

@@ -0,0 +1,86 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ProxyReference = void 0;
+exports.proxyObject = proxyObject;
+exports.proxy = proxy;
+exports.reactiveObject = reactiveObject;
+exports.reactiveObjectProxy = reactiveObjectProxy;
+const vasille_1 = require("vasille");
+const library_1 = require("./library");
+class ProxyReference extends vasille_1.Reference {
+    forceUpdate() {
+        this.updateDeps(this.state);
+    }
+}
+exports.ProxyReference = ProxyReference;
+function proxyObject(obj, proxyRef) {
+    return new Proxy(obj, {
+        get(target, p, receiver) {
+            const value = Reflect.get(target, p, receiver);
+            return value instanceof Object ? proxyObject(value, proxyRef) : value;
+        },
+        set(target, p, newValue, receiver) {
+            const response = Reflect.set(target, p, newValue, receiver);
+            if (response) {
+                proxyRef.forceUpdate();
+            }
+            return response;
+        },
+        defineProperty(target, property, attributes) {
+            const response = Reflect.defineProperty(target, property, attributes);
+            if (response) {
+                proxyRef.forceUpdate();
+            }
+            return response;
+        },
+        deleteProperty(target, p) {
+            const response = Reflect.deleteProperty(target, p);
+            if (response) {
+                proxyRef.forceUpdate();
+            }
+            return response;
+        },
+    });
+}
+function proxy(o) {
+    if (typeof o === "object" && o && o.constructor === Object) {
+        const proxyRef = new ProxyReference(undefined);
+        proxyRef.$ = proxyObject(o, proxyRef);
+        return proxyRef;
+    }
+    return o;
+}
+function reactiveObject(node, o) {
+    for (const key of Object.keys(o)) {
+        if (!(o[key] instanceof vasille_1.IValue)) {
+            o[key] = (0, library_1.ensureIValue)(node, proxy(o[key]));
+        }
+    }
+    return new Proxy(o, {
+        get(_, p) {
+            if (p in o) {
+                return o[p];
+            }
+            else {
+                return (o[p] = node.register(new vasille_1.Reference(undefined)));
+            }
+        },
+        deleteProperty(_, p) {
+            if (p in o && o[p] instanceof vasille_1.IValue) {
+                node.release(p[0]);
+            }
+            return Reflect.deleteProperty(o, p);
+        },
+    });
+}
+function reactiveObjectProxy(o) {
+    return new Proxy(o, {
+        get(_, p) {
+            return o[p].$;
+        },
+        set(_, p, newValue) {
+            o[p].$ = newValue;
+            return true;
+        },
+    });
+}

package/lib-node/spec/html.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/lib-node/spec/svg.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/package.json

@@ -0,0 +1,42 @@
+{
+  "name": "vasille-jsx",
+  "version": "3.0.1",
+  "description": "Describe Vasille components using JSX",
+  "main": "lib/index.js",
+  "exports": {
+    "import": "./lib/index.js",
+    "browser": "./lib/index.js",
+    "node": "./lib-node/index.js",
+    "require": "./lib-node/index.js"
+  },
+  "scripts": {
+    "prepack": "cp -f ../README.md ./README.md",
+    "prettier": "npx prettier src test --write",
+    "build": "tsc --build tsconfig.json",
+    "build-node": "tsc --build tsconfig-build-node.json",
+    "update-types": "tsc --build tsconfig-types.json",
+    "test": "jest",
+    "test-coverage": "jest --coverage"
+  },
+  "keywords": [
+    "frone-end",
+    "jsx",
+    "vasille"
+  ],
+  "author": "lixcode",
+  "license": "MIT",
+  "dependencies": {
+    "vasille": "^3.0.0"
+  },
+  "devDependencies": {
+    "@types/jest": "^29.5.13",
+    "@types/jsdom": "^21.1.7",
+    "@typescript-eslint/parser": "^8.9.0",
+    "eslint": "^9.12.0",
+    "jest": "^29.7.0",
+    "jsdom": "^25.0.1",
+    "prettier": "^3.3.3",
+    "ts-jest": "^29.2.5",
+    "typescript": "5.6.3"
+  }
+}

package/types/components.d.ts

@@ -0,0 +1,46 @@
+import { Fragment, IValue } from "vasille";
+type Magic<T extends object> = {
+    [K in keyof T]: T[K] | IValue<T[K]> | undefined;
+};
+export declare function readValue<T>(v: T | IValue<T>): T;
+export declare function Adapter(ctx: Fragment, { node, slot }: Magic<{
+    node: Fragment;
+    slot?: (ctx: Fragment) => void;
+}>): void;
+export declare function Slot<T extends object = {}>(ctx: Fragment, options: Magic<{
+    model?: (input: T, ctx: Fragment) => void;
+    slot?: (ctx: Fragment) => void;
+}> & T): void;
+export declare function If(ctx: Fragment, { condition, slot: magicSlot }: Magic<{
+    condition: unknown;
+    slot?: () => void;
+}>): void;
+export declare function ElseIf(ctx: Fragment, { condition, slot: magicSlot }: Magic<{
+    condition: unknown;
+    slot?: () => void;
+}>): void;
+export declare function Else(ctx: Fragment, { slot: magicSlot }: Magic<{
+    slot?: () => void;
+}>): void;
+export declare function For<T extends Set<unknown> | Map<unknown, unknown> | unknown[], K = T extends unknown[] ? number : T extends Set<infer R> ? R : T extends Map<infer R, unknown> ? R : never, V = T extends (infer R)[] ? R : T extends Set<infer R> ? R : T extends Map<unknown, infer R> ? R : never>(ctx: Fragment, { of, slot: magicSlot }: Magic<{
+    of: T;
+    slot?: (ctx: Fragment, value: T, index: K) => void;
+}>): void;
+export declare function Watch<T>(ctx: Fragment, { model, slot: magicSlot }: Magic<{
+    model: T;
+    slot?: (ctx: Fragment, value: T) => void;
+}>): void;
+export declare function Debug(ctx: Fragment, { model }: {
+    model: unknown;
+}): void;
+export declare function Mount(ctx: Fragment, { bind }: Magic<{
+    bind: unknown;
+}>): void;
+export declare function Show(ctx: Fragment, { bind }: Magic<{
+    bind: unknown;
+}>): void;
+export declare function Delay(ctx: Fragment, { time, slot }: Magic<{
+    time?: number;
+    slot?: (ctx: Fragment) => unknown;
+}>): void;
+export {};

package/types/compose.d.ts

@@ -0,0 +1,11 @@
+import { Fragment } from "vasille";
+interface CompositionProps {
+    slot?: (...args: any[]) => void;
+}
+type Composed<In extends CompositionProps, Out> = (node: Fragment, $: In & {
+    callback?(data: Out | undefined): void;
+}, slot?: In["slot"]) => void;
+export declare function compose<In extends CompositionProps, Out>(renderer: (node: Fragment, input: In) => Out, name: string): Composed<In, Out>;
+export declare function extend<In extends CompositionProps, Out>(renderer: (node: Fragment, input: In) => Out, name: string): Composed<In, Out>;
+export declare function mount<T>(tag: Element, component: (node: Fragment, $: T) => unknown, $: T): void;
+export {};

package/types/expression.d.ts

@@ -0,0 +1,14 @@
+import { IValue } from "vasille";
+export declare class PartialExpression extends IValue<unknown> {
+    private readonly values;
+    private readonly valuesCache;
+    private readonly func;
+    private readonly linkedFunc;
+    private readonly sync;
+    constructor(func: (...args: unknown[]) => unknown, values: unknown[]);
+    get $(): unknown;
+    set $(value: unknown);
+    on(handler: (value: unknown) => void): void;
+    off(handler: (value: unknown) => void): void;
+    destroy(): void;
+}

package/types/index.d.ts

@@ -0,0 +1,6 @@
+export { Adapter, Debug, Delay, Else, ElseIf, For, If, Mount, Show, Slot, Watch } from "./components";
+export { compose, extend, mount } from "./compose";
+export { awaited } from "./library";
+export { internal as $ } from "./internal";
+export { TagNameMap, HtmlTagMap, Tag, HtmlAndSvgEvents, EventHandler } from "./spec/html";
+export { SvgTagMap, SvgTagNameMap } from "./spec/svg";

package/types/inline.d.ts

@@ -0,0 +1,4 @@
+import { Fragment, IValue } from "vasille";
+export declare function readValue<T>(v: T | IValue<T>): T;
+export declare function setValue(target: unknown, value: unknown, fallback?: (v: unknown) => void): void;
+export declare function asFragment(node: unknown): Fragment;

package/types/internal.d.ts

@@ -0,0 +1,31 @@
+import { IValue, Reactive, KindOfIValue, Expression } from "vasille";
+import { reactiveObject } from "./objects";
+import { ContextMap, ContextSet } from "./models";
+export declare const internal: {
+    /** create an expression (without context), use it for OwningPointer */
+    ex<T, Args extends unknown[]>(func: (...args: Args) => T, ...values: KindOfIValue<Args>): Expression<T, Args>;
+    /** create a forward-only pointer (without context), use it for OwningPointer */
+    fo<T>(v: IValue<T>): IValue<T>;
+    /** create a reference (without context), use it for default composing props values */
+    r<T>(v: T): IValue<T>;
+    /** create a reactive object proxy, use it for sending reactive objects to child components */
+    rop<T extends {
+        [k: string | symbol]: IValue<unknown>;
+    }>(o: T): { [K in keyof T]: T[K] extends IValue<infer R> ? R : never; };
+    /**
+     * translate `{...}` to `$.ro(this, {...})`
+     */
+    ro: typeof reactiveObject;
+    /**
+     * translate `new Set(#)` to `$.sm(this, #)`
+     */
+    sm(node: Reactive, data?: unknown[]): ContextSet<unknown>;
+    /**
+     * translate `new Map(#)` to `$.mm(this, #)`
+     */
+    mm(node: Reactive, data?: [unknown, unknown][]): ContextMap<unknown, unknown>;
+    /**
+     * translate `[...]` to `$.am(this, [...])`
+     */
+    am(node: Reactive, data?: unknown[]): import("vasille").ArrayModel<unknown>;
+};

package/types/library.d.ts

@@ -0,0 +1,3 @@
+import { IValue, Reactive } from "vasille";
+export declare function awaited<T>(node: Reactive, target: Promise<T> | (() => Promise<T>)): IValue<unknown>[];
+export declare function ensureIValue<T>(node: Reactive, value: T | IValue<T>): IValue<T>;

package/types/models.d.ts

@@ -0,0 +1,31 @@
+import { ArrayModel, MapModel, SetModel } from "vasille";
+export declare class ContextArray<T> extends ArrayModel<T> {
+    private ctx;
+    constructor(data?: Array<T> | number);
+    fill(value: T, start?: number, end?: number): this;
+    pop(): T | undefined;
+    push(...items: Array<T>): number;
+    shift(): T | undefined;
+    splice(start: number, deleteCount?: number | undefined, ...items: T[]): ArrayModel<T>;
+    unshift(...items: T[]): number;
+    replace(at: number, with_: T): this;
+    destroy(): void;
+}
+export declare class ContextMap<K, T> extends MapModel<K, T> {
+    private ctx;
+    constructor(map?: [K, T][]);
+    clear(): void;
+    delete(key: K): boolean;
+    set(key: K, value: T): this;
+    destroy(): void;
+}
+export declare class ContextSet<T> extends SetModel<T> {
+    private ctx;
+    private real;
+    constructor(set?: T[]);
+    add(value: T): this;
+    has(value: T): boolean;
+    clear(): void;
+    delete(value: T): boolean;
+    destroy(): void;
+}

package/types/objects.d.ts

@@ -0,0 +1,14 @@
+import { IValue, Reactive, Reference } from "vasille";
+export declare class ProxyReference extends Reference<unknown> {
+    forceUpdate(): void;
+}
+export declare function proxyObject(obj: object, proxyRef: ProxyReference): object;
+export declare function proxy(o: unknown): unknown;
+export declare function reactiveObject<T extends object>(node: Reactive, o: T): {
+    [K in keyof T]: T[K] extends IValue<unknown> ? T[K] : IValue<T[K]>;
+};
+export declare function reactiveObjectProxy<T extends {
+    [k: string | symbol]: IValue<unknown>;
+}>(o: T): {
+    [K in keyof T]: T[K] extends IValue<infer R> ? R : never;
+};