import React, { useCallback } from 'react';
import { PlusOutlined } from '@ant-design/icons';
import classNames from 'classnames';
import Button from "../button";
import SortableItem from "./components/SortableItem";
import { SortableTree } from "../pisellDraggable";
import "./PisellDropSort.less";
import { getText } from "../../locales";
var PisellDropSort = function PisellDropSort(_ref) {
  var _ref$value = _ref.value,
    value = _ref$value === void 0 ? [] : _ref$value,
    _ref$allowDrag = _ref.allowDrag,
    allowDrag = _ref$allowDrag === void 0 ? true : _ref$allowDrag,
    _ref$allowDelete = _ref.allowDelete,
    allowDelete = _ref$allowDelete === void 0 ? true : _ref$allowDelete,
    _ref$allowAddChild = _ref.allowAddChild,
    allowAddChild = _ref$allowAddChild === void 0 ? true : _ref$allowAddChild,
    _ref$allowAddRoot = _ref.allowAddRoot,
    allowAddRoot = _ref$allowAddRoot === void 0 ? true : _ref$allowAddRoot,
    _ref$disabled = _ref.disabled,
    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
    _ref$spacing = _ref.spacing,
    spacing = _ref$spacing === void 0 ? 8 : _ref$spacing,
    _ref$maxLevel = _ref.maxLevel,
    maxLevel = _ref$maxLevel === void 0 ? 3 : _ref$maxLevel,
    _ref$showBorder = _ref.showBorder,
    showBorder = _ref$showBorder === void 0 ? true : _ref$showBorder,
    style = _ref.style,
    className = _ref.className,
    onChange = _ref.onChange,
    onDelete = _ref.onDelete,
    onAdd = _ref.onAdd,
    propsRenderItem = _ref.renderItem,
    leftContent = _ref.leftContent,
    rightContent = _ref.rightContent,
    onAddRoot = _ref.onAddRoot,
    __designMode = _ref.__designMode,
    isCustomAction = _ref.isCustomAction,
    emptyContent = _ref.emptyContent,
    getItemStyle = _ref.getItemStyle;
  // 自定义渲染节点
  var renderItem = useCallback(function (itemProps, ref) {
    return /*#__PURE__*/React.createElement(SortableItem, {
      itemProps: itemProps,
      domRef: ref,
      render: propsRenderItem,
      allowAddChild: allowAddChild,
      allowDelete: allowDelete,
      allowDrag: allowDrag,
      disabled: disabled,
      onAdd: onAdd,
      onDelete: onDelete,
      showBorder: showBorder,
      spacing: spacing,
      maxLevel: maxLevel,
      __designMode: __designMode,
      isCustomAction: isCustomAction,
      getItemStyle: getItemStyle
    });
  }, [allowAddChild, allowDelete, allowDrag, value, disabled, maxLevel, onAdd, onDelete, showBorder, spacing, isCustomAction]);

  // 处理拖拽完成
  var handleChange = useCallback(function (items) {
    onChange === null || onChange === void 0 ? void 0 : onChange(items);
  }, [onChange]);
  var containerClassName = classNames('pisell-lowcode-drop-sort-container', className);
  return /*#__PURE__*/React.createElement("div", {
    className: containerClassName,
    style: style
  }, /*#__PURE__*/React.createElement("div", {
    className: "pisell-lowcode-drop-sort-container-header"
  }, /*#__PURE__*/React.createElement("span", null, leftContent), /*#__PURE__*/React.createElement("span", null, rightContent || allowAddRoot && !disabled && /*#__PURE__*/React.createElement(Button, {
    icon: /*#__PURE__*/React.createElement(PlusOutlined, null),
    type: "primary",
    onClick: function onClick() {
      return onAddRoot === null || onAddRoot === void 0 ? void 0 : onAddRoot();
    },
    size: "large"
  }, getText('pisell-lowcode-drop-sort-add')))), /*#__PURE__*/React.createElement("div", {
    className: "pisell-lowcode-drop-sort-container-content",
    style: {
      gap: spacing !== null && spacing !== void 0 ? spacing : 8
    }
  }, value.length === 0 && emptyContent ? emptyContent : /*#__PURE__*/React.createElement(SortableTree, {
    value: value,
    collapsible: true,
    indicator: false,
    indentationWidth: 24,
    removable: allowDelete,
    renderItem: renderItem,
    onChange: handleChange
  })));
};
export default PisellDropSort;