@rr0/cms/dist/search/SearchComponent.mjs

RR0 Content Management System (CMS)

var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
};
var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
    if (kind === "m") throw new TypeError("Private method is not writable");
    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
};
var _SearchComponent_instances, _SearchComponent_siteIndex, _SearchComponent_loading, _SearchComponent_maxResultCount, _SearchComponent_siteSearchChange, _SearchComponent_siteSearchLoad, _SearchComponent_setDataList;
const template = document.createElement("template");
const html = `
<input id="search-input" list="values" type="search" part="input">
<datalist id="values">
</datalist>`;
const style = `
:host {
  display: inline-block;
}
input {
  width: 100%;
}
`;
template.innerHTML = `<style>${style}</style>${html}`;
export class SearchComponent extends HTMLElement {
    constructor() {
        super();
        _SearchComponent_instances.add(this);
        /**
         * @type SearchIndex
         */
        _SearchComponent_siteIndex.set(this, void 0);
        _SearchComponent_loading.set(this, false
        /**
         * @readonly
         * @type {number}
         */
        );
        /**
         * @readonly
         * @type {number}
         */
        _SearchComponent_maxResultCount.set(this, 100);
        this.shadow = this.attachShadow({ mode: "closed" });
        this.shadow.appendChild(template.content.cloneNode(true));
    }
    static get observedAttributes() {
        return ["placeholder"];
    }
    /**
     * @param {string} value
     */
    set placeholder(value) {
        const input = this.shadow.getElementById("search-input");
        input.placeholder = value;
    }
    attributeChangedCallback(name, oldValue, newValue) {
        switch (name) {
            case "placeholder":
                this.placeholder = newValue;
        }
    }
    connectedCallback() {
        this.onmouseover = __classPrivateFieldGet(this, _SearchComponent_instances, "m", _SearchComponent_siteSearchLoad).bind(this);
        const input = this.shadow.getElementById("search-input");
        input.oninput = __classPrivateFieldGet(this, _SearchComponent_instances, "m", _SearchComponent_siteSearchChange).bind(this);
        this.placeholder = "Recherche";
    }
}
_SearchComponent_siteIndex = new WeakMap(), _SearchComponent_loading = new WeakMap(), _SearchComponent_maxResultCount = new WeakMap(), _SearchComponent_instances = new WeakSet(), _SearchComponent_siteSearchChange = function _SearchComponent_siteSearchChange(e) {
    var _a;
    const value = e.target.value.trim();
    const pages = ((_a = __classPrivateFieldGet(this, _SearchComponent_siteIndex, "f")) === null || _a === void 0 ? void 0 : _a.pages) || [];
    if (e.inputType === "insertReplacementText" || e.inputType == null) {
        const pageIndex = pages.findIndex(page => page.title === value);
        if (pageIndex >= 0) {
            const page = pages[pageIndex];
            window.location.href = "/" + page.url;
        }
    }
    const lowValue = value.toLowerCase();
    const dataList = pages.filter(page => page.title.toLowerCase().indexOf(lowValue) >= 0);
    __classPrivateFieldGet(this, _SearchComponent_instances, "m", _SearchComponent_setDataList).call(this, dataList.length <= __classPrivateFieldGet(this, _SearchComponent_maxResultCount, "f") ? dataList : []);
}, _SearchComponent_siteSearchLoad = function _SearchComponent_siteSearchLoad() {
    if (!__classPrivateFieldGet(this, _SearchComponent_siteIndex, "f") && !__classPrivateFieldGet(this, _SearchComponent_loading, "f")) {
        __classPrivateFieldSet(this, _SearchComponent_loading, true, "f");
        fetch("/search/index.json").then(async (response) => {
            if (response.ok) {
                __classPrivateFieldSet(this, _SearchComponent_siteIndex, await response.json(), "f");
                for (const page of __classPrivateFieldGet(this, _SearchComponent_siteIndex, "f").pages) {
                    const timeStr = page.time;
                    const title = page.title;
                    page.title += (timeStr && timeStr !== title.toLowerCase() ? ` (${timeStr})` : "");
                }
            }
            __classPrivateFieldSet(this, _SearchComponent_loading, false, "f");
        });
    }
}, _SearchComponent_setDataList = function _SearchComponent_setDataList(pages) {
    const datalist = this.shadow.getElementById("values");
    datalist.innerHTML = "";
    for (let i = 0; i < pages.length; i++) {
        const page = pages[i];
        const option = document.createElement("option");
        option.value = page.title;
        datalist.append(option);
    }
};
/**
 * @readonly
 * @type {string}
 */
SearchComponent.NAME = "rr0-search";
const name = SearchComponent.NAME;
if (!customElements.get(name)) {
    customElements.define(name, SearchComponent);
}