var _excluded = ["_comment", "_shape", "status", "image", "icon", "title", "subTitle", "time", "timeLeft", "content", "animation", "discription", "tags", "collapsible", "defaultCollapsed", "collapsed", "onCollapse", "dotRender"];
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) { _defineProperty(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; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
import React, { useCallback, useState } from 'react';
import './index.scss';
import { Icon, Timeline } from '@alicloudfe/components';
import classnames from 'classnames';
import { usePrefixCls, dateFormat } from '@teamix/utils';
import { renderTags } from '../../field';
import TeamixIcon from '@teamix/icon';
var TimelineItem = Timeline.Item;
var cls = usePrefixCls('teamix-pro-timeline');
var ProTimeLineItem = function ProTimeLineItem(props) {
  var _props$_comment = props._comment,
    _comment = _props$_comment === void 0 ? false : _props$_comment,
    _shape = props._shape,
    status = props.status,
    image = props.image,
    icon = props.icon,
    title = props.title,
    subTitle = props.subTitle,
    time = props.time,
    timeLeft = props.timeLeft,
    content = props.content,
    animation = props.animation,
    discription = props.discription,
    tags = props.tags,
    collapsible = props.collapsible,
    defaultCollapsed = props.defaultCollapsed,
    collapsed = props.collapsed,
    onCollapse = props.onCollapse,
    dotRender = props.dotRender,
    others = _objectWithoutProperties(props, _excluded);
  var timeRight = time !== null && time !== void 0 ? time : subTitle; // 兼容 subTitle
  /** 内容去折叠相关 */
  var _useState = useState(defaultCollapsed !== undefined ? defaultCollapsed : false),
    _useState2 = _slicedToArray(_useState, 2),
    innerCollapseState = _useState2[0],
    setInnerCollapseState = _useState2[1];
  var hasCollapse = collapsible === true || defaultCollapsed !== undefined || collapsed !== undefined;
  var collapseState = collapsed !== undefined ? collapsed : innerCollapseState;
  var showContent = hasCollapse ? !collapseState : true;
  var onCollapseChanged = function onCollapseChanged() {
    onCollapse && onCollapse(!collapseState);
    if (collapsed !== undefined) {
      return;
    }
    setInnerCollapseState(!collapseState);
  };
  /** 对枚举参数进行处理 */
  var formatTime = function formatTime(time) {
    if (typeof time === 'string') return dateFormat(time, '', 'YYYY-MM-DD hh:mm:ss');
    return time;
  };
  var formatShape = function formatShape() {
    if (['dot', 'circle'].includes(_shape)) return _shape;
    return 'dot';
  };
  var formatStatus = function formatStatus() {
    if (['success', 'fail', 'process', 'warning', 'wait'].includes(status)) return status;
    return 'wait';
  };
  /**一些复用常数 */
  var circle = formatShape() === 'circle';
  var dot = formatShape() === 'dot';
  var process = formatStatus() === 'process';
  var success = formatStatus() === 'success';
  var error = formatStatus() === 'fail';
  var warning = formatStatus() === 'warning';
  var wait = formatStatus() === 'wait';
  /**对元素进行渲染 */
  var renderImage = function renderImage() {
    if (typeof image === 'string') {
      return /*#__PURE__*/React.createElement("img", {
        src: image,
        alt: ""
      });
    }
    return image;
  };
  var renderTag = function renderTag() {
    if (_typeof(tags) === 'object') {
      return renderTags(tags, 'small');
    }
    return tags;
  };
  var renderTimeLeft = useCallback(function () {
    return timeLeft && /*#__PURE__*/React.createElement("span", {
      className: classnames(cls({
        'time-left': true,
        'time-left-dot': dot,
        'time-left-circle': circle
      }))
    }, formatTime(timeLeft));
  }, [_shape, timeLeft]);
  var renderTitle = useCallback(function () {
    return /*#__PURE__*/React.createElement("div", {
      className: classnames(cls({
        wrapper: true,
        'wrapper-dot': dot && !timeLeft,
        'wrapper-circle': circle && !timeLeft,
        'wrapper-time-left-dot': dot && timeLeft,
        'wrapper-time-left-circle': circle && timeLeft
      }))
    }, /*#__PURE__*/React.createElement("div", {
      className: classnames(cls('wrapper-left'))
    }, hasCollapse && /*#__PURE__*/React.createElement("div", {
      className: classnames(cls('wrapper-left-fold-icon')),
      onClick: function onClick() {
        return onCollapseChanged();
      }
    }, /*#__PURE__*/React.createElement("div", {
      className: classnames(cls({
        'wrapper-left-fold-icon-close': true,
        'wrapper-left-fold-icon-open': !collapseState
      }))
    })), image && /*#__PURE__*/React.createElement("div", {
      className: classnames(cls('wrapper-left-fold-image'))
    }, renderImage())), /*#__PURE__*/React.createElement("div", {
      className: classnames(cls('wrapper-right'))
    }, /*#__PURE__*/React.createElement("div", {
      className: classnames(cls('wrapper-right-top'))
    }, title && /*#__PURE__*/React.createElement("div", {
      className: classnames(cls({
        'wrapper-right-top-title-info': true
      }))
    }, title), tags && /*#__PURE__*/React.createElement("div", {
      className: classnames(cls('wrapper-right-top-tag-info'))
    }, renderTag()), timeRight && /*#__PURE__*/React.createElement("div", {
      className: classnames(cls('wrapper-right-top-subTitle-info'))
    }, formatTime(timeRight))), discription && /*#__PURE__*/React.createElement("div", {
      className: classnames(cls('wrapper-right-discribe-info'))
    }, discription), /*#__PURE__*/React.createElement("div", {
      className: classnames(cls('wrapper-right-content-info'))
    }, /*#__PURE__*/React.createElement("div", {
      className: classnames(cls({
        'wrapper-right-content-info-close': !showContent,
        'wrapper-right-content-info-open': showContent
      }))
    }, content))));
  }, [_shape, timeLeft, image, title, tags, timeRight, discription, content, collapsible, collapsed, defaultCollapsed, onCollapseChanged]);
  /**
   * 重新渲染 timeline 节点
   * */
  var renderNode = useCallback(function () {
    // shape 取 dot
    var renderDot = function renderDot() {
      return !icon ? /*#__PURE__*/React.createElement("div", {
        className: classnames(cls({
          'item-render-wrapper-dot': true,
          'item-render-wrapper-dot-process': process,
          'item-render-wrapper-dot-success': success,
          'item-render-wrapper-dot-error': error,
          'item-render-wrapper-dot-warning': warning,
          'item-render-wrapper-dot-wait': wait
        }))
      }) : /*#__PURE__*/React.createElement("div", {
        className: classnames(cls({
          'item-render-wrapper-icon-process': process,
          'item-render-wrapper-icon-success': success,
          'item-render-wrapper-icon-error': error,
          'item-render-wrapper-icon-warning': warning,
          'item-render-wrapper-icon-wait': wait
        }))
      }, /*#__PURE__*/React.createElement(Icon, {
        type: icon,
        size: "small"
      }));
    };
    // shape 取 circle
    var renderCircle = function renderCircle() {
      if (dotRender) return /*#__PURE__*/React.createElement("div", {
        className: classnames(cls('item-render-wrapper'))
      }, dotRender());
      var renderCircleItem = function renderCircleItem() {
        // 有传入 icon 渲染 icon
        if (icon) return /*#__PURE__*/React.createElement(Icon, {
          type: icon,
          size: "small"
        });
        if (success) return /*#__PURE__*/React.createElement(TeamixIcon, {
          type: "check-line",
          size: "small"
        });
        if (error) return /*#__PURE__*/React.createElement(TeamixIcon, {
          type: "close-line",
          size: "small"
        });
        if (warning) return /*#__PURE__*/React.createElement(TeamixIcon, {
          type: "exclamation-line",
          size: "small"
        });
        if (process && circle) return /*#__PURE__*/React.createElement(TeamixIcon, {
          type: "loading-line",
          size: "small"
        });
        return /*#__PURE__*/React.createElement(TeamixIcon, {
          type: "more-line",
          size: "small"
        });
      };
      return /*#__PURE__*/React.createElement("div", {
        className: classnames(cls({
          'item-render-wrapper-circle': true,
          'item-render-wrapper-circle-process': process,
          'item-render-wrapper-circle-success': success,
          'item-render-wrapper-circle-error': error,
          'item-render-wrapper-circle-warning': warning,
          'item-render-wrapper-circle-wait': wait
        }))
      }, renderCircleItem());
    };
    var renderStateNode = function renderStateNode() {
      if (circle) {
        return renderCircle();
      }
      return renderDot();
    };
    return /*#__PURE__*/React.createElement("div", {
      className: classnames(cls('item'))
    }, /*#__PURE__*/React.createElement("div", {
      className: classnames(cls({
        'item-render-wrapper': true
      }))
    }, !_comment && renderStateNode()));
  }, [_shape, icon, status, dotRender]);
  return /*#__PURE__*/React.createElement(TimelineItem, _objectSpread({
    title: renderTitle(),
    dot: renderNode(),
    timeLeft: renderTimeLeft(),
    animation: animation
  }, others));
};
ProTimeLineItem.displayName = 'ProTimeLineItem';
export default ProTimeLineItem;