/**
 * amis-ui v6.14.0-beta.1
 * Copyright 2018-2025 fex
 */

import { __extends, __rest, __assign } from 'tslib';
import React__default from 'react';
import TooltipWrapper from './TooltipWrapper.js';
import { removeHTMLTag, RootClose, themeable } from 'amis-core';
import { Icon } from './icons.js';

/**
 * @file Breadcrumb 面包屑
 */
/**
 * Breadcrumb 面包屑类
 */
var Breadcrumb = /** @class */ (function (_super) {
    __extends(Breadcrumb, _super);
    function Breadcrumb() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    Breadcrumb.prototype.render = function () {
        var cx = this.props.classnames;
        var _a = this.props, className = _a.className, style = _a.style, separatorClassName = _a.separatorClassName, items = _a.items, separator = _a.separator, testIdBuilder = _a.testIdBuilder, restProps = __rest(_a, ["className", "style", "separatorClassName", "items", "separator", "testIdBuilder"]);
        var crumbsLength = items === null || items === void 0 ? void 0 : items.length;
        if (!crumbsLength) {
            return React__default.createElement("div", { className: cx('Breadcrumb', className) });
        }
        var crumbs = items
            .map(function (item, index) {
            var itemTestIdBuilder = testIdBuilder === null || testIdBuilder === void 0 ? void 0 : testIdBuilder.getChild("item-".concat(item.label || index));
            var itemPlace = 'middle';
            if (index === 0) {
                itemPlace = 'start';
            }
            if (index === crumbsLength - 1) {
                itemPlace = 'end';
            }
            return (React__default.createElement(BreadcrumbItem, __assign({}, restProps, { item: item, itemPlace: itemPlace, key: index, testIdBuilder: itemTestIdBuilder })));
        })
            .reduce(function (prev, curr, index) { return [
            prev,
            React__default.createElement("span", { className: cx('Breadcrumb-separator', separatorClassName), key: "separator-".concat(index) }, separator),
            curr
        ]; });
        return (React__default.createElement("div", { className: cx('Breadcrumb', className), style: style }, crumbs));
    };
    Breadcrumb.defaultProps = {
        separator: '>',
        labelMaxLength: 16,
        tooltipPosition: 'top'
    };
    return Breadcrumb;
}(React__default.Component));
/**
 * BreadcrumbItem 面包项类
 */
