UNPKG

@codedoc/core

Version:

Create beautiful modern documentation websites.

90 lines 3.73 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.SearchSwitcher = void 0; var core_1 = require("@connectv/core"); var html_1 = require("@connectv/html"); var styles_1 = require("./styles"); function SearchSwitcher(options, renderer) { var classes = this.theme.classes(styles_1.SearchSwitcherStyles); var holder = html_1.ref(); var index = core_1.state(1); var focused = undefined; var focus = function (element) { var _a; if (focused) focused.style.transform = ''; element.style.transform = 'scale(1.15)'; focused = element; var delay = 1; var parent = focused.parentElement; while (parent) { if (parent.hasAttribute('data-tab-title')) { if (!parent.classList.contains('selected')) { var ref_1 = parent.getAttribute('data-tab-title'); var btn$ = (_a = parent .parentElement) === null || _a === void 0 ? void 0 : _a.querySelector(".selector>button[data-tab-title=\"" + ref_1 + "\"]"); if (btn$) { btn$.click(); delay = 300; } } } parent = parent.parentElement; } setTimeout(function () { return focused === null || focused === void 0 ? void 0 : focused.scrollIntoView({ block: 'center' }); }, delay); }; var next = function () { if (index.value >= options.elements.length) index.value = 1; else index.value++; focus(options.elements[index.value - 1]); }; var prev = function () { if (index.value <= 1) index.value = options.elements.length; else index.value--; focus(options.elements[index.value - 1]); }; var keyhandler = function (event) { if (event.key === 'ArrowLeft' || event.key === 'ArrowUp') prev(); if (event.key === 'ArrowRight' || event.key === 'ArrowDown') next(); if (event.key === 'Escape') { holder.$.remove(); event.preventDefault(); } }; this.track({ bind: function () { document.addEventListener('keydown', keyhandler); focus(options.elements[0]); }, clear: function () { document.removeEventListener('keydown', keyhandler); options.elements.forEach(function (element) { renderer.render(renderer.create("fragment", null, element.textContent)).before(element); element.remove(); }); } }); return renderer.create("div", { class: classes.holder, _ref: holder }, renderer.create("span", { class: "icon-font", onclick: function () { return holder.$.remove(); } }, "close"), renderer.create("span", { class: "icon-font", onclick: function () { var _a; localStorage.setItem('-codedoc-search-query', options.query); (_a = document.getElementById('-codedoc-search-btn')) === null || _a === void 0 ? void 0 : _a.click(); } }, "list"), renderer.create("span", { class: classes.content }, options.elements.length > 0 ? renderer.create("fragment", null, index, "/", options.elements.length) : 'No Exact Match'), renderer.create("span", { class: "icon-font", onclick: prev }, "chevron_left"), renderer.create("span", { class: "icon-font", onclick: next }, "chevron_right")); } exports.SearchSwitcher = SearchSwitcher; //# sourceMappingURL=switcher.js.map