@pyreon/hooks 0.11.4 → 0.11.6

package/src/__tests__/useMediaQuery.test.ts

@@ -1,9 +1,9 @@
-import { beforeEach, describe, expect, it, vi } from "vitest"
+import { beforeEach, describe, expect, it, vi } from 'vitest'
 
 let mountCallbacks: Array<() => unknown> = []
 let unmountCallbacks: Array<() => void> = []
 
-vi.mock("@pyreon/core", () => ({
+vi.mock('@pyreon/core', () => ({
   onMount: (fn: () => unknown) => {
     mountCallbacks.push(fn)
   },
@@ -12,9 +12,9 @@ vi.mock("@pyreon/core", () => ({
   },
 }))
 
-import { useMediaQuery } from "../useMediaQuery"
+import { useMediaQuery } from '../useMediaQuery'
 
-describe("useMediaQuery", () => {
+describe('useMediaQuery', () => {
   let listeners: Map<string, (e: MediaQueryListEvent) => void>
   let matchMediaMock: ReturnType<typeof vi.fn>
 
@@ -28,10 +28,10 @@ describe("useMediaQuery", () => {
         matches: false,
         media: query,
         addEventListener: vi.fn((event: string, cb: (e: MediaQueryListEvent) => void) => {
-          if (event === "change") listeners.set(query, cb)
+          if (event === 'change') listeners.set(query, cb)
         }),
         removeEventListener: vi.fn((event: string) => {
-          if (event === "change") listeners.delete(query)
+          if (event === 'change') listeners.delete(query)
         }),
         dispatchEvent: vi.fn(),
         onchange: null,
@@ -41,66 +41,66 @@ describe("useMediaQuery", () => {
       return mql
     })
 
-    Object.defineProperty(window, "matchMedia", {
+    Object.defineProperty(window, 'matchMedia', {
       writable: true,
       value: matchMediaMock,
     })
   })
 
-  it("returns false initially before mount", () => {
-    const matches = useMediaQuery("(min-width: 768px)")
+  it('returns false initially before mount', () => {
+    const matches = useMediaQuery('(min-width: 768px)')
     expect(matches()).toBe(false)
   })
 
-  it("returns the current match state after mount", () => {
+  it('returns the current match state after mount', () => {
     matchMediaMock.mockReturnValue({
       matches: true,
-      media: "(min-width: 768px)",
+      media: '(min-width: 768px)',
       addEventListener: vi.fn(),
       removeEventListener: vi.fn(),
     })
 
-    const matches = useMediaQuery("(min-width: 768px)")
+    const matches = useMediaQuery('(min-width: 768px)')
     mountCallbacks.forEach((cb) => {
       cb()
     })
     expect(matches()).toBe(true)
   })
 
-  it("updates when media query changes", () => {
+  it('updates when media query changes', () => {
     const mql = {
       matches: false,
-      media: "(min-width: 768px)",
+      media: '(min-width: 768px)',
       addEventListener: vi.fn((event: string, cb: (e: MediaQueryListEvent) => void) => {
-        if (event === "change") listeners.set("(min-width: 768px)", cb)
+        if (event === 'change') listeners.set('(min-width: 768px)', cb)
       }),
       removeEventListener: vi.fn(),
     }
     matchMediaMock.mockReturnValue(mql)
 
-    const matches = useMediaQuery("(min-width: 768px)")
+    const matches = useMediaQuery('(min-width: 768px)')
     mountCallbacks.forEach((cb) => {
       cb()
     })
     expect(matches()).toBe(false)
 
     // Simulate media query change
-    const changeListener = listeners.get("(min-width: 768px)")
+    const changeListener = listeners.get('(min-width: 768px)')
     changeListener?.({ matches: true } as MediaQueryListEvent)
     expect(matches()).toBe(true)
   })
 
-  it("removes listener on unmount", () => {
+  it('removes listener on unmount', () => {
     const removeEventListenerSpy = vi.fn()
     const mql = {
       matches: false,
-      media: "(min-width: 768px)",
+      media: '(min-width: 768px)',
       addEventListener: vi.fn(),
       removeEventListener: removeEventListenerSpy,
     }
     matchMediaMock.mockReturnValue(mql)
 
-    useMediaQuery("(min-width: 768px)")
+    useMediaQuery('(min-width: 768px)')
     mountCallbacks.forEach((cb) => {
       cb()
     })
@@ -108,35 +108,35 @@ describe("useMediaQuery", () => {
       cb()
     })
 
-    expect(removeEventListenerSpy).toHaveBeenCalledWith("change", expect.any(Function))
+    expect(removeEventListenerSpy).toHaveBeenCalledWith('change', expect.any(Function))
   })
 
-  it("passes the correct query string to matchMedia", () => {
-    useMediaQuery("(prefers-color-scheme: dark)")
+  it('passes the correct query string to matchMedia', () => {
+    useMediaQuery('(prefers-color-scheme: dark)')
     mountCallbacks.forEach((cb) => {
       cb()
     })
-    expect(matchMediaMock).toHaveBeenCalledWith("(prefers-color-scheme: dark)")
+    expect(matchMediaMock).toHaveBeenCalledWith('(prefers-color-scheme: dark)')
   })
 
-  it("updates from true to false on change", () => {
+  it('updates from true to false on change', () => {
     const mql = {
       matches: true,
-      media: "(min-width: 768px)",
+      media: '(min-width: 768px)',
       addEventListener: vi.fn((event: string, cb: (e: MediaQueryListEvent) => void) => {
-        if (event === "change") listeners.set("q", cb)
+        if (event === 'change') listeners.set('q', cb)
       }),
       removeEventListener: vi.fn(),
     }
     matchMediaMock.mockReturnValue(mql)
 
-    const matches = useMediaQuery("(min-width: 768px)")
+    const matches = useMediaQuery('(min-width: 768px)')
     mountCallbacks.forEach((cb) => {
       cb()
     })
     expect(matches()).toBe(true)
 
-    const changeListener = listeners.get("q")
+    const changeListener = listeners.get('q')
     changeListener?.({ matches: false } as MediaQueryListEvent)
     expect(matches()).toBe(false)
   })

package/src/__tests__/useMergedRef.test.ts

@@ -1,44 +1,44 @@
-import { describe, expect, it, vi } from "vitest"
-import { useMergedRef } from "../useMergedRef"
+import { describe, expect, it, vi } from 'vitest'
+import { useMergedRef } from '../useMergedRef'
 
-describe("useMergedRef", () => {
-  it("sets object refs", () => {
+describe('useMergedRef', () => {
+  it('sets object refs', () => {
     const ref1 = { current: null as HTMLDivElement | null }
     const ref2 = { current: null as HTMLDivElement | null }
 
     const merged = useMergedRef(ref1, ref2)
 
-    const node = document.createElement("div")
+    const node = document.createElement('div')
     merged(node)
 
     expect(ref1.current).toBe(node)
     expect(ref2.current).toBe(node)
   })
 
-  it("calls callback refs", () => {
+  it('calls callback refs', () => {
     const cb = vi.fn()
     const objRef = { current: null as HTMLDivElement | null }
 
     const merged = useMergedRef(cb, objRef)
 
-    const node = document.createElement("div")
+    const node = document.createElement('div')
     merged(node)
 
     expect(cb).toHaveBeenCalledWith(node)
     expect(objRef.current).toBe(node)
   })
 
-  it("skips undefined refs", () => {
+  it('skips undefined refs', () => {
     const ref = { current: null as HTMLDivElement | null }
     const merged = useMergedRef(undefined, ref)
 
-    const node = document.createElement("div")
+    const node = document.createElement('div')
     merged(node)
 
     expect(ref.current).toBe(node)
   })
 
-  it("handles null node (unmount)", () => {
+  it('handles null node (unmount)', () => {
     const cb = vi.fn()
     const merged = useMergedRef(cb)
 

package/src/__tests__/usePrevious.test.ts

@@ -1,15 +1,15 @@
-import { signal } from "@pyreon/reactivity"
-import { describe, expect, it } from "vitest"
-import { usePrevious } from "../usePrevious"
+import { signal } from '@pyreon/reactivity'
+import { describe, expect, it } from 'vitest'
+import { usePrevious } from '../usePrevious'
 
-describe("usePrevious", () => {
-  it("returns undefined initially", () => {
+describe('usePrevious', () => {
+  it('returns undefined initially', () => {
     const source = signal(1)
     const prev = usePrevious(source)
     expect(prev()).toBeUndefined()
   })
 
-  it("returns the previous value after source changes", () => {
+  it('returns the previous value after source changes', () => {
     const source = signal(1)
     const prev = usePrevious(source)
     expect(prev()).toBeUndefined()
@@ -18,22 +18,22 @@ describe("usePrevious", () => {
     expect(prev()).toBe(1)
   })
 
-  it("tracks multiple changes", () => {
-    const source = signal("a")
+  it('tracks multiple changes', () => {
+    const source = signal('a')
     const prev = usePrevious(source)
     expect(prev()).toBeUndefined()
 
-    source.set("b")
-    expect(prev()).toBe("a")
+    source.set('b')
+    expect(prev()).toBe('a')
 
-    source.set("c")
-    expect(prev()).toBe("b")
+    source.set('c')
+    expect(prev()).toBe('b')
 
-    source.set("d")
-    expect(prev()).toBe("c")
+    source.set('d')
+    expect(prev()).toBe('c')
   })
 
-  it("works with number values", () => {
+  it('works with number values', () => {
     const source = signal(10)
     const prev = usePrevious(source)
     expect(prev()).toBeUndefined()
@@ -45,7 +45,7 @@ describe("usePrevious", () => {
     expect(prev()).toBe(20)
   })
 
-  it("works with object values", () => {
+  it('works with object values', () => {
     const obj1 = { x: 1 }
     const obj2 = { x: 2 }
     const source = signal(obj1)
@@ -56,15 +56,15 @@ describe("usePrevious", () => {
     expect(prev()).toBe(obj1)
   })
 
-  it("works with null values", () => {
-    const source = signal<string | null>("hello")
+  it('works with null values', () => {
+    const source = signal<string | null>('hello')
     const prev = usePrevious(source)
     expect(prev()).toBeUndefined()
 
     source.set(null)
-    expect(prev()).toBe("hello")
+    expect(prev()).toBe('hello')
 
-    source.set("world")
+    source.set('world')
     expect(prev()).toBeNull()
   })
 })

package/src/__tests__/useReducedMotion.test.ts

@@ -1,9 +1,9 @@
-import { beforeEach, describe, expect, it, vi } from "vitest"
+import { beforeEach, describe, expect, it, vi } from 'vitest'
 
 let mountCallbacks: Array<() => unknown> = []
 let unmountCallbacks: Array<() => void> = []
 
-vi.mock("@pyreon/core", () => ({
+vi.mock('@pyreon/core', () => ({
   onMount: (fn: () => unknown) => {
     mountCallbacks.push(fn)
   },
@@ -12,9 +12,9 @@ vi.mock("@pyreon/core", () => ({
   },
 }))
 
-import { useReducedMotion } from "../useReducedMotion"
+import { useReducedMotion } from '../useReducedMotion'
 
-describe("useReducedMotion", () => {
+describe('useReducedMotion', () => {
   let changeListeners: Map<string, (e: MediaQueryListEvent) => void>
 
   beforeEach(() => {
@@ -22,20 +22,20 @@ describe("useReducedMotion", () => {
     unmountCallbacks = []
     changeListeners = new Map()
 
-    Object.defineProperty(window, "matchMedia", {
+    Object.defineProperty(window, 'matchMedia', {
       writable: true,
       value: vi.fn((query: string) => ({
         matches: false,
         media: query,
         addEventListener: vi.fn((event: string, cb: (e: MediaQueryListEvent) => void) => {
-          if (event === "change") changeListeners.set(query, cb)
+          if (event === 'change') changeListeners.set(query, cb)
         }),
         removeEventListener: vi.fn(),
       })),
     })
   })
 
-  it("returns false when no motion preference", () => {
+  it('returns false when no motion preference', () => {
     const reduced = useReducedMotion()
     mountCallbacks.forEach((cb) => {
       cb()
@@ -43,14 +43,14 @@ describe("useReducedMotion", () => {
     expect(reduced()).toBe(false)
   })
 
-  it("returns true when reduced motion is preferred", () => {
-    Object.defineProperty(window, "matchMedia", {
+  it('returns true when reduced motion is preferred', () => {
+    Object.defineProperty(window, 'matchMedia', {
       writable: true,
       value: vi.fn((query: string) => ({
         matches: true,
         media: query,
         addEventListener: vi.fn((event: string, cb: (e: MediaQueryListEvent) => void) => {
-          if (event === "change") changeListeners.set(query, cb)
+          if (event === 'change') changeListeners.set(query, cb)
         }),
         removeEventListener: vi.fn(),
       })),
@@ -63,26 +63,26 @@ describe("useReducedMotion", () => {
     expect(reduced()).toBe(true)
   })
 
-  it("updates when preference changes", () => {
+  it('updates when preference changes', () => {
     const reduced = useReducedMotion()
     mountCallbacks.forEach((cb) => {
       cb()
     })
     expect(reduced()).toBe(false)
 
-    const listener = changeListeners.get("(prefers-reduced-motion: reduce)")
+    const listener = changeListeners.get('(prefers-reduced-motion: reduce)')
     listener?.({ matches: true } as MediaQueryListEvent)
     expect(reduced()).toBe(true)
   })
 
-  it("queries the correct media string", () => {
+  it('queries the correct media string', () => {
     const matchMediaSpy = vi.fn((query: string) => ({
       matches: false,
       media: query,
       addEventListener: vi.fn(),
       removeEventListener: vi.fn(),
     }))
-    Object.defineProperty(window, "matchMedia", {
+    Object.defineProperty(window, 'matchMedia', {
       writable: true,
       value: matchMediaSpy,
     })
@@ -91,6 +91,6 @@ describe("useReducedMotion", () => {
     mountCallbacks.forEach((cb) => {
       cb()
     })
-    expect(matchMediaSpy).toHaveBeenCalledWith("(prefers-reduced-motion: reduce)")
+    expect(matchMediaSpy).toHaveBeenCalledWith('(prefers-reduced-motion: reduce)')
   })
 })

package/src/__tests__/useRootSize.test.ts

@@ -1,25 +1,25 @@
-import { describe, expect, it, vi } from "vitest"
+import { describe, expect, it, vi } from 'vitest'
 
 // Mock @pyreon/styler to provide theme values
-vi.mock("@pyreon/styler", () => ({
+vi.mock('@pyreon/styler', () => ({
   useTheme: () => ({}),
 }))
 
-import { useRootSize } from "../useRootSize"
+import { useRootSize } from '../useRootSize'
 
-describe("useRootSize", () => {
-  it("defaults rootSize to 16", () => {
+describe('useRootSize', () => {
+  it('defaults rootSize to 16', () => {
     const result = useRootSize()
     expect(result.rootSize).toBe(16)
   })
 
-  it("pxToRem converts correctly with default rootSize", () => {
+  it('pxToRem converts correctly with default rootSize', () => {
     const result = useRootSize()
-    expect(result.pxToRem(32)).toBe("2rem")
-    expect(result.pxToRem(8)).toBe("0.5rem")
+    expect(result.pxToRem(32)).toBe('2rem')
+    expect(result.pxToRem(8)).toBe('0.5rem')
   })
 
-  it("remToPx converts correctly with default rootSize", () => {
+  it('remToPx converts correctly with default rootSize', () => {
     const result = useRootSize()
     expect(result.remToPx(2)).toBe(32)
     expect(result.remToPx(0.5)).toBe(8)

package/src/__tests__/useScrollLock.test.ts

@@ -1,6 +1,6 @@
-import { afterEach, beforeEach, describe, expect, it, vi } from "vitest"
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 
-vi.mock("@pyreon/core", () => ({
+vi.mock('@pyreon/core', () => ({
   onMount: (_fn: () => unknown) => {
     /* no-op */
   },
@@ -9,19 +9,19 @@ vi.mock("@pyreon/core", () => ({
   },
 }))
 
-describe("useScrollLock", () => {
+describe('useScrollLock', () => {
   beforeEach(async () => {
     vi.resetModules()
-    document.body.style.overflow = ""
+    document.body.style.overflow = ''
   })
 
   afterEach(() => {
-    document.body.style.overflow = ""
+    document.body.style.overflow = ''
   })
 
   async function getUseScrollLock() {
     // Re-mock after resetModules
-    vi.doMock("@pyreon/core", () => ({
+    vi.doMock('@pyreon/core', () => ({
       onMount: (_fn: () => unknown) => {
         /* no-op */
       },
@@ -29,76 +29,76 @@ describe("useScrollLock", () => {
         /* no-op */
       },
     }))
-    const mod = await import("../useScrollLock")
+    const mod = await import('../useScrollLock')
     return mod.useScrollLock
   }
 
-  it("sets overflow to hidden when locked", async () => {
+  it('sets overflow to hidden when locked', async () => {
     const useScrollLock = await getUseScrollLock()
     const { lock } = useScrollLock()
     lock()
-    expect(document.body.style.overflow).toBe("hidden")
+    expect(document.body.style.overflow).toBe('hidden')
   })
 
-  it("does not change overflow until lock is called", async () => {
+  it('does not change overflow until lock is called', async () => {
     const useScrollLock = await getUseScrollLock()
-    document.body.style.overflow = "auto"
+    document.body.style.overflow = 'auto'
     useScrollLock()
-    expect(document.body.style.overflow).toBe("auto")
+    expect(document.body.style.overflow).toBe('auto')
   })
 
-  it("restores overflow when unlocked", async () => {
+  it('restores overflow when unlocked', async () => {
     const useScrollLock = await getUseScrollLock()
-    document.body.style.overflow = "auto"
+    document.body.style.overflow = 'auto'
     const { lock, unlock } = useScrollLock()
     lock()
-    expect(document.body.style.overflow).toBe("hidden")
+    expect(document.body.style.overflow).toBe('hidden')
     unlock()
-    expect(document.body.style.overflow).toBe("auto")
+    expect(document.body.style.overflow).toBe('auto')
   })
 
-  it("lock is idempotent", async () => {
+  it('lock is idempotent', async () => {
     const useScrollLock = await getUseScrollLock()
     const { lock, unlock } = useScrollLock()
     lock()
     lock() // second call should be no-op
-    expect(document.body.style.overflow).toBe("hidden")
+    expect(document.body.style.overflow).toBe('hidden')
     unlock()
-    expect(document.body.style.overflow).toBe("")
+    expect(document.body.style.overflow).toBe('')
   })
 
-  it("unlock is idempotent", async () => {
+  it('unlock is idempotent', async () => {
     const useScrollLock = await getUseScrollLock()
     const { lock, unlock } = useScrollLock()
     lock()
     unlock()
     unlock() // second call should be no-op
-    expect(document.body.style.overflow).toBe("")
+    expect(document.body.style.overflow).toBe('')
   })
 
-  it("handles concurrent locks with reference counting", async () => {
+  it('handles concurrent locks with reference counting', async () => {
     const useScrollLock = await getUseScrollLock()
     const lock1 = useScrollLock()
     const lock2 = useScrollLock()
 
     lock1.lock()
-    expect(document.body.style.overflow).toBe("hidden")
+    expect(document.body.style.overflow).toBe('hidden')
 
     lock2.lock()
-    expect(document.body.style.overflow).toBe("hidden")
+    expect(document.body.style.overflow).toBe('hidden')
 
     // Unlocking first should not restore (still 1 active)
     lock1.unlock()
-    expect(document.body.style.overflow).toBe("hidden")
+    expect(document.body.style.overflow).toBe('hidden')
 
     // Unlocking second should restore
     lock2.unlock()
-    expect(document.body.style.overflow).toBe("")
+    expect(document.body.style.overflow).toBe('')
   })
 
-  it("preserves original overflow across concurrent locks", async () => {
+  it('preserves original overflow across concurrent locks', async () => {
     const useScrollLock = await getUseScrollLock()
-    document.body.style.overflow = "scroll"
+    document.body.style.overflow = 'scroll'
 
     const lock1 = useScrollLock()
     const lock2 = useScrollLock()
@@ -107,17 +107,17 @@ describe("useScrollLock", () => {
     lock2.lock()
 
     lock1.unlock()
-    expect(document.body.style.overflow).toBe("hidden")
+    expect(document.body.style.overflow).toBe('hidden')
 
     lock2.unlock()
-    expect(document.body.style.overflow).toBe("scroll")
+    expect(document.body.style.overflow).toBe('scroll')
   })
 
-  it("unlock without prior lock is no-op", async () => {
+  it('unlock without prior lock is no-op', async () => {
     const useScrollLock = await getUseScrollLock()
-    document.body.style.overflow = "auto"
+    document.body.style.overflow = 'auto'
     const { unlock } = useScrollLock()
     unlock()
-    expect(document.body.style.overflow).toBe("auto")
+    expect(document.body.style.overflow).toBe('auto')
   })
 })

package/src/__tests__/useSpacing.test.ts

@@ -1,23 +1,23 @@
-import { describe, expect, it, vi } from "vitest"
+import { describe, expect, it, vi } from 'vitest'
 
 // Mock @pyreon/styler to provide theme values
-vi.mock("@pyreon/styler", () => ({
+vi.mock('@pyreon/styler', () => ({
   useTheme: () => ({}),
 }))
 
-import { useSpacing } from "../useSpacing"
+import { useSpacing } from '../useSpacing'
 
-describe("useSpacing", () => {
-  it("returns spacing function with default base (rootSize/2 = 8)", () => {
+describe('useSpacing', () => {
+  it('returns spacing function with default base (rootSize/2 = 8)', () => {
     const spacing = useSpacing()
-    expect(spacing(1)).toBe("8px")
-    expect(spacing(2)).toBe("16px")
-    expect(spacing(0.5)).toBe("4px")
+    expect(spacing(1)).toBe('8px')
+    expect(spacing(2)).toBe('16px')
+    expect(spacing(0.5)).toBe('4px')
   })
 
-  it("accepts custom base unit", () => {
+  it('accepts custom base unit', () => {
     const spacing = useSpacing(4)
-    expect(spacing(1)).toBe("4px")
-    expect(spacing(3)).toBe("12px")
+    expect(spacing(1)).toBe('4px')
+    expect(spacing(3)).toBe('12px')
   })
 })

package/src/__tests__/useThemeValue.test.ts

@@ -1,12 +1,12 @@
-import { describe, expect, it } from "vitest"
-import { useThemeValue } from "../useThemeValue"
+import { describe, expect, it } from 'vitest'
+import { useThemeValue } from '../useThemeValue'
 
 // Without a ThemeProvider, useTheme returns the default (empty object {}).
 // So get(theme, path) returns undefined for any path.
 
-describe("useThemeValue", () => {
-  it("returns undefined when no theme values exist", () => {
-    const result = useThemeValue("colors.primary")
+describe('useThemeValue', () => {
+  it('returns undefined when no theme values exist', () => {
+    const result = useThemeValue('colors.primary')
     expect(result).toBeUndefined()
   })
 })