@jsenv/plugin-toolbar 0.1.14 → 1.0.1

package/README.md

@@ -0,0 +1,3 @@
+# @jsenv/plugin-toolbar [![npm package](https://img.shields.io/npm/v/@jsenv/plugin-toolbar.svg?logo=npm&label=package)](https://www.npmjs.com/package/@jsenv/plugin-toolbar)
+
+[Documentation](<https://github.com/jsenv/core/wiki/A)-Getting-started>) · [Changelog](./CHANGELOG.md)

package/dist/js/toolbar_core.js

@@ -1,8 +1,8 @@
 var l$2;
 l$2 = {
   __e: function (n, l, u, i) {
-    for (var t, r, o; l = l.__;) if ((t = l.__c) && !t.__) try {
-      if ((r = t.constructor) && null != r.getDerivedStateFromError && (t.setState(r.getDerivedStateFromError(n)), o = t.__d), null != t.componentDidCatch && (t.componentDidCatch(n, i || {}), o = t.__d), o) return t.__E = t;
+    for (var t, o, r; l = l.__;) if ((t = l.__c) && !t.__) try {
+      if ((o = t.constructor) && null != o.getDerivedStateFromError && (t.setState(o.getDerivedStateFromError(n)), r = t.__d), null != t.componentDidCatch && (t.componentDidCatch(n, i || {}), r = t.__d), r) return t.__E = t;
     } catch (l) {
       n = l;
     }
@@ -748,24 +748,24 @@ const notifyExecutionResult = (execution, previousExecution) => {
       if (previousExecution.status === "completed") {
         notify("Broken", {
           ...notificationOptions,
-          body: `${executedFileRelativeUrl} execution now failing.`
+          body: "".concat(executedFileRelativeUrl, " execution now failing.")
         });
       } else {
         notify("Still failing", {
           ...notificationOptions,
-          body: `${executedFileRelativeUrl} execution still failing.`
+          body: "".concat(executedFileRelativeUrl, " execution still failing.")
         });
       }
     } else {
       notify("Failing", {
         ...notificationOptions,
-        body: `${executedFileRelativeUrl} execution failed.`
+        body: "".concat(executedFileRelativeUrl, " execution failed.")
       });
     }
   } else if (previousExecution && previousExecution.status === "failed") {
     notify("Fixed", {
       ...notificationOptions,
-      body: `${executedFileRelativeUrl} execution fixed.`
+      body: "".concat(executedFileRelativeUrl, " execution fixed.")
     });
   }
 };
@@ -1279,7 +1279,7 @@ const renderDocumentIndexLink = () => {
 };
 
 const enableVariant = (rootNode, variables) => {
-  const nodesNotMatching = Array.from(rootNode.querySelectorAll(`[${attributeIndicatingACondition}]`));
+  const nodesNotMatching = Array.from(rootNode.querySelectorAll("[".concat(attributeIndicatingACondition, "]")));
   nodesNotMatching.forEach(nodeNotMatching => {
     const conditionAttributeValue = nodeNotMatching.getAttribute(attributeIndicatingACondition);
     const matches = testCondition(conditionAttributeValue, variables);
@@ -1287,7 +1287,7 @@ const enableVariant = (rootNode, variables) => {
       renameAttribute(nodeNotMatching, attributeIndicatingACondition, attributeIndicatingAMatch);
     }
   });
-  const nodesMatching = Array.from(rootNode.querySelectorAll(`[${attributeIndicatingAMatch}]`));
+  const nodesMatching = Array.from(rootNode.querySelectorAll("[".concat(attributeIndicatingAMatch, "]")));
   nodesMatching.forEach(nodeMatching => {
     const conditionAttributeValue = nodeMatching.getAttribute(attributeIndicatingAMatch);
     const matches = testCondition(conditionAttributeValue, variables);
@@ -1325,8 +1325,8 @@ const parseCondition = conditionAttributeValue => {
     value: conditionAttributeValue.slice(colonIndex + 1)
   };
 };
-const attributeIndicatingACondition = `data-when`;
-const attributeIndicatingAMatch = `data-when-active`;
+const attributeIndicatingACondition = "data-when";
+const attributeIndicatingAMatch = "data-when-active";
 const renameAttribute = (node, name, newName) => {
   node.setAttribute(newName, node.getAttribute(name));
   node.removeAttribute(name);
@@ -1379,10 +1379,10 @@ const computeText = ({
   endTime
 }) => {
   if (status === "completed") {
-    return `Execution completed in ${endTime - startTime}ms`;
+    return "Execution completed in ".concat(endTime - startTime, "ms");
   }
   if (status === "failed") {
-    return `Execution failed in ${endTime - startTime}ms`;
+    return "Execution failed in ".concat(endTime - startTime, "ms");
   }
   if (status === "running") {
     return "Executing...";
@@ -1468,9 +1468,9 @@ const computeTooltipText = ({
 }) => {
   const changesCount = changes.length;
   if (changesCount === 1) {
-    return `There is <a href="javascript:void(0)">1</a> change to apply`;
+    return "There is <a href=\"javascript:void(0)\">1</a> change to apply";
   }
-  return `There is  <a href="javascript:void(0)">${changesCount}<a> changes to apply`;
+  return "There is  <a href=\"javascript:void(0)\">".concat(changesCount, "<a> changes to apply");
 };
 
 const parentServerEvents = window.parent.__server_events__;
@@ -1546,7 +1546,7 @@ const renderToolbarAutoreloadSetting = () => {
 };
 const disableAutoreloadSetting = () => {
   document.querySelector(".settings_autoreload").setAttribute("data-disabled", "true");
-  document.querySelector(".settings_autoreload").setAttribute("title", `Autoreload not enabled on server`);
+  document.querySelector(".settings_autoreload").setAttribute("title", "Autoreload not enabled on server");
   document.querySelector("#toggle_autoreload").disabled = true;
 };
 
@@ -1641,7 +1641,7 @@ const renderToolbarNotificationSetting = () => {
 const applyNotificationNotAvailableEffects = () => {
   const notifSetting = document.querySelector(".settings_notification");
   notifSetting.setAttribute("data-disabled", "true");
-  notifSetting.setAttribute("title", `Notification not available in the browser`);
+  notifSetting.setAttribute("title", "Notification not available in the browser");
   notifCheckbox.disabled = true;
 };
 const applyNotificationDefaultEffects = () => {
@@ -1654,7 +1654,7 @@ const applyNotificationDeniedEffects = () => {
   applyNotificationNOTGrantedEffects();
   const notifSetting = document.querySelector(".settings_notification");
   notifSetting.setAttribute("data-disabled", "true");
-  notifSetting.setAttribute("title", `Notification denied`);
+  notifSetting.setAttribute("title", "Notification denied");
 };
 const applyNotificationGrantedEffects = () => {
   enableVariant(document.querySelector(".notification_text"), {

package/dist/js/toolbar_injector.js

@@ -80,52 +80,7 @@ const injectToolbar = async ({
     });
   });
   const div = document.createElement("div");
-  div.innerHTML = `
-<div id="jsenv_toolbar_trigger" style="display:none">
-  <svg id="jsenv_toolbar_trigger_icon">
-    <use xlink:href="${jsenvLogoSvgUrl}#jsenv_logo"></use>
-  </svg>
-  <style>
-    #jsenv_toolbar_trigger {
-      display: block;
-      overflow: hidden;
-      position: fixed;
-      z-index: 1000;
-      bottom: -32px;
-      right: 20px;
-      height: 40px;
-      width: 40px;
-      padding: 0;
-      margin: 0;
-      border-radius: 5px 5px 0 0;
-      border: 1px solid rgba(0, 0, 0, 0.33);
-      border-bottom: none;
-      box-shadow: 0px 0px 6px 2px rgba(0, 0, 0, 0.46);
-      background: transparent;
-      text-align: center;
-      transition: 600ms;
-    }
-
-    #jsenv_toolbar_trigger:hover {
-      cursor: pointer;
-    }
-
-    #jsenv_toolbar_trigger[data-expanded] {
-      bottom: 0;
-    }
-
-    #jsenv_toolbar_trigger_icon {
-      width: 35px;
-      height: 35px;
-      opacity: 0;
-      transition: 600ms;
-    }
-
-    #jsenv_toolbar_trigger[data-expanded] #jsenv_toolbar_trigger_icon {
-      opacity: 1;
-    }
-  </style>
-</div>`;
+  div.innerHTML = "\n<div id=\"jsenv_toolbar_trigger\" style=\"display:none\">\n  <svg id=\"jsenv_toolbar_trigger_icon\">\n    <use xlink:href=\"".concat(jsenvLogoSvgUrl, "#jsenv_logo\"></use>\n  </svg>\n  <style>\n    #jsenv_toolbar_trigger {\n      display: block;\n      overflow: hidden;\n      position: fixed;\n      z-index: 1000;\n      bottom: -32px;\n      right: 20px;\n      height: 40px;\n      width: 40px;\n      padding: 0;\n      margin: 0;\n      border-radius: 5px 5px 0 0;\n      border: 1px solid rgba(0, 0, 0, 0.33);\n      border-bottom: none;\n      box-shadow: 0px 0px 6px 2px rgba(0, 0, 0, 0.46);\n      background: transparent;\n      text-align: center;\n      transition: 600ms;\n    }\n\n    #jsenv_toolbar_trigger:hover {\n      cursor: pointer;\n    }\n\n    #jsenv_toolbar_trigger[data-expanded] {\n      bottom: 0;\n    }\n\n    #jsenv_toolbar_trigger_icon {\n      width: 35px;\n      height: 35px;\n      opacity: 0;\n      transition: 600ms;\n    }\n\n    #jsenv_toolbar_trigger[data-expanded] #jsenv_toolbar_trigger_icon {\n      opacity: 1;\n    }\n  </style>\n</div>");
   const toolbarTrigger = div.firstElementChild;
   iframe.parentNode.appendChild(toolbarTrigger);
   let timer;

package/dist/jsenv_plugin_toolbar.js

@@ -72,9 +72,7 @@ const generateCodeToInjectToolbar = ({
     animationsEnabled,
     notificationsEnabled
   }, null, "  ");
-  return `import { injectToolbar } from ${from}
-
-injectToolbar(${paramsSource});`;
+  return "import { injectToolbar } from ".concat(from, "\n\ninjectToolbar(").concat(paramsSource, ");");
 };
 
 export { jsenvPluginToolbar };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jsenv/plugin-toolbar",
-  "version": "0.1.14",
+  "version": "1.0.1",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -26,7 +26,7 @@
     "/src/"
   ],
   "dependencies": {
-    "@jsenv/ast": "3.0.7",
+    "@jsenv/ast": "4.0.0",
     "@preact/signals": "1.1.3"
   },
   "scripts": {

package/src/client/core/animation_actions.js

@@ -1,8 +1,8 @@
-import { animationsEnabledSignal } from "./animation_signals.js"
+import { animationsEnabledSignal } from "./animation_signals.js";
 
 export const enableAnimations = () => {
-  animationsEnabledSignal.value = true
-}
+  animationsEnabledSignal.value = true;
+};
 export const disableAnimations = () => {
-  animationsEnabledSignal.value = false
-}
+  animationsEnabledSignal.value = false;
+};

package/src/client/core/animation_effects.js

@@ -1,12 +1,12 @@
-import { effect } from "@preact/signals"
+import { effect } from "@preact/signals";
 
-import { animationsEnabledSignal } from "./animation_signals.js"
+import { animationsEnabledSignal } from "./animation_signals.js";
 
 effect(() => {
-  const animationsEnabled = animationsEnabledSignal.value
+  const animationsEnabled = animationsEnabledSignal.value;
   if (animationsEnabled) {
-    document.documentElement.removeAttribute("data-animation-disabled")
+    document.documentElement.removeAttribute("data-animation-disabled");
   } else {
-    document.documentElement.setAttribute("data-animation-disabled", "")
+    document.documentElement.setAttribute("data-animation-disabled", "");
   }
-})
+});

package/src/client/core/animation_signals.js

@@ -1,7 +1,7 @@
-import { signal } from "@preact/signals"
+import { signal } from "@preact/signals";
 
-import { paramsFromParentWindow } from "./parent_window_context.js"
-import { stateFromLocalStorage } from "./toolbar_state_context.js"
+import { paramsFromParentWindow } from "./parent_window_context.js";
+import { stateFromLocalStorage } from "./toolbar_state_context.js";
 
 export const animationsEnabledSignal = signal(
   typeof stateFromLocalStorage.animationsEnabled === "boolean"
@@ -9,4 +9,4 @@ export const animationsEnabledSignal = signal(
     : typeof paramsFromParentWindow.animationsEnabled === "boolean"
     ? paramsFromParentWindow.animationsEnabled
     : false,
-)
+);

package/src/client/core/changes_actions.js

@@ -1,9 +1,9 @@
-import { changesTooltipOpenedSignal } from "./changes_signals.js"
+import { changesTooltipOpenedSignal } from "./changes_signals.js";
 
 export const openChangesToolip = () => {
-  changesTooltipOpenedSignal.value = true
-}
+  changesTooltipOpenedSignal.value = true;
+};
 
 export const closeChangesToolip = () => {
-  changesTooltipOpenedSignal.value = false
-}
+  changesTooltipOpenedSignal.value = false;
+};

package/src/client/core/changes_signals.js

@@ -1,3 +1,3 @@
-import { signal } from "@preact/signals"
+import { signal } from "@preact/signals";
 
-export const changesTooltipOpenedSignal = signal(false)
+export const changesTooltipOpenedSignal = signal(false);

package/src/client/core/execution_actions.js

@@ -1,50 +1,50 @@
-import { executionTooltipOpenedSignal } from "./execution_signals.js"
-import { notify } from "./notification_actions.js"
+import { executionTooltipOpenedSignal } from "./execution_signals.js";
+import { notify } from "./notification_actions.js";
 
 export const openExecutionTooltip = () => {
-  executionTooltipOpenedSignal.value = true
-}
+  executionTooltipOpenedSignal.value = true;
+};
 
 export const closeExecutionTooltip = () => {
-  executionTooltipOpenedSignal.value = false
-}
+  executionTooltipOpenedSignal.value = false;
+};
 
 export const notifyExecutionResult = (execution, previousExecution) => {
-  const executedFileRelativeUrl = window.location.href
+  const executedFileRelativeUrl = window.location.href;
   const notificationOptions = {
     lang: "en",
     icon: getFaviconHref(),
     clickToFocus: true,
     clickToClose: true,
-  }
+  };
   if (execution.status === "failed") {
     if (previousExecution) {
       if (previousExecution.status === "completed") {
         notify("Broken", {
           ...notificationOptions,
           body: `${executedFileRelativeUrl} execution now failing.`,
-        })
+        });
       } else {
         notify("Still failing", {
           ...notificationOptions,
           body: `${executedFileRelativeUrl} execution still failing.`,
-        })
+        });
       }
     } else {
       notify("Failing", {
         ...notificationOptions,
         body: `${executedFileRelativeUrl} execution failed.`,
-      })
+      });
     }
   } else if (previousExecution && previousExecution.status === "failed") {
     notify("Fixed", {
       ...notificationOptions,
       body: `${executedFileRelativeUrl} execution fixed.`,
-    })
+    });
   }
