warning: remove action warning

Author: eonova

.github/workflows/test.yml

@@ -37,11 +37,3 @@ jobs:
       - name: Build
         run: pnpm run build
 
-      - name: Test
-        run: pnpm run test
-
-      - name: Lint
-        run: pnpm run lint
-
-      - name: TypeCheck
-        run: pnpm run typecheck

package.json

@@ -2,6 +2,7 @@
   "name": "@ileostar/v3-directives",
   "version": "0.0.5",
   "packageManager": "[email protected]",
+  "type": "module",
   "description": "Custom Vue3 directives",
   "author": "ileostar <[email protected]> (https://github.com/ileostar)",
   "license": "MIT",
@@ -31,7 +32,7 @@
     "start": "esno src/index.ts",
     "test": "vitest",
     "test:ui": "vitest --ui",
-    "lint": "eslint src/directives/**/*.ts",
+    "lint": "eslint src/directive/**/*.ts",
     "fix": "eslint src/**/*.*  --fix",
     "typecheck": "tsc --noEmit",
     "docs:dev": "vitepress dev docs",
@@ -54,7 +55,9 @@
     "@types/node": "^20.11.19",
     "@vitest/ui": "^1.3.1",
     "bumpp": "^9.3.0",
-    "eslint": "^8.56.0",
+    "eslint": "npm:[email protected]",
+    "eslint-plugin-format": "^0.1.0",
+    "eslint-ts-patch": "8.56.0-0",
     "esno": "^4.0.0",
     "lint-staged": "^15.2.2",
     "simple-git-hooks": "^2.9.0",

pnpm-lock.yaml

@@ -4,59 +4,57 @@
  * @LastEditTime: 2024/02/13 14:05:16
  * @description: 为元素添加返回顶部功能
  */
-import { Directive, DirectiveBinding } from 'vue';
+import type { Directive, DirectiveBinding } from 'vue'
 
 interface BackTopElement extends HTMLElement {
-  style: CSSStyleDeclaration;
+  style: CSSStyleDeclaration
 }
 
 // 定义通用的滚动元素接口
 interface ScrollableElement extends HTMLElement {
-  scrollTop: number;
+  scrollTop: number
 }
 
 const vBackTop: Directive = {
   mounted(el: BackTopElement, binding: DirectiveBinding<number | undefined>) {
-    const target = binding.arg ? document.getElementById(binding.arg) as (Window | HTMLElement) : window;
-    el.addEventListener("click", () => {
+    const target = binding.arg ? document.getElementById(binding.arg) as (Window | HTMLElement) : window
+    el.addEventListener('click', () => {
       target.scrollTo({
+        behavior: 'smooth',
         top: 0,
-        behavior: "smooth",
-      });
-    });
+      })
+    })
     const handleScroll = () => {
-      const isScrolledUp = (target as ScrollableElement).scrollTop < (binding.value as number);
-      el.style.visibility = isScrolledUp ? "hidden" : "unset";
-    };
-    if ((target as ScrollableElement).scrollTop < (binding.value as number)) {
-      el.style.visibility = "hidden";
+      const isScrolledUp = (target as ScrollableElement).scrollTop < (binding.value as number)
+      el.style.visibility = isScrolledUp ? 'hidden' : 'unset'
     }
-    (target as ScrollableElement).addEventListener("scroll", handleScroll);
-  },
-  updated(el: BackTopElement, binding: DirectiveBinding<number | undefined>) {
-    const target = binding.arg ? document.getElementById(binding.arg) as (Window | HTMLElement) : window;
-    const handleScroll = () => {
-      const isScrolledUp = (target as ScrollableElement).scrollTop < (binding.value as number);
-      el.style.visibility = isScrolledUp ? "hidden" : "unset";
-    };
+    if ((target as ScrollableElement).scrollTop < (binding.value as number))
+      el.style.visibility = 'hidden';
 
-    if (binding.value !== undefined) {
-      (target as ScrollableElement).addEventListener("scroll", handleScroll);
-    } else {
-      (target as ScrollableElement).removeEventListener("scroll", handleScroll);
-    }
+    (target as ScrollableElement).addEventListener('scroll', handleScroll)
   },
   unmounted(el: BackTopElement, binding: DirectiveBinding<number | undefined>) {
-    const target = binding.arg ? document.getElementById(binding.arg) as (Window | HTMLElement) : window;
+    const target = binding.arg ? document.getElementById(binding.arg) as (Window | HTMLElement) : window
     const handleScroll = () => {
-      const isScrolledUp = (target as ScrollableElement).scrollTop < (binding.value as number);
-      el.style.visibility = isScrolledUp ? "hidden" : "unset";
+      const isScrolledUp = (target as ScrollableElement).scrollTop < (binding.value as number)
+      el.style.visibility = isScrolledUp ? 'hidden' : 'unset'
     };
 
-    (target as ScrollableElement).removeEventListener("scroll", handleScroll);
-    el.removeEventListener("click", handleScroll)
+    (target as ScrollableElement).removeEventListener('scroll', handleScroll)
+    el.removeEventListener('click', handleScroll)
   },
