@nikala-ui/docs 0.12.0

package/dist/registry/create-form.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-form",
+  "title": "createForm",
+  "description": "SolidJS reactive primitive for form state management, field validation, errors, and submission",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-form.ts",
+      "content": "import { createSignal, createMemo, type Accessor } from \"solid-js\";\n\nexport type FormErrors<T> = Partial<Record<keyof T, string>>;\nexport type FormTouched<T> = Partial<Record<keyof T, boolean>>;\nexport type ValidateOn = \"change\" | \"blur\" | \"submit\";\n\nexport type FormInputEvent = Event & {\n  currentTarget:\n    | HTMLInputElement\n    | HTMLTextAreaElement\n    | HTMLSelectElement;\n};\n\nexport interface CreateFormOptions<T extends Record<string, any>> {\n  /** Initial form field values object */\n  initialValues: T;\n  /** Custom validation function returning error messages object */\n  validate?: (values: T) => FormErrors<T> | Promise<FormErrors<T>>;\n  /** Event that triggers validation. Defaults to \"change\". */\n  validateOn?: ValidateOn;\n  /** Submit handler callback invoked when validation succeeds */\n  onSubmit?: (values: T) => void | Promise<void>;\n}\n\nexport interface CreateFormReturn<T extends Record<string, any>> {\n  /** Accessor for current form field values */\n  values: Accessor<T>;\n  /** Accessor for form field validation error messages */\n  errors: Accessor<FormErrors<T>>;\n  /** Accessor for form field touched states */\n  touched: Accessor<FormTouched<T>>;\n  /** Accessor indicating if form is currently submitting */\n  isSubmitting: Accessor<boolean>;\n  /** Accessor containing an exception thrown by onSubmit, if any */\n  submitError: Accessor<unknown>;\n  /** Accessor indicating if form has zero validation errors */\n  isValid: Accessor<boolean>;\n  /** Accessor indicating if form values differ from initial values */\n  isDirty: Accessor<boolean>;\n  /** Update specific form field value */\n  setFieldValue: <K extends keyof T>(field: K, value: T[K]) => void;\n  /** Set specific form field validation error */\n  setFieldError: <K extends keyof T>(field: K, error: string | undefined) => void;\n  /** Set specific form field touched state */\n  setFieldTouched: <K extends keyof T>(field: K, isTouched?: boolean) => void;\n  /** Input change event listener helper factory function */\n  handleChange: <K extends keyof T>(field: K) => (e: FormInputEvent) => void;\n  /** Input blur event listener helper factory function */\n  handleBlur: <K extends keyof T>(field: K) => () => void;\n  /** Form onSubmit event handler */\n  handleSubmit: (e?: Event) => Promise<void>;\n  /** Reset form values, errors, and touched states to initial values */\n  resetForm: () => void;\n}\n\n/**\n * SolidJS reactive primitive for managing form field state, validation, errors, and submission.\n *\n * @param options Form configuration options including initialValues and validate function.\n */\nexport function createForm<T extends Record<string, any>>(\n  options: CreateFormOptions<T>\n): CreateFormReturn<T> {\n  const initialValues = { ...options.initialValues };\n\n  const [values, setValues] = createSignal<T>({ ...initialValues });\n  const [errors, setErrors] = createSignal<FormErrors<T>>({});\n  const [touched, setTouched] = createSignal<FormTouched<T>>({});\n  const [isSubmitting, setIsSubmitting] = createSignal(false);\n  const [submitError, setSubmitError] = createSignal<unknown>();\n  const validateOn = options.validateOn ?? \"change\";\n  let validationSequence = 0;\n\n  const isDirty = createMemo(() => {\n    const current = values();\n    return Object.keys(initialValues).some((key) => current[key] !== initialValues[key]);\n  });\n\n  const isValid = createMemo(() => {\n    const errs = errors();\n    return Object.keys(errs).length === 0;\n  });\n\n  const runValidation = async (currentValues: T): Promise<FormErrors<T>> => {\n    const sequence = ++validationSequence;\n    if (!options.validate) {\n      setErrors(() => ({}));\n      return {};\n    }\n\n    const result = await options.validate(currentValues);\n    const newErrors = result || {};\n    // Ignore stale async validations that finished after a newer request.\n    if (sequence === validationSequence) {\n      setErrors(() => newErrors);\n    }\n    return newErrors;\n  };\n\n  const setFieldValue = <K extends keyof T>(field: K, value: T[K]) => {\n    const next = { ...values(), [field]: value };\n    setValues(() => next);\n    if (validateOn === \"change\") {\n      void runValidation(next);\n    }\n  };\n\n  const setFieldError = <K extends keyof T>(field: K, error: string | undefined) => {\n    setErrors((prev) => {\n      const next = { ...prev };\n      if (error) next[field] = error;\n      else delete next[field];\n      return next;\n    });\n  };\n\n  const setFieldTouched = <K extends keyof T>(field: K, isTouched = true) => {\n    setTouched((prev) => ({ ...prev, [field]: isTouched }));\n  };\n\n  const handleChange = <K extends keyof T>(field: K) => {\n    return (e: FormInputEvent) => {\n      const target = e.currentTarget;\n      let value: unknown = target.value;\n\n      if (\n        \"checked\" in target &&\n        ((target as HTMLInputElement).type === \"checkbox\" ||\n          (target as HTMLInputElement).type === \"radio\")\n      ) {\n        value = (target as HTMLInputElement).checked;\n      } else if (\"selectedOptions\" in target && target.multiple) {\n        value = Array.from(target.selectedOptions, (option) => option.value);\n      }\n\n      setFieldValue(field, value as T[K]);\n    };\n  };\n\n  const handleBlur = <K extends keyof T>(field: K) => {\n    return () => {\n      setFieldTouched(field, true);\n      if (validateOn === \"blur\") {\n        void runValidation(values());\n      }\n    };\n  };\n\n  const handleSubmit = async (e?: Event) => {\n    e?.preventDefault();\n    setIsSubmitting(true);\n    setSubmitError(undefined);\n\n    // Mark all fields as touched on submit\n    const allTouched = Object.keys(values()).reduce((acc, key) => {\n      acc[key as keyof T] = true;\n      return acc;\n    }, {} as FormTouched<T>);\n    setTouched(() => allTouched);\n\n    try {\n      const validationErrors = await runValidation(values());\n      if (Object.keys(validationErrors).length === 0 && options.onSubmit) {\n        try {\n          await options.onSubmit(values());\n        } catch (error) {\n          setSubmitError(() => error);\n        }\n      }\n    } finally {\n      setIsSubmitting(false);\n    }\n  };\n\n  const resetForm = () => {\n    setValues(() => ({ ...initialValues }));\n    setErrors(() => ({}));\n    setTouched(() => ({}));\n    setIsSubmitting(false);\n    setSubmitError(undefined);\n    validationSequence += 1;\n  };\n\n  return {\n    values,\n    errors,\n    touched,\n    isSubmitting,\n    submitError,\n    isValid,\n    isDirty,\n    setFieldValue,\n    setFieldError,\n    setFieldTouched,\n    handleChange,\n    handleBlur,\n    handleSubmit,\n    resetForm,\n  };\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-fullscreen.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-fullscreen",
+  "title": "createFullscreen",
+  "description": "SolidJS reactive primitive for requesting and monitoring element or document fullscreen status",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-fullscreen.ts",
+      "content": "import { createSignal, createEffect, onCleanup, type Accessor } from \"solid-js\";\n\nexport interface CreateFullscreenOptions {\n  /** Target element accessor or reference. Defaults to document.documentElement. */\n  target?: HTMLElement | Accessor<HTMLElement | undefined>;\n  /** Callback fired when entering fullscreen mode. */\n  onEnter?: () => void;\n  /** Callback fired when exiting fullscreen mode. */\n  onExit?: () => void;\n  /** Callback fired when fullscreen request fails. */\n  onError?: (err: Event) => void;\n}\n\nexport interface CreateFullscreenReturn {\n  /** Signal indicating whether fullscreen mode is currently active. */\n  isFullscreen: Accessor<boolean>;\n  /** Request full screen mode for target element. */\n  enter: () => Promise<void>;\n  /** Exit full screen mode. */\n  exit: () => Promise<void>;\n  /** Toggle full screen mode. */\n  toggle: () => Promise<void>;\n}\n\n/**\n * SolidJS reactive primitive for requesting and monitoring element fullscreen status.\n */\nexport function createFullscreen(\n  options: CreateFullscreenOptions = {}\n): CreateFullscreenReturn {\n  const [isFullscreen, setIsFullscreen] = createSignal(false);\n\n  const getTarget = (): HTMLElement | undefined => {\n    if (typeof document === \"undefined\") return undefined;\n    if (typeof options.target === \"function\") {\n      return options.target() ?? document.documentElement;\n    }\n    return options.target ?? document.documentElement;\n  };\n\n  const updateStatus = (): void => {\n    if (typeof document === \"undefined\") return;\n    const activeEl = document.fullscreenElement;\n    const isTargetFullscreen = Boolean(activeEl && activeEl === getTarget());\n    setIsFullscreen(isTargetFullscreen);\n  };\n\n  const enter = async (): Promise<void> => {\n    if (typeof window === \"undefined\") return;\n    const el = getTarget();\n    if (el?.requestFullscreen) {\n      await el.requestFullscreen();\n    }\n  };\n\n  const exit = async (): Promise<void> => {\n    if (typeof document === \"undefined\") return;\n    if (document.fullscreenElement && document.exitFullscreen) {\n      await document.exitFullscreen();\n    }\n  };\n\n  const toggle = async (): Promise<void> => {\n    if (isFullscreen()) {\n      await exit();\n    } else {\n      await enter();\n    }\n  };\n\n  createEffect(() => {\n    if (typeof document === \"undefined\") return;\n\n    const handleFullscreenChange = (): void => {\n      const activeEl = document.fullscreenElement;\n      const isTarget = Boolean(activeEl && activeEl === getTarget());\n      setIsFullscreen(isTarget);\n\n      if (isTarget) {\n        options.onEnter?.();\n      } else {\n        options.onExit?.();\n      }\n    };\n\n    const handleFullscreenError = (err: Event): void => {\n      options.onError?.(err);\n    };\n\n    document.addEventListener(\"fullscreenchange\", handleFullscreenChange);\n    document.addEventListener(\"fullscreenerror\", handleFullscreenError);\n\n    onCleanup(() => {\n      document.removeEventListener(\"fullscreenchange\", handleFullscreenChange);\n      document.removeEventListener(\"fullscreenerror\", handleFullscreenError);\n    });\n  });\n\n  return {\n    isFullscreen,\n    enter,\n    exit,\n    toggle,\n  };\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-geolocation.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-geolocation",
+  "title": "createGeolocation",
+  "description": "SolidJS reactive primitive for tracking browser Geolocation position, coordinates, speed, and GPS accuracy",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-geolocation.ts",
+      "content": "import { createSignal, createEffect, onCleanup, type Accessor } from \"solid-js\";\n\nexport interface CreateGeolocationOptions extends PositionOptions {\n  /** Whether to start watching position immediately upon primitive initialization. Defaults to true. */\n  immediate?: boolean;\n}\n\nexport interface GeolocationState {\n  /** Current latitude coordinate in degrees. */\n  latitude: number | null;\n  /** Current longitude coordinate in degrees. */\n  longitude: number | null;\n  /** Current altitude above sea level in meters. */\n  altitude: number | null;\n  /** Position accuracy level in meters. */\n  accuracy: number | null;\n  /** Altitude accuracy in meters. */\n  altitudeAccuracy: number | null;\n  /** Current heading direction in degrees relative to true north. */\n  heading: number | null;\n  /** Current speed in meters per second. */\n  speed: number | null;\n  /** Timestamp when location was captured. */\n  timestamp: number | null;\n}\n\nexport interface CreateGeolocationReturn {\n  /** Signal accessor containing current geolocation coordinates and metrics. */\n  coords: Accessor<GeolocationState>;\n  /** Signal accessor indicating whether position retrieval is in progress. */\n  loading: Accessor<boolean>;\n  /** Signal accessor containing GeolocationPositionError if request failed. */\n  error: Accessor<GeolocationPositionError | Error | null>;\n  /** Signal accessor indicating whether Geolocation API is supported in browser environment. */\n  isSupported: Accessor<boolean>;\n  /** Imperative function to fetch current position once. */\n  getCurrentPosition: () => void;\n}\n\nconst initialCoords: GeolocationState = {\n  latitude: null,\n  longitude: null,\n  altitude: null,\n  accuracy: null,\n  altitudeAccuracy: null,\n  heading: null,\n  speed: null,\n  timestamp: null,\n};\n\n/**\n * SolidJS reactive primitive for tracking user geographic location and GPS metrics.\n */\nexport function createGeolocation(\n  options: CreateGeolocationOptions = {}\n): CreateGeolocationReturn {\n  const [coords, setCoords] = createSignal<GeolocationState>(initialCoords);\n  const [loading, setLoading] = createSignal(false);\n  const [error, setError] = createSignal<GeolocationPositionError | Error | null>(null);\n\n  const isSupported = (): boolean => {\n    if (typeof window === \"undefined\" || typeof navigator === \"undefined\") return false;\n    return \"geolocation\" in navigator;\n  };\n\n  const getOptions = (): PositionOptions => ({\n    timeout: options.timeout ?? 10000,\n    maximumAge: options.maximumAge ?? 5000,\n    enableHighAccuracy: options.enableHighAccuracy ?? false,\n  });\n\n  let watchId: number | null = null;\n\n  const updatePosition = (position: GeolocationPosition): void => {\n    setCoords({\n      latitude: position.coords.latitude,\n      longitude: position.coords.longitude,\n      altitude: position.coords.altitude,\n      accuracy: position.coords.accuracy,\n      altitudeAccuracy: position.coords.altitudeAccuracy,\n      heading: position.coords.heading,\n      speed: position.coords.speed,\n      timestamp: position.timestamp,\n    });\n    setLoading(false);\n    setError(null);\n  };\n\n  const handleError = (err: GeolocationPositionError): void => {\n    setError(err);\n    setLoading(false);\n  };\n\n  const getCurrentPosition = (): void => {\n    if (!isSupported()) {\n      setError(new Error(\"Geolocation API is not supported in this browser environment.\"));\n      return;\n    }\n\n    setLoading(true);\n    setError(null);\n\n    navigator.geolocation.getCurrentPosition(\n      (pos) => {\n        updatePosition(pos);\n      },\n      (err) => {\n        handleError(err);\n      },\n      getOptions()\n    );\n  };\n\n  createEffect(() => {\n    if (!isSupported()) return;\n\n    if (options.immediate ?? true) {\n      setLoading(true);\n      watchId = navigator.geolocation.watchPosition(\n        updatePosition,\n        handleError,\n        getOptions()\n      );\n    }\n\n    onCleanup(() => {\n      if (watchId !== null && typeof window !== \"undefined\" && \"geolocation\" in navigator) {\n        navigator.geolocation.clearWatch(watchId);\n      }\n    });\n  });\n\n  return {\n    coords,\n    loading,\n    error,\n    isSupported,\n    getCurrentPosition,\n  };\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-global-shortcut.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-global-shortcut",
+  "title": "createGlobalShortcut",
+  "description": "SolidJS reactive primitive for registering OS-level global keyboard shortcuts via Tauri v2 plugin",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-global-shortcut.ts",
+      "content": "import { onMount, onCleanup } from \"solid-js\";\nimport { isTauriEnvironment } from \"./create-tauri-window\";\n\nexport interface CreateGlobalShortcutOptions {\n  /** Shortcut key combination, e.g. 'CommandOrControl+Shift+P' or 'Alt+Space'. */\n  shortcut: string | string[];\n  /** Handler invoked when global shortcut is triggered. */\n  onTrigger: (shortcut: string) => void;\n  /** Automatically register shortcut on mount. Defaults to true. */\n  autoRegister?: boolean;\n}\n\nexport interface CreateGlobalShortcutReturn {\n  /** Register the configured global shortcut with Tauri / Browser. */\n  register: () => Promise<boolean>;\n  /** Unregister the shortcut. */\n  unregister: () => Promise<void>;\n  /** Indicates whether the shortcut is currently registered. */\n  isRegistered: () => boolean;\n}\n\n/**\n * SolidJS reactive primitive for registering native OS global hotkeys via Tauri v2 global shortcut plugin,\n * with automatic fallback to browser DOM keyboard listeners.\n */\nexport function createGlobalShortcut(\n  options: CreateGlobalShortcutOptions\n): CreateGlobalShortcutReturn {\n  let registered = false;\n  const shortcuts = Array.isArray(options.shortcut) ? options.shortcut : [options.shortcut];\n\n  const getTauriShortcutPlugin = async () => {\n    if (typeof window === \"undefined\") return null;\n    try {\n      if ((window as any).__TAURI__?.globalShortcut) {\n        return (window as any).__TAURI__.globalShortcut;\n      }\n      // Variable prevents Vite dev server from static module resolution\n      const moduleName = \"@tauri-apps/plugin-global-shortcut\";\n      // @ts-ignore - Optional runtime dependency in Tauri apps\n      const plugin = await import(/* @vite-ignore */ moduleName).catch(() => null);\n      return plugin;\n    } catch {\n      return null;\n    }\n  };\n\n  const normalizeKey = (k: string) => {\n    const key = k.toLowerCase().trim();\n    if (key === \" \" || key === \"space\" || key === \"spacebar\") return \"space\";\n    if (key === \"esc\" || key === \"escape\") return \"escape\";\n    if (key === \"return\" || key === \"enter\") return \"enter\";\n    return key;\n  };\n\n  const handleBrowserKeydown = (e: KeyboardEvent) => {\n    const eventKey = normalizeKey(e.key);\n    const eventCode = normalizeKey(e.code.replace(/^Key|^Digit/, \"\"));\n\n    for (const keyCombo of shortcuts) {\n      const parts = keyCombo.toLowerCase().split(\"+\");\n      const hasCtrlOrCmd = parts.includes(\"commandorcontrol\") || parts.includes(\"ctrl\") || parts.includes(\"cmd\");\n      const hasShift = parts.includes(\"shift\");\n      const hasAlt = parts.includes(\"alt\");\n      const mainKey = parts.find((p) => ![\"commandorcontrol\", \"ctrl\", \"cmd\", \"shift\", \"alt\"].includes(p));\n\n      const ctrlMatch = hasCtrlOrCmd ? e.ctrlKey || e.metaKey : !e.ctrlKey && !e.metaKey;\n      const shiftMatch = hasShift ? e.shiftKey : !e.shiftKey;\n      const altMatch = hasAlt ? e.altKey : !e.altKey;\n      const keyMatch = mainKey\n        ? eventKey === normalizeKey(mainKey) || eventCode === normalizeKey(mainKey)\n        : false;\n\n      if (ctrlMatch && shiftMatch && altMatch && keyMatch) {\n        e.preventDefault();\n        options.onTrigger(keyCombo);\n        break;\n      }\n    }\n  };\n\n  const register = async (): Promise<boolean> => {\n    if (typeof window === \"undefined\") return false;\n\n    if (isTauriEnvironment()) {\n      const plugin = await getTauriShortcutPlugin();\n      if (plugin?.register) {\n        try {\n          for (const s of shortcuts) {\n            await plugin.register(s, () => options.onTrigger(s));\n          }\n          registered = true;\n          return true;\n        } catch {\n          // Fallback to web listener\n        }\n      }\n    }\n\n    window.addEventListener(\"keydown\", handleBrowserKeydown);\n    registered = true;\n    return true;\n  };\n\n  const unregister = async (): Promise<void> => {\n    if (typeof window === \"undefined\") return;\n\n    if (isTauriEnvironment()) {\n      const plugin = await getTauriShortcutPlugin();\n      if (plugin?.unregister) {\n        try {\n          for (const s of shortcuts) {\n            await plugin.unregister(s);\n          }\n        } catch {\n          // Handled\n        }\n      }\n    }\n\n    window.removeEventListener(\"keydown\", handleBrowserKeydown);\n    registered = false;\n  };\n\n  onMount(() => {\n    if (options.autoRegister !== false) {\n      register();\n    }\n  });\n\n  onCleanup(() => {\n    unregister();\n  });\n\n  return {\n    register,\n    unregister,\n    isRegistered: () => registered,\n  };\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-hover.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-hover",
+  "title": "createHover",
+  "description": "SolidJS reactive primitive for tracking element hover state with entrance and exit delays",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-hover.ts",
+      "content": "import { createSignal, onCleanup, type Accessor } from \"solid-js\";\n\nexport interface CreateHoverOptions {\n  /** Delay in milliseconds before setting hover state to true */\n  delayEnter?: number;\n  /** Delay in milliseconds before setting hover state to false */\n  delayLeave?: number;\n  /** Callback fired when hover state transitions to true */\n  onHoverStart?: () => void;\n  /** Callback fired when hover state transitions to false */\n  onHoverEnd?: () => void;\n}\n\nexport interface CreateHoverReturn {\n  /** Accessor indicating whether target element is hovered */\n  isHovered: Accessor<boolean>;\n  /** Event listeners props to spread onto target JSX element */\n  props: {\n    onPointerEnter: (e: PointerEvent) => void;\n    onPointerLeave: (e: PointerEvent) => void;\n  };\n}\n\n/**\n * SolidJS reactive primitive for tracking element hover state with optional entrance/exit delays.\n *\n * @param options Configuration options for hover delays and callbacks.\n */\nexport function createHover(options: CreateHoverOptions = {}): CreateHoverReturn {\n  const [isHovered, setIsHovered] = createSignal(false);\n  let enterTimer: ReturnType<typeof setTimeout> | undefined;\n  let leaveTimer: ReturnType<typeof setTimeout> | undefined;\n\n  const clearTimers = () => {\n    if (enterTimer) {\n      clearTimeout(enterTimer);\n      enterTimer = undefined;\n    }\n    if (leaveTimer) {\n      clearTimeout(leaveTimer);\n      leaveTimer = undefined;\n    }\n  };\n\n  const onPointerEnter = () => {\n    clearTimers();\n    const delay = options.delayEnter ?? 0;\n\n    if (delay > 0) {\n      enterTimer = setTimeout(() => {\n        setIsHovered(true);\n        options.onHoverStart?.();\n        enterTimer = undefined;\n      }, delay);\n    } else {\n      setIsHovered(true);\n      options.onHoverStart?.();\n    }\n  };\n\n  const onPointerLeave = () => {\n    clearTimers();\n    const delay = options.delayLeave ?? 0;\n\n    if (delay > 0) {\n      leaveTimer = setTimeout(() => {\n        setIsHovered(false);\n        options.onHoverEnd?.();\n        leaveTimer = undefined;\n      }, delay);\n    } else {\n      setIsHovered(false);\n      options.onHoverEnd?.();\n    }\n  };\n\n  onCleanup(() => {\n    clearTimers();\n  });\n\n  return {\n    isHovered,\n    props: {\n      onPointerEnter,\n      onPointerLeave,\n    },\n  };\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-idle.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-idle",
+  "title": "createIdle",
+  "description": "SolidJS reactive primitive for detecting user inactivity with customizable timeout",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-idle.ts",
+      "content": "import { createSignal, onMount, onCleanup, type Accessor } from \"solid-js\";\nimport { isServer } from \"solid-js/web\";\n\nexport interface CreateIdleOptions {\n  /** Timeout in milliseconds before user is considered idle (default: 60000 = 60s) */\n  timeout?: number;\n  /** Initial idle state (default: false) */\n  initialState?: boolean;\n  /** DOM events to listen for user activity */\n  events?: string[];\n  /** Callback fired when user becomes idle */\n  onIdle?: () => void;\n  /** Callback fired when user becomes active after being idle */\n  onActive?: () => void;\n}\n\nexport interface CreateIdleReturn {\n  /** Accessor returning true if user has been inactive for timeout period */\n  isIdle: Accessor<boolean>;\n  /** Accessor returning timestamp in ms of last detected user interaction */\n  lastActive: Accessor<number>;\n  /** Reset idle state and restart timer */\n  reset: () => void;\n}\n\nconst DEFAULT_EVENTS = [\n  \"mousemove\",\n  \"mousedown\",\n  \"keydown\",\n  \"touchstart\",\n  \"scroll\",\n  \"wheel\",\n];\n\n/**\n * SolidJS reactive primitive for detecting user inactivity (idle state) with customizable timeout and event triggers.\n *\n * @param options Configuration options including timeout in ms and event handlers.\n */\nexport function createIdle(options: CreateIdleOptions = {}): CreateIdleReturn {\n  const initialIdle = options.initialState ?? false;\n\n  // SSR: return static defaults — no timers, no listeners\n  if (isServer) {\n    const [isIdle] = createSignal(initialIdle);\n    const [lastActive] = createSignal(0);\n    return { isIdle, lastActive, reset: () => {} };\n  }\n\n  const timeoutMs = options.timeout ?? 60000;\n  const events = options.events ?? DEFAULT_EVENTS;\n\n  const [isIdle, setIsIdle] = createSignal(initialIdle);\n  const [lastActive, setLastActive] = createSignal(0);\n\n  let timerId: any = null;\n\n  const startTimer = () => {\n    if (timerId) clearTimeout(timerId);\n    timerId = setTimeout(() => {\n      if (!isIdle()) {\n        setIsIdle(true);\n        if (options.onIdle) options.onIdle();\n      }\n    }, timeoutMs);\n  };\n\n  const handleUserActivity = () => {\n    setLastActive(Date.now());\n\n    if (isIdle()) {\n      setIsIdle(false);\n      if (options.onActive) options.onActive();\n    }\n\n    startTimer();\n  };\n\n  const reset = () => {\n    setLastActive(Date.now());\n    setIsIdle(false);\n    startTimer();\n  };\n\n  onMount(() => {\n    // Set initial lastActive to now on client mount\n    setLastActive(Date.now());\n\n    events.forEach((evt) => {\n      window.addEventListener(evt, handleUserActivity, { passive: true });\n    });\n\n    startTimer();\n\n    onCleanup(() => {\n      if (timerId) clearTimeout(timerId);\n      events.forEach((evt) => {\n        window.removeEventListener(evt, handleUserActivity);\n      });\n    });\n  });\n\n  return {\n    isIdle,\n    lastActive,\n    reset,\n  };\n}\n\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-infinite-scroll.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-infinite-scroll",
+  "title": "createInfiniteScroll",
+  "description": "SolidJS reactive primitive for dynamic infinite scrolling, auto-fetching pages, and scroll pagination",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-infinite-scroll.ts",
+      "content": "import { createSignal, createEffect, onCleanup, type Accessor } from \"solid-js\";\n\nexport interface CreateInfiniteScrollOptions {\n  /** Target element to observe or trigger scroll on. Defaults to document / scroll parent. */\n  target?: HTMLElement | Accessor<HTMLElement | undefined>;\n  /** Distance threshold from bottom in pixels to trigger fetch. Defaults to 100. */\n  threshold?: number;\n  /** Whether loading is currently enabled or auto-fetching is active. Defaults to true. */\n  enabled?: boolean | Accessor<boolean>;\n  /** Callback function when scrolled near bottom to fetch next items. */\n  onLoadMore: () => Promise<void> | void;\n}\n\nexport interface CreateInfiniteScrollReturn {\n  /** Sentinel ref function to bind to a DOM element at the bottom of the list. */\n  setSentinelRef: (el: HTMLElement | null) => void;\n  /** Signal indicating whether fetching is currently in progress. */\n  isLoading: Accessor<boolean>;\n  /** Signal indicating whether an error occurred during last fetch. */\n  error: Accessor<Error | null>;\n  /** Imperative function to manually trigger next page load. */\n  loadMore: () => Promise<void>;\n}\n\n/**\n * SolidJS reactive primitive for dynamic infinite scrolling / auto-fetching.\n */\nexport function createInfiniteScroll(\n  options: CreateInfiniteScrollOptions\n): CreateInfiniteScrollReturn {\n  const [sentinelEl, setSentinelEl] = createSignal<HTMLElement | null>(null);\n  const [isLoading, setIsLoading] = createSignal(false);\n  const [error, setError] = createSignal<Error | null>(null);\n\n  const isEnabled = (): boolean => {\n    if (typeof options.enabled === \"function\") {\n      return options.enabled();\n    }\n    return options.enabled ?? true;\n  };\n\n  const loadMore = async (): Promise<void> => {\n    if (isLoading() || !isEnabled()) return;\n    setIsLoading(true);\n    setError(null);\n    try {\n      await options.onLoadMore();\n    } catch (err) {\n      setError(err instanceof Error ? err : new Error(String(err)));\n    } finally {\n      setIsLoading(false);\n    }\n  };\n\n  createEffect(() => {\n    if (typeof window === \"undefined\" || !window.IntersectionObserver) return;\n    if (!isEnabled()) return;\n\n    const el = sentinelEl();\n    if (!el) return;\n\n    const rootMargin = `${options.threshold ?? 100}px`;\n\n    const observer = new IntersectionObserver(\n      (entries) => {\n        const entry = entries[0];\n        if (entry?.isIntersecting && !isLoading()) {\n          loadMore();\n        }\n      },\n      {\n        rootMargin,\n        threshold: 0,\n      }\n    );\n\n    observer.observe(el);\n\n    onCleanup(() => {\n      observer.disconnect();\n    });\n  });\n\n  return {\n    setSentinelRef: setSentinelEl,\n    isLoading,\n    error,\n    loadMore,\n  };\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-input-mask.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-input-mask",
+  "title": "createInputMask",
+  "description": "SolidJS reactive primitive for input value masking (phone numbers, credit cards, dates)",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-input-mask.ts",
+      "content": "import { createSignal, type Accessor } from \"solid-js\";\n\nexport interface CreateInputMaskOptions {\n  /** Mask pattern template (e.g. '+995 ### ##-##-##' or '#### #### #### ####') */\n  mask: string;\n  /** Initial default value */\n  defaultValue?: string;\n}\n\nexport interface CreateInputMaskReturn {\n  /** Accessor returning formatted masked input string */\n  value: Accessor<string>;\n  /** Accessor returning raw unmasked user digits string */\n  unmaskedValue: Accessor<string>;\n  /** Function to programmatically update input value */\n  setValue: (val: string) => void;\n  /** JSX props object to spread onto target HTMLInputElement */\n  props: {\n    value: () => string;\n    onInput: (e: Event & { currentTarget: HTMLInputElement }) => void;\n  };\n}\n\n/**\n * Format raw unmasked text against a mask pattern template.\n */\nexport function formatMask(rawInput: string, pattern: string): { masked: string; unmasked: string } {\n  if (!rawInput) {\n    return { masked: \"\", unmasked: \"\" };\n  }\n\n  // Find static prefix of pattern before first slot placeholder (#, 0, X)\n  let staticPrefix = \"\";\n  for (let i = 0; i < pattern.length; i++) {\n    const char = pattern[i];\n    if (char === \"#\" || char === \"0\" || char === \"X\") break;\n    staticPrefix += char;\n  }\n  const staticPrefixDigits = staticPrefix.replace(/\\D/g, \"\");\n\n  let digits = rawInput.replace(/\\D/g, \"\");\n\n  // Strip static prefix digits if present at the start\n  if (staticPrefixDigits && digits.startsWith(staticPrefixDigits)) {\n    digits = digits.slice(staticPrefixDigits.length);\n  }\n\n  if (!digits) {\n    return { masked: \"\", unmasked: \"\" };\n  }\n\n  let masked = \"\";\n  let digitIndex = 0;\n\n  for (let i = 0; i < pattern.length; i++) {\n    const char = pattern[i];\n    if (char === \"#\" || char === \"0\" || char === \"X\") {\n      if (digitIndex < digits.length) {\n        masked += digits[digitIndex++];\n      } else {\n        break;\n      }\n    } else {\n      if (digitIndex < digits.length) {\n        masked += char;\n      } else {\n        break;\n      }\n    }\n  }\n\n  return { masked, unmasked: digits };\n}\n\n/**\n * SolidJS reactive primitive for input value masking (phone numbers, credit cards, dates).\n *\n * @param options Configuration options including mask pattern.\n */\nexport function createInputMask(options: CreateInputMaskOptions): CreateInputMaskReturn {\n  const initial = formatMask(options.defaultValue || \"\", options.mask);\n  const [value, setFormattedValue] = createSignal(initial.masked);\n  const [unmaskedValue, setRawValue] = createSignal(initial.unmasked);\n\n  const setValue = (newVal: string) => {\n    const formatted = formatMask(newVal, options.mask);\n    setFormattedValue(formatted.masked);\n    setRawValue(formatted.unmasked);\n  };\n\n  const onInput = (e: Event & { currentTarget: HTMLInputElement }) => {\n    const inputVal = e.currentTarget.value;\n    const formatted = formatMask(inputVal, options.mask);\n\n    setFormattedValue(formatted.masked);\n    setRawValue(formatted.unmasked);\n    e.currentTarget.value = formatted.masked;\n  };\n\n  return {\n    value,\n    unmaskedValue,\n    setValue,\n    props: {\n      value: () => value(),\n      onInput,\n    },\n  };\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-intersection-observer.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-intersection-observer",
+  "title": "createIntersectionObserver",
+  "description": "SolidJS reactive primitives for observing element visibility and viewport intersection status",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-intersection-observer.ts",
+      "content": "import { createEffect, createSignal, onCleanup, type Accessor } from \"solid-js\";\n\nexport interface CreateIntersectionObserverOptions extends IntersectionObserverInit {\n  /** Whether the observer is active. Defaults to true. */\n  enabled?: boolean | Accessor<boolean>;\n}\n\n/**\n * SolidJS reactive primitive for observing element visibility and intersection with viewport or root element.\n *\n * @param target Target element or accessor returning HTML element.\n * @param callback Observer callback invoked on intersection state change.\n * @param options IntersectionObserver options (root, rootMargin, threshold, enabled).\n */\nexport function createIntersectionObserver(\n  target: HTMLElement | Accessor<HTMLElement | undefined>,\n  callback: IntersectionObserverCallback,\n  options: CreateIntersectionObserverOptions = {}\n): void {\n  const getTarget = (): HTMLElement | undefined => {\n    if (typeof target === \"function\") {\n      return (target as Accessor<HTMLElement | undefined>)();\n    }\n    return target;\n  };\n\n  const isEnabled = (): boolean => {\n    if (typeof options.enabled === \"function\") {\n      return options.enabled();\n    }\n    return options.enabled ?? true;\n  };\n\n  createEffect(() => {\n    if (typeof window === \"undefined\" || !window.IntersectionObserver) {\n      return;\n    }\n\n    if (!isEnabled()) return;\n\n    const el = getTarget();\n    if (!el) return;\n\n    const observer = new IntersectionObserver(callback, {\n      root: options.root,\n      rootMargin: options.rootMargin,\n      threshold: options.threshold,\n    });\n\n    observer.observe(el);\n\n    onCleanup(() => {\n      observer.disconnect();\n    });\n  });\n}\n\n/**\n * SolidJS reactive primitive returning a boolean accessor indicating if element is currently visible in viewport.\n *\n * @param target Target element or accessor returning HTML element.\n * @param options IntersectionObserver options.\n */\nexport function createInView(\n  target: HTMLElement | Accessor<HTMLElement | undefined>,\n  options: CreateIntersectionObserverOptions = {}\n): Accessor<boolean> {\n  const [isInView, setIsInView] = createSignal(false);\n\n  createIntersectionObserver(\n    target,\n    (entries) => {\n      const entry = entries[0];\n      if (entry) {\n        setIsInView(entry.isIntersecting);\n      }\n    },\n    options\n  );\n\n  return isInView;\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-keybindings.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-keybindings",
+  "title": "createKeybindings",
+  "description": "SolidJS reactive primitives for listening to keyboard shortcuts, key combinations, and Escape key presses",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-keybindings.ts",
+      "content": "import { onMount, onCleanup, type Accessor } from \"solid-js\";\n\nexport interface KeybindingDefinition {\n  /** Key combination string, e.g. \"meta+k\", \"ctrl+k\", \"Escape\", \"Shift+Enter\" */\n  key: string | string[];\n  /** Callback handler invoked when the key combination is triggered */\n  handler: (event: KeyboardEvent) => void;\n  /** Whether to prevent default browser action. Defaults to false. */\n  preventDefault?: boolean;\n  /** Whether to stop event propagation. Defaults to false. */\n  stopPropagation?: boolean;\n}\n\nexport interface CreateKeybindingsOptions {\n  /** Event target to attach listener to. Defaults to window. */\n  target?: HTMLElement | Window | Accessor<HTMLElement | Window | undefined>;\n  /** Event type: \"keydown\" (default) or \"keyup\" */\n  eventType?: \"keydown\" | \"keyup\";\n  /** Whether keybinding listeners are active. Defaults to true. */\n  enabled?: boolean | Accessor<boolean>;\n}\n\n/**\n * Normalizes key string into standardized combination signature (e.g. \"ctrl+meta+k\").\n */\nfunction normalizeKeyCombination(keyStr: string): string {\n  const parts = keyStr.toLowerCase().split(\"+\").map((p) => p.trim());\n  const modifiers = new Set<string>();\n  let mainKey = \"\";\n\n  for (const part of parts) {\n    if (part === \"meta\" || part === \"cmd\" || part === \"command\" || part === \"⌘\") {\n      modifiers.add(\"meta\");\n    } else if (part === \"ctrl\" || part === \"control\") {\n      modifiers.add(\"ctrl\");\n    } else if (part === \"alt\" || part === \"option\" || part === \"⌥\") {\n      modifiers.add(\"alt\");\n    } else if (part === \"shift\" || part === \"⇧\") {\n      modifiers.add(\"shift\");\n    } else {\n      mainKey = part;\n    }\n  }\n\n  const sortedMods = Array.from(modifiers).sort();\n  return [...sortedMods, mainKey].join(\"+\");\n}\n\n/**\n * Checks if a KeyboardEvent matches a normalized key combination.\n */\nfunction isEventMatch(event: KeyboardEvent, targetCombination: string): boolean {\n  const modifiers = new Set<string>();\n  if (event.metaKey) modifiers.add(\"meta\");\n  if (event.ctrlKey) modifiers.add(\"ctrl\");\n  if (event.altKey) modifiers.add(\"alt\");\n  if (event.shiftKey) modifiers.add(\"shift\");\n\n  const mainKey = event.key.toLowerCase();\n  const eventCombination = [...Array.from(modifiers).sort(), mainKey].join(\"+\");\n\n  return eventCombination === targetCombination;\n}\n\n/**\n * SolidJS reactive primitive for listening to single or multiple keyboard shortcuts.\n *\n * @param bindings Array of keybinding definitions or single definition object.\n * @param options Configuration options including target, event type, and enabled state.\n */\nexport function createKeybindings(\n  bindings: KeybindingDefinition | KeybindingDefinition[],\n  options: CreateKeybindingsOptions = {}\n): void {\n  const bindingList = Array.isArray(bindings) ? bindings : [bindings];\n\n  const isEnabled = () => {\n    if (typeof options.enabled === \"function\") {\n      return options.enabled();\n    }\n    return options.enabled ?? true;\n  };\n\n  const getTargetElement = (): HTMLElement | Window | undefined => {\n    if (!options.target) {\n      return typeof window !== \"undefined\" ? window : undefined;\n    }\n    if (typeof options.target === \"function\") {\n      return (options.target as Accessor<HTMLElement | Window | undefined>)();\n    }\n    return options.target;\n  };\n\n  const handleKeyboardEvent = (event: KeyboardEvent) => {\n    if (!isEnabled()) return;\n\n    for (const binding of bindingList) {\n      const keys = Array.isArray(binding.key) ? binding.key : [binding.key];\n\n      for (const keyCombo of keys) {\n        const normalizedCombo = normalizeKeyCombination(keyCombo);\n\n        if (isEventMatch(event, normalizedCombo)) {\n          if (binding.preventDefault) {\n            event.preventDefault();\n          }\n          if (binding.stopPropagation) {\n            event.stopPropagation();\n          }\n          binding.handler(event);\n          break;\n        }\n      }\n    }\n  };\n\n  onMount(() => {\n    const target = getTargetElement();\n    if (!target) return;\n\n    const eventType = options.eventType || \"keydown\";\n    target.addEventListener(eventType, handleKeyboardEvent as EventListener);\n\n    onCleanup(() => {\n      target.removeEventListener(eventType, handleKeyboardEvent as EventListener);\n    });\n  });\n}\n\n/**\n * SolidJS primitive specialized for handling Escape key presses.\n *\n * @param handler Callback invoked when Escape key is pressed.\n * @param options Keybindings options.\n */\nexport function createEscapeKey(\n  handler: (event: KeyboardEvent) => void,\n  options: CreateKeybindingsOptions = {}\n): void {\n  createKeybindings(\n    {\n      key: \"Escape\",\n      handler,\n      preventDefault: true,\n    },\n    options\n  );\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-lock-scroll.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-lock-scroll",
+  "title": "createLockScroll",
+  "description": "SolidJS reactive primitive for locking body or container scrolling when overlays are active",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-lock-scroll.ts",
+      "content": "import { createEffect, createSignal, onCleanup, type Accessor } from \"solid-js\";\n\nexport interface CreateLockScrollOptions {\n  /** Target element to lock scroll for. Defaults to document.body. */\n  target?: HTMLElement | Accessor<HTMLElement | undefined>;\n  /** Initial lock state. Defaults to true. */\n  enabled?: boolean | Accessor<boolean>;\n}\n\nexport interface CreateLockScrollReturn {\n  /** Accessor indicating whether scroll is currently locked */\n  isLocked: Accessor<boolean>;\n  /** Setter function to programmatically lock or unlock scroll */\n  setLocked: (locked: boolean) => void;\n}\n\n/**\n * SolidJS reactive primitive for locking target element (or document.body) scroll.\n *\n * @param options Configuration options including target element and initial enabled state.\n */\nexport function createLockScroll(options: CreateLockScrollOptions = {}): CreateLockScrollReturn {\n  const [internalLocked, setInternalLocked] = createSignal(false);\n\n  const getTarget = (): HTMLElement | undefined => {\n    if (typeof window === \"undefined\") return undefined;\n\n    if (!options.target) {\n      return document.body;\n    }\n    if (typeof options.target === \"function\") {\n      return (options.target as Accessor<HTMLElement | undefined>)();\n    }\n    return options.target;\n  };\n\n  const isEnabled = (): boolean => {\n    if (typeof options.enabled === \"function\") {\n      return options.enabled();\n    }\n    return options.enabled ?? true;\n  };\n\n  let originalOverflow: string | undefined;\n\n  const applyLock = (element: HTMLElement) => {\n    if (originalOverflow === undefined) {\n      originalOverflow = element.style.overflow;\n    }\n    element.style.overflow = \"hidden\";\n    setInternalLocked(true);\n  };\n\n  const removeLock = (element: HTMLElement) => {\n    if (originalOverflow !== undefined) {\n      element.style.overflow = originalOverflow;\n      originalOverflow = undefined;\n    } else {\n      element.style.overflow = \"\";\n    }\n    setInternalLocked(false);\n  };\n\n  createEffect(() => {\n    const el = getTarget();\n    if (!el) return;\n\n    if (isEnabled()) {\n      applyLock(el);\n    } else {\n      removeLock(el);\n    }\n  });\n\n  onCleanup(() => {\n    const el = getTarget();\n    if (el) {\n      removeLock(el);\n    }\n  });\n\n  const setLocked = (locked: boolean) => {\n    const el = getTarget();\n    if (!el) return;\n\n    if (locked) {\n      applyLock(el);\n    } else {\n      removeLock(el);\n    }\n  };\n\n  return {\n    isLocked: internalLocked,\n    setLocked,\n  };\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-long-press.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-long-press",
+  "title": "createLongPress",
+  "description": "SolidJS reactive primitive for detecting long press / hold touch and pointer interactions",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-long-press.ts",
+      "content": "import { createSignal, onCleanup } from \"solid-js\";\n\nexport interface CreateLongPressOptions {\n  /** Long press hold threshold duration in milliseconds. Defaults to 500. */\n  threshold?: number;\n  /** Callback fired when long press hold starts */\n  onStart?: () => void;\n  /** Callback fired when long press is successfully completed */\n  onFinish?: () => void;\n  /** Callback fired when long press is cancelled before threshold */\n  onCancel?: () => void;\n}\n\nexport interface CreateLongPressReturn {\n  /** Accessor indicating if long press is currently being held */\n  isPressed: () => boolean;\n  /** JSX Event Handlers object to spread or attach onto target element */\n  props: {\n    onPointerDown: (e: PointerEvent) => void;\n    onPointerUp: (e: PointerEvent) => void;\n    onPointerLeave: (e: PointerEvent) => void;\n    onCancel: (e: Event) => void;\n  };\n}\n\n/**\n * SolidJS reactive primitive for detecting long press / hold interactions on elements.\n *\n * @param handler Callback function invoked when long press threshold is reached.\n * @param options Options for threshold duration and state callbacks.\n */\nexport function createLongPress(\n  handler: (event: Event) => void,\n  options: CreateLongPressOptions = {}\n): CreateLongPressReturn {\n  const threshold = options.threshold ?? 500;\n  const [isPressed, setIsPressed] = createSignal(false);\n  let timer: ReturnType<typeof setTimeout> | undefined;\n\n  const cancel = (e?: Event) => {\n    if (timer) {\n      clearTimeout(timer);\n      timer = undefined;\n    }\n    if (isPressed()) {\n      setIsPressed(false);\n      options.onCancel?.();\n    }\n  };\n\n  const start = (e: Event) => {\n    cancel();\n    setIsPressed(true);\n    options.onStart?.();\n\n    timer = setTimeout(() => {\n      handler(e);\n      options.onFinish?.();\n      timer = undefined;\n    }, threshold);\n  };\n\n  const finish = (e: Event) => {\n    if (timer) {\n      clearTimeout(timer);\n      timer = undefined;\n      options.onCancel?.();\n    }\n    setIsPressed(false);\n  };\n\n  onCleanup(() => {\n    cancel();\n  });\n\n  return {\n    isPressed,\n    props: {\n      onPointerDown: start,\n      onPointerUp: finish,\n      onPointerLeave: cancel,\n      onCancel: cancel,\n    },\n  };\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-media-query.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-media-query",
+  "title": "createMediaQuery",
+  "description": "SolidJS reactive primitives for tracking CSS media queries and responsive Tailwind breakpoints",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-media-query.ts",
+      "content": "import { createEffect, createSignal, onCleanup, type Accessor } from \"solid-js\";\n\nexport const DEFAULT_BREAKPOINTS = {\n  sm: \"(min-width: 640px)\",\n  md: \"(min-width: 768px)\",\n  lg: \"(min-width: 1024px)\",\n  xl: \"(min-width: 1280px)\",\n  \"2xl\": \"(min-width: 1536px)\",\n};\n\n/**\n * SolidJS reactive primitive for tracking CSS media query match state.\n *\n * @param query Media query string or accessor returning media query string.\n */\nexport function createMediaQuery(query: string | Accessor<string>): Accessor<boolean> {\n  const getQuery = (): string => {\n    return typeof query === \"function\" ? query() : query;\n  };\n\n  const [matches, setMatches] = createSignal<boolean>(false);\n\n  createEffect(() => {\n    if (typeof window === \"undefined\" || !window.matchMedia) {\n      setMatches(false);\n      return;\n    }\n\n    const currentQuery = getQuery();\n    const mediaQueryList = window.matchMedia(currentQuery);\n\n    setMatches(mediaQueryList.matches);\n\n    const listener = (event: MediaQueryListEvent) => {\n      setMatches(event.matches);\n    };\n\n    if (mediaQueryList.addEventListener) {\n      mediaQueryList.addEventListener(\"change\", listener);\n      onCleanup(() => mediaQueryList.removeEventListener(\"change\", listener));\n    } else {\n      mediaQueryList.addListener(listener);\n      onCleanup(() => mediaQueryList.removeListener(listener));\n    }\n  });\n\n  return matches;\n}\n\nexport interface CreateBreakpointReturn {\n  /** Accessor returning active breakpoint key (e.g. 'sm', 'md', 'lg') */\n  active: Accessor<string>;\n  /** Accessor indicating if screen width matches mobile (<768px) */\n  isMobile: Accessor<boolean>;\n  /** Accessor indicating if screen width matches tablet (768px - 1024px) */\n  isTablet: Accessor<boolean>;\n  /** Accessor indicating if screen width matches desktop (>=1024px) */\n  isDesktop: Accessor<boolean>;\n}\n\n/**\n * SolidJS reactive primitive for tracking responsive Tailwind CSS design breakpoints.\n *\n * @param customBreakpoints Custom breakpoint definitions mapping key names to media query strings.\n */\nexport function createBreakpoint(\n  customBreakpoints: Record<string, string> = DEFAULT_BREAKPOINTS\n): CreateBreakpointReturn {\n  const isSm = createMediaQuery(customBreakpoints.sm || DEFAULT_BREAKPOINTS.sm);\n  const isMd = createMediaQuery(customBreakpoints.md || DEFAULT_BREAKPOINTS.md);\n  const isLg = createMediaQuery(customBreakpoints.lg || DEFAULT_BREAKPOINTS.lg);\n  const isXl = createMediaQuery(customBreakpoints.xl || DEFAULT_BREAKPOINTS.xl);\n  const is2Xl = createMediaQuery(customBreakpoints[\"2xl\"] || DEFAULT_BREAKPOINTS[\"2xl\"]);\n\n  const active = (): string => {\n    if (is2Xl()) return \"2xl\";\n    if (isXl()) return \"xl\";\n    if (isLg()) return \"lg\";\n    if (isMd()) return \"md\";\n    if (isSm()) return \"sm\";\n    return \"xs\";\n  };\n\n  const isMobile = (): boolean => !isMd();\n  const isTablet = (): boolean => isMd() && !isLg();\n  const isDesktop = (): boolean => isLg();\n\n  return {\n    active,\n    isMobile,\n    isTablet,\n    isDesktop,\n  };\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-mouse-position.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-mouse-position",
+  "title": "createMousePosition",
+  "description": "SolidJS reactive primitive for tracking global and element-relative mouse pointer coordinates",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-mouse-position.ts",
+      "content": "import { createEffect, createSignal, onCleanup, type Accessor } from \"solid-js\";\n\nexport interface CreateMousePositionOptions {\n  /** Target element to calculate element-relative mouse coordinates for. Defaults to window. */\n  target?: HTMLElement | Window | Accessor<HTMLElement | Window | undefined>;\n}\n\nexport interface CreateMousePositionReturn {\n  /** Accessor for global page X mouse position */\n  x: Accessor<number>;\n  /** Accessor for global page Y mouse position */\n  y: Accessor<number>;\n  /** Accessor for element-relative X mouse coordinate */\n  elementX: Accessor<number>;\n  /** Accessor for element-relative Y mouse coordinate */\n  elementY: Accessor<number>;\n  /** Accessor indicating if mouse pointer is inside target element bounds */\n  isInside: Accessor<boolean>;\n}\n\n/**\n * SolidJS reactive primitive for tracking global and element-relative mouse pointer coordinates.\n *\n * @param options Configuration options including target element.\n */\nexport function createMousePosition(\n  options: CreateMousePositionOptions = {}\n): CreateMousePositionReturn {\n  const [x, setX] = createSignal(0);\n  const [y, setY] = createSignal(0);\n  const [elementX, setElementX] = createSignal(0);\n  const [elementY, setElementY] = createSignal(0);\n  const [isInside, setIsInside] = createSignal(false);\n\n  const getTarget = (): HTMLElement | Window | undefined => {\n    if (typeof window === \"undefined\") return undefined;\n    if (!options.target) return window;\n    if (typeof options.target === \"function\") {\n      return (options.target as Accessor<HTMLElement | Window | undefined>)();\n    }\n    return options.target;\n  };\n\n  const handleMouseMove = (event: MouseEvent) => {\n    const pageX = event.pageX;\n    const pageY = event.pageY;\n\n    setX(pageX);\n    setY(pageY);\n\n    const target = getTarget();\n    if (target && target !== window) {\n      const el = target as HTMLElement;\n      const rect = el.getBoundingClientRect();\n      const relX = event.clientX - rect.left;\n      const relY = event.clientY - rect.top;\n\n      setElementX(relX);\n      setElementY(relY);\n\n      const inside =\n        relX >= 0 && relX <= rect.width && relY >= 0 && relY <= rect.height;\n      setIsInside(inside);\n    } else {\n      setElementX(pageX);\n      setElementY(pageY);\n      setIsInside(true);\n    }\n  };\n\n  createEffect(() => {\n    if (typeof window === \"undefined\") return;\n\n    window.addEventListener(\"mousemove\", handleMouseMove, { passive: true });\n    onCleanup(() => {\n      window.removeEventListener(\"mousemove\", handleMouseMove);\n    });\n  });\n\n  return {\n    x,\n    y,\n    elementX,\n    elementY,\n    isInside,\n  };\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-network-status.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-network-status",
+  "title": "createNetworkStatus",
+  "description": "SolidJS reactive primitives for tracking browser network connectivity and connection quality metrics",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-network-status.ts",
+      "content": "import { createEffect, createSignal, onCleanup, type Accessor } from \"solid-js\";\n\nexport interface CreateNetworkStatusReturn {\n  /** Accessor indicating if browser is currently connected to the network */\n  isOnline: Accessor<boolean>;\n  /** Date timestamp when network went offline, if applicable */\n  offlineAt: Accessor<Date | undefined>;\n  /** Date timestamp when network re-connected online, if applicable */\n  onlineAt: Accessor<Date | undefined>;\n  /** Network connection estimated downlink speed in Mbps */\n  downlink: Accessor<number | undefined>;\n  /** Network connection estimated round-trip time in ms */\n  rtt: Accessor<number | undefined>;\n  /** Network connection data saver mode enabled status */\n  saveData: Accessor<boolean | undefined>;\n  /** Network connection effective type ('slow-2g', '2g', '3g', '4g') */\n  effectiveType: Accessor<\"slow-2g\" | \"2g\" | \"3g\" | \"4g\" | undefined>;\n}\n\n/**\n * SolidJS reactive primitive for tracking browser network connectivity and connection quality metrics.\n */\nexport function createNetworkStatus(): CreateNetworkStatusReturn {\n  const getInitialOnline = () => (typeof navigator !== \"undefined\" ? navigator.onLine : true);\n\n  const [isOnline, setIsOnline] = createSignal(getInitialOnline());\n  const [offlineAt, setOfflineAt] = createSignal<Date | undefined>(undefined);\n  const [onlineAt, setOnlineAt] = createSignal<Date | undefined>(undefined);\n\n  const getNetworkConnection = () => {\n    if (typeof navigator === \"undefined\") return undefined;\n    return (navigator as any).connection || (navigator as any).mozConnection || (navigator as any).webkitConnection;\n  };\n\n  const conn = getNetworkConnection();\n\n  const [downlink, setDownlink] = createSignal<number | undefined>(conn?.downlink);\n  const [rtt, setRtt] = createSignal<number | undefined>(conn?.rtt);\n  const [saveData, setSaveData] = createSignal<boolean | undefined>(conn?.saveData);\n  const [effectiveType, setEffectiveType] = createSignal<\"slow-2g\" | \"2g\" | \"3g\" | \"4g\" | undefined>(conn?.effectiveType);\n\n  const updateNetworkInfo = () => {\n    const currentConn = getNetworkConnection();\n    if (currentConn) {\n      setDownlink(currentConn.downlink);\n      setRtt(currentConn.rtt);\n      setSaveData(currentConn.saveData);\n      setEffectiveType(currentConn.effectiveType);\n    }\n  };\n\n  const handleOnline = () => {\n    setIsOnline(true);\n    setOnlineAt(new Date());\n    updateNetworkInfo();\n  };\n\n  const handleOffline = () => {\n    setIsOnline(false);\n    setOfflineAt(new Date());\n  };\n\n  createEffect(() => {\n    if (typeof window === \"undefined\") return;\n\n    window.addEventListener(\"online\", handleOnline);\n    window.addEventListener(\"offline\", handleOffline);\n\n    const currentConn = getNetworkConnection();\n    if (currentConn && currentConn.addEventListener) {\n      currentConn.addEventListener(\"change\", updateNetworkInfo);\n    }\n\n    onCleanup(() => {\n      window.removeEventListener(\"online\", handleOnline);\n      window.removeEventListener(\"offline\", handleOffline);\n      if (currentConn && currentConn.removeEventListener) {\n        currentConn.removeEventListener(\"change\", updateNetworkInfo);\n      }\n    });\n  });\n\n  return {\n    isOnline,\n    offlineAt,\n    onlineAt,\n    downlink,\n    rtt,\n    saveData,\n    effectiveType,\n  };\n}\n\n/**\n * SolidJS reactive primitive for checking if browser is connected online.\n */\nexport function createOnline(): Accessor<boolean> {\n  const { isOnline } = createNetworkStatus();\n  return isOnline;\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-orientation.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-orientation",
+  "title": "createOrientation",
+  "description": "SolidJS reactive primitive for observing mobile and desktop screen orientation changes and rotation angles",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-orientation.ts",
+      "content": "import { createSignal, createEffect, onCleanup, type Accessor } from \"solid-js\";\n\nexport type ScreenOrientationType =\n  | \"portrait-primary\"\n  | \"portrait-secondary\"\n  | \"landscape-primary\"\n  | \"landscape-secondary\"\n  | \"portrait\"\n  | \"landscape\"\n  | \"unknown\";\n\nexport interface CreateOrientationOptions {\n  /** Callback fired when screen orientation changes. */\n  onChange?: (orientation: ScreenOrientationType, angle: number) => void;\n}\n\nexport interface CreateOrientationReturn {\n  /** Signal indicating current orientation type. */\n  type: Accessor<ScreenOrientationType>;\n  /** Signal indicating current orientation angle in degrees (0, 90, 180, 270). */\n  angle: Accessor<number>;\n  /** Signal indicating if device screen is in portrait mode. */\n  isPortrait: Accessor<boolean>;\n  /** Signal indicating if device screen is in landscape mode. */\n  isLandscape: Accessor<boolean>;\n  /** Lock screen orientation if supported by device/browser. */\n  lock: (orientation: string) => Promise<void>;\n  /** Unlock screen orientation. */\n  unlock: () => void;\n}\n\n/**\n * SolidJS reactive primitive for observing mobile/desktop screen orientation and angle.\n */\nexport function createOrientation(\n  options: CreateOrientationOptions = {}\n): CreateOrientationReturn {\n  const [type, setType] = createSignal<ScreenOrientationType>(\"unknown\");\n  const [angle, setAngle] = createSignal<number>(0);\n\n  const getOrientationState = (): { type: ScreenOrientationType; angle: number } => {\n    if (typeof window === \"undefined\") {\n      return { type: \"unknown\", angle: 0 };\n    }\n\n    if (window.screen?.orientation) {\n      return {\n        type: window.screen.orientation.type as ScreenOrientationType,\n        angle: window.screen.orientation.angle || 0,\n      };\n    }\n\n    /* Fallback for older browsers using window.orientation */\n    const legacyAngle = (window as unknown as { orientation?: number }).orientation ?? 0;\n    const isPortraitMode = Math.abs(legacyAngle) !== 90;\n    return {\n      type: isPortraitMode ? \"portrait\" : \"landscape\",\n      angle: Number(legacyAngle),\n    };\n  };\n\n  createEffect(() => {\n    if (typeof window === \"undefined\") return;\n\n    const updateState = (): void => {\n      const state = getOrientationState();\n      setType(state.type);\n      setAngle(state.angle);\n      options.onChange?.(state.type, state.angle);\n    };\n\n    updateState();\n\n    if (window.screen?.orientation) {\n      window.screen.orientation.addEventListener(\"change\", updateState);\n      onCleanup(() => {\n        window.screen.orientation.removeEventListener(\"change\", updateState);\n      });\n    } else {\n      window.addEventListener(\"orientationchange\", updateState);\n      window.addEventListener(\"resize\", updateState);\n      onCleanup(() => {\n        window.removeEventListener(\"orientationchange\", updateState);\n        window.removeEventListener(\"resize\", updateState);\n      });\n    }\n  });\n\n  const isPortrait = (): boolean => {\n    const currentType = type();\n    return currentType.startsWith(\"portrait\");\n  };\n\n  const isLandscape = (): boolean => {\n    const currentType = type();\n    return currentType.startsWith(\"landscape\");\n  };\n\n  const lock = async (orientation: string): Promise<void> => {\n    if (typeof window !== \"undefined\" && window.screen?.orientation) {\n      const orientationApi = window.screen.orientation as unknown as {\n        lock?: (orient: string) => Promise<void>;\n      };\n      if (typeof orientationApi.lock === \"function\") {\n        await orientationApi.lock(orientation);\n      }\n    }\n  };\n\n  const unlock = (): void => {\n    if (typeof window !== \"undefined\" && window.screen?.orientation) {\n      const orientationApi = window.screen.orientation as unknown as {\n        unlock?: () => void;\n      };\n      if (typeof orientationApi.unlock === \"function\") {\n        orientationApi.unlock();\n      }\n    }\n  };\n\n  return {\n    type,\n    angle,\n    isPortrait,\n    isLandscape,\n    lock,\n    unlock,\n  };\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-pagination.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-pagination",
+  "title": "createPagination",
+  "description": "SolidJS reactive primitive for computing pagination state, dynamic page ranges with ellipses, and navigation controls",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-pagination.ts",
+      "content": "import { createSignal, createMemo, type Accessor } from \"solid-js\";\n\nexport interface CreatePaginationOptions {\n  /** Total number of items across all pages, or total count. */\n  count?: number | Accessor<number>;\n  /** Explicit total number of pages. If provided, overrides count / pageSize calculation. */\n  totalPages?: number | Accessor<number>;\n  /** Controlled active page number (1-indexed). */\n  page?: number | Accessor<number>;\n  /** Default active page number for uncontrolled state. Defaults to 1. */\n  defaultPage?: number;\n  /** Number of items per page. Defaults to 10. */\n  pageSize?: number | Accessor<number>;\n  /** Number of sibling page buttons visible on each side of the current active page. Defaults to 1. */\n  siblingCount?: number | Accessor<number>;\n  /** Number of boundary pages visible at the beginning and end. Defaults to 1. */\n  boundaries?: number | Accessor<number>;\n  /** Callback fired whenever the active page changes. */\n  onChange?: (page: number) => void;\n}\n\nexport interface CreatePaginationReturn {\n  /** Accessor returning the current active page number (1-indexed). */\n  page: Accessor<number>;\n  /** Accessor returning the calculated total number of pages. */\n  totalPages: Accessor<number>;\n  /** Accessor returning the active page size. */\n  pageSize: Accessor<number>;\n  /** Accessor returning an array of page numbers and \"ellipsis\" strings. */\n  range: Accessor<(number | \"ellipsis\")[]>;\n  /** Function to programmatically change to a specific page number. */\n  setPage: (page: number) => void;\n  /** Function to navigate to the next page. */\n  next: () => void;\n  /** Function to navigate to the previous page. */\n  previous: () => void;\n  /** Function to navigate to the first page (1). */\n  first: () => void;\n  /** Function to navigate to the last page (totalPages). */\n  last: () => void;\n  /** Accessor indicating whether a next page exists. */\n  hasNext: Accessor<boolean>;\n  /** Accessor indicating whether a previous page exists. */\n  hasPrevious: Accessor<boolean>;\n  /** 1-based start index of items on the current page (e.g. 1 for page 1 with pageSize 10). */\n  startIndex: Accessor<number>;\n  /** 1-based end index of items on the current page (e.g. 10 for page 1 with pageSize 10). */\n  endIndex: Accessor<number>;\n}\n\n/**\n * SolidJS reactive primitive for computing pagination state, dynamic page range with ellipses, and navigation helpers.\n *\n * @param options Pagination configuration options.\n */\nexport function createPagination(options: CreatePaginationOptions = {}): CreatePaginationReturn {\n  const getCount = () => {\n    const raw = typeof options.count === \"function\" ? options.count() : options.count ?? 0;\n    return Math.max(0, raw);\n  };\n\n  const getPageSize = () => {\n    const raw = typeof options.pageSize === \"function\" ? options.pageSize() : options.pageSize ?? 10;\n    return Math.max(1, raw);\n  };\n\n  const getExplicitTotalPages = () => {\n    const raw = typeof options.totalPages === \"function\" ? options.totalPages() : options.totalPages;\n    return raw !== undefined ? Math.max(1, raw) : undefined;\n  };\n\n  const getSiblingCount = () => {\n    const raw = typeof options.siblingCount === \"function\" ? options.siblingCount() : options.siblingCount ?? 1;\n    return Math.max(0, raw);\n  };\n\n  const getBoundaries = () => {\n    const raw = typeof options.boundaries === \"function\" ? options.boundaries() : options.boundaries ?? 1;\n    return Math.max(0, raw);\n  };\n\n  const [internalPage, setInternalPage] = createSignal<number>(Math.max(1, options.defaultPage ?? 1));\n\n  const totalPages = createMemo<number>(() => {\n    const explicit = getExplicitTotalPages();\n    if (explicit !== undefined) {\n      return Math.max(1, explicit);\n    }\n    const count = getCount();\n    const size = getPageSize();\n    return Math.max(1, Math.ceil(count / size));\n  });\n\n  const rawPage = () => {\n    if (typeof options.page === \"function\") {\n      return options.page();\n    }\n    if (typeof options.page === \"number\") {\n      return options.page;\n    }\n    return internalPage();\n  };\n\n  const page = createMemo<number>(() => {\n    const p = rawPage();\n    const max = totalPages();\n    if (p < 1) return 1;\n    if (p > max) return max;\n    return p;\n  });\n\n  const setPage = (nextPage: number) => {\n    const max = totalPages();\n    const clamped = Math.max(1, Math.min(nextPage, max));\n    if (typeof options.page !== \"function\" && typeof options.page !== \"number\") {\n      setInternalPage(clamped);\n    }\n    options.onChange?.(clamped);\n  };\n\n  const next = () => setPage(page() + 1);\n  const previous = () => setPage(page() - 1);\n  const first = () => setPage(1);\n  const last = () => setPage(totalPages());\n\n  const hasNext = createMemo(() => page() < totalPages());\n  const hasPrevious = createMemo(() => page() > 1);\n\n  const startIndex = createMemo(() => {\n    const count = getCount();\n    if (count === 0 && getExplicitTotalPages() === undefined) return 0;\n    return (page() - 1) * getPageSize() + 1;\n  });\n\n  const endIndex = createMemo(() => {\n    const count = getCount();\n    const calculated = page() * getPageSize();\n    if (count > 0) {\n      return Math.min(calculated, count);\n    }\n    return calculated;\n  });\n\n  const range = createMemo<(number | \"ellipsis\")[]>(() => {\n    const total = totalPages();\n    const current = page();\n    const siblings = getSiblingCount();\n    const boundaries = getBoundaries();\n\n    if (total <= 1) {\n      return [1];\n    }\n\n    const pagesSet = new Set<number>();\n\n    // 1. Boundary pages at the start\n    for (let i = 1; i <= Math.min(boundaries, total); i++) {\n      pagesSet.add(i);\n    }\n\n    // 2. Sibling pages around current page\n    const leftSibling = Math.max(1, current - siblings);\n    const rightSibling = Math.min(total, current + siblings);\n    for (let i = leftSibling; i <= rightSibling; i++) {\n      pagesSet.add(i);\n    }\n\n    // 3. Boundary pages at the end\n    for (let i = Math.max(1, total - boundaries + 1); i <= total; i++) {\n      pagesSet.add(i);\n    }\n\n    const sortedPages = Array.from(pagesSet).sort((a, b) => a - b);\n    const result: (number | \"ellipsis\")[] = [];\n\n    for (let i = 0; i < sortedPages.length; i++) {\n      const currentPageNum = sortedPages[i];\n      if (i > 0) {\n        const prevPageNum = sortedPages[i - 1];\n        const gap = currentPageNum - prevPageNum;\n        if (gap === 2) {\n          result.push(prevPageNum + 1);\n        } else if (gap > 2) {\n          result.push(\"ellipsis\");\n        }\n      }\n      result.push(currentPageNum);\n    }\n\n    return result;\n  });\n\n  return {\n    page,\n    totalPages,\n    pageSize: getPageSize,\n    range,\n    setPage,\n    next,\n    previous,\n    first,\n    last,\n    hasNext,\n    hasPrevious,\n    startIndex,\n    endIndex,\n  };\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-permission.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-permission",
+  "title": "createPermission",
+  "description": "SolidJS reactive primitive for querying and observing browser permission status changes",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-permission.ts",
+      "content": "import { createSignal, createEffect, onCleanup, type Accessor } from \"solid-js\";\n\nexport type PermissionNameType =\n  | \"geolocation\"\n  | \"notifications\"\n  | \"persistent-storage\"\n  | \"push\"\n  | \"screen-wake-lock\"\n  | \"clipboard-read\"\n  | \"clipboard-write\"\n  | \"camera\"\n  | \"microphone\"\n  | (string & {});\n\nexport type PermissionStatusState = \"granted\" | \"denied\" | \"prompt\" | \"unknown\";\n\nexport interface CreatePermissionOptions {\n  /** Permission descriptor or name to query. */\n  name: PermissionNameType;\n}\n\nexport interface CreatePermissionReturn {\n  /** Signal accessor containing current permission status ('granted', 'denied', 'prompt', 'unknown'). */\n  state: Accessor<PermissionStatusState>;\n  /** Signal accessor indicating whether Permissions API is supported in browser environment. */\n  isSupported: Accessor<boolean>;\n  /** Imperative function to re-query permission status manually. */\n  query: () => Promise<PermissionStatusState>;\n}\n\n/**\n * SolidJS reactive primitive for querying and observing browser permission status changes.\n */\nexport function createPermission(\n  options: PermissionNameType | CreatePermissionOptions\n): CreatePermissionReturn {\n  const [state, setState] = createSignal<PermissionStatusState>(\"unknown\");\n\n  const permissionName = typeof options === \"string\" ? options : options.name;\n\n  const isSupported = (): boolean =>\n    typeof window !== \"undefined\" &&\n    typeof navigator !== \"undefined\" &&\n    \"permissions\" in navigator;\n\n  let permissionStatus: PermissionStatus | null = null;\n\n  const query = async (): Promise<PermissionStatusState> => {\n    if (!isSupported()) {\n      setState(\"unknown\");\n      return \"unknown\";\n    }\n\n    try {\n      const status = await navigator.permissions.query({\n        name: permissionName as PermissionName,\n      });\n\n      permissionStatus = status;\n      const currentState = status.state as PermissionStatusState;\n      setState(currentState);\n\n      status.onchange = () => {\n        setState(status.state as PermissionStatusState);\n      };\n\n      return currentState;\n    } catch {\n      setState(\"unknown\");\n      return \"unknown\";\n    }\n  };\n\n  createEffect(() => {\n    if (!isSupported()) return;\n\n    query();\n\n    onCleanup(() => {\n      if (permissionStatus) {\n        permissionStatus.onchange = null;\n      }\n    });\n  });\n\n  return {\n    state,\n    isSupported,\n    query,\n  };\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-previous.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-previous",
+  "title": "createPrevious",
+  "description": "SolidJS reactive primitive for tracking previous value of a signal accessor",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-previous.ts",
+      "content": "import { createEffect, createSignal, type Accessor } from \"solid-js\";\n\n/**\n * SolidJS reactive primitive for tracking previous value of a signal accessor.\n *\n * @param source Target reactive signal accessor to observe.\n */\nexport function createPrevious<T>(source: Accessor<T>): Accessor<T | undefined> {\n  const [previous, setPrevious] = createSignal<T | undefined>(undefined);\n  let current: T = source();\n\n  createEffect(() => {\n    const next = source();\n    if (current !== next) {\n      setPrevious(() => current);\n      current = next;\n    }\n  });\n\n  return previous;\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-resize-observer.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-resize-observer",
+  "title": "createResizeObserver",
+  "description": "SolidJS reactive primitives for tracking element width and height dimensions dynamically",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-resize-observer.ts",
+      "content": "import { createEffect, createSignal, onCleanup, type Accessor } from \"solid-js\";\n\nexport interface CreateResizeObserverOptions extends ResizeObserverOptions {\n  /** Whether the observer is active. Defaults to true. */\n  enabled?: boolean | Accessor<boolean>;\n}\n\n/**\n * SolidJS reactive primitive for observing element size changes via ResizeObserver.\n *\n * @param target Target element or accessor returning HTML element.\n * @param callback Observer callback invoked on element resize events.\n * @param options ResizeObserver options (box, enabled).\n */\nexport function createResizeObserver(\n  target: HTMLElement | Accessor<HTMLElement | undefined>,\n  callback: ResizeObserverCallback,\n  options: CreateResizeObserverOptions = {}\n): void {\n  const getTarget = (): HTMLElement | undefined => {\n    if (typeof target === \"function\") {\n      return (target as Accessor<HTMLElement | undefined>)();\n    }\n    return target;\n  };\n\n  const isEnabled = (): boolean => {\n    if (typeof options.enabled === \"function\") {\n      return options.enabled();\n    }\n    return options.enabled ?? true;\n  };\n\n  createEffect(() => {\n    if (typeof window === \"undefined\" || !window.ResizeObserver) {\n      return;\n    }\n\n    if (!isEnabled()) return;\n\n    const el = getTarget();\n    if (!el) return;\n\n    const observer = new ResizeObserver(callback);\n    observer.observe(el, { box: options.box });\n\n    onCleanup(() => {\n      observer.disconnect();\n    });\n  });\n}\n\nexport interface CreateElementSizeReturn {\n  /** Accessor for element width in pixels */\n  width: Accessor<number>;\n  /** Accessor for element height in pixels */\n  height: Accessor<number>;\n}\n\n/**\n * SolidJS reactive primitive returning width and height accessors for a target HTML element.\n *\n * @param target Target element or accessor returning HTML element.\n * @param options ResizeObserver options.\n */\nexport function createElementSize(\n  target: HTMLElement | Accessor<HTMLElement | undefined>,\n  options: CreateResizeObserverOptions = {}\n): CreateElementSizeReturn {\n  const [width, setWidth] = createSignal(0);\n  const [height, setHeight] = createSignal(0);\n\n  createResizeObserver(\n    target,\n    (entries) => {\n      const entry = entries[0];\n      if (entry) {\n        setWidth(entry.contentRect.width);\n        setHeight(entry.contentRect.height);\n      }\n    },\n    options\n  );\n\n  return {\n    width,\n    height,\n  };\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-scroll-into-view.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-scroll-into-view",
+  "title": "createScrollIntoView",
+  "description": "SolidJS reactive primitive for scrolling a target element into view smooth or auto behavior",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-scroll-into-view.ts",
+      "content": "import { createEffect, onCleanup, type Accessor } from \"solid-js\";\n\nexport interface CreateScrollIntoViewOptions extends ScrollIntoViewOptions {\n  /** Whether the element should scroll into view automatically. Defaults to true. */\n  enabled?: boolean | Accessor<boolean>;\n  /** Delay in milliseconds before executing scrollIntoView. Defaults to 0. */\n  delay?: number;\n}\n\n/**\n * SolidJS reactive primitive for scrolling a target element into view smooth or auto behavior.\n */\nexport function createScrollIntoView(\n  target: HTMLElement | Accessor<HTMLElement | null | undefined> | null | undefined,\n  options: CreateScrollIntoViewOptions = {}\n): void {\n  const getTarget = (): HTMLElement | null | undefined => {\n    if (typeof target === \"function\") {\n      return target();\n    }\n    return target;\n  };\n\n  const isEnabled = (): boolean => {\n    if (typeof options.enabled === \"function\") {\n      return options.enabled();\n    }\n    return options.enabled ?? true;\n  };\n\n  createEffect(() => {\n    if (!isEnabled()) return;\n\n    const el = getTarget();\n    if (!el || typeof window === \"undefined\") return;\n\n    const scrollOptions: ScrollIntoViewOptions = {\n      behavior: options.behavior ?? \"smooth\",\n      block: options.block ?? \"nearest\",\n      inline: options.inline ?? \"nearest\",\n    };\n\n    let timer: ReturnType<typeof setTimeout> | null = null;\n\n    if (options.delay && options.delay > 0) {\n      timer = setTimeout(() => {\n        el.scrollIntoView(scrollOptions);\n      }, options.delay);\n    } else {\n      el.scrollIntoView(scrollOptions);\n    }\n\n    onCleanup(() => {\n      if (timer) clearTimeout(timer);\n    });\n  });\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-scroll-position.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-scroll-position",
+  "title": "createScrollPosition",
+  "description": "SolidJS reactive primitive for tracking scroll position, scroll direction, and container bounds",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-scroll-position.ts",
+      "content": "import { createEffect, createSignal, onCleanup, type Accessor } from \"solid-js\";\n\nexport type ScrollDirection = \"up\" | \"down\" | \"left\" | \"right\" | \"none\";\n\nexport interface CreateScrollPositionOptions {\n  /** Target element to observe scroll events on. Defaults to window. */\n  target?: HTMLElement | Window | Accessor<HTMLElement | Window | undefined>;\n}\n\nexport interface CreateScrollPositionReturn {\n  /** Accessor for horizontal scroll position (scrollLeft / pageXOffset) */\n  x: Accessor<number>;\n  /** Accessor for vertical scroll position (scrollTop / pageYOffset) */\n  y: Accessor<number>;\n  /** Accessor indicating if element is actively scrolling */\n  isScrolling: Accessor<boolean>;\n  /** Accessor for current scroll direction ('up', 'down', 'left', 'right', 'none') */\n  direction: Accessor<ScrollDirection>;\n  /** Accessor indicating if scroll is at top (y <= 0) */\n  isAtTop: Accessor<boolean>;\n  /** Accessor indicating if scroll is at bottom of container */\n  isAtBottom: Accessor<boolean>;\n  /** Function to programmatically scroll target element */\n  scrollTo: (options: ScrollToOptions) => void;\n}\n\n/**\n * SolidJS reactive primitive for tracking target element or window scroll position and scroll metrics.\n *\n * @param options Configuration options including target element.\n */\nexport function createScrollPosition(\n  options: CreateScrollPositionOptions = {}\n): CreateScrollPositionReturn {\n  const [x, setX] = createSignal(0);\n  const [y, setY] = createSignal(0);\n  const [isScrolling, setIsScrolling] = createSignal(false);\n  const [direction, setDirection] = createSignal<ScrollDirection>(\"none\");\n  const [isAtTop, setIsAtTop] = createSignal(true);\n  const [isAtBottom, setIsAtBottom] = createSignal(false);\n\n  let scrollTimeout: ReturnType<typeof setTimeout> | undefined;\n  let lastX = 0;\n  let lastY = 0;\n\n  const getTarget = (): HTMLElement | Window | undefined => {\n    if (typeof window === \"undefined\") return undefined;\n    if (!options.target) return window;\n    if (typeof options.target === \"function\") {\n      return (options.target as Accessor<HTMLElement | Window | undefined>)();\n    }\n    return options.target;\n  };\n\n  const updateScroll = () => {\n    const target = getTarget();\n    if (!target) return;\n\n    let currentX = 0;\n    let currentY = 0;\n    let maxScrollY = 0;\n\n    if (target === window) {\n      currentX = window.scrollX || window.pageXOffset;\n      currentY = window.scrollY || window.pageYOffset;\n      maxScrollY = document.documentElement.scrollHeight - window.innerHeight;\n    } else {\n      const el = target as HTMLElement;\n      currentX = el.scrollLeft;\n      currentY = el.scrollTop;\n      maxScrollY = el.scrollHeight - el.clientHeight;\n    }\n\n    // Determine direction\n    const deltaX = currentX - lastX;\n    const deltaY = currentY - lastY;\n\n    if (Math.abs(deltaY) > Math.abs(deltaX)) {\n      if (deltaY > 0) setDirection(\"down\");\n      else if (deltaY < 0) setDirection(\"up\");\n    } else if (Math.abs(deltaX) > 0) {\n      if (deltaX > 0) setDirection(\"right\");\n      else if (deltaX < 0) setDirection(\"left\");\n    }\n\n    lastX = currentX;\n    lastY = currentY;\n\n    setX(currentX);\n    setY(currentY);\n    setIsAtTop(currentY <= 0);\n    setIsAtBottom(maxScrollY > 0 && currentY >= maxScrollY - 1);\n    setIsScrolling(true);\n\n    if (scrollTimeout) clearTimeout(scrollTimeout);\n    scrollTimeout = setTimeout(() => {\n      setIsScrolling(false);\n    }, 150);\n  };\n\n  createEffect(() => {\n    const target = getTarget();\n    if (!target) return;\n\n    updateScroll();\n\n    target.addEventListener(\"scroll\", updateScroll, { passive: true });\n    onCleanup(() => {\n      target.removeEventListener(\"scroll\", updateScroll);\n      if (scrollTimeout) clearTimeout(scrollTimeout);\n    });\n  });\n\n  const scrollTo = (scrollOptions: ScrollToOptions) => {\n    const target = getTarget();\n    if (!target) return;\n    target.scrollTo(scrollOptions);\n  };\n\n  return {\n    x,\n    y,\n    isScrolling,\n    direction,\n    isAtTop,\n    isAtBottom,\n    scrollTo,\n  };\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-storage.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-storage",
+  "title": "createLocalStorage",
+  "description": "SolidJS reactive primitives for Web Storage state synchronization across components and browser tabs",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-storage.ts",
+      "content": "import { createSignal, onMount, onCleanup, type Accessor } from \"solid-js\";\n\nexport type StorageType = \"local\" | \"session\";\n\n/**\n * Helper to safely read item from Web Storage.\n */\nfunction readStorage<T>(key: string, storage: Storage | undefined, fallback: T): T {\n  if (!storage) return fallback;\n  try {\n    const item = storage.getItem(key);\n    return item !== null ? JSON.parse(item) : fallback;\n  } catch (error) {\n    console.warn(`[nikala-ui/hooks] Error reading storage key \"${key}\":`, error);\n    return fallback;\n  }\n}\n\n/**\n * SolidJS reactive primitive for Web Storage (localStorage / sessionStorage) synchronization.\n *\n * @param key Storage key name.\n * @param initialValue Default initial value if key doesn't exist.\n * @param type Storage type: \"local\" (default) or \"session\".\n */\nexport function createStorage<T>(\n  key: string,\n  initialValue: T | Accessor<T>,\n  type: StorageType = \"local\"\n): [value: Accessor<T>, setValue: (val: T | ((prev: T) => T)) => void, remove: () => void] {\n  const getStorage = (): Storage | undefined => {\n    if (typeof window === \"undefined\") return undefined;\n    return type === \"local\" ? window.localStorage : window.sessionStorage;\n  };\n\n  const getFallback = (): T => (typeof initialValue === \"function\" ? (initialValue as Accessor<T>)() : initialValue);\n\n  const [value, setInternalValue] = createSignal<T>(getFallback());\n\n  const setValue = (val: T | ((prev: T) => T)) => {\n    const storage = getStorage();\n    const currentValue = value();\n    const nextValue = typeof val === \"function\" ? (val as (prev: T) => T)(currentValue) : val;\n\n    setInternalValue(() => nextValue);\n\n    if (storage) {\n      try {\n        storage.setItem(key, JSON.stringify(nextValue));\n      } catch (error) {\n        console.warn(`[nikala-ui/hooks] Error setting storage key \"${key}\":`, error);\n      }\n    }\n  };\n\n  const remove = () => {\n    const storage = getStorage();\n    setInternalValue(() => getFallback());\n    if (storage) {\n      storage.removeItem(key);\n    }\n  };\n\n  onMount(() => {\n    if (typeof window === \"undefined\") return;\n\n    const storage = getStorage();\n    if (storage) {\n      const stored = readStorage<T>(key, storage, getFallback());\n      setInternalValue(() => stored);\n    }\n\n    const handleStorageChange = (event: StorageEvent) => {\n      if (event.key === key) {\n        setInternalValue(() => (event.newValue !== null ? JSON.parse(event.newValue) : getFallback()));\n      }\n    };\n\n    window.addEventListener(\"storage\", handleStorageChange);\n    onCleanup(() => {\n      window.removeEventListener(\"storage\", handleStorageChange);\n    });\n  });\n\n  return [value, setValue, remove];\n}\n\n/**\n * SolidJS reactive primitive for localStorage synchronization across components and browser tabs.\n */\nexport function createLocalStorage<T>(\n  key: string,\n  initialValue: T | Accessor<T>\n): [value: Accessor<T>, setValue: (val: T | ((prev: T) => T)) => void, remove: () => void] {\n  return createStorage<T>(key, initialValue, \"local\");\n}\n\n/**\n * SolidJS reactive primitive for sessionStorage synchronization.\n */\nexport function createSessionStorage<T>(\n  key: string,\n  initialValue: T | Accessor<T>\n): [value: Accessor<T>, setValue: (val: T | ((prev: T) => T)) => void, remove: () => void] {\n  return createStorage<T>(key, initialValue, \"session\");\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-tauri-window.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-tauri-window",
+  "title": "createTauriWindow",
+  "description": "SolidJS reactive primitive for interacting with and controlling Tauri v2 application window states",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-tauri-window.ts",
+      "content": "import { createSignal, onMount, onCleanup, type Accessor } from \"solid-js\";\n\nexport type TauriPlatform = \"macos\" | \"windows\" | \"linux\" | \"web\";\n\nexport interface CreateTauriWindowOptions {\n  /** Initial fallback platform if not detected automatically. */\n  defaultPlatform?: TauriPlatform;\n  /** Listen to window resize and focus events. Defaults to true. */\n  listenEvents?: boolean;\n}\n\nexport interface CreateTauriWindowReturn {\n  /** Signal indicating whether the application is running inside a Tauri runtime. */\n  isTauri: Accessor<boolean>;\n  /** Detected host platform ('macos' | 'windows' | 'linux' | 'web'). */\n  platform: Accessor<TauriPlatform>;\n  /** Signal indicating whether the window is currently maximized. */\n  isMaximized: Accessor<boolean>;\n  /** Signal indicating whether the window is currently minimized. */\n  isMinimized: Accessor<boolean>;\n  /** Signal indicating whether the window is currently in fullscreen mode. */\n  isFullscreen: Accessor<boolean>;\n  /** Signal indicating whether the window is currently focused. */\n  isFocused: Accessor<boolean>;\n  /** Minimize the application window. */\n  minimize: () => Promise<void>;\n  /** Maximize the application window. */\n  maximize: () => Promise<void>;\n  /** Unmaximize the application window. */\n  unmaximize: () => Promise<void>;\n  /** Toggle between maximized and normal window states. */\n  toggleMaximize: () => Promise<void>;\n  /** Close the application window or exit process if main window. */\n  close: () => Promise<void>;\n  /** Forcefully destroy/close the application window. */\n  destroy: () => Promise<void>;\n  /** Toggle fullscreen state. */\n  setFullscreen: (fullscreen: boolean) => Promise<void>;\n  /** Start dragging the window. Can be bound to mousedown event or custom titlebar headers. */\n  startDragging: (e?: MouseEvent) => Promise<void>;\n}\n\n/**\n * Helper to detect current operating system in browser or desktop environments.\n */\nexport function detectPlatform(): TauriPlatform {\n  if (typeof window === \"undefined\" || typeof navigator === \"undefined\") {\n    return \"web\";\n  }\n\n  const userAgent = navigator.userAgent.toLowerCase();\n  const platform =\n    (navigator as any).userAgentData?.platform?.toLowerCase() ||\n    navigator.platform?.toLowerCase() ||\n    \"\";\n\n  if (platform.includes(\"mac\") || userAgent.includes(\"macintosh\") || userAgent.includes(\"mac os x\")) {\n    return \"macos\";\n  }\n  if (platform.includes(\"win\") || userAgent.includes(\"windows\")) {\n    return \"windows\";\n  }\n  if (platform.includes(\"linux\") || userAgent.includes(\"linux\")) {\n    return \"linux\";\n  }\n\n  return \"web\";\n}\n\n/**\n * Checks whether the current environment is running inside Tauri v1 or v2.\n */\nexport function isTauriEnvironment(): boolean {\n  if (typeof window === \"undefined\") return false;\n  const win = window as any;\n  return Boolean(\n    win.__TAURI_INTERNALS__ ||\n    win.__TAURI__ ||\n    win.__TAURI_PATTERN__ ||\n    win.__TAURI_METADATA__ ||\n    win.__TAURI_IPC__ ||\n    win.__TAURI_WINDOW__\n  );\n}\n\n/**\n * Checks whether the current environment is running inside Electron.\n */\nexport function isElectronEnvironment(): boolean {\n  if (typeof window === \"undefined\") return false;\n  const win = window as any;\n  return Boolean(\n    win.electron ||\n    win.electronAPI ||\n    win.ipcRenderer ||\n    win.process?.versions?.electron ||\n    (typeof navigator !== \"undefined\" && navigator.userAgent?.toLowerCase().includes(\"electron\"))\n  );\n}\n\n/**\n * Direct low-level IPC invocation across Tauri v2 (__TAURI_INTERNALS__) and Tauri v1.\n */\nasync function invokeTauri(\n  v2Cmd: string,\n  v2Args?: Record<string, any>,\n  v1CmdType?: string,\n  v1Data?: any\n): Promise<any> {\n  if (typeof window === \"undefined\") return undefined;\n  const win = window as any;\n\n  // 1. Try Tauri v2 direct IPC via injected __TAURI_INTERNALS__ or core.invoke\n  const invokeV2 = win.__TAURI_INTERNALS__?.invoke || win.__TAURI__?.core?.invoke;\n  if (typeof invokeV2 === \"function\") {\n    try {\n      return await invokeV2(`plugin:window|${v2Cmd}`, v2Args || {});\n    } catch {\n      // Fallback to secondary invoke mechanisms\n    }\n  }\n\n  // 2. Try Tauri v1 / generic invoke\n  const invokeV1 = win.__TAURI__?.invoke || win.__TAURI_INVOKE__;\n  if (typeof invokeV1 === \"function\") {\n    try {\n      if (v1CmdType) {\n        return await invokeV1(\"tauri\", {\n          __tauriModule: \"Window\",\n          message: {\n            cmd: \"manage\",\n            data: {\n              cmd: {\n                type: v1CmdType,\n                ...(v1Data !== undefined ? { data: v1Data } : {}),\n              },\n            },\n          },\n        });\n      }\n      return await invokeV1(v2Cmd, v2Args);\n    } catch {\n      // Fallback\n    }\n  }\n\n  return undefined;\n}\n\n/**\n * Helper to send Electron IPC messages if running in an Electron shell.\n */\nfunction sendElectronMessage(channel: string, ...args: any[]): boolean {\n  if (typeof window === \"undefined\") return false;\n  const win = window as any;\n\n  try {\n    if (win.electronAPI && typeof win.electronAPI[channel] === \"function\") {\n      win.electronAPI[channel](...args);\n      return true;\n    }\n    if (win.electron?.ipcRenderer?.send) {\n      win.electron.ipcRenderer.send(channel, ...args);\n      return true;\n    }\n    if (win.ipcRenderer?.send) {\n      win.ipcRenderer.send(channel, ...args);\n      return true;\n    }\n    if (typeof win.require === \"function\") {\n      const electron = win.require(\"electron\");\n      if (electron?.ipcRenderer?.send) {\n        electron.ipcRenderer.send(channel, ...args);\n        return true;\n      }\n    }\n  } catch {\n    // Ignored\n  }\n  return false;\n}\n\n/**\n * SolidJS reactive primitive for controlling and observing desktop window states.\n * Supports Tauri v2, Tauri v1, Electron, and browser preview environments.\n */\nexport function createTauriWindow(\n  options: CreateTauriWindowOptions = {}\n): CreateTauriWindowReturn {\n  const [isTauri, setIsTauri] = createSignal<boolean>(false);\n  const [platform, setPlatform] = createSignal<TauriPlatform>(options.defaultPlatform || \"web\");\n  const [isMaximized, setIsMaximized] = createSignal<boolean>(false);\n  const [isMinimized, setIsMinimized] = createSignal<boolean>(false);\n  const [isFullscreen, setIsFullscreen] = createSignal<boolean>(false);\n  const [isFocused, setIsFocused] = createSignal<boolean>(true);\n\n  let unlistenResize: (() => void) | null = null;\n  let unlistenFocus: (() => void) | null = null;\n\n  // Retrieve Tauri Window instance safely\n  const getTauriWindow = async () => {\n    if (typeof window === \"undefined\") return null;\n    const win = window as any;\n    try {\n      if (win.__TAURI__?.window?.getCurrentWindow) {\n        return win.__TAURI__.window.getCurrentWindow();\n      }\n      if (win.__TAURI__?.window?.appWindow) {\n        return win.__TAURI__.window.appWindow;\n      }\n      if (win.__TAURI_WINDOW__?.getCurrentWindow) {\n        return win.__TAURI_WINDOW__.getCurrentWindow();\n      }\n      if (win.__TAURI_WINDOW__?.appWindow) {\n        return win.__TAURI_WINDOW__.appWindow;\n      }\n      // Dynamic import if bundled by user's build setup\n      const moduleName = \"@tauri-apps/api/window\";\n      // @ts-ignore - Optional runtime dependency in Tauri apps\n      const tauriApi = await import(/* @vite-ignore */ moduleName).catch(() => null);\n      if (tauriApi?.getCurrentWindow) {\n        return tauriApi.getCurrentWindow();\n      }\n      if (tauriApi?.appWindow) {\n        return tauriApi.appWindow;\n      }\n    } catch {\n      // Running in standard web mode\n    }\n    return null;\n  };\n\n  const updateWindowStates = async () => {\n    if (typeof window === \"undefined\") return;\n\n    const tauriWin = await getTauriWindow();\n    if (tauriWin) {\n      setIsTauri(true);\n      try {\n        const [max, min, full, foc] = await Promise.all([\n          typeof tauriWin.isMaximized === \"function\" ? tauriWin.isMaximized() : false,\n          typeof tauriWin.isMinimized === \"function\" ? tauriWin.isMinimized() : false,\n          typeof tauriWin.isFullscreen === \"function\" ? tauriWin.isFullscreen() : false,\n          typeof tauriWin.isFocused === \"function\" ? tauriWin.isFocused() : true,\n        ]);\n        setIsMaximized(Boolean(max));\n        setIsMinimized(Boolean(min));\n        setIsFullscreen(Boolean(full));\n        setIsFocused(Boolean(foc));\n        return;\n      } catch {\n        // Fallback gracefully\n      }\n    }\n\n    if (isTauriEnvironment()) {\n      setIsTauri(true);\n      try {\n        const max = await invokeTauri(\"is_maximized\", {}, \"isMaximized\");\n        if (typeof max === \"boolean\") setIsMaximized(max);\n        const min = await invokeTauri(\"is_minimized\", {}, \"isMinimized\");\n        if (typeof min === \"boolean\") setIsMinimized(min);\n        const full = await invokeTauri(\"is_fullscreen\", {}, \"isFullscreen\");\n        if (typeof full === \"boolean\") setIsFullscreen(full);\n        const foc = await invokeTauri(\"is_focused\", {}, \"isFocused\");\n        if (typeof foc === \"boolean\") setIsFocused(foc);\n        return;\n      } catch {\n        // Fallback\n      }\n    }\n\n    if (!isElectronEnvironment()) {\n      setIsTauri(false);\n    }\n    if (typeof document !== \"undefined\") {\n      setIsFullscreen(Boolean(document.fullscreenElement));\n    }\n  };\n\n  onMount(async () => {\n    if (typeof window === \"undefined\") return;\n\n    setPlatform(detectPlatform());\n    setIsTauri(isTauriEnvironment());\n    await updateWindowStates();\n\n    if (options.listenEvents !== false) {\n      const handleWindowFocus = () => setIsFocused(true);\n      const handleWindowBlur = () => setIsFocused(false);\n      const handleFullscreenChange = () => setIsFullscreen(Boolean(document.fullscreenElement));\n      const handleResize = () => {\n        updateWindowStates();\n      };\n\n      window.addEventListener(\"focus\", handleWindowFocus);\n      window.addEventListener(\"blur\", handleWindowBlur);\n      window.addEventListener(\"resize\", handleResize);\n      document.addEventListener(\"fullscreenchange\", handleFullscreenChange);\n\n      const tauriWin = await getTauriWindow();\n      if (tauriWin?.onResized) {\n        try {\n          unlistenResize = await tauriWin.onResized(() => updateWindowStates());\n          unlistenFocus = await tauriWin.onFocusChanged(({ payload }: { payload: boolean }) => {\n            setIsFocused(payload);\n          });\n        } catch {\n          // Ignored in non-tauri contexts\n        }\n      }\n\n      onCleanup(() => {\n        window.removeEventListener(\"focus\", handleWindowFocus);\n        window.removeEventListener(\"blur\", handleWindowBlur);\n        window.removeEventListener(\"resize\", handleResize);\n        document.removeEventListener(\"fullscreenchange\", handleFullscreenChange);\n        if (unlistenResize) unlistenResize();\n        if (unlistenFocus) unlistenFocus();\n      });\n    }\n  });\n\n  const minimize = async (): Promise<void> => {\n    let executed = false;\n    const tauriWin = await getTauriWindow();\n    if (tauriWin?.minimize) {\n      try {\n        await tauriWin.minimize();\n        executed = true;\n      } catch {}\n    }\n    if (!executed && isTauriEnvironment()) {\n      try {\n        await invokeTauri(\"minimize\", {}, \"minimize\");\n        executed = true;\n      } catch {}\n    }\n    if (!executed && isElectronEnvironment()) {\n      executed =\n        sendElectronMessage(\"window-minimize\") ||\n        sendElectronMessage(\"minimize\") ||\n        sendElectronMessage(\"windowMinimize\");\n    }\n\n    setIsMinimized(true);\n    setIsMaximized(false);\n  };\n\n  const maximize = async (): Promise<void> => {\n    let executed = false;\n    const tauriWin = await getTauriWindow();\n    if (tauriWin?.maximize) {\n      try {\n        await tauriWin.maximize();\n        executed = true;\n      } catch {}\n    }\n    if (!executed && isTauriEnvironment()) {\n      try {\n        await invokeTauri(\"maximize\", {}, \"maximize\");\n        executed = true;\n      } catch {}\n    }\n    if (!executed && isElectronEnvironment()) {\n      executed =\n        sendElectronMessage(\"window-maximize\") ||\n        sendElectronMessage(\"maximize\") ||\n        sendElectronMessage(\"windowMaximize\");\n    }\n\n    setIsMaximized(true);\n    setIsMinimized(false);\n  };\n\n  const unmaximize = async (): Promise<void> => {\n    let executed = false;\n    const tauriWin = await getTauriWindow();\n    if (tauriWin?.unmaximize) {\n      try {\n        await tauriWin.unmaximize();\n        executed = true;\n      } catch {}\n    }\n    if (!executed && isTauriEnvironment()) {\n      try {\n        await invokeTauri(\"unmaximize\", {}, \"unmaximize\");\n        executed = true;\n      } catch {}\n    }\n    if (!executed && isElectronEnvironment()) {\n      executed =\n        sendElectronMessage(\"window-unmaximize\") ||\n        sendElectronMessage(\"unmaximize\") ||\n        sendElectronMessage(\"windowRestore\") ||\n        sendElectronMessage(\"restore\");\n    }\n\n    setIsMaximized(false);\n  };\n\n  let lastToggleTime = 0;\n  const toggleMaximize = async (): Promise<void> => {\n    const now = Date.now();\n    if (now - lastToggleTime < 350) {\n      return; // Ignore duplicate rapid triggers within 350ms window\n    }\n    lastToggleTime = now;\n\n    let executed = false;\n    const tauriWin = await getTauriWindow();\n    if (tauriWin) {\n      try {\n        if (typeof tauriWin.isMaximized === \"function\") {\n          const isMax = await tauriWin.isMaximized();\n          if (isMax && typeof tauriWin.unmaximize === \"function\") {\n            await tauriWin.unmaximize();\n            setIsMaximized(false);\n            executed = true;\n          } else if (!isMax && typeof tauriWin.maximize === \"function\") {\n            await tauriWin.maximize();\n            setIsMaximized(true);\n            executed = true;\n          }\n        }\n        if (!executed && typeof tauriWin.toggleMaximize === \"function\") {\n          await tauriWin.toggleMaximize();\n          executed = true;\n        }\n      } catch {}\n    }\n\n    if (!executed && isTauriEnvironment()) {\n      try {\n        const isMax = await invokeTauri(\"is_maximized\", {}, \"isMaximized\");\n        if (typeof isMax === \"boolean\") {\n          if (isMax) {\n            await invokeTauri(\"unmaximize\", {}, \"unmaximize\");\n            setIsMaximized(false);\n          } else {\n            await invokeTauri(\"maximize\", {}, \"maximize\");\n            setIsMaximized(true);\n          }\n          executed = true;\n        } else {\n          await invokeTauri(\"toggle_maximize\", {}, \"toggleMaximize\");\n          executed = true;\n        }\n      } catch {}\n    }\n\n    if (!executed && isElectronEnvironment()) {\n      executed =\n        sendElectronMessage(\"window-toggle-maximize\") ||\n        sendElectronMessage(\"toggle-maximize\") ||\n        sendElectronMessage(\"toggleMaximize\");\n    }\n\n    if (!executed) {\n      setIsMaximized((prev) => !prev);\n    }\n    setIsMinimized(false);\n  };\n\n  const close = async (): Promise<void> => {\n    let closed = false;\n    const win = typeof window !== \"undefined\" ? (window as any) : null;\n    const tauriWin = await getTauriWindow();\n\n    // 1. Try Tauri Window API close\n    if (tauriWin?.close) {\n      try {\n        await tauriWin.close();\n        closed = true;\n      } catch {}\n    }\n\n    // 2. Try Tauri IPC window close\n    if (!closed && isTauriEnvironment()) {\n      try {\n        await invokeTauri(\"close\", {}, \"close\");\n        closed = true;\n      } catch {}\n    }\n\n    // 3. Try Tauri destroy fallback if close did not succeed\n    if (!closed && tauriWin?.destroy) {\n      try {\n        await tauriWin.destroy();\n        closed = true;\n      } catch {}\n    }\n    if (!closed && isTauriEnvironment()) {\n      try {\n        await invokeTauri(\"destroy\", {}, \"destroy\");\n        closed = true;\n      } catch {}\n    }\n\n    // 4. Try Tauri process exit if in Tauri environment\n    if (!closed && isTauriEnvironment()) {\n      try {\n        const invokeProcess = win?.__TAURI_INTERNALS__?.invoke || win?.__TAURI__?.core?.invoke;\n        if (typeof invokeProcess === \"function\") {\n          await invokeProcess(\"plugin:process|exit\", { code: 0 });\n          closed = true;\n        } else if (win?.__TAURI__?.process?.exit) {\n          await win.__TAURI__.process.exit(0);\n          closed = true;\n        }\n      } catch {}\n    }\n\n    // 5. Try Electron window close / app quit\n    if (!closed && isElectronEnvironment()) {\n      closed =\n        sendElectronMessage(\"window-close\") ||\n        sendElectronMessage(\"close\") ||\n        sendElectronMessage(\"app-close\") ||\n        sendElectronMessage(\"quit\");\n    }\n\n    // 6. Browser fallback & custom event dispatch\n    if (typeof window !== \"undefined\") {\n      try {\n        window.dispatchEvent(new CustomEvent(\"nikala:window-close\"));\n      } catch {}\n\n      try {\n        window.close();\n      } catch {}\n    }\n  };\n\n  const destroy = async (): Promise<void> => {\n    const tauriWin = await getTauriWindow();\n    if (tauriWin?.destroy) {\n      try {\n        await tauriWin.destroy();\n        return;\n      } catch {}\n    }\n    if (isTauriEnvironment()) {\n      try {\n        await invokeTauri(\"destroy\", {}, \"destroy\");\n        return;\n      } catch {}\n    }\n    await close();\n  };\n\n  const setFullscreen = async (fullscreen: boolean): Promise<void> => {\n    let executed = false;\n    const tauriWin = await getTauriWindow();\n    if (tauriWin?.setFullscreen) {\n      try {\n        await tauriWin.setFullscreen(fullscreen);\n        executed = true;\n      } catch {}\n    }\n    if (!executed && isTauriEnvironment()) {\n      try {\n        await invokeTauri(\"set_fullscreen\", { value: fullscreen }, \"setFullscreen\", fullscreen);\n        executed = true;\n      } catch {}\n    }\n    if (!executed && isElectronEnvironment()) {\n      executed =\n        sendElectronMessage(\"window-set-fullscreen\", fullscreen) ||\n        sendElectronMessage(\"set-fullscreen\", fullscreen);\n    }\n\n    if (typeof document !== \"undefined\") {\n      if (fullscreen && document.documentElement.requestFullscreen) {\n        try {\n          await document.documentElement.requestFullscreen();\n        } catch {}\n      } else if (!fullscreen && document.fullscreenElement && document.exitFullscreen) {\n        try {\n          await document.exitFullscreen();\n        } catch {}\n      }\n    }\n\n    setIsFullscreen(fullscreen);\n  };\n\n  const startDragging = async (e?: MouseEvent): Promise<void> => {\n    if (e) {\n      if (e.button !== 0) return; // Only primary mouse button starts drag\n      if (e.detail > 1) return; // Prevent drag initialization on double-click gesture\n    }\n    let dragged = false;\n    const tauriWin = await getTauriWindow();\n    if (tauriWin?.startDragging) {\n      try {\n        await tauriWin.startDragging();\n        dragged = true;\n      } catch {}\n    }\n    if (!dragged && isTauriEnvironment()) {\n      try {\n        await invokeTauri(\"start_dragging\", {}, \"startDragging\");\n        dragged = true;\n      } catch {}\n    }\n    if (!dragged && isElectronEnvironment()) {\n      sendElectronMessage(\"window-drag\");\n    }\n  };\n\n  return {\n    isTauri,\n    platform,\n    isMaximized,\n    isMinimized,\n    isFullscreen,\n    isFocused,\n    minimize,\n    maximize,\n    unmaximize,\n    toggleMaximize,\n    close,\n    destroy,\n    setFullscreen,\n    startDragging,\n  };\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}

