@rxflow/base/esm/components/CollapseButton/index.js

BaseFlow - 核心 Flow 组件库

function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
/**
 * @author: yanxianliang
 * @date: 2025-06-21 13:53
 * @desc: 折叠按钮
 *
 * Copyright (c) 2025 by yanxianliang, All Rights Reserved.
 */

import LoadingOutlined from "@ant-design/icons/lib/icons/LoadingOutlined";
import MinusOutlined from '@ant-design/icons/MinusOutlined';
import PlusOutlined from '@ant-design/icons/PlusOutlined';
import { useMemoizedFn } from "ahooks";
import cc from 'classcat';
import { useTheme } from "../../hooks";
import "./index.less";
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
var stopClickEvent = function stopClickEvent(event) {
  return event.stopPropagation();
};
export function CollapseButton(props) {
  var _props$collapsed = props.collapsed,
    collapsed = _props$collapsed === void 0 ? true : _props$collapsed,
    _props$position = props.position,
    position = _props$position === void 0 ? 'right' : _props$position,
    count = props.count,
    onCollapse = props.onCollapse,
    loading = props.loading,
    _props$direction = props.direction,
    direction = _props$direction === void 0 ? 'horizontal' : _props$direction,
    _props$autoHideCountW = props.autoHideCountWhenExpanded,
    _autoHideCountWhenExpanded = _props$autoHideCountW === void 0 ? false : _props$autoHideCountW;
  var theme = useTheme();
  var _theme$collapseButton = theme.collapseButtonShape,
    collapseButtonShape = _theme$collapseButton === void 0 ? 'rect' : _theme$collapseButton,
    _theme$autoHideCountW = theme.autoHideCountWhenExpanded,
    autoHideCountWhenExpanded = _theme$autoHideCountW === void 0 ? false : _theme$autoHideCountW,
    _theme$showCount = theme.showCount,
    showCount = _theme$showCount === void 0 ? true : _theme$showCount;
  var onClick = useMemoizedFn(function () {
    onCollapse === null || onCollapse === void 0 || onCollapse(!collapsed);
  });
  return /*#__PURE__*/_jsxs("div", {
    className: cc(['rxflow-collapse', "rxflow-collapse-".concat(position)]),
    onClick: stopClickEvent,
    children: [/*#__PURE__*/_jsx("div", {
      className: cc(["rxflow-collapse-icon", "rxflow-collapse-shape-".concat(collapseButtonShape), _defineProperty({}, 'rxflow-collapse-loading', loading)]),
      onClick: loading ? undefined : onClick,
      children: loading ? /*#__PURE__*/_jsx(LoadingOutlined, {}) : collapsed ? /*#__PURE__*/_jsx(PlusOutlined, {}) : /*#__PURE__*/_jsx(MinusOutlined, {})
    }), (autoHideCountWhenExpanded || _autoHideCountWhenExpanded) && !collapsed || !showCount ? null : /*#__PURE__*/_jsx("div", {
      className: cc(["rxflow-collapse-count", direction === 'vertical' ? 'rxflow-collapse-vertical' : null]),
      children: count
    })]
  });
}