import { _ as _defineProperty } from '../_verture/defineProperty-62acccfc.js';
import { _ as __rest } from '../_verture/tslib.es6-55ed4bd2.js';
import { jsxs, jsx } from 'react/jsx-runtime';
import React__default from 'react';
import clsx from 'clsx';
import { a as $rcPrefixCls, $ as $prefixCls } from '../_verture/constant-66aa48a1.js';
import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
import '../_verture/typeof-498dd2b1.js';

//TimelineItem
var TimelineItem = function TimelineItem(props) {
  var _clsx, _clsx2;
  var className = props.className,
    color = props.color,
    dot = props.dot,
    _props$pending = props.pending,
    pending = _props$pending === void 0 ? false : _props$pending;
    props.position;
    var label = props.label,
    children = props.children,
    restProps = __rest(props, ["className", "color", "dot", "pending", "position", "label", "children"]);
  var prefixCls = "".concat($rcPrefixCls, "-timeline");
  //item cls
  var itemClassName = clsx((_clsx = {}, _defineProperty(_clsx, "".concat(prefixCls, "-item"), true), _defineProperty(_clsx, "".concat(prefixCls, "-item-pending"), pending), _clsx), className);
  //dot cls
  var dotClassName = clsx((_clsx2 = {}, _defineProperty(_clsx2, "".concat(prefixCls, "-item-head"), true), _defineProperty(_clsx2, "".concat(prefixCls, "-item-head-custom"), !!dot), _defineProperty(_clsx2, "".concat(prefixCls, "-item-head-").concat(color), color), _clsx2));
  return jsxs("li", Object.assign({}, restProps, {
    className: itemClassName
  }, {
    children: [label && jsx("div", Object.assign({
      className: "".concat(prefixCls, "-item-label")
    }, {
      children: label
    })), jsx("div", {
      className: "".concat(prefixCls, "-item-tail")
    }), jsx("div", Object.assign({
      className: dotClassName,
      style: {
        borderColor: color,
        color: color
      }
    }, {
      children: dot
    })), jsx("div", Object.assign({
      className: "".concat(prefixCls, "-item-content")
    }, {
      children: children
    }))]
  }));
};

