@mulsense/xnew 0.4.1 → 0.4.2

package/dist/addons/xpixi.d.ts

@@ -1,13 +1,14 @@
+import * as PIXI from 'pixi.js';
+
 declare const _default: {
     initialize({ renderer, canvas }?: {
         renderer?: any;
         canvas?: HTMLCanvasElement | null;
-        update?: boolean;
     }): void;
     nest(object: any): any;
     readonly renderer: any;
-    readonly scene: any;
-    readonly canvas: any;
+    readonly scene: PIXI.Container;
+    readonly canvas: HTMLCanvasElement;
 };
 
 export { _default as default };

package/dist/addons/xpixi.js

@@ -24,20 +24,13 @@
     var PIXI__namespace = /*#__PURE__*/_interopNamespaceDefault(PIXI);
 
     var xpixi = {
-        initialize({ renderer = null, canvas = null, update = true } = {}) {
-            xnew.extend(Root, { renderer, canvas, update });
+        initialize({ renderer = null, canvas = null } = {}) {
+            xnew.extend(Root, { renderer, canvas });
         },
         nest(object) {
             xnew.extend(Nest, { object });
             return object;
         },
-        sync(canvas) {
-            const texture = PIXI__namespace.Texture.from(canvas);
-            xnew(PreUpdate, () => {
-                texture.source.update();
-            });
-            return texture;
-        },
         get renderer() {
             var _a;
             return (_a = xnew.context('xpixi.root')) === null || _a === void 0 ? void 0 : _a.renderer;
@@ -51,7 +44,7 @@
             return (_a = xnew.context('xpixi.root')) === null || _a === void 0 ? void 0 : _a.canvas;
         },
     };
-    function Root(unit, { canvas, update }) {
+    function Root(unit, { canvas }) {
         const root = {};
         xnew.context('xpixi.root', root);
         root.canvas = canvas;
@@ -60,17 +53,8 @@
             width: canvas.width, height: canvas.height, view: canvas,
             antialias: true, backgroundAlpha: 0,
         })).then((renderer) => root.renderer = renderer);
-        root.updates = [];
         root.scene = new PIXI__namespace.Container();
         xnew.context('xpixi.object', root.scene);
-        if (update === true) {
-            unit.on('update', () => {
-                root.updates.forEach((update) => {
-                    update();
-                });
-                root.renderer.render(root.scene);
-            });
-        }
     }
     function Nest(unit, { object }) {
         const parent = xnew.context('xpixi.object');
@@ -80,13 +64,6 @@
             parent.removeChild(object);
         });
     }
-    function PreUpdate(unit, callback) {
-        const root = xnew.context('xpixi.root');
-        root.updates.push(callback);
-        unit.on('finalize', () => {
-            root.updates = root.updates.filter((update) => update !== callback);
-        });
-    }
 
     return xpixi;
 

package/dist/addons/xpixi.mjs

@@ -2,20 +2,13 @@ import xnew from '@mulsense/xnew';
 import * as PIXI from 'pixi.js';
 
 var xpixi = {
-    initialize({ renderer = null, canvas = null, update = true } = {}) {
-        xnew.extend(Root, { renderer, canvas, update });
+    initialize({ renderer = null, canvas = null } = {}) {
+        xnew.extend(Root, { renderer, canvas });
     },
     nest(object) {
         xnew.extend(Nest, { object });
         return object;
     },
-    sync(canvas) {
-        const texture = PIXI.Texture.from(canvas);
-        xnew(PreUpdate, () => {
-            texture.source.update();
-        });
-        return texture;
-    },
     get renderer() {
         var _a;
         return (_a = xnew.context('xpixi.root')) === null || _a === void 0 ? void 0 : _a.renderer;
@@ -29,7 +22,7 @@ var xpixi = {
         return (_a = xnew.context('xpixi.root')) === null || _a === void 0 ? void 0 : _a.canvas;
     },
 };
-function Root(unit, { canvas, update }) {
+function Root(unit, { canvas }) {
     const root = {};
     xnew.context('xpixi.root', root);
     root.canvas = canvas;
@@ -38,17 +31,8 @@ function Root(unit, { canvas, update }) {
         width: canvas.width, height: canvas.height, view: canvas,
         antialias: true, backgroundAlpha: 0,
     })).then((renderer) => root.renderer = renderer);
-    root.updates = [];
     root.scene = new PIXI.Container();
     xnew.context('xpixi.object', root.scene);
-    if (update === true) {
-        unit.on('update', () => {
-            root.updates.forEach((update) => {
-                update();
-            });
-            root.renderer.render(root.scene);
-        });
-    }
 }
 function Nest(unit, { object }) {
     const parent = xnew.context('xpixi.object');
@@ -58,12 +42,5 @@ function Nest(unit, { object }) {
         parent.removeChild(object);
     });
 }
