@codedoc/core
Version:
Create beautiful modern documentation websites.
74 lines • 4.54 kB
JavaScript
;
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
return cooked;
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.RefBox = void 0;
var rxjs_1 = require("rxjs");
var operators_1 = require("rxjs/operators");
var html_1 = require("@connectv/html");
var style_1 = require("./style");
var config_1 = require("../../../transport/config");
function RefBox(_, renderer) {
var classes = this.theme.classes(style_1.RefBoxStyle);
var target$ = this.expose.in('target', new rxjs_1.Subject());
var latest$ = new rxjs_1.BehaviorSubject(undefined);
target$.pipe(operators_1.filter(function (el) { return !!el; })).subscribe(latest$);
var box = html_1.ref();
var active$ = target$.pipe(operators_1.debounceTime(10), operators_1.map(function (el) { return !!el; }));
var hover = false;
var top$ = target$.pipe(operators_1.switchMap(function (el) { return el ? rxjs_1.of(el) : rxjs_1.of(el).pipe(operators_1.delay(300)); }), operators_1.filter(function () { return !hover; }), operators_1.mergeMap(function (el) { return el ?
rxjs_1.of(el.getBoundingClientRect().top + 18) :
rxjs_1.of(-1000); }));
var left$ = rxjs_1.fromEvent(document, 'mousemove').pipe(operators_1.filter(function () { return !hover; }), operators_1.map(function (e) { return e.clientX + 12; }), operators_1.sample(active$.pipe(operators_1.filter(function (_) { return _; }))));
var link$ = target$.pipe(operators_1.filter(function (el) { return !!el; }), operators_1.map(function (el) { return (el === null || el === void 0 ? void 0 : el.getAttribute('data-ref')) || ''; }), operators_1.map(function (l) {
if (l.startsWith('/')) {
var conf = config_1.getConfig();
if (conf)
return conf.namespace + l;
}
return l;
}));
var text$ = target$.pipe(operators_1.filter(function (el) { return !!el; }), operators_1.map(function (el) {
if (el === null || el === void 0 ? void 0 : el.hasAttribute('data-ref-text'))
return el.getAttribute('data-ref-text') || '';
else {
var _text = (el === null || el === void 0 ? void 0 : el.getAttribute('data-ref')) || '';
if (_text.startsWith('tab:'))
return _text.substr(4);
else
return _text;
}
}));
return renderer.create("div", { _ref: box, class: html_1.rl(templateObject_1 || (templateObject_1 = __makeTemplateObject(["", " ", ""], ["", " ", ""])), classes.refbox, html_1.toggleList({ active: active$.pipe(operators_1.startWith(false)) })), style: html_1.rl(templateObject_2 || (templateObject_2 = __makeTemplateObject(["top: ", "px;left: ", "px"], ["top: ", "px;left: ", "px"])), top$, left$), onmouseenter: function () { return hover = true; }, onmouseleave: function () { hover = false; target$.next(undefined); }, onclick: function (event) {
var _a, _b;
var ref = (_a = latest$.value) === null || _a === void 0 ? void 0 : _a.getAttribute('data-ref');
if (ref === null || ref === void 0 ? void 0 : ref.startsWith('tab:')) {
ref = ref.substr(4);
var tab$ = latest$.value;
while (tab$ && !(tab$ === null || tab$ === void 0 ? void 0 : tab$.hasAttribute('data-tab-id')))
tab$ = (tab$ === null || tab$ === void 0 ? void 0 : tab$.parentElement) || undefined;
if (tab$) {
var btn$ = (_b = tab$.parentElement) === null || _b === void 0 ? void 0 : _b.querySelector(".selector>button[data-tab-id=\"" + ref + "\"]");
if (btn$) {
btn$.click();
event.stopPropagation();
event.preventDefault();
}
}
}
hover = false;
target$.next(undefined);
box.$.style.top = '-1000px';
} },
renderer.create("span", { class: "icon-font" }, "touch_app"),
renderer.create("a", { href: link$, target: "_blank" },
"See ",
text$));
}
exports.RefBox = RefBox;
var style_2 = require("./style");
Object.defineProperty(exports, "RefBoxStyle", { enumerable: true, get: function () { return style_2.RefBoxStyle; } });
var templateObject_1, templateObject_2;
//# sourceMappingURL=component.js.map