jjb-lc-designable/react/widgets/NodeActionsWidget/index.js

基于alibaba-designable源码二次封装的表单设计器。

function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
import React from 'react';
import { Space, Typography, Divider } from 'antd';
import { observer } from 'jjb-lc-formily/reactive-react';
import { usePrefix, useTreeNode, useSelected } from '../../hooks';
import { IconWidget } from '../IconWidget';
import { TextWidget } from '../TextWidget';
import cls from 'classnames';
import './styles.less';
export const NodeActionsWidget = observer(props => {
  const node = useTreeNode();
  const prefix = usePrefix('node-actions');
  const selected = useSelected();
  if (selected.indexOf(node.id) === -1 && props.activeShown) return null;
  return /*#__PURE__*/React.createElement("div", {
    className: cls(prefix, props.className),
    style: props.style
  }, /*#__PURE__*/React.createElement("div", {
    className: prefix + '-content'
  }, /*#__PURE__*/React.createElement(Space, {
    split: /*#__PURE__*/React.createElement(Divider, {
      type: "vertical"
    })
  }, props.children)));
});
NodeActionsWidget.Action = ({
  icon,
  title,
  ...props
}) => {
  const prefix = usePrefix('node-actions-item');
  return /*#__PURE__*/React.createElement(Typography.Link, _extends({}, props, {
    className: cls(props.className, prefix),
    "data-click-stop-propagation": "true"
  }), /*#__PURE__*/React.createElement("span", {
    className: prefix + '-text'
  }, /*#__PURE__*/React.createElement(IconWidget, {
    infer: icon
  }), /*#__PURE__*/React.createElement(TextWidget, null, title)));
};