taxonium-component
Version:
React component for exploring large phylogenetic trees in the browser
1,336 lines • 58 kB
JavaScript
import { jsx as p, jsxs as M, Fragment as B } from "react/jsx-runtime";
import * as Je from "react";
import Re, { Component as Xe, createElement as K, useState as N, Suspense as Ye, lazy as j, PureComponent as We, createRef as Ze, useRef as Qe, useMemo as ve, useCallback as et, useEffect as tt } from "react";
import { z as it, A as nt, G as rt, H as at, aC as ae, I as ot, b9 as st, aY as lt, J as Q, b2 as ct, o as E, m as D, u as z, by as dt, cB as ut, cC as X, cD as ft, s as De, X as L, t as ht, a6 as ce, c as pt, bN as gt, a7 as Le, cE as de, cF as A, cG as ue, cH as mt, cI as vt, T as bt } from "./JBrowsePanel-uJIA-L6s.js";
import { c as be, d as U, g as _t } from "./index-dFotuATn.js";
import k from "prop-types";
import { M as _e } from "./MenuItem-D4Mw907e.js";
import { C as St } from "./Clear-Iez73PVU.js";
import { B as fe } from "./Badge-DOFO0p9p.js";
import { S as Ae } from "./SanitizedHTML-BVL8NCSg.js";
import { F as yt } from "./FormControlLabel-CwjOxa71.js";
import { C as Tt } from "./Checkbox-BG4jcGUl.js";
function Ct(e) {
return nt("MuiFab", e);
}
const Se = it("MuiFab", ["root", "primary", "secondary", "extended", "circular", "focusVisible", "disabled", "colorInherit", "sizeSmall", "sizeMedium", "sizeLarge", "info", "error", "warning", "success"]), kt = (e) => {
const {
color: t,
variant: i,
classes: n,
size: a
} = e, o = {
root: ["root", i, `size${ae(a)}`, t === "inherit" ? "colorInherit" : t]
}, s = ot(o, Ct, n);
return {
...n,
// forward the focused, disabled, etc. classes to the ButtonBase
...s
};
}, It = at(st, {
name: "MuiFab",
slot: "Root",
shouldForwardProp: (e) => lt(e) || e === "classes",
overridesResolver: (e, t) => {
const {
ownerState: i
} = e;
return [t.root, t[i.variant], t[`size${ae(i.size)}`], i.color === "inherit" && t.colorInherit, t[ae(i.size)], t[i.color]];
}
})(Q(({
theme: e
}) => {
var t, i;
return {
...e.typography.button,
minHeight: 36,
transition: e.transitions.create(["background-color", "box-shadow", "border-color"], {
duration: e.transitions.duration.short
}),
borderRadius: "50%",
padding: 0,
minWidth: 0,
width: 56,
height: 56,
zIndex: (e.vars || e).zIndex.fab,
boxShadow: (e.vars || e).shadows[6],
"&:active": {
boxShadow: (e.vars || e).shadows[12]
},
color: e.vars ? e.vars.palette.grey[900] : (i = (t = e.palette).getContrastText) == null ? void 0 : i.call(t, e.palette.grey[300]),
backgroundColor: (e.vars || e).palette.grey[300],
"&:hover": {
backgroundColor: (e.vars || e).palette.grey.A100,
// Reset on touch devices, it doesn't add specificity
"@media (hover: none)": {
backgroundColor: (e.vars || e).palette.grey[300]
},
textDecoration: "none"
},
[`&.${Se.focusVisible}`]: {
boxShadow: (e.vars || e).shadows[6]
},
variants: [{
props: {
size: "small"
},
style: {
width: 40,
height: 40
}
}, {
props: {
size: "medium"
},
style: {
width: 48,
height: 48
}
}, {
props: {
variant: "extended"
},
style: {
borderRadius: 48 / 2,
padding: "0 16px",
width: "auto",
minHeight: "auto",
minWidth: 48,
height: 48
}
}, {
props: {
variant: "extended",
size: "small"
},
style: {
width: "auto",
padding: "0 8px",
borderRadius: 34 / 2,
minWidth: 34,
height: 34
}
}, {
props: {
variant: "extended",
size: "medium"
},
style: {
width: "auto",
padding: "0 16px",
borderRadius: 40 / 2,
minWidth: 40,
height: 40
}
}, {
props: {
color: "inherit"
},
style: {
color: "inherit"
}
}]
};
}), Q(({
theme: e
}) => ({
variants: [...Object.entries(e.palette).filter(ct(["dark", "contrastText"])).map(([t]) => ({
props: {
color: t
},
style: {
color: (e.vars || e).palette[t].contrastText,
backgroundColor: (e.vars || e).palette[t].main,
"&:hover": {
backgroundColor: (e.vars || e).palette[t].dark,
// Reset on touch devices, it doesn't add specificity
"@media (hover: none)": {
backgroundColor: (e.vars || e).palette[t].main
}
}
}
}))]
})), Q(({
theme: e
}) => ({
[`&.${Se.disabled}`]: {
color: (e.vars || e).palette.action.disabled,
boxShadow: (e.vars || e).shadows[0],
backgroundColor: (e.vars || e).palette.action.disabledBackground
}
}))), Fe = /* @__PURE__ */ Je.forwardRef(function(t, i) {
const n = rt({
props: t,
name: "MuiFab"
}), {
children: a,
className: o,
color: s = "default",
component: c = "button",
disabled: u = !1,
disableFocusRipple: d = !1,
focusVisibleClassName: g,
size: b = "large",
variant: l = "circular",
...v
} = n, y = {
...n,
color: s,
component: c,
disabled: u,
disableFocusRipple: d,
size: b,
variant: l
}, r = kt(y);
return /* @__PURE__ */ p(It, {
className: be(r.root, o),
component: c,
disabled: u,
focusRipple: !d,
focusVisibleClassName: be(r.focusVisible, g),
ownerState: y,
ref: i,
...v,
classes: r,
children: a
});
});
U.process.env.NODE_ENV !== "production" && (Fe.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: k.node,
/**
* Override or extend the styles applied to the component.
*/
classes: k.object,
/**
* @ignore
*/
className: k.string,
/**
* The color of the component.
* It supports both default and custom theme colors, which can be added as shown in the
* [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
* @default 'default'
*/
color: k.oneOfType([k.oneOf(["default", "error", "info", "inherit", "primary", "secondary", "success", "warning"]), k.string]),
/**
* The component used for the root node.
* Either a string to use a HTML element or a component.
*/
component: k.elementType,
/**
* If `true`, the component is disabled.
* @default false
*/
disabled: k.bool,
/**
* If `true`, the keyboard focus ripple is disabled.
* @default false
*/
disableFocusRipple: k.bool,
/**
* If `true`, the ripple effect is disabled.
*/
disableRipple: k.bool,
/**
* @ignore
*/
focusVisibleClassName: k.string,
/**
* The URL to link to when the button is clicked.
* If defined, an `a` element will be used as the root node.
*/
href: k.string,
/**
* The size of the component.
* `small` is equivalent to the dense button styling.
* @default 'large'
*/
size: k.oneOfType([k.oneOf(["small", "medium", "large"]), k.string]),
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx: k.oneOfType([k.arrayOf(k.oneOfType([k.func, k.object, k.bool])), k.func, k.object]),
/**
* The variant to use.
* @default 'circular'
*/
variant: k.oneOfType([k.oneOf(["circular", "extended"]), k.string])
});
let x;
typeof window < "u" ? x = window : typeof self < "u" ? x = self : x = U.global;
let oe = null, se = null;
const ye = 20, ee = x.clearTimeout, Te = x.setTimeout, te = x.cancelAnimationFrame || x.mozCancelAnimationFrame || x.webkitCancelAnimationFrame, Ce = x.requestAnimationFrame || x.mozRequestAnimationFrame || x.webkitRequestAnimationFrame;
te == null || Ce == null ? (oe = ee, se = function(t) {
return Te(t, ye);
}) : (oe = function([t, i]) {
te(t), ee(i);
}, se = function(t) {
const i = Ce(function() {
ee(n), t();
}), n = Te(function() {
te(i), t();
}, ye);
return [i, n];
});
function zt(e) {
let t, i, n, a, o, s, c;
const u = typeof document < "u" && document.attachEvent;
if (!u) {
s = function(h) {
const _ = h.__resizeTriggers__, m = _.firstElementChild, T = _.lastElementChild, S = m.firstElementChild;
T.scrollLeft = T.scrollWidth, T.scrollTop = T.scrollHeight, S.style.width = m.offsetWidth + 1 + "px", S.style.height = m.offsetHeight + 1 + "px", m.scrollLeft = m.scrollWidth, m.scrollTop = m.scrollHeight;
}, o = function(h) {
return h.offsetWidth !== h.__resizeLast__.width || h.offsetHeight !== h.__resizeLast__.height;
}, c = function(h) {
if (h.target.className && typeof h.target.className.indexOf == "function" && h.target.className.indexOf("contract-trigger") < 0 && h.target.className.indexOf("expand-trigger") < 0)
return;
const _ = this;
s(this), this.__resizeRAF__ && oe(this.__resizeRAF__), this.__resizeRAF__ = se(function() {
o(_) && (_.__resizeLast__.width = _.offsetWidth, _.__resizeLast__.height = _.offsetHeight, _.__resizeListeners__.forEach(function(S) {
S.call(_, h);
}));
});
};
let l = !1, v = "";
n = "animationstart";
const y = "Webkit Moz O ms".split(" ");
let r = "webkitAnimationStart animationstart oAnimationStart MSAnimationStart".split(" "), f = "";
{
const h = document.createElement("fakeelement");
if (h.style.animationName !== void 0 && (l = !0), l === !1) {
for (let _ = 0; _ < y.length; _++)
if (h.style[y[_] + "AnimationName"] !== void 0) {
f = y[_], v = "-" + f.toLowerCase() + "-", n = r[_], l = !0;
break;
}
}
}
i = "resizeanim", t = "@" + v + "keyframes " + i + " { from { opacity: 0; } to { opacity: 0; } } ", a = v + "animation: 1ms " + i + "; ";
}
const d = function(l) {
if (!l.getElementById("detectElementResize")) {
const v = (t || "") + ".resize-triggers { " + (a || "") + 'visibility: hidden; opacity: 0; } .resize-triggers, .resize-triggers > div, .contract-trigger:before { content: " "; display: block; position: absolute; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden; z-index: -1; } .resize-triggers > div { background: #eee; overflow: auto; } .contract-trigger:before { width: 200%; height: 200%; }', y = l.head || l.getElementsByTagName("head")[0], r = l.createElement("style");
r.id = "detectElementResize", r.type = "text/css", e != null && r.setAttribute("nonce", e), r.styleSheet ? r.styleSheet.cssText = v : r.appendChild(l.createTextNode(v)), y.appendChild(r);
}
};
return {
addResizeListener: function(l, v) {
if (u)
l.attachEvent("onresize", v);
else {
if (!l.__resizeTriggers__) {
const y = l.ownerDocument, r = x.getComputedStyle(l);
r && r.position === "static" && (l.style.position = "relative"), d(y), l.__resizeLast__ = {}, l.__resizeListeners__ = [], (l.__resizeTriggers__ = y.createElement("div")).className = "resize-triggers";
const f = y.createElement("div");
f.className = "expand-trigger", f.appendChild(y.createElement("div"));
const h = y.createElement("div");
h.className = "contract-trigger", l.__resizeTriggers__.appendChild(f), l.__resizeTriggers__.appendChild(h), l.appendChild(l.__resizeTriggers__), s(l), l.addEventListener("scroll", c, !0), n && (l.__resizeTriggers__.__animationListener__ = function(m) {
m.animationName === i && s(l);
}, l.__resizeTriggers__.addEventListener(n, l.__resizeTriggers__.__animationListener__));
}
l.__resizeListeners__.push(v);
}
},
removeResizeListener: function(l, v) {
if (u)
l.detachEvent("onresize", v);
else if (l.__resizeListeners__.splice(l.__resizeListeners__.indexOf(v), 1), !l.__resizeListeners__.length) {
l.removeEventListener("scroll", c, !0), l.__resizeTriggers__.__animationListener__ && (l.__resizeTriggers__.removeEventListener(n, l.__resizeTriggers__.__animationListener__), l.__resizeTriggers__.__animationListener__ = null);
try {
l.__resizeTriggers__ = !l.removeChild(l.__resizeTriggers__);
} catch {
}
}
}
};
}
class wt extends Xe {
constructor(...t) {
super(...t), this.state = {
height: this.props.defaultHeight || 0,
width: this.props.defaultWidth || 0
}, this._autoSizer = null, this._detectElementResize = null, this._didLogDeprecationWarning = !1, this._parentNode = null, this._resizeObserver = null, this._timeoutId = null, this._onResize = () => {
this._timeoutId = null;
const {
disableHeight: i,
disableWidth: n,
onResize: a
} = this.props;
if (this._parentNode) {
const o = window.getComputedStyle(this._parentNode) || {}, s = parseFloat(o.paddingLeft || "0"), c = parseFloat(o.paddingRight || "0"), u = parseFloat(o.paddingTop || "0"), d = parseFloat(o.paddingBottom || "0"), g = this._parentNode.getBoundingClientRect(), b = g.height - u - d, l = g.width - s - c;
if (!i && this.state.height !== b || !n && this.state.width !== l) {
this.setState({
height: b,
width: l
});
const v = () => {
this._didLogDeprecationWarning || (this._didLogDeprecationWarning = !0, console.warn("scaledWidth and scaledHeight parameters have been deprecated; use width and height instead"));
};
typeof a == "function" && a({
height: b,
width: l,
// TODO Remove these params in the next major release
get scaledHeight() {
return v(), b;
},
get scaledWidth() {
return v(), l;
}
});
}
}
}, this._setRef = (i) => {
this._autoSizer = i;
};
}
componentDidMount() {
const {
nonce: t
} = this.props, i = this._autoSizer ? this._autoSizer.parentNode : null;
if (i != null && i.ownerDocument && i.ownerDocument.defaultView && i instanceof i.ownerDocument.defaultView.HTMLElement) {
this._parentNode = i;
const n = i.ownerDocument.defaultView.ResizeObserver;
n != null ? (this._resizeObserver = new n(() => {
this._timeoutId = setTimeout(this._onResize, 0);
}), this._resizeObserver.observe(i)) : (this._detectElementResize = zt(t), this._detectElementResize.addResizeListener(i, this._onResize)), this._onResize();
}
}
componentWillUnmount() {
this._parentNode && (this._detectElementResize && this._detectElementResize.removeResizeListener(this._parentNode, this._onResize), this._timeoutId !== null && clearTimeout(this._timeoutId), this._resizeObserver && this._resizeObserver.disconnect());
}
render() {
const {
children: t,
defaultHeight: i,
defaultWidth: n,
disableHeight: a = !1,
disableWidth: o = !1,
doNotBailOutOnEmptyChildren: s = !1,
nonce: c,
onResize: u,
style: d = {},
tagName: g = "div",
...b
} = this.props, {
height: l,
width: v
} = this.state, y = {
overflow: "visible"
}, r = {};
let f = !1;
return a || (l === 0 && (f = !0), y.height = 0, r.height = l, r.scaledHeight = l), o || (v === 0 && (f = !0), y.width = 0, r.width = v, r.scaledWidth = v), s && (f = !1), K(g, {
ref: this._setRef,
style: {
...y,
...d
},
...b
}, !f && t(r));
}
}
const xt = D()((e) => ({
fab: {
position: "absolute",
bottom: e.spacing(6),
right: e.spacing(6)
}
})), Mt = E(function({ model: e }) {
const { classes: t } = xt(), i = z.getSession(e), [n, a] = N(null);
function o() {
a(null);
}
const s = z.isSessionModelWithConnections(i), c = z.isSessionWithAddTracks(i);
return c || s ? M(B, { children: [p(Fe, { color: "secondary", className: t.fab, onClick: (u) => {
a(u.currentTarget);
}, children: p(dt, {}) }), M(ut, { anchorEl: n, open: !!n, onClose: () => {
a(null);
}, children: [s ? p(_e, { onClick: () => {
o(), z.isSessionModelWithWidgets(i) && i.showWidget(i.addWidget("AddConnectionWidget", "addConnectionWidget"));
}, children: "Add connection" }) : null, c ? p(_e, { onClick: () => {
o(), z.isSessionModelWithWidgets(i) && i.showWidget(i.addWidget("AddTrackWidget", "addTrackWidget", {
view: e.view.id
}));
}, children: "Add track" }) : null] })] }) : null;
}), Ot = j(() => import("./FacetedDialog-cGGly596.js")), Et = j(() => import("./CloseConnectionDialog-Dc4qB9Gr.js")), Nt = j(() => import("./DeleteConnectionDialog-6OFHNCc4.js")), Rt = j(() => import("./ManageConnectionsDialog-PRz5vWBG.js")), Wt = j(() => import("./ToggleConnectionsDialog-oafDg6aH.js")), Dt = E(function({ model: e }) {
const t = z.getSession(e), [i, n] = N(), [a, o] = N(), [s, c] = N(!1), [u, d] = N(!1), [g, b] = N(!1);
function l(v, y) {
var r;
const f = De.readConfObject(v, "name"), h = (r = t.prepareToBreakConnection) === null || r === void 0 ? void 0 : r.call(t, v);
if (h) {
const [_, m] = h;
Object.keys(m).length > 0 ? n({
connectionConf: v,
safelyBreakConnection: _,
dereferenceTypeCount: m,
name: f
}) : _();
}
y && o({ name: f, connectionConf: v });
}
return M(B, { children: [p(X, { menuItems: [
{
label: "Open faceted track selector",
onClick: () => {
b(!0);
}
},
...z.isSessionWithAddTracks(t) ? [
{
label: "Add track...",
onClick: () => {
z.isSessionModelWithWidgets(t) && t.showWidget(t.addWidget("AddTrackWidget", "addTrackWidget", {
view: e.view.id
}));
}
}
] : [],
{
label: "Connections...",
subMenu: [
...z.isSessionModelWithConnections(t) ? [
{
label: "Turn on/off connections...",
onClick: () => {
c(!0);
}
}
] : [],
...z.isSessionModelWithConnectionEditing(t) ? [
{
label: "Add connection...",
onClick: () => {
z.isSessionModelWithWidgets(t) && t.showWidget(t.addWidget("AddConnectionWidget", "addConnectionWidget"));
}
},
{
label: "Delete connections...",
onClick: () => {
d(!0);
}
}
] : []
]
},
{
label: "Sort...",
type: "subMenu",
subMenu: [
{
label: "Sort tracks by name",
type: "checkbox",
checked: e.activeSortTrackNames,
onClick: () => {
e.setSortTrackNames(!e.activeSortTrackNames);
}
},
{
label: "Sort categories by name",
type: "checkbox",
checked: e.activeSortCategories,
onClick: () => {
e.setSortCategories(!e.activeSortCategories);
}
}
]
},
{
label: "Collapse...",
type: "subMenu",
subMenu: [
...e.hasAnySubcategories ? [
{
label: "Collapse subcategories",
onClick: () => {
e.collapseSubCategories();
}
}
] : [],
{
label: "Collapse top-level categories",
onClick: () => {
e.collapseTopLevelCategories();
}
},
{
label: "Expand all categories",
onClick: () => {
e.expandAllCategories();
}
}
]
}
], children: p(ft, {}) }), M(Ye, { fallback: null, children: [i ? p(Et, { modalInfo: i, onClose: () => {
n(void 0);
} }) : null, a ? p(Nt, { handleClose: () => {
o(void 0);
}, deleteDialogDetails: a, session: t }) : null, u ? p(Rt, { handleClose: () => {
d(!1);
}, breakConnection: l, session: t }) : null, s ? p(Wt, { handleClose: () => {
c(!1);
}, session: t, breakConnection: l }) : null, g ? p(Ot, { handleClose: () => {
b(!1);
}, model: e }) : null] })] });
}), Lt = L(/* @__PURE__ */ p("path", {
d: "M7 18c-1.1 0-1.99.9-1.99 2S5.9 22 7 22s2-.9 2-2-.9-2-2-2M1 2v2h2l3.6 7.59-1.35 2.45c-.16.28-.25.61-.25.96 0 1.1.9 2 2 2h12v-2H7.42c-.14 0-.25-.11-.25-.25l.03-.12.9-1.63h7.45c.75 0 1.41-.41 1.75-1.03l3.58-6.49c.08-.14.12-.31.12-.48 0-.55-.45-1-1-1H5.21l-.94-2zm16 16c-1.1 0-1.99.9-1.99 2s.89 2 1.99 2 2-.9 2-2-.9-2-2-2"
}), "ShoppingCart"), At = E(function({ model: e }) {
const t = z.getSession(e), { selection: i } = e, { pluginManager: n } = z.getEnv(e), { adminMode: a, sessionTracks: o } = t, s = new Set(o == null ? void 0 : o.map((d) => d.trackId)), c = (d) => a || s.has(d), u = n.evaluateExtensionPoint("TrackSelector-multiTrackMenuItems", [], { session: t });
return i.length ? p(X, { menuItems: [
{
label: "Clear selection",
onClick: () => {
e.clearSelection();
}
},
...i.every((d) => c(d.trackId)) ? [
{
label: "Delete tracks",
onClick: () => {
var d;
for (const g of i)
(d = t.deleteTrackConf) === null || d === void 0 || d.call(t, g);
}
}
] : [],
...u.map((d) => ({
...d,
..."onClick" in d ? {
onClick: () => {
d.onClick(e);
}
} : {}
}))
], children: p(fe, { badgeContent: i.length, color: "primary", children: p(Lt, {}) }) }) : null;
}), Ft = L(/* @__PURE__ */ p("path", {
d: "M12 17.27 18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z"
}), "Grade"), He = L(/* @__PURE__ */ p("path", {
d: "M6 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2m12 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2m-6 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2"
}), "MoreHoriz"), Ht = L(/* @__PURE__ */ p("path", {
d: "M12 17.27 18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z"
}), "Star"), $t = L(/* @__PURE__ */ p("path", {
d: "m22 9.24-7.19-.62L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21 12 17.27 18.18 21l-1.63-7.03zM12 15.4l-3.76 2.27 1-4.28-3.32-2.88 4.38-.38L12 6.1l1.71 4.04 4.38.38-3.32 2.88 1 4.28z"
}), "StarBorderOutlined"), Pt = D()({
cascadingStyle: {
padding: 0
}
}), $e = function({ id: e, trackId: t, stopPropagation: i, model: n, setOpen: a, conf: o }) {
var s, c;
const { classes: u } = Pt();
return p(X, { className: u.cascadingStyle, stopPropagation: i, setOpen: a, "data-testid": `htsTrackEntryMenu-${e}`, menuItems: [
...((c = (s = z.getSession(n)).getTrackActionMenuItems) === null || c === void 0 ? void 0 : c.call(s, o)) || [],
n.isFavorite(t) ? {
label: "Remove from favorites",
onClick: () => {
n.removeFromFavorites(t);
},
icon: $t
} : {
label: "Add to favorites",
onClick: () => {
n.addToFavorites(t);
},
icon: Ht
},
{
label: "Add to selection",
onClick: () => {
n.addToSelection([o]);
}
},
...n.isSelected(o) ? [
{
label: "Remove from selection",
onClick: () => {
n.removeFromSelection([o]);
}
}
] : []
], children: p(He, {}) });
}, Pe = E(function({ model: e, tracks: t, extraMenuItems: i, children: n, onClick: a }) {
const { view: o } = e, [s, c] = N(!1), u = z.getSession(e);
return o ? p(X, { closeAfterItemClick: !1, onClick: a, menuItems: [
...t.map((d) => ({
type: "checkbox",
label: M(B, { children: [p(Ae, { html: ht.getTrackName(d, u) }), " ", p($e, { id: d.trackId, trackId: d.trackId, model: e, conf: d, setOpen: c, stopPropagation: !0 })] }),
checked: o.tracks.some((g) => g.configuration === d),
onClick: () => {
s || e.view.toggleTrack(d.trackId) && e.addToRecentlyUsed(d.trackId);
}
})),
...i
], children: n }) : null;
}), Bt = D()({
smallBadge: {
height: 14
},
margin: {
marginRight: 10
}
}), Ut = E(function({ model: e }) {
const { classes: t } = Bt(), { view: i, favoriteTracks: n } = e;
return i ? p(Pe, { onClick: () => {
e.setFavoritesCounter(0);
}, tracks: n, model: e, extraMenuItems: n.length ? [
{ type: "divider" },
{
label: "Clear favorites",
onClick: () => {
e.clearFavorites();
}
}
] : [
{
label: "No favorite tracks yet",
onClick: () => {
}
}
], children: p(ce, { title: "Favorite tracks", children: p(fe, { classes: { badge: t.smallBadge }, color: "secondary", anchorOrigin: {
vertical: "bottom",
horizontal: "right"
}, className: t.margin, badgeContent: e.favoritesCounter, children: p(Ft, {}) }) }) }) : null;
}), Vt = L(/* @__PURE__ */ p("path", {
d: "M13 3c-4.97 0-9 4.03-9 9H1l3.89 3.89.07.14L9 12H6c0-3.87 3.13-7 7-7s7 3.13 7 7-3.13 7-7 7c-1.93 0-3.68-.79-4.94-2.06l-1.42 1.42C8.27 19.99 10.51 21 13 21c4.97 0 9-4.03 9-9s-4.03-9-9-9m-1 5v5l4.28 2.54.72-1.21-3.5-2.08V8z"
}), "History"), qt = D()({
smallBadge: {
height: 14
}
}), jt = E(function({ model: e }) {
const { classes: t } = qt(), { view: i, recentlyUsedCounter: n, recentlyUsedTracks: a } = e;
return i ? p(Pe, { onClick: () => {
e.setRecentlyUsedCounter(0);
}, model: e, tracks: a, extraMenuItems: a.length ? [
{ type: "divider" },
{
label: "Clear recently used",
onClick: () => {
e.clearRecentlyUsed();
}
}
] : [
{
label: "No recently used",
onClick: () => {
}
}
], children: p(ce, { title: "Recently used tracks", children: p(fe, { classes: { badge: t.smallBadge }, anchorOrigin: {
vertical: "bottom",
horizontal: "right"
}, color: "secondary", badgeContent: n, children: p(Vt, {}) }) }) }) : null;
}), Kt = D()((e) => ({
searchBox: {
margin: e.spacing(2)
}
})), Gt = E(function({ model: e }) {
const { filterText: t } = e, { classes: i } = Kt();
return p(pt, { className: i.searchBox, label: "Filter tracks", value: t, onChange: (n) => {
e.setFilterText(n.target.value);
}, fullWidth: !0, slotProps: {
input: {
endAdornment: p(gt, { position: "end", children: p(Le, { onClick: () => {
e.clearFilterText();
}, children: p(St, {}) }) })
}
} });
}), Jt = E(function({ model: e, setHeaderHeight: t }) {
return p("div", { ref: (i) => {
t((i == null ? void 0 : i.getBoundingClientRect().height) || 0);
}, "data-testid": "hierarchical_track_selector", children: M("div", { style: { display: "flex" }, children: [p(Dt, { model: e }), p(At, { model: e }), p(Gt, { model: e }), p(jt, { model: e }), p(Ut, { model: e })] }) });
});
var ke = Number.isNaN || function(t) {
return typeof t == "number" && t !== t;
};
function Xt(e, t) {
return !!(e === t || ke(e) && ke(t));
}
function Yt(e, t) {
if (e.length !== t.length)
return !1;
for (var i = 0; i < e.length; i++)
if (!Xt(e[i], t[i]))
return !1;
return !0;
}
function ie(e, t) {
t === void 0 && (t = Yt);
var i, n = [], a, o = !1;
function s() {
for (var c = [], u = 0; u < arguments.length; u++)
c[u] = arguments[u];
return o && i === this && t(c, n) || (a = e.apply(this, c), o = !0, i = this, n = c), a;
}
return s;
}
var Zt = typeof performance == "object" && typeof performance.now == "function", Ie = Zt ? function() {
return performance.now();
} : function() {
return Date.now();
};
function ze(e) {
cancelAnimationFrame(e.id);
}
function Qt(e, t) {
var i = Ie();
function n() {
Ie() - i >= t ? e.call(null) : a.id = requestAnimationFrame(n);
}
var a = {
id: requestAnimationFrame(n)
};
return a;
}
var ne = -1;
function we(e) {
if (e === void 0 && (e = !1), ne === -1 || e) {
var t = document.createElement("div"), i = t.style;
i.width = "50px", i.height = "50px", i.overflow = "scroll", document.body.appendChild(t), ne = t.offsetWidth - t.clientWidth, document.body.removeChild(t);
}
return ne;
}
var $ = null;
function xe(e) {
if (e === void 0 && (e = !1), $ === null || e) {
var t = document.createElement("div"), i = t.style;
i.width = "50px", i.height = "50px", i.overflow = "scroll", i.direction = "rtl";
var n = document.createElement("div"), a = n.style;
return a.width = "100px", a.height = "100px", t.appendChild(n), document.body.appendChild(t), t.scrollLeft > 0 ? $ = "positive-descending" : (t.scrollLeft = 1, t.scrollLeft === 0 ? $ = "negative" : $ = "positive-ascending"), document.body.removeChild(t), $;
}
return $;
}
U.process.env.NODE_ENV;
var ei = 150, ti = function(t, i) {
return t;
}, G = null, J = null;
U.process.env.NODE_ENV !== "production" && typeof window < "u" && typeof window.WeakSet < "u" && (G = /* @__PURE__ */ new WeakSet(), J = /* @__PURE__ */ new WeakSet());
function ii(e) {
var t, i = e.getItemOffset, n = e.getEstimatedTotalSize, a = e.getItemSize, o = e.getOffsetForIndexAndAlignment, s = e.getStartIndexForOffset, c = e.getStopIndexForStartIndex, u = e.initInstanceProps, d = e.shouldResetStyleCacheOnItemSizeChange, g = e.validateProps;
return t = /* @__PURE__ */ function(b) {
de(l, b);
function l(y) {
var r;
return r = b.call(this, y) || this, r._instanceProps = u(r.props, A(r)), r._outerRef = void 0, r._resetIsScrollingTimeoutId = null, r.state = {
instance: A(r),
isScrolling: !1,
scrollDirection: "forward",
scrollOffset: typeof r.props.initialScrollOffset == "number" ? r.props.initialScrollOffset : 0,
scrollUpdateWasRequested: !1
}, r._callOnItemsRendered = void 0, r._callOnItemsRendered = ie(function(f, h, _, m) {
return r.props.onItemsRendered({
overscanStartIndex: f,
overscanStopIndex: h,
visibleStartIndex: _,
visibleStopIndex: m
});
}), r._callOnScroll = void 0, r._callOnScroll = ie(function(f, h, _) {
return r.props.onScroll({
scrollDirection: f,
scrollOffset: h,
scrollUpdateWasRequested: _
});
}), r._getItemStyle = void 0, r._getItemStyle = function(f) {
var h = r.props, _ = h.direction, m = h.itemSize, T = h.layout, S = r._getItemStyleCache(d && m, d && T, d && _), C;
if (S.hasOwnProperty(f))
C = S[f];
else {
var I = i(r.props, f, r._instanceProps), O = a(r.props, f, r._instanceProps), w = _ === "horizontal" || T === "horizontal", R = _ === "rtl", F = w ? I : 0;
S[f] = C = {
position: "absolute",
left: R ? void 0 : F,
right: R ? F : void 0,
top: w ? 0 : I,
height: w ? "100%" : O,
width: w ? O : "100%"
};
}
return C;
}, r._getItemStyleCache = void 0, r._getItemStyleCache = ie(function(f, h, _) {
return {};
}), r._onScrollHorizontal = function(f) {
var h = f.currentTarget, _ = h.clientWidth, m = h.scrollLeft, T = h.scrollWidth;
r.setState(function(S) {
if (S.scrollOffset === m)
return null;
var C = r.props.direction, I = m;
if (C === "rtl")
switch (xe()) {
case "negative":
I = -m;
break;
case "positive-descending":
I = T - _ - m;
break;
}
return I = Math.max(0, Math.min(I, T - _)), {
isScrolling: !0,
scrollDirection: S.scrollOffset < I ? "forward" : "backward",
scrollOffset: I,
scrollUpdateWasRequested: !1
};
}, r._resetIsScrollingDebounced);
}, r._onScrollVertical = function(f) {
var h = f.currentTarget, _ = h.clientHeight, m = h.scrollHeight, T = h.scrollTop;
r.setState(function(S) {
if (S.scrollOffset === T)
return null;
var C = Math.max(0, Math.min(T, m - _));
return {
isScrolling: !0,
scrollDirection: S.scrollOffset < C ? "forward" : "backward",
scrollOffset: C,
scrollUpdateWasRequested: !1
};
}, r._resetIsScrollingDebounced);
}, r._outerRefSetter = function(f) {
var h = r.props.outerRef;
r._outerRef = f, typeof h == "function" ? h(f) : h != null && typeof h == "object" && h.hasOwnProperty("current") && (h.current = f);
}, r._resetIsScrollingDebounced = function() {
r._resetIsScrollingTimeoutId !== null && ze(r._resetIsScrollingTimeoutId), r._resetIsScrollingTimeoutId = Qt(r._resetIsScrolling, ei);
}, r._resetIsScrolling = function() {
r._resetIsScrollingTimeoutId = null, r.setState({
isScrolling: !1
}, function() {
r._getItemStyleCache(-1, null);
});
}, r;
}
l.getDerivedStateFromProps = function(r, f) {
return ni(r, f), g(r), null;
};
var v = l.prototype;
return v.scrollTo = function(r) {
r = Math.max(0, r), this.setState(function(f) {
return f.scrollOffset === r ? null : {
scrollDirection: f.scrollOffset < r ? "forward" : "backward",
scrollOffset: r,
scrollUpdateWasRequested: !0
};
}, this._resetIsScrollingDebounced);
}, v.scrollToItem = function(r, f) {
f === void 0 && (f = "auto");
var h = this.props, _ = h.itemCount, m = h.layout, T = this.state.scrollOffset;
r = Math.max(0, Math.min(r, _ - 1));
var S = 0;
if (this._outerRef) {
var C = this._outerRef;
m === "vertical" ? S = C.scrollWidth > C.clientWidth ? we() : 0 : S = C.scrollHeight > C.clientHeight ? we() : 0;
}
this.scrollTo(o(this.props, r, f, T, this._instanceProps, S));
}, v.componentDidMount = function() {
var r = this.props, f = r.direction, h = r.initialScrollOffset, _ = r.layout;
if (typeof h == "number" && this._outerRef != null) {
var m = this._outerRef;
f === "horizontal" || _ === "horizontal" ? m.scrollLeft = h : m.scrollTop = h;
}
this._callPropsCallbacks();
}, v.componentDidUpdate = function() {
var r = this.props, f = r.direction, h = r.layout, _ = this.state, m = _.scrollOffset, T = _.scrollUpdateWasRequested;
if (T && this._outerRef != null) {
var S = this._outerRef;
if (f === "horizontal" || h === "horizontal")
if (f === "rtl")
switch (xe()) {
case "negative":
S.scrollLeft = -m;
break;
case "positive-ascending":
S.scrollLeft = m;
break;
default:
var C = S.clientWidth, I = S.scrollWidth;
S.scrollLeft = I - C - m;
break;
}
else
S.scrollLeft = m;
else
S.scrollTop = m;
}
this._callPropsCallbacks();
}, v.componentWillUnmount = function() {
this._resetIsScrollingTimeoutId !== null && ze(this._resetIsScrollingTimeoutId);
}, v.render = function() {
var r = this.props, f = r.children, h = r.className, _ = r.direction, m = r.height, T = r.innerRef, S = r.innerElementType, C = r.innerTagName, I = r.itemCount, O = r.itemData, w = r.itemKey, R = w === void 0 ? ti : w, F = r.layout, Y = r.outerElementType, H = r.outerTagName, W = r.style, Ve = r.useIsScrolling, qe = r.width, he = this.state.isScrolling, Z = _ === "horizontal" || F === "horizontal", je = Z ? this._onScrollHorizontal : this._onScrollVertical, pe = this._getRangeToRender(), Ke = pe[0], Ge = pe[1], ge = [];
if (I > 0)
for (var V = Ke; V <= Ge; V++)
ge.push(K(f, {
data: O,
key: R(V, O),
index: V,
isScrolling: Ve ? he : void 0,
style: this._getItemStyle(V)
}));
var me = n(this.props, this._instanceProps);
return K(Y || H || "div", {
className: h,
onScroll: je,
ref: this._outerRefSetter,
style: ue({
position: "relative",
height: m,
width: qe,
overflow: "auto",
WebkitOverflowScrolling: "touch",
willChange: "transform",
direction: _
}, W)
}, K(S || C || "div", {
children: ge,
ref: T,
style: {
height: Z ? "100%" : me,
pointerEvents: he ? "none" : void 0,
width: Z ? me : "100%"
}
}));
}, v._callPropsCallbacks = function() {
if (typeof this.props.onItemsRendered == "function") {
var r = this.props.itemCount;
if (r > 0) {
var f = this._getRangeToRender(), h = f[0], _ = f[1], m = f[2], T = f[3];
this._callOnItemsRendered(h, _, m, T);
}
}
if (typeof this.props.onScroll == "function") {
var S = this.state, C = S.scrollDirection, I = S.scrollOffset, O = S.scrollUpdateWasRequested;
this._callOnScroll(C, I, O);
}
}, v._getRangeToRender = function() {
var r = this.props, f = r.itemCount, h = r.overscanCount, _ = this.state, m = _.isScrolling, T = _.scrollDirection, S = _.scrollOffset;
if (f === 0)
return [0, 0, 0, 0];
var C = s(this.props, S, this._instanceProps), I = c(this.props, C, S, this._instanceProps), O = !m || T === "backward" ? Math.max(1, h) : 1, w = !m || T === "forward" ? Math.max(1, h) : 1;
return [Math.max(0, C - O), Math.max(0, Math.min(f - 1, I + w)), C, I];
}, l;
}(We), t.defaultProps = {
direction: "ltr",
itemData: void 0,
layout: "vertical",
overscanCount: 2,
useIsScrolling: !1
}, t;
}
var ni = function(t, i) {
var n = t.children, a = t.direction, o = t.height, s = t.layout, c = t.innerTagName, u = t.outerTagName, d = t.width, g = i.instance;
if (U.process.env.NODE_ENV !== "production") {
(c != null || u != null) && J && !J.has(g) && (J.add(g), console.warn("The innerTagName and outerTagName props have been deprecated. Please use the innerElementType and outerElementType props instead."));
var b = a === "horizontal" || s === "horizontal";
switch (a) {
case "horizontal":
case "vertical":
G && !G.has(g) && (G.add(g), console.warn('The direction prop should be either "ltr" (default) or "rtl". Please use the layout prop to specify "vertical" (default) or "horizontal" orientation.'));
break;
case "ltr":
case "rtl":
break;
default:
throw Error('An invalid "direction" prop has been specified. Value should be either "ltr" or "rtl". ' + ('"' + a + '" was specified.'));
}
switch (s) {
case "horizontal":
case "vertical":
break;
default:
throw Error('An invalid "layout" prop has been specified. Value should be either "horizontal" or "vertical". ' + ('"' + s + '" was specified.'));
}
if (n == null)
throw Error('An invalid "children" prop has been specified. Value should be a React component. ' + ('"' + (n === null ? "null" : typeof n) + '" was specified.'));
if (b && typeof d != "number")
throw Error('An invalid "width" prop has been specified. Horizontal lists must specify a number for width. ' + ('"' + (d === null ? "null" : typeof d) + '" was specified.'));
if (!b && typeof o != "number")
throw Error('An invalid "height" prop has been specified. Vertical lists must specify a number for height. ' + ('"' + (o === null ? "null" : typeof o) + '" was specified.'));
}
}, ri = 50, P = function(t, i, n) {
var a = t, o = a.itemSize, s = n.itemMetadataMap, c = n.lastMeasuredIndex;
if (i > c) {
var u = 0;
if (c >= 0) {
var d = s[c];
u = d.offset + d.size;
}
for (var g = c + 1; g <= i; g++) {
var b = o(g);
s[g] = {
offset: u,
size: b
}, u += b;
}
n.lastMeasuredIndex = i;
}
return s[i];
}, ai = function(t, i, n) {
var a = i.itemMetadataMap, o = i.lastMeasuredIndex, s = o > 0 ? a[o].offset : 0;
return s >= n ? Be(t, i, o, 0, n) : oi(t, i, Math.max(0, o), n);
}, Be = function(t, i, n, a, o) {
for (; a <= n; ) {
var s = a + Math.floor((n - a) / 2), c = P(t, s, i).offset;
if (c === o)
return s;
c < o ? a = s + 1 : c > o && (n = s - 1);
}
return a > 0 ? a - 1 : 0;
}, oi = function(t, i, n, a) {
for (var o = t.itemCount, s = 1; n < o && P(t, n, i).offset < a; )
n += s, s *= 2;
return Be(t, i, Math.min(n, o - 1), Math.floor(n / 2), a);
}, Me = function(t, i) {
var n = t.itemCount, a = i.itemMetadataMap, o = i.estimatedItemSize, s = i.lastMeasuredIndex, c = 0;
if (s >= n && (s = n - 1), s >= 0) {
var u = a[s];
c = u.offset + u.size;
}
var d = n - s - 1, g = d * o;
return c + g;
}, si = /* @__PURE__ */ ii({
getItemOffset: function(t, i, n) {
return P(t, i, n).offset;
},
getItemSize: function(t, i, n) {
return n.itemMetadataMap[i].size;
},
getEstimatedTotalSize: Me,
getOffsetForIndexAndAlignment: function(t, i, n, a, o, s) {
var c = t.direction, u = t.height, d = t.layout, g = t.width, b = c === "horizontal" || d === "horizontal", l = b ? g : u, v = P(t, i, o), y = Me(t, o), r = Math.max(0, Math.min(y - l, v.offset)), f = Math.max(0, v.offset - l + v.size + s);
switch (n === "smart" && (a >= f - l && a <= r + l ? n = "auto" : n = "center"), n) {
case "start":
return r;
case "end":
return f;
case "center":
return Math.round(f + (r - f) / 2);
case "auto":
default:
return a >= f && a <= r ? a : a < f ? f : r;
}
},
getStartIndexForOffset: function(t, i, n) {
return ai(t, n, i);
},
getStopIndexForStartIndex: function(t, i, n, a) {
for (var o = t.direction, s = t.height, c = t.itemCount, u = t.layout, d = t.width, g = o === "horizontal" || u === "horizontal", b = g ? d : s, l = P(t, i, a), v = n + b, y = l.offset + l.size, r = i; r < c - 1 && y < v; )
r++, y += P(t, r, a).size;
return r;
},
initInstanceProps: function(t, i) {
var n = t, a = n.estimatedItemSize, o = {
itemMetadataMap: {},
estimatedItemSize: a || ri,
lastMeasuredIndex: -1
};
return i.resetAfterIndex = function(s, c) {
c === void 0 && (c = !0), o.lastMeasuredIndex = Math.min(o.lastMeasuredIndex, s - 1), i._getItemStyleCache(-1), c && i.forceUpdate();
}, o;
},
shouldResetStyleCacheOnItemSizeChange: !1,
validateProps: function(t) {
var i = t.itemSize;
if (U.process.env.NODE_ENV !== "production" && typeof i != "function")
throw Error('An invalid "itemSize" prop has been specified. Value should be a function. ' + ('"' + (i === null ? "null" : typeof i) + '" was specified.'));
}
});
function li(e) {
return function(t) {
e.forEach(function(i) {
typeof i == "function" ? i(t) : i != null && (i.current = t);
});
};
}
var re = function() {
}, ci = function(t, i) {
return i === void 0 && (i = null), {
child: null,
isShown: i ? i.public.isOpen && i.isShown : !0,
parent: i,
public: t,
sibling: null,
visited: !1
};
}, di = function(t, i) {
var n = i.getRecordData, a = n(t), o = a.data.id;
return o;
}, ui = function(t) {
var i = t.index, n = t.data, a = n.component, o = n.getRecordData, s = n.treeData, c = t.style, u = t.isScrolling, d = o(i);
return /* @__PURE__ */ Re.createElement(a, Object.assign({
isScrolling: u,
style: c,
treeData: s
}, d));
}, fi = function(t, i, n) {
var a = t.createRecord, o = i.buildingTaskTimeout, s = i.placeholder, c = i.async, u = c === void 0 ? !1 : c, d = i.treeWalker, g = (
// eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
u && n.records !== void 0
), b = n.records, l = [], v = /* @__PURE__ */ new Map(), y = o ? {
timeout: o
} : void 0, r = /* @__PURE__ */ new WeakMap(), f = d(), h = f.next(), _ = h.value, m = a(_.data, n, void 0, g ? b.get(_.data.id) : void 0);
v.set(m.public.data.id, m), r.set(m, _);
var T = m, S = !0, C = m, I = s !== void 0 && // If placeholder is set to null and this is the first build, idle callback
// won't be used. It is necessary for trees with async data which can be
// extremely complex but the first build is quite easy. During the following
// idle callbacks the old tree will be shown.
!(s === null && !n.order), O = I ? function(R) {
return R.timeRemaining() > 0;
} : function() {
return !0;
}, w = function R(F) {
for (; T !== null; ) {
if (!O(F)) {
requestIdleCallback(R, y);
return;
}
if (T.visited)
T.visited = !1, T = T.sibling !== null ? T.sibling : T.parent, C = T;
else {
var Y = f.next(r.get(T)), H = Y.value;
if (H === void 0) {
S ? S = !1 : (T.isShown && l.push(T.public.data.id), T.visited = T.child !== null, T = T.child !== null ? T.child : T.sibling !== null ? T.sibling : T.parent), C = T;
continue;
}
var W = a(H.data, n, S ? void 0 : T, g ? b.get(H.data.id) : void 0);
v.set(W.public.data.id, W), r.set(W, H), !S && C === T ? C.child = W : C.sibling = W, C = W;
}
}
I && n.setState({
order: l,
records: v,
updateRequest: {}
});
};
return I ? requestIdleCallback(w, y) : w(), s !== void 0 && u && n.order ? n : {
order: l,
records: v
};
}, Oe = 32768, hi = 2, pi = function(t, i) {
var n = t.order, a = t.records, o = i.opennessState;
if (typeof o != "object")
return null;
for (var s in o)
if (a.has(s)) {
var c = o[s], u = a.get(s), d = typeof c == "boolean" ? {
open: c
} : c, g = d.open, b = d.subtreeCallback, l = b === void 0 ? re : b, v = re, y = re;
u.isShown && (g ? function() {
for (var f = n.indexOf(s), h = u; h !== null; ) {
if (h.sibling !== null) {
h = h.sibling;
break;
}
h = h.parent;
}
var _ = h === null ? n.length - 1 - f : n.indexOf(h.public.data.id) - 1 - f, m = [[f + 1, _]];
v = function(S) {
if (S.isShown = S.parent ? S.parent.public.isOpen && S.parent.isShown : !0, S.isShown) {
var C = m[m.length - 1];
C.push(S.public.data.id), C.length === Oe + hi && m.push([f + 1 + Oe * m.length, 0]);
}
}, y = function() {
for (var S = 0; S < m.length; S++) {
var C;
(C = n).splice.apply(C, m[S]);
}
};
}() : u.public.isOpen && function() {
var f = n.indexOf(s), h = 0;
v = function(m) {
m.isShown && (h += 1), m.isShown = m.parent ? m.parent.public.isOpen && m.parent.isShown : !0;
}, y = function() {
n.splice(f + 1, h);
};
}());
for (var r = u; r !== null; )
r.visited ? (r.visited = !1, r = r === u ? null : r.sibling !== null ? r.sibling : r.parent) : (r.public.isOpen = r === u ? g : r.public.isOpen, l(r.public, u.public), r !== u && v(r), r.visited = r.child !== null, r = // Look for child in any case
r.child !== null ? r.child : (
// Stop looking for next element if currentRecord is root.
r === u ? null : (
// Otherwise, look for sibling or parent
r.sibling !== null ? r.sibling : r.parent
)
));
y();
}
return {
order: n,
records: a,
updateRequest: {}
};
}, gi = function(t) {
return function(i, n, a) {
return a.refresh ? fi(t, i, n) : pi(n, a);
};
}, Ue = /* @__PURE__ */ function(e) {
de(t, e), t.getDerivedStateFromProps = function(a, o) {
var s = a.listRef, c = s === void 0 ? null : s, u = a.treeWalker, d = o.computeTree, g = o.list, b = o.order, l = o.treeWalker;
return ue({
attachRefs: li([g, c])
}, u !== l || !b ? d(a, o, {
refresh: !0
}) : null, {
treeWalker: u
});
};
function t(n, a) {
var o;
return o = e.call(this, n, a) || this, o.getRecordData = o.getRecordData.bind(A(o)), o.state = {
list: /* @__PURE__ */ Ze(),
recomputeTree: o.recomputeTree.bind(A(o)),
setState: o.setState.bind(A(o))
}, o;
}
var i = t.prototype;
return i.getItemData = function() {
var a = this.props, o = a.children, s = a.itemData;
return {
component: o,
// eslint-disable-next-line @typescript-eslint/unbound-method
getRecordData: this.getRecordData,
treeData: s
};
}, i.getRecordData = function(a) {
var o = this.state, s = o.order, c = o.records;
return c.get(s[a]).public;
}, i.recomputeTree = function(a) {
var o = this;
return new Promise(function(s) {
o.setState(function(c) {
return c.computeTree(o.props, c, {
opennessState: a
});
}, s);
});
}, i.scrollTo = function(a) {
var o;
(o = this.state.list.current) == null || o.scrollTo(a);
}, i.scrollToItem = function(a, o) {
var s;
(s = this.state.list.current) == null || s.scrollToItem(this.state.order.indexOf(a), o);
}, t;
}(We);
Ue.defaultProps = {
rowComponent: ui
};
var mi = gi({
createRecord: function(t, i, n, a) {
var o = i.recomputeTree, s = i.resetAfterId, c = ci({
data: t,
height: a ? a.public.height : t.defaultHeight,
isOpen: a ? a.public.isOpen : t.isOpenByDefault,
resize: function(d, g) {
c.public.height = d, s(c.public.data.id, g);
},
setOpen: function(d) {
var g;
return o((g = {}, g[t.id] = d, g));
}
}, n);
return c;
}
}), vi = /* @__PURE__ */ function(e) {
de(t, e);
function t(n, a) {
var o;
return o = e.call(this, n, a) || this, o.getItemSize = o.getItemSize.bind(A(o)), o.state = ue({}, o.state, {
computeTree: mi,
resetAfterI