@mulsense/xnew 0.2.1 → 0.3.0

package/README.md

@@ -13,7 +13,7 @@ providing a flexible architecture well-suited for applications with dynamic scen
 ### Via CDN
 Include the following script in your HTML file:
 ```html
-<script src="https://unpkg.com/@mulsense/xnew@0.2.x/dist/xnew.js"></script>
+<script src="https://unpkg.com/@mulsense/xnew@0.3.x/dist/xnew.js"></script>
 ```
 
 ### Via CDN (ESM)
@@ -22,7 +22,7 @@ Use the ES module version with an import map:
 <script type="importmap">
 {
     "imports": {
-        "@mulsense/xnew": "https://unpkg.com/@mulsense/xnew@0.2.x/dist/xnew.mjs"
+        "@mulsense/xnew": "https://unpkg.com/@mulsense/xnew@0.3.x/dist/xnew.mjs"
     }
 }
 </script>
@@ -37,7 +37,7 @@ import xnew from '@mulsense/xnew';
 ### Via npm
 Install `xnew` using npm:
 ```bash
-npm install @mulsense/xnew@0.2.x
+npm install @mulsense/xnew@0.3.x
 ```
 
 Then import it in your JavaScript file:

package/dist/addons/xmatter.d.ts

@@ -1,6 +1,6 @@
 declare const _default: {
     initialize({ engine }?: any): void;
-    nest(object: any): any;
     readonly engine: any;
+    readonly world: any;
 };
 export default _default;

package/dist/addons/xmatter.js

@@ -8,33 +8,21 @@
         initialize({ engine = null } = {}) {
             xnew.extend(Root, { engine });
         },
-        nest(object) {
-            xnew.extend(Nest, { object });
-            return object;
-        },
         get engine() {
             var _a;
             return (_a = xnew.context('xmatter.root')) === null || _a === void 0 ? void 0 : _a.engine;
         },
+        get world() {
+            var _a;
+            return (_a = xnew.context('xmatter.root')) === null || _a === void 0 ? void 0 : _a.engine.world;
+        },
     };