-}
+};
 
 const getFaviconHref = () => {
-  const link = document.querySelector('link[rel="icon"]')
-  return link ? link.href : undefined
-}
+  const link = document.querySelector('link[rel="icon"]');
+  return link ? link.href : undefined;
+};

package/src/client/core/execution_effects.js

@@ -1,22 +1,22 @@
-import { effect } from "@preact/signals"
+import { effect } from "@preact/signals";
 
 import {
   executionSignal,
   previousExecutionSignal,
-} from "./execution_signals.js"
-import { notifyExecutionResult } from "./execution_actions.js"
+} from "./execution_signals.js";
+import { notifyExecutionResult } from "./execution_actions.js";
 
 effect(() => {
-  const execution = executionSignal.value
+  const execution = executionSignal.value;
   if (execution) {
-    sessionStorage.setItem(window.location.href, JSON.stringify(execution))
+    sessionStorage.setItem(window.location.href, JSON.stringify(execution));
   }
-})
+});
 
 effect(() => {
-  const execution = executionSignal.value
-  const previousExecution = previousExecutionSignal.value
+  const execution = executionSignal.value;
+  const previousExecution = previousExecutionSignal.value;
   if (execution) {
-    notifyExecutionResult(execution, previousExecution)
+    notifyExecutionResult(execution, previousExecution);
   }
-})
+});

