{"ast":null,"code":"var _this = this,\n    _jsxFileName = \"/Users/rohitsingh/Documents/projects/new-nativebase-setup/NativeBase/example/storybook/stories/theme/Custom/Content.tsx\";\n\nimport React from 'react';\nimport { Heading, useColorMode, Button, HStack, Avatar, VStack, Text, Box, Center } from \"/Users/rohitsingh/Documents/projects/new-nativebase-setup/NativeBase/src/index\";\nexport var Content = function Content() {\n  var _useColorMode = useColorMode(),\n      toggleColorMode = _useColorMode.toggleColorMode;\n\n  return React.createElement(Center, {\n    _light: {\n      bg: 'warmGray.50'\n    },\n    h: \"100%\",\n    _dark: {\n      bg: 'coolGray.800'\n    }\n  }, React.createElement(Box, {\n    flex: 1\n  }, React.createElement(VStack, {\n    my: 4,\n    space: 4,\n    flex: 1,\n    justifyContent: \"center\"\n  }, React.createElement(Heading, {\n    justifyContent: \"center\",\n    color: \"custom.200\",\n    _dark: {\n      color: 'warmGray.50'\n    },\n    mb: \"1\"\n  }, \"Inbox\"), React.createElement(Box, {\n    py: 2,\n    border: 1,\n    borderRadius: \"md\",\n    _light: {\n      borderColor: 'gray.800'\n    },\n    _dark: {\n      borderColor: 'gray.50'\n    }\n  }, React.createElement(HStack, {\n    alignItems: \"center\",\n    justifyContent: \"space-between\",\n    space: 3\n  }, React.createElement(Box, {\n    flexDirection: \"row\",\n    alignItems: \"center\",\n    justifyContent: \"center\"\n  }, React.createElement(Avatar, {\n    mr: 4,\n    size: \"lg\",\n    source: {\n      uri: 'https://pbs.twimg.com/profile_images/1309797238651060226/18cm6VhQ_400x400.jpg'\n    }\n  }, \"Ankur\"), React.createElement(VStack, null, React.createElement(Heading, {\n    fontWeight: \"medium\",\n    size: \"md\"\n  }, \"Ankur\"), React.createElement(Text, {\n    color: \"amber.400\",\n    _dark: {\n      color: 'amber.500'\n    }\n  }, \"Software Engineer\"))))), React.createElement(Box, {\n    py: 2,\n    border: 1,\n    borderRadius: \"md\",\n    _light: {\n      borderColor: 'gray.800'\n    },\n    _dark: {\n      borderColor: 'gray.50'\n    }\n  }, React.createElement(HStack, {\n    alignItems: \"center\",\n    justifyContent: \"space-between\",\n    space: 3\n  }, React.createElement(Box, {\n    flexDirection: \"row\",\n    alignItems: \"center\",\n    justifyContent: \"center\"\n  }, React.createElement(Avatar, {\n    mr: 4,\n    size: \"lg\",\n    source: {\n      uri: 'https://pbs.twimg.com/profile_images/1320985200663293952/lE_Kg6vr_400x400.jpg'\n    }\n  }, \"Rehman\"), React.createElement(VStack, null, React.createElement(Heading, {\n    fontWeight: \"medium\",\n    size: \"md\"\n  }, \"Rehman\"), React.createElement(Text, {\n    color: \"amber.400\",\n    _dark: {\n      color: 'amber.500'\n    }\n  }, \"Software Engineer\"))))), React.createElement(Box, {\n    py: 2,\n    border: 1,\n    borderRadius: \"md\",\n    _light: {\n      borderColor: 'gray.800'\n    },\n    _dark: {\n      borderColor: 'gray.50'\n    }\n  }, React.createElement(HStack, {\n    alignItems: \"center\",\n    justifyContent: \"space-between\",\n    space: 3\n  }, React.createElement(Box, {\n    flexDirection: \"row\",\n    alignItems: \"center\",\n    justifyContent: \"center\"\n  }, React.createElement(Avatar, {\n    mr: 4,\n    size: \"lg\",\n    source: {\n      uri: 'https://pbs.twimg.com/profile_images/1352844693151731713/HKO7cnlW_400x400.jpg'\n    }\n  }, \"Rohit\"), React.createElement(VStack, null, React.createElement(Heading, {\n    fontWeight: \"medium\",\n    size: \"md\"\n  }, \"Rohit\"), React.createElement(Text, {\n    color: \"amber.400\",\n    _dark: {\n      color: 'amber.500'\n    }\n  }, \"Software Engineer\"))))), React.createElement(HStack, {\n    justifyContent: \"center\"\n  }, React.createElement(Button, {\n    mt: 4,\n    onPress: function onPress() {\n      toggleColorMode && toggleColorMode();\n    }\n  }, \"Change mode\")))));\n};","map":{"version":3,"sources":["/Users/rohitsingh/Documents/projects/new-nativebase-setup/NativeBase/example/storybook/stories/theme/Custom/Content.tsx"],"names":["React","Heading","useColorMode","Button","HStack","Avatar","VStack","Text","Box","Center","Content","toggleColorMode","bg","color","borderColor","uri"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport {\n  Heading,\n  useColorMode,\n  Button,\n  HStack,\n  Avatar,\n  VStack,\n  Text,\n  Box,\n  Center,\n} from 'native-base';\n\nexport const Content = () => {\n  const { toggleColorMode } = useColorMode();\n  return (\n    <Center\n      _light={{ bg: 'warmGray.50' }}\n      h=\"100%\"\n      _dark={{ bg: 'coolGray.800' }}\n    >\n      <Box flex={1}>\n        <VStack\n          my={4}\n          space={4}\n          flex={1}\n          justifyContent=\"center\"\n          // alignItems=\"center\"\n        >\n          <Heading\n            justifyContent=\"center\"\n            color=\"custom.200\"\n            _dark={{ color: 'warmGray.50' }}\n            mb=\"1\"\n          >\n            Inbox\n          </Heading>\n          <Box\n            py={2}\n            border={1}\n            borderRadius=\"md\"\n            _light={{ borderColor: 'gray.800' }}\n            _dark={{ borderColor: 'gray.50' }}\n          >\n            <HStack\n              alignItems=\"center\"\n              justifyContent=\"space-between\"\n              space={3}\n            >\n              <Box\n                flexDirection=\"row\"\n                alignItems=\"center\"\n                justifyContent=\"center\"\n              >\n                <Avatar\n                  mr={4}\n                  size=\"lg\"\n                  source={{\n                    uri:\n                      'https://pbs.twimg.com/profile_images/1309797238651060226/18cm6VhQ_400x400.jpg',\n                  }}\n                >\n                  Ankur\n                </Avatar>\n                <VStack>\n                  <Heading fontWeight=\"medium\" size=\"md\">\n                    Ankur\n                  </Heading>\n                  <Text color=\"amber.400\" _dark={{ color: 'amber.500' }}>\n                    Software Engineer\n                  </Text>\n                </VStack>\n              </Box>\n            </HStack>\n          </Box>\n          <Box\n            py={2}\n            border={1}\n            borderRadius=\"md\"\n            _light={{ borderColor: 'gray.800' }}\n            _dark={{ borderColor: 'gray.50' }}\n          >\n            <HStack\n              alignItems=\"center\"\n              justifyContent=\"space-between\"\n              space={3}\n            >\n              <Box\n                flexDirection=\"row\"\n                alignItems=\"center\"\n                justifyContent=\"center\"\n              >\n                <Avatar\n                  mr={4}\n                  size=\"lg\"\n                  source={{\n                    uri:\n                      'https://pbs.twimg.com/profile_images/1320985200663293952/lE_Kg6vr_400x400.jpg',\n                  }}\n                >\n                  Rehman\n                </Avatar>\n                <VStack>\n                  <Heading fontWeight=\"medium\" size=\"md\">\n                    Rehman\n                  </Heading>\n                  <Text color=\"amber.400\" _dark={{ color: 'amber.500' }}>\n                    Software Engineer\n                  </Text>\n                </VStack>\n              </Box>\n            </HStack>\n          </Box>\n          <Box\n            py={2}\n            border={1}\n            borderRadius=\"md\"\n            _light={{ borderColor: 'gray.800' }}\n            _dark={{ borderColor: 'gray.50' }}\n          >\n            <HStack\n              alignItems=\"center\"\n              justifyContent=\"space-between\"\n              space={3}\n            >\n              <Box\n                flexDirection=\"row\"\n                alignItems=\"center\"\n                justifyContent=\"center\"\n              >\n                <Avatar\n                  mr={4}\n                  size=\"lg\"\n                  source={{\n                    uri:\n                      'https://pbs.twimg.com/profile_images/1352844693151731713/HKO7cnlW_400x400.jpg',\n                  }}\n                >\n                  Rohit\n                </Avatar>\n                <VStack>\n                  <Heading fontWeight=\"medium\" size=\"md\">\n                    Rohit\n                  </Heading>\n                  <Text color=\"amber.400\" _dark={{ color: 'amber.500' }}>\n                    Software Engineer\n                  </Text>\n                </VStack>\n              </Box>\n            </HStack>\n          </Box>\n          <HStack justifyContent=\"center\">\n            <Button\n              mt={4}\n              onPress={() => {\n                toggleColorMode && toggleColorMode();\n              }}\n            >\n              Change mode\n            </Button>\n          </HStack>\n        </VStack>\n      </Box>\n    </Center>\n  );\n};\n"]},"metadata":{},"sourceType":"module"}