{"ast":null,"code":"import _slicedToArray from \"@babel/runtime/helpers/slicedToArray\";\n\nvar _this = this,\n    _jsxFileName = \"/Users/rohitsingh/Documents/projects/new-nativebase-setup/NativeBase/example/storybook/stories/hooks/useMediaQuery/min-width.tsx\";\n\nimport React from 'react';\nimport { useMediaQuery, HStack, VStack, Center, Skeleton } from \"/Users/rohitsingh/Documents/projects/new-nativebase-setup/NativeBase/src/index\";\nexport var Example = function Example() {\n  var _useMediaQuery = useMediaQuery({\n    minWidth: 280\n  }),\n      _useMediaQuery2 = _slicedToArray(_useMediaQuery, 1),\n      isSmallScreen = _useMediaQuery2[0];\n\n  return React.createElement(Center, {\n    w: \"100%\"\n  }, isSmallScreen ? React.createElement(HStack, {\n    w: \"90%\",\n    maxW: \"400\",\n    borderWidth: \"1\",\n    space: 8,\n    rounded: \"md\",\n    borderColor: \"coolGray.400\",\n    p: \"4\"\n  }, React.createElement(VStack, {\n    flex: \"3\",\n    space: \"4\"\n  }, React.createElement(Skeleton, null), React.createElement(Skeleton.Text, null), React.createElement(HStack, {\n    space: \"2\",\n    alignItems: \"center\"\n  }, React.createElement(Skeleton, {\n    size: \"5\",\n    rounded: \"full\"\n  }), React.createElement(Skeleton, {\n    h: \"3\",\n    flex: \"2\",\n    rounded: \"full\"\n  }), React.createElement(Skeleton, {\n    h: \"3\",\n    flex: \"1\",\n    rounded: \"full\"\n  })))) : React.createElement(HStack, {\n    w: \"90%\",\n    maxW: \"400\",\n    borderWidth: \"1\",\n    space: 8,\n    rounded: \"md\",\n    borderColor: \"coolGray.400\",\n    p: \"4\"\n  }, React.createElement(Skeleton, {\n    flex: \"1\",\n    h: \"150\",\n    rounded: \"md\"\n  }), React.createElement(VStack, {\n    flex: \"3\",\n    space: \"4\"\n  }, React.createElement(Skeleton, null), React.createElement(Skeleton.Text, null), React.createElement(HStack, {\n    space: \"2\",\n    alignItems: \"center\"\n  }, React.createElement(Skeleton, {\n    size: \"5\",\n    rounded: \"full\"\n  }), React.createElement(Skeleton, {\n    h: \"3\",\n    flex: \"2\",\n    rounded: \"full\"\n  }), React.createElement(Skeleton, {\n    h: \"3\",\n    flex: \"1\",\n    rounded: \"full\"\n  })))));\n};","map":{"version":3,"sources":["/Users/rohitsingh/Documents/projects/new-nativebase-setup/NativeBase/example/storybook/stories/hooks/useMediaQuery/min-width.tsx"],"names":["React","useMediaQuery","HStack","VStack","Center","Skeleton","Example","minWidth","isSmallScreen"],"mappings":";;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,aAAT,EAAwBC,MAAxB,EAAgCC,MAAhC,EAAwCC,MAAxC,EAAgDC,QAAhD;AAEA,OAAO,IAAMC,OAAO,GAAG,SAAVA,OAAU,GAAM;AAAA,uBACHL,aAAa,CAAC;AACpCM,IAAAA,QAAQ,EAAE;AAD0B,GAAD,CADV;AAAA;AAAA,MACpBC,aADoB;;AAI3B,SACE,oBAAC,MAAD;AAAQ,IAAA,CAAC,EAAC;AAAV,KACGA,aAAa,GACZ,oBAAC,MAAD;AACE,IAAA,CAAC,EAAC,KADJ;AAEE,IAAA,IAAI,EAAC,KAFP;AAGE,IAAA,WAAW,EAAC,GAHd;AAIE,IAAA,KAAK,EAAE,CAJT;AAKE,IAAA,OAAO,EAAC,IALV;AAME,IAAA,WAAW,EAAC,cANd;AAOE,IAAA,CAAC,EAAC;AAPJ,KASE,oBAAC,MAAD;AAAQ,IAAA,IAAI,EAAC,GAAb;AAAiB,IAAA,KAAK,EAAC;AAAvB,KACE,oBAAC,QAAD,OADF,EAEE,oBAAC,QAAD,CAAU,IAAV,OAFF,EAGE,oBAAC,MAAD;AAAQ,IAAA,KAAK,EAAC,GAAd;AAAkB,IAAA,UAAU,EAAC;AAA7B,KACE,oBAAC,QAAD;AAAU,IAAA,IAAI,EAAC,GAAf;AAAmB,IAAA,OAAO,EAAC;AAA3B,IADF,EAEE,oBAAC,QAAD;AAAU,IAAA,CAAC,EAAC,GAAZ;AAAgB,IAAA,IAAI,EAAC,GAArB;AAAyB,IAAA,OAAO,EAAC;AAAjC,IAFF,EAGE,oBAAC,QAAD;AAAU,IAAA,CAAC,EAAC,GAAZ;AAAgB,IAAA,IAAI,EAAC,GAArB;AAAyB,IAAA,OAAO,EAAC;AAAjC,IAHF,CAHF,CATF,CADY,GAqBZ,oBAAC,MAAD;AACE,IAAA,CAAC,EAAC,KADJ;AAEE,IAAA,IAAI,EAAC,KAFP;AAGE,IAAA,WAAW,EAAC,GAHd;AAIE,IAAA,KAAK,EAAE,CAJT;AAKE,IAAA,OAAO,EAAC,IALV;AAME,IAAA,WAAW,EAAC,cANd;AAOE,IAAA,CAAC,EAAC;AAPJ,KASE,oBAAC,QAAD;AAAU,IAAA,IAAI,EAAC,GAAf;AAAmB,IAAA,CAAC,EAAC,KAArB;AAA2B,IAAA,OAAO,EAAC;AAAnC,IATF,EAUE,oBAAC,MAAD;AAAQ,IAAA,IAAI,EAAC,GAAb;AAAiB,IAAA,KAAK,EAAC;AAAvB,KACE,oBAAC,QAAD,OADF,EAEE,oBAAC,QAAD,CAAU,IAAV,OAFF,EAGE,oBAAC,MAAD;AAAQ,IAAA,KAAK,EAAC,GAAd;AAAkB,IAAA,UAAU,EAAC;AAA7B,KACE,oBAAC,QAAD;AAAU,IAAA,IAAI,EAAC,GAAf;AAAmB,IAAA,OAAO,EAAC;AAA3B,IADF,EAEE,oBAAC,QAAD;AAAU,IAAA,CAAC,EAAC,GAAZ;AAAgB,IAAA,IAAI,EAAC,GAArB;AAAyB,IAAA,OAAO,EAAC;AAAjC,IAFF,EAGE,oBAAC,QAAD;AAAU,IAAA,CAAC,EAAC,GAAZ;AAAgB,IAAA,IAAI,EAAC,GAArB;AAAyB,IAAA,OAAO,EAAC;AAAjC,IAHF,CAHF,CAVF,CAtBJ,CADF;AA8CD,CAlDM","sourcesContent":["import React from 'react';\nimport { useMediaQuery, HStack, VStack, Center, Skeleton } from 'native-base';\n\nexport const Example = () => {\n  const [isSmallScreen] = useMediaQuery({\n    minWidth: 280,\n  });\n  return (\n    <Center w=\"100%\">\n      {isSmallScreen ? (\n        <HStack\n          w=\"90%\"\n          maxW=\"400\"\n          borderWidth=\"1\"\n          space={8}\n          rounded=\"md\"\n          borderColor=\"coolGray.400\"\n          p=\"4\"\n        >\n          <VStack flex=\"3\" space=\"4\">\n            <Skeleton />\n            <Skeleton.Text />\n            <HStack space=\"2\" alignItems=\"center\">\n              <Skeleton size=\"5\" rounded=\"full\" />\n              <Skeleton h=\"3\" flex=\"2\" rounded=\"full\" />\n              <Skeleton h=\"3\" flex=\"1\" rounded=\"full\" />\n            </HStack>\n          </VStack>\n        </HStack>\n      ) : (\n        <HStack\n          w=\"90%\"\n          maxW=\"400\"\n          borderWidth=\"1\"\n          space={8}\n          rounded=\"md\"\n          borderColor=\"coolGray.400\"\n          p=\"4\"\n        >\n          <Skeleton flex=\"1\" h=\"150\" rounded=\"md\" />\n          <VStack flex=\"3\" space=\"4\">\n            <Skeleton />\n            <Skeleton.Text />\n            <HStack space=\"2\" alignItems=\"center\">\n              <Skeleton size=\"5\" rounded=\"full\" />\n              <Skeleton h=\"3\" flex=\"2\" rounded=\"full\" />\n              <Skeleton h=\"3\" flex=\"1\" rounded=\"full\" />\n            </HStack>\n          </VStack>\n        </HStack>\n      )}\n    </Center>\n  );\n};\n"]},"metadata":{},"sourceType":"module"}