@sendbird/uikit-react-native-foundation/lib/commonjs/ui/GroupChannelMessage/MessageBubbleWithText.js

A foundational UI kit for building chat-enabled React Native apps.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _uikitUtils = require("@sendbird/uikit-utils");
var _Box = _interopRequireDefault(require("../../components/Box"));
var _RegexText = _interopRequireDefault(require("../../components/RegexText"));
var _Text = _interopRequireDefault(require("../../components/Text"));
var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyleSheet"));
var _useUIKitTheme = _interopRequireDefault(require("../../theme/useUIKitTheme"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
const MessageBubbleWithText = ({
  backgroundColor,
  message,
  onPressURL,
  onLongPress,
  strings,
  variant = 'incoming',
  regexTextPatterns = [],
  renderRegexTextChildren = msg => msg.message
}) => {
  const {
    colors
  } = (0, _useUIKitTheme.default)();
  const color = colors.ui.groupChannelMessage[variant];
  return /*#__PURE__*/_react.default.createElement(_Box.default, {
    backgroundColor: backgroundColor,
    style: styles.bubble
  }, /*#__PURE__*/_react.default.createElement(_Text.default, {
    body3: true,
    color: color.enabled.textMsg,
    suppressHighlighting: true,
    supportRTLAlign: true,
    originalText: message.message
  }, /*#__PURE__*/_react.default.createElement(_RegexText.default, {
    body3: true,
    suppressHighlighting: true,
    supportRTLAlign: true,
    originalText: message.message,
    color: color.enabled.textMsg,
    patterns: [...regexTextPatterns, {
      regex: _uikitUtils.urlRegexStrict,
      replacer({
        match,
        parentProps,
        keyPrefix,
        index
      }) {
        return /*#__PURE__*/_react.default.createElement(_Text.default, _extends({}, parentProps, {
          key: `${keyPrefix}-${index}`,
          onPress: () => onPressURL === null || onPressURL === void 0 ? void 0 : onPressURL(match),
          onLongPress: onLongPress,
          style: [parentProps === null || parentProps === void 0 ? void 0 : parentProps.style, styles.urlText]
        }), match);
      }
    }]
  }, renderRegexTextChildren(message)), Boolean(message.updatedAt) && /*#__PURE__*/_react.default.createElement(_Text.default, {
    body3: true,
    color: color.enabled.textEdited,
    supportRTLAlign: true,
    originalText: (strings === null || strings === void 0 ? void 0 : strings.edited) ?? ' (edited)'
  }, (strings === null || strings === void 0 ? void 0 : strings.edited) ?? ' (edited)')));
};
const styles = (0, _createStyleSheet.default)({
  bubble: {
    paddingHorizontal: 12,
    paddingVertical: 6
  },
  urlText: {
    textDecorationLine: 'underline'
  }
});
var _default = exports.default = MessageBubbleWithText;
//# sourceMappingURL=MessageBubbleWithText.js.map