1 line
5.0 KiB
Plaintext
1 line
5.0 KiB
Plaintext
{"version":3,"sources":["Badge.tsx"],"names":["Badge","visible","size","children","style","rest","opacity","React","useState","Animated","Value","rendered","setRendered","theme","useEffect","timing","toValue","duration","useNativeDriver","start","finished","backgroundColor","colors","notification","restStyle","StyleSheet","flatten","textColor","isLight","borderRadius","fontSize","Math","floor","transform","scale","interpolate","inputRange","outputRange","color","lineHeight","height","minWidth","styles","container","create","alignSelf","textAlign","paddingHorizontal","overflow"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { Animated, StyleSheet, StyleProp, TextStyle } from 'react-native';\nimport color from 'color';\nimport { useTheme } from '@react-navigation/native';\n\ntype Props = {\n /**\n * Whether the badge is visible\n */\n visible: boolean;\n /**\n * Content of the `Badge`.\n */\n children?: string | number;\n /**\n * Size of the `Badge`.\n */\n size?: number;\n /**\n * Style object for the tab bar container.\n */\n style?: Animated.WithAnimatedValue<StyleProp<TextStyle>>;\n};\n\nexport default function Badge({\n visible = true,\n size = 18,\n children,\n style,\n ...rest\n}: Props) {\n const [opacity] = React.useState(() => new Animated.Value(visible ? 1 : 0));\n const [rendered, setRendered] = React.useState(visible ? true : false);\n\n const theme = useTheme();\n\n React.useEffect(() => {\n if (!rendered) {\n return;\n }\n\n Animated.timing(opacity, {\n toValue: visible ? 1 : 0,\n duration: 150,\n useNativeDriver: true,\n }).start(({ finished }) => {\n if (finished && !visible) {\n setRendered(false);\n }\n });\n }, [opacity, rendered, visible]);\n\n if (visible && !rendered) {\n setRendered(true);\n }\n\n if (!visible && !rendered) {\n return null;\n }\n\n // @ts-expect-error: backgroundColor definitely exists\n const { backgroundColor = theme.colors.notification, ...restStyle } =\n StyleSheet.flatten(style) || {};\n const textColor = color(backgroundColor).isLight() ? 'black' : 'white';\n\n const borderRadius = size / 2;\n const fontSize = Math.floor((size * 3) / 4);\n\n return (\n <Animated.Text\n numberOfLines={1}\n style={[\n {\n opacity,\n transform: [\n {\n scale: opacity.interpolate({\n inputRange: [0, 1],\n outputRange: [0.5, 1],\n }),\n },\n ],\n backgroundColor,\n color: textColor,\n fontSize,\n lineHeight: size - 1,\n height: size,\n minWidth: size,\n borderRadius,\n },\n styles.container,\n restStyle,\n ]}\n {...rest}\n >\n {children}\n </Animated.Text>\n );\n}\n\nconst styles = StyleSheet.create({\n container: {\n alignSelf: 'flex-end',\n textAlign: 'center',\n paddingHorizontal: 4,\n overflow: 'hidden',\n },\n});\n"]} |