cometchat-react-ui-kit2/dist/Shared/PrimaryComponents/CometChatListBase/style.js

CometChat UI Kit for React App

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.listBaseTitleStyle = exports.listBaseStyle = exports.listBaseSearchStyle = exports.listBaseSearchInputStyle = exports.listBaseSearchButtonStyle = exports.listBaseNavStyle = exports.listBaseHeadStyle = exports.listBaseContainerStyle = exports.backButtonStyle = 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 listBaseStyle = function listBaseStyle(style, theme) {
  var _style$background, _theme$palette;
  return {
    display: "flex",
    flexDirection: "column",
    alignItems: "flex-start",
    padding: "0px",
    width: style === null || style === void 0 ? void 0 : style.width,
    height: style === null || style === void 0 ? void 0 : style.height,
    background: (_style$background = style === null || style === void 0 ? void 0 : style.background) !== null && _style$background !== void 0 ? _style$background : theme === null || theme === void 0 ? void 0 : (_theme$palette = theme.palette) === null || _theme$palette === void 0 ? void 0 : _theme$palette.getAccent500(),
    borderRadius: style === null || style === void 0 ? void 0 : style.borderRadius,
    border: style === null || style === void 0 ? void 0 : style.border,
    overflowY: "auto"
  };
};
exports.listBaseStyle = listBaseStyle;
var listBaseHeadStyle = function listBaseHeadStyle(style, hideSearch) {
  var height = !hideSearch ? {
    height: "100px"
  } : {
    height: "64px"
  };
  return _objectSpread({
    display: "flex",
    flexDirection: "column",
    justifyContent: "center",
    alignItems: "center",
    width: style === null || style === void 0 ? void 0 : style.width
  }, height);
};
exports.listBaseHeadStyle = listBaseHeadStyle;
var listBaseNavStyle = function listBaseNavStyle(style) {
  return {
    display: "flex",
    flexDirection: "row",
    justifyContent: "space-between",
    alignItems: "center",
    height: style === null || style === void 0 ? void 0 : style.height,
    width: style === null || style === void 0 ? void 0 : style.width,
    padding: "0px"
  };
};
exports.listBaseNavStyle = listBaseNavStyle;
var backButtonStyle = function backButtonStyle(style, theme, showBackButton, backButtonIconURL) {
  var _style$backIconTint, _theme$palette2;
  return {
    WebkitMask: "url(".concat(backButtonIconURL, ") no-repeat left center"),
    backgroundColor: "".concat((_style$backIconTint = style === null || style === void 0 ? void 0 : style.backIconTint) !== null && _style$backIconTint !== void 0 ? _style$backIconTint : theme === null || theme === void 0 ? void 0 : (_theme$palette2 = theme.palette) === null || _theme$palette2 === void 0 ? void 0 : _theme$palette2.getPrimary()),
    height: "24px",
    width: "24px",
    cursor: "pointer",
    visibility: showBackButton ? "url(".concat(backButtonIconURL, ") no-repeat left center") : 'hidden'
  };
};
exports.backButtonStyle = backButtonStyle;
var listBaseTitleStyle = function listBaseTitleStyle(style, theme) {
  var _style$titleColor, _theme$palette3;
  return {
    padding: '8px',
    font: style === null || style === void 0 ? void 0 : style.titleFont,
    color: (_style$titleColor = style === null || style === void 0 ? void 0 : style.titleColor) !== null && _style$titleColor !== 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(),
    lineHeight: "26px",
    width: style === null || style === void 0 ? void 0 : style.width
  };
};
exports.listBaseTitleStyle = listBaseTitleStyle;
var listBaseSearchStyle = function listBaseSearchStyle(style, theme) {
  var _style$searchBackgrou, _theme$palette4, _style$searchTextColo, _theme$palette5;
  return {
    background: (_style$searchBackgrou = style === null || style === void 0 ? void 0 : style.searchBackground) !== null && _style$searchBackgrou !== void 0 ? _style$searchBackgrou : theme === null || theme === void 0 ? void 0 : (_theme$palette4 = theme.palette) === null || _theme$palette4 === void 0 ? void 0 : _theme$palette4.getAccent500(),
    font: style === null || style === void 0 ? void 0 : style.searchTextFont,
    cursor: "pointer",
    color: (_style$searchTextColo = style === null || style === void 0 ? void 0 : style.searchTextColor) !== null && _style$searchTextColo !== void 0 ? _style$searchTextColo : theme === null || theme === void 0 ? void 0 : (_theme$palette5 = theme.palette) === null || _theme$palette5 === void 0 ? void 0 : _theme$palette5.getAccent(),
    lineHeight: "20px",
    height: "50px",
    width: "calc(100% - 30px)",
    display: "flex",
    justifyContent: "center",
    alignItems: "center",
    margin: "16px",
    paddingLeft: "8px",
    borderRadius: style === null || style === void 0 ? void 0 : style.searchBorderRadius
  };
};
exports.listBaseSearchStyle = listBaseSearchStyle;
var listBaseSearchButtonStyle = function listBaseSearchButtonStyle(style, theme, searchIconURL) {
  var _style$searchIconTint, _theme$palette6;
  return {
    WebkitMask: "url(".concat(searchIconURL, ") no-repeat left center"),
    background: (_style$searchIconTint = style === null || style === void 0 ? void 0 : style.searchIconTint) !== null && _style$searchIconTint !== void 0 ? _style$searchIconTint : theme === null || theme === void 0 ? void 0 : (_theme$palette6 = theme.palette) === null || _theme$palette6 === void 0 ? void 0 : _theme$palette6.getPrimary(),
    border: "none",
    borderRadius: style === null || style === void 0 ? void 0 : style.searchBorderRadius,
    width: "24px",
    padding: "8px 0 8px 8px",
    cursor: "default"
  };
};
exports.listBaseSearchButtonStyle = listBaseSearchButtonStyle;
var listBaseSearchInputStyle = function listBaseSearchInputStyle(style, theme) {
  var _style$searchTextColo2, _theme$palette7;
  var padding = _.CometChatLocalize.isRTL() ? {
    padding: "8px 0 8px 8px"
  } : {
    padding: "8px 8px 8px 0"
  };
  return {
    width: "calc(100% - 35px)",
    outline: "none",
    height: style === null || style === void 0 ? void 0 : style.height,
    font: style === null || style === void 0 ? void 0 : style.searchTextFont,
    color: (_style$searchTextColo2 = style === null || style === void 0 ? void 0 : style.searchTextColor) !== null && _style$searchTextColo2 !== void 0 ? _style$searchTextColo2 : theme === null || theme === void 0 ? void 0 : (_theme$palette7 = theme.palette) === null || _theme$palette7 === void 0 ? void 0 : _theme$palette7.getAccent(),
    background: "transparent",
    border: "white",
    padding: "8px 0 8px 0px"
  };
};
exports.listBaseSearchInputStyle = listBaseSearchInputStyle;
var listBaseContainerStyle = function listBaseContainerStyle(style, hideSearch) {
  var height = !hideSearch ? {
    height: "calc(100% - 100px)"
  } : {
    height: "calc(100% - 64px)"
  };
  return _objectSpread({
    background: "inherit",
    width: style === null || style === void 0 ? void 0 : style.width
  }, height);
};
exports.listBaseContainerStyle = listBaseContainerStyle;