-function PreUpdate(unit, callback) {
-    const root = xnew.context('xpixi.root');
-    root.updates.push(callback);
-    unit.on('finalize', () => {
-        root.updates = root.updates.filter((update) => update !== callback);
-    });
-}
 
 export { xpixi as default };

package/dist/addons/xrapier3d.js

@@ -5,7 +5,7 @@
 })(this, (function (xnew, RAPIER) { 'use strict';
 
     var xrapier3d = {
-        initialize({ gravity = { x: 0.0, y: 9.81, z: 0.0 } } = {}) {
+        initialize({ gravity = { x: 0.0, y: -9.81, z: 0.0 } } = {}) {
             xnew.extend(Root, { gravity });
         },
         get world() {

package/dist/addons/xrapier3d.mjs

@@ -2,7 +2,7 @@ import xnew from '@mulsense/xnew';
 import RAPIER from '@dimforge/rapier3d-compat';
 
 var xrapier3d = {
-    initialize({ gravity = { x: 0.0, y: 9.81, z: 0.0 } } = {}) {
+    initialize({ gravity = { x: 0.0, y: -9.81, z: 0.0 } } = {}) {
         xnew.extend(Root, { gravity });
     },
     get world() {

package/dist/addons/xthree.d.ts

@@ -9,9 +9,9 @@ declare const _default: {
     }): void;
     nest(object: any): any;
     readonly renderer: any;
-    readonly camera: any;
-    readonly scene: any;
-    readonly canvas: any;
+    readonly camera: THREE.Camera;
+    readonly scene: THREE.Scene;
+    readonly canvas: HTMLCanvasElement;
 };
 
 export { _default as default };

package/dist/addons/xthree.js

@@ -57,11 +57,6 @@
         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);
-        if (update === true) {
-            unit.on('update', () => {
-                root.renderer.render(root.scene, root.camera);
-            });
-        }
     }
     function Nest(unit, { object }) {
         const parent = xnew.context('xthree.object');

package/dist/addons/xthree.mjs

@@ -35,11 +35,6 @@ function Root(unit, { canvas, camera, update }) {
     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);
-    if (update === true) {
-        unit.on('update', () => {
-            root.renderer.render(root.scene, root.camera);
-        });
-    }
 }
 function Nest(unit, { object }) {
     const parent = xnew.context('xthree.object');

package/dist/xnew.d.ts

@@ -286,7 +286,7 @@ declare const xnew$1: CreateUnit & {
     protect(): void;
 };
 
-declare function AccordionFrame(frame: Unit, { open, duration, easing }?: {
+declare function AccordionFrame(unit: Unit, { open, duration, easing }?: {
     open?: boolean;
     duration?: number;
     easing?: string;
@@ -295,10 +295,6 @@ declare function AccordionFrame(frame: Unit, { open, duration, easing }?: {
     open(): void;
     close(): void;
 };
-declare function AccordionHeader(unit: Unit, {}?: {}): void;
-declare function AccordionBullet(unit: Unit, { type }?: {
-    type?: string;
-}): void;
 declare function AccordionContent(unit: Unit, {}?: {}): {
     transition({ element, rate }: {
         element: HTMLElement;
@@ -330,30 +326,6 @@ declare function ModalContent(content: Unit, { background }?: {
     }): void;
 };
 
-declare function TabFrame(frame: Unit, { select }?: {
-    select?: string;
-}): void;
-declare function TabButton(button: Unit, { key }?: {
-    key?: string;
-}): {
-    select({ element }: {
-        element: HTMLElement;
-    }): void;
-    deselect({ element }: {
-        element: HTMLElement;
-    }): void;
-};
-declare function TabContent(content: Unit, { key }?: {
-    key?: string;
-}): {
-    select({ element }: {
-        element: HTMLElement;
-    }): void;
-    deselect({ element }: {
-        element: HTMLElement;
-    }): void;
-};
-
 declare function DragFrame(frame: Unit, { x, y }?: {
     x?: number;
     y?: number;
@@ -757,12 +729,7 @@ declare const basics: {
     ModalFrame: typeof ModalFrame;
     ModalContent: typeof ModalContent;
     AccordionFrame: typeof AccordionFrame;
-    AccordionHeader: typeof AccordionHeader;
-    AccordionBullet: typeof AccordionBullet;
     AccordionContent: typeof AccordionContent;
-    TabFrame: typeof TabFrame;
-    TabButton: typeof TabButton;
-    TabContent: typeof TabContent;
     TextStream: typeof TextStream;
     DragFrame: typeof DragFrame;
     DragTarget: typeof DragTarget;

package/dist/xnew.js

@@ -803,8 +803,7 @@
         }
         static on(unit, type, listener, options) {
             if (SYSTEM_EVENTS.includes(type)) {
-                const execute = Unit.wrap(Unit.currentUnit, listener);
-                unit._.systems[type].push({ listener, execute });
+                unit._.systems[type].push({ listener, execute: Unit.wrap(Unit.currentUnit, listener) });
             }
             if (unit._.listeners.has(type, listener) === false) {
                 const execute = Unit.wrap(Unit.currentUnit, listener);
@@ -1163,63 +1162,44 @@
         }
     });
 
-    function AccordionFrame(frame, { open = false, duration = 200, easing = 'ease' } = {}) {
+    function AccordionFrame(unit, { open = false, duration = 200, easing = 'ease' } = {}) {
         const internal = xnew$1((internal) => {
             return {
-                frame, open, rate: 0.0,
-                emit(type, ...args) { xnew$1.emit(type, ...args); }
+                frame: unit, open, rate: 0.0,
+                transition(rate) {
+                    xnew$1.emit('-transition', { rate });
+                }
             };
         });
         xnew$1.context('xnew.accordionframe', internal);
-        internal.on('-transition', ({ rate }) => internal.rate = rate);
-        internal.emit('-transition', { rate: open ? 1.0 : 0.0 });
+        internal.on('-transition', ({ rate }) => {
+            internal.rate = rate;
+            xnew$1.emit('-transition', { rate });
+        });
+        xnew$1.timeout(() => {
+            internal.transition(open ? 1.0 : 0.0);
+        });
         return {
             toggle() {
                 if (internal.rate === 1.0) {
-                    frame.close();
+                    unit.close();
                 }
                 else if (internal.rate === 0.0) {
-                    frame.open();
+                    unit.open();
                 }
             },
             open() {
                 if (internal.rate === 0.0) {
-                    xnew$1.transition((x) => internal.emit('-transition', { rate: x }), duration, easing);
+                    xnew$1.transition((x) => internal.transition(x), duration, easing);
                 }
             },
             close() {
                 if (internal.rate === 1.0) {
-                    xnew$1.transition((x) => internal.emit('-transition', { rate: 1.0 - x }), duration, easing);
+                    xnew$1.transition((x) => internal.transition(1.0 - x), duration, easing);
                 }
             }
         };
     }
-    function AccordionHeader(unit, {} = {}) {
-        const internal = xnew$1.context('xnew.accordionframe');
-        xnew$1.nest('<button style="display: flex; align-items: center; margin: 0; padding: 0; width: 100%; text-align: left; border: none; font: inherit; color: inherit; background: none; cursor: pointer;">');
-        unit.on('click', () => internal.frame.toggle());
-    }
-    function AccordionBullet(unit, { type = 'arrow' } = {}) {
-        const internal = xnew$1.context('xnew.accordionframe');
-        xnew$1.nest('<div style="display:inline-block; position: relative; width: 0.55em; margin: 0 0.3em;">');
-        if (type === 'arrow') {
-            const arrow = xnew$1(`<div style="width: 100%; height: 0.55em; border-right: 0.12em solid currentColor; border-bottom: 0.12em solid currentColor; box-sizing: border-box; transform-origin: center;">`);
-            arrow.element.style.transform = `rotate(${internal.rate * 90 - 45}deg)`;
-            internal.on('-transition', ({ rate }) => {
-                arrow.element.style.transform = `rotate(${rate * 90 - 45}deg)`;
-            });
-        }
-        else if (type === 'plusminus') {
-            const line1 = xnew$1(`<div style="position: absolute; width: 100%; border-top: 0.06em solid currentColor; border-bottom: 0.06em solid currentColor; box-sizing: border-box; transform-origin: center;">`);
-            const line2 = xnew$1(`<div style="position: absolute; width: 100%; border-top: 0.06em solid currentColor; border-bottom: 0.06em solid currentColor; box-sizing: border-box; transform-origin: center;">`);
-            line2.element.style.transform = `rotate(90deg)`;
-            line2.element.style.opacity = `${1.0 - internal.rate}`;
-            internal.on('-transition', ({ rate }) => {
-                line1.element.style.transform = `rotate(${90 + rate * 90}deg)`;
-                line2.element.style.transform = `rotate(${rate * 180}deg)`;
-            });
-        }
-    }
     function AccordionContent(unit, {} = {}) {
         const internal = xnew$1.context('xnew.accordionframe');
         xnew$1.nest(`<div style="display: ${internal.open ? 'block' : 'none'};">`);
@@ -1324,68 +1304,6 @@
         };
     }
 
-    function TabFrame(frame, { select } = {}) {
-        const internal = xnew$1((internal) => {
-            const buttons = new Map();
-            const contents = new Map();
-            return {
-                frame, buttons, contents,
-                emit(type, ...args) { xnew$1.emit(type, ...args); }
-            };
-        });
-        xnew$1.context('xnew.tabframe', internal);
-        xnew$1.timeout(() => internal.emit('-select', { key: select !== null && select !== void 0 ? select : [...internal.buttons.keys()][0] }));
-    }
-    function TabButton(button, { key } = {}) {
-        const internal = xnew$1.context('xnew.tabframe');
-        const div = xnew$1.nest('<div>');
-        key = key !== null && key !== void 0 ? key : (internal.buttons.size).toString();
-        internal.buttons.set(key, button);
-        button.on('click', () => {
-            internal.emit('-select', { key });
-        });
-        internal.on('-select', ({ key }) => {
-            const select = internal.buttons.get(key);
-            if (select === button) {
-                button.select({ element: div });
-            }
-            else {
-                button.deselect({ element: div });
-            }
-        });
-        return {
-            select({ element }) {
-                Object.assign(element.style, { opacity: 1.0, cursor: 'text' });
-            },
-            deselect({ element }) {
-                Object.assign(element.style, { opacity: 0.6, cursor: 'pointer' });
-            }
-        };
-    }
-    function TabContent(content, { key } = {}) {
-        const internal = xnew$1.context('xnew.tabframe');
-        const div = xnew$1.nest('<div style="display: none;">');
-        key = key !== null && key !== void 0 ? key : (internal.contents.size).toString();
-        internal.contents.set(key, content);
-        internal.on('-select', ({ key }) => {
-            const select = internal.contents.get(key);
-            if (select === content) {
-                content.select({ element: div });
-            }
-            else {
-                content.deselect({ element: div });
-            }
-        });
-        return {
-            select({ element }) {
-                Object.assign(element.style, { display: 'block' });
-            },
-            deselect({ element }) {
-                Object.assign(element.style, { display: 'none' });
-            }
-        };
-    }
-
     function DragFrame(frame, { x = 0, y = 0 } = {}) {
         const absolute = xnew$1.nest(`<div style="position: absolute; top: ${y}px; left: ${x}px;">`);
         xnew$1.context('xnew.dragframe', { frame, absolute });
@@ -3479,12 +3397,7 @@
         ModalFrame,
         ModalContent,
         AccordionFrame,
-        AccordionHeader,
-        AccordionBullet,
         AccordionContent,
-        TabFrame,
-        TabButton,
-        TabContent,
         TextStream,
         DragFrame,
         DragTarget,

package/dist/xnew.mjs

@@ -797,8 +797,7 @@ class Unit {
     }
     static on(unit, type, listener, options) {
         if (SYSTEM_EVENTS.includes(type)) {
-            const execute = Unit.wrap(Unit.currentUnit, listener);
-            unit._.systems[type].push({ listener, execute });
+            unit._.systems[type].push({ listener, execute: Unit.wrap(Unit.currentUnit, listener) });
         }
         if (unit._.listeners.has(type, listener) === false) {
             const execute = Unit.wrap(Unit.currentUnit, listener);
@@ -1157,63 +1156,44 @@ const xnew$1 = Object.assign(function (...args) {
     }
 });
 
-function AccordionFrame(frame, { open = false, duration = 200, easing = 'ease' } = {}) {
+function AccordionFrame(unit, { open = false, duration = 200, easing = 'ease' } = {}) {
     const internal = xnew$1((internal) => {
         return {
-            frame, open, rate: 0.0,
-            emit(type, ...args) { xnew$1.emit(type, ...args); }
+            frame: unit, open, rate: 0.0,
+            transition(rate) {
+                xnew$1.emit('-transition', { rate });
+            }
         };
     });
     xnew$1.context('xnew.accordionframe', internal);
-    internal.on('-transition', ({ rate }) => internal.rate = rate);
-    internal.emit('-transition', { rate: open ? 1.0 : 0.0 });
+    internal.on('-transition', ({ rate }) => {
+        internal.rate = rate;
+        xnew$1.emit('-transition', { rate });
+    });
+    xnew$1.timeout(() => {
+        internal.transition(open ? 1.0 : 0.0);
+    });
     return {
         toggle() {
             if (internal.rate === 1.0) {
-                frame.close();
+                unit.close();
             }
             else if (internal.rate === 0.0) {
-                frame.open();
+                unit.open();
             }
         },
         open() {
             if (internal.rate === 0.0) {
-                xnew$1.transition((x) => internal.emit('-transition', { rate: x }), duration, easing);
+                xnew$1.transition((x) => internal.transition(x), duration, easing);
             }
         },
         close() {
             if (internal.rate === 1.0) {
-                xnew$1.transition((x) => internal.emit('-transition', { rate: 1.0 - x }), duration, easing);
+                xnew$1.transition((x) => internal.transition(1.0 - x), duration, easing);
             }
         }
     };
 }
-function AccordionHeader(unit, {} = {}) {
-    const internal = xnew$1.context('xnew.accordionframe');
-    xnew$1.nest('<button style="display: flex; align-items: center; margin: 0; padding: 0; width: 100%; text-align: left; border: none; font: inherit; color: inherit; background: none; cursor: pointer;">');
-    unit.on('click', () => internal.frame.toggle());
-}
-function AccordionBullet(unit, { type = 'arrow' } = {}) {
-    const internal = xnew$1.context('xnew.accordionframe');
-    xnew$1.nest('<div style="display:inline-block; position: relative; width: 0.55em; margin: 0 0.3em;">');
-    if (type === 'arrow') {
-        const arrow = xnew$1(`<div style="width: 100%; height: 0.55em; border-right: 0.12em solid currentColor; border-bottom: 0.12em solid currentColor; box-sizing: border-box; transform-origin: center;">`);
-        arrow.element.style.transform = `rotate(${internal.rate * 90 - 45}deg)`;
-        internal.on('-transition', ({ rate }) => {
-            arrow.element.style.transform = `rotate(${rate * 90 - 45}deg)`;
-        });
-    }
-    else if (type === 'plusminus') {
-        const line1 = xnew$1(`<div style="position: absolute; width: 100%; border-top: 0.06em solid currentColor; border-bottom: 0.06em solid currentColor; box-sizing: border-box; transform-origin: center;">`);
-        const line2 = xnew$1(`<div style="position: absolute; width: 100%; border-top: 0.06em solid currentColor; border-bottom: 0.06em solid currentColor; box-sizing: border-box; transform-origin: center;">`);
-        line2.element.style.transform = `rotate(90deg)`;
-        line2.element.style.opacity = `${1.0 - internal.rate}`;
-        internal.on('-transition', ({ rate }) => {
-            line1.element.style.transform = `rotate(${90 + rate * 90}deg)`;
-            line2.element.style.transform = `rotate(${rate * 180}deg)`;
-        });
-    }
-}
 function AccordionContent(unit, {} = {}) {
     const internal = xnew$1.context('xnew.accordionframe');
     xnew$1.nest(`<div style="display: ${internal.open ? 'block' : 'none'};">`);
@@ -1318,68 +1298,6 @@ function ModalContent(content, { background = 'rgba(0, 0, 0, 0.1)' } = {}) {
     };
 }
 
-function TabFrame(frame, { select } = {}) {
-    const internal = xnew$1((internal) => {
-        const buttons = new Map();
-        const contents = new Map();
-        return {
-            frame, buttons, contents,
-            emit(type, ...args) { xnew$1.emit(type, ...args); }
-        };
-    });
-    xnew$1.context('xnew.tabframe', internal);
-    xnew$1.timeout(() => internal.emit('-select', { key: select !== null && select !== void 0 ? select : [...internal.buttons.keys()][0] }));
-}
-function TabButton(button, { key } = {}) {
-    const internal = xnew$1.context('xnew.tabframe');
-    const div = xnew$1.nest('<div>');
-    key = key !== null && key !== void 0 ? key : (internal.buttons.size).toString();
-    internal.buttons.set(key, button);
-    button.on('click', () => {
-        internal.emit('-select', { key });
-    });
-    internal.on('-select', ({ key }) => {
-        const select = internal.buttons.get(key);
-        if (select === button) {
-            button.select({ element: div });
-        }
-        else {
-            button.deselect({ element: div });
-        }
-    });
-    return {
-        select({ element }) {
-            Object.assign(element.style, { opacity: 1.0, cursor: 'text' });
-        },
-        deselect({ element }) {
-            Object.assign(element.style, { opacity: 0.6, cursor: 'pointer' });
-        }
-    };
-}
-function TabContent(content, { key } = {}) {
-    const internal = xnew$1.context('xnew.tabframe');
-    const div = xnew$1.nest('<div style="display: none;">');
-    key = key !== null && key !== void 0 ? key : (internal.contents.size).toString();
-    internal.contents.set(key, content);
-    internal.on('-select', ({ key }) => {
-        const select = internal.contents.get(key);
-        if (select === content) {
-            content.select({ element: div });
-        }
-        else {
-            content.deselect({ element: div });
-        }
-    });
-    return {
-        select({ element }) {
-            Object.assign(element.style, { display: 'block' });
-        },
-        deselect({ element }) {
-            Object.assign(element.style, { display: 'none' });
-        }
-    };
-}
-
 function DragFrame(frame, { x = 0, y = 0 } = {}) {
     const absolute = xnew$1.nest(`<div style="position: absolute; top: ${y}px; left: ${x}px;">`);
     xnew$1.context('xnew.dragframe', { frame, absolute });
@@ -3473,12 +3391,7 @@ const basics = {
     ModalFrame,
     ModalContent,
     AccordionFrame,
-    AccordionHeader,
-    AccordionBullet,
     AccordionContent,
-    TabFrame,
-    TabButton,
-    TabContent,
     TextStream,
     DragFrame,
     DragTarget,

package/package.json

@@ -4,7 +4,7 @@
   "keywords": [
     "Component-Oriented Programming"
   ],
-  "version": "0.4.1",
+  "version": "0.4.2",
   "main": "dist/xnew.js",
   "module": "dist/xnew.mjs",
   "types": "dist/xnew.d.ts",