{"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/Transitions/Slide.tsx\";\n\nimport React from 'react';\nimport { Slide, Button, Alert, VStack, Heading, Divider, Center, Text } from \"/Users/rohitsingh/Documents/projects/new-nativebase-setup/NativeBase/src/index\";\nexport var Example = function Example() {\n  var _React$useState = React.useState(false),\n      _React$useState2 = _slicedToArray(_React$useState, 2),\n      isOpenBottom = _React$useState2[0],\n      setIsOpenBottom = _React$useState2[1];\n\n  var _React$useState3 = React.useState(false),\n      _React$useState4 = _slicedToArray(_React$useState3, 2),\n      isOpenTop = _React$useState4[0],\n      setIsOpenTop = _React$useState4[1];\n\n  var str1 = \"\" + (isOpenTop ? 'Hide' : 'Show');\n  var str2 = \"\" + (isOpenBottom ? 'Hide' : 'Show');\n  return React.createElement(React.Fragment, null, React.createElement(Slide, {\n    in: isOpenBottom,\n    placement: \"bottom\"\n  }, React.createElement(Alert, {\n    justifyContent: \"center\",\n    mx: \"4\",\n    mt: \"auto\",\n    mb: \"4\",\n    status: \"success\"\n  }, React.createElement(Alert.Icon, null), React.createElement(Text, {\n    color: \"success.600\",\n    fontWeight: \"medium\"\n  }, \"Order placed successfully!\"))), React.createElement(Slide, {\n    in: isOpenTop,\n    placement: \"top\"\n  }, React.createElement(Alert, {\n    justifyContent: \"center\",\n    mx: \"4\",\n    mt: \"4\",\n    status: \"error\"\n  }, React.createElement(Alert.Icon, null), React.createElement(Text, {\n    color: \"error.600\",\n    fontWeight: \"medium\"\n  }, \"No Internet Connection\"))), React.createElement(VStack, {\n    space: 2.5,\n    w: {\n      base: '50%',\n      md: '25%'\n    },\n    alignItems: \"center\"\n  }, React.createElement(Center, {\n    w: \"100%\"\n  }, React.createElement(Heading, {\n    textAlign: \"center\",\n    size: \"md\",\n    mb: 4\n  }, \"Top\"), React.createElement(Button, {\n    w: \"100\",\n    onPress: function onPress() {\n      return setIsOpenTop(!isOpenTop);\n    },\n    mb: 5\n  }, str1), React.createElement(Divider, null)), React.createElement(Center, {\n    w: \"100%\"\n  }, React.createElement(Heading, {\n    textAlign: \"center\",\n    size: \"md\",\n    mb: 4\n  }, \"Bottom\"), React.createElement(Button, {\n    w: \"100\",\n    onPress: function onPress() {\n      return setIsOpenBottom(!isOpenBottom);\n    }\n  }, str2))));\n};","map":{"version":3,"sources":["/Users/rohitsingh/Documents/projects/new-nativebase-setup/NativeBase/example/storybook/stories/components/composites/Transitions/Slide.tsx"],"names":["React","Slide","Button","Alert","VStack","Heading","Divider","Center","Text","Example","useState","isOpenBottom","setIsOpenBottom","isOpenTop","setIsOpenTop","str1","str2","base","md"],"mappings":";;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SACEC,KADF,EAEEC,MAFF,EAGEC,KAHF,EAIEC,MAJF,EAKEC,OALF,EAMEC,OANF,EAOEC,MAPF,EAQEC,IARF;AAUA,OAAO,IAAMC,OAAO,GAAG,SAAVA,OAAU,GAAM;AAAA,wBACaT,KAAK,CAACU,QAAN,CAAe,KAAf,CADb;AAAA;AAAA,MACpBC,YADoB;AAAA,MACNC,eADM;;AAAA,yBAEOZ,KAAK,CAACU,QAAN,CAAe,KAAf,CAFP;AAAA;AAAA,MAEpBG,SAFoB;AAAA,MAETC,YAFS;;AAI3B,MAAMC,IAAI,SAAMF,SAAS,GAAG,MAAH,GAAY,MAA3B,CAAV;AACA,MAAMG,IAAI,SAAML,YAAY,GAAG,MAAH,GAAY,MAA9B,CAAV;AACA,SACE,0CACE,oBAAC,KAAD;AAAO,IAAA,EAAE,EAAEA,YAAX;AAAyB,IAAA,SAAS,EAAC;AAAnC,KACE,oBAAC,KAAD;AAAO,IAAA,cAAc,EAAC,QAAtB;AAA+B,IAAA,EAAE,EAAC,GAAlC;AAAsC,IAAA,EAAE,EAAC,MAAzC;AAAgD,IAAA,EAAE,EAAC,GAAnD;AAAuD,IAAA,MAAM,EAAC;AAA9D,KACE,oBAAC,KAAD,CAAO,IAAP,OADF,EAEE,oBAAC,IAAD;AAGE,IAAA,KAAK,EAAC,aAHR;AAIE,IAAA,UAAU,EAAC;AAJb,kCAFF,CADF,CADF,EAcE,oBAAC,KAAD;AAAO,IAAA,EAAE,EAAEE,SAAX;AAAsB,IAAA,SAAS,EAAC;AAAhC,KACE,oBAAC,KAAD;AAAO,IAAA,cAAc,EAAC,QAAtB;AAA+B,IAAA,EAAE,EAAC,GAAlC;AAAsC,IAAA,EAAE,EAAC,GAAzC;AAA6C,IAAA,MAAM,EAAC;AAApD,KACE,oBAAC,KAAD,CAAO,IAAP,OADF,EAGE,oBAAC,IAAD;AAAM,IAAA,KAAK,EAAC,WAAZ;AAAwB,IAAA,UAAU,EAAC;AAAnC,8BAHF,CADF,CAdF,EAwBE,oBAAC,MAAD;AAAQ,IAAA,KAAK,EAAE,GAAf;AAAoB,IAAA,CAAC,EAAE;AAAEI,MAAAA,IAAI,EAAE,KAAR;AAAeC,MAAAA,EAAE,EAAE;AAAnB,KAAvB;AAAmD,IAAA,UAAU,EAAC;AAA9D,KACE,oBAAC,MAAD;AAAQ,IAAA,CAAC,EAAC;AAAV,KACE,oBAAC,OAAD;AAAS,IAAA,SAAS,EAAC,QAAnB;AAA4B,IAAA,IAAI,EAAC,IAAjC;AAAsC,IAAA,EAAE,EAAE;AAA1C,WADF,EAIE,oBAAC,MAAD;AAAQ,IAAA,CAAC,EAAC,KAAV;AAAgB,IAAA,OAAO,EAAE;AAAA,aAAMJ,YAAY,CAAC,CAACD,SAAF,CAAlB;AAAA,KAAzB;AAAyD,IAAA,EAAE,EAAE;AAA7D,KACGE,IADH,CAJF,EAOE,oBAAC,OAAD,OAPF,CADF,EAUE,oBAAC,MAAD;AAAQ,IAAA,CAAC,EAAC;AAAV,KACE,oBAAC,OAAD;AAAS,IAAA,SAAS,EAAC,QAAnB;AAA4B,IAAA,IAAI,EAAC,IAAjC;AAAsC,IAAA,EAAE,EAAE;AAA1C,cADF,EAIE,oBAAC,MAAD;AAAQ,IAAA,CAAC,EAAC,KAAV;AAAgB,IAAA,OAAO,EAAE;AAAA,aAAMH,eAAe,CAAC,CAACD,YAAF,CAArB;AAAA;AAAzB,KACGK,IADH,CAJF,CAVF,CAxBF,CADF;AA+CD,CArDM","sourcesContent":["import React from 'react';\nimport {\n  Slide,\n  Button,\n  Alert,\n  VStack,\n  Heading,\n  Divider,\n  Center,\n  Text,\n} from 'native-base';\nexport const Example = () => {\n  const [isOpenBottom, setIsOpenBottom] = React.useState(false);\n  const [isOpenTop, setIsOpenTop] = React.useState(false);\n\n  const str1 = `${isOpenTop ? 'Hide' : 'Show'}`;\n  const str2 = `${isOpenBottom ? 'Hide' : 'Show'}`;\n  return (\n    <>\n      <Slide in={isOpenBottom} placement=\"bottom\">\n        <Alert justifyContent=\"center\" mx=\"4\" mt=\"auto\" mb=\"4\" status=\"success\">\n          <Alert.Icon />\n          <Text\n            // _light={{ color: 'success.600' }}\n            // _dark={{ color: 'success.100' }}\n            color=\"success.600\"\n            fontWeight=\"medium\"\n          >\n            Order placed successfully!\n          </Text>\n        </Alert>\n      </Slide>\n      <Slide in={isOpenTop} placement=\"top\">\n        <Alert justifyContent=\"center\" mx=\"4\" mt=\"4\" status=\"error\">\n          <Alert.Icon />\n\n          <Text color=\"error.600\" fontWeight=\"medium\">\n            No Internet Connection\n          </Text>\n        </Alert>\n      </Slide>\n\n      <VStack space={2.5} w={{ base: '50%', md: '25%' }} alignItems=\"center\">\n        <Center w=\"100%\">\n          <Heading textAlign=\"center\" size=\"md\" mb={4}>\n            Top\n          </Heading>\n          <Button w=\"100\" onPress={() => setIsOpenTop(!isOpenTop)} mb={5}>\n            {str1}\n          </Button>\n          <Divider />\n        </Center>\n        <Center w=\"100%\">\n          <Heading textAlign=\"center\" size=\"md\" mb={4}>\n            Bottom\n          </Heading>\n          <Button w=\"100\" onPress={() => setIsOpenBottom(!isOpenBottom)}>\n            {str2}\n            {/* Click Me to {isOpenBottom ? \"hide\" : \"show\"} Bottom Slider */}\n          </Button>\n        </Center>\n      </VStack>\n    </>\n  );\n};\n"]},"metadata":{},"sourceType":"module"}