import { r as registerInstance, c as createEvent, d as getIonMode, h, H as Host, e as getElement } from './core-880715f2.js';
import { c as createColorClasses } from './theme-215399f6.js';
var ToolbarTitle = /** @class */ (function () {
    function ToolbarTitle(hostRef) {
        registerInstance(this, hostRef);
        this.ionStyle = createEvent(this, "ionStyle", 7);
    }
    ToolbarTitle.prototype.sizeChanged = function () {
        this.emitStyle();
    };
    ToolbarTitle.prototype.connectedCallback = function () {
        this.emitStyle();
    };
    ToolbarTitle.prototype.emitStyle = function () {
        var _a;
        var size = this.getSize();
        this.ionStyle.emit((_a = {},
            _a["title-" + size] = true,
            _a));
    };
    ToolbarTitle.prototype.getSize = function () {
        return (this.size !== undefined) ? this.size : 'default';
    };
    ToolbarTitle.prototype.render = function () {
        var _a;
        var mode = getIonMode(this);
        var size = this.getSize();
        return (h(Host, { class: Object.assign((_a = {}, _a[mode] = true, _a["title-" + size] = true, _a), createColorClasses(this.color)) }, h("div", { class: "toolbar-title" }, h("slot", null))));
    };
    Object.defineProperty(ToolbarTitle.prototype, "el", {
        get: function () { return getElement(this); },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(ToolbarTitle, "watchers", {
        get: function () {
            return {
                "size": ["sizeChanged"]
            };
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(ToolbarTitle, "style", {
        get: function () { return ":host{--color:initial;display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-align:center;align-items:center;-webkit-transform:translateZ(0);transform:translateZ(0);color:var(--color)}:host(.ion-color){color:var(--ion-color-base)}.toolbar-title{display:block;width:100%;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;pointer-events:auto}:host(.title-small) .toolbar-title{white-space:normal}:host{padding-left:20px;padding-right:20px;padding-top:0;padding-bottom:0;font-size:20px;font-weight:500;letter-spacing:.0125em}\@supports ((-webkit-margin-start:0) or (margin-inline-start:0)) or (-webkit-margin-start:0){:host{padding-left:unset;padding-right:unset;-webkit-padding-start:20px;padding-inline-start:20px;-webkit-padding-end:20px;padding-inline-end:20px}}:host(.title-small){width:100%;height:100%;font-size:15px;font-weight:400}"; },
        enumerable: true,
        configurable: true
    });
    return ToolbarTitle;
}());
export { ToolbarTitle as ion_title };
