@mantine/hooks/cjs/use-event-listener/use-event-listener.cjs.map

A collection of 50+ hooks for state and UI management

{"version":3,"file":"use-event-listener.cjs","names":[],"sources":["../../src/use-event-listener/use-event-listener.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\n\nexport function useEventListener<K extends keyof HTMLElementEventMap, T extends HTMLElement = any>(\n  type: K,\n  listener: (this: HTMLDivElement, ev: HTMLElementEventMap[K]) => any,\n  options?: boolean | AddEventListenerOptions\n): React.RefCallback<T | null> {\n  const previousListener = useRef<Function | null>(null);\n  const previousNode = useRef<T | null>(null);\n\n  const callbackRef: React.RefCallback<T | null> = useCallback(\n    (node) => {\n      if (!node) {\n        return;\n      }\n\n      if (previousNode.current && previousListener.current) {\n        previousNode.current.removeEventListener(type, previousListener.current as any, options);\n      }\n\n      node.addEventListener(type, listener as any, options);\n      previousNode.current = node;\n      previousListener.current = listener;\n    },\n    [type, listener, options]\n  );\n\n  useEffect(\n    () => () => {\n      if (previousNode.current && previousListener.current) {\n        previousNode.current.removeEventListener(type, previousListener.current as any, options);\n      }\n    },\n    [type, options]\n  );\n\n  return callbackRef;\n}\n"],"mappings":";;;AAEA,SAAgB,iBACd,MACA,UACA,SAC6B;CAC7B,MAAM,oBAAA,GAAA,MAAA,QAA2C,KAAK;CACtD,MAAM,gBAAA,GAAA,MAAA,QAAgC,KAAK;CAE3C,MAAM,eAAA,GAAA,MAAA,cACH,SAAS;AACR,MAAI,CAAC,KACH;AAGF,MAAI,aAAa,WAAW,iBAAiB,QAC3C,cAAa,QAAQ,oBAAoB,MAAM,iBAAiB,SAAgB,QAAQ;AAG1F,OAAK,iBAAiB,MAAM,UAAiB,QAAQ;AACrD,eAAa,UAAU;AACvB,mBAAiB,UAAU;IAE7B;EAAC;EAAM;EAAU;EAAQ,CAC1B;AAED,EAAA,GAAA,MAAA,uBACc;AACV,MAAI,aAAa,WAAW,iBAAiB,QAC3C,cAAa,QAAQ,oBAAoB,MAAM,iBAAiB,SAAgB,QAAQ;IAG5F,CAAC,MAAM,QAAQ,CAChB;AAED,QAAO"}