styles updated

web-atoms · Dec 16, 2024 · 12c8c9d · 12c8c9d
1 parent d16c5b2
commit 12c8c9d
Showing 1 changed file with 23 additions and 14 deletions.
diff --git a/src/style/styled.ts b/src/style/styled.ts
@@ -44,25 +44,34 @@ const nextId = () => `styled-r${id++}`;
 
 let first = document.head.firstElementChild;
 
+const markers = {
+
+};
+
 const addMarker = (name) => {
-    const m = document.createElement("meta");
+    let m = document.head.querySelector(`meta[name="${name}"]`) as HTMLMetaElement;
+    if (m) {
+        first = m;
+        return markers[name] = m;
+    }
+    m = document.createElement("meta");
     m.name = name;
     if (first) {
         first.insertAdjacentElement("afterend", m);
     } else {
         document.head.insertAdjacentElement("afterbegin", m);
     }
     first = m;
-    return m;
+    return markers[name] = m;
 }
 
-const globalLow = addMarker("global-low-style");
-const global = addMarker("global-style");
-const globalHigh = addMarker("global-high-style");
+addMarker("global-low-style");
+addMarker("global-style");
+addMarker("global-high-style");
 
-const localLow = addMarker("local-low-style");
-const local = addMarker("local-style");
-const localHigh = addMarker("local-high-style");
+addMarker("local-low-style");
+addMarker("local-style");
+addMarker("local-high-style");
 
 // export type IStyleFragment = Partial<StyleFragment>;
 
@@ -166,14 +175,14 @@ class StyleFragment {
         }
         switch(this.order) {
             case "low":
-                document.head.insertBefore(style, globalLow);
+                document.head.insertBefore(style, markers["global-low"]);
                 break;
             case "default":
             case "medium":
-                document.head.insertBefore(style, global);
+                document.head.insertBefore(style, markers["global"]);
                 break;
             case "high":
-                document.head.insertBefore(style, globalHigh);
+                document.head.insertBefore(style, markers["global-high"]);
                 break;
         }
         style.id = id;
@@ -196,14 +205,14 @@ class StyleFragment {
         }
         switch(this.order) {
             case "low":
-                document.head.insertBefore(style, localLow);
+                document.head.insertBefore(style, markers["local-low"]);
                 break;
             case "default":
             case "medium":
-                document.head.insertBefore(style, local);
+                document.head.insertBefore(style, markers["local"]);
                 break;
             case "high":
-                document.head.insertBefore(style, localHigh);
+                document.head.insertBefore(style, markers["local-high"]);
                 break;
         }
         return selector;