var __spreadArrays = (this && this.__spreadArrays) || function () {
    for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
    for (var r = Array(s), k = 0, i = 0; i < il; i++)
        for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
            r[k] = a[j];
    return r;
};
import { r as registerInstance, h } from './index-dd1fc9a4.js';
import { a as addListener } from './IntersectionHelper-2c725527.js';
import { s as slugify } from './slugify-3ed342e5.js';
var resourceTocCss = ".sc-resource-toc-h{display:block;position:-webkit-sticky;position:sticky;top:96px}@media (max-width: 768px){.sc-resource-toc-h{display:none}}nav.sc-resource-toc{margin:0;padding:0}ul.sc-resource-toc{font-size:14px;list-style:none;line-height:1.4em;padding-bottom:16px}li.sc-resource-toc{color:var(--c-carbon-80);-webkit-margin-before:var(--space-1);margin-block-start:var(--space-1);-webkit-margin-after:var(--space-1);margin-block-end:var(--space-1);cursor:pointer;list-style:none;color:var(--c-carbon-80);display:block;-webkit-transition:0.2s color, 0.2s -webkit-transform ease;transition:0.2s color, 0.2s -webkit-transform ease;transition:0.2s transform ease, 0.2s color;transition:0.2s transform ease, 0.2s color, 0.2s -webkit-transform ease}li.active.sc-resource-toc{-webkit-transform:translateX(8px);transform:translateX(8px);color:#597EFF}.title.sc-resource-toc{color:var(--c-indigo-60)}.cta-button.sc-resource-toc{-webkit-margin-before:var(--space-3);margin-block-start:var(--space-3);font-weight:600;border-radius:6px;letter-spacing:0;text-transform:none;padding:12px 19px 10px;font-size:14px;line-height:1em;background:#3880FF;color:#fff}.sharing.sc-resource-toc{margin:0;border-top:2px solid #f3f5f9;padding-top:26px}.sharing.sc-resource-toc li.sc-resource-toc{margin:0;margin-right:6px;display:inline-block}.sharing.sc-resource-toc a.sc-resource-toc{color:#CBD2DD;font-size:20px}.sharing.sc-resource-toc a.sc-resource-toc:hover{color:var(--c-ionic-brand)}.sharing.sc-resource-toc #web-share.sc-resource-toc{display:none}";
var ResourceTOC = /** @class */ (function () {
    function ResourceTOC(hostRef) {
        registerInstance(this, hostRef);
        this.headings = new Map();
    }
    ResourceTOC.prototype.componentDidLoad = function () {
        var _this = this;
        addListener(function (_c) {
            var entries = _c.entries;
            entries.forEach(function (_c) {
                var target = _c.target, intersectionRatio = _c.intersectionRatio;
                if (!_this.headings.get(target.id))
                    return;
                var heading = _this.headings.get(target.id);
                if (intersectionRatio === 0) {
                    heading.inView = false;
                }
                else {
                    heading.inView = true;
                }
            });
            _this.getFirstInView();
        });
        this.titleNames.map(function (title) {
            var id = "h-" + slugify(title);
            var item = document.getElementById(id);
            _this.headings.set(id, Object.assign(Object.assign({}, _this.headings.get(id)), { headingEl: item }));
        });
    };
    ResourceTOC.prototype.getFirstInView = function () {
        var gotFirst = false;
        for (var _i = 0, _c = this.headings.values(); _i < _c.length; _i++) {
            var val = _c[_i];
            if (!val.tocEl)
                continue;
            if (val.inView && !gotFirst) {
                val.tocEl.classList.add('active');
                gotFirst = true;
            }
            else {
                val.tocEl.classList.remove('active');
            }
        }
        if (!gotFirst) {
            var tocEl = __spreadArrays(this.headings.values()).reduce(function (acc, cur, i) {
                var _a, _b;
                var curTop = (_a = cur.headingEl) === null || _a === void 0 ? void 0 : _a.offsetTop;
                var accTop = (_b = acc.headingEl) === null || _b === void 0 ? void 0 : _b.offsetTop;
                if (i === 0 || !accTop)
                    return cur;
                if (Math.abs(window.scrollY - curTop) < Math.abs(window.scrollY - accTop)) {
                    return cur;
                }
                else {
                    return acc;
                }
            }).tocEl;
            tocEl === null || tocEl === void 0 ? void 0 : tocEl.classList.add('active');
        }
    };
    ResourceTOC.prototype.handleTocClick = function (ev) {
        var _a;
        var target = ev.target;
        if (!((_a = target === null || target === void 0 ? void 0 : target.dataset) === null || _a === void 0 ? void 0 : _a.id))
            return;
        var headingEl = this.headings.get(target.dataset.id).headingEl;
        window.scrollTo({
            top: headingEl.offsetTop - 100,
            behavior: 'smooth'
        });
    };
    ResourceTOC.prototype.render = function () {
        var _this = this;
        return (h("nav", null, h("ul", null, this.titleNames.map(function (link) { return (h("li", { class: "ui-paragraph-4", onClick: function (ev) { return _this.handleTocClick(ev); }, "data-id": "h-" + slugify(link), ref: function (e) {
                var _a;
                var id = (_a = e === null || e === void 0 ? void 0 : e.dataset) === null || _a === void 0 ? void 0 : _a.id;
                if (!id || !e)
                    return;
                _this.headings.set(id, Object.assign(Object.assign({}, _this.headings.get(id)), { tocEl: e }));
            } }, link)); }))));
    };
    return ResourceTOC;
}());
ResourceTOC.style = resourceTocCss;
export { ResourceTOC as resource_toc };
