taxonium-component
Version:
React component for exploring large phylogenetic trees in the browser
35 lines (34 loc) • 2.46 kB
JavaScript
import { jsx as t, jsxs as n } from "react/jsx-runtime";
import { forwardRef as j } from "react";
import { o as S, W as x, m as k, u as p } from "./JBrowsePanel-uJIA-L6s.js";
const w = k()(() => ({
td: {
whiteSpace: "nowrap"
}
})), D = (e = 0) => +(+e).toFixed(1), f = (e, d = 1) => `${D(e / (d || 1) * 100)}%`, P = j(function(d, o) {
const { feature: i, model: g } = d, { classes: v } = w(), a = i.get("start") + 1, u = i.get("end"), y = i.get("refName"), { refbase: m, readsCounted: h, depth: L, ref: l, ...$ } = i.get("snpinfo"), b = [
y,
a === u ? p.toLocale(a) : `${p.toLocale(a)}..${p.toLocale(u)}`
].filter((s) => !!s).join(":");
return t("div", { ref: o, children: n("table", { children: [t("caption", { children: b }), t("thead", { children: n("tr", { children: [t("th", {}), t("th", { children: "Base" }), t("th", { children: "Count" }), t("th", { children: "% of Total" }), t("th", { children: "Strands" })] }) }), n("tbody", { children: [n("tr", { children: [t("td", {}), t("td", { children: "Total" }), t("td", { children: h }), t("td", { children: " " }), t("td", { children: " " })] }), n("tr", { children: [t("td", {}), n("td", { children: ["REF ", m ? `(${m.toUpperCase()})` : ""] }), t("td", { children: l.entryDepth }), t("td", { children: f(l.entryDepth, h) }), n("td", { children: [l[-1] ? `${l[-1]}(-)` : "", l[1] ? `${l[1]}(+)` : ""] })] }), Object.entries($).map(([s, C]) => Object.entries(C).map(([c, r]) => n("tr", { children: [t("td", { children: t(_, { model: g, base: c }) }), n("td", { children: [c.toUpperCase(), " "] }), t("td", { className: v.td, children: [
r.entryDepth,
r.avgProbability !== void 0 ? `(avg. ${f(r.avgProbability)} prob.)` : ""
].filter((T) => !!T).join(" ") }), t("td", { children: c === "depth" || c === "skip" ? "---" : f(r.entryDepth, h) }), n("td", { children: [r[-1] ? `${r[-1]}(-)` : "", r[1] ? `${r[1]}(+)` : ""] })] }, `${s}_${c}`)))] })] }) });
});
function _({ base: e, model: d }) {
var o;
const { visibleModifications: i } = d;
return e.startsWith("mod_") ? t("div", { style: {
width: 10,
height: 10,
background: (o = i.get(e.replace("mod_", ""))) === null || o === void 0 ? void 0 : o.color
} }) : null;
}
const E = S(function(e) {
const { model: d } = e, { featureUnderMouse: o } = d;
return o && o.get("type") === "skip" ? null : t(x, { TooltipContents: P, ...e });
});
export {
E as default
};
//# sourceMappingURL=Tooltip-DWTwxSO-.js.map