"use strict";

exports.__esModule = true;
exports.default = void 0;

var _react = _interopRequireWildcard(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _ListItem = _interopRequireDefault(require("@material-ui/core/ListItem"));

var _ListItemText = _interopRequireDefault(require("@material-ui/core/ListItemText"));

var _ListItemIcon = _interopRequireDefault(require("@material-ui/core/ListItemIcon"));

var _Typography = _interopRequireDefault(require("@material-ui/core/Typography"));

var _hooks = require("subfirelib/hooks");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (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; }

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

const overflow = showCompressed => showCompressed ? {
  whiteSpace: 'nowrap',
  overflow: 'hidden',
  textOverflow: 'ellipsis'
} : {};

const SongLiteItemContents = ({
  isCurrent,
  album,
  artist,
  coverArtUrl,
  title,
  year,
  id,
  idx,
  showListIndex,
  showMeta,
  showCover,
  showYear,
  showCompressed,
  coverSize,
  onClick,
  ref
}) => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, showCover && /*#__PURE__*/_react.default.createElement(_ListItemIcon.default, {
  style: {
    width: coverSize,
    height: coverSize,
    minWidth: showCompressed ? 40 : null
  }
}, /*#__PURE__*/_react.default.createElement("img", {
  alt: title,
  src: coverArtUrl,
  style: {
    width: coverSize,
    height: coverSize
  },
  loading: "lazy",
  crossOrigin: "anonymous"
})), /*#__PURE__*/_react.default.createElement(_ListItemText.default, {
  style: {
    marginTop: showCompressed ? 4 : null,
    marginBottom: showCompressed ? 4 : null,
    ...overflow(showCompressed),
    fontStyle: isCurrent ? 'italic' : null
  },
  primaryTypographyProps: {
    style: {
      lineHeight: showCompressed ? 'normal' : null,
      letterSpacing: showCompressed ? 'normal' : null,
      ...overflow(showCompressed)
    }
  }
}, showListIndex ? idx + 1 + '. ' : '', title, showMeta && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement(_Typography.default, {
  variant: "caption",
  style: {
    lineHeight: showCompressed ? 'normal' : null,
    letterSpacing: showCompressed ? 'normal' : null,
    ...overflow(showCompressed)
  }
}, artist, " - ", album, showYear && ` - (${year})`))));

const SongListItem = props => {
  const {
    onClick,
    song,
    ...rest
  } = props;
  const {
    showCompressed,
    isCurrent
  } = rest;
  const alreadyScrolled = (0, _react.useRef)(false);

  const handler = node => {
    if (node && isCurrent && node.scrollIntoView && !alreadyScrolled.current) {
      node.scrollIntoView();
      alreadyScrolled.current = true;
    }
  };

  (0, _react.useEffect)(() => {
    return () => alreadyScrolled.current = false;
  }, []);
  const [ref] = (0, _hooks.useRefCallbackHandler)(handler);
  const {
    id
  } = song;
  const styles = {};

  if (showCompressed) {
    styles.paddingLeft = 8;
    styles.paddingRight = 8;
    styles.paddingTop = 2;
    styles.paddingBottom = 2;
  }

  return /*#__PURE__*/_react.default.createElement(_ListItem.default, {
    ref: ref,
    style: styles,
    "data-song-id": id,
    id: 'songs-li-' + id,
    button: true,
    onClick: onClick && onClick.bind(onClick.prototype, song)
  }, /*#__PURE__*/_react.default.createElement(SongLiteItemContents, _extends({}, rest, song)));
};

SongListItem.propTypes = {
  isCurrent: _propTypes.default.bool,
  album: _propTypes.default.string,
  artist: _propTypes.default.string,
  coverArtUrl: _propTypes.default.string,
  title: _propTypes.default.string,
  year: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
  id: _propTypes.default.string,
  idx: _propTypes.default.number,
  showListIndex: _propTypes.default.bool,
  showMeta: _propTypes.default.bool,
  showCover: _propTypes.default.bool,
  showYear: _propTypes.default.bool,
  showCompressed: _propTypes.default.bool,
  coverSize: _propTypes.default.number,
  onClick: _propTypes.default.func,
  ref: _propTypes.default.any,
  song: _propTypes.default.object
};
var _default = SongListItem;
exports.default = _default;
SongLiteItemContents.propTypes = SongListItem.propTypes;