import { Breadcrumb, BreadcrumbItem } from '@gaoding/gd-antd-plus';
import { useCurrentNode, useSelection, usePrefix, useHover } from '../../hooks';
import { IconWidget } from '../IconWidget';
import { NodeTitleWidget } from '../NodeTitleWidget';
import './styles.less';
import { defineComponent } from 'vue-demi';
export var NodePathWidget = defineComponent({
    props: ['workspaceId', 'maxItems'],
    setup: function (props) {
        var selectedRef = useCurrentNode(props.workspaceId);
        var selectionRef = useSelection(props.workspaceId);
        var hoverRef = useHover(props.workspaceId);
        var prefixRef = usePrefix('node-path');
        return function () {
            var _a;
            if (!selectedRef.value)
                return null;
            var maxItems = (_a = props.maxItems) !== null && _a !== void 0 ? _a : 3;
            var nodes = selectedRef.value
                .getParents()
                .slice(0, maxItems - 1)
                .reverse()
                .concat(selectedRef.value);
            return (<Breadcrumb class={prefixRef.value}>
          {nodes.map(function (node, key) {
                    return (<BreadcrumbItem key={key}>
                {key === 0 && (<IconWidget infer="Position" style={{ marginRight: '3px' }}/>)}
                <a href="" onMouseenter={function () {
                            hoverRef.value.setHover(node);
                        }} onClick={function (e) {
                            e.stopPropagation();
                            e.preventDefault();
                            selectionRef.value.select(node);
                        }}>
                  <NodeTitleWidget {...{ node: node }}/>
                </a>
              </BreadcrumbItem>);
                })}
        </Breadcrumb>);
        };
    },
});
//# sourceMappingURL=index.jsx.map