@sendbird/uikit-react-native/lib/commonjs/components/FileViewer/FileViewerHeader.js

Sendbird UIKit for React Native: A feature-rich and customizable chat UI kit with messaging, channel management, and user authentication.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _uikitReactNativeFoundation = require("@sendbird/uikit-react-native-foundation");
var _uikitUtils = require("@sendbird/uikit-utils");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const FileViewerHeader = ({
  headerShown = true,
  topInset,
  onClose,
  subtitle,
  title
}) => {
  const {
    palette
  } = (0, _uikitReactNativeFoundation.useUIKitTheme)();
  const {
    defaultHeight
  } = (0, _uikitReactNativeFoundation.useHeaderStyle)();
  const safeArea = (0, _uikitUtils.useSafeAreaPadding)(['left', 'right']);
  if (!headerShown) return null;
  return /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.Box, {
    style: [styles.container, {
      paddingStart: styles.container.paddingHorizontal + safeArea.paddingStart,
      paddingEnd: styles.container.paddingHorizontal + safeArea.paddingEnd,
      paddingTop: topInset,
      height: defaultHeight + topInset,
      backgroundColor: palette.overlay01
    }]
  }, /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.PressBox, {
    activeOpacity: 0.75,
    onPress: onClose,
    style: styles.buttonContainer
  }, /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.Icon, {
    icon: 'close',
    size: 24,
    color: palette.onBackgroundDark01
  })), /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.Box, {
    style: styles.titleContainer
  }, /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.Text, {
    h2: true,
    color: palette.onBackgroundDark01,
    style: styles.title,
    numberOfLines: 1
  }, (0, _uikitUtils.truncate)(title, {
    mode: 'mid',
    maxLen: 18
  })), /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.Text, {
    caption2: true,
    color: palette.onBackgroundDark01,
    numberOfLines: 1
  }, subtitle)), /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.Box, {
    style: styles.buttonContainer
  }));
};
const styles = (0, _uikitReactNativeFoundation.createStyleSheet)({
  container: {
    zIndex: 1,
    top: 0,
    start: 0,
    end: 0,
    position: 'absolute',
    flexDirection: 'row',
    alignItems: 'center',
    justifyContent: 'center',
    paddingHorizontal: 12
  },
  buttonContainer: {
    width: 32,
    height: 32,
    alignItems: 'center',
    justifyContent: 'center'
  },
  titleContainer: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center'
  },
  title: {
    marginBottom: 2
  }
});
var _default = exports.default = FileViewerHeader;
//# sourceMappingURL=FileViewerHeader.js.map