(function () {
    const OrgPortal = (window.OrgPortal = window.OrgPortal || {});
    const { h } = OrgPortal.runtime;
    const { portalData } = OrgPortal.data;

    OrgPortal.componentFns = OrgPortal.componentFns || {};

    OrgPortal.componentFns.FutureCard = function FutureCard() {
        return h(
            "section",
            { className: "card org-panel org-scroll-panel org-span-6" },
            h(
                "div",
                { className: "org-panel-head" },
                h(
                    "div",
                    null,
                    h(
                        "h2",
                        { className: "org-panel-title" },
                        "Expansion Slots",
                    ),
                    h(
                        "p",
                        { className: "org-panel-subtitle" },
                        "Potential modules are tagged by status such as Planned, In Design, In Review, and Future Review.",
                    ),
                ),
            ),
            h(
                "div",
                { className: "org-roadmap-grid" },
                ...portalData.roadmap.map((item) =>
                    h(
                        "article",
                        { className: "org-roadmap-card" },
                        h("span", { className: "org-list-tag" }, item.status),
                        h("strong", null, item.name),
                        h("p", null, item.detail),
                    ),
                ),
            ),
        );
    };
})();