build sandbox pages

builder.js

@@ -28,7 +28,7 @@ html {
 const defaultIntro = `
 
 window.Macchiato = {
-  location: new MLocation(),
+  modules: {},
 }
 
 `.trim()
@@ -38,6 +38,12 @@ export class Builder {
     this.files = files
   }
 
+  buildStyle(file) {
+    const style = document.createElement('style')
+    style.textContent = file.data
+    return style.outerHTML
+  }
+
   buildModule(file) {
     const script = document.createElement('script')
     script.setAttribute('type', 'module')
@@ -113,14 +119,35 @@ export class Builder {
         data: replace(file.data),
       })
     ))
-    const html = (
+    const styles = this.files.filter(({name}) => (
+      name.endsWith('.css')
+    )).map(file => (
+      this.buildStyle(file)
+    ))
+    let html = (
       'index.html' in filesMap ?
       filesMap['index.html'] :
       defaultHtml
     )
-    return html.replace(
+    let replaced = false
+    html = html.replace(/\s*<\/head>/, match => {
+      replaced = true
+      return styles.join("\n") + "\n" + match
+    })
+    if (!replaced) {
+      html = styles.join("\n") + "\n" + html
+    }
+    replaced = false
+    html = html.replace(
       '<' + 'script type="module" src="/app.js"><' + '/script>',
-      intro + "\n" + modules.join("\n")
+      () => {
+        replaced = true
+        return intro + "\n" + modules.join("\n")
+      }
     )
+    if (!replaced) {
+      html += "\n" + intro + "\n" + modules.join("\n")
+    }
+    return html
   }
 }

editor-build.js

@@ -1,14 +1,15 @@
-import { Builder } from '/loader/builder.js'
+import { Builder } from "/loader/builder.js"
 
 export class EditorBuild {
   deps = [
-    '/editor/file-group.js',
+    'forms/button-group.js',
-    '/editor/file-view.js',
+    'dialog/dialog.js',
-    '/editor/text-edit.js',
+    'menu/dropdown.js',
-    '/editor/app.js',
+    'editor/file-group.js',
-    '/forms/button-group.js',
+    'editor/file-view.js',
-    '/dialog/dialog.js',
+    'editor/text-edit.js',
-    '/menu/dropdown.js',
+    'loader/builder.js',
+    'editor/app.js',
   ]
 
   constructor() {
@@ -24,6 +25,7 @@ export class EditorBuild {
         data: await resp.text(),
       })
     }
+    this.files = files
   }
 
   async build() {