taxonium-component/dist/VariantFeatureWidget-B8GY_WS3.js

React component for exploring large phylogenetic trees in the browser

import { jsxs as m, jsx as o, Fragment as G } from "react/jsx-runtime";
import { useState as v, Suspense as V, lazy as q } from "react";
import { bU as $, b0 as M, T as F, u as E, c as U, bV as W, bW as z, a as Q, o as x, P as J, aU as K } from "./JBrowsePanel-uJIA-L6s.js";
import { F as X } from "./FeatureDetails-8c1_Dsqv.js";
import { B as D } from "./BaseCard-CrWzwjYv.js";
import { D as L } from "./DataGridFlexContainer-C5VGURcL.js";
import { F as j } from "./FormControlLabel-CwjOxa71.js";
import { C as P } from "./Checkbox-BG4jcGUl.js";
import { D as R } from "./DataGrid-DA9cZ2dC.js";
function Y({ value: n, ref: r }) {
  const [e, t] = v(!1);
  return $(r, n) !== n ? m("div", { children: [o("button", { onClick: () => {
    t(!e);
  }, children: e ? "Show simplified ALT" : "Show raw ALT" }), " ", e ? n : $(r, n)] }) : n;
}
function Z({ value: n }) {
  const [r, e] = v(!1), [t, i] = v(!1), a = String(n);
  return a.length > 100 ? m(G, { children: [o("button", { type: "button", onClick: () => {
    M(a), i(!0), setTimeout(() => {
      i(!1);
    }, 700);
  }, children: t ? "Copied to clipboard" : "Copy" }), o("button", { type: "button", onClick: () => {
    e((d) => !d);
  }, children: r ? "Show less" : "Show more" }), o("div", { children: r ? a : `${a.slice(0, 100)}...` })] }) : o("div", { children: a });
}
function _({ checked: n, disabled: r, label: e, onChange: t }) {
  return o(j, { disabled: r, control: o(P, { checked: n, onChange: t }), label: o(F, { variant: "body2", children: e }) });
}
function ee(n) {
  return n.toPrecision(3);
}
function te({ rows: n }) {
  const [r, e] = v(!1), t = {};
  if (r)
    for (const s of n) {
      const l = {}, p = s.GT.split(/[/|]/);
      for (const y of p)
        l[y] = (l[y] || 0) + 1;
      const g = Object.entries(l).map(([y, S]) => `${y}:${S}`).join(";");
      t[g] || (t[g] = {
        count: 0,
        GT: g,
        genotype: s.genotype
      }), t[g].count++;
    }
  else
    for (const s of n) {
      const l = s.GT;
      t[l] || (t[l] = {
        count: 0,
        GT: s.GT,
        genotype: s.genotype
      }), t[l].count++;
    }
  const i = Object.entries(t).map(([s, l]) => ({
    id: s,
    ...l,
    count: `${l.count} / ${n.length}`,
    frequency: `${ee(l.count / n.length * 100)}%`
  })), d = (i[0] ? Object.keys(i[0]) : []).map((s) => E.measureGridWidth(i.map((l) => `${l[s]}`)));
  return m("div", { children: [o(j, { control: o(P, { checked: r }), label: o(F, { variant: "body2", children: "Use allele counts instead of exact GT" }), onChange: (s, l) => {
    e(l);
  } }), o(L, { children: o(R, { rows: i, hideFooter: !0, rowHeight: 25, columnHeaderHeight: 35, columns: [
    {
      field: "GT",
      width: d[0]
    },
    {
      field: "count",
      width: d[1]
    },
    {
      field: "frequency",
      width: d[2]
    },
    {
      field: "genotype",
      width: d[3]
    }
  ] }) })] });
}
function ne({ columns: n, filter: r, setFilter: e }) {
  return m(G, { children: [o(F, { children: "These filters can use a plain text search or regex style query, e.g. in the genotype field, entering 1 will query for all genotypes that include the first alternate allele e.g. 0|1 or 1|1, entering [1-9]\\d* will find any non-zero allele e.g. 0|2 or 2/33" }), n.map(({ field: t }) => o(U, { placeholder: `Filter ${t}`, value: r[t] || "", onChange: (i) => {
    e({ ...r, [t]: i.target.value });
  } }, `filter-${t}`))] });
}
function oe(n, r) {
  if (n.size !== r.size)
    return !1;
  for (const e of n)
    if (!r.has(e))
      return !1;
  return !0;
}
function re(n) {
  var r;
  const { feature: e, descriptions: t = {} } = n, [i, a] = v({}), [d, s] = v(!0), [l, p] = v(!1), g = e.samples || {}, y = e.ALT, S = e.REF, C = Object.entries(g).map(([c, u]) => {
    var f, h;
    return [
      c,
      {
        ...u,
        GT: `${(f = u.GT) === null || f === void 0 ? void 0 : f[0]}`,
        genotype: W(`${(h = u.GT) === null || h === void 0 ? void 0 : h[0]}`, S, y)
      }
    ];
  });
  let T, b = [];
  const O = Object.keys(i);
  try {
    b = C.map(([c, u]) => ({
      ...Object.fromEntries(Object.entries(u).map(([f, h]) => [
        f,
        h
      ])),
      sample: c,
      id: c
    })).filter((c) => O.length ? O.every((u) => {
      const f = i[u];
      return f ? new RegExp(f, "i").exec(c[u]) : !0;
    }) : !0);
  } catch (c) {
    console.error(c), T = c;
  }
  const k = ["sample", ...Object.keys(((r = C[0]) === null || r === void 0 ? void 0 : r[1]) || {})], H = k.map((c) => E.measureGridWidth(b.map((u) => u[c]))), N = k.map((c, u) => {
    var f, h;
    return {
      field: c,
      description: (h = (f = t == null ? void 0 : t.FORMAT) === null || f === void 0 ? void 0 : f[c]) === null || h === void 0 ? void 0 : h.Description,
      width: H[u]
    };
  }), A = /* @__PURE__ */ new Set(["sample", "GT", "genotype"]), B = new Set(k);
  return C.length ? m(G, { children: [o(D, { ...n, title: "Genotype frequencies", children: o(z.ErrorBoundary, { FallbackComponent: Q.ErrorMessage, children: o(te, { rows: b }) }) }), m(D, { ...n, title: "Samples", children: [T ? o(F, { color: "error", children: `${T}` }) : null, o(_, { label: "Show filters", checked: l, onChange: (c) => {
    p(c.target.checked);
  } }), oe(A, B) ? null : o(_, { label: "Show only genotype columns", checked: d, onChange: (c) => {
    s(c.target.checked);
  } }), l ? o(ne, { setFilter: a, columns: N, filter: i }) : null, o(L, { children: o(R, { rows: b, hideFooter: b.length < 100, columns: d ? N.filter((c) => A.has(c.field)) : N, rowHeight: 25, columnHeaderHeight: 35, showToolbar: !0 }) })] })] }) : null;
}
const ie = {
  CHROM: "chromosome: An identifier from the reference genome",
  POS: "position: The reference position, with the 1st base having position 1",
  ID: "identifier: Semi-colon separated list of unique identifiers where available",
  REF: "reference base(s): Each base must be one of A,C,G,T,N (case insensitive).",
  ALT: "alternate base(s): Comma-separated list of alternate non-reference alleles",
  QUAL: "quality: Phred-scaled quality score for the assertion made in ALT",
  FILTER: "filter status: PASS if this position has passed all filters, otherwise a semicolon-separated list of codes for filters that fail"
}, w = q(() => import("./LaunchBreakendPanel-axw90gdZ.js")), I = q(() => import("./VariantConsequenceDataGrid-dh1jT-Zu.js"));
function ae({ descriptions: n, feature: r }) {
  var e, t, i, a, d;
  const s = (t = (e = n == null ? void 0 : n.INFO) === null || e === void 0 ? void 0 : e.ANN) === null || t === void 0 ? void 0 : t.Description, l = ((a = (i = s == null ? void 0 : s.match(/.*Functional annotations:'(.*)'$/)) === null || i === void 0 ? void 0 : i[1]) === null || a === void 0 ? void 0 : a.split("|")) || [], p = ((d = r.INFO) === null || d === void 0 ? void 0 : d.ANN) || [];
  return o(I, { fields: l, data: p, title: "Variant ANN field" });
}
function se({ descriptions: n, feature: r }) {
  var e, t, i, a, d;
  const s = (t = (e = n == null ? void 0 : n.INFO) === null || e === void 0 ? void 0 : e.CSQ) === null || t === void 0 ? void 0 : t.Description, l = ((a = (i = s == null ? void 0 : s.match(/.*Format: (.*)/)) === null || i === void 0 ? void 0 : i[1]) === null || a === void 0 ? void 0 : a.split("|")) || [], p = ((d = r.INFO) === null || d === void 0 ? void 0 : d.CSQ) || [];
  return o(I, { fields: l, data: p, title: "Variant CSQ field" });
}
function le({ model: n }) {
  const { featureData: r } = n, e = JSON.parse(JSON.stringify(r)), { type: t = "" } = e;
  return t === "breakend" ? o(w, { feature: e, locStrings: e.ALT.map((i) => {
    var a;
    return ((a = K(i)) === null || a === void 0 ? void 0 : a.MatePosition) || "";
  }), model: n }) : t === "translocation" ? o(w, { feature: e, model: n, locStrings: [`${e.INFO.CHR2[0]}:${e.INFO.END}`] }) : t === "paired_feature" ? o(w, { feature: e, model: n, locStrings: [`${e.mate.refName}:${e.mate.start}`] }) : t.includes("inversion") || t.includes("deletion") || t.includes("duplication") || t.includes("cnv") || t.includes("sv") ? o(w, { feature: {
    uniqueId: "random",
    refName: e.refName,
    start: e.start,
    end: e.start + 1,
    mate: {
      refName: e.refName,
      start: e.end,
      end: e.end + 1
    }
  }, model: n, locStrings: [`${e.refName}:${e.end}`] }) : null;
}
const ce = x(function(n) {
  const { feat: r, model: e } = n, { descriptions: t } = e, { samples: i, ...a } = r, { REF: d } = a;
  return m(J, { "data-testid": "variant-side-drawer", children: [o(X, { feature: a, descriptions: {
    ...ie,
    ...t
  }, formatter: (s, l) => l === "ALT" ? o(Y, { value: `${s}`, ref: d }) : o(Z, { value: s }), ...n }), m(V, { fallback: null, children: [o(se, { feature: a, descriptions: t }), o(ae, { feature: a, descriptions: t }), o(le, { model: e })] }), o(re, { feature: r, ...n, descriptions: t })] });
}), be = x(function(n) {
  const { model: r } = n, { featureData: e } = r, t = structuredClone(e);
  return t ? o(ce, { feat: t, ...n }) : o("div", { children: "No feature loaded, may not be available after page refresh because it was too large for localStorage" });
});
export {
  be as default
};
//# sourceMappingURL=VariantFeatureWidget-B8GY_WS3.js.map