Upgrade the tooling

.pre-commit-config.yaml

@@ -1,35 +1,30 @@
 exclude: ".yarn/|yarn.lock|static"
 repos:
   - repo: https://github.com/pre-commit/pre-commit-hooks
-    rev: v4.5.0
+    rev: v4.6.0
     hooks:
       - id: check-added-large-files
       - id: check-merge-conflict
       - id: end-of-file-fixer
       - id: trailing-whitespace
   - repo: https://github.com/adamchainz/django-upgrade
-    rev: 1.16.0
+    rev: 1.17.0
     hooks:
       - id: django-upgrade
         args: [--target-version, "4.2"]
   - repo: https://github.com/astral-sh/ruff-pre-commit
-    rev: "v0.3.2"
+    rev: "v0.4.5"
     hooks:
       - id: ruff
       - id: ruff-format
   - repo: https://github.com/pre-commit/mirrors-prettier
-    rev: v3.0.3
+    rev: v3.1.0
     hooks:
       - id: prettier
         args: [--list-different, --no-semi, "--trailing-comma=es5"]
         exclude: "^conf/|.*\\.html$"
-  - repo: https://github.com/pre-commit/mirrors-eslint
-    rev: v8.48.0
+  - repo: https://github.com/biomejs/pre-commit
+    rev: "v0.1.0"
     hooks:
-      - id: eslint
-        additional_dependencies:
-          - eslint
-          - eslint-config-prettier
-          - "@babel/core"
-          - "@babel/eslint-parser"
-          - "@babel/preset-env"
+      - id: biome-check
+        additional_dependencies: ["@biomejs/[email protected]"]

biome.json

@@ -0,0 +1,23 @@
+{
+  "$schema": "https://biomejs.dev/schemas/1.7.3/schema.json",
+  "organizeImports": {
+    "enabled": false
+  },
+  "formatter": {
+    "enabled": true,
+    "indentStyle": "space",
+    "indentWidth": 2,
+    "ignore": ["*/map/styles_*.json"]
+  },
+  "javascript": {
+    "formatter": {
+      "semicolons": "asNeeded"
+    }
+  },
+  "linter": {
+    "enabled": true,
+    "rules": {
+      "recommended": true
+    }
+  }
+}

esbuild.mjs

@@ -1,8 +1,8 @@
 import * as esbuild from "esbuild"
 import postcss from "esbuild-postcss"
 
