{"ast":null,"code":"import _slicedToArray from \"@babel/runtime/helpers/slicedToArray\";\nimport React from 'react';\nimport { Modal, Button, ScrollView, Text, Heading, Center, VStack } from \"/Users/rohitsingh/Documents/projects/new-nativebase-setup/NativeBase/src/index\";\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { Fragment as _Fragment } from \"react/jsx-runtime\";\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  var _React$useState3 = React.useState('md'),\n      _React$useState4 = _slicedToArray(_React$useState3, 2),\n      size = _React$useState4[0],\n      setSize = _React$useState4[1];\n\n  var handleSizeClick = function handleSizeClick(newSize) {\n    setSize(newSize);\n    setModalVisible(!modalVisible);\n  };\n\n  return _jsxs(_Fragment, {\n    children: [_jsx(Modal, {\n      isOpen: modalVisible,\n      onClose: setModalVisible,\n      size: size,\n      children: _jsxs(Modal.Content, {\n        maxH: \"212\",\n        children: [_jsx(Modal.CloseButton, {}), _jsx(Modal.Header, {\n          children: \"Return Policy\"\n        }), _jsx(Modal.Body, {\n          children: _jsx(ScrollView, {\n            children: _jsx(Text, {\n              children: \"Create a 'Return Request' under \\u201CMy Orders\\u201D section of App/Website. Follow the screens that come up after tapping on the 'Return\\u2019 button. Please make a note of the Return ID that we generate at the end of the process. Keep the item ready for pick up or ship it to us basis on the return mode.\"\n            })\n          })\n        }), _jsx(Modal.Footer, {\n          children: _jsxs(Button.Group, {\n            space: 2,\n            children: [_jsx(Button, {\n              variant: \"ghost\",\n              colorScheme: \"blueGray\",\n              onPress: function onPress() {\n                setModalVisible(false);\n              },\n              children: \"Cancel\"\n            }), _jsx(Button, {\n              onPress: function onPress() {\n                setModalVisible(false);\n              },\n              children: \"Save\"\n            })]\n          })\n        })]\n      })\n    }), _jsxs(Center, {\n      children: [_jsx(Heading, {\n        mb: \"10\",\n        children: \"Sizes\"\n      }), _jsx(VStack, {\n        space: 2,\n        children: ['xs', 'sm', 'md', 'lg', 'xl', 'full'].map(function (size) {\n          return _jsx(Button, {\n            onPress: function onPress() {\n              return handleSizeClick(size);\n            },\n            children: \"Open \" + size + \" Modal\"\n          }, size);\n        })\n      })]\n    })]\n  });\n}","map":{"version":3,"sources":["/Users/rohitsingh/Documents/projects/new-nativebase-setup/NativeBase/example/storybook/stories/components/composites/Modal/Size.tsx"],"names":["React","Modal","Button","ScrollView","Text","Heading","Center","VStack","Example","useState","modalVisible","setModalVisible","size","setSize","handleSizeClick","newSize","map"],"mappings":";AACA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SACEC,KADF,EAEEC,MAFF,EAGEC,UAHF,EAIEC,IAJF,EAKEC,OALF,EAMEC,MANF,EAOEC,MAPF;;;;AAUA,OAAO,SAASC,OAAT,GAAmB;AAAA,wBACgBR,KAAK,CAACS,QAAN,CAAe,KAAf,CADhB;AAAA;AAAA,MACjBC,YADiB;AAAA,MACHC,eADG;;AAAA,yBAEAX,KAAK,CAACS,QAAN,CAAe,IAAf,CAFA;AAAA;AAAA,MAEjBG,IAFiB;AAAA,MAEXC,OAFW;;AAIxB,MAAMC,eAAe,GAAG,SAAlBA,eAAkB,CAACC,OAAD,EAAa;AACnCF,IAAAA,OAAO,CAACE,OAAD,CAAP;AACAJ,IAAAA,eAAe,CAAC,CAACD,YAAF,CAAf;AACD,GAHD;;AAIA,SACE;AAAA,eACE,KAAC,KAAD;AAAO,MAAA,MAAM,EAAEA,YAAf;AAA6B,MAAA,OAAO,EAAEC,eAAtC;AAAuD,MAAA,IAAI,EAAEC,IAA7D;AAAA,gBACE,MAAC,KAAD,CAAO,OAAP;AAAe,QAAA,IAAI,EAAC,KAApB;AAAA,mBACE,KAAC,KAAD,CAAO,WAAP,KADF,EAEE,KAAC,KAAD,CAAO,MAAP;AAAA;AAAA,UAFF,EAGE,KAAC,KAAD,CAAO,IAAP;AAAA,oBACE,KAAC,UAAD;AAAA,sBACE,KAAC,IAAD;AAAA;AAAA;AADF;AADF,UAHF,EAcE,KAAC,KAAD,CAAO,MAAP;AAAA,oBACE,MAAC,MAAD,CAAQ,KAAR;AAAc,YAAA,KAAK,EAAE,CAArB;AAAA,uBACE,KAAC,MAAD;AACE,cAAA,OAAO,EAAC,OADV;AAEE,cAAA,WAAW,EAAC,UAFd;AAGE,cAAA,OAAO,EAAE,mBAAM;AACbD,gBAAAA,eAAe,CAAC,KAAD,CAAf;AACD,eALH;AAAA;AAAA,cADF,EAUE,KAAC,MAAD;AACE,cAAA,OAAO,EAAE,mBAAM;AACbA,gBAAAA,eAAe,CAAC,KAAD,CAAf;AACD,eAHH;AAAA;AAAA,cAVF;AAAA;AADF,UAdF;AAAA;AADF,MADF,EAsCE,MAAC,MAAD;AAAA,iBACE,KAAC,OAAD;AAAS,QAAA,EAAE,EAAC,IAAZ;AAAA;AAAA,QADF,EAEE,KAAC,MAAD;AAAQ,QAAA,KAAK,EAAE,CAAf;AAAA,kBACG,CAAC,IAAD,EAAO,IAAP,EAAa,IAAb,EAAmB,IAAnB,EAAyB,IAAzB,EAA+B,MAA/B,EAAuCK,GAAvC,CAA2C,UAACJ,IAAD,EAAU;AACpD,iBACE,KAAC,MAAD;AACE,YAAA,OAAO,EAAE;AAAA,qBAAME,eAAe,CAACF,IAAD,CAArB;AAAA,aADX;AAAA,gCAGUA,IAHV;AAAA,aAEOA,IAFP,CADF;AAMD,SAPA;AADH,QAFF;AAAA,MAtCF;AAAA,IADF;AAsDD","sourcesContent":["// @ts-nocheck\nimport React from 'react';\nimport {\n  Modal,\n  Button,\n  ScrollView,\n  Text,\n  Heading,\n  Center,\n  VStack,\n} from 'native-base';\n\nexport function Example() {\n  const [modalVisible, setModalVisible] = React.useState(false);\n  const [size, setSize] = React.useState('md');\n\n  const handleSizeClick = (newSize) => {\n    setSize(newSize);\n    setModalVisible(!modalVisible);\n  };\n  return (\n    <>\n      <Modal isOpen={modalVisible} onClose={setModalVisible} size={size}>\n        <Modal.Content maxH=\"212\">\n          <Modal.CloseButton />\n          <Modal.Header>Return Policy</Modal.Header>\n          <Modal.Body>\n            <ScrollView>\n              <Text>\n                Create a 'Return Request' under “My Orders” section of\n                App/Website. Follow the screens that come up after tapping on\n                the 'Return’ button. Please make a note of the Return ID that we\n                generate at the end of the process. Keep the item ready for pick\n                up or ship it to us basis on the return mode.\n              </Text>\n            </ScrollView>\n          </Modal.Body>\n          <Modal.Footer>\n            <Button.Group space={2}>\n              <Button\n                variant=\"ghost\"\n                colorScheme=\"blueGray\"\n                onPress={() => {\n                  setModalVisible(false);\n                }}\n              >\n                Cancel\n              </Button>\n              <Button\n                onPress={() => {\n                  setModalVisible(false);\n                }}\n              >\n                Save\n              </Button>\n            </Button.Group>\n          </Modal.Footer>\n        </Modal.Content>\n      </Modal>\n      <Center>\n        <Heading mb=\"10\">Sizes</Heading>\n        <VStack space={2}>\n          {['xs', 'sm', 'md', 'lg', 'xl', 'full'].map((size) => {\n            return (\n              <Button\n                onPress={() => handleSizeClick(size)}\n                key={size}\n              >{`Open ${size} Modal`}</Button>\n            );\n          })}\n        </VStack>\n      </Center>\n    </>\n  );\n}\n"]},"metadata":{},"sourceType":"module"}