@weng-lab/ui-components 2.2.4 → 3.0.0-beta.0

package/dist/ui-components.es58.js

@@ -1,73 +1,256 @@
-import { j as t } from "./ui-components.es15.js";
-import { c as S } from "./ui-components.es17.js";
-import { Stack as D, Typography as y, IconButton as C, Divider as v, Box as g, Button as _, Modal as k } from "@mui/material";
-import G from "./ui-components.es21.js";
-const P = (o) => {
-  const e = S.c(24), {
-    open: h,
-    onClose: l,
-    onDownloadSVG: b,
-    onDownloadPNG: u,
-    plotTitle: j
-  } = o;
-  let n;
-  e[0] !== u ? (n = {
-    label: "PNG",
-    action: u
-  }, e[0] = u, e[1] = n) : n = e[1];
-  let r;
-  e[2] !== b ? (r = {
-    label: "SVG",
-    action: b
-  }, e[2] = b, e[3] = r) : r = e[3];
-  let d;
-  e[4] !== n || e[5] !== r ? (d = [n, r].filter(I), e[4] = n, e[5] = r, e[6] = d) : d = e[6];
-  const w = d;
-  let m;
-  e[7] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (m = {
-    position: "absolute",
-    top: "50%",
-    left: "50%",
-    transform: "translate(-50%, -50%)",
-    bgcolor: "background.paper",
-    boxShadow: 24,
-    borderRadius: 2,
-    p: 3,
-    width: 360
-  }, e[7] = m) : m = e[7];
-  let i;
-  e[8] !== j ? (i = /* @__PURE__ */ t.jsxs(y, { variant: "h6", fontWeight: 600, mb: 1, children: [
-    "Download ",
-    j
-  ] }), e[8] = j, e[9] = i) : i = e[9];
-  let f;
-  e[10] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (f = /* @__PURE__ */ t.jsx(y, { variant: "body2", color: "text.secondary", mb: 2, children: "Choose a file format to export your plot." }), e[10] = f) : f = e[10];
-  let p;
-  e[11] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (p = /* @__PURE__ */ t.jsx(v, { flexItem: !0 }), e[11] = p) : p = e[11];
-  let a;
-  e[12] !== w ? (a = /* @__PURE__ */ t.jsx(D, { spacing: 1.5, divider: p, children: w.map(B) }), e[12] = w, e[13] = a) : a = e[13];
-  let s;
-  e[14] !== l ? (s = /* @__PURE__ */ t.jsx(g, { mt: 3, textAlign: "right", children: /* @__PURE__ */ t.jsx(_, { onClick: l, children: "Close" }) }), e[14] = l, e[15] = s) : s = e[15];
-  let c;
-  e[16] !== i || e[17] !== a || e[18] !== s ? (c = /* @__PURE__ */ t.jsxs(g, { sx: m, children: [
-    i,
-    f,
-    a,
-    s
-  ] }), e[16] = i, e[17] = a, e[18] = s, e[19] = c) : c = e[19];
-  let x;
-  return e[20] !== l || e[21] !== h || e[22] !== c ? (x = /* @__PURE__ */ t.jsx(k, { open: h, onClose: l, children: c }), e[20] = l, e[21] = h, e[22] = c, e[23] = x) : x = e[23], x;
-};
-function I(o) {
-  return o.action;
-}
-function B(o) {
-  return /* @__PURE__ */ t.jsxs(D, { direction: "row", alignItems: "center", justifyContent: "space-between", children: [
-    /* @__PURE__ */ t.jsx(y, { variant: "body1", children: o.label }),
-    /* @__PURE__ */ t.jsx(C, { color: "primary", onClick: o.action, "aria-label": `Download ${o.label}`, children: /* @__PURE__ */ t.jsx(G, {}) })
-  ] }, o.label);
-}
+import * as v from "react";
+import { clsx as w } from "./ui-components.es94.js";
+import t from "./ui-components.es89.js";
+import C from "./ui-components.es95.js";
+import { getSkeletonUtilityClass as k } from "./ui-components.es96.js";
+import { j as x } from "./ui-components.es15.js";
+import R from "./ui-components.es34.js";
+import { getUnit as O, toUnitless as T } from "./ui-components.es97.js";
+import { useDefaultProps as $ } from "./ui-components.es92.js";
+import S from "./ui-components.es98.js";
+import { keyframes as f, css as h } from "@emotion/react";
+const j = (e) => {
+  const {
+    classes: n,
+    variant: o,
+    animation: a,
+    hasChildren: r,
+    width: s,
+    height: i
+  } = e;
+  return S({
+    root: ["root", o, a, r && "withChildren", r && !s && "fitContent", r && !i && "heightAuto"]
+  }, k, n);
+}, l = f`
+  0% {
+    opacity: 1;
+  }
+
+  50% {
+    opacity: 0.4;
+  }
+
+  100% {
+    opacity: 1;
+  }
+`, p = f`
+  0% {
+    transform: translateX(-100%);
+  }
+
+  50% {
+    /* +0.5s of delay between each loop */
+    transform: translateX(100%);
+  }
+
+  100% {
+    transform: translateX(100%);
+  }
+`, N = typeof l != "string" ? h`
+        animation: ${l} 2s ease-in-out 0.5s infinite;
+      ` : null, U = typeof p != "string" ? h`
+        &::after {
+          animation: ${p} 2s linear 0.5s infinite;
+        }
+      ` : null, A = R("span", {
+  name: "MuiSkeleton",
+  slot: "Root",
+  overridesResolver: (e, n) => {
+    const {
+      ownerState: o
+    } = e;
+    return [n.root, n[o.variant], o.animation !== !1 && n[o.animation], o.hasChildren && n.withChildren, o.hasChildren && !o.width && n.fitContent, o.hasChildren && !o.height && n.heightAuto];
+  }
+})(C(({
+  theme: e
+}) => {
+  const n = O(e.shape.borderRadius) || "px", o = T(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 : e.alpha(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: `${o}${n}/${Math.round(o / 0.6 * 10) / 10}${n}`,
+        "&:empty:before": {
+          content: '"\\00a0"'
+        }
+      }
+    }, {
+      props: {
+        variant: "circular"
+      },
+      style: {
+        borderRadius: "50%"
+      }
+    }, {
+      props: {
+        variant: "rounded"
+      },
+      style: {
+        borderRadius: (e.vars || e).shape.borderRadius
+      }
+    }, {
+      props: ({
+        ownerState: a
+      }) => a.hasChildren,
+      style: {
+        "& > *": {
+          visibility: "hidden"
+        }
+      }
+    }, {
+      props: ({
+        ownerState: a
+      }) => a.hasChildren && !a.width,
+      style: {
+        maxWidth: "fit-content"
+      }
+    }, {
+      props: ({
+        ownerState: a
+      }) => a.hasChildren && !a.height,
+      style: {
+        height: "auto"
+      }
+    }, {
+      props: {
+        animation: "pulse"
+      },
+      style: N || {
+        animation: `${l} 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: U || {
+        "&::after": {
+          animation: `${p} 2s linear 0.5s infinite`
+        }
+      }
+    }]
+  };
+})), M = /* @__PURE__ */ v.forwardRef(function(n, o) {
+  const a = $({
+    props: n,
+    name: "MuiSkeleton"
+  }), {
+    animation: r = "pulse",
+    className: s,
+    component: i = "span",
+    height: m,
+    style: u,
+    variant: y = "text",
+    width: g,
+    ...c
+  } = a, d = {
+    ...a,
+    animation: r,
+    component: i,
+    variant: y,
+    hasChildren: !!c.children
+  }, b = j(d);
+  return /* @__PURE__ */ x.jsx(A, {
+    as: i,
+    ref: o,
+    className: w(b.root, s),
+    ownerState: d,
+    ...c,
+    style: {
+      width: g,
+      height: m,
+      ...u
+    }
+  });
+});
+process.env.NODE_ENV !== "production" && (M.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: t.oneOf(["pulse", "wave", !1]),
+  /**
+   * Optional children to infer width and height from.
+   */
+  children: t.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: t.object,
+  /**
+   * @ignore
+   */
+  className: t.string,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: t.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: t.oneOfType([t.number, t.string]),
+  /**
+   * @ignore
+   */
+  style: t.object,
+  /**
+   * 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]),
+  /**
+   * The type of content that will be rendered.
+   * @default 'text'
+   */
+  variant: t.oneOfType([t.oneOf(["circular", "rectangular", "rounded", "text"]), t.string]),
+  /**
+   * Width of the skeleton.
+   * Useful when the skeleton is inside an inline element with no width of its own.
+   */
+  width: t.oneOfType([t.number, t.string])
+});
 export {
-  P as default
+  M as default
 };
 //# sourceMappingURL=ui-components.es58.js.map

package/dist/ui-components.es58.js.map

@@ -1 +1 @@
-{"version":3,"file":"ui-components.es58.js","sources":["../src/components/TwoPaneLayout/DownloadModal.tsx"],"sourcesContent":["import React from \"react\";\nimport { Modal, Box, IconButton, Stack, Typography, Divider, Button } from \"@mui/material\";\nimport DownloadIcon from \"@mui/icons-material/Download\";\n\nexport interface DownloadModalProps {\n  open: boolean;\n  onClose: () => void;\n  onDownloadSVG?: () => void;\n  onDownloadPNG?: () => void;\n  plotTitle: string;\n}\n\nconst DownloadModal: React.FC<DownloadModalProps> = ({ open, onClose, onDownloadSVG, onDownloadPNG, plotTitle }) => {\n  const downloadOptions = [\n    { label: \"PNG\", action: onDownloadPNG },\n    { label: \"SVG\", action: onDownloadSVG },\n  ].filter((option) => option.action);\n\n  return (\n    <Modal open={open} onClose={onClose}>\n      <Box\n        sx={{\n          position: \"absolute\",\n          top: \"50%\",\n          left: \"50%\",\n          transform: \"translate(-50%, -50%)\",\n          bgcolor: \"background.paper\",\n          boxShadow: 24,\n          borderRadius: 2,\n          p: 3,\n          width: 360,\n        }}\n      >\n        <Typography variant=\"h6\" fontWeight={600} mb={1}>\n          Download {plotTitle}\n        </Typography>\n        <Typography variant=\"body2\" color=\"text.secondary\" mb={2}>\n          Choose a file format to export your plot.\n        </Typography>\n        <Stack spacing={1.5} divider={<Divider flexItem />}>\n          {downloadOptions.map((option) => (\n            <Stack key={option.label} direction=\"row\" alignItems=\"center\" justifyContent=\"space-between\">\n              <Typography variant=\"body1\">{option.label}</Typography>\n              <IconButton color=\"primary\" onClick={option.action} aria-label={`Download ${option.label}`}>\n                <DownloadIcon />\n              </IconButton>\n            </Stack>\n          ))}\n        </Stack>\n        <Box mt={3} textAlign=\"right\">\n          <Button onClick={onClose}>Close</Button>\n        </Box>\n      </Box>\n    </Modal>\n  );\n};\n\nexport default DownloadModal;\n"],"names":["DownloadModal","t0","$","_c","open","onClose","onDownloadSVG","onDownloadPNG","plotTitle","t1","label","action","t2","t3","filter","_temp","downloadOptions","t4","Symbol","for","position","top","left","transform","bgcolor","boxShadow","borderRadius","p","width","t5","Typography","t6","t7","Divider","t8","jsx","Stack","map","_temp2","t9","Box","Button","t10","jsxs","t11","Modal","option","option_0","IconButton","DownloadIcon"],"mappings":"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"}
+{"version":3,"file":"ui-components.es58.js","sources":["../../../node_modules/.pnpm/@mui+material@7.3.9_@emotion+react@11.14.0_@types+react@19.2.14_react@19.2.4__@emotion+_5efc65b7a21bb615fd4ee8d4bf58b896/node_modules/@mui/material/esm/Skeleton/Skeleton.js"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport clsx from 'clsx';\nimport PropTypes from 'prop-types';\nimport composeClasses from '@mui/utils/composeClasses';\nimport { unstable_getUnit as getUnit, unstable_toUnitless as toUnitless } from \"../styles/index.js\";\nimport { keyframes, css, styled } from \"../zero-styled/index.js\";\nimport memoTheme from \"../utils/memoTheme.js\";\nimport { useDefaultProps } from \"../DefaultPropsProvider/index.js\";\nimport { getSkeletonUtilityClass } from \"./skeletonClasses.js\";\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n  const {\n    classes,\n    variant,\n    animation,\n    hasChildren,\n    width,\n    height\n  } = ownerState;\n  const slots = {\n    root: ['root', variant, animation, hasChildren && 'withChildren', hasChildren && !width && 'fitContent', hasChildren && !height && 'heightAuto']\n  };\n  return composeClasses(slots, getSkeletonUtilityClass, classes);\n};\nconst pulseKeyframe = keyframes`\n  0% {\n    opacity: 1;\n  }\n\n  50% {\n    opacity: 0.4;\n  }\n\n  100% {\n    opacity: 1;\n  }\n`;\nconst waveKeyframe = keyframes`\n  0% {\n    transform: translateX(-100%);\n  }\n\n  50% {\n    /* +0.5s of delay between each loop */\n    transform: translateX(100%);\n  }\n\n  100% {\n    transform: translateX(100%);\n  }\n`;\n\n// This implementation is for supporting both Styled-components v4+ and Pigment CSS.\n// A global animation has to be created here for Styled-components v4+ (https://github.com/styled-components/styled-components/blob/main/packages/styled-components/src/utils/errors.md#12).\n// which can be done by checking typeof indeterminate1Keyframe !== 'string' (at runtime, Pigment CSS transform keyframes`` to a string).\nconst pulseAnimation = typeof pulseKeyframe !== 'string' ? css`\n        animation: ${pulseKeyframe} 2s ease-in-out 0.5s infinite;\n      ` : null;\nconst waveAnimation = typeof waveKeyframe !== 'string' ? css`\n        &::after {\n          animation: ${waveKeyframe} 2s linear 0.5s infinite;\n        }\n      ` : null;\nconst SkeletonRoot = styled('span', {\n  name: 'MuiSkeleton',\n  slot: 'Root',\n  overridesResolver: (props, styles) => {\n    const {\n      ownerState\n    } = props;\n    return [styles.root, styles[ownerState.variant], ownerState.animation !== false && styles[ownerState.animation], ownerState.hasChildren && styles.withChildren, ownerState.hasChildren && !ownerState.width && styles.fitContent, ownerState.hasChildren && !ownerState.height && styles.heightAuto];\n  }\n})(memoTheme(({\n  theme\n}) => {\n  const radiusUnit = getUnit(theme.shape.borderRadius) || 'px';\n  const radiusValue = toUnitless(theme.shape.borderRadius);\n  return {\n    display: 'block',\n    // Create a \"on paper\" color with sufficient contrast retaining the color\n    backgroundColor: theme.vars ? theme.vars.palette.Skeleton.bg : theme.alpha(theme.palette.text.primary, theme.palette.mode === 'light' ? 0.11 : 0.13),\n    height: '1.2em',\n    variants: [{\n      props: {\n        variant: 'text'\n      },\n      style: {\n        marginTop: 0,\n        marginBottom: 0,\n        height: 'auto',\n        transformOrigin: '0 55%',\n        transform: 'scale(1, 0.60)',\n        borderRadius: `${radiusValue}${radiusUnit}/${Math.round(radiusValue / 0.6 * 10) / 10}${radiusUnit}`,\n        '&:empty:before': {\n          content: '\"\\\\00a0\"'\n        }\n      }\n    }, {\n      props: {\n        variant: 'circular'\n      },\n      style: {\n        borderRadius: '50%'\n      }\n    }, {\n      props: {\n        variant: 'rounded'\n      },\n      style: {\n        borderRadius: (theme.vars || theme).shape.borderRadius\n      }\n    }, {\n      props: ({\n        ownerState\n      }) => ownerState.hasChildren,\n      style: {\n        '& > *': {\n          visibility: 'hidden'\n        }\n      }\n    }, {\n      props: ({\n        ownerState\n      }) => ownerState.hasChildren && !ownerState.width,\n      style: {\n        maxWidth: 'fit-content'\n      }\n    }, {\n      props: ({\n        ownerState\n      }) => ownerState.hasChildren && !ownerState.height,\n      style: {\n        height: 'auto'\n      }\n    }, {\n      props: {\n        animation: 'pulse'\n      },\n      style: pulseAnimation || {\n        animation: `${pulseKeyframe} 2s ease-in-out 0.5s infinite`\n      }\n    }, {\n      props: {\n        animation: 'wave'\n      },\n      style: {\n        position: 'relative',\n        overflow: 'hidden',\n        /* Fix bug in Safari https://bugs.webkit.org/show_bug.cgi?id=68196 */\n        WebkitMaskImage: '-webkit-radial-gradient(white, black)',\n        '&::after': {\n          background: `linear-gradient(\n                90deg,\n                transparent,\n                ${(theme.vars || theme).palette.action.hover},\n                transparent\n              )`,\n          content: '\"\"',\n          position: 'absolute',\n          transform: 'translateX(-100%)' /* Avoid flash during server-side hydration */,\n          bottom: 0,\n          left: 0,\n          right: 0,\n          top: 0\n        }\n      }\n    }, {\n      props: {\n        animation: 'wave'\n      },\n      style: waveAnimation || {\n        '&::after': {\n          animation: `${waveKeyframe} 2s linear 0.5s infinite`\n        }\n      }\n    }]\n  };\n}));\nconst Skeleton = /*#__PURE__*/React.forwardRef(function Skeleton(inProps, ref) {\n  const props = useDefaultProps({\n    props: inProps,\n    name: 'MuiSkeleton'\n  });\n  const {\n    animation = 'pulse',\n    className,\n    component = 'span',\n    height,\n    style,\n    variant = 'text',\n    width,\n    ...other\n  } = props;\n  const ownerState = {\n    ...props,\n    animation,\n    component,\n    variant,\n    hasChildren: Boolean(other.children)\n  };\n  const classes = useUtilityClasses(ownerState);\n  return /*#__PURE__*/_jsx(SkeletonRoot, {\n    as: component,\n    ref: ref,\n    className: clsx(classes.root, className),\n    ownerState: ownerState,\n    ...other,\n    style: {\n      width,\n      height,\n      ...style\n    }\n  });\n});\nprocess.env.NODE_ENV !== \"production\" ? Skeleton.propTypes /* remove-proptypes */ = {\n  // ┌────────────────────────────── Warning ──────────────────────────────┐\n  // │ These PropTypes are generated from the TypeScript type definitions. │\n  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │\n  // └─────────────────────────────────────────────────────────────────────┘\n  /**\n   * The animation.\n   * If `false` the animation effect is disabled.\n   * @default 'pulse'\n   */\n  animation: PropTypes.oneOf(['pulse', 'wave', false]),\n  /**\n   * Optional children to infer width and height from.\n   */\n  children: PropTypes.node,\n  /**\n   * Override or extend the styles applied to the component.\n   */\n  classes: PropTypes.object,\n  /**\n   * @ignore\n   */\n  className: PropTypes.string,\n  /**\n   * The component used for the root node.\n   * Either a string to use a HTML element or a component.\n   */\n  component: PropTypes.elementType,\n  /**\n   * Height of the skeleton.\n   * Useful when you don't want to adapt the skeleton to a text element but for instance a card.\n   */\n  height: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n  /**\n   * @ignore\n   */\n  style: PropTypes.object,\n  /**\n   * The system prop that allows defining system overrides as well as additional CSS styles.\n   */\n  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),\n  /**\n   * The type of content that will be rendered.\n   * @default 'text'\n   */\n  variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['circular', 'rectangular', 'rounded', 'text']), PropTypes.string]),\n  /**\n   * Width of the skeleton.\n   * Useful when the skeleton is inside an inline element with no width of its own.\n   */\n  width: PropTypes.oneOfType([PropTypes.number, PropTypes.string])\n} : void 0;\nexport default Skeleton;"],"names":["useUtilityClasses","ownerState","classes","variant","animation","hasChildren","width","height","composeClasses","getSkeletonUtilityClass","pulseKeyframe","keyframes","waveKeyframe","pulseAnimation","css","waveAnimation","SkeletonRoot","styled","props","styles","memoTheme","theme","radiusUnit","getUnit","radiusValue","toUnitless","Skeleton","React","inProps","ref","useDefaultProps","className","component","style","other","_jsx","clsx","PropTypes"],"mappings":"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","x_google_ignoreList":[0]}

package/dist/ui-components.es59.js

@@ -1,33 +1,42 @@
-import { j as c } from "./ui-components.es15.js";
-import { c as f } from "./ui-components.es17.js";
-import { useState as x } from "react";
-import b from "./ui-components.es45.js";
-function j(l) {
-  const e = f.c(9), {
-    value: t,
-    figures: n
-  } = l;
-  let r;
-  e[0] !== t ? (r = /* @__PURE__ */ new Set([t]), e[0] = t, e[1] = r) : r = e[1];
-  const [o, d] = x(r);
-  o.has(t) || d(/* @__PURE__ */ new Set([...o, t]));
-  let s;
-  if (e[2] !== n || e[3] !== o || e[4] !== t) {
-    let i;
-    e[6] !== o || e[7] !== t ? (i = (u, a) => {
-      const m = t === a, p = o.has(a);
-      return /* @__PURE__ */ c.jsx(b, { display: m ? "block" : "none", height: "100%", width: "100%", overflow: "auto", padding: 1, sx: {
-        border: "1px solid",
-        borderColor: "divider",
-        borderRadius: 1,
-        position: "relative"
-      }, children: p && u.component }, `figure-${a}`);
-    }, e[6] = o, e[7] = t, e[8] = i) : i = e[8], s = n.map(i), e[2] = n, e[3] = o, e[4] = t, e[5] = s;
-  } else
-    s = e[5];
-  return s;
+import * as p from "react";
+import o from "./ui-components.es89.js";
+import a from "./ui-components.es101.js";
+import d from "./ui-components.es102.js";
+function r(f) {
+  const {
+    children: s,
+    defer: e = !1,
+    fallback: n = null
+  } = f, [c, t] = p.useState(!1);
+  return d(() => {
+    e || t(!0);
+  }, [e]), p.useEffect(() => {
+    e && t(!0);
+  }, [e]), c ? s : n;
 }
+process.env.NODE_ENV !== "production" && (r.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * You can wrap a node.
+   */
+  children: o.node,
+  /**
+   * If `true`, the component will not only prevent server-side rendering.
+   * It will also defer the rendering of the children into a different screen frame.
+   * @default false
+   */
+  defer: o.bool,
+  /**
+   * The fallback content to display.
+   * @default null
+   */
+  fallback: o.node
+});
+process.env.NODE_ENV !== "production" && (r.propTypes = a(r.propTypes));
 export {
-  j as default
+  r as default
 };
 //# sourceMappingURL=ui-components.es59.js.map

package/dist/ui-components.es59.js.map

@@ -1 +1 @@
-{"version":3,"file":"ui-components.es59.js","sources":["../src/components/TwoPaneLayout/FigurePanel.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport Box from \"@mui/material/Box\";\n\ntype Figure = {\n  title: string;\n  component: React.ReactNode;\n};\n\ntype FigurePanelProps = {\n  value: number;\n  figures: Figure[];\n};\n\nexport default function FigurePanel({ value, figures }: FigurePanelProps) {\n  const [mountedTabs, setMountedTabs] = useState<Set<number>>(new Set([value]));\n\n  if (!mountedTabs.has(value)) {\n    setMountedTabs(new Set([...mountedTabs, value]));\n  }\n\n  return figures.map((Figure, i) => {\n    const isActive = value === i;\n    const isMounted = mountedTabs.has(i);\n\n    return (\n      <Box\n        key={`figure-${i}`}\n        display={isActive ? \"block\" : \"none\"}\n        height=\"100%\"\n        width={\"100%\"}\n        overflow={\"auto\"}\n        padding={1}\n        sx={{ border: \"1px solid\", borderColor: \"divider\", borderRadius: 1, position: \"relative\" }}\n      >\n        {isMounted && Figure.component}\n      </Box>\n    );\n  });\n}\n"],"names":["FigurePanel","t0","$","_c","value","figures","t1","Set","mountedTabs","setMountedTabs","useState","has","t2","t3","Figure","i","isActive","isMounted","jsx","Box","border","borderColor","borderRadius","position","component","map"],"mappings":";;;;AAaA,SAAeA,EAAAC,GAAA;AAAA,QAAAC,IAAAC,EAAAA,EAAA,CAAA,GAAqB;AAAA,IAAAC,OAAAA;AAAAA,IAAAC,SAAAA;AAAAA,EAAAA,IAAAJ;AAAoC,MAAAK;AAAA,EAAAJ,SAAAE,KACVE,wBAAIC,IAAI,CAACH,CAAK,CAAC,GAACF,OAAAE,GAAAF,OAAAI,KAAAA,IAAAJ,EAAA,CAAA;AAA5E,QAAA,CAAAM,GAAAC,CAAA,IAAsCC,EAAsBJ,CAAgB;AAE5E,EAAKE,EAAWG,IAAKP,CAAK,KACxBK,sBAAmBF,IAAI,CAAA,GAAIC,GAAaJ,CAAK,CAAC,CAAC;AAChD,MAAAQ;AAAA,MAAAV,EAAA,CAAA,MAAAG,KAAAH,SAAAM,KAAAN,EAAA,CAAA,MAAAE,GAAA;AAAA,QAAAS;AAAA,IAAAX,EAAA,CAAA,MAAAM,KAAAN,SAAAE,KAEkBS,IAAAA,CAAAC,GAAAC,MAAA;AACjB,YAAAC,IAAiBZ,MAAUW,GAC3BE,IAAkBT,EAAWG,IAAKI,CAAC;AAAE,aAGnCG,gBAAAA,EAAAA,IAACC,GAAA,EAEU,SAAAH,IAAA,UAAA,QACF,QAAA,QACA,OAAA,QACG,UAAA,QACD,SAAA,GACL,IAAA;AAAA,QAAAI,QAAU;AAAA,QAAWC,aAAe;AAAA,QAASC,cAAgB;AAAA,QAACC,UAAY;AAAA,MAAA,GAE7EN,UAAAA,KAAaH,EAAMU,UAAAA,aARLT,CAAC,EASlB;AAAA,IAAM,GAETb,OAAAM,GAAAN,OAAAE,GAAAF,OAAAW,KAAAA,IAAAX,EAAA,CAAA,GAjBMU,IAAAP,EAAOoB,IAAKZ,CAiBlB,GAACX,OAAAG,GAAAH,OAAAM,GAAAN,OAAAE,GAAAF,OAAAU;AAAAA,EAAA;AAAAA,IAAAA,IAAAV,EAAA,CAAA;AAAA,SAjBKU;AAiBL;"}
+{"version":3,"file":"ui-components.es59.js","sources":["../../../node_modules/.pnpm/@mui+material@7.3.9_@emotion+react@11.14.0_@types+react@19.2.14_react@19.2.4__@emotion+_5efc65b7a21bb615fd4ee8d4bf58b896/node_modules/@mui/material/esm/NoSsr/NoSsr.js"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport useEnhancedEffect from '@mui/utils/useEnhancedEffect';\nimport exactProp from '@mui/utils/exactProp';\n/**\n * NoSsr purposely removes components from the subject of Server Side Rendering (SSR).\n *\n * This component can be useful in a variety of situations:\n *\n * * Escape hatch for broken dependencies not supporting SSR.\n * * Improve the time-to-first paint on the client by only rendering above the fold.\n * * Reduce the rendering time on the server.\n * * Under too heavy server load, you can turn on service degradation.\n *\n * Demos:\n *\n * - [No SSR](https://mui.com/material-ui/react-no-ssr/)\n *\n * API:\n *\n * - [NoSsr API](https://mui.com/material-ui/api/no-ssr/)\n */\nfunction NoSsr(props) {\n  const {\n    children,\n    defer = false,\n    fallback = null\n  } = props;\n  const [mountedState, setMountedState] = React.useState(false);\n  useEnhancedEffect(() => {\n    if (!defer) {\n      setMountedState(true);\n    }\n  }, [defer]);\n  React.useEffect(() => {\n    if (defer) {\n      setMountedState(true);\n    }\n  }, [defer]);\n\n  // TODO casting won't be needed at one point https://github.com/DefinitelyTyped/DefinitelyTyped/pull/65135\n  return mountedState ? children : fallback;\n}\nprocess.env.NODE_ENV !== \"production\" ? NoSsr.propTypes /* remove-proptypes */ = {\n  // ┌────────────────────────────── Warning ──────────────────────────────┐\n  // │ These PropTypes are generated from the TypeScript type definitions. │\n  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │\n  // └─────────────────────────────────────────────────────────────────────┘\n  /**\n   * You can wrap a node.\n   */\n  children: PropTypes.node,\n  /**\n   * If `true`, the component will not only prevent server-side rendering.\n   * It will also defer the rendering of the children into a different screen frame.\n   * @default false\n   */\n  defer: PropTypes.bool,\n  /**\n   * The fallback content to display.\n   * @default null\n   */\n  fallback: PropTypes.node\n} : void 0;\nif (process.env.NODE_ENV !== 'production') {\n  // eslint-disable-next-line\n  NoSsr['propTypes' + ''] = exactProp(NoSsr.propTypes);\n}\nexport default NoSsr;"],"names":["NoSsr","props","children","defer","fallback","mountedState","setMountedState","React","useEnhancedEffect","PropTypes","exactProp"],"mappings":";;;;AAwBA,SAASA,EAAMC,GAAO;AACpB,QAAM;AAAA,IACJ,UAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA,IACR,UAAAC,IAAW;AAAA,EACf,IAAMH,GACE,CAACI,GAAcC,CAAe,IAAIC,EAAM,SAAS,EAAK;AAC5D,SAAAC,EAAkB,MAAM;AACtB,IAAKL,KACHG,EAAgB,EAAI;AAAA,EAExB,GAAG,CAACH,CAAK,CAAC,GACVI,EAAM,UAAU,MAAM;AACpB,IAAIJ,KACFG,EAAgB,EAAI;AAAA,EAExB,GAAG,CAACH,CAAK,CAAC,GAGHE,IAAeH,IAAWE;AACnC;AACA,QAAQ,IAAI,aAAa,iBAAeJ,EAAM,YAAmC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQ/E,UAAUS,EAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMpB,OAAOA,EAAU;AAAA;AAAA;AAAA;AAAA;AAAA,EAKjB,UAAUA,EAAU;AACtB;AACI,QAAQ,IAAI,aAAa,iBAE3BT,EAAM,YAAoBU,EAAUV,EAAM,SAAS;","x_google_ignoreList":[0]}

package/dist/ui-components.es6.js

@@ -1,11 +1,11 @@
 import { j as t } from "./ui-components.es15.js";
-import { c as ve } from "./ui-components.es17.js";
+import { c as ve } from "./ui-components.es16.js";
 import { TableChartRounded as He, CloseFullscreenRounded as Be, DragHandle as Ve } from "@mui/icons-material";
 import { useTheme as Ne, useMediaQuery as G, IconButton as Te, Tooltip as ye, Button as Oe, Typography as $e, Stack as Ce, Box as ee, Divider as ze, Tab as Le, Tabs as Ee } from "@mui/material";
-import ke from "./ui-components.es21.js";
+import ke from "./ui-components.es18.js";
 import { useState as te, useRef as Fe } from "react";
-import Ue from "./ui-components.es58.js";
-import Qe from "./ui-components.es59.js";
+import Ue from "./ui-components.es60.js";
+import Qe from "./ui-components.es61.js";
 function We(i) {
   const e = ve.c(10), l = Ne();
   let s;

package/dist/ui-components.es60.js

@@ -1,30 +1,73 @@
-import { j as l } from "./ui-components.es15.js";
-import { c as f } from "./ui-components.es17.js";
-import { Switch as x, Box as p, Tooltip as u, FormControlLabel as S } from "@mui/material";
-import { Sort as h } from "@mui/icons-material";
-const g = (a) => {
-  const e = f.c(9), {
-    autoSort: m,
-    setAutoSort: c
-  } = a;
+import { j as t } from "./ui-components.es15.js";
+import { c as S } from "./ui-components.es16.js";
+import { Stack as D, Typography as y, IconButton as C, Divider as v, Box as g, Button as _, Modal as k } from "@mui/material";
+import G from "./ui-components.es18.js";
+const P = (o) => {
+  const e = S.c(24), {
+    open: h,
+    onClose: l,
+    onDownloadSVG: b,
+    onDownloadPNG: u,
+    plotTitle: j
+  } = o;
+  let n;
+  e[0] !== u ? (n = {
+    label: "PNG",
+    action: u
+  }, e[0] = u, e[1] = n) : n = e[1];
   let r;
-  e[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (r = {
-    mr: 1
-  }, e[0] = r) : r = e[0];
-  let t;
-  e[1] !== c ? (t = (j, n) => c(n), e[1] = c, e[2] = t) : t = e[2];
-  let o;
-  e[3] !== m || e[4] !== t ? (o = /* @__PURE__ */ l.jsx(x, { color: "primary", size: "small", sx: r, checked: m, onChange: t }), e[3] = m, e[4] = t, e[5] = o) : o = e[5];
-  let s;
-  e[6] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (s = /* @__PURE__ */ l.jsx(p, { sx: {
-    display: "flex",
-    alignItems: "center",
-    lineHeight: 1
-  }, children: /* @__PURE__ */ l.jsx(h, { fontSize: "small" }) }), e[6] = s) : s = e[6];
+  e[2] !== b ? (r = {
+    label: "SVG",
+    action: b
+  }, e[2] = b, e[3] = r) : r = e[3];
+  let d;
+  e[4] !== n || e[5] !== r ? (d = [n, r].filter(I), e[4] = n, e[5] = r, e[6] = d) : d = e[6];
+  const w = d;
+  let m;
+  e[7] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (m = {
+    position: "absolute",
+    top: "50%",
+    left: "50%",
+    transform: "translate(-50%, -50%)",
+    bgcolor: "background.paper",
+    boxShadow: 24,
+    borderRadius: 2,
+    p: 3,
+    width: 360
+  }, e[7] = m) : m = e[7];
   let i;
-  return e[7] !== o ? (i = /* @__PURE__ */ l.jsx(u, { title: "Auto sort selected rows", children: /* @__PURE__ */ l.jsx(S, { value: "autoSort", control: o, label: s, labelPlacement: "start" }) }), e[7] = o, e[8] = i) : i = e[8], i;
+  e[8] !== j ? (i = /* @__PURE__ */ t.jsxs(y, { variant: "h6", fontWeight: 600, mb: 1, children: [
+    "Download ",
+    j
+  ] }), e[8] = j, e[9] = i) : i = e[9];
+  let f;
+  e[10] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (f = /* @__PURE__ */ t.jsx(y, { variant: "body2", color: "text.secondary", mb: 2, children: "Choose a file format to export your plot." }), e[10] = f) : f = e[10];
+  let p;
+  e[11] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (p = /* @__PURE__ */ t.jsx(v, { flexItem: !0 }), e[11] = p) : p = e[11];
+  let a;
+  e[12] !== w ? (a = /* @__PURE__ */ t.jsx(D, { spacing: 1.5, divider: p, children: w.map(B) }), e[12] = w, e[13] = a) : a = e[13];
+  let s;
+  e[14] !== l ? (s = /* @__PURE__ */ t.jsx(g, { mt: 3, textAlign: "right", children: /* @__PURE__ */ t.jsx(_, { onClick: l, children: "Close" }) }), e[14] = l, e[15] = s) : s = e[15];
+  let c;
+  e[16] !== i || e[17] !== a || e[18] !== s ? (c = /* @__PURE__ */ t.jsxs(g, { sx: m, children: [
+    i,
+    f,
+    a,
+    s
+  ] }), e[16] = i, e[17] = a, e[18] = s, e[19] = c) : c = e[19];
+  let x;
+  return e[20] !== l || e[21] !== h || e[22] !== c ? (x = /* @__PURE__ */ t.jsx(k, { open: h, onClose: l, children: c }), e[20] = l, e[21] = h, e[22] = c, e[23] = x) : x = e[23], x;
 };
+function I(o) {
+  return o.action;
+}
+function B(o) {
+  return /* @__PURE__ */ t.jsxs(D, { direction: "row", alignItems: "center", justifyContent: "space-between", children: [
+    /* @__PURE__ */ t.jsx(y, { variant: "body1", children: o.label }),
+    /* @__PURE__ */ t.jsx(C, { color: "primary", onClick: o.action, "aria-label": `Download ${o.label}`, children: /* @__PURE__ */ t.jsx(G, {}) })
+  ] }, o.label);
+}
 export {
-  g as default
+  P as default
 };
 //# sourceMappingURL=ui-components.es60.js.map

package/dist/ui-components.es60.js.map

@@ -1 +1 @@
-{"version":3,"file":"ui-components.es60.js","sources":["../src/components/TwoPaneLayout/AutoSortSwitch.tsx"],"sourcesContent":["import React from \"react\";\nimport { Tooltip, FormControlLabel, Switch, Box } from \"@mui/material\";\nimport { Sort } from \"@mui/icons-material\";\n\ninterface AutoSortSwitchProps {\n  autoSort: boolean;\n  setAutoSort: (value: boolean) => void;\n}\n\nconst AutoSortSwitch: React.FC<AutoSortSwitchProps> = ({ autoSort, setAutoSort }) => {\n  return (\n    <Tooltip title=\"Auto sort selected rows\">\n      <FormControlLabel\n        value=\"autoSort\"\n        control={\n          <Switch\n            color=\"primary\"\n            size=\"small\"\n            sx={{ mr: 1 }}\n            checked={autoSort}\n            onChange={(_, checked) => setAutoSort(checked)}\n          />\n        }\n        label={\n          <Box sx={{ display: \"flex\", alignItems: \"center\", lineHeight: 1 }}>\n            <Sort fontSize=\"small\" />\n          </Box>\n        }\n        labelPlacement=\"start\"\n      />\n    </Tooltip>\n  );\n};\n\nexport default AutoSortSwitch;\n"],"names":["AutoSortSwitch","t0","$","_c","autoSort","setAutoSort","t1","Symbol","for","mr","t2","_","checked","t3","jsx","Switch","t4","Box","display","alignItems","lineHeight","Sort","t5","Tooltip","FormControlLabel"],"mappings":";;;;AASA,MAAMA,IAAgDC,CAAAA,MAAA;AAAA,QAAAC,IAAAC,EAAAA,EAAA,CAAA,GAAC;AAAA,IAAAC,UAAAA;AAAAA,IAAAC,aAAAA;AAAAA,EAAAA,IAAAJ;AAAyB,MAAAK;AAAA,EAAAJ,EAAA,CAAA,MAAAK,uBAAAC,IAAA,2BAAA,KAShEF,IAAA;AAAA,IAAAG,IAAM;AAAA,EAAA,GAAGP,OAAAI,KAAAA,IAAAJ,EAAA,CAAA;AAAA,MAAAQ;AAAA,EAAAR,SAAAG,KAEHK,IAAAA,CAAAC,GAAAC,MAAgBP,EAAYO,CAAO,GAACV,OAAAG,GAAAH,OAAAQ,KAAAA,IAAAR,EAAA,CAAA;AAAA,MAAAW;AAAA,EAAAX,EAAA,CAAA,MAAAE,KAAAF,SAAAQ,KALhDG,IAAAC,gBAAAA,EAAAA,IAACC,GAAA,EACO,OAAA,WACD,MAAA,SACD,IAAAT,GACKF,SAAAA,GACC,UAAAM,EAAAA,CAAoC,GAC9CR,OAAAE,GAAAF,OAAAQ,GAAAR,OAAAW,KAAAA,IAAAX,EAAA,CAAA;AAAA,MAAAc;AAAA,EAAAd,EAAA,CAAA,MAAAK,uBAAAC,IAAA,2BAAA,KAGFQ,IAAAF,gBAAAA,EAAAA,IAACG,KAAQ,IAAA;AAAA,IAAAC,SAAW;AAAA,IAAMC,YAAc;AAAA,IAAQC,YAAc;AAAA,EAAA,GAC5D,UAAAN,gBAAAA,EAAAA,IAACO,GAAA,EAAc,UAAA,SAAO,GACxB,GAAMnB,OAAAc,KAAAA,IAAAd,EAAA,CAAA;AAAA,MAAAoB;AAAA,SAAApB,SAAAW,KAfZS,IAAAR,gBAAAA,EAAAA,IAACS,GAAA,EAAc,OAAA,2BACb,gCAACC,GAAA,EACO,OAAA,YAEJ,SAAAX,GASA,OAAAG,GAIa,gBAAA,SAAO,GAE1B,GAAUd,OAAAW,GAAAX,OAAAoB,KAAAA,IAAApB,EAAA,CAAA,GAnBVoB;AAmBU;"}
+{"version":3,"file":"ui-components.es60.js","sources":["../src/components/TwoPaneLayout/DownloadModal.tsx"],"sourcesContent":["import React from \"react\";\nimport { Modal, Box, IconButton, Stack, Typography, Divider, Button } from \"@mui/material\";\nimport DownloadIcon from \"@mui/icons-material/Download\";\n\nexport interface DownloadModalProps {\n  open: boolean;\n  onClose: () => void;\n  onDownloadSVG?: () => void;\n  onDownloadPNG?: () => void;\n  plotTitle: string;\n}\n\nconst DownloadModal: React.FC<DownloadModalProps> = ({ open, onClose, onDownloadSVG, onDownloadPNG, plotTitle }) => {\n  const downloadOptions = [\n    { label: \"PNG\", action: onDownloadPNG },\n    { label: \"SVG\", action: onDownloadSVG },\n  ].filter((option) => option.action);\n\n  return (\n    <Modal open={open} onClose={onClose}>\n      <Box\n        sx={{\n          position: \"absolute\",\n          top: \"50%\",\n          left: \"50%\",\n          transform: \"translate(-50%, -50%)\",\n          bgcolor: \"background.paper\",\n          boxShadow: 24,\n          borderRadius: 2,\n          p: 3,\n          width: 360,\n        }}\n      >\n        <Typography variant=\"h6\" fontWeight={600} mb={1}>\n          Download {plotTitle}\n        </Typography>\n        <Typography variant=\"body2\" color=\"text.secondary\" mb={2}>\n          Choose a file format to export your plot.\n        </Typography>\n        <Stack spacing={1.5} divider={<Divider flexItem />}>\n          {downloadOptions.map((option) => (\n            <Stack key={option.label} direction=\"row\" alignItems=\"center\" justifyContent=\"space-between\">\n              <Typography variant=\"body1\">{option.label}</Typography>\n              <IconButton color=\"primary\" onClick={option.action} aria-label={`Download ${option.label}`}>\n                <DownloadIcon />\n              </IconButton>\n            </Stack>\n          ))}\n        </Stack>\n        <Box mt={3} textAlign=\"right\">\n          <Button onClick={onClose}>Close</Button>\n        </Box>\n      </Box>\n    </Modal>\n  );\n};\n\nexport default DownloadModal;\n"],"names":["DownloadModal","t0","$","_c","open","onClose","onDownloadSVG","onDownloadPNG","plotTitle","t1","label","action","t2","t3","filter","_temp","downloadOptions","t4","Symbol","for","position","top","left","transform","bgcolor","boxShadow","borderRadius","p","width","t5","Typography","t6","t7","Divider","t8","jsx","Stack","map","_temp2","t9","Box","Button","t10","jsxs","t11","Modal","option","option_0","IconButton","DownloadIcon"],"mappings":"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"}