-    function Root(self, { engine }) {
+    function Root(unit, { engine }) {
         const root = {};
         xnew.context('xmatter.root', root);
-        root.isActive = true;
         root.engine = engine !== null && engine !== void 0 ? engine : Matter.Engine.create();
-        xnew.context('xmatter.object', root.engine.world);
-        self.on('-update', () => {
-            if (root.isActive) {
-                Matter.Engine.update(root.engine);
-            }
-        });
-    }
-    function Nest(self, { object }) {
-        const parent = xnew.context('xmatter.object');
-        xnew.context('xmatter.object', object);
-        Matter.Composite.add(parent, object);
-        self.on('-finalize', () => {
-            Matter.Composite.remove(parent, object);
+        unit.on('update', () => {
+            Matter.Engine.update(root.engine);
         });
     }
 

package/dist/addons/xmatter.mjs

@@ -5,33 +5,21 @@ var xmatter = {
     initialize({ engine = null } = {}) {
         xnew.extend(Root, { engine });
     },
-    nest(object) {
-        xnew.extend(Nest, { object });
-        return object;
-    },
     get engine() {
         var _a;
         return (_a = xnew.context('xmatter.root')) === null || _a === void 0 ? void 0 : _a.engine;
     },
+    get world() {
+        var _a;
+        return (_a = xnew.context('xmatter.root')) === null || _a === void 0 ? void 0 : _a.engine.world;
+    },
 };
-function Root(self, { engine }) {
+function Root(unit, { engine }) {
     const root = {};
     xnew.context('xmatter.root', root);
-    root.isActive = true;
     root.engine = engine !== null && engine !== void 0 ? engine : Matter.Engine.create();
-    xnew.context('xmatter.object', root.engine.world);
-    self.on('-update', () => {
-        if (root.isActive) {
-            Matter.Engine.update(root.engine);
-        }
-    });
-}
-function Nest(self, { object }) {
-    const parent = xnew.context('xmatter.object');
-    xnew.context('xmatter.object', object);
-    Matter.Composite.add(parent, object);
-    self.on('-finalize', () => {
-        Matter.Composite.remove(parent, object);
+    unit.on('update', () => {
+        Matter.Engine.update(root.engine);
     });
 }
 

package/dist/addons/xpixi.d.ts

@@ -6,8 +6,5 @@ declare const _default: {
     readonly renderer: any;
     readonly scene: any;
     readonly canvas: any;
-    capture({ rect }?: {
-        rect?: number[];
-    }): any;
 };
 export default _default;

package/dist/addons/xpixi.js

@@ -50,11 +50,6 @@
             var _a;
             return (_a = xnew.context('xpixi.root')) === null || _a === void 0 ? void 0 : _a.canvas;
         },
-        capture({ rect } = {}) {
-            const root = xnew.context('xpixi.root');
-            const frame = rect ? new PIXI__namespace.Rectangle(rect[0], rect[1], rect[2], rect[3]) : new PIXI__namespace.Rectangle(0, 0, root.canvas.width, root.canvas.height);
-            return root.renderer.extract.base64({ target: root.scene, frame });
-        }
     };
     function Root(self, { canvas }) {
         const root = {};
@@ -74,7 +69,7 @@
         root.updates = [];
         root.scene = new PIXI__namespace.Container();
         xnew.context('xpixi.object', root.scene);
-        self.on('-update', () => {
+        self.on('update', () => {
             root.updates.forEach((update) => {
                 update();
             });
@@ -87,14 +82,14 @@
         const parent = xnew.context('xpixi.object');
         xnew.context('xpixi.object', object);
         parent.addChild(object);
-        self.on('-finalize', () => {
+        self.on('finalize', () => {
             parent.removeChild(object);
         });
     }
     function PreUpdate(self, callback) {
         const root = xnew.context('xpixi.root');
         root.updates.push(callback);
-        self.on('-finalize', () => {
+        self.on('finalize', () => {
             root.updates = root.updates.filter((update) => update !== callback);
         });
     }

package/dist/addons/xpixi.mjs

@@ -28,11 +28,6 @@ var xpixi = {
         var _a;
         return (_a = xnew.context('xpixi.root')) === null || _a === void 0 ? void 0 : _a.canvas;
     },
-    capture({ rect } = {}) {
-        const root = xnew.context('xpixi.root');
-        const frame = rect ? new PIXI.Rectangle(rect[0], rect[1], rect[2], rect[3]) : new PIXI.Rectangle(0, 0, root.canvas.width, root.canvas.height);
-        return root.renderer.extract.base64({ target: root.scene, frame });
-    }
 };
 function Root(self, { canvas }) {
     const root = {};
@@ -52,7 +47,7 @@ function Root(self, { canvas }) {
     root.updates = [];
     root.scene = new PIXI.Container();
     xnew.context('xpixi.object', root.scene);
-    self.on('-update', () => {
+    self.on('update', () => {
         root.updates.forEach((update) => {
             update();
         });
@@ -65,14 +60,14 @@ function Nest(self, { object }) {
     const parent = xnew.context('xpixi.object');
     xnew.context('xpixi.object', object);
     parent.addChild(object);
-    self.on('-finalize', () => {
+    self.on('finalize', () => {
         parent.removeChild(object);
     });
 }
 function PreUpdate(self, callback) {
     const root = xnew.context('xpixi.root');
     root.updates.push(callback);
-    self.on('-finalize', () => {
+    self.on('finalize', () => {
         root.updates = root.updates.filter((update) => update !== callback);
     });
 }

package/dist/addons/xrapier2d.js

@@ -27,7 +27,7 @@
             }
             // xnew.extend(Nest, root.world);
         });
-        self.on('-update', () => {
+        self.on('update', () => {
             if (root.world) {
                 root.world.step();
             }
@@ -40,7 +40,7 @@
         console.log(temp, type, object);
         // Rapier2D objects (RigidBody, Collider, etc.) are already added to the world
         // when created, so we only need to handle removal on finalize
-        self.on('-finalize', () => {
+        self.on('finalize', () => {
             try {
                 // Check if object is a RigidBody
                 if (type === 'rigidBody') {

package/dist/addons/xrapier2d.mjs

@@ -24,7 +24,7 @@ function Root(self, { gravity, timestep }) {
         }
         // xnew.extend(Nest, root.world);
     });
-    self.on('-update', () => {
+    self.on('update', () => {
         if (root.world) {
             root.world.step();
         }
@@ -37,7 +37,7 @@ function Connect(self, { type, object }) {
     console.log(temp, type, object);
     // Rapier2D objects (RigidBody, Collider, etc.) are already added to the world
     // when created, so we only need to handle removal on finalize
-    self.on('-finalize', () => {
+    self.on('finalize', () => {
         try {
             // Check if object is a RigidBody
             if (type === 'rigidBody') {

package/dist/addons/xthree.js

@@ -48,7 +48,7 @@
             return (_a = xnew.context('xthree.root')) === null || _a === void 0 ? void 0 : _a.canvas;
         }
     };
-    function Root(self, { canvas, camera }) {
+    function Root(unit, { canvas, camera }) {
         const root = {};
         xnew.context('xthree.root', root);
         root.canvas = canvas;
@@ -57,16 +57,16 @@
         root.camera = camera !== null && camera !== void 0 ? camera : new THREE__namespace.PerspectiveCamera(45, root.renderer.domElement.width / root.renderer.domElement.height);
         root.scene = new THREE__namespace.Scene();
         xnew.context('xthree.object', root.scene);
-        self.on('-update', () => {
+        unit.on('update', () => {
             root.renderer.render(root.scene, root.camera);
         });
     }
-    function Nest(self, { object }) {
+    function Nest(unit, { object }) {
         const parent = xnew.context('xthree.object');
         xnew.context('xthree.object', object);
         if (parent) {
             parent === null || parent === void 0 ? void 0 : parent.add(object);
-            self.on('-finalize', () => {
+            unit.on('finalize', () => {
                 parent === null || parent === void 0 ? void 0 : parent.remove(object);
             });
         }

package/dist/addons/xthree.mjs

@@ -26,7 +26,7 @@ var xthree = {
         return (_a = xnew.context('xthree.root')) === null || _a === void 0 ? void 0 : _a.canvas;
     }
 };
-function Root(self, { canvas, camera }) {
+function Root(unit, { canvas, camera }) {
     const root = {};
     xnew.context('xthree.root', root);
     root.canvas = canvas;
@@ -35,16 +35,16 @@ function Root(self, { canvas, camera }) {
     root.camera = camera !== null && camera !== void 0 ? camera : new THREE.PerspectiveCamera(45, root.renderer.domElement.width / root.renderer.domElement.height);
     root.scene = new THREE.Scene();
     xnew.context('xthree.object', root.scene);
-    self.on('-update', () => {
+    unit.on('update', () => {
         root.renderer.render(root.scene, root.camera);
     });
 }
-function Nest(self, { object }) {
+function Nest(unit, { object }) {
     const parent = xnew.context('xthree.object');
     xnew.context('xthree.object', object);
     if (parent) {
         parent === null || parent === void 0 ? void 0 : parent.add(object);
-        self.on('-finalize', () => {
+        unit.on('finalize', () => {
             parent === null || parent === void 0 ? void 0 : parent.remove(object);
         });
     }

package/dist/types/audio/audio.d.ts

@@ -1,9 +1,28 @@
-export declare const audio: {
-    load(path: string): import("../core/unit").UnitPromise;
-    synthesizer(props: SynthProps): Synthesizer;
-    volume: number;
+export declare const context: AudioContext;
+export declare const master: GainNode;
+export type AudioFilePlayOptions = {
+    offset?: number;
+    fade?: number;
+    loop?: boolean;
 };
-type SynthProps = {
+export type AudioFilePauseOptions = {
+    fade?: number;
+};
+export declare class AudioFile {
+    private buffer?;
+    private source;
+    private amp;
+    private fade;
+    promise: Promise<void>;
+    played: number | null;
+    constructor(path: string);
+    set volume(value: number);
+    get volume(): number;
+    play({ offset, fade, loop }?: AudioFilePlayOptions): void;
+    pause({ fade }?: AudioFilePauseOptions): number | undefined;
+    clear(): void;
+}
+export type SynthesizerOptions = {
     oscillator: OscillatorOptions;
     amp: AmpOptions;
     filter?: FilterOptions;
@@ -35,9 +54,9 @@ type LFO = {
     type: OscillatorType;
     rate: number;
 };
-declare class Synthesizer {
-    props: SynthProps;
-    constructor(props: SynthProps);
+export declare class Synthesizer {
+    props: SynthesizerOptions;
+    constructor(props: SynthesizerOptions);
     press(frequency: number | string, duration?: number | string, wait?: number): {
         release: () => void;
     } | undefined;

package/dist/types/basics/Audio.d.ts

@@ -1,5 +1,2 @@
 import { Unit } from '../core/unit';
-export declare function VolumeController(unit: Unit, { range, icon }?: {
-    range?: number | string;
-    icon?: number | string;
-}): void;
+export declare function VolumeController(unit: Unit, {}?: {}): void;

package/dist/types/basics/Controller.d.ts

@@ -1,30 +1,19 @@
 import { Unit } from '../core/unit';
-export declare function AnalogStick(self: Unit, { size, fill, fillOpacity, stroke, strokeOpacity, strokeWidth, strokeLinejoin }?: {
-    size?: number;
-    diagonal?: boolean;
-    fill?: string;
-    fillOpacity?: number;
+export declare function AnalogStick(unit: Unit, { stroke, strokeOpacity, strokeWidth, strokeLinejoin, fill, fillOpacity }?: {
     stroke?: string;
     strokeOpacity?: number;
     strokeWidth?: number;
     strokeLinejoin?: string;
-}): void;
-export declare function DirectionalPad(self: Unit, { size, diagonal, fill, fillOpacity, stroke, strokeOpacity, strokeWidth, strokeLinejoin }?: {
-    size?: number;
     diagonal?: boolean;
     fill?: string;
     fillOpacity?: number;
+}): void;
+export declare function DirectionalPad(unit: Unit, { diagonal, stroke, strokeOpacity, strokeWidth, strokeLinejoin, fill, fillOpacity }?: {
+    diagonal?: boolean;
     stroke?: string;
     strokeOpacity?: number;
     strokeWidth?: number;
     strokeLinejoin?: string;
-}): void;
-export declare function TouchButton(self: Unit, { size, fill, fillOpacity, stroke, strokeOpacity, strokeWidth, strokeLinejoin }?: {
-    size?: number | undefined;
-    fill?: string | undefined;
-    fillOpacity?: number | undefined;
-    stroke?: string | undefined;
-    strokeOpacity?: number | undefined;
-    strokeWidth?: number | undefined;
-    strokeLinejoin?: string | undefined;
+    fill?: string;
+    fillOpacity?: number;
 }): void;

package/dist/types/basics/Input.d.ts

@@ -1,2 +1,8 @@
 import { Unit } from '../core/unit';
-export declare function InputFrame(frame: Unit, {}?: {}): void;
+export declare function InputRange(frame: Unit, { value, min, max, step, ...attributes }?: {
+    value?: number | string;
+    min?: number | string;
+    max?: number | string;
+    step?: number | string;
+    attributes?: Object;
+}): void;

package/dist/types/basics/Text.d.ts

@@ -0,0 +1,6 @@
+import { Unit } from '../core/unit';
+export declare function TextStream(unit: Unit, { text, speed, fade }?: {
+    text?: string;
+    speed?: number;
+    fade?: number;
+}): void;

package/dist/types/core/unit.d.ts

@@ -23,6 +23,8 @@ interface UnitInternal {
     anchor: UnitElement | null;
     state: string;
     tostart: boolean;
+    protected: boolean;
+    ancestors: Unit[];
     children: Unit[];
     promises: Promise<any>[];
     elements: UnitElement[];
@@ -66,7 +68,7 @@ export declare class Unit {
     static type2units: MapSet<string, Unit>;
     on(type: string, listener: Function, options?: boolean | AddEventListenerOptions): void;
     off(type?: string, listener?: Function): void;
-    emit(type: string, ...args: any[]): void;
+    static emit(type: string, ...args: any[]): void;
 }
 export declare class UnitPromise {
     private promise;

package/dist/types/core/xnew.d.ts

@@ -1,5 +1,4 @@
 import { Unit, UnitPromise } from './unit';
-import { Synthesizer, SynthesizerOptions } from './audio';
 interface CreateUnit {
     /**
      * Creates a new Unit component
@@ -91,15 +90,6 @@ export declare const xnew: CreateUnit & {
      * xnew.finally(() => console.log('All promises settled'))
      */
     finally(callback: Function): UnitPromise;
-    /**
-     * Fetches a resource and registers the promise with the current component
-     * @param url - URL to fetch
-     * @param options - Optional fetch options (method, headers, body, etc.)
-     * @returns UnitPromise wrapping the fetch promise
-     * @example
-     * xnew.fetch('/api/users').then(res => res.json()).then(data => console.log(data))
-     */
-    fetch(url: string, options?: object): UnitPromise;
     /**
      * Creates a scoped callback that captures the current component context
      * @param callback - Function to wrap with current scope
@@ -120,6 +110,7 @@ export declare const xnew: CreateUnit & {
      * buttons.forEach(btn => btn.finalize())
      */
     find(component: Function): Unit[];
+    emit(type: string, ...args: any[]): void;
     /**
      * Executes a callback once after a delay, managed by component lifecycle
      * @param timeout - Function to execute after Duration
@@ -154,10 +145,6 @@ export declare const xnew: CreateUnit & {
      * }, 300)
      */
     transition(transition: Function, duration?: number, easing?: string): any;
-    audio: {
-        load(path: string): UnitPromise;
-        synthesizer(props: SynthesizerOptions): Synthesizer;
-        volume: number;
-    };
+    protect(): void;
 };
 export {};

package/dist/types/index.d.ts

@@ -1,5 +1,5 @@
 import { xnew as base } from './core/xnew';
-import { Unit } from './core/unit';
+import { Unit, UnitPromise } from './core/unit';
 import { AccordionFrame, AccordionHeader, AccordionBullet, AccordionContent } from './basics/Accordion';
 import { ResizeEvent, PointerEvent, KeyboardEvent } from './basics/Event';
 import { Screen } from './basics/Screen';
@@ -7,6 +7,7 @@ import { ModalFrame, ModalContent } from './basics/Modal';
 import { TabFrame, TabButton, TabContent } from './basics/Tab';
 import { DragFrame, DragTarget } from './basics/Drag';
 import { AnalogStick, DirectionalPad } from './basics/Controller';
+import { TextStream } from './basics/Text';
 import { VolumeController } from './basics/Audio';
 import { icons } from './icons/icons';
 declare const basics: {
@@ -23,17 +24,25 @@ declare const basics: {
     TabFrame: typeof TabFrame;
     TabButton: typeof TabButton;
     TabContent: typeof TabContent;
+    TextStream: typeof TextStream;
     DragFrame: typeof DragFrame;
     DragTarget: typeof DragTarget;
     AnalogStick: typeof AnalogStick;
     DirectionalPad: typeof DirectionalPad;
     VolumeController: typeof VolumeController;
 };
+import { Synthesizer, SynthesizerOptions } from './audio/audio';
+declare const audio: {
+    load(path: string): UnitPromise;
+    synthesizer(props: SynthesizerOptions): Synthesizer;
+    volume: number;
+};
 declare namespace xnew {
     type Unit = InstanceType<typeof Unit>;
 }
 declare const xnew: (typeof base) & {
     basics: typeof basics;
+    audio: typeof audio;
     icons: typeof icons;
 };
 export default xnew;