You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1 line
8.5 KiB
1 line
8.5 KiB
{"ast":null,"code":"import _slicedToArray from \"@babel/runtime/helpers/slicedToArray\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/objectWithoutProperties\";\nvar _excluded = [\"children\", \"style\", \"visible\", \"size\"],\n _excluded2 = [\"backgroundColor\"];\nfunction _extends() {\n _extends = Object.assign ? Object.assign.bind() : function (target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i];\n for (var key in source) {\n if (Object.prototype.hasOwnProperty.call(source, key)) {\n target[key] = source[key];\n }\n }\n }\n return target;\n };\n return _extends.apply(this, arguments);\n}\nimport { useTheme } from '@react-navigation/native';\nimport color from 'color';\nimport * as React from 'react';\nimport Animated from \"react-native-web/dist/exports/Animated\";\nimport StyleSheet from \"react-native-web/dist/exports/StyleSheet\";\nexport default function Badge(_ref) {\n var children = _ref.children,\n style = _ref.style,\n _ref$visible = _ref.visible,\n visible = _ref$visible === void 0 ? true : _ref$visible,\n _ref$size = _ref.size,\n size = _ref$size === void 0 ? 18 : _ref$size,\n rest = _objectWithoutProperties(_ref, _excluded);\n var _React$useState = React.useState(function () {\n return new Animated.Value(visible ? 1 : 0);\n }),\n _React$useState2 = _slicedToArray(_React$useState, 1),\n opacity = _React$useState2[0];\n var _React$useState3 = React.useState(visible),\n _React$useState4 = _slicedToArray(_React$useState3, 2),\n rendered = _React$useState4[0],\n setRendered = _React$useState4[1];\n var theme = useTheme();\n React.useEffect(function () {\n if (!rendered) {\n return;\n }\n Animated.timing(opacity, {\n toValue: visible ? 1 : 0,\n duration: 150,\n useNativeDriver: true\n }).start(function (_ref2) {\n var finished = _ref2.finished;\n if (finished && !visible) {\n setRendered(false);\n }\n });\n return function () {\n return opacity.stopAnimation();\n };\n }, [opacity, rendered, visible]);\n if (!rendered) {\n if (visible) {\n setRendered(true);\n } else {\n return null;\n }\n }\n var _ref3 = StyleSheet.flatten(style) || {},\n _ref3$backgroundColor = _ref3.backgroundColor,\n backgroundColor = _ref3$backgroundColor === void 0 ? theme.colors.notification : _ref3$backgroundColor,\n restStyle = _objectWithoutProperties(_ref3, _excluded2);\n var textColor = color(backgroundColor).isLight() ? 'black' : 'white';\n var borderRadius = size / 2;\n var fontSize = Math.floor(size * 3 / 4);\n return React.createElement(Animated.Text, _extends({\n numberOfLines: 1,\n style: [{\n transform: [{\n scale: opacity.interpolate({\n inputRange: [0, 1],\n outputRange: [0.5, 1]\n })\n }],\n color: textColor,\n lineHeight: size - 1,\n height: size,\n minWidth: size,\n opacity: opacity,\n backgroundColor: backgroundColor,\n fontSize: fontSize,\n borderRadius: borderRadius\n }, styles.container, restStyle]\n }, rest), children);\n}\nvar styles = StyleSheet.create({\n container: {\n alignSelf: 'flex-end',\n textAlign: 'center',\n paddingHorizontal: 4,\n overflow: 'hidden'\n }\n});","map":{"version":3,"sources":["Badge.tsx"],"names":["useTheme","color","React","Badge","children","style","visible","size","rest","opacity","useState","Animated","Value","rendered","setRendered","theme","useEffect","timing","toValue","duration","useNativeDriver","start","finished","stopAnimation","backgroundColor","colors","notification","restStyle","StyleSheet","flatten","textColor","isLight","borderRadius","fontSize","Math","floor","transform","scale","interpolate","inputRange","outputRange","lineHeight","height","minWidth","styles","container","create","alignSelf","textAlign","paddingHorizontal","overflow"],"mappings":"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","sourceRoot":"../../src","sourcesContent":["function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nimport { useTheme } from '@react-navigation/native';\nimport color from 'color';\nimport * as React from 'react';\nimport { Animated, StyleSheet } from 'react-native';\nexport default function Badge(_ref) {\n let {\n children,\n style,\n visible = true,\n size = 18,\n ...rest\n } = _ref;\n const [opacity] = React.useState(() => new Animated.Value(visible ? 1 : 0));\n const [rendered, setRendered] = React.useState(visible);\n const theme = useTheme();\n React.useEffect(() => {\n if (!rendered) {\n return;\n }\n Animated.timing(opacity, {\n toValue: visible ? 1 : 0,\n duration: 150,\n useNativeDriver: true\n }).start(_ref2 => {\n let {\n finished\n } = _ref2;\n if (finished && !visible) {\n setRendered(false);\n }\n });\n return () => opacity.stopAnimation();\n }, [opacity, rendered, visible]);\n if (!rendered) {\n if (visible) {\n setRendered(true);\n } else {\n return null;\n }\n }\n\n // @ts-expect-error: backgroundColor definitely exists\n const {\n backgroundColor = theme.colors.notification,\n ...restStyle\n } = StyleSheet.flatten(style) || {};\n const textColor = color(backgroundColor).isLight() ? 'black' : 'white';\n const borderRadius = size / 2;\n const fontSize = Math.floor(size * 3 / 4);\n return /*#__PURE__*/React.createElement(Animated.Text, _extends({\n numberOfLines: 1,\n style: [{\n transform: [{\n scale: opacity.interpolate({\n inputRange: [0, 1],\n outputRange: [0.5, 1]\n })\n }],\n color: textColor,\n lineHeight: size - 1,\n height: size,\n minWidth: size,\n opacity,\n backgroundColor,\n fontSize,\n borderRadius\n }, styles.container, restStyle]\n }, rest), children);\n}\nconst styles = StyleSheet.create({\n container: {\n alignSelf: 'flex-end',\n textAlign: 'center',\n paddingHorizontal: 4,\n overflow: 'hidden'\n }\n});\n//# sourceMappingURL=Badge.js.map"]},"metadata":{},"sourceType":"module"} |