synapse-react-client 4.0.33 → 4.0.35

package/dist/components/DraggableDialog/DraggableDialog.d.ts

@@ -4,7 +4,8 @@ type DraggableDialogProps = {
     onClose?: () => void;
     children: ReactNode;
     title?: ReactNode;
+    variant?: 'default' | 'curie';
 };
-export default function DraggableDialog({ open, onClose, title, children, }: DraggableDialogProps): import("react/jsx-runtime").JSX.Element | null;
+export default function DraggableDialog({ open, onClose, title, children, variant, }: DraggableDialogProps): import("react/jsx-runtime").JSX.Element | null;
 export {};
 //# sourceMappingURL=DraggableDialog.d.ts.map

package/dist/components/DraggableDialog/DraggableDialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DraggableDialog.d.ts","sourceRoot":"","sources":["../../../src/components/DraggableDialog/DraggableDialog.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAU,SAAS,EAAuB,MAAM,OAAO,CAAA;AAI9D,KAAK,oBAAoB,GAAG;IAC1B,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,QAAQ,EAAE,SAAS,CAAA;IACnB,KAAK,CAAC,EAAE,SAAS,CAAA;CAClB,CAAA;AAED,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,IAAY,EACZ,OAAO,EACP,KAAK,EACL,QAAQ,GACT,EAAE,oBAAoB,kDAwHtB"}
+{"version":3,"file":"DraggableDialog.d.ts","sourceRoot":"","sources":["../../../src/components/DraggableDialog/DraggableDialog.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAU,SAAS,EAAuB,MAAM,OAAO,CAAA;AAM9D,KAAK,oBAAoB,GAAG;IAC1B,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,QAAQ,EAAE,SAAS,CAAA;IACnB,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAA;CAC9B,CAAA;AAED,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,IAAY,EACZ,OAAO,EACP,KAAK,EACL,QAAQ,EACR,OAAmB,GACpB,EAAE,oBAAoB,kDAwItB"}

package/dist/components/DraggableDialog/DraggableDialog.js

@@ -6,13 +6,14 @@ import { jsx as m, jsxs as h } from "react/jsx-runtime";
 import g from "@mui/icons-material/Close";
 import _ from "react-draggable";
 //#region src/components/DraggableDialog/DraggableDialog.tsx
-function v({ open: v = !1, onClose: y, title: b, children: x }) {
-	let S = p(), C = f(S.breakpoints.down("sm")), w = r(null), [T, E] = i(), [D, O] = i({
+var v = 700;
+function y({ open: y = !1, onClose: b, title: x, children: S, variant: C = "default" }) {
+	let w = p(), T = f(w.breakpoints.down("sm")), E = r(null), [D, O] = i(), [k, A] = i({
 		x: 100,
-		y: 100
-	}), { width: k, height: A, handleResizeStart: j } = e({
+		y: C === "curie" ? 50 : 100
+	}), { width: j, height: M, handleResizeStart: N } = e({
 		initialWidth: 600,
-		initialHeight: 500,
+		initialHeight: C === "curie" ? v : 500,
 		minWidth: 300,
 		minHeight: 200,
 		maxWidth: 1200,
@@ -21,26 +22,26 @@ function v({ open: v = !1, onClose: y, title: b, children: x }) {
 	if (n(() => {
 		function e() {
 			let e = {
-				left: -(k - 100),
+				left: -(j - 100),
 				top: 0,
 				right: window.innerWidth - 100,
 				bottom: window.innerHeight - 100
 			};
-			E(e), O((t) => ({
+			O(e), A((t) => ({
 				x: Math.max(e.left, Math.min(t.x, e.right)),
 				y: Math.max(e.top, Math.min(t.y, e.bottom))
 			}));
 		}
 		return e(), window.addEventListener("resize", e), () => window.removeEventListener("resize", e);
-	}, [k, A]), !v) return null;
-	let M = /* @__PURE__ */ h(l, {
+	}, [j, M]), !y) return null;
+	let P = /* @__PURE__ */ h(l, {
 		elevation: 5,
 		sx: {
 			display: "flex",
 			flexDirection: "column",
-			height: C ? "95vh" : `${A}px`,
-			width: C ? "95vw" : `${k}px`,
-			...C && { position: "fixed" }
+			height: T ? "95vh" : `${M}px`,
+			width: T ? "95vw" : `${j}px`,
+			...T && { position: "fixed" }
 		},
 		children: [
 			/* @__PURE__ */ h(u, {
@@ -49,63 +50,71 @@ function v({ open: v = !1, onClose: y, title: b, children: x }) {
 				gap: "5px",
 				className: "drag-handle",
 				sx: {
-					padding: "20px",
+					padding: C === "curie" ? "44px 44px 20px 44px" : "20px",
 					cursor: "move"
 				},
 				children: [
-					/* @__PURE__ */ m(d, {
+					C !== "curie" && /* @__PURE__ */ m(d, {
 						variant: "headline1",
-						children: b
+						children: x
 					}),
 					/* @__PURE__ */ m(a, { sx: { flexGrow: 1 } }),
 					/* @__PURE__ */ m(c, {
-						onClick: y,
-						children: /* @__PURE__ */ m(g, {})
+						onClick: b,
+						children: /* @__PURE__ */ m(g, { sx: C === "curie" ? {
+							width: "16px",
+							height: "16px"
+						} : void 0 })
 					})
 				]
 			}),
-			/* @__PURE__ */ m(s, { sx: { mx: 2 } }),
+			C !== "curie" && /* @__PURE__ */ m(s, { sx: { mx: 2 } }),
 			/* @__PURE__ */ m(o, {
 				sx: {
 					height: "100%",
 					maxWidth: "100%",
-					padding: "16px"
+					padding: "16px",
+					...C === "curie" && {
+						borderTop: "none",
+						borderBottom: "none",
+						padding: C === "curie" ? "0 44px 44px 44px" : "44px"
+					}
 				},
-				children: x
+				children: S
 			})
 		]
 	});
 	return /* @__PURE__ */ m(a, {
 		sx: {
 			position: "fixed",
-			zIndex: S.zIndex.modal,
+			zIndex: w.zIndex.modal,
 			top: 0,
 			left: 0,
-			pointerEvents: C ? "auto" : "none"
+			pointerEvents: T ? "auto" : "none"
 		},
-		children: C ? M : /* @__PURE__ */ m(_, {
-			position: D,
-			onDrag: (e, t) => O({
+		children: T ? P : /* @__PURE__ */ m(_, {
+			position: k,
+			onDrag: (e, t) => A({
 				x: t.x,
 				y: t.y
 			}),
-			nodeRef: w,
-			bounds: T,
+			nodeRef: E,
+			bounds: D,
 			handle: ".drag-handle",
 			children: /* @__PURE__ */ m(a, {
-				ref: w,
+				ref: E,
 				sx: { pointerEvents: "auto" },
 				children: /* @__PURE__ */ m(t, {
-					width: k,
-					height: A,
-					onResizeStart: j,
-					children: M
+					width: j,
+					height: M,
+					onResizeStart: N,
+					children: P
 				})
 			})
 		})
 	});
 }
 //#endregion
-export { v as default };
+export { y as default };
 
 //# sourceMappingURL=DraggableDialog.js.map

package/dist/components/DraggableDialog/DraggableDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"DraggableDialog.js","names":[],"sources":["../../../src/components/DraggableDialog/DraggableDialog.tsx"],"sourcesContent":["import Draggable, { DraggableBounds } from 'react-draggable'\nimport {\n  Box,\n  IconButton,\n  Paper,\n  Stack,\n  Typography,\n  Divider,\n  useMediaQuery,\n  useTheme,\n  DialogContent,\n} from '@mui/material'\nimport CloseIcon from '@mui/icons-material/Close'\nimport { useRef, ReactNode, useEffect, useState } from 'react'\nimport { useResizable } from '../ResizableContainer/hooks/useResizable'\nimport { ResizableContainer } from '../ResizableContainer/ResizableContainer'\n\ntype DraggableDialogProps = {\n  open?: boolean\n  onClose?: () => void\n  children: ReactNode\n  title?: ReactNode\n}\n\nexport default function DraggableDialog({\n  open = false,\n  onClose,\n  title,\n  children,\n}: DraggableDialogProps) {\n  const theme = useTheme()\n  const isMobile = useMediaQuery(theme.breakpoints.down('sm'))\n  const draggableRef = useRef<HTMLDivElement>(null)\n  const [bounds, setBounds] = useState<DraggableBounds>()\n  const [position, setPosition] = useState({ x: 100, y: 100 })\n  const { width, height, handleResizeStart } = useResizable({\n    initialWidth: 600,\n    initialHeight: 500,\n    minWidth: 300,\n    minHeight: 200,\n    maxWidth: 1200,\n    maxHeight: 800,\n  })\n\n  useEffect(() => {\n    // Calculate draggable bounds to keep dialog within viewport with margin\n    function updateBounds() {\n      const margin = 100\n      const dialogWidth = width\n\n      const newBounds = {\n        left: -(dialogWidth - margin),\n        top: 0,\n        right: window.innerWidth - margin,\n        bottom: window.innerHeight - margin,\n      }\n\n      setBounds(newBounds)\n\n      // Clamp dialog position to new bounds to keep it visible after window resize\n      setPosition(prevPosition => ({\n        x: Math.max(newBounds.left, Math.min(prevPosition.x, newBounds.right)),\n        y: Math.max(newBounds.top, Math.min(prevPosition.y, newBounds.bottom)),\n      }))\n    }\n    updateBounds()\n    window.addEventListener('resize', updateBounds)\n    return () => window.removeEventListener('resize', updateBounds)\n  }, [width, height])\n\n  if (!open) {\n    return null\n  }\n\n  const paperContent = (\n    <Paper\n      elevation={5}\n      sx={{\n        display: 'flex',\n        flexDirection: 'column',\n        height: isMobile ? '95vh' : `${height}px`,\n        width: isMobile ? '95vw' : `${width}px`,\n        ...(isMobile && {\n          position: 'fixed',\n        }),\n      }}\n    >\n      <Stack\n        direction=\"row\"\n        alignItems=\"center\"\n        gap=\"5px\"\n        className=\"drag-handle\"\n        sx={{\n          padding: '20px',\n          cursor: 'move',\n        }}\n      >\n        <Typography variant=\"headline1\">{title}</Typography>\n        <Box sx={{ flexGrow: 1 }} />\n        <IconButton onClick={onClose}>\n          <CloseIcon />\n        </IconButton>\n      </Stack>\n      <Divider sx={{ mx: 2 }} />\n      <DialogContent\n        sx={{\n          height: '100%',\n          maxWidth: '100%',\n          padding: '16px',\n        }}\n      >\n        {children}\n      </DialogContent>\n    </Paper>\n  )\n\n  return (\n    <Box\n      sx={{\n        position: 'fixed',\n        zIndex: theme.zIndex.modal,\n        top: 0,\n        left: 0,\n        pointerEvents: isMobile ? 'auto' : 'none',\n      }}\n    >\n      {isMobile ? (\n        paperContent\n      ) : (\n        <Draggable\n          position={position}\n          onDrag={(e, data) => setPosition({ x: data.x, y: data.y })}\n          nodeRef={draggableRef}\n          bounds={bounds}\n          handle=\".drag-handle\"\n        >\n          <Box ref={draggableRef} sx={{ pointerEvents: 'auto' }}>\n            <ResizableContainer\n              width={width}\n              height={height}\n              onResizeStart={handleResizeStart}\n            >\n              {paperContent}\n            </ResizableContainer>\n          </Box>\n        </Draggable>\n      )}\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;;AAwBA,SAAwB,EAAgB,EACtC,UAAO,IACP,YACA,UACA,eACuB;CACvB,IAAM,IAAQ,EAAS,GACjB,IAAW,EAAc,EAAM,YAAY,KAAK,IAAI,CAAC,GACrD,IAAe,EAAuB,IAAI,GAC1C,CAAC,GAAQ,KAAa,EAA0B,GAChD,CAAC,GAAU,KAAe,EAAS;EAAE,GAAG;EAAK,GAAG;CAAI,CAAC,GACrD,EAAE,UAAO,WAAQ,yBAAsB,EAAa;EACxD,cAAc;EACd,eAAe;EACf,UAAU;EACV,WAAW;EACX,UAAU;EACV,WAAW;CACb,CAAC;CA4BD,IA1BA,QAAgB;EAEd,SAAS,IAAe;GACtB,IAGM,IAAY;IAChB,MAAM,EAAE,IAAc;IACtB,KAAK;IACL,OAAO,OAAO,aAAa;IAC3B,QAAQ,OAAO,cAAc;GAC/B;GAKA,AAHA,EAAU,CAAS,GAGnB,GAAY,OAAiB;IAC3B,GAAG,KAAK,IAAI,EAAU,MAAM,KAAK,IAAI,EAAa,GAAG,EAAU,KAAK,CAAC;IACrE,GAAG,KAAK,IAAI,EAAU,KAAK,KAAK,IAAI,EAAa,GAAG,EAAU,MAAM,CAAC;GACvE,EAAE;EACJ;EAGA,OAFA,EAAa,GACb,OAAO,iBAAiB,UAAU,CAAY,SACjC,OAAO,oBAAoB,UAAU,CAAY;CAChE,GAAG,CAAC,GAAO,CAAM,CAAC,GAEd,CAAC,GACH,OAAO;CAGT,IAAM,IACJ,kBAAC,GAAD;EACE,WAAW;EACX,IAAI;GACF,SAAS;GACT,eAAe;GACf,QAAQ,IAAW,SAAS,GAAG,EAAO;GACtC,OAAO,IAAW,SAAS,GAAG,EAAM;GACpC,GAAI,KAAY,EACd,UAAU,QACZ;EACF;YAVF;GAYE,kBAAC,GAAD;IACE,WAAU;IACV,YAAW;IACX,KAAI;IACJ,WAAU;IACV,IAAI;KACF,SAAS;KACT,QAAQ;IACV;cARF;KAUE,kBAAC,GAAD;MAAY,SAAQ;gBAAa;KAAkB,CAAA;KACnD,kBAAC,GAAD,EAAK,IAAI,EAAE,UAAU,EAAE,EAAI,CAAA;KAC3B,kBAAC,GAAD;MAAY,SAAS;gBACnB,kBAAC,GAAD,CAAY,CAAA;KACF,CAAA;IACP;;GACP,kBAAC,GAAD,EAAS,IAAI,EAAE,IAAI,EAAE,EAAI,CAAA;GACzB,kBAAC,GAAD;IACE,IAAI;KACF,QAAQ;KACR,UAAU;KACV,SAAS;IACX;IAEC;GACY,CAAA;EACV;;CAGT,OACE,kBAAC,GAAD;EACE,IAAI;GACF,UAAU;GACV,QAAQ,EAAM,OAAO;GACrB,KAAK;GACL,MAAM;GACN,eAAe,IAAW,SAAS;EACrC;YAEC,IACC,IAEA,kBAAC,GAAD;GACY;GACV,SAAS,GAAG,MAAS,EAAY;IAAE,GAAG,EAAK;IAAG,GAAG,EAAK;GAAE,CAAC;GACzD,SAAS;GACD;GACR,QAAO;aAEP,kBAAC,GAAD;IAAK,KAAK;IAAc,IAAI,EAAE,eAAe,OAAO;cAClD,kBAAC,GAAD;KACS;KACC;KACR,eAAe;eAEd;IACiB,CAAA;GACjB,CAAA;EACI,CAAA;CAEV,CAAA;AAET"}
+{"version":3,"file":"DraggableDialog.js","names":[],"sources":["../../../src/components/DraggableDialog/DraggableDialog.tsx"],"sourcesContent":["import Draggable, { DraggableBounds } from 'react-draggable'\nimport {\n  Box,\n  IconButton,\n  Paper,\n  Stack,\n  Typography,\n  Divider,\n  useMediaQuery,\n  useTheme,\n  DialogContent,\n} from '@mui/material'\nimport CloseIcon from '@mui/icons-material/Close'\nimport { useRef, ReactNode, useEffect, useState } from 'react'\nimport { useResizable } from '../ResizableContainer/hooks/useResizable'\nimport { ResizableContainer } from '../ResizableContainer/ResizableContainer'\n\nconst CURIE_INITIAL_SIZE = 700\n\ntype DraggableDialogProps = {\n  open?: boolean\n  onClose?: () => void\n  children: ReactNode\n  title?: ReactNode\n  variant?: 'default' | 'curie'\n}\n\nexport default function DraggableDialog({\n  open = false,\n  onClose,\n  title,\n  children,\n  variant = 'default',\n}: DraggableDialogProps) {\n  const theme = useTheme()\n  const isMobile = useMediaQuery(theme.breakpoints.down('sm'))\n  const draggableRef = useRef<HTMLDivElement>(null)\n  const [bounds, setBounds] = useState<DraggableBounds>()\n  const [position, setPosition] = useState({\n    x: 100,\n    y: variant === 'curie' ? 50 : 100,\n  })\n  const { width, height, handleResizeStart } = useResizable({\n    initialWidth: 600,\n    initialHeight: variant === 'curie' ? CURIE_INITIAL_SIZE : 500,\n    minWidth: 300,\n    minHeight: 200,\n    maxWidth: 1200,\n    maxHeight: 800,\n  })\n\n  useEffect(() => {\n    // Calculate draggable bounds to keep dialog within viewport with margin\n    function updateBounds() {\n      const margin = 100\n      const dialogWidth = width\n\n      const newBounds = {\n        left: -(dialogWidth - margin),\n        top: 0,\n        right: window.innerWidth - margin,\n        bottom: window.innerHeight - margin,\n      }\n\n      setBounds(newBounds)\n\n      // Clamp dialog position to new bounds to keep it visible after window resize\n      setPosition(prevPosition => ({\n        x: Math.max(newBounds.left, Math.min(prevPosition.x, newBounds.right)),\n        y: Math.max(newBounds.top, Math.min(prevPosition.y, newBounds.bottom)),\n      }))\n    }\n    updateBounds()\n    window.addEventListener('resize', updateBounds)\n    return () => window.removeEventListener('resize', updateBounds)\n  }, [width, height])\n\n  if (!open) {\n    return null\n  }\n\n  const paperContent = (\n    <Paper\n      elevation={5}\n      sx={{\n        display: 'flex',\n        flexDirection: 'column',\n        height: isMobile ? '95vh' : `${height}px`,\n        width: isMobile ? '95vw' : `${width}px`,\n        ...(isMobile && {\n          position: 'fixed',\n        }),\n      }}\n    >\n      <Stack\n        direction=\"row\"\n        alignItems=\"center\"\n        gap=\"5px\"\n        className=\"drag-handle\"\n        sx={{\n          padding: variant === 'curie' ? '44px 44px 20px 44px' : '20px',\n          cursor: 'move',\n        }}\n      >\n        {variant !== 'curie' && (\n          <Typography variant=\"headline1\">{title}</Typography>\n        )}\n        <Box sx={{ flexGrow: 1 }} />\n        <IconButton onClick={onClose}>\n          <CloseIcon\n            sx={\n              variant === 'curie'\n                ? { width: '16px', height: '16px' }\n                : undefined\n            }\n          />\n        </IconButton>\n      </Stack>\n      {variant !== 'curie' && <Divider sx={{ mx: 2 }} />}\n      <DialogContent\n        sx={{\n          height: '100%',\n          maxWidth: '100%',\n          padding: '16px',\n          ...(variant === 'curie' && {\n            borderTop: 'none',\n            borderBottom: 'none',\n            padding: variant === 'curie' ? '0 44px 44px 44px' : '44px',\n          }),\n        }}\n      >\n        {children}\n      </DialogContent>\n    </Paper>\n  )\n\n  return (\n    <Box\n      sx={{\n        position: 'fixed',\n        zIndex: theme.zIndex.modal,\n        top: 0,\n        left: 0,\n        pointerEvents: isMobile ? 'auto' : 'none',\n      }}\n    >\n      {isMobile ? (\n        paperContent\n      ) : (\n        <Draggable\n          position={position}\n          onDrag={(e, data) => setPosition({ x: data.x, y: data.y })}\n          nodeRef={draggableRef}\n          bounds={bounds}\n          handle=\".drag-handle\"\n        >\n          <Box ref={draggableRef} sx={{ pointerEvents: 'auto' }}>\n            <ResizableContainer\n              width={width}\n              height={height}\n              onResizeStart={handleResizeStart}\n            >\n              {paperContent}\n            </ResizableContainer>\n          </Box>\n        </Draggable>\n      )}\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;;AAiBA,IAAM,IAAqB;AAU3B,SAAwB,EAAgB,EACtC,UAAO,IACP,YACA,UACA,aACA,aAAU,aACa;CACvB,IAAM,IAAQ,EAAS,GACjB,IAAW,EAAc,EAAM,YAAY,KAAK,IAAI,CAAC,GACrD,IAAe,EAAuB,IAAI,GAC1C,CAAC,GAAQ,KAAa,EAA0B,GAChD,CAAC,GAAU,KAAe,EAAS;EACvC,GAAG;EACH,GAAG,MAAY,UAAU,KAAK;CAChC,CAAC,GACK,EAAE,UAAO,WAAQ,yBAAsB,EAAa;EACxD,cAAc;EACd,eAAe,MAAY,UAAU,IAAqB;EAC1D,UAAU;EACV,WAAW;EACX,UAAU;EACV,WAAW;CACb,CAAC;CA4BD,IA1BA,QAAgB;EAEd,SAAS,IAAe;GACtB,IAGM,IAAY;IAChB,MAAM,EAAE,IAAc;IACtB,KAAK;IACL,OAAO,OAAO,aAAa;IAC3B,QAAQ,OAAO,cAAc;GAC/B;GAKA,AAHA,EAAU,CAAS,GAGnB,GAAY,OAAiB;IAC3B,GAAG,KAAK,IAAI,EAAU,MAAM,KAAK,IAAI,EAAa,GAAG,EAAU,KAAK,CAAC;IACrE,GAAG,KAAK,IAAI,EAAU,KAAK,KAAK,IAAI,EAAa,GAAG,EAAU,MAAM,CAAC;GACvE,EAAE;EACJ;EAGA,OAFA,EAAa,GACb,OAAO,iBAAiB,UAAU,CAAY,SACjC,OAAO,oBAAoB,UAAU,CAAY;CAChE,GAAG,CAAC,GAAO,CAAM,CAAC,GAEd,CAAC,GACH,OAAO;CAGT,IAAM,IACJ,kBAAC,GAAD;EACE,WAAW;EACX,IAAI;GACF,SAAS;GACT,eAAe;GACf,QAAQ,IAAW,SAAS,GAAG,EAAO;GACtC,OAAO,IAAW,SAAS,GAAG,EAAM;GACpC,GAAI,KAAY,EACd,UAAU,QACZ;EACF;YAVF;GAYE,kBAAC,GAAD;IACE,WAAU;IACV,YAAW;IACX,KAAI;IACJ,WAAU;IACV,IAAI;KACF,SAAS,MAAY,UAAU,wBAAwB;KACvD,QAAQ;IACV;cARF;KAUG,MAAY,WACX,kBAAC,GAAD;MAAY,SAAQ;gBAAa;KAAkB,CAAA;KAErD,kBAAC,GAAD,EAAK,IAAI,EAAE,UAAU,EAAE,EAAI,CAAA;KAC3B,kBAAC,GAAD;MAAY,SAAS;gBACnB,kBAAC,GAAD,EACE,IACE,MAAY,UACR;OAAE,OAAO;OAAQ,QAAQ;MAAO,IAChC,KAAA,EAEP,CAAA;KACS,CAAA;IACP;;GACN,MAAY,WAAW,kBAAC,GAAD,EAAS,IAAI,EAAE,IAAI,EAAE,EAAI,CAAA;GACjD,kBAAC,GAAD;IACE,IAAI;KACF,QAAQ;KACR,UAAU;KACV,SAAS;KACT,GAAI,MAAY,WAAW;MACzB,WAAW;MACX,cAAc;MACd,SAAS,MAAY,UAAU,qBAAqB;KACtD;IACF;IAEC;GACY,CAAA;EACV;;CAGT,OACE,kBAAC,GAAD;EACE,IAAI;GACF,UAAU;GACV,QAAQ,EAAM,OAAO;GACrB,KAAK;GACL,MAAM;GACN,eAAe,IAAW,SAAS;EACrC;YAEC,IACC,IAEA,kBAAC,GAAD;GACY;GACV,SAAS,GAAG,MAAS,EAAY;IAAE,GAAG,EAAK;IAAG,GAAG,EAAK;GAAE,CAAC;GACzD,SAAS;GACD;GACR,QAAO;aAEP,kBAAC,GAAD;IAAK,KAAK;IAAc,IAAI,EAAE,eAAe,OAAO;cAClD,kBAAC,GAAD;KACS;KACC;KACR,eAAe;eAEd;IACiB,CAAA;GACjB,CAAA;EACI,CAAA;CAEV,CAAA;AAET"}

package/dist/components/EntityTreeTable/hooks/useTableColumns.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useTableColumns.d.ts","sourceRoot":"","sources":["../../../../src/components/EntityTreeTable/hooks/useTableColumns.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAA;AAEjD,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AAmBpD,eAAO,MAAM,eAAe,GAC1B,eAAe,OAAO,EACtB,4BAA0B,iCA6G3B,CAAA"}
+{"version":3,"file":"useTableColumns.d.ts","sourceRoot":"","sources":["../../../../src/components/EntityTreeTable/hooks/useTableColumns.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAA;AAEjD,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AAmBpD,eAAO,MAAM,eAAe,GAC1B,eAAe,OAAO,EACtB,4BAA0B,iCAmH3B,CAAA"}

package/dist/components/EntityTreeTable/hooks/useTableColumns.js

@@ -33,40 +33,46 @@ var y = (y, b = !1) => {
 			header: d,
 			cell: e,
 			enableSorting: y,
-			size: 450
+			size: 600
 		}), C && (m.push({
 			id: "badges",
 			header: "",
 			cell: f,
 			enableSorting: !1,
+			enableResizing: !1,
 			size: 120
 		}), m.push({
 			id: "id",
 			header: n,
 			cell: t,
-			enableSorting: !1
+			enableSorting: !1,
+			size: 110
 		})), S && m.push({
 			accessorKey: "entityHeader.createdOn",
 			id: "createdOn",
 			header: l,
 			cell: a,
-			enableSorting: y
+			enableSorting: y,
+			size: 130
 		}), C && m.push({
 			accessorKey: "entityHeader.modifiedOn",
 			id: "modifiedOn",
 			header: u,
 			cell: r,
-			enableSorting: y
+			enableSorting: y,
+			size: 130
 		}), S && m.push({
 			id: "modifiedBy",
 			header: "Modified By",
 			cell: i,
-			enableSorting: !1
+			enableSorting: !1,
+			size: 130
 		}), C && m.push({
 			id: "size",
 			header: "Size",
 			cell: o,
-			enableSorting: !1
+			enableSorting: !1,
+			size: 80
 		}), S && m.push({
 			id: "md5",
 			header: "MD5",

package/dist/components/EntityTreeTable/hooks/useTableColumns.js.map

@@ -1 +1 @@
-{"version":3,"file":"useTableColumns.js","names":[],"sources":["../../../../src/components/EntityTreeTable/hooks/useTableColumns.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { ColumnDef } from '@tanstack/react-table'\nimport { useTheme, useMediaQuery } from '@mui/material'\nimport { EntityBundleRow } from '../EntityTreeTable'\nimport { NameCell } from '../components/EntityNameCell'\nimport { IdCell } from '../components/IdCell'\nimport { IdColumnHeader } from '../components/IdColumnHeader'\nimport { ModifiedOnCell } from '../../EntityFinder/details/view/table/ModifiedOnCell'\nimport { ModifiedByCell } from '../../EntityFinder/details/view/table/ModifiedByCell'\nimport { CreatedOnCell } from '../../EntityFinder/details/view/table/CreatedOnCell'\nimport { FileEntitySizeCell } from '../../EntityFinder/details/view/table/FileEntitySizeCell'\nimport { FileEntityMD5Cell } from '../../EntityFinder/details/view/table/FileEntityMD5Cell'\nimport { AddFileToDownloadListCell } from '../../EntityFinder/details/view/table/AddToDownloadListCell'\nimport {\n  NameColumnHeader,\n  CreatedOnColumnHeader,\n  ModifiedOnColumnHeader,\n} from '../components/ColumnHeaders'\nimport { EntityBadgeIconsCell } from '../components/EntityBadgeIconsCell'\nimport { CheckboxCell } from '../components/CheckboxCell'\nimport PlaylistAddIcon from '@mui/icons-material/PlaylistAdd'\n\nexport const useTableColumns = (\n  enableSorting: boolean,\n  showCheckboxColumn = false,\n) => {\n  // Responsive design hooks\n  const theme = useTheme()\n  const isXtraLarge = useMediaQuery(theme.breakpoints.up('xl'))\n  const isMediumAndUp = useMediaQuery(theme.breakpoints.up('md'))\n\n  // Table columns\n  const columns = useMemo<ColumnDef<EntityBundleRow>[]>(() => {\n    const baseColumns: ColumnDef<EntityBundleRow>[] = []\n\n    if (showCheckboxColumn) {\n      baseColumns.push({\n        id: 'select',\n        header: '',\n        cell: CheckboxCell,\n        enableSorting: false,\n        size: 45,\n        minSize: 45,\n        maxSize: 45,\n      })\n    }\n\n    baseColumns.push({\n      accessorKey: 'entityHeader.name',\n      id: 'name',\n      header: NameColumnHeader,\n      cell: NameCell,\n      enableSorting: enableSorting,\n      size: 450, // Default width for Name column\n    })\n    if (isMediumAndUp) {\n      baseColumns.push({\n        id: 'badges',\n        header: '',\n        cell: EntityBadgeIconsCell,\n        enableSorting: false,\n        size: 120, // Default width for Badges column\n      })\n      baseColumns.push({\n        id: 'id',\n        header: IdColumnHeader,\n        cell: IdCell,\n        enableSorting: false,\n      })\n    }\n    if (isXtraLarge) {\n      baseColumns.push({\n        accessorKey: 'entityHeader.createdOn',\n        id: 'createdOn',\n        header: CreatedOnColumnHeader,\n        cell: CreatedOnCell,\n        enableSorting: enableSorting,\n      })\n    }\n\n    if (isMediumAndUp) {\n      baseColumns.push({\n        accessorKey: 'entityHeader.modifiedOn',\n        id: 'modifiedOn',\n        header: ModifiedOnColumnHeader,\n        cell: ModifiedOnCell,\n        enableSorting: enableSorting,\n      })\n    }\n\n    if (isXtraLarge) {\n      baseColumns.push({\n        id: 'modifiedBy',\n        header: 'Modified By',\n        cell: ModifiedByCell,\n        enableSorting: false,\n      })\n    }\n\n    if (isMediumAndUp) {\n      baseColumns.push({\n        id: 'size',\n        header: 'Size',\n        cell: FileEntitySizeCell,\n        enableSorting: false,\n      })\n    }\n    if (isXtraLarge) {\n      baseColumns.push({\n        id: 'md5',\n        header: 'MD5',\n        cell: FileEntityMD5Cell,\n        enableSorting: false,\n      })\n    }\n\n    baseColumns.push({\n      id: 'download',\n      header: 'Download',\n      cell: props => (\n        <AddFileToDownloadListCell\n          {...props}\n          downloadIcon={<PlaylistAddIcon />}\n        />\n      ),\n      enableSorting: false,\n      size: 90,\n    })\n\n    return baseColumns\n  }, [enableSorting, isXtraLarge, isMediumAndUp, showCheckboxColumn])\n\n  return columns\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAsBA,IAAa,KACX,GACA,IAAqB,OAClB;CAEH,IAAM,IAAQ,EAAS,GACjB,IAAc,EAAc,EAAM,YAAY,GAAG,IAAI,CAAC,GACtD,IAAgB,EAAc,EAAM,YAAY,GAAG,IAAI,CAAC;CAuG9D,OApGgB,QAA4C;EAC1D,IAAM,IAA4C,CAAC;EAgGnD,OA9FI,KACF,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;GACf,MAAM;GACN,SAAS;GACT,SAAS;EACX,CAAC,GAGH,EAAY,KAAK;GACf,aAAa;GACb,IAAI;GACJ,QAAQ;GACR,MAAM;GACS;GACf,MAAM;EACR,CAAC,GACG,MACF,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;GACf,MAAM;EACR,CAAC,GACD,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;EACjB,CAAC,IAEC,KACF,EAAY,KAAK;GACf,aAAa;GACb,IAAI;GACJ,QAAQ;GACR,MAAM;GACS;EACjB,CAAC,GAGC,KACF,EAAY,KAAK;GACf,aAAa;GACb,IAAI;GACJ,QAAQ;GACR,MAAM;GACS;EACjB,CAAC,GAGC,KACF,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;EACjB,CAAC,GAGC,KACF,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;EACjB,CAAC,GAEC,KACF,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;EACjB,CAAC,GAGH,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,OAAM,MACJ,kBAAC,GAAD;IACE,GAAI;IACJ,cAAc,kBAAC,GAAD,CAAkB,CAAA;GACjC,CAAA;GAEH,eAAe;GACf,MAAM;EACR,CAAC,GAEM;CACT,GAAG;EAAC;EAAe;EAAa;EAAe;CAAkB,CAE1D;AACT"}
+{"version":3,"file":"useTableColumns.js","names":[],"sources":["../../../../src/components/EntityTreeTable/hooks/useTableColumns.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { ColumnDef } from '@tanstack/react-table'\nimport { useTheme, useMediaQuery } from '@mui/material'\nimport { EntityBundleRow } from '../EntityTreeTable'\nimport { NameCell } from '../components/EntityNameCell'\nimport { IdCell } from '../components/IdCell'\nimport { IdColumnHeader } from '../components/IdColumnHeader'\nimport { ModifiedOnCell } from '../../EntityFinder/details/view/table/ModifiedOnCell'\nimport { ModifiedByCell } from '../../EntityFinder/details/view/table/ModifiedByCell'\nimport { CreatedOnCell } from '../../EntityFinder/details/view/table/CreatedOnCell'\nimport { FileEntitySizeCell } from '../../EntityFinder/details/view/table/FileEntitySizeCell'\nimport { FileEntityMD5Cell } from '../../EntityFinder/details/view/table/FileEntityMD5Cell'\nimport { AddFileToDownloadListCell } from '../../EntityFinder/details/view/table/AddToDownloadListCell'\nimport {\n  NameColumnHeader,\n  CreatedOnColumnHeader,\n  ModifiedOnColumnHeader,\n} from '../components/ColumnHeaders'\nimport { EntityBadgeIconsCell } from '../components/EntityBadgeIconsCell'\nimport { CheckboxCell } from '../components/CheckboxCell'\nimport PlaylistAddIcon from '@mui/icons-material/PlaylistAdd'\n\nexport const useTableColumns = (\n  enableSorting: boolean,\n  showCheckboxColumn = false,\n) => {\n  // Responsive design hooks\n  const theme = useTheme()\n  const isXtraLarge = useMediaQuery(theme.breakpoints.up('xl'))\n  const isMediumAndUp = useMediaQuery(theme.breakpoints.up('md'))\n\n  // Table columns\n  const columns = useMemo<ColumnDef<EntityBundleRow>[]>(() => {\n    const baseColumns: ColumnDef<EntityBundleRow>[] = []\n\n    if (showCheckboxColumn) {\n      baseColumns.push({\n        id: 'select',\n        header: '',\n        cell: CheckboxCell,\n        enableSorting: false,\n        size: 45,\n        minSize: 45,\n        maxSize: 45,\n      })\n    }\n\n    baseColumns.push({\n      accessorKey: 'entityHeader.name',\n      id: 'name',\n      header: NameColumnHeader,\n      cell: NameCell,\n      enableSorting: enableSorting,\n      size: 600,\n    })\n    if (isMediumAndUp) {\n      baseColumns.push({\n        id: 'badges',\n        header: '',\n        cell: EntityBadgeIconsCell,\n        enableSorting: false,\n        enableResizing: false,\n        size: 120,\n      })\n      baseColumns.push({\n        id: 'id',\n        header: IdColumnHeader,\n        cell: IdCell,\n        enableSorting: false,\n        size: 110,\n      })\n    }\n    if (isXtraLarge) {\n      baseColumns.push({\n        accessorKey: 'entityHeader.createdOn',\n        id: 'createdOn',\n        header: CreatedOnColumnHeader,\n        cell: CreatedOnCell,\n        enableSorting: enableSorting,\n        size: 130,\n      })\n    }\n\n    if (isMediumAndUp) {\n      baseColumns.push({\n        accessorKey: 'entityHeader.modifiedOn',\n        id: 'modifiedOn',\n        header: ModifiedOnColumnHeader,\n        cell: ModifiedOnCell,\n        enableSorting: enableSorting,\n        size: 130,\n      })\n    }\n\n    if (isXtraLarge) {\n      baseColumns.push({\n        id: 'modifiedBy',\n        header: 'Modified By',\n        cell: ModifiedByCell,\n        enableSorting: false,\n        size: 130,\n      })\n    }\n\n    if (isMediumAndUp) {\n      baseColumns.push({\n        id: 'size',\n        header: 'Size',\n        cell: FileEntitySizeCell,\n        enableSorting: false,\n        size: 80,\n      })\n    }\n    if (isXtraLarge) {\n      baseColumns.push({\n        id: 'md5',\n        header: 'MD5',\n        cell: FileEntityMD5Cell,\n        enableSorting: false,\n      })\n    }\n\n    baseColumns.push({\n      id: 'download',\n      header: 'Download',\n      cell: props => (\n        <AddFileToDownloadListCell\n          {...props}\n          downloadIcon={<PlaylistAddIcon />}\n        />\n      ),\n      enableSorting: false,\n      size: 90,\n    })\n\n    return baseColumns\n  }, [enableSorting, isXtraLarge, isMediumAndUp, showCheckboxColumn])\n\n  return columns\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAsBA,IAAa,KACX,GACA,IAAqB,OAClB;CAEH,IAAM,IAAQ,EAAS,GACjB,IAAc,EAAc,EAAM,YAAY,GAAG,IAAI,CAAC,GACtD,IAAgB,EAAc,EAAM,YAAY,GAAG,IAAI,CAAC;CA6G9D,OA1GgB,QAA4C;EAC1D,IAAM,IAA4C,CAAC;EAsGnD,OApGI,KACF,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;GACf,MAAM;GACN,SAAS;GACT,SAAS;EACX,CAAC,GAGH,EAAY,KAAK;GACf,aAAa;GACb,IAAI;GACJ,QAAQ;GACR,MAAM;GACS;GACf,MAAM;EACR,CAAC,GACG,MACF,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;GACf,gBAAgB;GAChB,MAAM;EACR,CAAC,GACD,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;GACf,MAAM;EACR,CAAC,IAEC,KACF,EAAY,KAAK;GACf,aAAa;GACb,IAAI;GACJ,QAAQ;GACR,MAAM;GACS;GACf,MAAM;EACR,CAAC,GAGC,KACF,EAAY,KAAK;GACf,aAAa;GACb,IAAI;GACJ,QAAQ;GACR,MAAM;GACS;GACf,MAAM;EACR,CAAC,GAGC,KACF,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;GACf,MAAM;EACR,CAAC,GAGC,KACF,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;GACf,MAAM;EACR,CAAC,GAEC,KACF,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;EACjB,CAAC,GAGH,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,OAAM,MACJ,kBAAC,GAAD;IACE,GAAI;IACJ,cAAc,kBAAC,GAAD,CAAkB,CAAA;GACjC,CAAA;GAEH,eAAe;GACf,MAAM;EACR,CAAC,GAEM;CACT,GAAG;EAAC;EAAe;EAAa;EAAe;CAAkB,CAE1D;AACT"}

package/dist/components/ExperimentalMode/ExperimentalMode.js

@@ -9,7 +9,8 @@ var d = "experimental-mode", f = "This mode gives you early access to features t
 function p({ onExperimentalModeToggle: p }) {
 	let m = a(), [h, g, _] = c(e, {
 		path: "/",
-		domain: (typeof window < "u" ? window.location.hostname.toLowerCase() : "").endsWith(".synapse.org") ? "synapse.org" : void 0
+		domain: (typeof window < "u" ? window.location.hostname.toLowerCase() : "").endsWith(".synapse.org") ? "synapse.org" : void 0,
+		initializeWithValue: !1
 	});
 	return /* @__PURE__ */ s(t, {
 		sx: {

package/dist/components/ExperimentalMode/ExperimentalMode.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExperimentalMode.js","names":[],"sources":["../../../src/components/ExperimentalMode/ExperimentalMode.tsx"],"sourcesContent":["import { EXPERIMENTAL_MODE_COOKIE } from '@/utils/SynapseConstants'\nimport { InfoOutlined } from '@mui/icons-material'\nimport { Box, IconButton, Tooltip, Typography, useTheme } from '@mui/material'\nimport Switch from 'react-switch'\nimport { useCookieValue } from '@react-hookz/web/useCookieValue/index.js'\n\nconst EXPERIMENTAL_MODE_SWITCH_ID = 'experimental-mode'\nconst experimentalModeText =\n  'This mode gives you early access to features that are still in development. Please note that we do not guarantee an absence of errors, and that the data created using these features may be lost during product upgrade.'\n\nexport type ExperimentalModeProps = {\n  onExperimentalModeToggle?: (newValue: boolean) => void\n}\nfunction ExperimentalMode({ onExperimentalModeToggle }: ExperimentalModeProps) {\n  const theme = useTheme()\n\n  const getExperimentalModeCookieOptions = () => {\n    const hostname =\n      typeof window !== 'undefined'\n        ? window.location.hostname.toLowerCase()\n        : ''\n    return {\n      path: '/',\n      domain: hostname.endsWith('.synapse.org') ? 'synapse.org' : undefined,\n    }\n  }\n\n  const [\n    experimentalModeCookie,\n    setExperimentalModeCookie,\n    removeExperimentalModeCookie,\n  ] = useCookieValue(\n    EXPERIMENTAL_MODE_COOKIE,\n    getExperimentalModeCookieOptions(),\n  )\n\n  const createExperimentalModeCookie = () => {\n    setExperimentalModeCookie('true')\n\n    if (onExperimentalModeToggle) {\n      onExperimentalModeToggle(true)\n    }\n  }\n\n  const deleteExperimentalModeCookie = () => {\n    removeExperimentalModeCookie()\n    if (onExperimentalModeToggle) {\n      onExperimentalModeToggle(false)\n    }\n  }\n\n  return (\n    <Box sx={{ display: 'flex', alignItems: 'center' }}>\n      <Typography\n        component={'label'}\n        variant=\"body1\"\n        htmlFor={EXPERIMENTAL_MODE_SWITCH_ID}\n      >\n        Experimental Mode\n      </Typography>\n      <Tooltip title={experimentalModeText} arrow placement=\"top\">\n        <IconButton\n          aria-label=\"info\"\n          color=\"inherit\"\n          sx={{ '&:hover': { backgroundColor: 'transparent' } }}\n        >\n          <InfoOutlined sx={{ verticalAlign: 'middle' }} />\n        </IconButton>\n      </Tooltip>\n      <Switch\n        id={EXPERIMENTAL_MODE_SWITCH_ID}\n        width={35}\n        height={20}\n        onColor={theme.palette.secondary.main}\n        checkedIcon={false}\n        uncheckedIcon={false}\n        checked={experimentalModeCookie === 'true'}\n        onChange={\n          experimentalModeCookie === 'true'\n            ? deleteExperimentalModeCookie\n            : createExperimentalModeCookie\n        }\n      />\n    </Box>\n  )\n}\n\nexport default ExperimentalMode\n"],"mappings":";;;;;;;AAMA,IAAM,IAA8B,qBAC9B,IACJ;AAKF,SAAS,EAAiB,EAAE,+BAAmD;CAC7E,IAAM,IAAQ,EAAS,GAajB,CACJ,GACA,GACA,KACE,EACF,GAXO;EACL,MAAM;EACN,SALA,OAAO,SAAW,MACd,OAAO,SAAS,SAAS,YAAY,IACrC,IAGa,SAAS,cAAc,IAAI,gBAAgB,KAAA;CAC9D,CAUF;CAiBA,OACE,kBAAC,GAAD;EAAK,IAAI;GAAE,SAAS;GAAQ,YAAY;EAAS;YAAjD;GACE,kBAAC,GAAD;IACE,WAAW;IACX,SAAQ;IACR,SAAS;cACV;GAEW,CAAA;GACZ,kBAAC,GAAD;IAAS,OAAO;IAAsB,OAAA;IAAM,WAAU;cACpD,kBAAC,GAAD;KACE,cAAW;KACX,OAAM;KACN,IAAI,EAAE,WAAW,EAAE,iBAAiB,cAAc,EAAE;eAEpD,kBAAC,GAAD,EAAc,IAAI,EAAE,eAAe,SAAS,EAAI,CAAA;IACtC,CAAA;GACL,CAAA;GACT,kBAAC,GAAD;IACE,IAAI;IACJ,OAAO;IACP,QAAQ;IACR,SAAS,EAAM,QAAQ,UAAU;IACjC,aAAa;IACb,eAAe;IACf,SAAS,MAA2B;IACpC,UACE,MAA2B,eAlCQ;KAEzC,AADA,EAA6B,GACzB,KACF,EAAyB,EAAK;IAElC,UAb2C;KAGzC,AAFA,EAA0B,MAAM,GAE5B,KACF,EAAyB,EAAI;IAEjC;GAwCK,CAAA;EACE;;AAET"}
+{"version":3,"file":"ExperimentalMode.js","names":[],"sources":["../../../src/components/ExperimentalMode/ExperimentalMode.tsx"],"sourcesContent":["import { EXPERIMENTAL_MODE_COOKIE } from '@/utils/SynapseConstants'\nimport { InfoOutlined } from '@mui/icons-material'\nimport { Box, IconButton, Tooltip, Typography, useTheme } from '@mui/material'\nimport Switch from 'react-switch'\nimport { useCookieValue } from '@react-hookz/web/useCookieValue/index.js'\n\nconst EXPERIMENTAL_MODE_SWITCH_ID = 'experimental-mode'\nconst experimentalModeText =\n  'This mode gives you early access to features that are still in development. Please note that we do not guarantee an absence of errors, and that the data created using these features may be lost during product upgrade.'\n\nexport type ExperimentalModeProps = {\n  onExperimentalModeToggle?: (newValue: boolean) => void\n}\nfunction ExperimentalMode({ onExperimentalModeToggle }: ExperimentalModeProps) {\n  const theme = useTheme()\n\n  const getExperimentalModeCookieOptions = () => {\n    const hostname =\n      typeof window !== 'undefined'\n        ? window.location.hostname.toLowerCase()\n        : ''\n    return {\n      path: '/',\n      domain: hostname.endsWith('.synapse.org') ? 'synapse.org' : undefined,\n    }\n  }\n\n  const [\n    experimentalModeCookie,\n    setExperimentalModeCookie,\n    removeExperimentalModeCookie,\n  ] = useCookieValue(EXPERIMENTAL_MODE_COOKIE, {\n    ...getExperimentalModeCookieOptions(),\n    initializeWithValue: false,\n  })\n\n  const createExperimentalModeCookie = () => {\n    setExperimentalModeCookie('true')\n\n    if (onExperimentalModeToggle) {\n      onExperimentalModeToggle(true)\n    }\n  }\n\n  const deleteExperimentalModeCookie = () => {\n    removeExperimentalModeCookie()\n    if (onExperimentalModeToggle) {\n      onExperimentalModeToggle(false)\n    }\n  }\n\n  return (\n    <Box sx={{ display: 'flex', alignItems: 'center' }}>\n      <Typography\n        component={'label'}\n        variant=\"body1\"\n        htmlFor={EXPERIMENTAL_MODE_SWITCH_ID}\n      >\n        Experimental Mode\n      </Typography>\n      <Tooltip title={experimentalModeText} arrow placement=\"top\">\n        <IconButton\n          aria-label=\"info\"\n          color=\"inherit\"\n          sx={{ '&:hover': { backgroundColor: 'transparent' } }}\n        >\n          <InfoOutlined sx={{ verticalAlign: 'middle' }} />\n        </IconButton>\n      </Tooltip>\n      <Switch\n        id={EXPERIMENTAL_MODE_SWITCH_ID}\n        width={35}\n        height={20}\n        onColor={theme.palette.secondary.main}\n        checkedIcon={false}\n        uncheckedIcon={false}\n        checked={experimentalModeCookie === 'true'}\n        onChange={\n          experimentalModeCookie === 'true'\n            ? deleteExperimentalModeCookie\n            : createExperimentalModeCookie\n        }\n      />\n    </Box>\n  )\n}\n\nexport default ExperimentalMode\n"],"mappings":";;;;;;;AAMA,IAAM,IAA8B,qBAC9B,IACJ;AAKF,SAAS,EAAiB,EAAE,+BAAmD;CAC7E,IAAM,IAAQ,EAAS,GAajB,CACJ,GACA,GACA,KACE,EAAe,GAA0B;EATzC,MAAM;EACN,SALA,OAAO,SAAW,MACd,OAAO,SAAS,SAAS,YAAY,IACrC,IAGa,SAAS,cAAc,IAAI,gBAAgB,KAAA;EAU9D,qBAAqB;CACvB,CAAC;CAiBD,OACE,kBAAC,GAAD;EAAK,IAAI;GAAE,SAAS;GAAQ,YAAY;EAAS;YAAjD;GACE,kBAAC,GAAD;IACE,WAAW;IACX,SAAQ;IACR,SAAS;cACV;GAEW,CAAA;GACZ,kBAAC,GAAD;IAAS,OAAO;IAAsB,OAAA;IAAM,WAAU;cACpD,kBAAC,GAAD;KACE,cAAW;KACX,OAAM;KACN,IAAI,EAAE,WAAW,EAAE,iBAAiB,cAAc,EAAE;eAEpD,kBAAC,GAAD,EAAc,IAAI,EAAE,eAAe,SAAS,EAAI,CAAA;IACtC,CAAA;GACL,CAAA;GACT,kBAAC,GAAD;IACE,IAAI;IACJ,OAAO;IACP,QAAQ;IACR,SAAS,EAAM,QAAQ,UAAU;IACjC,aAAa;IACb,eAAe;IACf,SAAS,MAA2B;IACpC,UACE,MAA2B,eAlCQ;KAEzC,AADA,EAA6B,GACzB,KACF,EAAyB,EAAK;IAElC,UAb2C;KAGzC,AAFA,EAA0B,MAAM,GAE5B,KACF,EAAyB,EAAI;IAEjC;GAwCK,CAAA;EACE;;AAET"}

package/dist/components/FilePreview/PdfPreview.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PdfPreview.d.ts","sourceRoot":"","sources":["../../../src/components/FilePreview/PdfPreview.tsx"],"names":[],"mappings":"AAIA,OAAO,EACL,UAAU,EACV,qBAAqB,EACtB,MAAM,iCAAiC,CAAA;AAGxC,MAAM,MAAM,eAAe,GAAG;IAC5B,UAAU,EAAE,UAAU,CAAA;IACtB,qBAAqB,EAAE,qBAAqB,CAAA;CAC7C,CAAA;AAED,eAAO,MAAM,UAAU,QAAyB,CAAA;AAGhD;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,KAAK,EAAE,eAAe,2CA8BxD"}
+{"version":3,"file":"PdfPreview.d.ts","sourceRoot":"","sources":["../../../src/components/FilePreview/PdfPreview.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,UAAU,EACV,qBAAqB,EACtB,MAAM,iCAAiC,CAAA;AAGxC,MAAM,MAAM,eAAe,GAAG;IAC5B,UAAU,EAAE,UAAU,CAAA;IACtB,qBAAqB,EAAE,qBAAqB,CAAA;CAC7C,CAAA;AAED,eAAO,MAAM,UAAU,QAAyB,CAAA;AAGhD;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,KAAK,EAAE,eAAe,2CAsCxD"}

package/dist/components/FilePreview/PdfPreview.js

@@ -1,37 +1,40 @@
-import { BackendDestinationEnum as e, getEndpoint as t } from "../../utils/functions/getEndpoint.js";
-import { calculateFriendlyFileSize as n } from "../../utils/functions/calculateFriendlyFileSize.js";
-import r from "../../synapse-client/index.js";
-import "../../utils/functions/index.js";
-import { useRef as i } from "react";
-import { Alert as a } from "@mui/material";
-import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
+import { calculateFriendlyFileSize as e } from "../../utils/functions/calculateFriendlyFileSize.js";
+import t from "../../synapse-client/index.js";
+import { useFetchBlobUrl as n } from "../../utils/hooks/useFetchBlobUrl.js";
+import { Alert as r, Skeleton as i } from "@mui/material";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
 //#region src/components/FilePreview/PdfPreview.tsx
-var l = 1024 ** 2 * 30, u = n(l);
-function d(d) {
-	let { fileHandle: f, fileHandleAssociation: p } = d, m = i(null), h = n(f.contentSize);
-	if (f.contentSize > l) return /* @__PURE__ */ c(a, {
+var s = 1024 ** 2 * 30, c = e(s);
+function l(l) {
+	let { fileHandle: u, fileHandleAssociation: d } = l, { blobUrl: f, error: p } = n(u.contentSize > s ? void 0 : t.getPortalFileHandleServletUrl(d.fileHandleId, d.associateObjectId, d.associateObjectType)), m = e(u.contentSize);
+	return u.contentSize > s ? /* @__PURE__ */ o(r, {
 		severity: "error",
 		sx: { marginBottom: "20px" },
 		children: [
 			"The PDF preview was not shown because the file size (",
-			h,
+			m,
 			") exceeds the maximum preview size (",
-			u,
+			c,
 			")"
 		]
-	});
-	let g = r.getPortalFileHandleServletUrl(p.fileHandleId, p.associateObjectId, p.associateObjectType);
-	return /* @__PURE__ */ s(o, { children: /* @__PURE__ */ s("iframe", {
-		ref: m,
-		src: `${t(e.PORTAL_ENDPOINT)}pdf.js/web/viewer.html?file=${encodeURIComponent(g)}`,
+	}) : p ? /* @__PURE__ */ o(r, {
+		severity: "error",
+		sx: { marginBottom: "20px" },
+		children: ["The PDF preview could not be loaded: ", p.message]
+	}) : f ? /* @__PURE__ */ a("iframe", {
+		src: f,
 		height: "800px",
 		style: {
 			border: 0,
 			width: "100%"
 		}
-	}) });
+	}) : /* @__PURE__ */ a(i, {
+		variant: "rectangular",
+		width: "100%",
+		height: "800px"
+	});
 }
 //#endregion
-export { d as default, l as maxPdfSize };
+export { l as default, s as maxPdfSize };
 
 //# sourceMappingURL=PdfPreview.js.map

package/dist/components/FilePreview/PdfPreview.js.map

@@ -1 +1 @@
-{"version":3,"file":"PdfPreview.js","names":[],"sources":["../../../src/components/FilePreview/PdfPreview.tsx"],"sourcesContent":["import SynapseClient from '@/synapse-client'\nimport { BackendDestinationEnum, getEndpoint } from '@/utils/functions'\nimport { calculateFriendlyFileSize } from '@/utils/functions/calculateFriendlyFileSize'\nimport { Alert } from '@mui/material'\nimport {\n  FileHandle,\n  FileHandleAssociation,\n} from '@sage-bionetworks/synapse-types'\nimport { useRef } from 'react'\n\nexport type PdfPreviewProps = {\n  fileHandle: FileHandle\n  fileHandleAssociation: FileHandleAssociation\n}\n\nexport const maxPdfSize = Math.pow(1024, 2) * 30 // 30MB\nconst friendlyMaxPdfSize = calculateFriendlyFileSize(maxPdfSize) // 30MB\n\n/**\n * Renders raw HTML. Uses file handle data to determine if the content should be sanitized.\n * @param props\n * @returns\n */\nexport default function PdfPreview(props: PdfPreviewProps) {\n  const { fileHandle, fileHandleAssociation: fha } = props\n  const frameEl = useRef(null)\n\n  const friendlyFileSize = calculateFriendlyFileSize(fileHandle.contentSize)\n  if (fileHandle.contentSize > maxPdfSize) {\n    return (\n      <Alert severity=\"error\" sx={{ marginBottom: '20px' }}>\n        The PDF preview was not shown because the file size ({friendlyFileSize})\n        exceeds the maximum preview size ({friendlyMaxPdfSize})\n      </Alert>\n    )\n  }\n  const fhaUrl = SynapseClient.getPortalFileHandleServletUrl(\n    fha.fileHandleId,\n    fha.associateObjectId,\n    fha.associateObjectType,\n  )\n  return (\n    <>\n      <iframe\n        ref={frameEl}\n        src={`${getEndpoint(\n          BackendDestinationEnum.PORTAL_ENDPOINT,\n        )}pdf.js/web/viewer.html?file=${encodeURIComponent(fhaUrl)}`}\n        height=\"800px\"\n        style={{ border: 0, width: '100%' }}\n      />\n    </>\n  )\n}\n"],"mappings":";;;;;;;;AAeA,IAAa,IAAsB,QAAM,IAAK,IACxC,IAAqB,EAA0B,CAAU;AAO/D,SAAwB,EAAW,GAAwB;CACzD,IAAM,EAAE,eAAY,uBAAuB,MAAQ,GAC7C,IAAU,EAAO,IAAI,GAErB,IAAmB,EAA0B,EAAW,WAAW;CACzE,IAAI,EAAW,cAAc,GAC3B,OACE,kBAAC,GAAD;EAAO,UAAS;EAAQ,IAAI,EAAE,cAAc,OAAO;YAAnD;GAAsD;GACE;GAAiB;GACpC;GAAmB;EACjD;;CAGX,IAAM,IAAS,EAAc,8BAC3B,EAAI,cACJ,EAAI,mBACJ,EAAI,mBACN;CACA,OACE,kBAAA,GAAA,EAAA,UACE,kBAAC,UAAD;EACE,KAAK;EACL,KAAK,GAAG,EACN,EAAuB,eACzB,EAAE,8BAA8B,mBAAmB,CAAM;EACzD,QAAO;EACP,OAAO;GAAE,QAAQ;GAAG,OAAO;EAAO;CACnC,CAAA,EACD,CAAA;AAEN"}
+{"version":3,"file":"PdfPreview.js","names":[],"sources":["../../../src/components/FilePreview/PdfPreview.tsx"],"sourcesContent":["import SynapseClient from '@/synapse-client'\nimport { calculateFriendlyFileSize } from '@/utils/functions/calculateFriendlyFileSize'\nimport { Alert, Skeleton } from '@mui/material'\nimport {\n  FileHandle,\n  FileHandleAssociation,\n} from '@sage-bionetworks/synapse-types'\nimport { useFetchBlobUrl } from '@/utils/hooks/useFetchBlobUrl'\n\nexport type PdfPreviewProps = {\n  fileHandle: FileHandle\n  fileHandleAssociation: FileHandleAssociation\n}\n\nexport const maxPdfSize = Math.pow(1024, 2) * 30 // 30MB\nconst friendlyMaxPdfSize = calculateFriendlyFileSize(maxPdfSize) // 30MB\n\n/**\n * Renders raw HTML. Uses file handle data to determine if the content should be sanitized.\n * @param props\n * @returns\n */\nexport default function PdfPreview(props: PdfPreviewProps) {\n  const { fileHandle, fileHandleAssociation: fha } = props\n\n  const { blobUrl, error: blobError } = useFetchBlobUrl(\n    fileHandle.contentSize > maxPdfSize\n      ? undefined\n      : SynapseClient.getPortalFileHandleServletUrl(\n          fha.fileHandleId,\n          fha.associateObjectId,\n          fha.associateObjectType,\n        ),\n  )\n\n  const friendlyFileSize = calculateFriendlyFileSize(fileHandle.contentSize)\n  if (fileHandle.contentSize > maxPdfSize) {\n    return (\n      <Alert severity=\"error\" sx={{ marginBottom: '20px' }}>\n        The PDF preview was not shown because the file size ({friendlyFileSize})\n        exceeds the maximum preview size ({friendlyMaxPdfSize})\n      </Alert>\n    )\n  }\n\n  if (blobError) {\n    return (\n      <Alert severity=\"error\" sx={{ marginBottom: '20px' }}>\n        The PDF preview could not be loaded: {blobError.message}\n      </Alert>\n    )\n  }\n\n  if (!blobUrl) {\n    return <Skeleton variant=\"rectangular\" width=\"100%\" height=\"800px\" />\n  }\n\n  return (\n    <iframe src={blobUrl} height=\"800px\" style={{ border: 0, width: '100%' }} />\n  )\n}\n"],"mappings":";;;;;;AAcA,IAAa,IAAsB,QAAM,IAAK,IACxC,IAAqB,EAA0B,CAAU;AAO/D,SAAwB,EAAW,GAAwB;CACzD,IAAM,EAAE,eAAY,uBAAuB,MAAQ,GAE7C,EAAE,YAAS,OAAO,MAAc,EACpC,EAAW,cAAc,IACrB,KAAA,IACA,EAAc,8BACZ,EAAI,cACJ,EAAI,mBACJ,EAAI,mBACN,CACN,GAEM,IAAmB,EAA0B,EAAW,WAAW;CAsBzE,OArBI,EAAW,cAAc,IAEzB,kBAAC,GAAD;EAAO,UAAS;EAAQ,IAAI,EAAE,cAAc,OAAO;YAAnD;GAAsD;GACE;GAAiB;GACpC;GAAmB;EACjD;MAIP,IAEA,kBAAC,GAAD;EAAO,UAAS;EAAQ,IAAI,EAAE,cAAc,OAAO;YAAnD,CAAsD,yCACd,EAAU,OAC3C;MAIN,IAKH,kBAAC,UAAD;EAAQ,KAAK;EAAS,QAAO;EAAQ,OAAO;GAAE,QAAQ;GAAG,OAAO;EAAO;CAAI,CAAA,IAJpE,kBAAC,GAAD;EAAU,SAAQ;EAAc,OAAM;EAAO,QAAO;CAAS,CAAA;AAMxE"}

package/dist/components/GenericCard/SynapseCardLabel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SynapseCardLabel.d.ts","sourceRoot":"","sources":["../../../src/components/GenericCard/SynapseCardLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,qCAAqC,CAAA;AAM9D,OAAO,EACL,WAAW,EAEX,GAAG,EACH,YAAY,EACb,MAAM,iCAAiC,CAAA;AAIxC,OAAO,EACL,iBAAiB,EACjB,mBAAmB,EACnB,YAAY,EACb,MAAM,uBAAuB,CAAA;AAC9B,OAAO,EACL,WAAW,EACX,8BAA8B,EAC/B,MAAM,0CAA0C,CAAA;AASjD,KAAK,qBAAqB,GAAG;IAC3B,KAAK,EAAE,MAAM,CAAA;IACb,UAAU,EAAE,MAAM,CAAA;IAClB,SAAS,EACL,QAAQ,GACR,YAAY,GACZ,mBAAmB,GACnB,WAAW,GACX,8BAA8B,GAC9B,SAAS,CAAA;IACb,aAAa,EAAE,YAAY,EAAE,GAAG,SAAS,CAAA;IACzC,YAAY,EAAE,WAAW,EAAE,GAAG,SAAS,CAAA;IACvC,QAAQ,EAAE,OAAO,CAAA;IACjB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,EAAE,GAAG,CAAC,QAAQ,CAAC,CAAA;IACtB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,iBAAiB,CAAC,EAAE,iBAAiB,CAAA;CACtC,CAAA;AACD,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,2CA8Q5D"}
+{"version":3,"file":"SynapseCardLabel.d.ts","sourceRoot":"","sources":["../../../src/components/GenericCard/SynapseCardLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,qCAAqC,CAAA;AAO9D,OAAO,EACL,WAAW,EAEX,GAAG,EACH,YAAY,EACb,MAAM,iCAAiC,CAAA;AAIxC,OAAO,EACL,iBAAiB,EACjB,mBAAmB,EACnB,YAAY,EACb,MAAM,uBAAuB,CAAA;AAC9B,OAAO,EACL,WAAW,EACX,8BAA8B,EAC/B,MAAM,0CAA0C,CAAA;AASjD,KAAK,qBAAqB,GAAG;IAC3B,KAAK,EAAE,MAAM,CAAA;IACb,UAAU,EAAE,MAAM,CAAA;IAClB,SAAS,EACL,QAAQ,GACR,YAAY,GACZ,mBAAmB,GACnB,WAAW,GACX,8BAA8B,GAC9B,SAAS,CAAA;IACb,aAAa,EAAE,YAAY,EAAE,GAAG,SAAS,CAAA;IACzC,YAAY,EAAE,WAAW,EAAE,GAAG,SAAS,CAAA;IACvC,QAAQ,EAAE,OAAO,CAAA;IACjB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,EAAE,GAAG,CAAC,QAAQ,CAAC,CAAA;IACtB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,iBAAiB,CAAC,EAAE,iBAAiB,CAAA;CACtC,CAAA;AACD,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,2CAiR5D"}