package/dist/registry/create-timer.json

@@ -0,0 +1,13 @@
+{
+  "name": "create-timer",
+  "title": "createTimer",
+  "description": "SolidJS reactive primitives for recurring interval ticks and formatted countdown timers",
+  "type": "registry:hook",
+  "files": [
+    {
+      "path": "hooks/create-timer.ts",
+      "content": "import { createEffect, createSignal, onCleanup, type Accessor } from \"solid-js\";\n\nexport interface CreateTimerOptions {\n  /** Whether the timer starts running automatically on mount. Defaults to false. */\n  autostart?: boolean;\n}\n\nexport interface CreateTimerReturn {\n  /** Accessor indicating if timer is actively running */\n  isRunning: Accessor<boolean>;\n  /** Function to start or resume the timer */\n  start: () => void;\n  /** Function to pause/stop the timer */\n  stop: () => void;\n  /** Function to reset and restart the timer */\n  reset: () => void;\n  /** Function to toggle running state */\n  toggle: () => void;\n}\n\n/**\n * SolidJS reactive primitive for recurring interval timers.\n *\n * @param intervalMs Interval duration in milliseconds.\n * @param callback Function to execute on each interval tick.\n * @param options Configuration options including autostart.\n */\nexport function createTimer(\n  intervalMs: number | Accessor<number>,\n  callback: () => void,\n  options: CreateTimerOptions = {}\n): CreateTimerReturn {\n  const [isRunning, setIsRunning] = createSignal<boolean>(options.autostart ?? false);\n  let timerId: ReturnType<typeof setInterval> | undefined;\n\n  const getInterval = () => (typeof intervalMs === \"function\" ? intervalMs() : intervalMs);\n\n  const stop = () => {\n    if (timerId) {\n      clearInterval(timerId);\n      timerId = undefined;\n    }\n    setIsRunning(false);\n  };\n\n  const start = () => {\n    stop();\n    const delay = getInterval();\n    if (delay <= 0) return;\n\n    setIsRunning(true);\n    timerId = setInterval(() => {\n      callback();\n    }, delay);\n  };\n\n  const reset = () => {\n    start();\n  };\n\n  const toggle = () => {\n    if (isRunning()) {\n      stop();\n    } else {\n      start();\n    }\n  };\n\n  createEffect(() => {\n    if (isRunning()) {\n      start();\n    }\n  });\n\n  onCleanup(() => {\n    stop();\n  });\n\n  return {\n    isRunning,\n    start,\n    stop,\n    reset,\n    toggle,\n  };\n}\n\nexport interface CreateCountdownOptions extends CreateTimerOptions {\n  /** Callback fired when countdown reaches zero */\n  onComplete?: () => void;\n}\n\nexport interface CreateCountdownReturn extends CreateTimerReturn {\n  /** Accessor for remaining seconds */\n  remainingSeconds: Accessor<number>;\n  /** Accessor for formatted time string (MM:SS) */\n  formatted: Accessor<string>;\n}\n\n/**\n * SolidJS reactive primitive for countdown timers.\n *\n * @param durationSeconds Total countdown duration in seconds.\n * @param options Configuration options including autostart and onComplete callback.\n */\nexport function createCountdown(\n  durationSeconds: number | Accessor<number>,\n  options: CreateCountdownOptions = {}\n): CreateCountdownReturn {\n  const getInitialDuration = () =>\n    typeof durationSeconds === \"function\" ? durationSeconds() : durationSeconds;\n\n  const [remaining, setRemaining] = createSignal<number>(getInitialDuration());\n\n  const timer = createTimer(\n    1000,\n    () => {\n      setRemaining((prev) => {\n        if (prev <= 1) {\n          timer.stop();\n          options.onComplete?.();\n          return 0;\n        }\n        return prev - 1;\n      });\n    },\n    { autostart: options.autostart }\n  );\n\n  const reset = () => {\n    setRemaining(getInitialDuration());\n    timer.start();\n  };\n\n  const formatted = (): string => {\n    const total = remaining();\n    const minutes = Math.floor(total / 60);\n    const seconds = total % 60;\n    const mm = String(minutes).padStart(2, \"0\");\n    const ss = String(seconds).padStart(2, \"0\");\n    return `${mm}:${ss}`;\n  };\n\n  return {\n    ...timer,\n    remainingSeconds: remaining,\n    formatted,\n    reset,\n  };\n}\n",
+      "type": "registry:hook"
+    }
+  ]
+}