{"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/orientation.tsx\";\n\nimport React from 'react';\nimport { useMediaQuery, VStack, Skeleton, Center, HStack } from \"/Users/rohitsingh/Documents/projects/new-nativebase-setup/NativeBase/src/index\";\nexport var Example = function Example() {\n  var _useMediaQuery = useMediaQuery([{\n    orientation: 'landscape'\n  }, {\n    orientation: 'portrait'\n  }]),\n      _useMediaQuery2 = _slicedToArray(_useMediaQuery, 2),\n      isLandScape = _useMediaQuery2[0],\n      isPortrait = _useMediaQuery2[1];\n\n  return React.createElement(Center, {\n    w: \"100%\"\n  }, isPortrait && 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  })))), isLandScape && 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/orientation.tsx"],"names":["React","useMediaQuery","VStack","Skeleton","Center","HStack","Example","orientation","isLandScape","isPortrait"],"mappings":";;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,aAAT,EAAwBC,MAAxB,EAAgCC,QAAhC,EAA0CC,MAA1C,EAAkDC,MAAlD;AAEA,OAAO,IAAMC,OAAO,GAAG,SAAVA,OAAU,GAAM;AAAA,uBACOL,aAAa,CAAC,CAC9C;AAAEM,IAAAA,WAAW,EAAE;AAAf,GAD8C,EAE9C;AAAEA,IAAAA,WAAW,EAAE;AAAf,GAF8C,CAAD,CADpB;AAAA;AAAA,MACpBC,WADoB;AAAA,MACPC,UADO;;AAK3B,SACE,oBAAC,MAAD;AAAQ,IAAA,CAAC,EAAC;AAAV,KACGA,UAAU,IACT,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,CAFJ,EAsBGD,WAAW,IACV,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,CAvBJ,CADF;AA+CD,CApDM","sourcesContent":["import React from 'react';\nimport { useMediaQuery, VStack, Skeleton, Center, HStack } from 'native-base';\n\nexport const Example = () => {\n  const [isLandScape, isPortrait] = useMediaQuery([\n    { orientation: 'landscape' },\n    { orientation: 'portrait' },\n  ]);\n  return (\n    <Center w=\"100%\">\n      {isPortrait && (\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      {isLandScape && (\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"}