TimelineItemList.js 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
  1. "use client";
  2. import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
  3. var __rest = this && this.__rest || function (s, e) {
  4. var t = {};
  5. for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
  6. if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
  7. if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
  8. }
  9. return t;
  10. };
  11. import * as React from 'react';
  12. import LoadingOutlined from "@ant-design/icons/es/icons/LoadingOutlined";
  13. import classNames from 'classnames';
  14. import TimelineItem from './TimelineItem';
  15. const TimelineItemList = _a => {
  16. var {
  17. prefixCls,
  18. className,
  19. pending = false,
  20. children,
  21. items,
  22. rootClassName,
  23. reverse = false,
  24. direction,
  25. hashId,
  26. pendingDot,
  27. mode = ''
  28. } = _a,
  29. restProps = __rest(_a, ["prefixCls", "className", "pending", "children", "items", "rootClassName", "reverse", "direction", "hashId", "pendingDot", "mode"]);
  30. const getPositionCls = (position, idx) => {
  31. if (mode === 'alternate') {
  32. if (position === 'right') return `${prefixCls}-item-right`;
  33. if (position === 'left') return `${prefixCls}-item-left`;
  34. return idx % 2 === 0 ? `${prefixCls}-item-left` : `${prefixCls}-item-right`;
  35. }
  36. if (mode === 'left') return `${prefixCls}-item-left`;
  37. if (mode === 'right') return `${prefixCls}-item-right`;
  38. if (position === 'right') return `${prefixCls}-item-right`;
  39. return '';
  40. };
  41. const mergedItems = _toConsumableArray(items || []);
  42. const pendingNode = typeof pending === 'boolean' ? null : pending;
  43. if (pending) {
  44. mergedItems.push({
  45. pending: !!pending,
  46. dot: pendingDot || /*#__PURE__*/React.createElement(LoadingOutlined, null),
  47. children: pendingNode
  48. });
  49. }
  50. if (reverse) {
  51. mergedItems.reverse();
  52. }
  53. const itemsCount = mergedItems.length;
  54. const lastCls = `${prefixCls}-item-last`;
  55. const itemsList = mergedItems.filter(item => !!item).map((item, idx) => {
  56. var _a;
  57. const pendingClass = idx === itemsCount - 2 ? lastCls : '';
  58. const readyClass = idx === itemsCount - 1 ? lastCls : '';
  59. const {
  60. className: itemClassName
  61. } = item,
  62. itemProps = __rest(item, ["className"]);
  63. return /*#__PURE__*/React.createElement(TimelineItem, Object.assign({}, itemProps, {
  64. className: classNames([itemClassName, !reverse && !!pending ? pendingClass : readyClass, getPositionCls((_a = item === null || item === void 0 ? void 0 : item.position) !== null && _a !== void 0 ? _a : '', idx)]),
  65. key: (item === null || item === void 0 ? void 0 : item.key) || idx
  66. }));
  67. });
  68. const hasLabelItem = mergedItems.some(item => !!(item === null || item === void 0 ? void 0 : item.label));
  69. const classString = classNames(prefixCls, {
  70. [`${prefixCls}-pending`]: !!pending,
  71. [`${prefixCls}-reverse`]: !!reverse,
  72. [`${prefixCls}-${mode}`]: !!mode && !hasLabelItem,
  73. [`${prefixCls}-label`]: hasLabelItem,
  74. [`${prefixCls}-rtl`]: direction === 'rtl'
  75. }, className, rootClassName, hashId);
  76. return /*#__PURE__*/React.createElement("ol", Object.assign({}, restProps, {
  77. className: classString
  78. }), itemsList);
  79. };
  80. export default TimelineItemList;