-let devMode = process.argv.includes("watch")
-let ctx = await esbuild.context({
+const devMode = process.argv.includes("watch")
+const ctx = await esbuild.context({
   entryPoints: ["./src/index.js"],
   jsxFactory: "h",
   jsxFragment: "Fragment",

src/commands.js

@@ -36,7 +36,7 @@ const linkDialog = (attrs) => {
         resolve(
           form.href.value
             ? { href: form.href.value, title: form.title.value }
-            : null
+            : null,
         )
       }
     })
@@ -51,7 +51,7 @@ export const addLink = (state, dispatch) => {
   if (empty && !type.isInSet($from.marks())) return false
 
   if (dispatch) {
-    let mark = $from.marks().find((mark) => mark.type === type)
+    const mark = $from.marks().find((mark) => mark.type === type)
     linkDialog(mark?.attrs || {}).then((attrs) => {
       if (attrs) {
         let range
@@ -63,10 +63,10 @@ export const addLink = (state, dispatch) => {
           dispatch(
             state.tr
               .removeMark(range.from, range.to, type)
-              .addMark(range.from, range.to, type.create(attrs))
+              .addMark(range.from, range.to, type.create(attrs)),
           )
         } else {
-          let { from, to } = trimmedRangeFromSelection(state.selection)
+          const { from, to } = trimmedRangeFromSelection(state.selection)
           dispatch(state.tr.addMark(from, to, type.create(attrs)))
         }
       }
@@ -140,7 +140,9 @@ export const updateHTML = (state, dispatch) => {
 export const insertHorizontalRule = (state, dispatch) => {
   if (dispatch) {
     dispatch(
-      state.tr.replaceSelectionWith(state.schema.nodes.horizontal_rule.create())
+      state.tr.replaceSelectionWith(
+        state.schema.nodes.horizontal_rule.create(),
+      ),
     )
   }
   return true

src/editor.js

@@ -96,12 +96,12 @@ export function createEditor(textarea, config) {
   })
   schema = pruneSchema(schema, config.types)
 
-  let ourKeymap = {
+  const ourKeymap = {
     ...buildKeymap(schema),
     ...applyMarksKeymap(schema),
   }
 
-  let plugins = [
+  const plugins = [
     keymap(ourKeymap),
     keymap(baseKeymap),
     dropCursor(),
@@ -115,7 +115,7 @@ export function createEditor(textarea, config) {
         markMenuItems(schema),
         config.history ? historyMenuItems() : null,
         config.html ? htmlMenuItem() : null,
-      ].filter(Boolean)
+      ].filter(Boolean),
     ),
     noSpellCheck(),
   ]
@@ -137,7 +137,7 @@ export function createEditor(textarea, config) {
   const debouncedWriteBack = createDebouncedBackWriter(
     schema,
     editorViewInstance,
-    textarea
+    textarea,
   )
 
   return () => {

src/keymap.js

@@ -36,7 +36,7 @@ export function buildKeymap(schema) {
   if (!mac) bind("Mod-y", redo)
 
   if ((type = schema.nodes.hard_break)) {
-    let br = type,
+    const br = type,
       cmd = chainCommands(exitCode, (state, dispatch) => {
         if (dispatch) {
           dispatch(state.tr.replaceSelectionWith(br.create()).scrollIntoView())

src/menu.js

@@ -29,7 +29,7 @@ function markActive(state, type) {
 }
 
 function headingButton(level) {
-  let btn = crel("span", {
+  const btn = crel("span", {
     className: "prose-menubar__button prose-menubar__button--heading",
   })
   btn.append(
@@ -38,7 +38,7 @@ function headingButton(level) {
       textContent: "title",
       title: `heading ${level}`,
     }),
-    crel("span", { className: "level", textContent: `${level}` })
+    crel("span", { className: "level", textContent: `${level}` }),
   )
   return btn
 }

src/utils.js

@@ -4,7 +4,7 @@ import debounce from "lodash-es/debounce"
 export const crel = (tagName, attributes = null) => {
   const dom = document.createElement(tagName)
   if (attributes) {
-    for (let [name, value] of Object.entries(attributes)) {
+    for (const [name, value] of Object.entries(attributes)) {
       if (/^data-|^aria-|^role/.test(name)) dom.setAttribute(name, value)
       else dom[name] = value
     }
@@ -29,13 +29,13 @@ export function getHTML(state) {
 export const createDebouncedBackWriter = (
   schema,
   editorViewInstance,
-  textarea
+  textarea,
 ) => {
   const serializer = DOMSerializer.fromSchema(schema)
-  const serialize = function () {
+  const serialize = () => {
     const container = crel("article")
     container.appendChild(
-      serializer.serializeFragment(editorViewInstance.state.doc.content)
+      serializer.serializeFragment(editorViewInstance.state.doc.content),
     )
     return container.innerHTML
   }
@@ -45,7 +45,7 @@ export const createDebouncedBackWriter = (
     if (textarea.value !== value) {
       textarea.value = value
       textarea.dispatchEvent(
-        new InputEvent("input", { bubbles: true, cancelable: true })
+        new InputEvent("input", { bubbles: true, cancelable: true }),
       )
     }
   }
@@ -54,13 +54,14 @@ export const createDebouncedBackWriter = (
 
 export const trimmedRangeFromSelection = (selection) => {
   // Copied from prosemirror-commands/src/commands.ts
-  let { $from, $to } = selection
+  const { $from, $to } = selection
   let from = $from.pos,
     to = $to.pos,
     start = $from.nodeAfter,
     end = $to.nodeBefore
-  let spaceStart = start && start.isText ? /^\s*/.exec(start.text)[0].length : 0
-  let spaceEnd = end && end.isText ? /\s*$/.exec(end.text)[0].length : 0
+  const spaceStart =
+    start && start.isText ? /^\s*/.exec(start.text)[0].length : 0
+  const spaceEnd = end && end.isText ? /\s*$/.exec(end.text)[0].length : 0
   if (from + spaceStart < to) {
     from += spaceStart
     to -= spaceEnd