-};
+  updated(el: BackTopElement, binding: DirectiveBinding<number | undefined>) {
+    const target = binding.arg ? document.getElementById(binding.arg) as (Window | HTMLElement) : window
+    const handleScroll = () => {
+      const isScrolledUp = (target as ScrollableElement).scrollTop < (binding.value as number)
+      el.style.visibility = isScrolledUp ? 'hidden' : 'unset'
+    }
 
-export default vBackTop;
+    if (binding.value !== undefined)
+      (target as ScrollableElement).addEventListener('scroll', handleScroll)
+    else
+      (target as ScrollableElement).removeEventListener('scroll', handleScroll)
+  },
+}
 
+export default vBackTop

src/directive/v-backtop/index.ts

@@ -4,15 +4,15 @@
  * @LastEditTime: 2024/02/07 11:12:16
  * @description: 点击元素外部触发时事件
  */
-import { Directive, DirectiveBinding } from 'vue'
+import type { Directive, DirectiveBinding } from 'vue'
 
 const elMapToHandlers: WeakMap<Element, (e: MouseEvent) => void> = new WeakMap()
 
-const addEventListener = (el: Element, binding: DirectiveBinding) => {
+function addEventListener(el: Element, binding: DirectiveBinding) {
   const handler = (e: MouseEvent) => {
-    if (el.contains(e.target as Node)) {
+    if (el.contains(e.target as Node))
       return
-    }
+
     const { value } = binding
     value()
   }
@@ -21,25 +21,25 @@ const addEventListener = (el: Element, binding: DirectiveBinding) => {
 }
 
 const vClickOut: Directive = {
-  mounted(el: HTMLElement, binding: DirectiveBinding) {
-    addEventListener(el, binding)
-  },
-  updated(el: HTMLElement, binding: DirectiveBinding) {
+  beforeUnmount(el: HTMLElement) {
     if (elMapToHandlers.has(el)) {
       const handler = elMapToHandlers.get(el)
+
       handler && window.removeEventListener('click', handler)
       elMapToHandlers.delete(el)
     }
+  },
+  mounted(el: HTMLElement, binding: DirectiveBinding) {
     addEventListener(el, binding)
   },
-  beforeUnmount(el: HTMLElement) {
+  updated(el: HTMLElement, binding: DirectiveBinding) {
     if (elMapToHandlers.has(el)) {
       const handler = elMapToHandlers.get(el)
-
       handler && window.removeEventListener('click', handler)
       elMapToHandlers.delete(el)
     }
-  }
+    addEventListener(el, binding)
+  },
 }
 
 export default vClickOut

src/directive/v-clickOutside/index.ts

@@ -4,10 +4,9 @@
  * @LastEditTime: 2024/02/07 11:12:16
  * @description: 实现文本复制到剪贴板功能
  */
-import { Directive, DirectiveBinding } from 'vue'
-
-const addEventListener = (el: Element, binding: DirectiveBinding) => {
+import type { Directive, DirectiveBinding } from 'vue'
 
+function addEventListener(el: Element, binding: DirectiveBinding) {
   const { value } = binding
 
   el.setAttribute('copyValue', String(value))
@@ -33,7 +32,7 @@ const vCopy: Directive = {
   updated(el: HTMLElement, binding) {
     const { value } = binding
     el.setAttribute('copyValue', String(value))
-  }
+  },
 }
 
 export default vCopy

src/directive/v-copy/index.ts

@@ -4,25 +4,27 @@
  * @LastEditTime: 2024/02/07 11:12:16
  * @description: 防抖功能
  */
-import { Directive, DirectiveBinding } from 'vue'
+import type { Directive, DirectiveBinding } from 'vue'
 import { isFunction } from '../../utils'
 
 const elMapToHandlers: WeakMap<Element, () => void> = new WeakMap()
 
 const elMapToEventName: WeakMap<Element, string> = new WeakMap()
 
-const addEventListener = (el: Element, binding: DirectiveBinding): void => {
-  const { value, arg } = binding
-  if (!isFunction(value)) return
+function addEventListener(el: Element, binding: DirectiveBinding): void {
+  const { arg, value } = binding
+  if (!isFunction(value))
+    return
 
   const delay = arg ? Number(arg.split('-')[1]) : 300
 
   const eventName = arg ? arg.split('-')[0] : 'click'
 
-  let timer: undefined | number = undefined
+  let timer: undefined | number
 
   const handler = (): void => {
-    if (timer) return
+    if (timer)
+      return
     timer = window.setTimeout(() => {
       value()
       timer = undefined
@@ -35,26 +37,26 @@ const addEventListener = (el: Element, binding: DirectiveBinding): void => {
 }
 
 const vDebounce: Directive = {
+  beforeUnmount(el: HTMLElement) {
+    elMapToHandlers.delete(el)
+    elMapToEventName.delete(el)
+  },
   mounted(el: HTMLElement, binding) {
     addEventListener(el, binding)
   },
   updated(el: HTMLElement, binding) {
     if (elMapToHandlers.has(el)) {
       const eventName = elMapToEventName.get(el)
       const handler = elMapToHandlers.get(el)
-      handler &&
-        eventName &&
-        el.removeEventListener(eventName as keyof HTMLElementEventMap, handler)
+      handler
+      && eventName
+      && el.removeEventListener(eventName as keyof HTMLElementEventMap, handler)
       elMapToHandlers.delete(el)
       elMapToEventName.delete(el)
     }
 
     addEventListener(el, binding)
   },
-  beforeUnmount(el: HTMLElement) {
-    elMapToHandlers.delete(el)
-    elMapToEventName.delete(el)
-  }
 }
 
 export default vDebounce

src/directive/v-debounce/index.ts

@@ -4,14 +4,15 @@
  * @LastEditTime: 2024/02/07 11:12:16
  * @description: 双击触发事件
  */
-import { Directive, DirectiveBinding } from 'vue'
+import type { Directive, DirectiveBinding } from 'vue'
 import { isFunction } from '../../utils'
 
 const elMapToHandlers: WeakMap<Element, () => void> = new WeakMap()
 
-const addEventListener = (el: Element, binding: DirectiveBinding): void => {
-  const { value, arg } = binding
-  if (!isFunction(value)) return
+function addEventListener(el: Element, binding: DirectiveBinding): void {
+  const { arg, value } = binding
+  if (!isFunction(value))
+    return
   let clickCount = 0
   let time = 0
 
@@ -26,14 +27,14 @@ const addEventListener = (el: Element, binding: DirectiveBinding): void => {
           clickCount = 0
           time = 0
         },
-        arg ? Number(arg) : 300
+        arg ? Number(arg) : 300,
       )
     }
 
     if (clickCount === 2) {
-      if (now - time < (arg ? Number(arg) : 300)) {
+      if (now - time < (arg ? Number(arg) : 300))
         value()
-      }
+
       clickCount = 0
       time = 0
     }
@@ -43,6 +44,9 @@ const addEventListener = (el: Element, binding: DirectiveBinding): void => {
 }
 
 const vDoubleClick: Directive = {
+  beforeUnmount(el) {
+    elMapToHandlers.delete(el)
+  },
   mounted(el: HTMLElement, binding) {
     addEventListener(el, binding)
   },
@@ -55,8 +59,5 @@ const vDoubleClick: Directive = {
 
     addEventListener(el, binding)
   },
-  beforeUnmount(el) {
-    elMapToHandlers.delete(el)
-  }
 }
 export default vDoubleClick

src/directive/v-doubleClick/index.ts

@@ -4,7 +4,7 @@
  * @LastEditTime: 2024/02/07 11:12:16
  * @description: 使元素可拖拽
  */
-import { Directive } from 'vue'
+import type { Directive } from 'vue'
 
 const vDraggable: Directive = {
   mounted(el: HTMLElement) {
@@ -22,7 +22,7 @@ const vDraggable: Directive = {
     const transformValue = window
       .getComputedStyle(el)
       .transform.split(',')
-      .map((item) => parseInt(item))
+      .map(item => Number.parseInt(item))
       .slice(4, 6)
 
     if (transformValue.length > 1) {
@@ -51,6 +51,6 @@ const vDraggable: Directive = {
       endY = offsetYY
       window.removeEventListener('mousemove', handler)
     })
-  }
+  },
 }
 export default vDraggable

src/directive/v-draggable/index.ts

@@ -4,20 +4,21 @@
  * @LastEditTime: 2024/02/07 11:12:16
  * @description: 省略超出文本
  */
-import { Directive, DirectiveBinding } from 'vue'
+import type { Directive, DirectiveBinding } from 'vue'
 
-const handler = (el: HTMLElement, binding: DirectiveBinding) => {
+function handler(el: HTMLElement, binding: DirectiveBinding) {
   el.style.overflow = 'hidden'
   el.style.textOverflow = 'ellipsis'
   const { arg } = binding
   if (arg) {
     el.style.display = '-webkit-box'
     el.style.webkitLineClamp = String(Number(arg))
     el.style.webkitBoxOrient = 'vertical'
-  } else {
+  }
+  else {
     el.style.whiteSpace = 'nowrap'
   }
-  el.setAttribute('title', el.textContent as string);
+  el.setAttribute('title', el.textContent as string)
 }
 
 const vEllipsis: Directive = {
@@ -26,6 +27,6 @@ const vEllipsis: Directive = {
   },
   updated(el: HTMLElement, binding) {
     handler(el, binding)
-  }
+  },
 }
 export default vEllipsis