cometchat-react-ui-kit2/dist/Groups/CometChatGroups/style.js

CometChat UI Kit for React App

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.popOverForCreateGroup = exports.getListStyle = exports.getListBaseStyle = exports.getCreateGroupStyle = exports.createGroupBtnStyle = exports.containerStyle = void 0;
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _ = require("../..");
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
var containerStyle = function containerStyle(style) {
  return {
    width: style === null || style === void 0 ? void 0 : style.width,
    height: style === null || style === void 0 ? void 0 : style.height,
    display: "flex",
    flexDirection: "row",
    alignItems: "center",
    justifyContent: "center",
    position: "relative",
    border: style.border
  };
};
exports.containerStyle = containerStyle;
var createGroupBtnStyle = function createGroupBtnStyle(style, createGroupIconURL, theme) {
  var _theme$palette;
  var direction = _.CometChatLocalize.isRTL() ? {
    left: "16px"
  } : {
    right: "16px"
  };
  return _objectSpread({
    WebkitMask: "url(".concat(createGroupIconURL, ") no-repeat left center"),
    backgroundColor: "".concat(style.createGroupIconTint || (theme === null || theme === void 0 ? void 0 : (_theme$palette = theme.palette) === null || _theme$palette === void 0 ? void 0 : _theme$palette.getPrimary())),
    height: "24px",
    width: "24px",
    cursor: "pointer",
    position: "absolute",
    top: "20px"
  }, direction);
};
exports.createGroupBtnStyle = createGroupBtnStyle;
var popOverForCreateGroup = function popOverForCreateGroup(theme) {
  var _theme$palette2;
  return {
    width: "360px",
    height: "620px",
    position: "fixed",
    top: "50%",
    left: "50%",
    transform: "translate(-50%,-50%)",
    boxShadow: "0 0 32px ".concat(theme === null || theme === void 0 ? void 0 : (_theme$palette2 = theme.palette) === null || _theme$palette2 === void 0 ? void 0 : _theme$palette2.getAccent300())
  };
};
exports.popOverForCreateGroup = popOverForCreateGroup;
var getCreateGroupStyle = function getCreateGroupStyle(_createGroupConfiguration, theme) {
  return {
    width: _createGroupConfiguration.style.width || "100%",
    height: _createGroupConfiguration.style.height || "100%",
    background: _createGroupConfiguration.style.background || theme.palette.getBackground(),
    border: _createGroupConfiguration.style.border || "none",
    borderRadius: _createGroupConfiguration.style.borderRadius || "8px",
    boxShadow: _createGroupConfiguration.style.boxShadow || "".concat(theme.palette.getAccent50(), " 0px 0px 0px 1px"),
    closeIconTint: _createGroupConfiguration.style.closeIconTint || theme.palette.getPrimary(),
    titleTextFont: _createGroupConfiguration.style.titleTextFont || (0, _.fontHelper)(theme.typography.heading),
    titleTextColor: _createGroupConfiguration.style.titleTextColor || theme.palette.getAccent(),
    errorTextBackground: _createGroupConfiguration.style.errorTextBackground || "rgba(255, 59, 48, 0.1)",
    errorTextBorder: _createGroupConfiguration.style.errorTextBorder || "none",
    errorTextBorderRadius: _createGroupConfiguration.style.errorTextBorderRadius || "8px",
    errorTextColor: _createGroupConfiguration.style.errorTextColor || theme.palette.getError(),
    errorTextFont: _createGroupConfiguration.style.errorTextFont || (0, _.fontHelper)(theme.typography.text1),
    groupTypeTextFont: _createGroupConfiguration.style.groupTypeText || (0, _.fontHelper)(theme.typography.text2),
    groupTypeTextColor: _createGroupConfiguration.style.groupTypeTextColor || theme.palette.getAccent(),
    groupTypeTextBackground: _createGroupConfiguration.style.groupTypeBackground || theme.palette.getAccent100(),
    groupTypeTextActiveBackground: _createGroupConfiguration.style.groupTypeTextActiveBackground || theme.palette.getBackground(),
    namePlaceholderTextFont: _createGroupConfiguration.style.namePlaceholderTextFont || (0, _.fontHelper)(theme.typography.subtitle1),
    namePlaceholderTextColor: _createGroupConfiguration.style.namePlaceholderTextColor || theme.palette.getAccent(),
    nameInputBackground: _createGroupConfiguration.style.nameInputBackground || theme.palette.getAccent50(),
    nameInputBorder: _createGroupConfiguration.style.nameInputBorder || "none",
    nameInputBorderRadius: _createGroupConfiguration.style.nameInputBorderRadius || "8px",
    nameInputBoxShadow: _createGroupConfiguration.style.nameInputBoxShadow || "".concat(theme.palette.getAccent50(), " 0px 0px 0px 1px"),
    passwordPlaceholderTextFont: _createGroupConfiguration.style.passwordPlaceholderTextFont || (0, _.fontHelper)(theme.typography.subtitle1),
    passwordPlaceholderTextColor: _createGroupConfiguration.style.passwordPlaceholderTextColor || theme.palette.getAccent(),
    passwordInputBackground: _createGroupConfiguration.style.passwordInputBackground || theme.palette.getAccent50(),
    passwordInputBorder: _createGroupConfiguration.style.passwordInputBorder || "none",
    passwordInputBorderRadius: _createGroupConfiguration.style.passwordInputBorderRadius || "8px",
    passwordInputBoxShadow: _createGroupConfiguration.style.passwordInputBoxShadow || "".concat(theme.palette.getAccent50(), " 0px 0px 0px 1px"),
    createGroupButtonTextFont: _createGroupConfiguration.style.createGroupButtonTextFont || (0, _.fontHelper)(theme.typography.title2),
    createGroupButtonTextColor: _createGroupConfiguration.style.createGroupButtonTextColor || theme.palette.getAccent900("light"),
    createGroupButtonBackground: theme.palette.getPrimary(),
    createGroupButtonBorderRadius: "8px"
  };
};
exports.getCreateGroupStyle = getCreateGroupStyle;
var getListBaseStyle = function getListBaseStyle(style, theme) {
  var _theme$palette3, _theme$palette4;
  return {
    width: "100%",
    height: "100%",
    border: "0px none",
    cornerRadius: style === null || style === void 0 ? void 0 : style.cornerRadius,
    background: style.background || theme.palette.background[theme.palette.mode],
    titleFont: (style === null || style === void 0 ? void 0 : style.titleFont) || (0, _.fontHelper)(theme.typography.heading),
    titleColor: (style === null || style === void 0 ? void 0 : style.titleColor) || (theme === null || theme === void 0 ? void 0 : (_theme$palette3 = theme.palette) === null || _theme$palette3 === void 0 ? void 0 : _theme$palette3.getAccent()),
    backIconTint: (style === null || style === void 0 ? void 0 : style.backIconTint) || (theme === null || theme === void 0 ? void 0 : (_theme$palette4 = theme.palette) === null || _theme$palette4 === void 0 ? void 0 : _theme$palette4.getPrimary()),
    searchBorder: (style === null || style === void 0 ? void 0 : style.searchBorder) || "1px solid " + theme.palette.accent50[theme.palette.mode],
    searchCornerRadius: (style === null || style === void 0 ? void 0 : style.searchCornerRadius) || "8px",
    searchBackground: (style === null || style === void 0 ? void 0 : style.searchBackground) || theme.palette.accent50[theme.palette.mode],
    searchTextColor: (style === null || style === void 0 ? void 0 : style.searchTextColor) || theme.palette.accent500[theme.palette.mode],
    searchIconTint: (style === null || style === void 0 ? void 0 : style.searchIconTint) || theme.palette.accent500[theme.palette.mode],
    searchTextFont: (style === null || style === void 0 ? void 0 : style.searchTextFont) || (0, _.fontHelper)(theme.typography.text1)
  };
};
exports.getListBaseStyle = getListBaseStyle;
var getListStyle = function getListStyle(_groupListConfiguration, theme) {
  return {
    width: _groupListConfiguration.style.width || "100%",
    height: _groupListConfiguration.style.height || "100%",
    background: _groupListConfiguration.style.background || "transparent",
    border: _groupListConfiguration.style.border || "0 none",
    borderRadius: _groupListConfiguration.style.borderRadius || "0",
    loadingIconTint: _groupListConfiguration.style.loadingIconTint || theme.palette.accent600[theme.palette.mode],
    emptyTextFont: _groupListConfiguration.style.emptyTextFont || (0, _.fontHelper)(theme.typography.heading),
    emptyTextColor: _groupListConfiguration.style.emptyTextColor || theme.palette.accent400[theme.palette.mode],
    errorTextFont: _groupListConfiguration.style.errorTextFont || (0, _.fontHelper)(theme.typography.heading),
    errorTextColor: _groupListConfiguration.style.errorTextColor || theme.palette.accent400[theme.palette.mode]
  };
};
exports.getListStyle = getListStyle;