package/src/client/core/execution_signals.js

@@ -1,19 +1,19 @@
-import { signal } from "@preact/signals"
+import { signal } from "@preact/signals";
 
-export const executionTooltipOpenedSignal = signal(false)
+export const executionTooltipOpenedSignal = signal(false);
 
 export const executionSignal = signal({
   status: "running",
-})
+});
 
 export const previousExecutionSignal = signal(
   sessionStorage.hasOwnProperty(window.location.href)
     ? JSON.parse(sessionStorage.getItem(window.location.href))
     : null,
-)
+);
 
 window.parent.__supervisor__
   .getDocumentExecutionResult()
   .then(({ status, startTime, endTime }) => {
-    executionSignal.value = { status, startTime, endTime }
-  })
+    executionSignal.value = { status, startTime, endTime };
+  });

package/src/client/core/notification_actions.js

@@ -1,32 +1,32 @@
-import { notificationAPIDetected } from "./notification_context.js"
+import { notificationAPIDetected } from "./notification_context.js";
 import {
   notificationsEnabledSignal,
   notificationPermissionSignal,
-} from "./notification_signals.js"
+} from "./notification_signals.js";
 
 export const enableNotifications = () => {
-  notificationsEnabledSignal.value = true
-}
+  notificationsEnabledSignal.value = true;
+};
 
 export const disableNotifications = () => {
-  notificationsEnabledSignal.value = false
-}
+  notificationsEnabledSignal.value = false;
+};
 
