taxonium-component
Version:
React component for exploring large phylogenetic trees in the browser
489 lines (488 loc) • 15.2 kB
JavaScript
import { jsx as n, jsxs as T, Fragment as I } from "react/jsx-runtime";
import { A as v, z as w, E as C, G as N, H as R, I as B, u as S, P as F, B as L, bF as G, bE as W, bc as X, a as q, D as J, T as E, d as K } from "./JBrowsePanel-BNE3gNW1.js";
import { c as O, p as M } from "./index-CoM8QAjP.js";
import * as h from "react";
import e from "prop-types";
import { T as Y, a as k, b as m } from "./TableCell-BMrUTE1N.js";
import { D as Z } from "./Divider-36OQM56c.js";
function Q(o) {
return v("MuiTable", o);
}
w("MuiTable", ["root", "stickyHeader"]);
const ee = (o) => {
const {
classes: t,
stickyHeader: a
} = o;
return R({
root: ["root", a && "stickyHeader"]
}, Q, t);
}, oe = N("table", {
name: "MuiTable",
slot: "Root",
overridesResolver: (o, t) => {
const {
ownerState: a
} = o;
return [t.root, a.stickyHeader && t.stickyHeader];
}
})(B(({
theme: o
}) => ({
display: "table",
width: "100%",
borderCollapse: "collapse",
borderSpacing: 0,
"& caption": {
...o.typography.body2,
padding: o.spacing(2),
color: (o.vars || o).palette.text.secondary,
textAlign: "left",
captionSide: "bottom"
},
variants: [{
props: ({
ownerState: t
}) => t.stickyHeader,
style: {
borderCollapse: "separate"
}
}]
}))), j = "table", P = /* @__PURE__ */ h.forwardRef(function(t, a) {
const s = C({
props: t,
name: "MuiTable"
}), {
className: l,
component: r = j,
padding: p = "normal",
size: c = "medium",
stickyHeader: i = !1,
...y
} = s, g = {
...s,
component: r,
padding: p,
size: c,
stickyHeader: i
}, d = ee(g), u = h.useMemo(() => ({
padding: p,
size: c,
stickyHeader: i
}), [p, c, i]);
return /* @__PURE__ */ n(Y.Provider, {
value: u,
children: /* @__PURE__ */ n(oe, {
as: r,
role: r === j ? null : "table",
ref: a,
className: O(d.root, l),
ownerState: g,
...y
})
});
});
M.env.NODE_ENV !== "production" && (P.propTypes = {
// ┌────────────────────────────── Warning ──────────────────────────────┐
// │ These PropTypes are generated from the TypeScript type definitions. │
// │ To update them, edit the d.ts file and run `pnpm proptypes`. │
// └─────────────────────────────────────────────────────────────────────┘
/**
* The content of the table, normally `TableHead` and `TableBody`.
*/
children: e.node,
/**
* Override or extend the styles applied to the component.
*/
classes: e.object,
/**
* @ignore
*/
className: e.string,
/**
* The component used for the root node.
* Either a string to use a HTML element or a component.
*/
component: e.elementType,
/**
* Allows TableCells to inherit padding of the Table.
* @default 'normal'
*/
padding: e.oneOf(["checkbox", "none", "normal"]),
/**
* Allows TableCells to inherit size of the Table.
* @default 'medium'
*/
size: e.oneOfType([e.oneOf(["medium", "small"]), e.string]),
/**
* Set the header sticky.
* @default false
*/
stickyHeader: e.bool,
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object])
});
function te(o) {
return v("MuiTableBody", o);
}
w("MuiTableBody", ["root"]);
const ae = (o) => {
const {
classes: t
} = o;
return R({
root: ["root"]
}, te, t);
}, ne = N("tbody", {
name: "MuiTableBody",
slot: "Root"
})({
display: "table-row-group"
}), se = {
variant: "body"
}, H = "tbody", _ = /* @__PURE__ */ h.forwardRef(function(t, a) {
const s = C({
props: t,
name: "MuiTableBody"
}), {
className: l,
component: r = H,
...p
} = s, c = {
...s,
component: r
}, i = ae(c);
return /* @__PURE__ */ n(k.Provider, {
value: se,
children: /* @__PURE__ */ n(ne, {
className: O(i.root, l),
as: r,
ref: a,
role: r === H ? null : "rowgroup",
ownerState: c,
...p
})
});
});
M.env.NODE_ENV !== "production" && (_.propTypes = {
// ┌────────────────────────────── Warning ──────────────────────────────┐
// │ These PropTypes are generated from the TypeScript type definitions. │
// │ To update them, edit the d.ts file and run `pnpm proptypes`. │
// └─────────────────────────────────────────────────────────────────────┘
/**
* The content of the component, normally `TableRow`.
*/
children: e.node,
/**
* Override or extend the styles applied to the component.
*/
classes: e.object,
/**
* @ignore
*/
className: e.string,
/**
* The component used for the root node.
* Either a string to use a HTML element or a component.
*/
component: e.elementType,
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object])
});
function re(o) {
return v("MuiTableContainer", o);
}
w("MuiTableContainer", ["root"]);
const le = (o) => {
const {
classes: t
} = o;
return R({
root: ["root"]
}, re, t);
}, ce = N("div", {
name: "MuiTableContainer",
slot: "Root"
})({
width: "100%",
overflowX: "auto"
}), A = /* @__PURE__ */ h.forwardRef(function(t, a) {
const s = C({
props: t,
name: "MuiTableContainer"
}), {
className: l,
component: r = "div",
...p
} = s, c = {
...s,
component: r
}, i = le(c);
return /* @__PURE__ */ n(ce, {
ref: a,
as: r,
className: O(i.root, l),
ownerState: c,
...p
});
});
M.env.NODE_ENV !== "production" && (A.propTypes = {
// ┌────────────────────────────── Warning ──────────────────────────────┐
// │ These PropTypes are generated from the TypeScript type definitions. │
// │ To update them, edit the d.ts file and run `pnpm proptypes`. │
// └─────────────────────────────────────────────────────────────────────┘
/**
* The content of the component, normally `Table`.
*/
children: e.node,
/**
* Override or extend the styles applied to the component.
*/
classes: e.object,
/**
* @ignore
*/
className: e.string,
/**
* The component used for the root node.
* Either a string to use a HTML element or a component.
*/
component: e.elementType,
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object])
});
function ie(o) {
return v("MuiTableHead", o);
}
w("MuiTableHead", ["root"]);
const de = (o) => {
const {
classes: t
} = o;
return R({
root: ["root"]
}, ie, t);
}, pe = N("thead", {
name: "MuiTableHead",
slot: "Root"
})({
display: "table-header-group"
}), ue = {
variant: "head"
}, $ = "thead", V = /* @__PURE__ */ h.forwardRef(function(t, a) {
const s = C({
props: t,
name: "MuiTableHead"
}), {
className: l,
component: r = $,
...p
} = s, c = {
...s,
component: r
}, i = de(c);
return /* @__PURE__ */ n(k.Provider, {
value: ue,
children: /* @__PURE__ */ n(pe, {
as: r,
className: O(i.root, l),
ref: a,
role: r === $ ? null : "rowgroup",
ownerState: c,
...p
})
});
});
M.env.NODE_ENV !== "production" && (V.propTypes = {
// ┌────────────────────────────── Warning ──────────────────────────────┐
// │ These PropTypes are generated from the TypeScript type definitions. │
// │ To update them, edit the d.ts file and run `pnpm proptypes`. │
// └─────────────────────────────────────────────────────────────────────┘
/**
* The content of the component, normally `TableRow`.
*/
children: e.node,
/**
* Override or extend the styles applied to the component.
*/
classes: e.object,
/**
* @ignore
*/
className: e.string,
/**
* The component used for the root node.
* Either a string to use a HTML element or a component.
*/
component: e.elementType,
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object])
});
function be(o) {
return v("MuiTableRow", o);
}
const D = w("MuiTableRow", ["root", "selected", "hover", "head", "footer"]), fe = (o) => {
const {
classes: t,
selected: a,
hover: s,
head: l,
footer: r
} = o;
return R({
root: ["root", a && "selected", s && "hover", l && "head", r && "footer"]
}, be, t);
}, ye = N("tr", {
name: "MuiTableRow",
slot: "Root",
overridesResolver: (o, t) => {
const {
ownerState: a
} = o;
return [t.root, a.head && t.head, a.footer && t.footer];
}
})(B(({
theme: o
}) => ({
color: "inherit",
display: "table-row",
verticalAlign: "middle",
// We disable the focus ring for mouse, touch and keyboard users.
outline: 0,
[`&.${D.hover}:hover`]: {
backgroundColor: (o.vars || o).palette.action.hover
},
[`&.${D.selected}`]: {
backgroundColor: o.alpha((o.vars || o).palette.primary.main, (o.vars || o).palette.action.selectedOpacity),
"&:hover": {
backgroundColor: o.alpha((o.vars || o).palette.primary.main, `${(o.vars || o).palette.action.selectedOpacity} + ${(o.vars || o).palette.action.hoverOpacity}`)
}
}
}))), U = "tr", x = /* @__PURE__ */ h.forwardRef(function(t, a) {
const s = C({
props: t,
name: "MuiTableRow"
}), {
className: l,
component: r = U,
hover: p = !1,
selected: c = !1,
...i
} = s, y = h.useContext(k), g = {
...s,
component: r,
hover: p,
selected: c,
head: y && y.variant === "head",
footer: y && y.variant === "footer"
}, d = fe(g);
return /* @__PURE__ */ n(ye, {
as: r,
ref: a,
className: O(d.root, l),
role: r === U ? null : "row",
ownerState: g,
...i
});
});
M.env.NODE_ENV !== "production" && (x.propTypes = {
// ┌────────────────────────────── Warning ──────────────────────────────┐
// │ These PropTypes are generated from the TypeScript type definitions. │
// │ To update them, edit the d.ts file and run `pnpm proptypes`. │
// └─────────────────────────────────────────────────────────────────────┘
/**
* Should be valid `<tr>` children such as `TableCell`.
*/
children: e.node,
/**
* Override or extend the styles applied to the component.
*/
classes: e.object,
/**
* @ignore
*/
className: e.string,
/**
* The component used for the root node.
* Either a string to use a HTML element or a component.
*/
component: e.elementType,
/**
* If `true`, the table row will shade on hover.
* @default false
*/
hover: e.bool,
/**
* If `true`, the table row will have the selected shading.
* @default false
*/
selected: e.bool,
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object])
});
function me({ searchResults: o, assemblyName: t, model: a, handleClose: s }) {
const l = S.getSession(a), { pluginManager: r } = S.getEnv(l), { assemblyManager: p } = l, c = t || a.displayedRegions[0].assemblyName, i = p.get(c);
if (!i)
throw new Error(`assembly ${c} not found`);
if (!i.regions)
throw new Error(`assembly ${c} regions not loaded`);
function y(d) {
var u;
if (d) {
const f = r.pluggableConfigSchemaType("track"), b = G(f, W(a), d);
return ((u = b == null ? void 0 : b.name) === null || u === void 0 ? void 0 : u.value) || "";
}
return "";
}
async function g(d) {
var u;
if (d.hasLocation())
await X({
option: d,
model: a,
assemblyName: c
});
else {
const f = d.getLabel(), b = (u = i == null ? void 0 : i.regions) === null || u === void 0 ? void 0 : u.find((z) => f === z.refName);
b && (a.setDisplayedRegions([b]), a.showAllRegions());
}
}
return n(A, { component: F, children: T(P, { children: [n(V, { children: T(x, { children: [n(m, { children: "Name" }), n(m, { align: "right", children: "Location" }), n(m, { align: "right", children: "Track" }), n(m, { align: "right" })] }) }), n(_, { children: o.map((d) => {
const u = d.getLocation();
let f;
try {
f = u ? S.parseLocString(u, (b) => i.isValidRefName(b)) : void 0;
} catch {
}
return T(x, { children: [n(m, { component: "th", scope: "row", children: d.getLabel() }), n(m, { align: "right", children: f ? S.assembleLocString({
...f,
refName: i.getCanonicalRefName(f.refName) || f.refName
}) : u }), n(m, { align: "right", children: y(d.getTrackId()) || "N/A" }), n(m, { align: "right", children: n(L, { onClick: async () => {
try {
await g(d);
} catch (b) {
console.error(b), l.notifyError(`${b}`, b);
}
s();
}, color: "primary", variant: "contained", children: "Go" }) })] }, d.getId());
}) })] }) });
}
function Ne({ model: o, assemblyName: t, searchQuery: a, searchResults: s, handleClose: l }) {
return T(q.Dialog, { open: !0, maxWidth: "xl", onClose: l, title: "Search results", children: [n(J, { children: s != null && s.length ? T(I, { children: [T(E, { children: ["Showing results for ", n("b", { children: a })] }), n(me, { model: o, handleClose: l, assemblyName: t, searchResults: s })] }) : T(E, { children: ["No results found for ", n("b", { children: a })] }) }), n(Z, {}), n(K, { children: n(L, { onClick: () => {
l();
}, color: "primary", children: "Cancel" }) })] });
}
export {
Ne as default
};
//# sourceMappingURL=SearchResultsDialog-CNbeFvhr.js.map