UNPKG

react-native-gallery-preview

Version:

<div> <img align="right" height="720" src="example.gif"> </div>

102 lines (101 loc) 3.36 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.DefaultHeader = void 0; var _react = _interopRequireWildcard(require("react")); var _reactNative = require("react-native"); var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated")); var _jsxRuntime = require("react/jsx-runtime"); function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); } const DefaultHeader = exports.DefaultHeader = /*#__PURE__*/(0, _react.memo)(({ onClose, currentImageIndex, imagesLength, isFocused, containerBackgroundColor = "#000", textColor = "#fff" }) => { if (!isFocused) { return null; } return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.View, { entering: _reactNativeReanimated.FadeIn, style: [styles.container, { backgroundColor: containerBackgroundColor }], children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.SafeAreaView, { style: styles.safeArea, children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, { style: styles.wrapper, children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, { style: styles.closeButtonWrapper, children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, { onPress: onClose, style: styles.closeButton, children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, { style: [styles.closeButtonIcon, { color: textColor }], children: "X" }) }) }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, { style: styles.titleWrapper, children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, { style: [styles.title, { color: textColor }], children: [currentImageIndex + 1, "/", imagesLength] }) }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, { style: styles.right })] }) }) }); }); const styles = _reactNative.StyleSheet.create({ container: { width: "100%", top: 0, position: "absolute" }, safeArea: { flex: 1 }, wrapper: { flexDirection: "row", justifyContent: "center", alignItems: "center", height: 54 }, titleWrapper: { flex: 3 }, title: { fontSize: 18, fontWeight: "bold", textAlign: "center", letterSpacing: 2 }, closeButtonWrapper: { flex: 1, paddingLeft: 16 }, closeButton: { width: 28, height: 28, borderRadius: 25, justifyContent: "center", alignItems: "center" }, closeButtonIcon: { fontSize: 20, fontWeight: "bold" }, right: { flex: 1 } }); //# sourceMappingURL=DefaultHeader.js.map