var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2022/6/9 下午8:00\n* @description\n*/\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-v3-timeline {\n  color: rgb(46, 55, 67);\n  font-size: 14px;\n  line-height: 1.5715;\n  list-style: none;\n}\n.paraui-v3-timeline .component-timeline-item {\n  position: relative;\n  margin: 0;\n  min-height: 70px;\n  padding-bottom: 20px;\n  font-size: 14px;\n  list-style: none;\n}\n.paraui-v3-timeline .component-timeline-item-disabled .component-timeline-item-head:not(.component-timeline-item-head-custom) {\n  background-color: rgba(171, 176, 185, 0.4);\n}\n.paraui-v3-timeline .component-timeline-item-disabled .component-timeline-item-head svg {\n  color: rgba(171, 176, 185, 0.4);\n}\n.paraui-v3-timeline .component-timeline-item-disabled .component-timeline-item-content {\n  color: rgba(46, 55, 67, 0.4);\n}\n.paraui-v3-timeline .component-timeline-item-tail {\n  position: absolute;\n  top: 16px;\n  bottom: 8px;\n  left: 3.5px;\n  border-left: 1px solid rgba(171, 176, 185, 0.2);\n}\n.paraui-v3-timeline .component-timeline-item-pending .component-timeline-item-head {\n  font-size: 12px;\n  background-color: transparent;\n}\n.paraui-v3-timeline .component-timeline-item-pending .component-timeline-item-tail {\n  display: none;\n}\n.paraui-v3-timeline .component-timeline-item-head {\n  position: absolute;\n  width: 8px;\n  height: 8px;\n  background-color: rgb(54, 102, 214);\n  border-radius: 100px;\n}\n.paraui-v3-timeline .component-timeline-item-head-custom {\n  position: absolute;\n  top: 5.5px;\n  left: 5px;\n  width: auto;\n  height: auto;\n  margin-top: 0;\n  padding: 3px 1px;\n  line-height: 1;\n  text-align: center;\n  border: 0;\n  border-radius: 0;\n  background-color: transparent;\n  transform: translate(-50%, -50%);\n}\n.paraui-v3-timeline .component-timeline-item-content {\n  position: relative;\n  top: -7px;\n  margin: 0 0 0 20px;\n  word-break: break-word;\n}\n.paraui-v3-timeline .component-timeline-item-last > .component-timeline-item-tail {\n  display: none;\n}\n.paraui-v3-timeline .component-timeline-item-last > .component-timeline-item-content {\n  min-height: 48px;\n}\n\n.paraui-v3-timeline.paraui-v3-timeline-alternate .component-timeline-item-tail,\n.paraui-v3-timeline.paraui-v3-timeline-right .component-timeline-item-tail,\n.paraui-v3-timeline.paraui-v3-timeline-label .component-timeline-item-tail,\n.paraui-v3-timeline.paraui-v3-timeline-alternate .component-timeline-item-head,\n.paraui-v3-timeline.paraui-v3-timeline-right .component-timeline-item-head,\n.paraui-v3-timeline.paraui-v3-timeline-label .component-timeline-item-head,\n.paraui-v3-timeline.paraui-v3-timeline-alternate .component-timeline-item-head-custom,\n.paraui-v3-timeline.paraui-v3-timeline-right .component-timeline-item-head-custom,\n.paraui-v3-timeline.paraui-v3-timeline-label .component-timeline-item-head-custom {\n  left: 50%;\n}\n\n.paraui-v3-timeline.paraui-v3-timeline-alternate .component-timeline-item-head,\n.paraui-v3-timeline.paraui-v3-timeline-right .component-timeline-item-head,\n.paraui-v3-timeline.paraui-v3-timeline-label .component-timeline-item-head {\n  margin-left: -4px;\n}\n\n.paraui-v3-timeline.paraui-v3-timeline-alternate .component-timeline-item-head-custom,\n.paraui-v3-timeline.paraui-v3-timeline-right .component-timeline-item-head-custom,\n.paraui-v3-timeline.paraui-v3-timeline-label .component-timeline-item-head-custom {\n  margin-left: 1px;\n}\n\n.paraui-v3-timeline.paraui-v3-timeline-alternate .component-timeline-item-left .component-timeline-item-content,\n.paraui-v3-timeline.paraui-v3-timeline-right .component-timeline-item-left .component-timeline-item-content,\n.paraui-v3-timeline.paraui-v3-timeline-label .component-timeline-item-left .component-timeline-item-content {\n  left: calc(50% - 4px);\n  width: calc(50% - 14px);\n  text-align: left;\n}\n\n.paraui-v3-timeline.paraui-v3-timeline-alternate .component-timeline-item-right .component-timeline-item-content,\n.paraui-v3-timeline.paraui-v3-timeline-right .component-timeline-item-right .component-timeline-item-content,\n.paraui-v3-timeline.paraui-v3-timeline-label .component-timeline-item-right .component-timeline-item-content {\n  width: calc(50% - 12px);\n  margin: 0;\n  text-align: right;\n}\n\n.paraui-v3-timeline.paraui-v3-timeline-right .component-timeline-item-right .component-timeline-item-tail,\n.paraui-v3-timeline.paraui-v3-timeline-right .component-timeline-item-right .component-timeline-item-head,\n.paraui-v3-timeline.paraui-v3-timeline-right .component-timeline-item-right .component-timeline-item-head-custom {\n  left: calc(100% - 4px - 2px);\n}\n\n.paraui-v3-timeline.paraui-v3-timeline-right .component-timeline-item-right .component-timeline-item-content {\n  width: calc(100% - 18px);\n}\n\n.paraui-v3-timeline.paraui-v3-timeline-pending .component-timeline-item-last .component-timeline-item-tail {\n  display: block;\n  height: calc(100% - 14px);\n  border-left: 2px dotted #f0f0f0;\n}\n\n.paraui-v3-timeline.paraui-v3-timeline-reverse .component-timeline-item-last .component-timeline-item-tail {\n  display: none;\n}\n\n.paraui-v3-timeline.paraui-v3-timeline-reverse .component-timeline-item-pending .component-timeline-item-tail {\n  top: 15px;\n  display: block;\n  height: calc(100% - 15px);\n  border-left: 2px dotted #f0f0f0;\n}\n\n.paraui-v3-timeline.paraui-v3-timeline-reverse .component-timeline-item-pending .component-timeline-item-content {\n  min-height: 48px;\n}\n\n.paraui-v3-timeline.paraui-v3-timeline-label .component-timeline-item-label {\n  position: absolute;\n  top: -7.001px;\n  width: calc(50% - 12px);\n  text-align: right;\n}\n\n.paraui-v3-timeline.paraui-v3-timeline-label .component-timeline-item-right .component-timeline-item-label {\n  left: calc(50% + 14px);\n  width: calc(50% - 14px);\n  text-align: left;\n}";
styleInject(css_248z);

//Timeline
var Timeline = function Timeline(props) {
  var _clsx;
  var _props$pending = props.pending,
    pending = _props$pending === void 0 ? null : _props$pending,
    pendingDot = props.pendingDot,
    children = props.children,
    className = props.className,
    _props$reverse = props.reverse,
    reverse = _props$reverse === void 0 ? false : _props$reverse,
    _props$mode = props.mode,
    mode = _props$mode === void 0 ? 'left' : _props$mode,
    align = props.align,
    data = props.data,
    restProps = __rest(props, ["pending", "pendingDot", "children", "className", "reverse", "mode", "align", "data"]);
  var prefixCls = "".concat($prefixCls, "-timeline");
  var innerMode = align !== null && align !== void 0 ? align : mode; //时间轴和内容相对位置
  var pendingNode = typeof pending === 'boolean' ? null : pending; //是否有幽灵节点
  //pending节点项
  var pendingItem = pending ? jsx(TimelineItem, Object.assign({
    pending: !!pending,
    dot: pendingDot
  }, {
    children: pendingNode
  })) : null;
  var timeLineItems = React__default.Children.toArray(children);
  timeLineItems.push(pendingItem);
  if (reverse) {
    //取反
    timeLineItems.reverse();
  }
  //position cls
  var getPositionCls = function getPositionCls(ele, idx) {
    var _a, _b, _c;
    if (innerMode === 'alternate') {
      if (((_a = ele === null || ele === void 0 ? void 0 : ele.props) === null || _a === void 0 ? void 0 : _a.position) === 'right') return "".concat($rcPrefixCls, "-timeline-item-right");
      if (((_b = ele === null || ele === void 0 ? void 0 : ele.props) === null || _b === void 0 ? void 0 : _b.position) === 'left') return "".concat($rcPrefixCls, "-timeline-item-left");
      return idx % 2 === 0 ? "".concat($rcPrefixCls, "-timeline-item-left") : "".concat($rcPrefixCls, "-timeline-item-right");
    }
    if (innerMode === 'left') return "".concat($rcPrefixCls, "-timeline-item-left");
    if (innerMode === 'right') return "".concat($rcPrefixCls, "-timeline-item-right");
    if (((_c = ele === null || ele === void 0 ? void 0 : ele.props) === null || _c === void 0 ? void 0 : _c.position) === 'right') return "".concat($rcPrefixCls, "-timeline-item-right");
    return '';
  };
  //实际渲染项
  var truthyItems = timeLineItems.filter(function (item) {
    return !!item;
  });
  var itemsCount = React__default.Children.count(truthyItems);
  var lastCls = "".concat($rcPrefixCls, "-timeline-item-last");
  var items = React__default.Children.map(truthyItems, function (ele, idx) {
    var pendingClass = idx === itemsCount - 2 ? lastCls : '';
    var readyClass = idx === itemsCount - 1 ? lastCls : '';
    return /*#__PURE__*/React__default.cloneElement(ele, {
      className: clsx([ele.props.className, !reverse && !!pending ? pendingClass : readyClass, getPositionCls(ele, idx)])
    });
  });
  //label
  var hasLabelItem = timeLineItems.some(function (item) {
    var _a;
    return !!((_a = item === null || item === void 0 ? void 0 : item.props) === null || _a === void 0 ? void 0 : _a.label);
  });
  //classname
  var makeCls = clsx(prefixCls, (_clsx = {}, _defineProperty(_clsx, "".concat(prefixCls, "-pending"), !!pending), _defineProperty(_clsx, "".concat(prefixCls, "-reverse"), !!reverse), _defineProperty(_clsx, "".concat(prefixCls, "-").concat(innerMode), !!innerMode && !hasLabelItem), _defineProperty(_clsx, "".concat(prefixCls, "-label"), hasLabelItem), _clsx), className);
  //渲染items
  var renderItems = function renderItems() {
    if (!(data === null || data === void 0 ? void 0 : data.length)) return items;
    var itemsCount = data.length;
    var lastCls = "".concat($rcPrefixCls, "-timeline-item-last");
    return data.map(function (item, idx) {
      var dotIcon = item.dotIcon,
        content = item.content,
        _item$disabled = item.disabled,
        disabled = _item$disabled === void 0 ? false : _item$disabled,
        className = item.className;
      var pendingClass = idx === itemsCount - 2 ? lastCls : '';
      var readyClass = idx === itemsCount - 1 ? lastCls : '';
      return jsx(TimelineItem, Object.assign({
        dot: dotIcon,
        className: clsx([className, _defineProperty({}, "".concat($rcPrefixCls, "-timeline-item-disabled"), disabled), !reverse && !!pending ? pendingClass : readyClass, getPositionCls(null, idx)])
      }, {
        children: content
      }), idx);
    });
  };
  return jsx("ul", Object.assign({}, restProps, {
    className: makeCls
  }, {
    children: renderItems()
  }));
};
Timeline.Item = TimelineItem;

export { Timeline, Timeline as default };
