@mulsense/xnew 0.5.0 → 0.5.1

package/dist/xnew.js

@@ -206,8 +206,6 @@
         }
     }
 
-    const SYSTEM_EVENTS = ['start', 'update', 'render', 'stop', 'finalize'];
-
     class EventManager {
         constructor() {
             this.map = new MapMap();
@@ -524,6 +522,10 @@
         return { position };
     }
 
+    //----------------------------------------------------------------------------------------------------
+    // utils
+    //----------------------------------------------------------------------------------------------------
+    const SYSTEM_EVENTS = ['start', 'update', 'render', 'stop', 'finalize'];
     //----------------------------------------------------------------------------------------------------
     // unit
     //----------------------------------------------------------------------------------------------------
@@ -632,11 +634,11 @@
                 unit._.state = 'finalized';
             }
         }
-        static nest(unit, tag) {
+        static nest(unit, htmlString, textContent) {
             if (unit._.state !== 'invoked') {
                 throw new Error('This function can not be called after initialized.');
             }
-            const match = tag.match(/<((\w+)[^>]*?)\/?>/);
+            const match = htmlString.match(/<((\w+)[^>]*?)\/?>/);
             if (match !== null) {
                 let element;
                 if (unit._.anchor !== null) {
@@ -649,11 +651,14 @@
                     element = unit._.currentElement.children[unit._.currentElement.children.length - 1];
                 }
                 unit._.currentElement = element;
+                if (textContent !== undefined) {
+                    element.textContent = textContent;
+                }
                 unit._.elements.push(element);
                 return element;
             }
             else {
-                throw new Error(`Invalid tag: ${tag}`);
+                throw new Error(`Invalid html string: ${htmlString}`);
             }
         }
         static extend(unit, component, props) {
@@ -945,19 +950,19 @@
     }, {
         /**
          * Creates a nested HTML/SVG element within the current component
-         * @param tag - HTML or SVG tag name (e.g., '<div>', '<span>', '<svg>')
+         * @param htmlString - HTML or SVG tag name (e.g., '<div>', '<span>', '<svg>')
          * @returns The created HTML/SVG element
          * @throws Error if called after component initialization
          * @example
          * const div = xnew.nest('<div>')
          * div.textContent = 'Hello'
          */
-        nest(tag) {
+        nest(htmlString, textContent) {
             try {
-                return Unit.nest(Unit.currentUnit, tag);
+                return Unit.nest(Unit.currentUnit, htmlString, textContent);
             }
             catch (error) {
-                console.error('xnew.nest(tag: string): ', error);
+                console.error('xnew.nest(htmlString: string): ', error);
                 throw error;
             }
         },
@@ -1370,51 +1375,6 @@
         });
     }
 
-    function TextStream(unit, { text = '', speed = 50, fade = 300 } = {}) {
-        const chars = [];
-        for (let i = 0; i < text.length; i++) {
-            const unit = xnew$1('<span>');
-            unit.element.textContent = text[i];
-            unit.element.style.opacity = '0';
-            unit.element.style.transition = `opacity ${fade}ms ease-in-out`;
-            chars.push(unit);
-        }
-        let start = 0;
-        unit.on('start', () => {
-            start = new Date().getTime();
-        });
-        let state = 0;
-        unit.on('update', () => {
-            const index = Math.floor((new Date().getTime() - start) / speed);
-            // Display characters up to the current index (fade in)
-            for (let i = 0; i < chars.length; i++) {
-                if (i <= index) {
-                    chars[i].element.style.opacity = '1';
-                }
-            }
-            if (state === 0 && index >= text.length) {
-                action();
-            }
-        });
-        xnew$1.timeout(() => {
-            xnew$1(document.body).on('click wheel', action);
-            unit.on('keydown', action);
-        }, 100);
-        function action() {
-            if (state === 0) {
-                state = 1;
-                for (let i = 0; i < chars.length; i++) {
-                    chars[i].element.style.opacity = '1';
-                }
-                xnew$1.emit('-complete');
-            }
-            else if (state === 1) {
-                state = 2;
-                xnew$1.emit('-next');
-            }
-        }
-    }
-
     const context = new window.AudioContext();
     const master = context.createGain();
     //----------------------------------------------------------------------------------------------------
@@ -1643,7 +1603,6 @@
         Screen,
         Modal,
         Accordion,
-        TextStream,
         AnalogStick,
         DirectionalPad,
     };
@@ -1674,16 +1633,7 @@
             master.gain.value = value;
         }
     };
-    const temp = Object.assign(xnew$1, { basics, audio });
-    Object.defineProperty(temp, 'global', {
-        get: function () {
-            return temp.context('xnew.global');
-        },
-        set: function (value) {
-            temp.context('xnew.global', value);
-        }
-    });
-    const xnew = temp;
+    const xnew = Object.assign(xnew$1, { basics, audio });
 
     return xnew;
 

package/dist/xnew.mjs

@@ -200,8 +200,6 @@ class Timer {
     }
 }
 
