taxonium-component
Version:
React component for exploring large phylogenetic trees in the browser
1,819 lines (1,809 loc) • 656 kB
JavaScript
import { d as Q, c as Se } from "./index-dFotuATn.js";
import { aH as gt, cJ as uu, cK as Ge, cL as Nt, cM as du, c8 as fu, A as io, z as Rn, G as Hn, cN as Pt, H as Ie, aC as Ye, I as we, J as ft, b2 as En, be as Yr, bf as Zr, cO as ao, cP as hn, bc as li, b5 as ht, T as Po, cn as Nl, X as co, K as Tn, ba as si, a7 as Kn, aI as Ve, cQ as ii, cR as gu, bH as ai, c5 as gr, bg as hu, cG as h, aL as ci, cH as Z, aR as mu, b$ as pu, cS as bu, a6 as Cu, B as wu, c as ui, cT as yu, C as Su, cU as di, cV as vu, cW as Iu, bN as xu, cX as Pu, cY as Mu, cZ as Eu, P as Tu, c_ as _t, c$ as fi, bd as st, aM as Ln, d0 as gi, aF as ku, d1 as hi, d2 as Mo, d3 as mi } from "./JBrowsePanel-uJIA-L6s.js";
import * as u from "react";
import { createElement as Pn } from "react";
import o from "prop-types";
import { jsxs as Ce, jsx as S } from "react/jsx-runtime";
import { s as De, g as Fu } from "./getThemeProps-D6FTZoZe.js";
import * as Ou from "react-dom";
import { S as Du, F as Ru, f as Hu } from "./FormControlLabel-CwjOxa71.js";
import { g as Lu, a as $u, l as Xn, M as Jr } from "./MenuItem-D4Mw907e.js";
import { D as Nu } from "./Divider-DdgIO2wW.js";
import { B as Gu } from "./Badge-DOFO0p9p.js";
import { b as Er } from "./TableCell-DGdBCaoe.js";
import { C as Vu } from "./Checkbox-BG4jcGUl.js";
function Au(e) {
return String(e).match(/[\d.\-+]*\s*(.*)/)[1] || "";
}
function zu(e) {
return parseFloat(e);
}
function Gl(e) {
return e.substring(2).toLowerCase();
}
function Bu(e, t) {
return t.documentElement.clientWidth < e.clientX || t.documentElement.clientHeight < e.clientY;
}
function $o(e) {
const {
children: t,
disableReactTree: n = !1,
mouseEvent: r = "onClick",
onClickAway: l,
touchEvent: s = "onTouchEnd"
} = e, i = u.useRef(!1), a = u.useRef(null), c = u.useRef(!1), f = u.useRef(!1);
u.useEffect(() => (setTimeout(() => {
c.current = !0;
}, 0), () => {
c.current = !1;
}), []);
const d = gt(uu(t), a), g = Ge((C) => {
const y = f.current;
f.current = !1;
const b = Nt(a.current);
if (!c.current || !a.current || "clientX" in C && Bu(C, b))
return;
if (i.current) {
i.current = !1;
return;
}
let I;
C.composedPath ? I = C.composedPath().includes(a.current) : I = !b.documentElement.contains(
// @ts-expect-error returns `false` as intended when not dispatched from a Node
C.target
) || a.current.contains(
// @ts-expect-error returns `false` as intended when not dispatched from a Node
C.target
), !I && (n || !y) && l(C);
}), m = (C) => (y) => {
f.current = !0;
const b = t.props[C];
b && b(y);
}, p = {
ref: d
};
return s !== !1 && (p[s] = m(s)), u.useEffect(() => {
if (s !== !1) {
const C = Gl(s), y = Nt(a.current), b = () => {
i.current = !0;
};
return y.addEventListener(C, g), y.addEventListener("touchmove", b), () => {
y.removeEventListener(C, g), y.removeEventListener("touchmove", b);
};
}
}, [g, s]), r !== !1 && (p[r] = m(r)), u.useEffect(() => {
if (r !== !1) {
const C = Gl(r), y = Nt(a.current);
return y.addEventListener(C, g), () => {
y.removeEventListener(C, g);
};
}
}, [g, r]), /* @__PURE__ */ u.cloneElement(t, p);
}
Q.process.env.NODE_ENV !== "production" && ($o.propTypes = {
// ┌────────────────────────────── Warning ──────────────────────────────┐
// │ These PropTypes are generated from the TypeScript type definitions. │
// │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
// └─────────────────────────────────────────────────────────────────────┘
/**
* The wrapped element.
*/
children: du.isRequired,
/**
* If `true`, the React tree is ignored and only the DOM tree is considered.
* This prop changes how portaled elements are handled.
* @default false
*/
disableReactTree: o.bool,
/**
* The mouse event to listen to. You can disable the listener by providing `false`.
* @default 'onClick'
*/
mouseEvent: o.oneOf(["onClick", "onMouseDown", "onMouseUp", "onPointerDown", "onPointerUp", !1]),
/**
* Callback fired when a "click away" event is detected.
*/
onClickAway: o.func.isRequired,
/**
* The touch event to listen to. You can disable the listener by providing `false`.
* @default 'onTouchEnd'
*/
touchEvent: o.oneOf(["onTouchEnd", "onTouchStart", !1])
});
Q.process.env.NODE_ENV !== "production" && ($o.propTypes = fu($o.propTypes));
function _u(e) {
return io("MuiLinearProgress", e);
}
Rn("MuiLinearProgress", ["root", "colorPrimary", "colorSecondary", "determinate", "indeterminate", "buffer", "query", "dashed", "dashedColorPrimary", "dashedColorSecondary", "bar", "bar1", "bar2", "barColorPrimary", "barColorSecondary", "bar1Indeterminate", "bar1Determinate", "bar1Buffer", "bar2Indeterminate", "bar2Buffer"]);
const Tr = 4, kr = hn`
0% {
left: -35%;
right: 100%;
}
60% {
left: 100%;
right: -90%;
}
100% {
left: 100%;
right: -90%;
}
`, qu = typeof kr != "string" ? ao`
animation: ${kr} 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
` : null, Fr = hn`
0% {
left: -200%;
right: 100%;
}
60% {
left: 107%;
right: -8%;
}
100% {
left: 107%;
right: -8%;
}
`, ju = typeof Fr != "string" ? ao`
animation: ${Fr} 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) 1.15s infinite;
` : null, Or = hn`
0% {
opacity: 1;
background-position: 0 -23px;
}
60% {
opacity: 0;
background-position: 0 -23px;
}
100% {
opacity: 1;
background-position: -200px -23px;
}
`, Wu = typeof Or != "string" ? ao`
animation: ${Or} 3s infinite linear;
` : null, Uu = (e) => {
const {
classes: t,
variant: n,
color: r
} = e, l = {
root: ["root", `color${Ye(r)}`, n],
dashed: ["dashed", `dashedColor${Ye(r)}`],
bar1: ["bar", "bar1", `barColor${Ye(r)}`, (n === "indeterminate" || n === "query") && "bar1Indeterminate", n === "determinate" && "bar1Determinate", n === "buffer" && "bar1Buffer"],
bar2: ["bar", "bar2", n !== "buffer" && `barColor${Ye(r)}`, n === "buffer" && `color${Ye(r)}`, (n === "indeterminate" || n === "query") && "bar2Indeterminate", n === "buffer" && "bar2Buffer"]
};
return we(l, _u, t);
}, el = (e, t) => e.vars ? e.vars.palette.LinearProgress[`${t}Bg`] : e.palette.mode === "light" ? Yr(e.palette[t].main, 0.62) : Zr(e.palette[t].main, 0.5), Ku = Ie("span", {
name: "MuiLinearProgress",
slot: "Root",
overridesResolver: (e, t) => {
const {
ownerState: n
} = e;
return [t.root, t[`color${Ye(n.color)}`], t[n.variant]];
}
})(ft(({
theme: e
}) => ({
position: "relative",
overflow: "hidden",
display: "block",
height: 4,
// Fix Safari's bug during composition of different paint.
zIndex: 0,
"@media print": {
colorAdjust: "exact"
},
variants: [...Object.entries(e.palette).filter(En()).map(([t]) => ({
props: {
color: t
},
style: {
backgroundColor: el(e, t)
}
})), {
props: ({
ownerState: t
}) => t.color === "inherit" && t.variant !== "buffer",
style: {
"&::before": {
content: '""',
position: "absolute",
left: 0,
top: 0,
right: 0,
bottom: 0,
backgroundColor: "currentColor",
opacity: 0.3
}
}
}, {
props: {
variant: "buffer"
},
style: {
backgroundColor: "transparent"
}
}, {
props: {
variant: "query"
},
style: {
transform: "rotate(180deg)"
}
}]
}))), Xu = Ie("span", {
name: "MuiLinearProgress",
slot: "Dashed",
overridesResolver: (e, t) => {
const {
ownerState: n
} = e;
return [t.dashed, t[`dashedColor${Ye(n.color)}`]];
}
})(ft(({
theme: e
}) => ({
position: "absolute",
marginTop: 0,
height: "100%",
width: "100%",
backgroundSize: "10px 10px",
backgroundPosition: "0 -23px",
variants: [{
props: {
color: "inherit"
},
style: {
opacity: 0.3,
backgroundImage: "radial-gradient(currentColor 0%, currentColor 16%, transparent 42%)"
}
}, ...Object.entries(e.palette).filter(En()).map(([t]) => {
const n = el(e, t);
return {
props: {
color: t
},
style: {
backgroundImage: `radial-gradient(${n} 0%, ${n} 16%, transparent 42%)`
}
};
})]
})), Wu || {
// At runtime for Pigment CSS, `bufferAnimation` will be null and the generated keyframe will be used.
animation: `${Or} 3s infinite linear`
}), Qu = Ie("span", {
name: "MuiLinearProgress",
slot: "Bar1",
overridesResolver: (e, t) => {
const {
ownerState: n
} = e;
return [t.bar, t.bar1, t[`barColor${Ye(n.color)}`], (n.variant === "indeterminate" || n.variant === "query") && t.bar1Indeterminate, n.variant === "determinate" && t.bar1Determinate, n.variant === "buffer" && t.bar1Buffer];
}
})(ft(({
theme: e
}) => ({
width: "100%",
position: "absolute",
left: 0,
bottom: 0,
top: 0,
transition: "transform 0.2s linear",
transformOrigin: "left",
variants: [{
props: {
color: "inherit"
},
style: {
backgroundColor: "currentColor"
}
}, ...Object.entries(e.palette).filter(En()).map(([t]) => ({
props: {
color: t
},
style: {
backgroundColor: (e.vars || e).palette[t].main
}
})), {
props: {
variant: "determinate"
},
style: {
transition: `transform .${Tr}s linear`
}
}, {
props: {
variant: "buffer"
},
style: {
zIndex: 1,
transition: `transform .${Tr}s linear`
}
}, {
props: ({
ownerState: t
}) => t.variant === "indeterminate" || t.variant === "query",
style: {
width: "auto"
}
}, {
props: ({
ownerState: t
}) => t.variant === "indeterminate" || t.variant === "query",
style: qu || {
animation: `${kr} 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite`
}
}]
}))), Yu = Ie("span", {
name: "MuiLinearProgress",
slot: "Bar2",
overridesResolver: (e, t) => {
const {
ownerState: n
} = e;
return [t.bar, t.bar2, t[`barColor${Ye(n.color)}`], (n.variant === "indeterminate" || n.variant === "query") && t.bar2Indeterminate, n.variant === "buffer" && t.bar2Buffer];
}
})(ft(({
theme: e
}) => ({
width: "100%",
position: "absolute",
left: 0,
bottom: 0,
top: 0,
transition: "transform 0.2s linear",
transformOrigin: "left",
variants: [...Object.entries(e.palette).filter(En()).map(([t]) => ({
props: {
color: t
},
style: {
"--LinearProgressBar2-barColor": (e.vars || e).palette[t].main
}
})), {
props: ({
ownerState: t
}) => t.variant !== "buffer" && t.color !== "inherit",
style: {
backgroundColor: "var(--LinearProgressBar2-barColor, currentColor)"
}
}, {
props: ({
ownerState: t
}) => t.variant !== "buffer" && t.color === "inherit",
style: {
backgroundColor: "currentColor"
}
}, {
props: {
color: "inherit"
},
style: {
opacity: 0.3
}
}, ...Object.entries(e.palette).filter(En()).map(([t]) => ({
props: {
color: t,
variant: "buffer"
},
style: {
backgroundColor: el(e, t),
transition: `transform .${Tr}s linear`
}
})), {
props: ({
ownerState: t
}) => t.variant === "indeterminate" || t.variant === "query",
style: {
width: "auto"
}
}, {
props: ({
ownerState: t
}) => t.variant === "indeterminate" || t.variant === "query",
style: ju || {
animation: `${Fr} 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) 1.15s infinite`
}
}]
}))), pi = /* @__PURE__ */ u.forwardRef(function(t, n) {
const r = Hn({
props: t,
name: "MuiLinearProgress"
}), {
className: l,
color: s = "primary",
value: i,
valueBuffer: a,
variant: c = "indeterminate",
...f
} = r, d = {
...r,
color: s,
variant: c
}, g = Uu(d), m = Pt(), p = {}, C = {
bar1: {},
bar2: {}
};
if (c === "determinate" || c === "buffer")
if (i !== void 0) {
p["aria-valuenow"] = Math.round(i), p["aria-valuemin"] = 0, p["aria-valuemax"] = 100;
let y = i - 100;
m && (y = -y), C.bar1.transform = `translateX(${y}%)`;
} else Q.process.env.NODE_ENV !== "production" && console.error("MUI: You need to provide a value prop when using the determinate or buffer variant of LinearProgress .");
if (c === "buffer")
if (a !== void 0) {
let y = (a || 0) - 100;
m && (y = -y), C.bar2.transform = `translateX(${y}%)`;
} else Q.process.env.NODE_ENV !== "production" && console.error("MUI: You need to provide a valueBuffer prop when using the buffer variant of LinearProgress.");
return /* @__PURE__ */ Ce(Ku, {
className: Se(g.root, l),
ownerState: d,
role: "progressbar",
...p,
ref: n,
...f,
children: [c === "buffer" ? /* @__PURE__ */ S(Xu, {
className: g.dashed,
ownerState: d
}) : null, /* @__PURE__ */ S(Qu, {
className: g.bar1,
ownerState: d,
style: C.bar1
}), c === "determinate" ? null : /* @__PURE__ */ S(Yu, {
className: g.bar2,
ownerState: d,
style: C.bar2
})]
});
});
Q.process.env.NODE_ENV !== "production" && (pi.propTypes = {
// ┌────────────────────────────── Warning ──────────────────────────────┐
// │ These PropTypes are generated from the TypeScript type definitions. │
// │ To update them, edit the d.ts file and run `pnpm proptypes`. │
// └─────────────────────────────────────────────────────────────────────┘
/**
* Override or extend the styles applied to the component.
*/
classes: o.object,
/**
* @ignore
*/
className: o.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 'primary'
*/
color: o.oneOfType([o.oneOf(["inherit", "primary", "secondary"]), o.string]),
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx: o.oneOfType([o.arrayOf(o.oneOfType([o.func, o.object, o.bool])), o.func, o.object]),
/**
* The value of the progress indicator for the determinate and buffer variants.
* Value between 0 and 100.
*/
value: o.number,
/**
* The value for the buffer variant.
* Value between 0 and 100.
*/
valueBuffer: o.number,
/**
* The variant to use.
* Use indeterminate or query when there is no progress value.
* @default 'indeterminate'
*/
variant: o.oneOf(["buffer", "determinate", "indeterminate", "query"])
});
const Zu = (e) => {
const {
alignItems: t,
classes: n
} = e;
return we({
root: ["root", t === "flex-start" && "alignItemsFlexStart"]
}, Lu, n);
}, Ju = Ie("div", {
name: "MuiListItemIcon",
slot: "Root",
overridesResolver: (e, t) => {
const {
ownerState: n
} = e;
return [t.root, n.alignItems === "flex-start" && t.alignItemsFlexStart];
}
})(ft(({
theme: e
}) => ({
minWidth: 56,
color: (e.vars || e).palette.action.active,
flexShrink: 0,
display: "inline-flex",
variants: [{
props: {
alignItems: "flex-start"
},
style: {
marginTop: 8
}
}]
}))), Dr = /* @__PURE__ */ u.forwardRef(function(t, n) {
const r = Hn({
props: t,
name: "MuiListItemIcon"
}), {
className: l,
...s
} = r, i = u.useContext(li), a = {
...r,
alignItems: i.alignItems
}, c = Zu(a);
return /* @__PURE__ */ S(Ju, {
className: Se(c.root, l),
ownerState: a,
ref: n,
...s
});
});
Q.process.env.NODE_ENV !== "production" && (Dr.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 `Icon`, `SvgIcon`,
* or a `@mui/icons-material` SVG icon element.
*/
children: o.node,
/**
* Override or extend the styles applied to the component.
*/
classes: o.object,
/**
* @ignore
*/
className: o.string,
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx: o.oneOfType([o.arrayOf(o.oneOfType([o.func, o.object, o.bool])), o.func, o.object])
});
const ed = (e) => {
const {
classes: t,
inset: n,
primary: r,
secondary: l,
dense: s
} = e;
return we({
root: ["root", n && "inset", s && "dense", r && l && "multiline"],
primary: ["primary"],
secondary: ["secondary"]
}, $u, t);
}, td = Ie("div", {
name: "MuiListItemText",
slot: "Root",
overridesResolver: (e, t) => {
const {
ownerState: n
} = e;
return [{
[`& .${Xn.primary}`]: t.primary
}, {
[`& .${Xn.secondary}`]: t.secondary
}, t.root, n.inset && t.inset, n.primary && n.secondary && t.multiline, n.dense && t.dense];
}
})({
flex: "1 1 auto",
minWidth: 0,
marginTop: 4,
marginBottom: 4,
[`.${Nl.root}:where(& .${Xn.primary})`]: {
display: "block"
},
[`.${Nl.root}:where(& .${Xn.secondary})`]: {
display: "block"
},
variants: [{
props: ({
ownerState: e
}) => e.primary && e.secondary,
style: {
marginTop: 6,
marginBottom: 6
}
}, {
props: ({
ownerState: e
}) => e.inset,
style: {
paddingLeft: 56
}
}]
}), bi = /* @__PURE__ */ u.forwardRef(function(t, n) {
const r = Hn({
props: t,
name: "MuiListItemText"
}), {
children: l,
className: s,
disableTypography: i = !1,
inset: a = !1,
primary: c,
primaryTypographyProps: f,
secondary: d,
secondaryTypographyProps: g,
slots: m = {},
slotProps: p = {},
...C
} = r, {
dense: y
} = u.useContext(li);
let b = c ?? l, I = d;
const P = {
...r,
disableTypography: i,
inset: a,
primary: !!b,
secondary: !!I,
dense: y
}, O = ed(P), T = {
slots: m,
slotProps: {
primary: f,
secondary: g,
...p
}
}, [R, N] = ht("root", {
className: Se(O.root, s),
elementType: td,
externalForwardedProps: {
...T,
...C
},
ownerState: P,
ref: n
}), [$, x] = ht("primary", {
className: O.primary,
elementType: Po,
externalForwardedProps: T,
ownerState: P
}), [v, D] = ht("secondary", {
className: O.secondary,
elementType: Po,
externalForwardedProps: T,
ownerState: P
});
return b != null && b.type !== Po && !i && (b = /* @__PURE__ */ S($, {
variant: y ? "body2" : "body1",
component: x != null && x.variant ? void 0 : "span",
...x,
children: b
})), I != null && I.type !== Po && !i && (I = /* @__PURE__ */ S(v, {
variant: "body2",
color: "textSecondary",
...D,
children: I
})), /* @__PURE__ */ Ce(R, {
...N,
children: [b, I]
});
});
Q.process.env.NODE_ENV !== "production" && (bi.propTypes = {
// ┌────────────────────────────── Warning ──────────────────────────────┐
// │ These PropTypes are generated from the TypeScript type definitions. │
// │ To update them, edit the d.ts file and run `pnpm proptypes`. │
// └─────────────────────────────────────────────────────────────────────┘
/**
* Alias for the `primary` prop.
*/
children: o.node,
/**
* Override or extend the styles applied to the component.
*/
classes: o.object,
/**
* @ignore
*/
className: o.string,
/**
* If `true`, the children won't be wrapped by a Typography component.
* This can be useful to render an alternative Typography variant by wrapping
* the `children` (or `primary`) text, and optional `secondary` text
* with the Typography component.
* @default false
*/
disableTypography: o.bool,
/**
* If `true`, the children are indented.
* This should be used if there is no left avatar or left icon.
* @default false
*/
inset: o.bool,
/**
* The main content element.
*/
primary: o.node,
/**
* These props will be forwarded to the primary typography component
* (as long as disableTypography is not `true`).
* @deprecated Use `slotProps.primary` instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
*/
primaryTypographyProps: o.object,
/**
* The secondary content element.
*/
secondary: o.node,
/**
* These props will be forwarded to the secondary typography component
* (as long as disableTypography is not `true`).
* @deprecated Use `slotProps.secondary` instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
*/
secondaryTypographyProps: o.object,
/**
* The props used for each slot inside.
* @default {}
*/
slotProps: o.shape({
primary: o.oneOfType([o.func, o.object]),
root: o.oneOfType([o.func, o.object]),
secondary: o.oneOfType([o.func, o.object])
}),
/**
* The components used for each slot inside.
* @default {}
*/
slots: o.shape({
primary: o.elementType,
root: o.elementType,
secondary: o.elementType
}),
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx: o.oneOfType([o.arrayOf(o.oneOfType([o.func, o.object, o.bool])), o.func, o.object])
});
const nd = co(/* @__PURE__ */ S("path", {
d: "M18.41 16.59L13.82 12l4.59-4.59L17 6l-6 6 6 6zM6 6h2v12H6z"
}), "FirstPage"), od = co(/* @__PURE__ */ S("path", {
d: "M5.59 7.41L10.18 12l-4.59 4.59L7 18l6-6-6-6zM16 6h2v12h-2z"
}), "LastPage");
function rd(e) {
return io("MuiSkeleton", e);
}
Rn("MuiSkeleton", ["root", "text", "rectangular", "rounded", "circular", "pulse", "wave", "withChildren", "fitContent", "heightAuto"]);
const ld = (e) => {
const {
classes: t,
variant: n,
animation: r,
hasChildren: l,
width: s,
height: i
} = e;
return we({
root: ["root", n, r, l && "withChildren", l && !s && "fitContent", l && !i && "heightAuto"]
}, rd, t);
}, Rr = hn`
0% {
opacity: 1;
}
50% {
opacity: 0.4;
}
100% {
opacity: 1;
}
`, Hr = hn`
0% {
transform: translateX(-100%);
}
50% {
/* +0.5s of delay between each loop */
transform: translateX(100%);
}
100% {
transform: translateX(100%);
}
`, sd = typeof Rr != "string" ? ao`
animation: ${Rr} 2s ease-in-out 0.5s infinite;
` : null, id = typeof Hr != "string" ? ao`
&::after {
animation: ${Hr} 2s linear 0.5s infinite;
}
` : null, ad = Ie("span", {
name: "MuiSkeleton",
slot: "Root",
overridesResolver: (e, t) => {
const {
ownerState: n
} = e;
return [t.root, t[n.variant], n.animation !== !1 && t[n.animation], n.hasChildren && t.withChildren, n.hasChildren && !n.width && t.fitContent, n.hasChildren && !n.height && t.heightAuto];
}
})(ft(({
theme: e
}) => {
const t = Au(e.shape.borderRadius) || "px", n = zu(e.shape.borderRadius);
return {
display: "block",
// Create a "on paper" color with sufficient contrast retaining the color
backgroundColor: e.vars ? e.vars.palette.Skeleton.bg : Tn(e.palette.text.primary, e.palette.mode === "light" ? 0.11 : 0.13),
height: "1.2em",
variants: [{
props: {
variant: "text"
},
style: {
marginTop: 0,
marginBottom: 0,
height: "auto",
transformOrigin: "0 55%",
transform: "scale(1, 0.60)",
borderRadius: `${n}${t}/${Math.round(n / 0.6 * 10) / 10}${t}`,
"&:empty:before": {
content: '"\\00a0"'
}
}
}, {
props: {
variant: "circular"
},
style: {
borderRadius: "50%"
}
}, {
props: {
variant: "rounded"
},
style: {
borderRadius: (e.vars || e).shape.borderRadius
}
}, {
props: ({
ownerState: r
}) => r.hasChildren,
style: {
"& > *": {
visibility: "hidden"
}
}
}, {
props: ({
ownerState: r
}) => r.hasChildren && !r.width,
style: {
maxWidth: "fit-content"
}
}, {
props: ({
ownerState: r
}) => r.hasChildren && !r.height,
style: {
height: "auto"
}
}, {
props: {
animation: "pulse"
},
style: sd || {
animation: `${Rr} 2s ease-in-out 0.5s infinite`
}
}, {
props: {
animation: "wave"
},
style: {
position: "relative",
overflow: "hidden",
/* Fix bug in Safari https://bugs.webkit.org/show_bug.cgi?id=68196 */
WebkitMaskImage: "-webkit-radial-gradient(white, black)",
"&::after": {
background: `linear-gradient(
90deg,
transparent,
${(e.vars || e).palette.action.hover},
transparent
)`,
content: '""',
position: "absolute",
transform: "translateX(-100%)",
bottom: 0,
left: 0,
right: 0,
top: 0
}
}
}, {
props: {
animation: "wave"
},
style: id || {
"&::after": {
animation: `${Hr} 2s linear 0.5s infinite`
}
}
}]
};
})), Ci = /* @__PURE__ */ u.forwardRef(function(t, n) {
const r = Hn({
props: t,
name: "MuiSkeleton"
}), {
animation: l = "pulse",
className: s,
component: i = "span",
height: a,
style: c,
variant: f = "text",
width: d,
...g
} = r, m = {
...r,
animation: l,
component: i,
variant: f,
hasChildren: !!g.children
}, p = ld(m);
return /* @__PURE__ */ S(ad, {
as: i,
ref: n,
className: Se(p.root, s),
ownerState: m,
...g,
style: {
width: d,
height: a,
...c
}
});
});
Q.process.env.NODE_ENV !== "production" && (Ci.propTypes = {
// ┌────────────────────────────── Warning ──────────────────────────────┐
// │ These PropTypes are generated from the TypeScript type definitions. │
// │ To update them, edit the d.ts file and run `pnpm proptypes`. │
// └─────────────────────────────────────────────────────────────────────┘
/**
* The animation.
* If `false` the animation effect is disabled.
* @default 'pulse'
*/
animation: o.oneOf(["pulse", "wave", !1]),
/**
* Optional children to infer width and height from.
*/
children: o.node,
/**
* Override or extend the styles applied to the component.
*/
classes: o.object,
/**
* @ignore
*/
className: o.string,
/**
* The component used for the root node.
* Either a string to use a HTML element or a component.
*/
component: o.elementType,
/**
* Height of the skeleton.
* Useful when you don't want to adapt the skeleton to a text element but for instance a card.
*/
height: o.oneOfType([o.number, o.string]),
/**
* @ignore
*/
style: o.object,
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx: o.oneOfType([o.arrayOf(o.oneOfType([o.func, o.object, o.bool])), o.func, o.object]),
/**
* The type of content that will be rendered.
* @default 'text'
*/
variant: o.oneOfType([o.oneOf(["circular", "rectangular", "rounded", "text"]), o.string]),
/**
* Width of the skeleton.
* Useful when the skeleton is inside an inline element with no width of its own.
*/
width: o.oneOfType([o.number, o.string])
});
function cd(e) {
return io("MuiSwitch", e);
}
const at = Rn("MuiSwitch", ["root", "edgeStart", "edgeEnd", "switchBase", "colorPrimary", "colorSecondary", "sizeSmall", "sizeMedium", "checked", "disabled", "input", "thumb", "track"]), ud = (e) => {
const {
classes: t,
edge: n,
size: r,
color: l,
checked: s,
disabled: i
} = e, a = {
root: ["root", n && `edge${Ye(n)}`, `size${Ye(r)}`],
switchBase: ["switchBase", `color${Ye(l)}`, s && "checked", i && "disabled"],
thumb: ["thumb"],
track: ["track"],
input: ["input"]
}, c = we(a, cd, t);
return {
...t,
// forward the disabled and checked classes to the SwitchBase
...c
};
}, dd = Ie("span", {
name: "MuiSwitch",
slot: "Root",
overridesResolver: (e, t) => {
const {
ownerState: n
} = e;
return [t.root, n.edge && t[`edge${Ye(n.edge)}`], t[`size${Ye(n.size)}`]];
}
})({
display: "inline-flex",
width: 34 + 12 * 2,
height: 14 + 12 * 2,
overflow: "hidden",
padding: 12,
boxSizing: "border-box",
position: "relative",
flexShrink: 0,
zIndex: 0,
// Reset the stacking context.
verticalAlign: "middle",
// For correct alignment with the text.
"@media print": {
colorAdjust: "exact"
},
variants: [{
props: {
edge: "start"
},
style: {
marginLeft: -8
}
}, {
props: {
edge: "end"
},
style: {
marginRight: -8
}
}, {
props: {
size: "small"
},
style: {
width: 40,
height: 24,
padding: 7,
[`& .${at.thumb}`]: {
width: 16,
height: 16
},
[`& .${at.switchBase}`]: {
padding: 4,
[`&.${at.checked}`]: {
transform: "translateX(16px)"
}
}
}
}]
}), fd = Ie(Du, {
name: "MuiSwitch",
slot: "SwitchBase",
overridesResolver: (e, t) => {
const {
ownerState: n
} = e;
return [t.switchBase, {
[`& .${at.input}`]: t.input
}, n.color !== "default" && t[`color${Ye(n.color)}`]];
}
})(ft(({
theme: e
}) => ({
position: "absolute",
top: 0,
left: 0,
zIndex: 1,
// Render above the focus ripple.
color: e.vars ? e.vars.palette.Switch.defaultColor : `${e.palette.mode === "light" ? e.palette.common.white : e.palette.grey[300]}`,
transition: e.transitions.create(["left", "transform"], {
duration: e.transitions.duration.shortest
}),
[`&.${at.checked}`]: {
transform: "translateX(20px)"
},
[`&.${at.disabled}`]: {
color: e.vars ? e.vars.palette.Switch.defaultDisabledColor : `${e.palette.mode === "light" ? e.palette.grey[100] : e.palette.grey[600]}`
},
[`&.${at.checked} + .${at.track}`]: {
opacity: 0.5
},
[`&.${at.disabled} + .${at.track}`]: {
opacity: e.vars ? e.vars.opacity.switchTrackDisabled : `${e.palette.mode === "light" ? 0.12 : 0.2}`
},
[`& .${at.input}`]: {
left: "-100%",
width: "300%"
}
})), ft(({
theme: e
}) => ({
"&:hover": {
backgroundColor: e.vars ? `rgba(${e.vars.palette.action.activeChannel} / ${e.vars.palette.action.hoverOpacity})` : Tn(e.palette.action.active, e.palette.action.hoverOpacity),
// Reset on touch devices, it doesn't add specificity
"@media (hover: none)": {
backgroundColor: "transparent"
}
},
variants: [...Object.entries(e.palette).filter(En(["light"])).map(([t]) => ({
props: {
color: t
},
style: {
[`&.${at.checked}`]: {
color: (e.vars || e).palette[t].main,
"&:hover": {
backgroundColor: e.vars ? `rgba(${e.vars.palette[t].mainChannel} / ${e.vars.palette.action.hoverOpacity})` : Tn(e.palette[t].main, e.palette.action.hoverOpacity),
"@media (hover: none)": {
backgroundColor: "transparent"
}
},
[`&.${at.disabled}`]: {
color: e.vars ? e.vars.palette.Switch[`${t}DisabledColor`] : `${e.palette.mode === "light" ? Yr(e.palette[t].main, 0.62) : Zr(e.palette[t].main, 0.55)}`
}
},
[`&.${at.checked} + .${at.track}`]: {
backgroundColor: (e.vars || e).palette[t].main
}
}
}))]
}))), gd = Ie("span", {
name: "MuiSwitch",
slot: "Track"
})(ft(({
theme: e
}) => ({
height: "100%",
width: "100%",
borderRadius: 14 / 2,
zIndex: -1,
transition: e.transitions.create(["opacity", "background-color"], {
duration: e.transitions.duration.shortest
}),
backgroundColor: e.vars ? e.vars.palette.common.onBackground : `${e.palette.mode === "light" ? e.palette.common.black : e.palette.common.white}`,
opacity: e.vars ? e.vars.opacity.switchTrack : `${e.palette.mode === "light" ? 0.38 : 0.3}`
}))), hd = Ie("span", {
name: "MuiSwitch",
slot: "Thumb"
})(ft(({
theme: e
}) => ({
boxShadow: (e.vars || e).shadows[1],
backgroundColor: "currentColor",
width: 20,
height: 20,
borderRadius: "50%"
}))), Lr = /* @__PURE__ */ u.forwardRef(function(t, n) {
const r = Hn({
props: t,
name: "MuiSwitch"
}), {
className: l,
color: s = "primary",
edge: i = !1,
size: a = "medium",
sx: c,
slots: f = {},
slotProps: d = {},
...g
} = r, m = {
...r,
color: s,
edge: i,
size: a
}, p = ud(m), C = {
slots: f,
slotProps: d
}, [y, b] = ht("root", {
className: Se(p.root, l),
elementType: dd,
externalForwardedProps: C,
ownerState: m,
additionalProps: {
sx: c
}
}), [I, P] = ht("thumb", {
className: p.thumb,
elementType: hd,
externalForwardedProps: C,
ownerState: m
}), O = /* @__PURE__ */ S(I, {
...P
}), [T, R] = ht("track", {
className: p.track,
elementType: gd,
externalForwardedProps: C,
ownerState: m
});
return /* @__PURE__ */ Ce(y, {
...b,
children: [/* @__PURE__ */ S(fd, {
type: "checkbox",
icon: O,
checkedIcon: O,
ref: n,
ownerState: m,
...g,
classes: {
...p,
root: p.switchBase
},
slots: {
...f.switchBase && {
root: f.switchBase
},
...f.input && {
input: f.input
}
},
slotProps: {
...d.switchBase && {
root: typeof d.switchBase == "function" ? d.switchBase(m) : d.switchBase
},
...d.input && {
input: typeof d.input == "function" ? d.input(m) : d.input
}
}
}), /* @__PURE__ */ S(T, {
...R
})]
});
});
Q.process.env.NODE_ENV !== "production" && (Lr.propTypes = {
// ┌────────────────────────────── Warning ──────────────────────────────┐
// │ These PropTypes are generated from the TypeScript type definitions. │
// │ To update them, edit the d.ts file and run `pnpm proptypes`. │
// └─────────────────────────────────────────────────────────────────────┘
/**
* If `true`, the component is checked.
*/
checked: o.bool,
/**
* The icon to display when the component is checked.
*/
checkedIcon: o.node,
/**
* Override or extend the styles applied to the component.
*/
classes: o.object,
/**
* @ignore
*/
className: o.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 'primary'
*/
color: o.oneOfType([o.oneOf(["default", "primary", "secondary", "error", "info", "success", "warning"]), o.string]),
/**
* The default checked state. Use when the component is not controlled.
*/
defaultChecked: o.bool,
/**
* If `true`, the component is disabled.
*/
disabled: o.bool,
/**
* If `true`, the ripple effect is disabled.
* @default false
*/
disableRipple: o.bool,
/**
* If given, uses a negative margin to counteract the padding on one
* side (this is often helpful for aligning the left or right
* side of the icon with content above or below, without ruining the border
* size and shape).
* @default false
*/
edge: o.oneOf(["end", "start", !1]),
/**
* The icon to display when the component is unchecked.
*/
icon: o.node,
/**
* The id of the `input` element.
*/
id: o.string,
/**
* [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input#attributes) applied to the `input` element.
* @deprecated Use `slotProps.input` instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
*/
inputProps: o.object,
/**
* Pass a ref to the `input` element.
* @deprecated Use `slotProps.input.ref` instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
*/
inputRef: si,
/**
* Callback fired when the state is changed.
*
* @param {React.ChangeEvent<HTMLInputElement>} event The event source of the callback.
* You can pull out the new value by accessing `event.target.value` (string).
* You can pull out the new checked state by accessing `event.target.checked` (boolean).
*/
onChange: o.func,
/**
* If `true`, the `input` element is required.
* @default false
*/
required: o.bool,
/**
* The size of the component.
* `small` is equivalent to the dense switch styling.
* @default 'medium'
*/
size: o.oneOfType([o.oneOf(["medium", "small"]), o.string]),
/**
* The props used for each slot inside.
* @default {}
*/
slotProps: o.shape({
input: o.oneOfType([o.func, o.object]),
root: o.oneOfType([o.func, o.object]),
switchBase: o.oneOfType([o.func, o.object]),
thumb: o.oneOfType([o.func, o.object]),
track: o.oneOfType([o.func, o.object])
}),
/**
* The components used for each slot inside.
* @default {}
*/
slots: o.shape({
input: o.elementType,
root: o.elementType,
switchBase: o.elementType,
thumb: o.elementType,
track: o.elementType
}),
/**
* The system prop that allows defining system overrides as well as additional CSS styles.
*/
sx: o.oneOfType([o.arrayOf(o.oneOfType([o.func, o.object, o.bool])), o.func, o.object]),
/**
* The value of the component. The DOM API casts this to a string.
* The browser uses "on" as the default value.
*/
value: o.any
});
const md = co(/* @__PURE__ */ S("path", {
d: "M15.41 16.09l-4.58-4.59 4.58-4.59L14 5.5l-6 6 6 6z"
}), "KeyboardArrowLeft"), pd = co(/* @__PURE__ */ S("path", {
d: "M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z"
}), "KeyboardArrowRight"), wi = /* @__PURE__ */ u.forwardRef(function(t, n) {
const {
backIconButtonProps: r,
count: l,
disabled: s = !1,
getItemAriaLabel: i,
nextIconButtonProps: a,
onPageChange: c,
page: f,
rowsPerPage: d,
showFirstButton: g,
showLastButton: m,
slots: p = {},
slotProps: C = {},
...y
} = t, b = Pt(), I = (G) => {
c(G, 0);
}, P = (G) => {
c(G, f - 1);
}, O = (G) => {
c(G, f + 1);
}, T = (G) => {
c(G, Math.max(0, Math.ceil(l / d) - 1));
}, R = p.firstButton ?? Kn, N = p.lastButton ?? Kn, $ = p.nextButton ?? Kn, x = p.previousButton ?? Kn, v = p.firstButtonIcon ?? nd, D = p.lastButtonIcon ?? od, M = p.nextButtonIcon ?? pd, H = p.previousButtonIcon ?? md, L = b ? N : R, V = b ? $ : x, k = b ? x : $, F = b ? R : N, E = b ? C.lastButton : C.firstButton, A = b ? C.nextButton : C.previousButton, q = b ? C.previousButton : C.nextButton, z = b ? C.firstButton : C.lastButton;
return /* @__PURE__ */ Ce("div", {
ref: n,
...y,
children: [g && /* @__PURE__ */ S(L, {
onClick: I,
disabled: s || f === 0,
"aria-label": i("first", f),
title: i("first", f),
...E,
children: b ? /* @__PURE__ */ S(D, {
...C.lastButtonIcon
}) : /* @__PURE__ */ S(v, {
...C.firstButtonIcon
})
}), /* @__PURE__ */ S(V, {
onClick: P,
disabled: s || f === 0,
color: "inherit",
"aria-label": i("previous", f),
title: i("previous", f),
...A ?? r,
children: b ? /* @__PURE__ */ S(M, {
...C.nextButtonIcon
}) : /* @__PURE__ */ S(H, {
...C.previousButtonIcon
})
}), /* @__PURE__ */ S(k, {
onClick: O,
disabled: s || (l !== -1 ? f >= Math.ceil(l / d) - 1 : !1),
color: "inherit",
"aria-label": i("next", f),
title: i("next", f),
...q ?? a,
children: b ? /* @__PURE__ */ S(H, {
...C.previousButtonIcon
}) : /* @__PURE__ */ S(M, {
...C.nextButtonIcon
})
}), m && /* @__PURE__ */ S(F, {
onClick: T,
disabled: s || f >= Math.ceil(l / d) - 1,
"aria-label": i("last", f),
title: i("last", f),
...z,
children: b ? /* @__PURE__ */ S(v, {
...C.firstButtonIcon
}) : /* @__PURE__ */ S(D, {
...C.lastButtonIcon
})
})]
});
});
Q.process.env.NODE_ENV !== "production" && (wi.propTypes = {
/**
* Props applied to the back arrow [`IconButton`](/material-ui/api/icon-button/) element.
*/
backIconButtonProps: o.object,
/**
* The total number of rows.
*/
count: o.number.isRequired,
/**
* If `true`, the component is disabled.
* @default false
*/
disabled: o.bool,
/**
* Accepts a function which returns a string value that provides a user-friendly name for the current page.
*
* For localization purposes, you can use the provided [translations](/material-ui/guides/localization/).
*
* @param {string} type The link or button type to format ('page' | 'first' | 'last' | 'next' | 'previous'). Defaults to 'page'.
* @param {number} page The page number to format.
* @returns {string}
*/
getItemAriaLabel: o.func.isRequired,
/**
* Props applied to the next arrow [`IconButton`](/material-ui/api/icon-button/) element.
*/
nextIconButtonProps: o.object,
/**
* Callback fired when the page is changed.
*
* @param {object} event The event source of the callback.
* @param {number} page The page selected.
*/
onPageChange: o.func.isRequired,
/**
* The zero-based index of the current page.
*/
page: o.number.isRequired,
/**
* The number of rows per page.
*/
rowsPerPage: o.number.isRequired,
/**
* If `true`, show the first-page button.
*/
showFirstButton: o.bool.isRequired,
/**
* If `true`, show the last-page button.
*/
showLastButton: o.bool.isRequired,
/**
* The props used for each slot inside the TablePaginationActions.
* @default {}
*/
slotProps: o.shape({
firstButton: o.object,
firstButtonIcon: o.object,
lastButton: o.object,
lastButtonIcon: o.object,
nextButton: o.object,
nextButtonIcon: o.object,
previousButton: o.object,
previousButtonIcon: o.object
}),
/**
* The components used for each slot inside the TablePaginationActions.
* Either a string to use a HTML element or a component.
* @default {}
*/
slots: o.shape({
firstButton: o.elementType,
firstButtonIcon: o.elementType,
lastButton: o.elementType,
lastButtonIcon: o.elementType,
nextButton: o.elementType,
nextButtonIcon: o.elementType,
previousButton: o.elementType,
previousButtonIcon: o.elementType
})
});
function bd(e) {
return io("MuiTablePagination", e);
}
const cn = Rn("MuiTablePagination", ["root", "toolbar", "spacer", "selectLabel", "selectRoot", "select", "selectIcon", "input", "menuItem", "displayedRows", "actions"]);
var Vl;
const Cd = Ie(Er, {
name: "MuiTablePagination",
slot: "Root"
})(ft(({
theme: e
}) => ({
overflow: "auto",
color: (e.vars || e).palette.text.primary,
fontSize: e.typography.pxToRem(14),
// Increase the specificity to override TableCell.
"&:last-child": {
padding: 0
}
}))), wd = Ie(gu, {
name: "MuiTablePagination",
slot: "Toolbar",
overridesResolver: (e, t) => ({
[`& .${cn.actions}`]: t.actions,
...t.toolbar
})
})(ft(({
theme: e
}) => ({
minHeight: 52,
paddingRight: 2,
[`${e.breakpoints.up("xs")} and (orientation: landscape)`]: {
minHeight: 52
},
[e.breakpoints.up("sm")]: {
minHeight: 52,
paddingRight: 2
},
[`& .${cn.actions}`]: {
flexShrink: 0,
marginLeft: 20
}
}))), yd = Ie("div", {
name: "MuiTablePagination",
slot: "Spacer"
})({
flex: "1 1 100%"
}), Sd = Ie("p", {
name: "MuiTablePagination",
slot: "SelectLabel"
})(ft(({
theme: e
}) => ({
...e.typography.body2,
flexShrink: 0
}))), vd = Ie(ai, {
name: "MuiTablePagination",
slot: "Select",
overridesResolver: (e, t) => ({
[`& .${cn.selectIcon}`]: t.selectIcon,
[`& .${cn.select}`]: t.select,
...t.input,
...t.selectRoot
})
})({
color: "inherit",
fontSize: "inherit",
flexShrink: 0,
marginRight: 32,
marginLeft: 8,
[`& .${cn.select}`]: {
paddingLeft: 8,
paddingRight: 24,
textAlign: "right",
textAlignLast: "right"
// Align <select> on Chrome.
}
}), Id = Ie(Jr, {
name: "MuiTablePagination",
slot: "MenuItem"
})({}), xd = Ie("p", {
name: "MuiTablePagination",
slot: "DisplayedRows"
})(ft(({
theme: e
}) => ({
...e.typography.body2,
flexShrink: 0
})));
function Pd({
from: e,
to: t,
count: n
}) {
return `${e}–${t} of ${n !== -1 ? n : `more than ${t}`}`;
}
function Md(e) {
return `Go to ${e} page`;
}
const Ed = (e) => {
const {
classes: t
} = e;
return we({
root: ["root"],
toolbar: ["toolbar"],
spacer: ["spacer"],
selectLabel: ["selectLabel"],
select: ["select"],
input: ["input"],
selectIcon: ["selectIcon"],
menuItem: ["menuItem"],
displayedRows: ["displayedRows"],
actions: ["actions"]
}, bd, t);
}, yi = /* @__PURE__ */ u.forwardRef(function(t, n) {
const r = Hn({
props: t,
name: "MuiTablePagination"
}), {
ActionsComponent: l = wi,
backIconButtonProps: s,
colSpan: i,
component: a = Er,
count: c,
disabled: f = !1,
getItemAriaLabel: d = Md,
labelDisplayedRows: g = Pd,
labelRowsPerPage: m = "Rows per page:",
nextIconButtonProps: p,
onPageChange: C,
onRowsPerPageChange: y,
page: b,
rowsPerPage: I,
rowsPerPageOptions: P = [10, 25, 50, 100],
SelectProps: O = {},
showFirstButton: T = !1,
showLastButton: R = !1,
slotProps: N = {},
slots: $ = {},
...x
} = r, v = r, D = Ed(v), M = (N == null ? void 0 : N.select) ?? O, H = M.native ? "option" : Id;
let L;
(a === Er || a === "td") && (L = i || 1e3);
const V = Ve(M.id), k = Ve(M.labelId), F = () => c === -1 ? (b + 1) * I : I === -1 ? c : Math.min(c, (b + 1) * I), E = {
slots: $,
slotProps: N
}, [A, q] = ht("root", {
ref: n,
className: D.root,
elementType: Cd,
externalForwardedProps: {
...E,
component: a,
...x
},
ownerState: v,
additionalProps: {
colSpan: L
}
}), [z, G] = ht("toolbar", {
className: D.toolbar,
elementType: wd,
externalForwardedProps: E,
ownerState: v
}), [B, K] = ht("spacer", {
className: D.spacer,
elementType: yd,
externalForwardedProps: E,
ownerState: v
}), [X, re] = ht("selectLabel", {
className: D.selectLabel,
elementType: Sd,
externalForwardedProps: E,
ownerState: v,
additionalProps: {
id: k
}
}), [Y, ue] = ht("select", {
className: D.select,
elementType: vd,
externalForwardedProps: E,
ownerState: v
}), [ce, _] = ht("menuItem", {
className: D.menuItem,
elementType: H,
externalForwardedProps: E,
ownerState: v
}), [W, ne] = ht("displayedRows", {
className: D.displayedRows,
elementType: xd,
externalForwardedProps: E,
ownerState: v
});
return /* @__PURE__ */ S(A, {
...q,
children: /* @__PURE__ */ Ce(z, {
...G,
children: [/* @__PURE__ */ S(B, {
...K
}), P.length > 1 && /* @__PURE__ */ S(X, {
...re,
children: m
}), P.length > 1 && /* @__PURE__ */ S(Y, {
variant: "standard",
...!M.variant && {
input: Vl || (Vl = /* @__PURE__ */ S(ii, {}))
},
value: I,
onChange: y,
id: V,
labelId: k,
...M,
classes: {
...M.classes,
// TODO v5 remove `classes.input`
root: Se(D.input, D.selectRoot, (M.classes || {}).root),
select: Se(D.select, (M.classes || {}).select),
// TODO v5 remove `selectIcon`
icon: Se(D.selectIcon, (M.classes || {}).icon)
},
disabled: f,
...ue,
children: P.map((J) => /* @__PURE__ */ Pn(ce, {
..._,
key: J.label ? J.label : J,
value: J.value ? J.value : J
}, J.label ? J.label : J))
}), /* @__PURE__ */ S(W, {
...ne,
children: g({
from: c === 0 ? 0 : b * I + 1,
to: F(),
count: c === -1 ? -1 : c,
page: b
})
}), /* @__PURE__ */ S(l, {
className: D.actions,
backIconButtonProps: s,
count: c,
nextIconButtonProps: p,
onPageChange: C,
page: b,
rowsPerPage: I,
showFirstButton: T,
showLastButton: R,
slotProps: N.actions,
slots: $.actions,
getItemAriaLabel: d,
disabled: f
})]
})
});
});
Q.process.env.NODE_ENV !== "production" && (yi.propTypes = {
// ┌────────────────────────────── Warning ──────────────────────────────┐
// │ These PropTypes are generated from the TypeScript type definitions. │
// │ To update them, edit the d.ts file and run `pnpm proptypes`. │
// └─────────────────────────────────────────────────────────────────────┘
/**
* The component used for displaying the actions.
* Eit