Run prettier on all relevant files

assets/css/app.css

@@ -16,7 +16,10 @@
 @custom-variant phx-change-loading (.phx-change-loading&, .phx-change-loading &);
 
 /* Make LiveView wrapper divs transparent for layout */
-[data-phx-session], [data-phx-teleported-src] { display: contents }
+[data-phx-session],
+[data-phx-teleported-src] {
+  display: contents;
+}
 
 @layer base {
   a,
@@ -37,7 +40,7 @@
 
 @theme {
   --font-sans: "InterVariable", sans-serif;
-  --font-sans--font-feature-settings: 'cv02', 'cv03', 'cv04', 'cv11';
+  --font-sans--font-feature-settings: "cv02", "cv03", "cv04", "cv11";
   --animate-shake: shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
   --animate-shine: shine 3s ease infinite;
   --animate-equalizer-bar: equalizer-bar 1.2s ease-in-out infinite;

assets/js/app.js

@@ -33,12 +33,12 @@ import { createLiveToastHook } from "live_toast";
 import banner from "./banner";
 
 // the duration for each toast to stay on screen in ms
-const duration = 4000
+const duration = 4000;
 
 // how many toasts to show on screen at once
-const maxItems = 3
+const maxItems = 3;
 
-const liveToastHook = createLiveToastHook(duration, maxItems)
+const liveToastHook = createLiveToastHook(duration, maxItems);
 
 let Hooks = FluxonHooks;
 Hooks.FormatNumber = FormatNumberHook;
@@ -56,8 +56,8 @@ const liveSocket = new LiveSocket("/live", Socket, {
   params: (view) => {
     return {
       _csrf_token: csrfToken,
-      timezone: Intl.DateTimeFormat().resolvedOptions().timeZone
-    }
+      timezone: Intl.DateTimeFormat().resolvedOptions().timeZone,
+    };
   },
   hooks: { ...Hooks, ...colocatedHooks },
   dom: {
@@ -121,32 +121,39 @@ window.liveSocket = liveSocket;
 //     2. click on elements to jump to their definitions in your code editor
 //
 if (process.env.NODE_ENV === "development") {
-  window.addEventListener("phx:live_reload:attached", ({ detail: reloader }) => {
-    // Enable server log streaming to client.
-    // Disable with reloader.disableServerLogs()
-    reloader.enableServerLogs()
+  window.addEventListener(
+    "phx:live_reload:attached",
+    ({ detail: reloader }) => {
+      // Enable server log streaming to client.
+      // Disable with reloader.disableServerLogs()
+      reloader.enableServerLogs();
 
-    // Open configured PLUG_EDITOR at file:line of the clicked element's HEEx component
-    //
-    //   * click with "c" key pressed to open at caller location
-    //   * click with "d" key pressed to open at function component definition location
-    let keyDown
-    window.addEventListener("keydown", e => keyDown = e.key)
-    window.addEventListener("keyup", e => keyDown = null)
-    window.addEventListener("click", e => {
-      if (keyDown === "c") {
-        e.preventDefault()
-        e.stopImmediatePropagation()
-        reloader.openEditorAtCaller(e.target)
-      } else if (keyDown === "d") {
-        e.preventDefault()
-        e.stopImmediatePropagation()
-        reloader.openEditorAtDef(e.target)
-      }
-    }, true)
+      // Open configured PLUG_EDITOR at file:line of the clicked element's HEEx component
+      //
+      //   * click with "c" key pressed to open at caller location
+      //   * click with "d" key pressed to open at function component definition location
+      let keyDown;
+      window.addEventListener("keydown", (e) => (keyDown = e.key));
+      window.addEventListener("keyup", (e) => (keyDown = null));
+      window.addEventListener(
+        "click",
+        (e) => {
+          if (keyDown === "c") {
+            e.preventDefault();
+            e.stopImmediatePropagation();
+            reloader.openEditorAtCaller(e.target);
+          } else if (keyDown === "d") {
+            e.preventDefault();
+            e.stopImmediatePropagation();
+            reloader.openEditorAtDef(e.target);
+          }
+        },
+        true,
+      );
 
-    window.liveReloader = reloader
-  })
+      window.liveReloader = reloader;
+    },
+  );
 }
 
 // Credit: https://andrewtimberlake.com/blog/2025/03/see-what-liveview-changes-are-being-made

assets/js/banner.js

@@ -1,6 +1,7 @@
 export default function banner() {
   const version = document.querySelector('meta[name="version"]').content;
-  console.log(`%c
+  console.log(
+    `%c
 ███╗   ███╗██╗   ██╗███████╗██╗ ██████╗    ██╗     ██╗██████╗ ██████╗  █████╗ ██████╗ ██╗   ██╗
 ████╗ ████║██║   ██║██╔════╝██║██╔════╝    ██║     ██║██╔══██╗██╔══██╗██╔══██╗██╔══██╗╚██╗ ██╔╝
 ██╔████╔██║██║   ██║███████╗██║██║         ██║     ██║██████╔╝██████╔╝███████║██████╔╝ ╚████╔╝ 
@@ -8,5 +9,7 @@ export default function banner() {
 ██║ ╚═╝ ██║╚██████╔╝███████║██║╚██████╗    ███████╗██║██████╔╝██║  ██║██║  ██║██║  ██║   ██║   
 ╚═╝     ╚═╝ ╚═════╝ ╚══════╝╚═╝ ╚═════╝    ╚══════╝╚═╝╚═════╝ ╚═╝  ╚═╝╚═╝  ╚═╝╚═╝  ╚═╝   ╚═╝   
 Version: ${version}
-`, "font-family: IBM Plex Mono,monospace; font-size: 12px");
+`,
+    "font-family: IBM Plex Mono,monospace; font-size: 12px",
+  );
 }

assets/js/hooks/create-navigation-hook.js

@@ -1,4 +1,8 @@
-export default function createNavigationHook({ getContainer, inputId, onSelect }) {
+export default function createNavigationHook({
+  getContainer,
+  inputId,
+  onSelect,
+}) {
   return {
     mounted() {
       this.selectedIndex = -1;
@@ -89,13 +93,16 @@ export default function createNavigationHook({ getContainer, inputId, onSelect }
         if (searchInput) {
           searchInput.focus();
         }
-      } else if (this.selectedIndex >= 0 && this.selectedIndex < results.length) {
+      } else if (
+        this.selectedIndex >= 0 &&
+        this.selectedIndex < results.length
+      ) {
         const selectedResult = results[this.selectedIndex];
         selectedResult.setAttribute("aria-selected", "true");
 
         selectedResult.scrollIntoView({
           block: "nearest",
-          behavior: "smooth"
+          behavior: "smooth",
         });
       }
     },
@@ -105,6 +112,6 @@ export default function createNavigationHook({ getContainer, inputId, onSelect }
       if (!container) return [];
 
       return Array.from(container.querySelectorAll('[role="option"]'));
-    }
+    },
   };
 }

assets/js/hooks/format-number.js

@@ -4,5 +4,5 @@ export default {
   },
   updated() {
     this.el.innerText = parseInt(this.el.innerText).toLocaleString();
-  }
-}
+  },
+};

assets/js/hooks/record-picker-navigation.js

@@ -9,5 +9,5 @@ export default createNavigationHook({
     } else {
       hook.navigateUp();
     }
-  }
+  },
 });

assets/js/hooks/rule-picker-navigation.js

@@ -9,5 +9,5 @@ export default createNavigationHook({
     } else {
       hook.navigateUp();
     }
-  }
+  },
 });

assets/js/hooks/sortable-list.js

@@ -28,7 +28,7 @@ export default {
       onEnd: () => {
         const items = this.el.querySelectorAll("[data-sortable-item]");
         const recordIds = Array.from(items).map(
-          (item) => item.dataset.recordId
+          (item) => item.dataset.recordId,
         );
 
         const payload = { record_ids: recordIds };

assets/js/hooks/universal-search-navigation.js

@@ -2,5 +2,5 @@ import createNavigationHook from "./create-navigation-hook";
 
 export default createNavigationHook({
   getContainer: () => document.getElementById("universal-search-root"),
-  inputId: "universal-search-input"
+  inputId: "universal-search-input",
 });