{"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/components/composites/Skeleton/isLoaded.tsx\";\n\nimport React, { useState } from 'react';\nimport { Skeleton, Text, Button, Box, Image, VStack, Center } from \"/Users/rohitsingh/Documents/projects/new-nativebase-setup/NativeBase/src/index\";\nexport var Example = function Example() {\n  var _useState = useState(false),\n      _useState2 = _slicedToArray(_useState, 2),\n      isLoaded = _useState2[0],\n      setIsLoaded = _useState2[1];\n\n  var _useState3 = useState(''),\n      _useState4 = _slicedToArray(_useState3, 2),\n      text = _useState4[0],\n      setText = _useState4[1];\n\n  setTimeout(function () {\n    setIsLoaded(true);\n    setText('Lose yourself in the greens of nature, the ones that make you strong. Come visit us at the Greenway Park, and we will be happy to show you around.');\n  }, 5000);\n  return React.createElement(Center, null, React.createElement(Box, {\n    w: \"90%\",\n    maxWidth: \"400\"\n  }, React.createElement(VStack, {\n    w: \"400\",\n    borderWidth: \"1\",\n    space: 8,\n    overflow: \"hidden\",\n    rounded: \"md\",\n    borderColor: \"coolGray.400\"\n  }, React.createElement(Skeleton, {\n    h: \"40\",\n    isLoaded: isLoaded\n  }, React.createElement(Image, {\n    h: \"40\",\n    source: {\n      uri: 'https://images.unsplash.com/photo-1447752875215-b2761acb3c5d?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2940&q=80'\n    }\n  })), React.createElement(Skeleton.Text, {\n    lines: 4,\n    px: \"4\",\n    isLoaded: isLoaded\n  }, React.createElement(Text, {\n    px: \"4\",\n    fontSize: 'md',\n    lineHeight: '20px'\n  }, text)), React.createElement(Skeleton, {\n    px: \"4\",\n    mb: \"4\",\n    rounded: \"md\",\n    startColor: \"primary.100\",\n    isLoaded: isLoaded\n  }, React.createElement(Button, {\n    m: \"4\"\n  }, \"Explore\")))));\n};","map":{"version":3,"sources":["/Users/rohitsingh/Documents/projects/new-nativebase-setup/NativeBase/example/storybook/stories/components/composites/Skeleton/isLoaded.tsx"],"names":["React","useState","Skeleton","Text","Button","Box","Image","VStack","Center","Example","isLoaded","setIsLoaded","text","setText","setTimeout","uri"],"mappings":";;;;;AAAA,OAAOA,KAAP,IAAgBC,QAAhB,QAAgC,OAAhC;AACA,SACEC,QADF,EAEEC,IAFF,EAGEC,MAHF,EAIEC,GAJF,EAKEC,KALF,EAMEC,MANF,EAOEC,MAPF;AASA,OAAO,IAAMC,OAAO,GAAG,SAAVA,OAAU,GAAM;AAAA,kBACKR,QAAQ,CAAC,KAAD,CADb;AAAA;AAAA,MACpBS,QADoB;AAAA,MACVC,WADU;;AAAA,mBAEHV,QAAQ,CAAC,EAAD,CAFL;AAAA;AAAA,MAEpBW,IAFoB;AAAA,MAEdC,OAFc;;AAG3BC,EAAAA,UAAU,CAAC,YAAM;AACfH,IAAAA,WAAW,CAAC,IAAD,CAAX;AACAE,IAAAA,OAAO,CACL,oJADK,CAAP;AAGD,GALS,EAKP,IALO,CAAV;AAOA,SACE,oBAAC,MAAD,QACE,oBAAC,GAAD;AAAK,IAAA,CAAC,EAAC,KAAP;AAAa,IAAA,QAAQ,EAAC;AAAtB,KACE,oBAAC,MAAD;AACE,IAAA,CAAC,EAAC,KADJ;AAEE,IAAA,WAAW,EAAC,GAFd;AAGE,IAAA,KAAK,EAAE,CAHT;AAIE,IAAA,QAAQ,EAAC,QAJX;AAKE,IAAA,OAAO,EAAC,IALV;AAME,IAAA,WAAW,EAAC;AANd,KAQE,oBAAC,QAAD;AAAU,IAAA,CAAC,EAAC,IAAZ;AAAiB,IAAA,QAAQ,EAAEH;AAA3B,KACE,oBAAC,KAAD;AACE,IAAA,CAAC,EAAC,IADJ;AAEE,IAAA,MAAM,EAAE;AACNK,MAAAA,GAAG,EACD;AAFI;AAFV,IADF,CARF,EAiBE,oBAAC,QAAD,CAAU,IAAV;AAAe,IAAA,KAAK,EAAE,CAAtB;AAAyB,IAAA,EAAE,EAAC,GAA5B;AAAgC,IAAA,QAAQ,EAAEL;AAA1C,KACE,oBAAC,IAAD;AAAM,IAAA,EAAE,EAAC,GAAT;AAAa,IAAA,QAAQ,EAAE,IAAvB;AAA6B,IAAA,UAAU,EAAE;AAAzC,KACGE,IADH,CADF,CAjBF,EAsBE,oBAAC,QAAD;AACE,IAAA,EAAE,EAAC,GADL;AAEE,IAAA,EAAE,EAAC,GAFL;AAGE,IAAA,OAAO,EAAC,IAHV;AAIE,IAAA,UAAU,EAAC,aAJb;AAKE,IAAA,QAAQ,EAAEF;AALZ,KAOE,oBAAC,MAAD;AAAQ,IAAA,CAAC,EAAC;AAAV,eAPF,CAtBF,CADF,CADF,CADF;AAsCD,CAhDM","sourcesContent":["import React, { useState } from 'react';\nimport {\n  Skeleton,\n  Text,\n  Button,\n  Box,\n  Image,\n  VStack,\n  Center,\n} from 'native-base';\nexport const Example = () => {\n  const [isLoaded, setIsLoaded] = useState(false);\n  const [text, setText] = useState('');\n  setTimeout(() => {\n    setIsLoaded(true);\n    setText(\n      'Lose yourself in the greens of nature, the ones that make you strong. Come visit us at the Greenway Park, and we will be happy to show you around.'\n    );\n  }, 5000);\n\n  return (\n    <Center>\n      <Box w=\"90%\" maxWidth=\"400\">\n        <VStack\n          w=\"400\"\n          borderWidth=\"1\"\n          space={8}\n          overflow=\"hidden\"\n          rounded=\"md\"\n          borderColor=\"coolGray.400\"\n        >\n          <Skeleton h=\"40\" isLoaded={isLoaded}>\n            <Image\n              h=\"40\"\n              source={{\n                uri:\n                  'https://images.unsplash.com/photo-1447752875215-b2761acb3c5d?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2940&q=80',\n              }}\n            />\n          </Skeleton>\n          <Skeleton.Text lines={4} px=\"4\" isLoaded={isLoaded}>\n            <Text px=\"4\" fontSize={'md'} lineHeight={'20px'}>\n              {text}\n            </Text>\n          </Skeleton.Text>\n          <Skeleton\n            px=\"4\"\n            mb=\"4\"\n            rounded=\"md\"\n            startColor=\"primary.100\"\n            isLoaded={isLoaded}\n          >\n            <Button m=\"4\">Explore</Button>\n          </Skeleton>\n        </VStack>\n      </Box>\n    </Center>\n  );\n};\n"]},"metadata":{},"sourceType":"module"}