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

const kanbanCss = () => `:host(limebb-kanban){--limebb-kanban-col-gap:1rem;box-sizing:border-box;display:flex;align-items:stretch;column-gap:var(--limebb-kanban-col-gap);width:100%;height:100%;padding:0.5rem;padding-right:calc(var(--kanban-padding-right, 0rem) + 5rem);overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;scroll-padding:calc(var(--limebb-kanban-col-gap) + 0.5rem)}`;

const Kanban = class {
    constructor(hostRef) {
        registerInstance(this, hostRef);
        this.loadMore = createEvent(this, "loadMore");
        this.interact = createEvent(this, "interact");
        /**
         * List of groups to display in the kanban board.
         * Each group contains a list of items belonging to that group.
         */
        this.groups = [];
        this.handleLoadMore = (group) => (event) => {
            event.stopPropagation();
            if (group.identifier !== event.detail) {
                return;
            }
            this.loadMore.emit(group);
        };
    }
    render() {
        return this.renderGroups();
    }
    renderGroups() {
        return this.groups.map((group) => (h("limebb-kanban-group", { "aria-busy": group.loading ? 'true' : 'false', "aria-live": "polite", platform: this.platform, context: this.context, identifier: group.identifier, heading: group.heading, help: group.help, totalCount: group.totalCount, summary: group.summary, loading: group.loading, items: group.items, class: group.type, onLoadMore: this.handleLoadMore(group) })));
    }
};
Kanban.style = kanbanCss();

export { Kanban as limebb_kanban };