-const SYSTEM_EVENTS = ['start', 'update', 'render', 'stop', 'finalize'];
-
 class EventManager {
     constructor() {
         this.map = new MapMap();
@@ -518,6 +516,10 @@ function pointer(element, event) {
     return { position };
 }
 
+//----------------------------------------------------------------------------------------------------
+// utils
+//----------------------------------------------------------------------------------------------------
+const SYSTEM_EVENTS = ['start', 'update', 'render', 'stop', 'finalize'];
 //----------------------------------------------------------------------------------------------------
 // unit
 //----------------------------------------------------------------------------------------------------
@@ -626,11 +628,11 @@ class Unit {
             unit._.state = 'finalized';
         }
     }
-    static nest(unit, tag) {
+    static nest(unit, htmlString, textContent) {
         if (unit._.state !== 'invoked') {
             throw new Error('This function can not be called after initialized.');
         }
-        const match = tag.match(/<((\w+)[^>]*?)\/?>/);
+        const match = htmlString.match(/<((\w+)[^>]*?)\/?>/);
         if (match !== null) {
             let element;
             if (unit._.anchor !== null) {
@@ -643,11 +645,14 @@ class Unit {
                 element = unit._.currentElement.children[unit._.currentElement.children.length - 1];
             }
             unit._.currentElement = element;
+            if (textContent !== undefined) {
+                element.textContent = textContent;
+            }
             unit._.elements.push(element);
             return element;
         }
         else {
-            throw new Error(`Invalid tag: ${tag}`);
+            throw new Error(`Invalid html string: ${htmlString}`);
         }
     }
     static extend(unit, component, props) {
@@ -939,19 +944,19 @@ const xnew$1 = Object.assign(function (...args) {
 }, {
     /**
      * Creates a nested HTML/SVG element within the current component
-     * @param tag - HTML or SVG tag name (e.g., '<div>', '<span>', '<svg>')
+     * @param htmlString - HTML or SVG tag name (e.g., '<div>', '<span>', '<svg>')
      * @returns The created HTML/SVG element
      * @throws Error if called after component initialization
      * @example
      * const div = xnew.nest('<div>')
      * div.textContent = 'Hello'
      */
-    nest(tag) {
+    nest(htmlString, textContent) {
         try {
-            return Unit.nest(Unit.currentUnit, tag);
+            return Unit.nest(Unit.currentUnit, htmlString, textContent);
         }
         catch (error) {
-            console.error('xnew.nest(tag: string): ', error);
+            console.error('xnew.nest(htmlString: string): ', error);
             throw error;
         }
     },
@@ -1364,51 +1369,6 @@ function DirectionalPad(unit, { diagonal = true, stroke = 'currentColor', stroke
     });
 }
 
-function TextStream(unit, { text = '', speed = 50, fade = 300 } = {}) {
-    const chars = [];
-    for (let i = 0; i < text.length; i++) {
-        const unit = xnew$1('<span>');
-        unit.element.textContent = text[i];
-        unit.element.style.opacity = '0';
-        unit.element.style.transition = `opacity ${fade}ms ease-in-out`;
-        chars.push(unit);
-    }
-    let start = 0;
-    unit.on('start', () => {
-        start = new Date().getTime();
-    });
-    let state = 0;
-    unit.on('update', () => {
-        const index = Math.floor((new Date().getTime() - start) / speed);
-        // Display characters up to the current index (fade in)
-        for (let i = 0; i < chars.length; i++) {
-            if (i <= index) {
-                chars[i].element.style.opacity = '1';
-            }
-        }
-        if (state === 0 && index >= text.length) {
-            action();
-        }
-    });
-    xnew$1.timeout(() => {
-        xnew$1(document.body).on('click wheel', action);
-        unit.on('keydown', action);
-    }, 100);
-    function action() {
-        if (state === 0) {
-            state = 1;
-            for (let i = 0; i < chars.length; i++) {
-                chars[i].element.style.opacity = '1';
-            }
-            xnew$1.emit('-complete');
-        }
-        else if (state === 1) {
-            state = 2;
-            xnew$1.emit('-next');
-        }
-    }
-}
-
 const context = new window.AudioContext();
 const master = context.createGain();
 //----------------------------------------------------------------------------------------------------
@@ -1637,7 +1597,6 @@ const basics = {
     Screen,
     Modal,
     Accordion,
-    TextStream,
     AnalogStick,
     DirectionalPad,
 };
@@ -1668,15 +1627,6 @@ const audio = {
         master.gain.value = value;
     }
 };
-const temp = Object.assign(xnew$1, { basics, audio });
-Object.defineProperty(temp, 'global', {
-    get: function () {
-        return temp.context('xnew.global');
-    },
-    set: function (value) {
-        temp.context('xnew.global', value);
-    }
-});
-const xnew = temp;
+const xnew = Object.assign(xnew$1, { basics, audio });
 
 export { xnew as default };

package/package.json

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