{"ast":null,"code":"import _defineProperty from \"@babel/runtime/helpers/defineProperty\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/objectWithoutProperties\";\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }\n\nimport React from 'react';\nimport { Button, useToast, VStack, HStack, Text, Center, IconButton, CloseIcon, Alert } 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\";\nexport var Example = function Example() {\n  var toast = useToast();\n  var ToastDetails = [{\n    title: 'Account verified',\n    variant: 'solid',\n    description: 'Thanks for signing up with us.',\n    isClosable: true\n  }, {\n    title: 'Something went wrong',\n    variant: 'subtle',\n    description: 'Please create a support ticket from the support page'\n  }, {\n    title: 'Network connection restored',\n    variant: 'left-accent',\n    description: 'This is to inform you that your network connectivity is restored',\n    isClosable: true\n  }, {\n    title: 'Invalid email address',\n    variant: 'top-accent',\n    description: 'Please enter a valid email address'\n  }, {\n    title: 'Invalid email address',\n    variant: 'outline',\n    description: 'Please enter a valid email address'\n  }];\n\n  var ToastAlert = function ToastAlert(_ref) {\n    var id = _ref.id,\n        status = _ref.status,\n        variant = _ref.variant,\n        title = _ref.title,\n        description = _ref.description,\n        isClosable = _ref.isClosable,\n        rest = _objectWithoutProperties(_ref, [\"id\", \"status\", \"variant\", \"title\", \"description\", \"isClosable\"]);\n\n    return _jsx(Alert, _objectSpread(_objectSpread({\n      maxWidth: \"100%\",\n      alignSelf: \"center\",\n      flexDirection: \"row\",\n      status: status != null ? status : 'info',\n      variant: variant\n    }, rest), {}, {\n      children: _jsxs(VStack, {\n        space: 1,\n        flexShrink: 1,\n        w: \"100%\",\n        children: [_jsxs(HStack, {\n          flexShrink: 1,\n          alignItems: \"center\",\n          justifyContent: \"space-between\",\n          children: [_jsxs(HStack, {\n            space: 2,\n            flexShrink: 1,\n            alignItems: \"center\",\n            children: [_jsx(Alert.Icon, {}), _jsx(Text, {\n              fontSize: \"md\",\n              fontWeight: \"medium\",\n              flexShrink: 1,\n              color: variant === 'solid' ? 'lightText' : variant !== 'outline' ? 'darkText' : null,\n              children: title\n            })]\n          }), isClosable ? _jsx(IconButton, {\n            variant: \"unstyled\",\n            icon: _jsx(CloseIcon, {\n              size: \"3\"\n            }),\n            _icon: {\n              color: variant === 'solid' ? 'lightText' : 'darkText'\n            },\n            onPress: function onPress() {\n              return toast.close(id);\n            }\n          }) : null]\n        }), _jsx(Text, {\n          px: \"6\",\n          color: variant === 'solid' ? 'lightText' : variant !== 'outline' ? 'darkText' : null,\n          children: description\n        })]\n      })\n    }));\n  };\n\n  return _jsx(Center, {\n    children: _jsx(VStack, {\n      space: 2,\n      children: ToastDetails.map(function (item) {\n        return _jsx(Button, {\n          onPress: function onPress() {\n            return toast.show({\n              render: function render(_ref2) {\n                var id = _ref2.id;\n                return _jsx(ToastAlert, _objectSpread({\n                  id: id\n                }, item));\n              }\n            });\n          },\n          children: item.variant\n        });\n      })\n    })\n  });\n};","map":{"version":3,"sources":["/Users/rohitsingh/Documents/projects/new-nativebase-setup/NativeBase/example/storybook/stories/components/composites/Toast/VariantRecipies.tsx"],"names":["React","Button","useToast","VStack","HStack","Text","Center","IconButton","CloseIcon","Alert","Example","toast","ToastDetails","title","variant","description","isClosable","ToastAlert","id","status","rest","color","close","map","item","show","render"],"mappings":"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","sourcesContent":["import React from 'react';\nimport {\n  Button,\n  useToast,\n  VStack,\n  HStack,\n  Text,\n  Center,\n  IconButton,\n  CloseIcon,\n  Alert,\n} from 'native-base';\n\nexport const Example = () => {\n  const toast = useToast();\n  const ToastDetails = [\n    {\n      title: 'Account verified',\n      variant: 'solid',\n      description: 'Thanks for signing up with us.',\n      isClosable: true,\n    },\n    {\n      title: 'Something went wrong',\n      variant: 'subtle',\n      description: 'Please create a support ticket from the support page',\n    },\n    {\n      title: 'Network connection restored',\n      variant: 'left-accent',\n      description:\n        'This is to inform you that your network connectivity is restored',\n      isClosable: true,\n    },\n    {\n      title: 'Invalid email address',\n      variant: 'top-accent',\n      description: 'Please enter a valid email address',\n    },\n    {\n      title: 'Invalid email address',\n      variant: 'outline',\n      description: 'Please enter a valid email address',\n    },\n  ];\n\n  const ToastAlert = ({\n    id,\n    status,\n    variant,\n    title,\n    description,\n    isClosable,\n    ...rest\n  }: any) => (\n    <Alert\n      maxWidth=\"100%\"\n      alignSelf=\"center\"\n      flexDirection=\"row\"\n      status={status ?? 'info'}\n      variant={variant as any}\n      {...rest}\n    >\n      <VStack space={1} flexShrink={1} w=\"100%\">\n        <HStack\n          flexShrink={1}\n          alignItems=\"center\"\n          justifyContent=\"space-between\"\n        >\n          <HStack space={2} flexShrink={1} alignItems=\"center\">\n            <Alert.Icon />\n            <Text\n              fontSize=\"md\"\n              fontWeight=\"medium\"\n              flexShrink={1}\n              color={\n                variant === 'solid'\n                  ? 'lightText'\n                  : variant !== 'outline'\n                  ? 'darkText'\n                  : null\n              }\n            >\n              {title}\n            </Text>\n          </HStack>\n          {isClosable ? (\n            <IconButton\n              variant=\"unstyled\"\n              icon={<CloseIcon size=\"3\" />}\n              _icon={{\n                color: variant === 'solid' ? 'lightText' : 'darkText',\n              }}\n              onPress={() => toast.close(id)}\n            />\n          ) : null}\n        </HStack>\n        <Text\n          px=\"6\"\n          color={\n            variant === 'solid'\n              ? 'lightText'\n              : variant !== 'outline'\n              ? 'darkText'\n              : null\n          }\n        >\n          {description}\n        </Text>\n      </VStack>\n    </Alert>\n  );\n\n  return (\n    <Center>\n      <VStack space={2}>\n        {ToastDetails.map((item) => (\n          <Button\n            onPress={() =>\n              toast.show({\n                render: ({ id }) => {\n                  return <ToastAlert id={id} {...item} />;\n                },\n              })\n            }\n          >\n            {item.variant}\n          </Button>\n        ))}\n      </VStack>\n    </Center>\n  );\n};\n"]},"metadata":{},"sourceType":"module"}