{"ast":null,"code":"import _slicedToArray from \"@babel/runtime/helpers/slicedToArray\";\nimport React from 'react';\nimport { Modal, Button, Input, VStack, Text, FormControl } from \"/Users/rohitsingh/Documents/projects/new-nativebase-setup/NativeBase/src/index\";\nexport function Example() {\n  var _React$useState = React.useState(false),\n      _React$useState2 = _slicedToArray(_React$useState, 2),\n      modalVisible = _React$useState2[0],\n      setModalVisible = _React$useState2[1];\n\n  return React.createElement(React.Fragment, null, React.createElement(Modal, {\n    isOpen: modalVisible,\n    onClose: function onClose() {\n      return setModalVisible(false);\n    },\n    avoidKeyboard: true,\n    justifyContent: \"flex-end\",\n    bottom: \"4\",\n    size: \"lg\"\n  }, React.createElement(Modal.Content, null, React.createElement(Modal.CloseButton, null), React.createElement(Modal.Header, null, \"Forgot Password?\"), React.createElement(Modal.Body, null, \"Enter email address and we'll send a link to reset your password.\", React.createElement(FormControl, {\n    mt: \"3\"\n  }, React.createElement(FormControl.Label, null, \"Email\"), React.createElement(Input, null))), React.createElement(Modal.Footer, null, React.createElement(Button, {\n    flex: \"1\",\n    onPress: function onPress() {\n      setModalVisible(false);\n    }\n  }, \"Proceed\")))), React.createElement(VStack, {\n    space: 8,\n    alignItems: \"center\"\n  }, React.createElement(Button, {\n    w: \"104\",\n    onPress: function onPress() {\n      setModalVisible(!modalVisible);\n    }\n  }, \"Open Modal\"), React.createElement(Text, {\n    textAlign: \"center\"\n  }, \"Open modal and focus on the input element to see the effect.\")));\n}","map":{"version":3,"sources":["/Users/rohitsingh/Documents/projects/new-nativebase-setup/NativeBase/example/storybook/stories/components/composites/Modal/ModalWithAvoidKeyboard.tsx"],"names":["React","Modal","Button","Input","VStack","Text","FormControl","Example","useState","modalVisible","setModalVisible"],"mappings":";AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,KAAT,EAAgBC,MAAhB,EAAwBC,KAAxB,EAA+BC,MAA/B,EAAuCC,IAAvC,EAA6CC,WAA7C;AAEA,OAAO,SAASC,OAAT,GAAmB;AAAA,wBACgBP,KAAK,CAACQ,QAAN,CAAe,KAAf,CADhB;AAAA;AAAA,MACjBC,YADiB;AAAA,MACHC,eADG;;AAExB,SACE,0CACE,oBAAC,KAAD;AACE,IAAA,MAAM,EAAED,YADV;AAEE,IAAA,OAAO,EAAE;AAAA,aAAMC,eAAe,CAAC,KAAD,CAArB;AAAA,KAFX;AAGE,IAAA,aAAa,MAHf;AAIE,IAAA,cAAc,EAAC,UAJjB;AAKE,IAAA,MAAM,EAAC,GALT;AAME,IAAA,IAAI,EAAC;AANP,KAQE,oBAAC,KAAD,CAAO,OAAP,QACE,oBAAC,KAAD,CAAO,WAAP,OADF,EAEE,oBAAC,KAAD,CAAO,MAAP,2BAFF,EAGE,oBAAC,KAAD,CAAO,IAAP,6EAEE,oBAAC,WAAD;AAAa,IAAA,EAAE,EAAC;AAAhB,KACE,oBAAC,WAAD,CAAa,KAAb,gBADF,EAEE,oBAAC,KAAD,OAFF,CAFF,CAHF,EAUE,oBAAC,KAAD,CAAO,MAAP,QACE,oBAAC,MAAD;AACE,IAAA,IAAI,EAAC,GADP;AAEE,IAAA,OAAO,EAAE,mBAAM;AACbA,MAAAA,eAAe,CAAC,KAAD,CAAf;AACD;AAJH,eADF,CAVF,CARF,CADF,EA+BE,oBAAC,MAAD;AAAQ,IAAA,KAAK,EAAE,CAAf;AAAkB,IAAA,UAAU,EAAC;AAA7B,KACE,oBAAC,MAAD;AACE,IAAA,CAAC,EAAC,KADJ;AAEE,IAAA,OAAO,EAAE,mBAAM;AACbA,MAAAA,eAAe,CAAC,CAACD,YAAF,CAAf;AACD;AAJH,kBADF,EASE,oBAAC,IAAD;AAAM,IAAA,SAAS,EAAC;AAAhB,oEATF,CA/BF,CADF;AA+CD","sourcesContent":["import React from 'react';\nimport { Modal, Button, Input, VStack, Text, FormControl } from 'native-base';\n\nexport function Example() {\n  const [modalVisible, setModalVisible] = React.useState(false);\n  return (\n    <>\n      <Modal\n        isOpen={modalVisible}\n        onClose={() => setModalVisible(false)}\n        avoidKeyboard\n        justifyContent=\"flex-end\"\n        bottom=\"4\"\n        size=\"lg\"\n      >\n        <Modal.Content>\n          <Modal.CloseButton />\n          <Modal.Header>Forgot Password?</Modal.Header>\n          <Modal.Body>\n            Enter email address and we'll send a link to reset your password.\n            <FormControl mt=\"3\">\n              <FormControl.Label>Email</FormControl.Label>\n              <Input />\n            </FormControl>\n          </Modal.Body>\n          <Modal.Footer>\n            <Button\n              flex=\"1\"\n              onPress={() => {\n                setModalVisible(false);\n              }}\n            >\n              Proceed\n            </Button>\n          </Modal.Footer>\n        </Modal.Content>\n      </Modal>\n      <VStack space={8} alignItems=\"center\">\n        <Button\n          w=\"104\"\n          onPress={() => {\n            setModalVisible(!modalVisible);\n          }}\n        >\n          Open Modal\n        </Button>\n        <Text textAlign=\"center\">\n          Open modal and focus on the input element to see the effect.\n        </Text>\n      </VStack>\n    </>\n  );\n}\n"]},"metadata":{},"sourceType":"module"}