mouse: Add SVGSVGElement to allowed target types

solidjs-community · Sep 15, 2024 · 7e7888a · 7e7888a
1 parent b00b691
commit 7e7888a
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 7 deletions.
diff --git a/.changeset/wicked-colts-smile.md b/.changeset/wicked-colts-smile.md
@@ -0,0 +1,5 @@
+---
+"@solid-primitives/mouse": patch
+---
+
+Add `SVGSVGElement` to allowed target types.
diff --git a/packages/mouse/README.md b/packages/mouse/README.md
@@ -32,6 +32,8 @@ A collection of primitives, capturing current mouse cursor position, and helping
 ```bash
 npm install @solid-primitives/mouse
 # or
+pnpm add @solid-primitives/mouse
+# or
 yarn add @solid-primitives/mouse
 ```
 
@@ -84,7 +86,7 @@ createEffect(() => {
 
 ```ts
 function createMousePosition(
-  target?: MaybeAccessor<Window | Document | HTMLElement>,
+  target?: MaybeAccessor<SVGSVGElement | HTMLElement | Window | Document>,
   options?: MousePositionOptions,
 ): MousePositionInside;
 ```

diff --git a/packages/mouse/src/common.ts b/packages/mouse/src/common.ts
@@ -34,14 +34,14 @@ export const DEFAULT_RELATIVE_ELEMENT_POSITION: PositionRelativeToElement = {
  * Attaches event listeners to provided targat, listeneing for changes to the mouse/touch position.
  * @param target
  * ```ts
- * HTMLElement | Window | Document
+ * SVGSVGElement | HTMLElement | Window | Document
  * ```
  * @param callback function fired on every position change
  * @param options {@link UseTouchOptions} & {@link FollowTouchOptions}
  * @returns function removing all event listeners
  */
 export function makeMousePositionListener(
-  target: HTMLElement | Window | Document = window,
+  target: SVGSVGElement | HTMLElement | Window | Document = window,
   callback: (position: MousePosition) => void,
   options: UseTouchOptions & FollowTouchOptions = {},
 ): VoidFunction {
@@ -71,14 +71,14 @@ export function makeMousePositionListener(
  * Attaches event listeners to provided targat, listening for mouse/touch entering/leaving the element.
  * @param target
  * ```ts
- * HTMLElement | Window | Document
+ * SVGSVGElement | HTMLElement | Window | Document
  * ```
  * @param callback function fired on mouse leaving or entering the element
  * @param options {@link UseTouchOptions}
  * @returns function removing all event listeners
  */
 export function makeMouseInsideListener(
-  target: HTMLElement | Window | Document = window,
+  target: SVGSVGElement | HTMLElement | Window | Document = window,
   callback: (isInside: boolean) => void,
   options: UseTouchOptions = {},
 ): VoidFunction {

diff --git a/packages/mouse/src/primitives.ts b/packages/mouse/src/primitives.ts
@@ -50,7 +50,7 @@ export interface PositionToElementOptions extends UseTouchOptions, FollowTouchOp
  * })
  */
 export function createMousePosition(
-  target?: MaybeAccessor<Window | Document | HTMLElement>,
+  target?: MaybeAccessor<SVGSVGElement | HTMLElement | Window | Document>,
   options: MousePositionOptions = {},
 ): MousePositionInside {
   const fallback: MousePositionInside = {
@@ -64,7 +64,7 @@ export function createMousePosition(
 
   const [state, setState] = createStaticStore(fallback);
 
-  const attachListeners = (el: Window | Document | HTMLElement | undefined) => {
+  const attachListeners = (el: SVGSVGElement | HTMLElement | Window | Document | undefined) => {
     makeMousePositionListener(el, setState, options);
     makeMouseInsideListener(el, setState.bind(void 0, "isInside"), options);
   };