import { r as registerInstance, h } from './index-BIwHMk6j.js';

const emptyStateCss = () => `:host(limebb-empty-state){display:flex;flex-direction:column;align-items:center;gap:0.25rem;padding:0.5rem;opacity:0;animation:fade-in 0.3s ease forwards;animation-delay:0.5s}@keyframes fade-in{0%{opacity:0}100%{opacity:1}}*{box-sizing:border-box}h2{color:rgb(var(--contrast-1100));margin:0}limel-markdown{color:rgb(var(--contrast-1000));text-align:center;line-height:1.4}limel-icon{width:2.5rem}`;

const EmptyState = class {
    constructor(hostRef) {
        registerInstance(this, hostRef);
    }
    render() {
        return [
            this.renderIcon(),
            this.renderHeading(),
            this.renderSubheader(),
        ];
    }
    renderHeading() {
        if (!this.heading) {
            return;
        }
        return h("h2", null, this.heading);
    }
    renderSubheader() {
        if (!this.value) {
            return;
        }
        return h("limel-markdown", { value: this.value });
    }
    renderIcon() {
        var _a, _b, _c;
        if (!this.icon) {
            return;
        }
        return (h("limel-icon", { badge: true, name: (_a = this.icon) === null || _a === void 0 ? void 0 : _a.name, style: {
                color: `${(_b = this.icon) === null || _b === void 0 ? void 0 : _b.color}`,
                'background-color': `${(_c = this.icon) === null || _c === void 0 ? void 0 : _c.backgroundColor}`,
            } }));
    }
};
EmptyState.style = emptyStateCss();

export { EmptyState as limebb_empty_state };
