mithril-mobs 0.0.3 → 0.0.4

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "mithril-mobs",
     "private": false,
-    "version": "0.0.3",
+    "version": "0.0.4",
     "type": "module",
     "scripts": {
         "dev": "vite",

package/src/mobs/index.js

@@ -1,4 +1,4 @@
-import m from "mithril"
+import m from "mithril";
 
 /**
  * Reactive Observable (obs)
@@ -171,7 +171,7 @@ function prepare(ctx) {
 }
 
 /**
- * Styled Component Creator
+ * Styled Component Creator - MULTIPLE <style> TAG VERSION
  */
 const Component = {
   _counter: 0,
@@ -199,20 +199,14 @@ const Component = {
       return css;
     }
 
-    let styleTag = document.getElementById("component-styles");
-    if (!styleTag) {
-      styleTag = document.createElement("style");
-      styleTag.id = "component-styles";
+    // Inject a new <style> tag per component
+    if (def.staticStyles) {
+      const styleTag = document.createElement("style");
+      styleTag.setAttribute("data-comp-id", compId);
+      styleTag.textContent = stylesToCss(def.staticStyles);
       document.head.appendChild(styleTag);
     }
 
-    styleTag.__injectedComponents = styleTag.__injectedComponents || new Set();
-
-    if (!styleTag.__injectedComponents.has(compId)) {
-      styleTag.appendChild(document.createTextNode(stylesToCss(def.staticStyles || {})));
-      styleTag.__injectedComponents.add(compId);
-    }
-
     return {
       ...def,
       view(vnode) {
@@ -236,9 +230,6 @@ const Component = {
 
 export const createComponent = (def) => Component.create(def);
 
-
-
-
 /**
  * Repeat Helper
  */
@@ -246,10 +237,10 @@ export const repeat = (times, increment = 1) => {
   return {
     map(cb) {
       const items = [] 
-      for(let i = 0; i < times; i+=increment) {
-        items.push(cb(i))
+      for (let i = 0; i < times; i += increment) {
+        items.push(cb(i));
       }
-      return items
+      return items;
     }
-  }
-}
+  };
+};