browser-extension-settings 0.0.5 → 0.0.7

package/lib/common.ts

@@ -1,3 +1,3 @@
-export const besVersion = 12
+export const besVersion = 13
 export const openButton = `<svg viewBox="0 0 60.2601318359375 84.8134765625" version="1.1" xmlns="http://www.w3.org/2000/svg" class=" glyph-box" style="height: 9.62969px; width: 6.84191px;"><g transform="matrix(1 0 0 1 -6.194965820312518 77.63671875)"><path d="M66.4551-35.2539C66.4551-36.4746 65.9668-37.5977 65.0391-38.4766L26.3672-76.3672C25.4883-77.1973 24.4141-77.6367 23.1445-77.6367C20.6543-77.6367 18.7012-75.7324 18.7012-73.1934C18.7012-71.9727 19.1895-70.8496 19.9707-70.0195L55.5176-35.2539L19.9707-0.488281C19.1895 0.341797 18.7012 1.41602 18.7012 2.68555C18.7012 5.22461 20.6543 7.12891 23.1445 7.12891C24.4141 7.12891 25.4883 6.68945 26.3672 5.81055L65.0391-32.0312C65.9668-32.959 66.4551-34.0332 66.4551-35.2539Z"></path></g></svg>`
 export const openInNewTabButton = `<svg viewBox="0 0 72.127685546875 72.2177734375" version="1.1" xmlns="http://www.w3.org/2000/svg" class=" glyph-box" style="height: 8.19958px; width: 8.18935px;"><g transform="matrix(1 0 0 1 -12.451127929687573 71.3388671875)"><path d="M84.5703-17.334L84.5215-66.4551C84.5215-69.2383 82.7148-71.1914 79.7852-71.1914L30.6641-71.1914C27.9297-71.1914 26.0742-69.0918 26.0742-66.748C26.0742-64.4043 28.1738-62.4023 30.4688-62.4023L47.4609-62.4023L71.2891-63.1836L62.207-55.2246L13.8184-6.73828C12.9395-5.85938 12.4512-4.73633 12.4512-3.66211C12.4512-1.31836 14.5508 0.878906 16.9922 0.878906C18.1152 0.878906 19.1895 0.488281 20.0684-0.439453L68.5547-48.877L76.6113-58.0078L75.7324-35.2051L75.7324-17.1387C75.7324-14.8438 77.7344-12.6953 80.127-12.6953C82.4707-12.6953 84.5703-14.6973 84.5703-17.334Z"></path></g></svg>`

package/lib/settings.ts

@@ -67,7 +67,7 @@ const settingsContainerId = prefix + "container_" + randomId
 const settingsElementId = prefix + "main_" + randomId
 const getSettingsElement = () => $("#" + settingsElementId)
 const getSettingsStyle: () => string = () =>
-  styleText
+  (styleText as string)
     .replace(/browser_extension_settings_container/gm, settingsContainerId)
     .replace(/browser_extension_settings_main/gm, settingsElementId)
 const storageKey = "settings"
@@ -103,45 +103,30 @@ const closeModal = () => {
     settingsContainer.style.display = "none"
   }
 
-  removeEventListener(document, "click", onDocumentClick)
-  removeEventListener(document, "keydown", onDocumentKeyDown)
+  removeEventListener(document, "click", onDocumentClick, true)
+  removeEventListener(document, "keydown", onDocumentKeyDown, true)
 }
 
-const onDocumentClick = (event) => {
-  let target = event.target as HTMLElement
-  const settingsContainer = getSettingsContainer()
-  if (settingsContainer) {
-    while (target !== settingsContainer && target) {
-      target = target.parentNode as HTMLElement
-    }
-
-    if (target === settingsContainer) {
-      return
-    }
+const onDocumentClick = (event: Event) => {
+  const target = event.target as HTMLElement
+  if (target?.closest(`.${prefix}container`)) {
+    return
   }
 
   closeModal()
 }
 
-const onDocumentKeyDown = (event) => {
+const onDocumentKeyDown = (event: KeyboardEvent) => {
   if (event.defaultPrevented) {
     return // 如果事件已经在进行中，则不做任何事。
   }
 
-  switch (event.key) {
-    case "Escape": {
-      // 按“ESC”键时要做的事。
-      closeModal()
-      break
-    }
-
-    default: {
-      return
-    } // 什么都没按就退出吧。
+  if (event.key === "Escape") {
+    // 按“ESC”键时要做的事。
+    closeModal()
+    // 取消默认动作，从而避免处理两次。
+    event.preventDefault()
   }
-
-  // 取消默认动作，从而避免处理两次。
-  event.preventDefault()
 }
 
 async function updateOptions() {
@@ -192,13 +177,15 @@ function getSettingsContainer() {
     id: settingsContainerId,
     class: `${prefix}container`,
     "data-bes-version": besVersion,
+    style: "display: none;",
   })
 }
 
 function getSettingsWrapper() {
+  const container = getSettingsContainer()
   return (
-    $(`.${prefix}container .${prefix}wrapper`) ||
-    addElement(getSettingsContainer(), "div", {
+    $(`.${prefix}wrapper`, container) ||
+    addElement(container, "div", {
       class: `${prefix}wrapper`,
     })
   )
@@ -255,8 +242,10 @@ function createSettingsElement() {
         const item = settingsTable[key]
         if (!item.type || item.type === "switch") {
           const switchOption = createSwitchOption(item.title, {
-            async onchange(event) {
-              await saveSattingsValue(key, event.target.checked)
+            async onchange(event: Event) {
+              if (event.target) {
+                await saveSattingsValue(key, event.target.checked)
+              }
             },
           })
 
@@ -270,21 +259,24 @@ function createSettingsElement() {
     const options2 = addElement(settingsMain, "div", {
       class: "option_groups",
     })
-    let timeoutId
+    let timeoutId: number | undefined
     addElement(options2, "textarea", {
       placeholder: `/* Custom rules for internal URLs, matching URLs will be opened in new tabs */`,
-      onkeyup(event) {
+      onkeyup(event: Event) {
+        const textArea = event.target as HTMLTextAreaElement
         if (timeoutId) {
           clearTimeout(timeoutId)
-          timeoutId = null
+          timeoutId = undefined
         }
 
         timeoutId = setTimeout(async () => {
           const host = location.host
-          await saveSattingsValue(
-            `customRulesForCurrentSite_${host}`,
-            event.target.value.trim()
-          )
+          if (textArea) {
+            await saveSattingsValue(
+              `customRulesForCurrentSite_${host}`,
+              textArea.value.trim()
+            )
+          }
         }, 100)
       },
     })
@@ -369,8 +361,8 @@ export async function showSettings() {
   await updateOptions()
   settingsContainer.style.display = "block"
 
-  addEventListener(document, "click", onDocumentClick)
-  addEventListener(document, "keydown", onDocumentKeyDown)
+  addEventListener(document, "click", onDocumentClick, true)
+  addEventListener(document, "keydown", onDocumentKeyDown, true)
   activeExtension(settingsOptions.id)
   deactiveExtensionList()
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "browser-extension-settings",
-  "version": "0.0.5",
+  "version": "0.0.7",
   "description": "Settings module for developing browser extensions and userscripts",
   "type": "module",
   "main": "./lib/index.ts",