@weng-lab/ui-components 2.0.0 → 2.0.2

package/dist/ui-components.es24.js

@@ -1,165 +1,664 @@
-import { j as l } from "./ui-components.es12.js";
-import { c as de } from "./ui-components.es13.js";
-import { Box as fe, Divider as me, Typography as ge, IconButton as pe, Tooltip as he, DialogTitle as ue, Checkbox as X, FormControlLabel as Y, DialogContent as xe, Stack as be, Button as Z, DialogActions as je, Dialog as Ce } from "@mui/material";
-import { useState as S } from "react";
-import { Download as _e } from "@mui/icons-material";
-import { ontologyDownloadMap as we } from "./ui-components.es79.js";
-import { formatFileSize as ee, fetchFileSize as le } from "./ui-components.es23.js";
-import { useDownloadContext as De } from "./ui-components.es22.js";
-const ke = (n) => {
-  const e = n.toLowerCase().replace(/\s+/g, "_");
-  return we[e] ?? [];
-}, Oe = (n) => {
-  const e = de.c(66), {
-    ontology: o
-  } = n, [I, F] = S(!1), [c, te] = S(!1), [r, oe] = S(!1), [D, ne] = S(null), [k, ie] = S(null), {
-    onDownload: A
-  } = De();
-  let t, i, E;
-  e[0] !== o ? (t = ke(o), i = t.find(ye)?.filename ?? void 0, E = t.find(Se)?.filename ?? void 0, e[0] = o, e[1] = t, e[2] = i, e[3] = E) : (t = e[1], i = e[2], E = e[3]);
-  const a = E;
-  let v;
-  e[4] !== a || e[5] !== k || e[6] !== i || e[7] !== D ? (v = () => {
-    i && !D && le(`https://downloads.wenglab.org/${i}`, ne), a && !k && le(`https://downloads.wenglab.org/${a}`, ie), F(!0);
-  }, e[4] = a, e[5] = k, e[6] = i, e[7] = D, e[8] = v) : v = e[8];
-  const U = v;
-  let $;
-  e[9] !== r || e[10] !== a || e[11] !== t || e[12] !== i || e[13] !== c || e[14] !== A || e[15] !== o ? ($ = () => {
-    if (!t || t.length === 0)
-      return;
-    const s = [];
-    c && i && s.push({
-      filename: i,
-      label: "excluding_cancer_cell_lines"
-    }), r && a && s.push({
-      filename: a,
-      label: "all_biosamples"
-    }), s.forEach((se, ae) => {
-      const {
-        filename: V,
-        label: ce
-      } = se, W = `https://downloads.wenglab.org/${V}`;
-      setTimeout(() => {
-        if (A) {
-          const re = `${o}_aggregate_ccres_${ce}`;
-          A(W, re);
+import * as C from "react";
+import t from "./ui-components.es81.js";
+import { clsx as N } from "./ui-components.es82.js";
+import U from "./ui-components.es142.js";
+import A from "./ui-components.es86.js";
+import _ from "./ui-components.es89.js";
+import p, { getButtonUtilityClass as q } from "./ui-components.es143.js";
+import J from "./ui-components.es144.js";
+import K from "./ui-components.es145.js";
+import { j as e } from "./ui-components.es12.js";
+import Q from "./ui-components.es146.js";
+import { useDefaultProps as X } from "./ui-components.es92.js";
+import Y from "./ui-components.es109.js";
+import y from "./ui-components.es25.js";
+import r from "./ui-components.es94.js";
+import Z from "./ui-components.es95.js";
+import oo from "./ui-components.es147.js";
+import to from "./ui-components.es148.js";
+import { alpha as f } from "./ui-components.es42.js";
+const ao = (o) => {
+  const {
+    color: a,
+    disableElevation: n,
+    fullWidth: i,
+    size: c,
+    variant: g,
+    loading: u,
+    loadingPosition: m,
+    classes: b
+  } = o, x = {
+    root: ["root", u && "loading", g, `${g}${r(a)}`, `size${r(c)}`, `${g}Size${r(c)}`, `color${r(a)}`, n && "disableElevation", i && "fullWidth", u && `loadingPosition${r(m)}`],
+    startIcon: ["icon", "startIcon", `iconSize${r(c)}`],
+    endIcon: ["icon", "endIcon", `iconSize${r(c)}`],
+    loadingIndicator: ["loadingIndicator"],
+    loadingWrapper: ["loadingWrapper"]
+  }, B = Z(x, q, b);
+  return {
+    ...b,
+    // forward the focused, disabled, etc. classes to the ButtonBase
+    ...B
+  };
+}, W = [{
+  props: {
+    size: "small"
+  },
+  style: {
+    "& > *:nth-of-type(1)": {
+      fontSize: 18
+    }
+  }
+}, {
+  props: {
+    size: "medium"
+  },
+  style: {
+    "& > *:nth-of-type(1)": {
+      fontSize: 20
+    }
+  }
+}, {
+  props: {
+    size: "large"
+  },
+  style: {
+    "& > *:nth-of-type(1)": {
+      fontSize: 22
+    }
+  }
+}], no = y(oo, {
+  shouldForwardProp: (o) => U(o) || o === "classes",
+  name: "MuiButton",
+  slot: "Root",
+  overridesResolver: (o, a) => {
+    const {
+      ownerState: n
+    } = o;
+    return [a.root, a[n.variant], a[`${n.variant}${r(n.color)}`], a[`size${r(n.size)}`], a[`${n.variant}Size${r(n.size)}`], n.color === "inherit" && a.colorInherit, n.disableElevation && a.disableElevation, n.fullWidth && a.fullWidth, n.loading && a.loading];
+  }
+})(A(({
+  theme: o
+}) => {
+  const a = o.palette.mode === "light" ? o.palette.grey[300] : o.palette.grey[800], n = o.palette.mode === "light" ? o.palette.grey.A100 : o.palette.grey[700];
+  return {
+    ...o.typography.button,
+    minWidth: 64,
+    padding: "6px 16px",
+    border: 0,
+    borderRadius: (o.vars || o).shape.borderRadius,
+    transition: o.transitions.create(["background-color", "box-shadow", "border-color", "color"], {
+      duration: o.transitions.duration.short
+    }),
+    "&:hover": {
+      textDecoration: "none"
+    },
+    [`&.${p.disabled}`]: {
+      color: (o.vars || o).palette.action.disabled
+    },
+    variants: [{
+      props: {
+        variant: "contained"
+      },
+      style: {
+        color: "var(--variant-containedColor)",
+        backgroundColor: "var(--variant-containedBg)",
+        boxShadow: (o.vars || o).shadows[2],
+        "&:hover": {
+          boxShadow: (o.vars || o).shadows[4],
+          // Reset on touch devices, it doesn't add specificity
+          "@media (hover: none)": {
+            boxShadow: (o.vars || o).shadows[2]
+          }
+        },
+        "&:active": {
+          boxShadow: (o.vars || o).shadows[8]
+        },
+        [`&.${p.focusVisible}`]: {
+          boxShadow: (o.vars || o).shadows[6]
+        },
+        [`&.${p.disabled}`]: {
+          color: (o.vars || o).palette.action.disabled,
+          boxShadow: (o.vars || o).shadows[0],
+          backgroundColor: (o.vars || o).palette.action.disabledBackground
+        }
+      }
+    }, {
+      props: {
+        variant: "outlined"
+      },
+      style: {
+        padding: "5px 15px",
+        border: "1px solid currentColor",
+        borderColor: "var(--variant-outlinedBorder, currentColor)",
+        backgroundColor: "var(--variant-outlinedBg)",
+        color: "var(--variant-outlinedColor)",
+        [`&.${p.disabled}`]: {
+          border: `1px solid ${(o.vars || o).palette.action.disabledBackground}`
+        }
+      }
+    }, {
+      props: {
+        variant: "text"
+      },
+      style: {
+        padding: "6px 8px",
+        color: "var(--variant-textColor)",
+        backgroundColor: "var(--variant-textBg)"
+      }
+    }, ...Object.entries(o.palette).filter(_()).map(([i]) => ({
+      props: {
+        color: i
+      },
+      style: {
+        "--variant-textColor": (o.vars || o).palette[i].main,
+        "--variant-outlinedColor": (o.vars || o).palette[i].main,
+        "--variant-outlinedBorder": o.vars ? `rgba(${o.vars.palette[i].mainChannel} / 0.5)` : f(o.palette[i].main, 0.5),
+        "--variant-containedColor": (o.vars || o).palette[i].contrastText,
+        "--variant-containedBg": (o.vars || o).palette[i].main,
+        "@media (hover: hover)": {
+          "&:hover": {
+            "--variant-containedBg": (o.vars || o).palette[i].dark,
+            "--variant-textBg": o.vars ? `rgba(${o.vars.palette[i].mainChannel} / ${o.vars.palette.action.hoverOpacity})` : f(o.palette[i].main, o.palette.action.hoverOpacity),
+            "--variant-outlinedBorder": (o.vars || o).palette[i].main,
+            "--variant-outlinedBg": o.vars ? `rgba(${o.vars.palette[i].mainChannel} / ${o.vars.palette.action.hoverOpacity})` : f(o.palette[i].main, o.palette.action.hoverOpacity)
+          }
+        }
+      }
+    })), {
+      props: {
+        color: "inherit"
+      },
+      style: {
+        color: "inherit",
+        borderColor: "currentColor",
+        "--variant-containedBg": o.vars ? o.vars.palette.Button.inheritContainedBg : a,
+        "@media (hover: hover)": {
+          "&:hover": {
+            "--variant-containedBg": o.vars ? o.vars.palette.Button.inheritContainedHoverBg : n,
+            "--variant-textBg": o.vars ? `rgba(${o.vars.palette.text.primaryChannel} / ${o.vars.palette.action.hoverOpacity})` : f(o.palette.text.primary, o.palette.action.hoverOpacity),
+            "--variant-outlinedBg": o.vars ? `rgba(${o.vars.palette.text.primaryChannel} / ${o.vars.palette.action.hoverOpacity})` : f(o.palette.text.primary, o.palette.action.hoverOpacity)
+          }
         }
-        const y = document.createElement("a");
-        y.href = W, y.download = V, document.body.appendChild(y), y.click(), document.body.removeChild(y);
-      }, ae * 500);
-    });
-  }, e[9] = r, e[10] = a, e[11] = t, e[12] = i, e[13] = c, e[14] = A, e[15] = o, e[16] = $) : $ = e[16];
-  const M = $;
-  let d;
-  e[17] !== t || e[18] !== o ? (d = t.length === 0 ? "No Aggregate cCRE Download Options" : /* @__PURE__ */ l.jsxs(fe, { children: [
-    "Download cCREs in ",
-    o.charAt(0).toUpperCase() + o.slice(1),
-    ":",
-    /* @__PURE__ */ l.jsx("ul", { style: {
-      margin: 0,
-      paddingLeft: 16
-    }, children: t.map(Fe) }),
-    "(Opens Download Dialog)"
-  ] }), e[17] = t, e[18] = o, e[19] = d) : d = e[19];
-  let f;
-  e[20] !== U ? (f = (s) => {
-    s.stopPropagation(), U();
-  }, e[20] = U, e[21] = f) : f = e[21];
-  const q = t.length === 0;
-  let R;
-  e[22] === Symbol.for("react.memo_cache_sentinel") ? (R = /* @__PURE__ */ l.jsx(_e, {}), e[22] = R) : R = e[22];
-  let m;
-  e[23] !== f || e[24] !== q ? (m = /* @__PURE__ */ l.jsx("span", { children: /* @__PURE__ */ l.jsx(pe, { onClick: f, disabled: q, children: R }) }), e[23] = f, e[24] = q, e[25] = m) : m = e[25];
-  let g;
-  e[26] !== d || e[27] !== m ? (g = /* @__PURE__ */ l.jsx(he, { title: d, placement: "left", arrow: !0, children: m }), e[26] = d, e[27] = m, e[28] = g) : g = e[28];
-  let T;
-  e[29] === Symbol.for("react.memo_cache_sentinel") ? (T = (s) => {
-    s.stopPropagation(), F(!1);
-  }, e[29] = T) : T = e[29];
-  let z;
-  e[30] === Symbol.for("react.memo_cache_sentinel") ? (z = {
-    backdrop: {
-      sx: {
-        backgroundColor: "rgba(255, 255, 255, 0.1)",
-        backdropFilter: "blur(2px)"
       }
+    }, {
+      props: {
+        size: "small",
+        variant: "text"
+      },
+      style: {
+        padding: "4px 5px",
+        fontSize: o.typography.pxToRem(13)
+      }
+    }, {
+      props: {
+        size: "large",
+        variant: "text"
+      },
+      style: {
+        padding: "8px 11px",
+        fontSize: o.typography.pxToRem(15)
+      }
+    }, {
+      props: {
+        size: "small",
+        variant: "outlined"
+      },
+      style: {
+        padding: "3px 9px",
+        fontSize: o.typography.pxToRem(13)
+      }
+    }, {
+      props: {
+        size: "large",
+        variant: "outlined"
+      },
+      style: {
+        padding: "7px 21px",
+        fontSize: o.typography.pxToRem(15)
+      }
+    }, {
+      props: {
+        size: "small",
+        variant: "contained"
+      },
+      style: {
+        padding: "4px 10px",
+        fontSize: o.typography.pxToRem(13)
+      }
+    }, {
+      props: {
+        size: "large",
+        variant: "contained"
+      },
+      style: {
+        padding: "8px 22px",
+        fontSize: o.typography.pxToRem(15)
+      }
+    }, {
+      props: {
+        disableElevation: !0
+      },
+      style: {
+        boxShadow: "none",
+        "&:hover": {
+          boxShadow: "none"
+        },
+        [`&.${p.focusVisible}`]: {
+          boxShadow: "none"
+        },
+        "&:active": {
+          boxShadow: "none"
+        },
+        [`&.${p.disabled}`]: {
+          boxShadow: "none"
+        }
+      }
+    }, {
+      props: {
+        fullWidth: !0
+      },
+      style: {
+        width: "100%"
+      }
+    }, {
+      props: {
+        loadingPosition: "center"
+      },
+      style: {
+        transition: o.transitions.create(["background-color", "box-shadow", "border-color"], {
+          duration: o.transitions.duration.short
+        }),
+        [`&.${p.loading}`]: {
+          color: "transparent"
+        }
+      }
+    }]
+  };
+})), io = y("span", {
+  name: "MuiButton",
+  slot: "StartIcon",
+  overridesResolver: (o, a) => {
+    const {
+      ownerState: n
+    } = o;
+    return [a.startIcon, n.loading && a.startIconLoadingStart, a[`iconSize${r(n.size)}`]];
+  }
+})(({
+  theme: o
+}) => ({
+  display: "inherit",
+  marginRight: 8,
+  marginLeft: -4,
+  variants: [{
+    props: {
+      size: "small"
+    },
+    style: {
+      marginLeft: -2
     }
-  }, e[30] = z) : z = e[30];
-  let B;
-  e[31] !== o ? (B = o.charAt(0).toUpperCase(), e[31] = o, e[32] = B) : B = e[32];
-  const G = B + o.slice(1);
-  let p;
-  e[33] !== G ? (p = /* @__PURE__ */ l.jsxs(ue, { id: "export-dialog-title", children: [
-    "Download cCREs in ",
-    G,
-    ":"
-  ] }), e[33] = G, e[34] = p) : p = e[34];
-  let L;
-  e[35] === Symbol.for("react.memo_cache_sentinel") ? (L = (s) => oe(s.target.checked), e[35] = L) : L = e[35];
-  const H = !a;
-  let h;
-  e[36] !== r || e[37] !== H ? (h = /* @__PURE__ */ l.jsx(X, { checked: r, onChange: L, disabled: H }), e[36] = r, e[37] = H, e[38] = h) : h = e[38];
-  const J = `Aggregate cCREs (all biosamples)${k ? " - " + ee(k) : ""}`;
-  let u;
-  e[39] !== h || e[40] !== J ? (u = /* @__PURE__ */ l.jsx(Y, { control: h, label: J }), e[39] = h, e[40] = J, e[41] = u) : u = e[41];
-  let O;
-  e[42] === Symbol.for("react.memo_cache_sentinel") ? (O = (s) => te(s.target.checked), e[42] = O) : O = e[42];
-  const K = !i;
-  let x;
-  e[43] !== c || e[44] !== K ? (x = /* @__PURE__ */ l.jsx(X, { checked: c, onChange: O, disabled: K }), e[43] = c, e[44] = K, e[45] = x) : x = e[45];
-  const Q = `Aggregate cCREs (excluding cancer cell lines)${D ? " - " + ee(D) : ""}`;
-  let b;
-  e[46] !== x || e[47] !== Q ? (b = /* @__PURE__ */ l.jsx(Y, { control: x, label: Q }), e[46] = x, e[47] = Q, e[48] = b) : b = e[48];
-  let j;
-  e[49] !== t.length ? (j = t.length <= 1 && /* @__PURE__ */ l.jsxs(l.Fragment, { children: [
-    /* @__PURE__ */ l.jsx(me, { sx: {
-      marginTop: 1
-    } }),
-    /* @__PURE__ */ l.jsx(ge, { marginTop: 1, children: /* @__PURE__ */ l.jsx("strong", { children: "No cancerous cell lines available in this tissue" }) })
-  ] }), e[49] = t.length, e[50] = j) : j = e[50];
-  let C;
-  e[51] !== u || e[52] !== b || e[53] !== j ? (C = /* @__PURE__ */ l.jsx(xe, { children: /* @__PURE__ */ l.jsxs(be, { children: [
-    u,
-    b,
-    j
-  ] }) }), e[51] = u, e[52] = b, e[53] = j, e[54] = C) : C = e[54];
-  let N;
-  e[55] === Symbol.for("react.memo_cache_sentinel") ? (N = /* @__PURE__ */ l.jsx(Z, { onClick: () => {
-    F(!1);
-  }, children: "Cancel" }), e[55] = N) : N = e[55];
-  let _;
-  e[56] !== M ? (_ = /* @__PURE__ */ l.jsxs(je, { children: [
-    N,
-    /* @__PURE__ */ l.jsx(Z, { variant: "contained", onClick: () => {
-      M(), F(!1);
-    }, children: "Download" })
-  ] }), e[56] = M, e[57] = _) : _ = e[57];
-  let w;
-  e[58] !== I || e[59] !== p || e[60] !== C || e[61] !== _ ? (w = /* @__PURE__ */ l.jsxs(Ce, { open: I, onClose: T, "aria-labelledby": "export-dialog-title", disableScrollLock: !0, slotProps: z, onClick: Ae, children: [
-    p,
-    C,
-    _
-  ] }), e[58] = I, e[59] = p, e[60] = C, e[61] = _, e[62] = w) : w = e[62];
-  let P;
-  return e[63] !== w || e[64] !== g ? (P = /* @__PURE__ */ l.jsxs(l.Fragment, { children: [
-    g,
-    w
-  ] }), e[63] = w, e[64] = g, e[65] = P) : P = e[65], P;
-};
-function ye(n) {
-  return n.label === "Excluding Cancer Cell Lines";
-}
-function Se(n) {
-  return n.label === "All Biosamples";
-}
-function Fe(n) {
-  return /* @__PURE__ */ l.jsx("li", { children: n.label }, n.filename);
-}
-function Ae(n) {
-  return n.stopPropagation();
-}
+  }, {
+    props: {
+      loadingPosition: "start",
+      loading: !0
+    },
+    style: {
+      transition: o.transitions.create(["opacity"], {
+        duration: o.transitions.duration.short
+      }),
+      opacity: 0
+    }
+  }, {
+    props: {
+      loadingPosition: "start",
+      loading: !0,
+      fullWidth: !0
+    },
+    style: {
+      marginRight: -8
+    }
+  }, ...W]
+})), ro = y("span", {
+  name: "MuiButton",
+  slot: "EndIcon",
+  overridesResolver: (o, a) => {
+    const {
+      ownerState: n
+    } = o;
+    return [a.endIcon, n.loading && a.endIconLoadingEnd, a[`iconSize${r(n.size)}`]];
+  }
+})(({
+  theme: o
+}) => ({
+  display: "inherit",
+  marginRight: -4,
+  marginLeft: 8,
+  variants: [{
+    props: {
+      size: "small"
+    },
+    style: {
+      marginRight: -2
+    }
+  }, {
+    props: {
+      loadingPosition: "end",
+      loading: !0
+    },
+    style: {
+      transition: o.transitions.create(["opacity"], {
+        duration: o.transitions.duration.short
+      }),
+      opacity: 0
+    }
+  }, {
+    props: {
+      loadingPosition: "end",
+      loading: !0,
+      fullWidth: !0
+    },
+    style: {
+      marginLeft: -8
+    }
+  }, ...W]
+})), so = y("span", {
+  name: "MuiButton",
+  slot: "LoadingIndicator"
+})(({
+  theme: o
+}) => ({
+  display: "none",
+  position: "absolute",
+  visibility: "visible",
+  variants: [{
+    props: {
+      loading: !0
+    },
+    style: {
+      display: "flex"
+    }
+  }, {
+    props: {
+      loadingPosition: "start"
+    },
+    style: {
+      left: 14
+    }
+  }, {
+    props: {
+      loadingPosition: "start",
+      size: "small"
+    },
+    style: {
+      left: 10
+    }
+  }, {
+    props: {
+      variant: "text",
+      loadingPosition: "start"
+    },
+    style: {
+      left: 6
+    }
+  }, {
+    props: {
+      loadingPosition: "center"
+    },
+    style: {
+      left: "50%",
+      transform: "translate(-50%)",
+      color: (o.vars || o).palette.action.disabled
+    }
+  }, {
+    props: {
+      loadingPosition: "end"
+    },
+    style: {
+      right: 14
+    }
+  }, {
+    props: {
+      loadingPosition: "end",
+      size: "small"
+    },
+    style: {
+      right: 10
+    }
+  }, {
+    props: {
+      variant: "text",
+      loadingPosition: "end"
+    },
+    style: {
+      right: 6
+    }
+  }, {
+    props: {
+      loadingPosition: "start",
+      fullWidth: !0
+    },
+    style: {
+      position: "relative",
+      left: -10
+    }
+  }, {
+    props: {
+      loadingPosition: "end",
+      fullWidth: !0
+    },
+    style: {
+      position: "relative",
+      right: -10
+    }
+  }]
+})), T = y("span", {
+  name: "MuiButton",
+  slot: "LoadingIconPlaceholder"
+})({
+  display: "inline-block",
+  width: "1em",
+  height: "1em"
+}), eo = /* @__PURE__ */ C.forwardRef(function(a, n) {
+  const i = C.useContext(J), c = C.useContext(K), g = Q(i, a), u = X({
+    props: g,
+    name: "MuiButton"
+  }), {
+    children: m,
+    color: b = "primary",
+    component: x = "button",
+    className: B,
+    disabled: S = !1,
+    disableElevation: j = !1,
+    disableFocusRipple: z = !1,
+    endIcon: I,
+    focusVisibleClassName: E,
+    fullWidth: k = !1,
+    id: P,
+    loading: l = null,
+    loadingIndicator: L,
+    loadingPosition: v = "center",
+    size: V = "medium",
+    startIcon: w,
+    type: $,
+    variant: M = "text",
+    ...F
+  } = u, h = Y(P), R = L ?? /* @__PURE__ */ e.jsx(to, {
+    "aria-labelledby": h,
+    color: "inherit",
+    size: 16
+  }), d = {
+    ...u,
+    color: b,
+    component: x,
+    disabled: S,
+    disableElevation: j,
+    disableFocusRipple: z,
+    fullWidth: k,
+    loading: l,
+    loadingIndicator: R,
+    loadingPosition: v,
+    size: V,
+    type: $,
+    variant: M
+  }, s = ao(d), D = (w || l && v === "start") && /* @__PURE__ */ e.jsx(io, {
+    className: s.startIcon,
+    ownerState: d,
+    children: w || /* @__PURE__ */ e.jsx(T, {
+      className: s.loadingIconPlaceholder,
+      ownerState: d
+    })
+  }), G = (I || l && v === "end") && /* @__PURE__ */ e.jsx(ro, {
+    className: s.endIcon,
+    ownerState: d,
+    children: I || /* @__PURE__ */ e.jsx(T, {
+      className: s.loadingIconPlaceholder,
+      ownerState: d
+    })
+  }), H = c || "", O = typeof l == "boolean" ? (
+    // use plain HTML span to minimize the runtime overhead
+    /* @__PURE__ */ e.jsx("span", {
+      className: s.loadingWrapper,
+      style: {
+        display: "contents"
+      },
+      children: l && /* @__PURE__ */ e.jsx(so, {
+        className: s.loadingIndicator,
+        ownerState: d,
+        children: R
+      })
+    })
+  ) : null;
+  return /* @__PURE__ */ e.jsxs(no, {
+    ownerState: d,
+    className: N(i.className, s.root, B, H),
+    component: x,
+    disabled: S || l,
+    focusRipple: !z,
+    focusVisibleClassName: N(s.focusVisible, E),
+    ref: n,
+    type: $,
+    id: l ? h : P,
+    ...F,
+    classes: s,
+    children: [D, v !== "end" && O, m, v === "end" && O, G]
+  });
+});
+process.env.NODE_ENV !== "production" && (eo.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: t.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: t.object,
+  /**
+   * @ignore
+   */
+  className: t.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: t.oneOfType([t.oneOf(["inherit", "primary", "secondary", "success", "error", "info", "warning"]), t.string]),
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: t.elementType,
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: t.bool,
+  /**
+   * If `true`, no elevation is used.
+   * @default false
+   */
+  disableElevation: t.bool,
+  /**
+   * If `true`, the  keyboard focus ripple is disabled.
+   * @default false
+   */
+  disableFocusRipple: t.bool,
+  /**
+   * If `true`, the ripple effect is disabled.
+   *
+   * ⚠️ Without a ripple there is no styling for :focus-visible by default. Be sure
+   * to highlight the element by applying separate styles with the `.Mui-focusVisible` class.
+   * @default false
+   */
+  disableRipple: t.bool,
+  /**
+   * Element placed after the children.
+   */
+  endIcon: t.node,
+  /**
+   * @ignore
+   */
+  focusVisibleClassName: t.string,
+  /**
+   * If `true`, the button will take up the full width of its container.
+   * @default false
+   */
+  fullWidth: t.bool,
+  /**
+   * The URL to link to when the button is clicked.
+   * If defined, an `a` element will be used as the root node.
+   */
+  href: t.string,
+  /**
+   * @ignore
+   */
+  id: t.string,
+  /**
+   * If `true`, the loading indicator is visible and the button is disabled.
+   * If `true | false`, the loading wrapper is always rendered before the children to prevent [Google Translation Crash](https://github.com/mui/material-ui/issues/27853).
+   * @default null
+   */
+  loading: t.bool,
+  /**
+   * Element placed before the children if the button is in loading state.
+   * The node should contain an element with `role="progressbar"` with an accessible name.
+   * By default, it renders a `CircularProgress` that is labeled by the button itself.
+   * @default <CircularProgress color="inherit" size={16} />
+   */
+  loadingIndicator: t.node,
+  /**
+   * The loading indicator can be positioned on the start, end, or the center of the button.
+   * @default 'center'
+   */
+  loadingPosition: t.oneOf(["center", "end", "start"]),
+  /**
+   * The size of the component.
+   * `small` is equivalent to the dense button styling.
+   * @default 'medium'
+   */
+  size: t.oneOfType([t.oneOf(["small", "medium", "large"]), t.string]),
+  /**
+   * Element placed before the children.
+   */
+  startIcon: t.node,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: t.oneOfType([t.arrayOf(t.oneOfType([t.func, t.object, t.bool])), t.func, t.object]),
+  /**
+   * @ignore
+   */
+  type: t.oneOfType([t.oneOf(["button", "reset", "submit"]), t.string]),
+  /**
+   * The variant to use.
+   * @default 'text'
+   */
+  variant: t.oneOfType([t.oneOf(["contained", "outlined", "text"]), t.string])
+});
 export {
-  Oe as AggregateDownloadButton,
-  ke as getAvailableFiles
+  eo as default
 };
 //# sourceMappingURL=ui-components.es24.js.map