(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", "@web-atoms/core/src/web/images/close-button-hover.svg", "@web-atoms/core/src/web/images/close-button.svg", "./AtomStyle"], factory);
    }
})(function (require, exports) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    exports.AtomTabbedPageStyle = void 0;
    const close_button_hover_svg_1 = require("@web-atoms/core/src/web/images/close-button-hover.svg");
    const close_button_svg_1 = require("@web-atoms/core/src/web/images/close-button.svg");
    const AtomStyle_1 = require("./AtomStyle");
    class AtomTabbedPageStyle extends AtomStyle_1.AtomStyle {
        get theme() {
            return this.styleSheet;
        }
        get root() {
            return {
                position: "absolute",
                left: 0,
                right: 0,
                top: 0,
                bottom: 0,
                subclasses: {
                    " .page-host": {
                        position: "absolute",
                        left: 0,
                        right: 0,
                        top: "30px",
                        bottom: 0,
                        overflow: "auto",
                        subclasses: {
                            " > *": {
                                position: "absolute",
                                left: 0,
                                right: 0,
                                top: 0,
                                bottom: 0,
                                overflow: "auto",
                            }
                        }
                    },
                    " .tabs": {
                        position: "absolute",
                        left: 0,
                        top: 0,
                        right: 0,
                        overflow: "hidden",
                        height: "30px",
                        subclasses: {
                            " .tab-item": this.tabItem,
                            " .close-button": this.closeButton,
                            " .selected-tab-item": this.selectedTabItem,
                        }
                    },
                }
            };
        }
        get tabItem() {
            return {
                display: "inline-block",
                borderTopLeftRadius: (this.padding || this.theme.padding) + "px",
                borderTopRightRadius: (this.padding || this.theme.padding) + "px",
                marginLeft: "2px",
                padding: 0,
                borderStyle: "solid",
                borderWidth: "1px",
                borderColor: "lightgray",
                backgroundColor: this.theme.bgColor,
                minWidth: "90px",
                minHeight: "30px",
                cursor: "default",
                position: "relative",
                subclasses: {
                    ":hover": {
                        backgroundColor: this.theme.hoverColor
                    },
                    "> div": {
                        display: "inline-block",
                        padding: (this.padding || this.theme.padding) + "px",
                        paddingRight: ((this.padding || this.theme.padding) + 23) + "px",
                        right: "22px"
                    }
                }
            };
        }
        get selectedTabItem() {
            return Object.assign(Object.assign({}, this.tabItem), { borderColor: this.theme.activeColor, backgroundColor: this.theme.selectedBgColor, color: this.theme.selectedColor, subclasses: {
                    ":hover": {
                        backgroundColor: this.theme.selectedBgColor,
                        color: this.theme.hoverColor
                    },
                    "> div": {
                        display: "inline-block",
                        padding: (this.padding || this.theme.padding) + "px",
                        paddingRight: ((this.padding || this.theme.padding) + 23) + "px",
                        right: "22px"
                    }
                } });
        }
        get closeButton() {
            return {
                position: "absolute",
                right: "5px",
                top: "5px",
                width: "0",
                height: "0",
                padding: "8px",
                backgroundImage: close_button_hover_svg_1.default,
                subclasses: {
                    ":hover": {
                        backgroundImage: close_button_svg_1.default
                    }
                }
            };
        }
    }
    exports.AtomTabbedPageStyle = AtomTabbedPageStyle;
});
//# sourceMappingURL=AtomTabbedPageStyle.js.map