@monza-editor/astro 0.5.14 → 0.6.1

package/package.json

@@ -1,15 +1,12 @@
 {
   "name": "@monza-editor/astro",
-  "version": "0.5.14",
+  "version": "0.6.1",
   "description": "Astro component of Monza editor",
+  "license": "MIT",
   "repository": {
     "type": "git",
     "url": "https://github.com/raviqqe/monza-editor"
   },
-  "license": "MIT",
-  "publishConfig": {
-    "provenance": true
-  },
   "type": "module",
   "exports": {
     ".": {
@@ -17,13 +14,16 @@
       "default": "./src/index.js"
     }
   },
+  "publishConfig": {
+    "provenance": true
+  },
   "dependencies": {
-    "monza-editor": "^0.5.14",
-    "picolight": "^0.2.9"
+    "monza-editor": "^0.6.1",
+    "picolight": "^0.3.4"
   },
   "devDependencies": {
-    "@raviqqe/tsconfig": "^3.0.2",
-    "astro": "^7.2.4",
+    "@raviqqe/tsconfig": "^3.0.5",
+    "astro": "^7.4.7",
     "typescript": "^6.0.3"
   },
   "scripts": {

package/src/Editor.astro

@@ -16,53 +16,53 @@ const { id, language, theme, darkTheme, value, ...props } = Astro.props;
 ---
 
 <monza-editor
+  data-dark-theme={JSON.stringify(darkTheme)}
   data-language={serializeLanguage(language)}
   data-theme={JSON.stringify(theme)}
-  data-dark-theme={JSON.stringify(darkTheme)}
 >
-  <div class={`${styles.main} ${props.class}`} id={id}>
+  <div class={`${styles.root} ${props.class}`} id={id}>
     <textarea class={styles.textarea}>{value}</textarea>
     <pre class={styles.pre}><code class={styles.code} /></pre>
   </div>
 </monza-editor>
 <script>
-  import { initialize } from "monza-editor";
-  import { deserializeLanguage, highlight } from "picolight";
+import { initialize } from "monza-editor";
+import { deserializeLanguage, highlight } from "picolight";
 
-  class Editor extends HTMLElement {
-    async connectedCallback(): Promise<void> {
-      const { language, theme, darkTheme } = this.dataset;
+class Editor extends HTMLElement {
+  async connectedCallback(): Promise<void> {
+    const { language, theme, darkTheme } = this.dataset;
 
-      if (!language || !theme) {
-        throw new Error("Editor props missing");
-      }
+    if (!language || !theme) {
+      throw new Error("Editor props missing");
+    }
 
-      const div = this.querySelector("div");
-      const textarea = this.querySelector("textarea");
-      const pre = this.querySelector("pre");
-      const code = this.querySelector("code");
+    const div = this.querySelector("div");
+    const textarea = this.querySelector("textarea");
+    const pre = this.querySelector("pre");
+    const code = this.querySelector("code");
 
-      if (!div || !textarea || !pre || !code) {
-        throw new Error("Editor elements missing");
-      }
+    if (!div || !textarea || !pre || !code) {
+      throw new Error("Editor elements missing");
+    }
 
-      const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
-      let dark = mediaQuery.matches;
-      mediaQuery.addEventListener("change", (event) => (dark = event.matches));
+    const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+    let dark = mediaQuery.matches;
+    mediaQuery.addEventListener("change", (event) => (dark = event.matches));
 
-      initialize({
-        code,
-        highlight: (text) =>
-          highlight(
-            text,
-            deserializeLanguage(language),
-            JSON.parse((dark && darkTheme) || theme),
-          ).outerHTML,
-        pre,
-        textarea,
-      });
-    }
+    initialize({
+      code,
+      highlight: (text) =>
+        highlight(
+          text,
+          deserializeLanguage(language),
+          JSON.parse((dark && darkTheme) || theme),
+        ).outerHTML,
+      pre,
+      textarea,
+    });
   }
+}
 
-  customElements.define("monza-editor", Editor);
+customElements.define("monza-editor", Editor);
 </script>

package/CHANGELOG.md

@@ -1,13 +0,0 @@
-# @monza-editor/astro
-
-## 0.5.14
-
-### Patch Changes
-
-- Include readme
-
-## 0.5.13
-
-### Patch Changes
-
-- Release