-const arrayOfOpenedNotifications = []
+const arrayOfOpenedNotifications = [];
 export const notify = notificationAPIDetected
   ? async (
       title,
       { clickToFocus = false, clickToClose = false, ...options } = {},
     ) => {
-      const notificationsEnabled = notificationsEnabledSignal.value
+      const notificationsEnabled = notificationsEnabledSignal.value;
       if (!notificationsEnabled) {
-        return null
+        return null;
       }
       if (Notification.permission !== "granted") {
-        return null
+        return null;
       }
-      const notification = new Notification(title, options)
-      arrayOfOpenedNotifications.push(notification)
+      const notification = new Notification(title, options);
+      arrayOfOpenedNotifications.push(notification);
       notification.onclick = () => {
         // but if the user navigated inbetween
         // focusing window will show something else
@@ -36,36 +36,36 @@ export const notify = notificationAPIDetected
         // we could also navigauate to this file execution but
         // there is no guarantee re-executing the file would give same output
         // and it would also trigger an other notification
-        if (clickToFocus) window.focus()
-        if (clickToClose) notification.close()
-      }
+        if (clickToFocus) window.focus();
+        if (clickToClose) notification.close();
+      };
       notification.onclose = () => {
-        const index = arrayOfOpenedNotifications.indexOf(notification)
+        const index = arrayOfOpenedNotifications.indexOf(notification);
         if (index > -1) {
-          arrayOfOpenedNotifications.splice(index, 1)
+          arrayOfOpenedNotifications.splice(index, 1);
         }
-      }
-      return notification
+      };
+      return notification;
     }
