softchatjs-react-native/dist/components/Chat/MessageAvatar.mjs

React native UI SDK for softchatjs-core. Create a free account at: https://www.softchatjs.com

// src/components/Chat/MessageAvatar.tsx
import React4 from "react";
import { TouchableOpacity, Text as Text2 } from "react-native";

// src/constants/Colors.ts
var Colors = {
  greyLighter: "#F0F0F0"
};

// src/components/Chat/MessageAvatar.tsx
import { Image } from "expo-image";

// src/contexts/ChatProvider.tsx
import React3, { createContext as createContext3, useContext as useContext3 } from "react";

// src/contexts/ModalProvider.tsx
import React, { createContext, useContext, useState } from "react";
import {
  Modal,
  View
} from "react-native";
var initial = {
  displayModal: () => {
  },
  resetModal: () => {
  },
  modalProps: {
    dismissable: true,
    justifyContent: "center",
    children: null,
    animation: "slide",
    containerWidth: "100%"
  }
};
var ModalProviderContext = createContext(initial);

// src/theme/colors.ts
var teal = {
  50: "#DCF2F0",
  100: "#A9DFD8",
  200: "#73CABE",
  300: "#3AB4A4",
  400: "#00A391",
  500: "#00927E",
  600: "#008572",
  700: "#007662",
  800: "#006654",
  900: "#004A38"
};
var green = {
  50: "#E6F5E4",
  100: "#C2E6BD",
  200: "#9AD693",
  300: "#6FC666",
  400: "#4ABA42",
  500: "#17AE13",
  600: "#029F04",
  700: "#008D00",
  800: "#007C00",
  900: "#005E00"
};
var grey = {
  50: "#F6F6FF",
  100: "#F2F1FF",
  200: "#EBEBF9",
  300: "#CAC9D7",
  400: "#ACACB9",
  500: "#82818F",
  600: "#6D6D7A",
  700: "#4D4D59",
  800: "#2B2B36",
  900: "#21222D",
  A100: "#1D1E26"
};
var stone = {
  50: "#F8F8F8",
  100: "#EFEFEF",
  200: "#E8E8E8",
  300: "#D9D9D9",
  400: "#D2D2D2",
  500: "#A0A0A0",
  600: "#87888C",
  700: "#2C2D33",
  800: "#1D1E26",
  900: "#171821"
};

// src/theme/index.ts
var theme = {
  background: {
    primary: stone[900],
    secondary: grey[900],
    disabled: grey[800]
  },
  text: {
    primary: "black",
    secondary: stone[200],
    disabled: stone[500]
  },
  action: {
    primary: teal[50],
    secondary: stone[300]
  },
  chatBubble: {
    left: {
      bgColor: grey[900],
      messageColor: stone[200],
      messageTimeColor: "grey",
      replyBorderColor: stone[200]
    },
    right: {
      bgColor: "#474952",
      messageColor: "white",
      messageTimeColor: "grey",
      replyBorderColor: green[900]
    }
  },
  icon: "white",
  divider: stone[700]
};
var theme_default = theme;

// src/contexts/MessageStateContext.tsx
import React2, {
  createContext as createContext2,
  useState as useState2,
  useContext as useContext2
} from "react";
import { Audio } from "expo-av";

// src/constants/defaultUser.ts
var defaultUser_default = {
  id: "",
  uid: "",
  username: "",
  firstname: "",
  lastname: "",
  profileUrl: "",
  color: "",
  custom: {}
};

// src/contexts/MessageStateContext.tsx
var initialMessageStateContext = {
  globalTextMessage: "",
  setGlobalTextMessage: () => {
  },
  stickers: [],
  setStickers: () => {
  },
  pendingMessages: [],
  addNewPendingMessages: (message) => {
  },
  removePendingMessage: (messageId) => {
  },
  updatePendingMessage: (messageId, message) => {
  },
  playVoiceMessage: (media) => {
  },
  pauseVoiceMessage: () => {
  },
  resumeVoiceMessage: () => {
  },
  audioState: null,
  unload: () => {
  },
  sound: null,
  activeVoiceMessage: null,
  avPlayBackStatus: null,
  userMeta: defaultUser_default,
  setUserMeta: () => {
  },
  conversationList: [],
  setConversationList: () => {
  }
};
var MessageStateContext = createContext2(
  initialMessageStateContext
);

// src/contexts/ChatProvider.tsx
var ConfigContext = createContext3({
  theme: theme_default,
  client: null,
  fontFamily: void 0,
  fontScale: 1
});
function useConfig() {
  return useContext3(ConfigContext);
}

// src/components/Chat/MessageAvatar.tsx
function MessageAvatar(props) {
  const { imgUrl, initials, size = 40, style } = props;
  const { fontFamily } = useConfig();
  return /* @__PURE__ */ React4.createElement(
    TouchableOpacity,
    {
      style: {
        height: size,
        width: size,
        borderRadius: size,
        backgroundColor: "black",
        alignItems: "center",
        justifyContent: "center",
        ...style
      }
    },
    imgUrl ? /* @__PURE__ */ React4.createElement(
      Image,
      {
        source: { uri: imgUrl },
        cachePolicy: "disk",
        style: {
          height: size,
          width: size,
          borderRadius: size,
          backgroundColor: Colors.greyLighter
        }
      }
    ) : /* @__PURE__ */ React4.createElement(
      Text2,
      {
        style: {
          fontSize: size / 2,
          textTransform: "uppercase",
          color: "white",
          fontFamily
        }
      },
      initials
    )
  );
}
export {
  MessageAvatar as default
};
//# sourceMappingURL=MessageAvatar.mjs.map