{"version":3,"sources":["../src/utils/constants/hooks/breakpoints.ts","../src/hooks/useBreakpoint.ts"],"names":["BREAKPOINTS","useMedia","atom","useRecoilValue","useSetRecoilState","USE_BREAKPOINTS","useBreakpoint","env","useXoraiaValue","breakpoint","mobile","tablet","desktop"],"mappings":"yCAYO,IAAMA,EAA2B,CACtC,OAAQ,CACN,KAAM,gBACN,MAAO,IACP,YAAa,IACb,aAAc,GAChB,EACA,OAAQ,CACN,KAAM,iBACN,MAAO,IACP,YAAa,IACb,aAAc,IAChB,EACA,QAAS,CACP,KAAM,WACN,MAAO,KACP,YAAa,IACf,EACA,IAAK,CAAE,KAAM,IAAK,CACpB,EC/BA,OAAS,YAAAC,MAAgB,YACzB,OAAS,QAAAC,EAAM,kBAAAC,EAAgB,qBAAAC,MAAyB,SAOjD,IAAMC,EAAkBH,EAAwB,CACrD,IAAK,kBACL,QAAS,KACX,CAAC,EAEYI,EAAgB,IAAyB,CACpD,GAAM,CAAE,IAAAC,CAAI,EAAIC,EAAe,EACzBC,EAAaN,EAAeE,CAAe,EAE3CK,EAAST,EACb,eAAeD,EAAY,OAAO,OAAS,OAC3C,EACF,EAEMW,EAASV,EACb,eAAeD,EAAY,OAAO,OAAS,OAC3C,EACF,EAEMY,EAAUX,EACd,eAAeD,EAAY,QAAQ,OAAS,OAC5C,EACF,EAEA,GAAIO,IAAQ,OAAQ,CAClB,GAAIG,EACF,MAAO,SAGT,GAAIC,EACF,MAAO,SAGT,GAAIC,EACF,MAAO,SAEX,CAEA,OAAOH,CACT","sourcesContent":["export type TBreakpointLabels = \"mobile\" | \"tablet\" | \"desktop\" | \"all\";\n\nexport type TBreakpoint = {\n  [name in TBreakpointLabels]: {\n    label?: string;\n    icon: string;\n    width?: number;\n    deviceWidth?: number;\n    deviceHeight?: number;\n  };\n};\n\nexport const BREAKPOINTS: TBreakpoint = {\n  mobile: {\n    icon: \"phone_android\",\n    width: 600,\n    deviceWidth: 375,\n    deviceHeight: 667,\n  },\n  tablet: {\n    icon: \"tablet_android\",\n    width: 900,\n    deviceWidth: 820,\n    deviceHeight: 1180,\n  },\n  desktop: {\n    icon: \"computer\",\n    width: 1200,\n    deviceWidth: 1024,\n  },\n  all: { icon: \"tv\" },\n};\n","import { useMedia } from \"react-use\";\nimport { atom, useRecoilValue, useSetRecoilState } from \"recoil\";\nimport {\n  BREAKPOINTS,\n  TBreakpointLabels,\n} from \"../utils/constants/hooks/breakpoints\";\nimport { useXoraiaValue } from \"./useXoraia\";\n\nexport const USE_BREAKPOINTS = atom<TBreakpointLabels>({\n  key: \"USE_BREAKPOINTS\",\n  default: \"all\",\n});\n\nexport const useBreakpoint = (): TBreakpointLabels => {\n  const { env } = useXoraiaValue();\n  const breakpoint = useRecoilValue(USE_BREAKPOINTS);\n\n  const mobile = useMedia(\n    `(max-width: ${BREAKPOINTS.mobile.width ?? 0}px)`,\n    false\n  );\n\n  const tablet = useMedia(\n    `(max-width: ${BREAKPOINTS.tablet.width ?? 0}px)`,\n    false\n  );\n\n  const desktop = useMedia(\n    `(max-width: ${BREAKPOINTS.desktop.width ?? 0}px)`,\n    false\n  );\n\n  if (env === \"prod\") {\n    if (mobile) {\n      return \"mobile\";\n    }\n\n    if (tablet) {\n      return \"tablet\";\n    }\n\n    if (desktop) {\n      return \"desktop\";\n    }\n  }\n\n  return breakpoint;\n};\n\nexport const useBreakpointUpdater = () => useSetRecoilState(USE_BREAKPOINTS);\n"]}