import React__default, { useMemo } from 'react';
import IconButton from '../../ui/IconButton.js';
import Icon, { IconTypes, IconColors } from '../../ui/Icon.js';
import { L as Label, a as LabelTypography, b as LabelColors } from '../../index-4111594a.js';
import TextButton from '../../ui/TextButton.js';
import { u as useLocalization } from '../../LocalizationContext-9c54e783.js';
import '../../_rollupPluginBabelHelpers-b2d9bfc5.js';
import 'prop-types';
import '../../stringSet-1f18348a.js';
import '../../color-3bac434a.js';
import '../../index-a9ddd0f5.js';

function ThreadHeader(_ref) {
  let {
    className,
    channelName,
    renderActionIcon,
    onActionIconClick,
    onChannelNameClick
  } = _ref;
  const {
    stringSet
  } = useLocalization();
  const MemoizedActionIcon = useMemo(() => {
    if (typeof renderActionIcon === 'function') {
      return renderActionIcon({
        onActionIconClick
      });
    }
    return null;
  }, [renderActionIcon]);
  return /*#__PURE__*/React__default.createElement("div", {
    className: `sendbird-thread-header ${className}`
  }, /*#__PURE__*/React__default.createElement(Label, {
    className: "sendbird-thread-header__title",
    type: LabelTypography.H_2,
    color: LabelColors.ONBACKGROUND_1
  }, stringSet.THREAD__HEADER_TITLE), /*#__PURE__*/React__default.createElement(TextButton, {
    onClick: e => onChannelNameClick(e),
    disableUnderline: true
  }, /*#__PURE__*/React__default.createElement(Label, {
    className: "sendbird-thread-header__channel-name",
    type: LabelTypography.CAPTION_3,
    color: LabelColors.ONBACKGROUND_2
  }, channelName)), MemoizedActionIcon || /*#__PURE__*/React__default.createElement("div", {
    className: "sendbird-thread-header__action"
  }, /*#__PURE__*/React__default.createElement(IconButton, {
    width: "32px",
    height: "32px",
    onClick: e => onActionIconClick(e)
  }, /*#__PURE__*/React__default.createElement(Icon, {
    type: IconTypes.CLOSE,
    fillColor: IconColors.ON_BACKGROUND_1,
    width: "22px",
    height: "22px"
  }))));
}

export { ThreadHeader as default };
//# sourceMappingURL=ThreadHeader.js.map