-  : () => {}
+  : () => {};
 
 export const closeAllNotifications = () => {
   // slice because arrayOfOpenedNotifications can be mutated while looping
   arrayOfOpenedNotifications.slice().forEach((notification) => {
-    notification.close()
-  })
-}
+    notification.close();
+  });
+};
 
-let requestPromise
+let requestPromise;
 export const requestPermission = notificationAPIDetected
   ? async () => {
       if (requestPromise) {
-        await requestPromise
-        return
+        await requestPromise;
+        return;
       }
-      requestPromise = Notification.requestPermission()
-      await requestPromise
-      requestPromise = undefined
-      notificationPermissionSignal.value = Notification.permission
+      requestPromise = Notification.requestPermission();
+      await requestPromise;
+      requestPromise = undefined;
+      notificationPermissionSignal.value = Notification.permission;
     }
-  : () => Promise.resolve()
+  : () => Promise.resolve();

package/src/client/core/notification_context.js

@@ -1 +1,2 @@
-export const notificationAPIDetected = typeof window.Notification === "function"
+export const notificationAPIDetected =
+  typeof window.Notification === "function";

package/src/client/core/notification_effects.js

@@ -1,11 +1,11 @@
-import { effect } from "@preact/signals"
+import { effect } from "@preact/signals";
 
