(function (factory) {
    if (typeof module === "object" && typeof module.exports === "object") {
        var v = factory(require, exports);
        if (v !== undefined) module.exports = v;
    }
    else if (typeof define === "function" && define.amd) {
        define(["require", "exports", "tslib", "react", "../Tooltip", "../utils/getTextWidth", "../hooks/useStateProps", "../hooks/useDebounce", "./style"], factory);
    }
})(function (require, exports) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var tslib_1 = require("tslib");
    var react_1 = (0, tslib_1.__importStar)(require("react"));
    var Tooltip_1 = (0, tslib_1.__importDefault)(require("../Tooltip"));
    var getTextWidth_1 = (0, tslib_1.__importDefault)(require("../utils/getTextWidth"));
    var useStateProps_1 = require("../hooks/useStateProps");
    var useDebounce_1 = (0, tslib_1.__importDefault)(require("../hooks/useDebounce"));
    var style_1 = require("./style");
    var Breadcrumbs = function (_a) {
        var children = _a.children, items = _a.items, _b = _a.maxNoCollapsedItems, maxNoCollapsedItems = _b === void 0 ? 1 : _b, className = _a.className, _c = _a.testId, testId = _c === void 0 ? "breadcrumbs" : _c, props = (0, tslib_1.__rest)(_a, ["children", "items", "maxNoCollapsedItems", "className", "testId"]);
        var breadcrumbsRef = (0, react_1.useRef)(null);
        var _d = (0, tslib_1.__read)((0, react_1.useState)(false), 2), isLastChildEllipsis = _d[0], setIsLastChildEllipsis = _d[1];
        var _e = (0, tslib_1.__read)((0, useStateProps_1.useStateProps)(maxNoCollapsedItems), 2), _maxNoCollapsedItems = _e[0], setMaxNoCollapsedItems = _e[1];
        var _f = (0, tslib_1.__read)((0, react_1.useState)("unset"), 2), widthLastNodeElement = _f[0], setWidthLastNodeElement = _f[1];
        var getDeltaScroll = function () {
            var _breadcrumbs = breadcrumbsRef.current;
            var parent = _breadcrumbs.parentNode;
            var deltaScrollBody = parent.scrollWidth - document.body.offsetWidth;
            var deltaScrollBreadcrumbs = _breadcrumbs.scrollWidth - _breadcrumbs.offsetWidth;
            return Math.max(deltaScrollBody, deltaScrollBreadcrumbs);
        };
        var collapsedLastItem = function () {
            setWidthLastNodeElement("unset");
            setMaxNoCollapsedItems(_maxNoCollapsedItems - 1);
            setIsLastChildEllipsis(false);
        };
        var adaptSize = function () {
            if (!breadcrumbsRef.current || maxNoCollapsedItems === 0) {
                return;
            }
            var font = getComputedStyle(breadcrumbsRef.current).font;
            var minWidthTextForLastChild = 40;
            var childNodes = breadcrumbsRef.current.childNodes;
            var lastChildNode = childNodes.item(childNodes.length - 1);
            var _a = lastChildNode.getBoundingClientRect(), widthLastChild = _a.width, rightLastChild = _a.right, leftLastChild = _a.left;
            var rightBreadcrumbs = breadcrumbsRef.current.getBoundingClientRect().right;
            var deltaScroll = getDeltaScroll();
            if (deltaScroll > 0 && _maxNoCollapsedItems > 1) {
                for (var i = 0; _maxNoCollapsedItems - i > 1; i++) {
                    if (deltaScroll <= 0) {
                        return;
                    }
                    var item = items[items.length - _maxNoCollapsedItems - i];
                    deltaScroll -= (0, getTextWidth_1.default)(item.text || "", font);
                    setMaxNoCollapsedItems(_maxNoCollapsedItems - 1);
                }
            }
            if (_maxNoCollapsedItems === 1) {
                var newWidthLastChild = void 0;
                var iconWidth = items[items.length - 1].icon ? 32 : 0;
                if (deltaScroll <= 0) {
                    newWidthLastChild = rightBreadcrumbs - leftLastChild;
                }
                else {
                    newWidthLastChild = widthLastChild - deltaScroll * 2;
                }
                var newWidthText = newWidthLastChild - iconWidth;
                var maxWidthText = (0, getTextWidth_1.default)(items[items.length - 1].text || "", font);
                if (newWidthText >= maxWidthText) {
                    setWidthLastNodeElement("unset");
                }
                else if (newWidthText < minWidthTextForLastChild) {
                    collapsedLastItem();
                }
                else {
                    setWidthLastNodeElement(newWidthLastChild);
                    !isLastChildEllipsis && setIsLastChildEllipsis(true);
                }
            }
            if (_maxNoCollapsedItems === 0) {
                var freeSpace = rightBreadcrumbs - rightLastChild;
                if (freeSpace >= minWidthTextForLastChild) {
                    setIsLastChildEllipsis(true);
                    setMaxNoCollapsedItems(_maxNoCollapsedItems + 1);
                }
            }
            if (rightLastChild < rightBreadcrumbs &&
                _maxNoCollapsedItems > 0 &&
                _maxNoCollapsedItems < maxNoCollapsedItems) {
                var lastCollapsedItem = items[items.length - _maxNoCollapsedItems - 1];
                var widthTextLastCollapsedItem = (0, getTextWidth_1.default)(lastCollapsedItem.text || "", font);
                var newWidthBreadcrumbs = rightLastChild + widthTextLastCollapsedItem;
                if (newWidthBreadcrumbs <= rightBreadcrumbs) {
                    if (_maxNoCollapsedItems === 1) {
                        setIsLastChildEllipsis(false);
                        setWidthLastNodeElement("unset");
                    }
                    setMaxNoCollapsedItems(_maxNoCollapsedItems + 1);
                }
            }
        };
        var adaptSizeDebounce = (0, useDebounce_1.default)(adaptSize, 100);
        (0, react_1.useEffect)(function () {
            adaptSize();
        }, [_maxNoCollapsedItems]);
        (0, react_1.useEffect)(function () {
            window.addEventListener("resize", adaptSizeDebounce);
            return function () { return window.removeEventListener("resize", adaptSizeDebounce); };
        });
        return (react_1.default.createElement(style_1.BreadcrumbsWrapper, (0, tslib_1.__assign)({ "data-testid": testId, className: className, widthLastNodeElement: widthLastNodeElement, ref: breadcrumbsRef }, props, { isLastChildEllipsis: isLastChildEllipsis }),
            items.map(function (item, index) { return (react_1.default.createElement(react_1.default.Fragment, { key: "" + (item.text || item.to || "") + (item.viewType || "") },
                index > 0 && react_1.default.createElement(style_1.Divider, { type: "corvus" }, "/"),
                react_1.default.createElement(Tooltip_1.default, { text: item.text || "", direction: index === items.length - 1 &&
                        (isLastChildEllipsis || _maxNoCollapsedItems === 0)
                        ? "bottomRight"
                        : "bottomLeft", isShow: Boolean((index < items.length - _maxNoCollapsedItems &&
                        item.icon &&
                        item.text) ||
                        (index === items.length - 1 && isLastChildEllipsis)) },
                    react_1.default.createElement(style_1.ItemWrapper, { isDisabled: item.isDisabled, viewType: item.viewType, as: item.to && "a", href: item.to || "", onClick: function (e) { return item.onClick && item.onClick(e, item); } },
                        item.icon && item.iconType !== "trail" && (react_1.default.createElement(style_1.IconWrapper, null, item.icon)),
                        !(index < items.length - _maxNoCollapsedItems && item.icon) &&
                            item.text && react_1.default.createElement(style_1.Text, { type: "corvus" }, item.text),
                        item.icon && item.iconType === "trail" && (react_1.default.createElement(style_1.IconWrapper, null, item.icon)))))); }),
            children));
    };
    Breadcrumbs.displayName = "Breadcrumbs";
    exports.default = Breadcrumbs;
});
