cometchat-react-ui-kit2/dist/Shared/UtilityComponents/CometChatActionSheet/index.js

CometChat UI Kit for React App

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.CometChatActionSheet = void 0;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var React = _interopRequireWildcard(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _ = require("../..");
var _layoutType = require("./layoutType");
var _hooks = require("./hooks");
var _style = require("./style");
var _fileUpload = _interopRequireDefault(require("./resources/file-upload.svg"));
var _this = void 0;
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
var CometChatActionSheet = function CometChatActionSheet(props) {
  var _React$useState = React.useState([]),
    _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
    actionList = _React$useState2[0],
    setActionList = _React$useState2[1];
  var _React$useState3 = React.useState(props.layoutMode),
    _React$useState4 = (0, _slicedToArray2["default"])(_React$useState3, 2),
    mode = _React$useState4[0],
    setMode = _React$useState4[1];
  var _React$useState5 = React.useState(new _.CometChatTheme(props.theme || {})),
    _React$useState6 = (0, _slicedToArray2["default"])(_React$useState5, 1),
    theme = _React$useState6[0];
  var toggleLayoutMode = function toggleLayoutMode() {
    var newMode = mode === _layoutType.layoutType.list ? _layoutType.layoutType.grid : _layoutType.layoutType.list;
    setMode(newMode);
  };
  var renderKey = null;
  var renderItems = actionList.map(function (action, index) {
    return /*#__PURE__*/React.createElement(_.CometChatListItem, {
      key: action === null || action === void 0 ? void 0 : action.type,
      iconURL: action === null || action === void 0 ? void 0 : action.icon,
      text: action === null || action === void 0 ? void 0 : action.name,
      style: (0, _style.listItemStyle)(props, mode, index, theme),
      onItemClick: action.onActionClick
    });
  });
  var toggleLayoutButton = !props.hideLayoutMode ? /*#__PURE__*/React.createElement("div", {
    className: "sheet__layout",
    style: (0, _style.actionSheetLayoutIconStyle)(props, mode),
    onClick: toggleLayoutMode.bind(_this)
  }) : null;
  (0, _hooks.Hooks)(props, setActionList);
  return /*#__PURE__*/React.createElement("div", {
    className: "action__sheet",
    style: (0, _style.actionSheetWrapperStyle)(props, mode)
  }, /*#__PURE__*/React.createElement("div", {
    key: renderKey,
    className: "sheet__header",
    style: (0, _style.actionSheetHeaderStyle)(props)
  }, /*#__PURE__*/React.createElement("div", {
    className: "sheet__title",
    style: (0, _style.actionSheetTitleStyle)(props)
  }, props.title), toggleLayoutButton), /*#__PURE__*/React.createElement("div", {
    className: "sheet__items",
    style: (0, _style.sheetItemListStyle)(mode)
  }, renderItems));
};
exports.CometChatActionSheet = CometChatActionSheet;
CometChatActionSheet.defaultProps = {
  title: (0, _.localize)("ADD_TO_CHAT"),
  layoutModeIconURL: _fileUpload["default"],
  layoutMode: _layoutType.layoutType["list"],
  hideLayoutMode: false,
  actions: [],
  style: {
    layoutModeIconTint: "rgba(20, 20, 20, 0.04)",
    borderRadius: "8px",
    background: "rgb(255,255,255)",
    border: "0 none",
    width: "272px",
    height: "236px",
    titleFont: "15px 600 Inter, sans-serif",
    titleColor: "#141414"
  }
};
CometChatActionSheet.propTypes = {
  title: _propTypes["default"].string,
  layoutMode: _propTypes["default"].oneOf(["list", "grid"]),
  hideLayoutMode: _propTypes["default"].bool,
  layoutModeIconURL: _propTypes["default"].string,
  style: _propTypes["default"].object,
  actions: _propTypes["default"].array
};