-import { notificationsEnabledSignal } from "./notification_signals.js"
-import { closeAllNotifications } from "./notification_actions.js"
+import { notificationsEnabledSignal } from "./notification_signals.js";
+import { closeAllNotifications } from "./notification_actions.js";
 
 effect(() => {
-  const notificationsEnabled = notificationsEnabledSignal.value
+  const notificationsEnabled = notificationsEnabledSignal.value;
   if (!notificationsEnabled) {
-    closeAllNotifications()
+    closeAllNotifications();
   }
-})
+});

package/src/client/core/notification_signals.js

@@ -1,7 +1,7 @@
-import { signal } from "@preact/signals"
+import { signal } from "@preact/signals";
 
-import { paramsFromParentWindow } from "./parent_window_context.js"
-import { stateFromLocalStorage } from "./toolbar_state_context.js"
+import { paramsFromParentWindow } from "./parent_window_context.js";
+import { stateFromLocalStorage } from "./toolbar_state_context.js";
 
 export const notificationsEnabledSignal = signal(
   typeof stateFromLocalStorage.notificationsEnabled === "boolean"
@@ -9,5 +9,5 @@ export const notificationsEnabledSignal = signal(
     : typeof paramsFromParentWindow.notificationsEnabled === "boolean"
     ? paramsFromParentWindow.notificationsEnabled
     : false,
-)
-export const notificationPermissionSignal = signal(Notification.permission)
+);
+export const notificationPermissionSignal = signal(Notification.permission);

package/src/client/core/parent_window_actions.js

@@ -1,4 +1,4 @@
-import { parentWindowReloader } from "./parent_window_context.js"
+import { parentWindowReloader } from "./parent_window_context.js";
 
 export const sendEventToParent = (name, data) => {
   window.parent.postMessage(
@@ -9,35 +9,35 @@ export const sendEventToParent = (name, data) => {
       },
     },
     "*",
-  )
-}
+  );
+};
 
 export const addExternalCommandCallback = (command, callback) => {
   const messageEventCallback = (messageEvent) => {
-    const { data } = messageEvent
+    const { data } = messageEvent;
     if (typeof data !== "object") {
-      return
+      return;
     }
-    const { __jsenv__ } = data
+    const { __jsenv__ } = data;
     if (!__jsenv__) {
-      return
+      return;
     }
     if (__jsenv__.command !== command) {
-      return
+      return;
     }
-    callback(...__jsenv__.args)
-  }
+    callback(...__jsenv__.args);
+  };
 
-  window.addEventListener("message", messageEventCallback)
+  window.addEventListener("message", messageEventCallback);
   return () => {
-    window.removeEventListener("message", messageEventCallback)
-  }
-}
+    window.removeEventListener("message", messageEventCallback);
+  };
+};
 
 export const enableAutoreload = () => {
-  parentWindowReloader.autoreload.enable()
-}
+  parentWindowReloader.autoreload.enable();
+};
 
 export const disableAutoreload = () => {
-  parentWindowReloader.autoreload.disable()
-}
+  parentWindowReloader.autoreload.disable();
+};

package/src/client/core/parent_window_context.js

@@ -1,7 +1,7 @@
-export const paramsFromParentWindow = {}
-const searchParams = new URLSearchParams(window.location.search)
+export const paramsFromParentWindow = {};
+const searchParams = new URLSearchParams(window.location.search);
 searchParams.forEach((value, key) => {
-  paramsFromParentWindow[key] = value === "" ? true : value
-})
+  paramsFromParentWindow[key] = value === "" ? true : value;
+});
 
-export const parentWindowReloader = window.parent.__reloader__
+export const parentWindowReloader = window.parent.__reloader__;