import { __assign, __rest } from "tslib";
import React, { forwardRef } from "react";
import { SwitchTransition, CSSTransition } from "react-transition-group";
import HeaderRoll from "./components/HeaderRoll";
import SubHeaderRoll from "./components/SubHeaderRoll";
import { RollStyled, RollContentWrapper, FooterStyled } from "./styles";
var Roll = forwardRef(function (_a, ref) {
    var style = _a.style, titleHeader = _a.titleHeader, subTitleHeader = _a.subTitleHeader, titleSubHeader = _a.titleSubHeader, size = _a.size, _b = _a.textOverflow, textOverflow = _b === void 0 ? "ellipsis" : _b, statusSubHeader = _a.statusSubHeader, labelSubHeader = _a.labelSubHeader, className = _a.className, isOpenRoll = _a.isOpenRoll, mainContent = _a.mainContent, rollContent = _a.rollContent, classNameContent = _a.classNameContent, footer = _a.footer, trailContentHeader = _a.trailContentHeader, isIconStatusSubHeader = _a.isIconStatusSubHeader, props = __rest(_a, ["style", "titleHeader", "subTitleHeader", "titleSubHeader", "size", "textOverflow", "statusSubHeader", "labelSubHeader", "className", "isOpenRoll", "mainContent", "rollContent", "classNameContent", "footer", "trailContentHeader", "isIconStatusSubHeader"]);
    return (React.createElement(RollStyled, __assign({ style: style, ref: ref, className: className, isOpenRoll: isOpenRoll }, props),
        React.createElement(HeaderRoll, { textOverflow: textOverflow, title: titleHeader, subTitle: subTitleHeader, size: size, className: "roll__header", trailContent: trailContentHeader }),
        React.createElement(SwitchTransition, null,
            React.createElement(CSSTransition, { classNames: "roll-anim", key: String(isOpenRoll), addEndListener: function (node, done) {
                    return node.addEventListener("transitionend", done, false);
                } },
                React.createElement("div", { className: "roll-anim" },
                    React.createElement(RollContentWrapper, { className: classNameContent, size: size, isOpenRoll: isOpenRoll }, isOpenRoll ? (React.createElement("div", null,
                        titleSubHeader && (React.createElement(SubHeaderRoll, { textOverflow: textOverflow, title: titleSubHeader, statusLabel: statusSubHeader, textLabel: labelSubHeader, isIconLabel: isIconStatusSubHeader })),
                        rollContent)) : (mainContent)),
                    isOpenRoll && footer && React.createElement(FooterStyled, null, footer))))));
});
Roll.displayName = "Roll";
export default Roll;
