{"ast":null,"code":"import _slicedToArray from \"@babel/runtime/helpers/slicedToArray\";\nimport React from 'react';\nimport { Button, Modal, VStack, HStack, Text, Radio } from \"/Users/rohitsingh/Documents/projects/new-nativebase-setup/NativeBase/src/index\";\nimport { useState } from 'react';\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 var Example = function Example() {\n  var _useState = useState(false),\n      _useState2 = _slicedToArray(_useState, 2),\n      showModal = _useState2[0],\n      setShowModal = _useState2[1];\n\n  var _useState3 = useState(false),\n      _useState4 = _slicedToArray(_useState3, 2),\n      showModal2 = _useState4[0],\n      setShowModal2 = _useState4[1];\n\n  var _useState5 = useState(false),\n      _useState6 = _slicedToArray(_useState5, 2),\n      showModal3 = _useState6[0],\n      setShowModal3 = _useState6[1];\n\n  return _jsxs(_Fragment, {\n    children: [_jsx(Button, {\n      onPress: function onPress() {\n        return setShowModal(true);\n      },\n      children: \"Button\"\n    }), _jsx(Modal, {\n      isOpen: showModal,\n      onClose: function onClose() {\n        return setShowModal(false);\n      },\n      size: \"lg\",\n      children: _jsxs(Modal.Content, {\n        maxWidth: \"350\",\n        children: [_jsx(Modal.CloseButton, {}), _jsx(Modal.Header, {\n          children: \"Order\"\n        }), _jsx(Modal.Body, {\n          children: _jsxs(VStack, {\n            space: 3,\n            children: [_jsxs(HStack, {\n              alignItems: \"center\",\n              justifyContent: \"space-between\",\n              children: [_jsx(Text, {\n                fontWeight: \"medium\",\n                children: \"Sub Total\"\n              }), _jsx(Text, {\n                color: \"blueGray.400\",\n                children: \"$298.77\"\n              })]\n            }), _jsxs(HStack, {\n              alignItems: \"center\",\n              justifyContent: \"space-between\",\n              children: [_jsx(Text, {\n                fontWeight: \"medium\",\n                children: \"Tax\"\n              }), _jsx(Text, {\n                color: \"blueGray.400\",\n                children: \"$38.84\"\n              })]\n            }), _jsxs(HStack, {\n              alignItems: \"center\",\n              justifyContent: \"space-between\",\n              children: [_jsx(Text, {\n                fontWeight: \"medium\",\n                children: \"Total Amount\"\n              }), _jsx(Text, {\n                color: \"green.500\",\n                children: \"$337.61\"\n              })]\n            })]\n          })\n        }), _jsx(Modal.Footer, {\n          children: _jsx(Button, {\n            flex: \"1\",\n            onPress: function onPress() {\n              setShowModal2(true);\n            },\n            children: \"Continue\"\n          })\n        })]\n      })\n    }), _jsx(Modal, {\n      isOpen: showModal2,\n      onClose: function onClose() {\n        return setShowModal2(false);\n      },\n      size: \"lg\",\n      children: _jsxs(Modal.Content, {\n        maxWidth: \"350\",\n        children: [_jsx(Modal.CloseButton, {}), _jsx(Modal.Header, {\n          children: \"Select Address\"\n        }), _jsx(Modal.Body, {\n          children: _jsx(Radio.Group, {\n            defaultValue: \"address1\",\n            name: \"address\",\n            size: \"sm\",\n            children: _jsxs(VStack, {\n              space: 3,\n              children: [_jsx(Radio, {\n                alignItems: \"flex-start\",\n                _text: {\n                  mt: '-1',\n                  ml: '2',\n                  fontSize: 'sm'\n                },\n                value: \"address1\",\n                children: \"4140 Parker Rd. Allentown, New Mexico 31134\"\n              }), _jsx(Radio, {\n                alignItems: \"flex-start\",\n                _text: {\n                  mt: '-1',\n                  ml: '2',\n                  fontSize: 'sm'\n                },\n                value: \"address2\",\n                children: \"6391 Elign St. Celina, Delaware 10299\"\n              })]\n            })\n          })\n        }), _jsx(Modal.Footer, {\n          children: _jsx(Button, {\n            flex: \"1\",\n            onPress: function onPress() {\n              setShowModal3(true);\n            },\n            children: \"Continue\"\n          })\n        })]\n      })\n    }), _jsx(Modal, {\n      isOpen: showModal3,\n      size: \"lg\",\n      onClose: function onClose() {\n        return setShowModal3(false);\n      },\n      children: _jsxs(Modal.Content, {\n        maxWidth: \"350\",\n        children: [_jsx(Modal.CloseButton, {}), _jsx(Modal.Header, {\n          children: \"Payment Options\"\n        }), _jsx(Modal.Body, {\n          children: _jsx(Radio.Group, {\n            name: \"payment\",\n            size: \"sm\",\n            children: _jsxs(VStack, {\n              space: 3,\n              children: [_jsx(Radio, {\n                alignItems: \"flex-start\",\n                _text: {\n                  mt: '-1',\n                  ml: '2',\n                  fontSize: 'sm'\n                },\n                value: \"payment1\",\n                children: \"Cash on delivery\"\n              }), _jsx(Radio, {\n                alignItems: \"flex-start\",\n                _text: {\n                  mt: '-1',\n                  ml: '2',\n                  fontSize: 'sm'\n                },\n                value: \"payment2\",\n                children: \"Credit/ Debit/ ATM Card\"\n              }), _jsx(Radio, {\n                alignItems: \"flex-start\",\n                _text: {\n                  mt: '-1',\n                  ml: '2',\n                  fontSize: 'sm'\n                },\n                value: \"payment3\",\n                children: \"UPI\"\n              })]\n            })\n          })\n        }), _jsx(Modal.Footer, {\n          children: _jsx(Button, {\n            flex: \"1\",\n            onPress: function onPress() {\n              setShowModal(false);\n              setShowModal2(false);\n              setShowModal3(false);\n            },\n            children: \"Checkout\"\n          })\n        })]\n      })\n    })]\n  });\n};","map":{"version":3,"sources":["/Users/rohitsingh/Documents/projects/new-nativebase-setup/NativeBase/example/storybook/stories/components/composites/Modal/MultipleModal.tsx"],"names":["React","Button","Modal","VStack","HStack","Text","Radio","useState","Example","showModal","setShowModal","showModal2","setShowModal2","showModal3","setShowModal3","mt","ml","fontSize"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Button, Modal, VStack, HStack, Text, Radio } from 'native-base';\nimport { useState } from 'react';\n\nexport const Example = () => {\n  const [showModal, setShowModal] = useState(false);\n  const [showModal2, setShowModal2] = useState(false);\n  const [showModal3, setShowModal3] = useState(false);\n\n  return (\n    <>\n      <Button onPress={() => setShowModal(true)}>Button</Button>\n      <Modal isOpen={showModal} onClose={() => setShowModal(false)} size=\"lg\">\n        <Modal.Content maxWidth=\"350\">\n          <Modal.CloseButton />\n          <Modal.Header>Order</Modal.Header>\n          <Modal.Body>\n            <VStack space={3}>\n              <HStack alignItems=\"center\" justifyContent=\"space-between\">\n                <Text fontWeight=\"medium\">Sub Total</Text>\n                <Text color=\"blueGray.400\">$298.77</Text>\n              </HStack>\n              <HStack alignItems=\"center\" justifyContent=\"space-between\">\n                <Text fontWeight=\"medium\">Tax</Text>\n                <Text color=\"blueGray.400\">$38.84</Text>\n              </HStack>\n              <HStack alignItems=\"center\" justifyContent=\"space-between\">\n                <Text fontWeight=\"medium\">Total Amount</Text>\n                <Text color=\"green.500\">$337.61</Text>\n              </HStack>\n            </VStack>\n          </Modal.Body>\n          <Modal.Footer>\n            <Button\n              flex=\"1\"\n              onPress={() => {\n                setShowModal2(true);\n              }}\n            >\n              Continue\n            </Button>\n          </Modal.Footer>\n        </Modal.Content>\n      </Modal>\n\n      <Modal isOpen={showModal2} onClose={() => setShowModal2(false)} size=\"lg\">\n        <Modal.Content maxWidth=\"350\">\n          <Modal.CloseButton />\n          <Modal.Header>Select Address</Modal.Header>\n          <Modal.Body>\n            <Radio.Group defaultValue=\"address1\" name=\"address\" size=\"sm\">\n              <VStack space={3}>\n                <Radio\n                  alignItems=\"flex-start\"\n                  _text={{ mt: '-1', ml: '2', fontSize: 'sm' }}\n                  value=\"address1\"\n                >\n                  4140 Parker Rd. Allentown, New Mexico 31134\n                </Radio>\n                <Radio\n                  alignItems=\"flex-start\"\n                  _text={{ mt: '-1', ml: '2', fontSize: 'sm' }}\n                  value=\"address2\"\n                >\n                  6391 Elign St. Celina, Delaware 10299\n                </Radio>\n              </VStack>\n            </Radio.Group>\n          </Modal.Body>\n          <Modal.Footer>\n            <Button\n              flex=\"1\"\n              onPress={() => {\n                setShowModal3(true);\n              }}\n            >\n              Continue\n            </Button>\n          </Modal.Footer>\n        </Modal.Content>\n      </Modal>\n\n      <Modal isOpen={showModal3} size=\"lg\" onClose={() => setShowModal3(false)}>\n        <Modal.Content maxWidth=\"350\">\n          <Modal.CloseButton />\n          <Modal.Header>Payment Options</Modal.Header>\n          <Modal.Body>\n            <Radio.Group name=\"payment\" size=\"sm\">\n              <VStack space={3}>\n                <Radio\n                  alignItems=\"flex-start\"\n                  _text={{ mt: '-1', ml: '2', fontSize: 'sm' }}\n                  value=\"payment1\"\n                >\n                  Cash on delivery\n                </Radio>\n                <Radio\n                  alignItems=\"flex-start\"\n                  _text={{ mt: '-1', ml: '2', fontSize: 'sm' }}\n                  value=\"payment2\"\n                >\n                  Credit/ Debit/ ATM Card\n                </Radio>\n                <Radio\n                  alignItems=\"flex-start\"\n                  _text={{ mt: '-1', ml: '2', fontSize: 'sm' }}\n                  value=\"payment3\"\n                >\n                  UPI\n                </Radio>\n              </VStack>\n            </Radio.Group>\n          </Modal.Body>\n          <Modal.Footer>\n            <Button\n              flex=\"1\"\n              onPress={() => {\n                setShowModal(false);\n                setShowModal2(false);\n                setShowModal3(false);\n              }}\n            >\n              Checkout\n            </Button>\n          </Modal.Footer>\n        </Modal.Content>\n      </Modal>\n    </>\n  );\n};\n"]},"metadata":{},"sourceType":"module"}