var BreadcrumbItem = /** @class */ (function (_super) {
    __extends(BreadcrumbItem, _super);
    function BreadcrumbItem() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.state = {
            tooltipTrigger: ['hover', 'focus'],
            tooltipRootClose: false,
            isOpened: false
        };
        _this.domRef = function (ref) {
            _this.target = ref;
        };
        _this.toogle = function (e) {
            e.preventDefault();
            _this.setState({
                isOpened: !_this.state.isOpened
            });
        };
        _this.close = function () {
            _this.setState({
                isOpened: false
            });
        };
        return _this;
    }
    /**
     * 渲染基础面包项
     * @param showHref 是否显示超链接
     * @param itemType 基础面包项类型
     * @param item 面包项
     * @param label 渲染文本
     * @returns
     */
    BreadcrumbItem.prototype.renderBreadcrumbBaseItem = function (showHref, itemType, item, label) {
        var _a = this.props, itemClassName = _a.itemClassName, dropdownItemClassName = _a.dropdownItemClassName, cx = _a.classnames, testIdBuilder = _a.testIdBuilder;
        var baseItemClassName = itemType === 'default' ? itemClassName : dropdownItemClassName;
        if (showHref) {
            return (React__default.createElement("a", __assign({ href: item.href, className: cx('Breadcrumb-item-' + itemType, baseItemClassName) }, testIdBuilder === null || testIdBuilder === void 0 ? void 0 : testIdBuilder.getTestId()),
                item.icon ? (React__default.createElement(Icon, { cx: cx, icon: item.icon, className: "Icon", classNameProp: "Breadcrumb-icon" })) : null,
                React__default.createElement("span", { className: cx('TplField fr-view') }, label)));
        }
        return (React__default.createElement("span", __assign({ className: cx('Breadcrumb-item-' + itemType, baseItemClassName) }, testIdBuilder === null || testIdBuilder === void 0 ? void 0 : testIdBuilder.getTestId()),
            item.icon ? (React__default.createElement(Icon, { cx: cx, icon: item.icon, className: "Icon", classNameProp: "Breadcrumb-icon" })) : null,
            React__default.createElement("span", { className: cx('TplField fr-view') }, label)));
    };
    /**
     * 渲染基础面包项完整节点
     * @param item 面包项
     * @param tooltipPosition 浮窗提示位置
     * @param itemPlace 面包香所在相对位置
     * @param itemType 基础面包项类型
     * @returns
     */
    BreadcrumbItem.prototype.renderBreadcrumbNode = function (item, tooltipPosition, itemPlace, itemType) {
        if (tooltipPosition === void 0) { tooltipPosition = 'top'; }
        var _a = this.props, labelMaxLength = _a.labelMaxLength, tooltipContainer = _a.tooltipContainer;
        var _b = this.state, tooltipTrigger = _b.tooltipTrigger, tooltipRootClose = _b.tooltipRootClose;
        var pureLabel = item.label ? removeHTMLTag(item.label) : '';
        // 限制最大展示长度的最小值
        var maxLength = labelMaxLength && +labelMaxLength > 1 ? +labelMaxLength : 1;
        // 面包项相对位置为 middle ，且超过最大展示长度的面包项，进行缩略展示，并使用浮窗提示
        if (pureLabel.length > maxLength && itemPlace === 'middle') {
            return (React__default.createElement(TooltipWrapper, { tooltip: pureLabel, placement: tooltipPosition, container: tooltipContainer, trigger: tooltipTrigger, rootClose: tooltipRootClose }, this.renderBreadcrumbBaseItem(true, itemType, item, pureLabel.substring(0, maxLength) + '...')));
        }
        var showHref = !item.href || itemPlace === 'end';
        return this.renderBreadcrumbBaseItem(!showHref, itemType, item, pureLabel);
    };
    /**
     * 渲染下拉菜单节点
     * @param dropdown 面包项下拉菜单
     * @returns
     */
    BreadcrumbItem.prototype.renderDropdownNode = function (dropdown) {
        var _this = this;
        var _a = this.props, dropdownClassName = _a.dropdownClassName, cx = _a.classnames;
        return (React__default.createElement(RootClose, { disabled: !this.state.isOpened, onRootClose: this.close }, function (ref) {
            return (React__default.createElement("ul", { className: cx('Breadcrumb-dropdown', dropdownClassName), onClick: _this.close, ref: ref }, Array.isArray(dropdown) &&
                dropdown.map(function (menuItem, index) {
                    return (React__default.createElement("li", { key: 'dropdown-item' + index }, _this.renderBreadcrumbNode(menuItem, 'right', 'middle', 'dropdown')));
                })));
        }));
    };
    BreadcrumbItem.prototype.render = function () {
        var _a = this.props, item = _a.item, itemPlace = _a.itemPlace, tooltipPosition = _a.tooltipPosition, cx = _a.classnames;
        var dropdown = item.dropdown, restItemProps = __rest(item, ["dropdown"]);
        return (React__default.createElement("span", { className: cx('Breadcrumb-item', {
                'is-opened': this.state.isOpened
            }, {
                'Breadcrumb-item-last': itemPlace === 'end'
            }), ref: this.domRef },
            this.renderBreadcrumbNode(__assign({}, restItemProps), tooltipPosition, itemPlace, 'default'),
            dropdown ? (React__default.createElement("span", { onClick: this.toogle, className: cx('Breadcrumb-item-caret') },
                React__default.createElement(Icon, { icon: "down", className: "icon" }))) : null,
            dropdown && this.state.isOpened
                ? this.renderDropdownNode(dropdown)
                : null));
    };
    return BreadcrumbItem;
}(React__default.Component));
var Breadcrumb$1 = themeable(Breadcrumb);

export { Breadcrumb, BreadcrumbItem, Breadcrumb$1 as default };
