taxonium-component
Version:
React component for exploring large phylogenetic trees in the browser
230 lines (229 loc) • 9.68 kB
JavaScript
import { jsx as n, jsxs as u, Fragment as B } from "react/jsx-runtime";
import * as $ from "react";
import { useState as v, useEffect as F, lazy as x } from "react";
import { A as U, z as O, E as z, G as W, H, U as f, u as g, o as p, T as m, m as y, a3 as M, a4 as C, bO as E, an as V, a as w, B as A, bp as q, bP as _, c as G, bG as Y } from "./JBrowsePanel-BNE3gNW1.js";
import { C as J } from "./Clear-BiEOus7g.js";
import { A as b, a as I, E as S } from "./ExpandMore-BPp-WDGi.js";
import { D as K } from "./Delete-CRntlDho.js";
import { L as Q } from "./ListItem-hho_hfbE.js";
import { C as X, a as Z } from "./CardContent-CBvdvL5S.js";
import { c as nn, p as en } from "./index-CoM8QAjP.js";
import d from "prop-types";
function sn(e) {
return U("MuiCardActions", e);
}
O("MuiCardActions", ["root", "spacing"]);
const tn = (e) => {
const {
classes: s,
disableSpacing: a
} = e;
return H({
root: ["root", !a && "spacing"]
}, sn, s);
}, an = W("div", {
name: "MuiCardActions",
slot: "Root",
overridesResolver: (e, s) => {
const {
ownerState: a
} = e;
return [s.root, !a.disableSpacing && s.spacing];
}
})({
display: "flex",
alignItems: "center",
padding: 8,
variants: [{
props: {
disableSpacing: !1
},
style: {
"& > :not(style) ~ :not(style)": {
marginLeft: 8
}
}
}]
}), N = /* @__PURE__ */ $.forwardRef(function(s, a) {
const o = z({
props: s,
name: "MuiCardActions"
}), {
disableSpacing: t = !1,
className: c,
...i
} = o, l = {
...o,
disableSpacing: t
}, r = tn(l);
return /* @__PURE__ */ n(an, {
className: nn(r.root, c),
ownerState: l,
ref: a,
...i
});
});
en.env.NODE_ENV !== "production" && (N.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.
*/
children: d.node,
/**
* Override or extend the styles applied to the component.
*/
classes: d.object,
/**
* @ignore
*/
className: d.string,
/**
* If `true`, the actions do not have additional margin.
* @default false
*/
disableSpacing: d.bool,
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx: d.oneOfType([d.arrayOf(d.oneOfType([d.func, d.object, d.bool])), d.func, d.object])
});
const on = f(/* @__PURE__ */ n("path", {
d: "M11 7h2v2h-2zm0 4h2v6h-2zm1-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8"
}), "InfoOutlined"), rn = f(/* @__PURE__ */ n("path", {
d: "M18 8h-1V6c0-2.76-2.24-5-5-5S7 3.24 7 6v2H6c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2m-6 9c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2m3.1-9H8.9V6c0-1.71 1.39-3.1 3.1-3.1s3.1 1.39 3.1 3.1z"
}), "Lock");
function ln() {
const [e, s] = v(), [a, o] = v();
return F(() => {
(async () => {
try {
const t = await fetch("https://jbrowse.org/plugin-store/plugins.json");
if (!t.ok) {
const i = await t.text();
throw new Error(`HTTP ${t.status} fetching plugins: ${i}`);
}
const c = await t.json();
s(c.plugins);
} catch (t) {
console.error(t), o(t);
}
})();
}, []), { plugins: e, error: a };
}
function cn(e, s) {
const { pluginManager: a } = g.getEnv(s);
return g.isSessionWithSessionPlugins(s) ? s.sessionPlugins.some((o) => {
var t;
return ((t = a.pluginMetadata[e.name]) === null || t === void 0 ? void 0 : t.url) === o.url;
}) : !1;
}
const dn = x(() => import("./DeletePluginDialog-Dub5FSVa.js")), L = y()(() => ({
iconMargin: {
marginRight: "0.5rem"
}
}));
function un() {
const { classes: e } = L();
return n(M, { className: e.iconMargin, title: "This plugin was installed by an administrator, you cannot remove it.", children: n("span", { children: n(C, { disabled: !0, children: n(rn, {}) }) }) });
}
const mn = p(function({ plugin: e, model: s }) {
const { classes: a } = L(), { pluginManager: o } = g.getEnv(s), t = g.getSession(s), { jbrowse: c, adminMode: i } = t;
return n(M, { className: a.iconMargin, title: "Uninstall plugin", children: n(C, { "data-testid": `removePlugin-${e.name}`, onClick: () => {
t.queueDialog((l) => [
dn,
{
plugin: e.name,
onClose: (r) => {
if (r) {
const h = o.pluginMetadata[e.name];
i ? c.removePlugin(h) : E.isSessionWithSessionPlugins(t) && t.removeSessionPlugin(h);
}
l();
}
}
]);
}, children: n(K, {}) }) });
}), gn = p(function({ plugin: e, model: s }) {
const a = g.getSession(s), { adminMode: o } = a;
return u(Q, { children: [o || cn(e, a) ? n(mn, { plugin: e, model: s }) : n(un, {}), n(m, { children: [e.name, e.version ? `(v${e.version})` : ""].filter((t) => !!t).join(" ") })] }, e.name);
}), pn = p(function({ pluginManager: s, model: a }) {
const { plugins: o } = s, { filterText: t } = a, c = o.filter((i) => {
var l;
return !(!((l = s.pluginMetadata[i.name]) === null || l === void 0) && l.isCore);
});
return n(V, { children: c.length > 0 ? c.filter((i) => i.name.toLowerCase().includes(t.toLowerCase())).map((i) => n(gn, { plugin: i, model: a }, i.name)) : n(m, { children: "No plugins currently installed" }) });
}), hn = f(/* @__PURE__ */ n("path", {
d: "M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"
}), "Check"), fn = f(/* @__PURE__ */ n("path", {
d: "M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4m0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4"
}), "Person"), vn = y()({
card: {
margin: "0.5em"
},
icon: {
marginLeft: "0.5em",
marginRight: "0.5em"
},
bold: {
fontWeight: 600
},
dataField: {
display: "flex",
alignItems: "center"
},
mr: {
marginRight: "0.5em"
}
}), yn = p(function({ plugin: s, model: a }) {
const { classes: o } = vn(), t = g.getSession(a), { pluginManager: c } = g.getEnv(a), { runtimePluginDefinitions: i } = c, l = i.some((P) => "url" in P && P.url === s.url), [r, h] = v(!1), { adminMode: T, jbrowse: k } = t, { name: j, authors: D, description: R } = s;
return u(X, { variant: "outlined", className: o.card, children: [u(Z, { children: [n(m, { variant: "h5", children: n(w.ExternalLink, { href: `${s.location}#readme`, children: s.name }) }), u("div", { className: o.dataField, children: [n(fn, { className: o.mr }), n(m, { children: D.join(", ") })] }), n(m, { className: o.bold, children: "Description:" }), n(m, { children: R })] }), n(N, { children: n(A, { variant: "contained", disabled: l || r, startIcon: l ? n(hn, {}) : n(q, {}), onClick: () => {
T ? k.addPlugin(s) : E.isSessionWithSessionPlugins(t) ? t.addSessionPlugin(s) : t.notify("No way to install plugin"), h(!0);
}, children: l ? "Installed" : "Install" }) })] }, j);
}), Cn = x(() => import("./AddCustomPluginDialog-jBZXoI8s.js")), Pn = y()((e) => ({
expandIcon: {
color: e.palette.tertiary.contrastText
},
adminBadge: {
borderRadius: 3,
backgroundColor: e.palette.quaternary.main,
padding: "1em",
display: "flex",
alignContent: "center"
},
customPluginButton: {
margin: "1em auto",
display: "flex"
},
mr: {
marginRight: "0.3em"
},
m: {
margin: "1em"
}
})), Tn = p(function({ model: e }) {
const { classes: s } = Pn(), { plugins: a, error: o } = ln(), { filterText: t } = e, c = g.getSession(e), { adminMode: i } = c, { pluginManager: l } = _(e);
return u("div", { children: [i && u(B, { children: [!g.isElectron && u("div", { className: s.adminBadge, children: [n(on, { className: s.mr }), u(m, { children: ["You are using the ", n("code", { children: "admin-server" }), ". Any changes you make will be saved to your configuration file. You also have the ability to add custom plugins that are not in the store."] })] }), n(A, { className: s.customPluginButton, variant: "contained", onClick: () => {
c.queueDialog((r) => [
Cn,
{
model: e,
onClose: r
}
]);
}, children: "Add custom plugin" })] }), n(G, { label: "Filter plugins", value: t, onChange: (r) => {
e.setFilterText(r.target.value);
}, fullWidth: !0, slotProps: {
input: {
endAdornment: n(Y, { position: "end", children: n(C, { onClick: () => {
e.clearFilterText();
}, children: n(J, {}) }) })
}
} }), u(b, { defaultExpanded: !0, children: [n(I, { expandIcon: n(S, { className: s.expandIcon }), children: n(m, { variant: "h5", children: "Installed plugins" }) }), n("div", { className: s.m, children: n(pn, { pluginManager: l, model: e }) })] }), u(b, { defaultExpanded: !0, children: [n(I, { expandIcon: n(S, { className: s.expandIcon }), children: n(m, { variant: "h5", children: "Available plugins" }) }), o ? n(m, { color: "error", children: `${o}` }) : a ? a.filter((r) => !(g.isElectron && r.cjsUrl) && r.name.toLowerCase().includes(t.toLowerCase())).map((r) => n(yn, { plugin: r, model: e }, r.name)) : n(w.LoadingEllipses, {})] })] });
});
export {
Tn as default
};
//# sourceMappingURL=PluginStoreWidget-CMjlz5EI.js.map