{"version":3,"file":"useMatchDevice.cjs","names":["useRef"],"sources":["../../src/useMatchDevice/useMatchDevice.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { createMatchDevice, type MatchDevice } from '@pastweb/tools';\nimport { useBeforeMount } from '../useBeforeMount';\nimport { useRef } from '../useRef';\nimport type { DevicesConfig, MatchDevicesResult, DevicesResult } from './types';\n\n/**\n * Tracks device matches with the tools `createMatchDevice` helper.\n *\n * @param config - Device match configuration.\n *\n * @returns Current device matches and a per-device match listener helper.\n *\n * @example\n * ```tsx\n * const { devices, onMatch } = useMatchDevice({\n *   phone: { mediaQuery: '(max-width: 640px)' },\n * });\n *\n * useMounted(() => {\n *   onMatch('phone', matches => console.log(matches));\n * });\n * ```\n */\nexport const useMatchDevice = (config: DevicesConfig): DevicesResult => {\n  const match = useRef<MatchDevice | null>(null);\n\n  useBeforeMount(() => {\n    match.value = createMatchDevice(config);\n  });\n\n  const matches = match.value as MatchDevice;\n  const [devices, setDevices] = useState<MatchDevicesResult>(matches.getDevices());\n\n  useEffect(() => {\n    matches.onChange(devices => setDevices(devices));\n  }, [matches]);\n\n  return Object.freeze({ devices, onMatch: matches.onMatch });\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAwBA,MAAa,kBAAkB,WAAyC;CACtE,MAAM,QAAQA,sBAAAA,OAA2B,IAAI;CAE7C,sCAAA,qBAAqB;EACnB,MAAM,SAAA,GAAA,eAAA,kBAAA,CAA0B,MAAM;CACxC,CAAC;CAED,MAAM,UAAU,MAAM;CACtB,MAAM,CAAC,SAAS,eAAA,GAAA,MAAA,SAAA,CAA2C,QAAQ,WAAW,CAAC;CAE/E,CAAA,GAAA,MAAA,UAAA,OAAgB;EACd,QAAQ,UAAS,YAAW,WAAW,OAAO,CAAC;CACjD,GAAG,CAAC,OAAO,CAAC;CAEZ,OAAO,OAAO,OAAO;EAAE;EAAS,SAAS,QAAQ;CAAQ,CAAC;AAC5D"}