synapse-react-client 4.0.18 → 4.0.20

package/dist/components/PortalSectionHeader/PortalSectionHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"PortalSectionHeader.js","names":[],"sources":["../../../src/components/PortalSectionHeader/PortalSectionHeader.tsx"],"sourcesContent":["import React from 'react'\nimport { spreadSx } from '@/theme/spreadSx'\nimport { isExternalLink } from '@/utils/functions/IsExternalLink'\nimport {\n  Box,\n  Button,\n  Link as MuiLink,\n  Stack,\n  SxProps,\n  Theme,\n  Typography,\n} from '@mui/material'\nimport { Link as RouterLink } from 'react-router'\n\nexport type PortalSectionHeaderProps = {\n  title: string\n  buttonText?: string\n  summaryText?: React.ReactNode\n  link?: string\n  sx?: SxProps<Theme>\n  centered?: boolean\n  reverseButtonAndText?: boolean\n}\n\nconst PortalSectionHeader = ({\n  title,\n  buttonText,\n  summaryText,\n  link,\n  sx,\n  centered = false,\n  reverseButtonAndText = false,\n}: PortalSectionHeaderProps): React.ReactNode => {\n  const isExternal = isExternalLink(link ?? '')\n\n  return (\n    <Box\n      sx={spreadSx(sx, {\n        ...(centered && {\n          width: '100%',\n        }),\n      })}\n    >\n      <Stack\n        sx={{\n          gap: '16px',\n          ...(centered && {\n            textAlign: 'center',\n            alignItems: 'center',\n          }),\n        }}\n      >\n        <Typography\n          variant=\"headline2\"\n          sx={theme => ({\n            paddingTop: '30px',\n            color: 'grey.1000',\n            fontSize: { xs: '24px', md: '32px' },\n            borderTop: '4px solid',\n            borderColor: 'grey.400',\n            [theme.breakpoints.down('md')]: {\n              width: '100%',\n            },\n          })}\n        >\n          {title}\n        </Typography>\n        {(buttonText || summaryText) && (\n          <Stack\n            sx={{\n              gap: '16px',\n              width: '100%',\n              ...(centered && {\n                alignItems: 'center',\n                width: '100%',\n              }),\n              ...(reverseButtonAndText && {\n                flexDirection: 'column-reverse',\n              }),\n            }}\n          >\n            {buttonText && (\n              <Button\n                variant=\"contained\"\n                component={isExternal ? MuiLink : RouterLink}\n                {...(isExternal\n                  ? {\n                      href: link,\n                      target: '_blank',\n                      rel: 'noopener noreferrer',\n                    }\n                  : { to: link })}\n                sx={theme => ({\n                  [theme.breakpoints.down('sm')]: {\n                    width: '100%',\n                  },\n                  maxWidth: '100%',\n                  width: 'fit-content',\n                  whiteSpace: 'nowrap',\n                  padding: { xs: '6px', sm: '6px 24px' },\n                  fontWeight: '600',\n                  fontSize: { xs: '16px', sm: '18px' },\n                  lineHeight: '144%',\n                })}\n              >\n                {buttonText}\n              </Button>\n            )}\n            {summaryText && (\n              <Typography\n                variant=\"body1\"\n                sx={{\n                  fontStyle: 'italic',\n                  color: 'grey.800',\n                  fontSize: '18px',\n                  lineHeight: '27px',\n                }}\n              >\n                {summaryText}\n              </Typography>\n            )}\n          </Stack>\n        )}\n      </Stack>\n    </Box>\n  )\n}\n\nexport default PortalSectionHeader\n"],"mappings":";;;;;;;AAwBA,IAAM,KAAuB,EAC3B,UACA,eACA,gBACA,SACA,OACA,cAAW,IACX,0BAAuB,SACwB;CAC/C,IAAM,IAAa,EAAe,KAAQ,GAAG;AAE7C,QACE,kBAAC,GAAD;EACE,IAAI,EAAS,GAAI,EACf,GAAI,KAAY,EACd,OAAO,QACR,EACF,CAAC;YAEF,kBAAC,GAAD;GACE,IAAI;IACF,KAAK;IACL,GAAI,KAAY;KACd,WAAW;KACX,YAAY;KACb;IACF;aAPH,CASE,kBAAC,GAAD;IACE,SAAQ;IACR,KAAI,OAAU;KACZ,YAAY;KACZ,OAAO;KACP,UAAU;MAAE,IAAI;MAAQ,IAAI;MAAQ;KACpC,WAAW;KACX,aAAa;MACZ,EAAM,YAAY,KAAK,KAAK,GAAG,EAC9B,OAAO,QACR;KACF;cAEA;IACU,CAAA,GACX,KAAc,MACd,kBAAC,GAAD;IACE,IAAI;KACF,KAAK;KACL,OAAO;KACP,GAAI,KAAY;MACd,YAAY;MACZ,OAAO;MACR;KACD,GAAI,KAAwB,EAC1B,eAAe,kBAChB;KACF;cAXH,CAaG,KACC,kBAAC,GAAD;KACE,SAAQ;KACR,WAAW,IAAa,IAAU;KAClC,GAAK,IACD;MACE,MAAM;MACN,QAAQ;MACR,KAAK;MACN,GACD,EAAE,IAAI,GAAM;KAChB,KAAI,OAAU;OACX,EAAM,YAAY,KAAK,KAAK,GAAG,EAC9B,OAAO,QACR;MACD,UAAU;MACV,OAAO;MACP,YAAY;MACZ,SAAS;OAAE,IAAI;OAAO,IAAI;OAAY;MACtC,YAAY;MACZ,UAAU;OAAE,IAAI;OAAQ,IAAI;OAAQ;MACpC,YAAY;MACb;eAEA;KACM,CAAA,EAEV,KACC,kBAAC,GAAD;KACE,SAAQ;KACR,IAAI;MACF,WAAW;MACX,OAAO;MACP,UAAU;MACV,YAAY;MACb;eAEA;KACU,CAAA,CAET;MAEJ;;EACJ,CAAA"}
+{"version":3,"file":"PortalSectionHeader.js","names":[],"sources":["../../../src/components/PortalSectionHeader/PortalSectionHeader.tsx"],"sourcesContent":["import React from 'react'\nimport { spreadSx } from '@/theme/spreadSx'\nimport { isExternalLink } from '@/utils/functions/IsExternalLink'\nimport {\n  Box,\n  Button,\n  Link as MuiLink,\n  Stack,\n  SxProps,\n  Theme,\n  Typography,\n} from '@mui/material'\nimport { Link as RouterLink } from 'react-router'\n\nexport type PortalSectionHeaderProps = {\n  title: string\n  buttonText?: string\n  summaryText?: React.ReactNode\n  link?: string\n  sx?: SxProps<Theme>\n  centered?: boolean\n  reverseButtonAndText?: boolean\n}\n\nconst PortalSectionHeader = ({\n  title,\n  buttonText,\n  summaryText,\n  link,\n  sx,\n  centered = false,\n  reverseButtonAndText = false,\n}: PortalSectionHeaderProps): React.ReactNode => {\n  const isExternal = isExternalLink(link ?? '')\n\n  return (\n    <Box\n      sx={spreadSx(sx, {\n        ...(centered && {\n          width: '100%',\n        }),\n      })}\n    >\n      <Stack\n        sx={{\n          gap: '16px',\n          ...(centered && {\n            textAlign: 'center',\n            alignItems: 'center',\n          }),\n        }}\n      >\n        <Typography\n          variant=\"headline2\"\n          sx={theme => ({\n            paddingTop: '30px',\n            color: 'grey.1000',\n            fontSize: { xs: '24px', md: '32px' },\n            borderTop: '4px solid',\n            borderColor: 'grey.400',\n            [theme.breakpoints.down('md')]: {\n              width: '100%',\n            },\n          })}\n        >\n          {title}\n        </Typography>\n        {(buttonText || summaryText) && (\n          <Stack\n            sx={{\n              gap: '16px',\n              width: '100%',\n              ...(centered && {\n                alignItems: 'center',\n                width: '100%',\n              }),\n              ...(reverseButtonAndText && {\n                flexDirection: 'column-reverse',\n              }),\n            }}\n          >\n            {buttonText && (\n              <Button\n                variant=\"contained\"\n                component={isExternal ? MuiLink : RouterLink}\n                {...(isExternal\n                  ? {\n                      href: link,\n                      target: '_blank',\n                      rel: 'noopener noreferrer',\n                    }\n                  : { to: link })}\n                sx={theme => ({\n                  [theme.breakpoints.down('sm')]: {\n                    width: '100%',\n                  },\n                  maxWidth: '100%',\n                  width: 'fit-content',\n                  whiteSpace: 'nowrap',\n                  padding: { xs: '6px', sm: '6px 24px' },\n                  fontWeight: '600',\n                  fontSize: { xs: '16px', sm: '18px' },\n                  lineHeight: '144%',\n                })}\n              >\n                {buttonText}\n              </Button>\n            )}\n            {summaryText && (\n              <Typography\n                variant=\"body1\"\n                sx={{\n                  fontStyle: 'italic',\n                  color: 'grey.800',\n                  fontSize: '18px',\n                  lineHeight: '27px',\n                }}\n              >\n                {summaryText}\n              </Typography>\n            )}\n          </Stack>\n        )}\n      </Stack>\n    </Box>\n  )\n}\n\nexport default PortalSectionHeader\n"],"mappings":";;;;;;;AAwBA,IAAM,KAAuB,EAC3B,UACA,eACA,gBACA,SACA,OACA,cAAW,IACX,0BAAuB,SACwB;CAC/C,IAAM,IAAa,EAAe,KAAQ,EAAE;CAE5C,OACE,kBAAC,GAAD;EACE,IAAI,EAAS,GAAI,EACf,GAAI,KAAY,EACd,OAAO,OACT,EACF,CAAC;YAED,kBAAC,GAAD;GACE,IAAI;IACF,KAAK;IACL,GAAI,KAAY;KACd,WAAW;KACX,YAAY;IACd;GACF;aAPF,CASE,kBAAC,GAAD;IACE,SAAQ;IACR,KAAI,OAAU;KACZ,YAAY;KACZ,OAAO;KACP,UAAU;MAAE,IAAI;MAAQ,IAAI;KAAO;KACnC,WAAW;KACX,aAAa;MACZ,EAAM,YAAY,KAAK,IAAI,IAAI,EAC9B,OAAO,OACT;IACF;cAEC;GACS,CAAA,IACV,KAAc,MACd,kBAAC,GAAD;IACE,IAAI;KACF,KAAK;KACL,OAAO;KACP,GAAI,KAAY;MACd,YAAY;MACZ,OAAO;KACT;KACA,GAAI,KAAwB,EAC1B,eAAe,iBACjB;IACF;cAXF,CAaG,KACC,kBAAC,GAAD;KACE,SAAQ;KACR,WAAW,IAAa,IAAU;KAClC,GAAK,IACD;MACE,MAAM;MACN,QAAQ;MACR,KAAK;KACP,IACA,EAAE,IAAI,EAAK;KACf,KAAI,OAAU;OACX,EAAM,YAAY,KAAK,IAAI,IAAI,EAC9B,OAAO,OACT;MACA,UAAU;MACV,OAAO;MACP,YAAY;MACZ,SAAS;OAAE,IAAI;OAAO,IAAI;MAAW;MACrC,YAAY;MACZ,UAAU;OAAE,IAAI;OAAQ,IAAI;MAAO;MACnC,YAAY;KACd;eAEC;IACK,CAAA,GAET,KACC,kBAAC,GAAD;KACE,SAAQ;KACR,IAAI;MACF,WAAW;MACX,OAAO;MACP,UAAU;MACV,YAAY;KACd;eAEC;IACS,CAAA,CAET;KAEJ;;CACJ,CAAA;AAET"}

package/dist/components/ProgrammaticInstructionsModal/ProgrammaticInstructionsModal.js

@@ -5,10 +5,10 @@ import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
 //#region src/components/ProgrammaticInstructionsModal/ProgrammaticInstructionsModal.tsx
 var u = /* @__PURE__ */ function(e) {
 	return e.COMMAND_LINE = "Command Line", e.R = "R", e.PYTHON = "Python", e;
-}({}), d = ({ show: d, title: f, onClose: p, pythonNotes: m, pythonCode: h, rNotes: g, rCode: _, cliNotes: v, cliCode: y, helpMarkdown: b, helpUrl: x }) => {
-	let S;
-	S = y ? u.COMMAND_LINE : h ? u.PYTHON : u.R;
-	let [C, w] = t(S), T = /* @__PURE__ */ l(o, {
+}({}), d = ({ show: u, title: d, onClose: f, pythonNotes: p, pythonCode: m, rNotes: h, rCode: g, cliNotes: _, cliCode: v, helpMarkdown: y, helpUrl: b }) => {
+	let x;
+	x = v ? "Command Line" : m ? "Python" : "R";
+	let [S, C] = t(x), w = /* @__PURE__ */ l(o, {
 		variant: "body1",
 		children: [
 			"Installation instructions are available at our",
@@ -21,74 +21,74 @@ var u = /* @__PURE__ */ function(e) {
 			}),
 			"."
 		]
-	}), E = /* @__PURE__ */ l(s, { children: [/* @__PURE__ */ c(n, {
-		sx: {
-			borderBottom: 1,
-			borderColor: "divider",
-			marginBottom: 4
-		},
-		children: /* @__PURE__ */ l(a, {
-			value: C,
-			onChange: (e, t) => {
-				e.stopPropagation(), w(t);
-			},
-			textColor: "secondary",
-			indicatorColor: "secondary",
-			children: [
-				y && /* @__PURE__ */ c(i, {
-					value: u.COMMAND_LINE,
-					label: u.COMMAND_LINE
-				}),
-				_ && /* @__PURE__ */ c(i, {
-					value: u.R,
-					label: u.R
-				}),
-				h && /* @__PURE__ */ c(i, {
-					value: u.PYTHON,
-					label: u.PYTHON
-				})
-			]
-		})
-	}), /* @__PURE__ */ l(n, {
-		sx: { "& > p": { marginBottom: 3 } },
-		children: [
-			C === u.COMMAND_LINE && /* @__PURE__ */ l(s, { children: [
-				/* @__PURE__ */ c(o, {
-					variant: "body1",
-					children: v
-				}),
-				T,
-				/* @__PURE__ */ c("pre", { children: y })
-			] }),
-			C === u.R && /* @__PURE__ */ l(s, { children: [
-				/* @__PURE__ */ c(o, {
-					variant: "body1",
-					children: g
-				}),
-				T,
-				/* @__PURE__ */ c("pre", { children: _ })
-			] }),
-			C === u.PYTHON && /* @__PURE__ */ l(s, { children: [
-				/* @__PURE__ */ c(o, {
-					variant: "body1",
-					children: m
-				}),
-				T,
-				/* @__PURE__ */ c("pre", { children: h })
-			] })
-		]
-	})] });
+	});
 	return /* @__PURE__ */ c(e, {
-		open: d,
-		title: f,
-		onCancel: p,
-		onConfirm: p,
+		open: u,
+		title: d,
+		onCancel: f,
+		onConfirm: f,
 		maxWidth: "md",
-		titleHelpPopoverProps: b ? {
-			markdownText: b,
-			helpUrl: x
+		titleHelpPopoverProps: y ? {
+			markdownText: y,
+			helpUrl: b
 		} : void 0,
-		content: E,
+		content: /* @__PURE__ */ l(s, { children: [/* @__PURE__ */ c(n, {
+			sx: {
+				borderBottom: 1,
+				borderColor: "divider",
+				marginBottom: 4
+			},
+			children: /* @__PURE__ */ l(a, {
+				value: S,
+				onChange: (e, t) => {
+					e.stopPropagation(), C(t);
+				},
+				textColor: "secondary",
+				indicatorColor: "secondary",
+				children: [
+					v && /* @__PURE__ */ c(i, {
+						value: "Command Line",
+						label: "Command Line"
+					}),
+					g && /* @__PURE__ */ c(i, {
+						value: "R",
+						label: "R"
+					}),
+					m && /* @__PURE__ */ c(i, {
+						value: "Python",
+						label: "Python"
+					})
+				]
+			})
+		}), /* @__PURE__ */ l(n, {
+			sx: { "& > p": { marginBottom: 3 } },
+			children: [
+				S === "Command Line" && /* @__PURE__ */ l(s, { children: [
+					/* @__PURE__ */ c(o, {
+						variant: "body1",
+						children: _
+					}),
+					w,
+					/* @__PURE__ */ c("pre", { children: v })
+				] }),
+				S === "R" && /* @__PURE__ */ l(s, { children: [
+					/* @__PURE__ */ c(o, {
+						variant: "body1",
+						children: h
+					}),
+					w,
+					/* @__PURE__ */ c("pre", { children: g })
+				] }),
+				S === "Python" && /* @__PURE__ */ l(s, { children: [
+					/* @__PURE__ */ c(o, {
+						variant: "body1",
+						children: p
+					}),
+					w,
+					/* @__PURE__ */ c("pre", { children: m })
+				] })
+			]
+		})] }),
 		hasCancelButton: !1
 	});
 };

package/dist/components/ProgrammaticInstructionsModal/ProgrammaticInstructionsModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProgrammaticInstructionsModal.js","names":[],"sources":["../../../src/components/ProgrammaticInstructionsModal/ProgrammaticInstructionsModal.tsx"],"sourcesContent":["import React from 'react'\nimport { Box, Link, Tab, Tabs, Typography } from '@mui/material'\nimport { ReactElement, SyntheticEvent, useState } from 'react'\nimport { ConfirmationDialog } from '../ConfirmationDialog/ConfirmationDialog'\n\nexport enum ProgrammaticOptionsTabs {\n  COMMAND_LINE = 'Command Line',\n  R = 'R',\n  PYTHON = 'Python',\n}\n\nexport type ProgrammaticInstructionsModalProps = {\n  show: boolean\n  title: string\n  onClose: () => void\n  pythonNotes?: ReactElement\n  pythonCode?: string\n  rNotes?: ReactElement\n  rCode?: string\n  cliNotes?: ReactElement\n  cliCode?: string\n  helpMarkdown?: string\n  helpUrl?: string\n}\n\n/**\n * Modal used to show programmatic instructions\n * @param props\n * @returns\n */\n\nexport const ProgrammaticInstructionsModal = ({\n  show,\n  title,\n  onClose,\n  pythonNotes,\n  pythonCode,\n  rNotes,\n  rCode,\n  cliNotes,\n  cliCode,\n  helpMarkdown,\n  helpUrl,\n}: ProgrammaticInstructionsModalProps): React.ReactNode => {\n  let defaultTab\n  if (cliCode) {\n    defaultTab = ProgrammaticOptionsTabs.COMMAND_LINE\n  } else if (pythonCode) {\n    defaultTab = ProgrammaticOptionsTabs.PYTHON\n  } else {\n    defaultTab = ProgrammaticOptionsTabs.R\n  }\n  const [currentTab, setCurrentTab] =\n    useState<ProgrammaticOptionsTabs>(defaultTab)\n\n  const installationInstructions = (\n    <Typography variant=\"body1\">\n      Installation instructions are available at our{' '}\n      <Link\n        href={\n          'https://help.synapse.org/docs/Installing-Synapse-API-Clients.1985249668.html'\n        }\n        target=\"_blank\"\n        rel=\"noopener noreferrer\"\n      >\n        Synapse API Documentation Site\n      </Link>\n      .\n    </Typography>\n  )\n\n  const dialogContent = (\n    <>\n      <Box\n        sx={{\n          borderBottom: 1,\n          borderColor: 'divider',\n          marginBottom: 4,\n        }}\n      >\n        <Tabs\n          value={currentTab}\n          onChange={(\n            event: SyntheticEvent,\n            newValue: ProgrammaticOptionsTabs,\n          ) => {\n            event.stopPropagation()\n            setCurrentTab(newValue)\n          }}\n          textColor=\"secondary\"\n          indicatorColor=\"secondary\"\n        >\n          {cliCode && (\n            <Tab\n              value={ProgrammaticOptionsTabs.COMMAND_LINE}\n              label={ProgrammaticOptionsTabs.COMMAND_LINE}\n            />\n          )}\n          {rCode && (\n            <Tab\n              value={ProgrammaticOptionsTabs.R}\n              label={ProgrammaticOptionsTabs.R}\n            />\n          )}\n          {pythonCode && (\n            <Tab\n              value={ProgrammaticOptionsTabs.PYTHON}\n              label={ProgrammaticOptionsTabs.PYTHON}\n            />\n          )}\n        </Tabs>\n      </Box>\n      <Box sx={{ '& > p': { marginBottom: 3 } }}>\n        {currentTab === ProgrammaticOptionsTabs.COMMAND_LINE && (\n          <>\n            <Typography variant=\"body1\">{cliNotes}</Typography>\n            {installationInstructions}\n            <pre>{cliCode}</pre>\n          </>\n        )}\n        {currentTab === ProgrammaticOptionsTabs.R && (\n          <>\n            <Typography variant=\"body1\">{rNotes}</Typography>\n            {installationInstructions}\n            <pre>{rCode}</pre>\n          </>\n        )}\n        {currentTab === ProgrammaticOptionsTabs.PYTHON && (\n          <>\n            <Typography variant=\"body1\">{pythonNotes}</Typography>\n            {installationInstructions}\n            <pre>{pythonCode}</pre>\n          </>\n        )}\n      </Box>\n    </>\n  )\n\n  const titleHelpPopoverProps = helpMarkdown\n    ? {\n        markdownText: helpMarkdown,\n        helpUrl: helpUrl,\n      }\n    : undefined\n\n  return (\n    <ConfirmationDialog\n      open={show}\n      title={title}\n      onCancel={onClose}\n      onConfirm={onClose}\n      maxWidth=\"md\"\n      titleHelpPopoverProps={titleHelpPopoverProps}\n      content={dialogContent}\n      hasCancelButton={false}\n    />\n  )\n}\n\nexport default ProgrammaticInstructionsModal\n"],"mappings":";;;;;AAKA,IAAY,IAAL,yBAAA,GAAA;QACL,EAAA,eAAe,gBACf,EAAA,IAAI,KACJ,EAAA,SAAS;KACV,EAsBY,KAAiC,EAC5C,SACA,UACA,YACA,gBACA,eACA,WACA,UACA,aACA,YACA,iBACA,iBACyD;CACzD,IAAI;AACJ,CAKE,IALE,IACW,EAAwB,eAC5B,IACI,EAAwB,SAExB,EAAwB;CAEvC,IAAM,CAAC,GAAY,KACjB,EAAkC,EAAW,EAEzC,IACJ,kBAAC,GAAD;EAAY,SAAQ;YAApB;GAA4B;GACqB;GAC/C,kBAAC,GAAD;IACE,MACE;IAEF,QAAO;IACP,KAAI;cACL;IAEM,CAAA;;GAEI;KAGT,IACJ,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;EACE,IAAI;GACF,cAAc;GACd,aAAa;GACb,cAAc;GACf;YAED,kBAAC,GAAD;GACE,OAAO;GACP,WACE,GACA,MACG;AAEH,IADA,EAAM,iBAAiB,EACvB,EAAc,EAAS;;GAEzB,WAAU;GACV,gBAAe;aAVjB;IAYG,KACC,kBAAC,GAAD;KACE,OAAO,EAAwB;KAC/B,OAAO,EAAwB;KAC/B,CAAA;IAEH,KACC,kBAAC,GAAD;KACE,OAAO,EAAwB;KAC/B,OAAO,EAAwB;KAC/B,CAAA;IAEH,KACC,kBAAC,GAAD;KACE,OAAO,EAAwB;KAC/B,OAAO,EAAwB;KAC/B,CAAA;IAEC;;EACH,CAAA,EACN,kBAAC,GAAD;EAAK,IAAI,EAAE,SAAS,EAAE,cAAc,GAAG,EAAE;YAAzC;GACG,MAAe,EAAwB,gBACtC,kBAAA,GAAA,EAAA,UAAA;IACE,kBAAC,GAAD;KAAY,SAAQ;eAAS;KAAsB,CAAA;IAClD;IACD,kBAAC,OAAD,EAAA,UAAM,GAAc,CAAA;IACnB,EAAA,CAAA;GAEJ,MAAe,EAAwB,KACtC,kBAAA,GAAA,EAAA,UAAA;IACE,kBAAC,GAAD;KAAY,SAAQ;eAAS;KAAoB,CAAA;IAChD;IACD,kBAAC,OAAD,EAAA,UAAM,GAAY,CAAA;IACjB,EAAA,CAAA;GAEJ,MAAe,EAAwB,UACtC,kBAAA,GAAA,EAAA,UAAA;IACE,kBAAC,GAAD;KAAY,SAAQ;eAAS;KAAyB,CAAA;IACrD;IACD,kBAAC,OAAD,EAAA,UAAM,GAAiB,CAAA;IACtB,EAAA,CAAA;GAED;IACL,EAAA,CAAA;AAUL,QACE,kBAAC,GAAD;EACE,MAAM;EACC;EACP,UAAU;EACV,WAAW;EACX,UAAS;EACc,uBAdG,IAC1B;GACE,cAAc;GACL;GACV,GACD,KAAA;EAUA,SAAS;EACT,iBAAiB;EACjB,CAAA"}
+{"version":3,"file":"ProgrammaticInstructionsModal.js","names":[],"sources":["../../../src/components/ProgrammaticInstructionsModal/ProgrammaticInstructionsModal.tsx"],"sourcesContent":["import React from 'react'\nimport { Box, Link, Tab, Tabs, Typography } from '@mui/material'\nimport { ReactElement, SyntheticEvent, useState } from 'react'\nimport { ConfirmationDialog } from '../ConfirmationDialog/ConfirmationDialog'\n\nexport enum ProgrammaticOptionsTabs {\n  COMMAND_LINE = 'Command Line',\n  R = 'R',\n  PYTHON = 'Python',\n}\n\nexport type ProgrammaticInstructionsModalProps = {\n  show: boolean\n  title: string\n  onClose: () => void\n  pythonNotes?: ReactElement\n  pythonCode?: string\n  rNotes?: ReactElement\n  rCode?: string\n  cliNotes?: ReactElement\n  cliCode?: string\n  helpMarkdown?: string\n  helpUrl?: string\n}\n\n/**\n * Modal used to show programmatic instructions\n * @param props\n * @returns\n */\n\nexport const ProgrammaticInstructionsModal = ({\n  show,\n  title,\n  onClose,\n  pythonNotes,\n  pythonCode,\n  rNotes,\n  rCode,\n  cliNotes,\n  cliCode,\n  helpMarkdown,\n  helpUrl,\n}: ProgrammaticInstructionsModalProps): React.ReactNode => {\n  let defaultTab\n  if (cliCode) {\n    defaultTab = ProgrammaticOptionsTabs.COMMAND_LINE\n  } else if (pythonCode) {\n    defaultTab = ProgrammaticOptionsTabs.PYTHON\n  } else {\n    defaultTab = ProgrammaticOptionsTabs.R\n  }\n  const [currentTab, setCurrentTab] =\n    useState<ProgrammaticOptionsTabs>(defaultTab)\n\n  const installationInstructions = (\n    <Typography variant=\"body1\">\n      Installation instructions are available at our{' '}\n      <Link\n        href={\n          'https://help.synapse.org/docs/Installing-Synapse-API-Clients.1985249668.html'\n        }\n        target=\"_blank\"\n        rel=\"noopener noreferrer\"\n      >\n        Synapse API Documentation Site\n      </Link>\n      .\n    </Typography>\n  )\n\n  const dialogContent = (\n    <>\n      <Box\n        sx={{\n          borderBottom: 1,\n          borderColor: 'divider',\n          marginBottom: 4,\n        }}\n      >\n        <Tabs\n          value={currentTab}\n          onChange={(\n            event: SyntheticEvent,\n            newValue: ProgrammaticOptionsTabs,\n          ) => {\n            event.stopPropagation()\n            setCurrentTab(newValue)\n          }}\n          textColor=\"secondary\"\n          indicatorColor=\"secondary\"\n        >\n          {cliCode && (\n            <Tab\n              value={ProgrammaticOptionsTabs.COMMAND_LINE}\n              label={ProgrammaticOptionsTabs.COMMAND_LINE}\n            />\n          )}\n          {rCode && (\n            <Tab\n              value={ProgrammaticOptionsTabs.R}\n              label={ProgrammaticOptionsTabs.R}\n            />\n          )}\n          {pythonCode && (\n            <Tab\n              value={ProgrammaticOptionsTabs.PYTHON}\n              label={ProgrammaticOptionsTabs.PYTHON}\n            />\n          )}\n        </Tabs>\n      </Box>\n      <Box sx={{ '& > p': { marginBottom: 3 } }}>\n        {currentTab === ProgrammaticOptionsTabs.COMMAND_LINE && (\n          <>\n            <Typography variant=\"body1\">{cliNotes}</Typography>\n            {installationInstructions}\n            <pre>{cliCode}</pre>\n          </>\n        )}\n        {currentTab === ProgrammaticOptionsTabs.R && (\n          <>\n            <Typography variant=\"body1\">{rNotes}</Typography>\n            {installationInstructions}\n            <pre>{rCode}</pre>\n          </>\n        )}\n        {currentTab === ProgrammaticOptionsTabs.PYTHON && (\n          <>\n            <Typography variant=\"body1\">{pythonNotes}</Typography>\n            {installationInstructions}\n            <pre>{pythonCode}</pre>\n          </>\n        )}\n      </Box>\n    </>\n  )\n\n  const titleHelpPopoverProps = helpMarkdown\n    ? {\n        markdownText: helpMarkdown,\n        helpUrl: helpUrl,\n      }\n    : undefined\n\n  return (\n    <ConfirmationDialog\n      open={show}\n      title={title}\n      onCancel={onClose}\n      onConfirm={onClose}\n      maxWidth=\"md\"\n      titleHelpPopoverProps={titleHelpPopoverProps}\n      content={dialogContent}\n      hasCancelButton={false}\n    />\n  )\n}\n\nexport default ProgrammaticInstructionsModal\n"],"mappings":";;;;;AAKA,IAAY,IAAL,yBAAA,GAAA;QACL,EAAA,eAAA,gBACA,EAAA,IAAA,KACA,EAAA,SAAA;AACF,EAAA,CAAA,CAAA,GAsBa,KAAiC,EAC5C,SACA,UACA,YACA,gBACA,eACA,WACA,UACA,aACA,YACA,iBACA,iBACyD;CACzD,IAAI;CACJ,AAKE,IALE,IACF,iBACS,IACT,WAEA;CAEF,IAAM,CAAC,GAAY,KACjB,EAAkC,CAAU,GAExC,IACJ,kBAAC,GAAD;EAAY,SAAQ;YAApB;GAA4B;GACqB;GAC/C,kBAAC,GAAD;IACE,MACE;IAEF,QAAO;IACP,KAAI;cACL;GAEK,CAAA;GAAC;EAEG;;CA6Ed,OACE,kBAAC,GAAD;EACE,MAAM;EACC;EACP,UAAU;EACV,WAAW;EACX,UAAS;EACc,uBAdG,IAC1B;GACE,cAAc;GACL;EACX,IACA,KAAA;EAUA,SAjFF,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;GACE,IAAI;IACF,cAAc;IACd,aAAa;IACb,cAAc;GAChB;aAEA,kBAAC,GAAD;IACE,OAAO;IACP,WACE,GACA,MACG;KAEH,AADA,EAAM,gBAAgB,GACtB,EAAc,CAAQ;IACxB;IACA,WAAU;IACV,gBAAe;cAVjB;KAYG,KACC,kBAAC,GAAD;MACE,OAAA;MACA,OAAA;KACD,CAAA;KAEF,KACC,kBAAC,GAAD;MACE,OAAA;MACA,OAAA;KACD,CAAA;KAEF,KACC,kBAAC,GAAD;MACE,OAAA;MACA,OAAA;KACD,CAAA;IAEC;;EACH,CAAA,GACL,kBAAC,GAAD;GAAK,IAAI,EAAE,SAAS,EAAE,cAAc,EAAE,EAAE;aAAxC;IACG,MAAA,kBACC,kBAAA,GAAA,EAAA,UAAA;KACE,kBAAC,GAAD;MAAY,SAAQ;gBAAS;KAAqB,CAAA;KACjD;KACD,kBAAC,OAAD,EAAA,UAAM,EAAa,CAAA;IACnB,EAAA,CAAA;IAEH,MAAA,OACC,kBAAA,GAAA,EAAA,UAAA;KACE,kBAAC,GAAD;MAAY,SAAQ;gBAAS;KAAmB,CAAA;KAC/C;KACD,kBAAC,OAAD,EAAA,UAAM,EAAW,CAAA;IACjB,EAAA,CAAA;IAEH,MAAA,YACC,kBAAA,GAAA,EAAA,UAAA;KACE,kBAAC,GAAD;MAAY,SAAQ;gBAAS;KAAwB,CAAA;KACpD;KACD,kBAAC,OAAD,EAAA,UAAM,EAAgB,CAAA;IACtB,EAAA,CAAA;GAED;IACL,EAAA,CAkBS;EACT,iBAAiB;CAClB,CAAA;AAEL"}

package/dist/components/ProgrammaticTableDownload/ProgrammaticTableDownload.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProgrammaticTableDownload.js","names":[],"sources":["../../../src/components/ProgrammaticTableDownload/ProgrammaticTableDownload.tsx"],"sourcesContent":["import { useGetQueryResultBundleWithAsyncStatus } from '@/synapse-queries'\nimport { SynapseConstants } from '@/utils'\nimport { Link } from '@mui/material'\nimport { QueryBundleRequest } from '@sage-bionetworks/synapse-types'\nimport { useEffect, useMemo, useState } from 'react'\nimport {\n  PYTHON_CLIENT_IMPORT_AND_LOGIN,\n  R_CLIENT_IMPORT_AND_LOGIN,\n} from '../DownloadCart/DirectProgrammaticDownload'\nimport { ProgrammaticInstructionsModal } from '../ProgrammaticInstructionsModal/ProgrammaticInstructionsModal'\n\nexport type ProgrammaticTableDownloadProps = {\n  queryBundleRequest: QueryBundleRequest\n  onHide: () => void\n}\n\nexport function ProgrammaticTableDownload({\n  queryBundleRequest,\n  onHide,\n}: ProgrammaticTableDownloadProps) {\n  const [generatedSql, setGeneratedSql] = useState('...')\n\n  const {\n    data: asyncJobStatus,\n    isLoading: queryIsLoading,\n    isPlaceholderData: newQueryIsFetching,\n  } = useGetQueryResultBundleWithAsyncStatus(\n    {\n      ...queryBundleRequest,\n      partMask: SynapseConstants.BUNDLE_MASK_COMBINED_SQL,\n    },\n    {\n      placeholderData: previousData => previousData,\n      throwOnError: true,\n    },\n  )\n\n  const combinedSql = asyncJobStatus?.responseBody?.combinedSql\n  const isLoadingNewBundle = queryIsLoading || newQueryIsFetching\n\n  useEffect(() => {\n    if (combinedSql && !isLoadingNewBundle) {\n      // SWC-5686: The ID column is required by the client, and this column may not have been selected!\n      // Change the SQL to \"SELECT * ...\"\n      const indexOfFrom = combinedSql.toUpperCase().indexOf('FROM SYN')\n      const selectStarTransformedSql = `SELECT * ${combinedSql.substring(\n        indexOfFrom,\n      )}`\n      setGeneratedSql(selectStarTransformedSql)\n    }\n  }, [combinedSql, isLoadingNewBundle])\n\n  // Replace quotation marks with escaped quotations. For CLI, also escape backticks.\n  const commandLineSql = useMemo(\n    () => generatedSql.replace(/([\"`])/g, '\\\\$1'),\n    [generatedSql],\n  )\n\n  const clientSql = useMemo(\n    () => generatedSql.replace(/\"/g, '\\\\\"'),\n    [generatedSql],\n  )\n\n  return (\n    <ProgrammaticInstructionsModal\n      show={true}\n      onClose={onHide}\n      title=\"Download Programmatically\"\n      cliNotes={\n        <>\n          This command line code will download Synapse files AND file\n          annotations to your working directory.\n        </>\n      }\n      cliCode={`synapse get -q \"${commandLineSql}\"`}\n      rNotes={\n        <>\n          This R code will download file annotations only. Use{' '}\n          <Link\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            href=\"https://help.synapse.org/docs/Get-Started-with-Downloading-Data.2004254837.html#GetStartedwithDownloadingData-DownloadingFiles\"\n          >\n            synGet{'()'}\n          </Link>{' '}\n          to loop over the list of Synapse IDs from the file annotations to\n          download files.\n        </>\n      }\n      rCode={`${R_CLIENT_IMPORT_AND_LOGIN}\nquery ${'<-'} synTableQuery(\"${clientSql}\")${'\\n'}read.table(query$filepath, sep = \",\")`}\n      pythonNotes={\n        <>\n          This Python code will download file annotations only. Use{' '}\n          <Link\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            href=\"https://help.synapse.org/docs/Get-Started-with-Downloading-Data.2004254837.html#GetStartedwithDownloadingData-DownloadingFiles\"\n          >\n            syn.get\n          </Link>{' '}\n          to loop over the list of Synapse IDs from the file annotations to\n          download files.\n        </>\n      }\n      pythonCode={`${PYTHON_CLIENT_IMPORT_AND_LOGIN}\nquery = syn.tableQuery(\"${clientSql}\")${'\\n'}query.asDataFrame()`}\n    />\n  )\n}\n\nexport default ProgrammaticTableDownload\n"],"mappings":";;;;;;;;;;AAgBA,SAAgB,EAA0B,EACxC,uBACA,aACiC;CACjC,IAAM,CAAC,GAAc,KAAmB,EAAS,MAAM,EAEjD,EACJ,MAAM,GACN,WAAW,GACX,mBAAmB,MACjB,EACF;EACE,GAAG;EACH,UAAU;EACX,EACD;EACE,kBAAiB,MAAgB;EACjC,cAAc;EACf,CACF,EAEK,IAAc,GAAgB,cAAc,aAC5C,IAAqB,KAAkB;AAE7C,SAAgB;AACd,MAAI,KAAe,CAAC,GAAoB;GAGtC,IAAM,IAAc,EAAY,aAAa,CAAC,QAAQ,WAAW;AAIjE,KAAgB,YAH6B,EAAY,UACvD,EACD,GACwC;;IAE1C,CAAC,GAAa,EAAmB,CAAC;CAGrC,IAAM,IAAiB,QACf,EAAa,QAAQ,WAAW,OAAO,EAC7C,CAAC,EAAa,CACf,EAEK,IAAY,QACV,EAAa,QAAQ,MAAM,OAAM,EACvC,CAAC,EAAa,CACf;AAED,QACE,kBAAC,GAAD;EACE,MAAM;EACN,SAAS;EACT,OAAM;EACN,UACE,kBAAA,GAAA,EAAA,UAAE,sGAGC,CAAA;EAEL,SAAS,mBAAmB,EAAe;EAC3C,QACE,kBAAA,GAAA,EAAA,UAAA;GAAE;GACqD;GACrD,kBAAC,GAAD;IACE,QAAO;IACP,KAAI;IACJ,MAAK;cAHP,CAIC,UACQ,KACF;;GAAC;GAAI;GAGX,EAAA,CAAA;EAEL,OAAO,GAAG,EAA0B;0BACX,EAAU;;EACnC,aACE,kBAAA,GAAA,EAAA,UAAA;GAAE;GAC0D;GAC1D,kBAAC,GAAD;IACE,QAAO;IACP,KAAI;IACJ,MAAK;cACN;IAEM,CAAA;GAAC;GAAI;GAGX,EAAA,CAAA;EAEL,YAAY,GAAG,EAA+B;0BAC1B,EAAU;;EAC9B,CAAA"}
+{"version":3,"file":"ProgrammaticTableDownload.js","names":[],"sources":["../../../src/components/ProgrammaticTableDownload/ProgrammaticTableDownload.tsx"],"sourcesContent":["import { useGetQueryResultBundleWithAsyncStatus } from '@/synapse-queries'\nimport { SynapseConstants } from '@/utils'\nimport { Link } from '@mui/material'\nimport { QueryBundleRequest } from '@sage-bionetworks/synapse-types'\nimport { useEffect, useMemo, useState } from 'react'\nimport {\n  PYTHON_CLIENT_IMPORT_AND_LOGIN,\n  R_CLIENT_IMPORT_AND_LOGIN,\n} from '../DownloadCart/DirectProgrammaticDownload'\nimport { ProgrammaticInstructionsModal } from '../ProgrammaticInstructionsModal/ProgrammaticInstructionsModal'\n\nexport type ProgrammaticTableDownloadProps = {\n  queryBundleRequest: QueryBundleRequest\n  onHide: () => void\n}\n\nexport function ProgrammaticTableDownload({\n  queryBundleRequest,\n  onHide,\n}: ProgrammaticTableDownloadProps) {\n  const [generatedSql, setGeneratedSql] = useState('...')\n\n  const {\n    data: asyncJobStatus,\n    isLoading: queryIsLoading,\n    isPlaceholderData: newQueryIsFetching,\n  } = useGetQueryResultBundleWithAsyncStatus(\n    {\n      ...queryBundleRequest,\n      partMask: SynapseConstants.BUNDLE_MASK_COMBINED_SQL,\n    },\n    {\n      placeholderData: previousData => previousData,\n      throwOnError: true,\n    },\n  )\n\n  const combinedSql = asyncJobStatus?.responseBody?.combinedSql\n  const isLoadingNewBundle = queryIsLoading || newQueryIsFetching\n\n  useEffect(() => {\n    if (combinedSql && !isLoadingNewBundle) {\n      // SWC-5686: The ID column is required by the client, and this column may not have been selected!\n      // Change the SQL to \"SELECT * ...\"\n      const indexOfFrom = combinedSql.toUpperCase().indexOf('FROM SYN')\n      const selectStarTransformedSql = `SELECT * ${combinedSql.substring(\n        indexOfFrom,\n      )}`\n      setGeneratedSql(selectStarTransformedSql)\n    }\n  }, [combinedSql, isLoadingNewBundle])\n\n  // Replace quotation marks with escaped quotations. For CLI, also escape backticks.\n  const commandLineSql = useMemo(\n    () => generatedSql.replace(/([\"`])/g, '\\\\$1'),\n    [generatedSql],\n  )\n\n  const clientSql = useMemo(\n    () => generatedSql.replace(/\"/g, '\\\\\"'),\n    [generatedSql],\n  )\n\n  return (\n    <ProgrammaticInstructionsModal\n      show={true}\n      onClose={onHide}\n      title=\"Download Programmatically\"\n      cliNotes={\n        <>\n          This command line code will download Synapse files AND file\n          annotations to your working directory.\n        </>\n      }\n      cliCode={`synapse get -q \"${commandLineSql}\"`}\n      rNotes={\n        <>\n          This R code will download file annotations only. Use{' '}\n          <Link\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            href=\"https://help.synapse.org/docs/Get-Started-with-Downloading-Data.2004254837.html#GetStartedwithDownloadingData-DownloadingFiles\"\n          >\n            synGet{'()'}\n          </Link>{' '}\n          to loop over the list of Synapse IDs from the file annotations to\n          download files.\n        </>\n      }\n      rCode={`${R_CLIENT_IMPORT_AND_LOGIN}\nquery ${'<-'} synTableQuery(\"${clientSql}\")${'\\n'}read.table(query$filepath, sep = \",\")`}\n      pythonNotes={\n        <>\n          This Python code will download file annotations only. Use{' '}\n          <Link\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            href=\"https://help.synapse.org/docs/Get-Started-with-Downloading-Data.2004254837.html#GetStartedwithDownloadingData-DownloadingFiles\"\n          >\n            syn.get\n          </Link>{' '}\n          to loop over the list of Synapse IDs from the file annotations to\n          download files.\n        </>\n      }\n      pythonCode={`${PYTHON_CLIENT_IMPORT_AND_LOGIN}\nquery = syn.tableQuery(\"${clientSql}\")${'\\n'}query.asDataFrame()`}\n    />\n  )\n}\n\nexport default ProgrammaticTableDownload\n"],"mappings":";;;;;;;;;;AAgBA,SAAgB,EAA0B,EACxC,uBACA,aACiC;CACjC,IAAM,CAAC,GAAc,KAAmB,EAAS,KAAK,GAEhD,EACJ,MAAM,GACN,WAAW,GACX,mBAAmB,MACjB,EACF;EACE,GAAG;EACH,UAAU;CACZ,GACA;EACE,kBAAiB,MAAgB;EACjC,cAAc;CAChB,CACF,GAEM,IAAc,GAAgB,cAAc,aAC5C,IAAqB,KAAkB;CAE7C,QAAgB;EACd,IAAI,KAAe,CAAC,GAAoB;GAGtC,IAAM,IAAc,EAAY,YAAY,EAAE,QAAQ,UAAU;GAIhE,EAAgB,YAH6B,EAAY,UACvD,CACF,GACwC;EAC1C;CACF,GAAG,CAAC,GAAa,CAAkB,CAAC;CAGpC,IAAM,IAAiB,QACf,EAAa,QAAQ,WAAW,MAAM,GAC5C,CAAC,CAAY,CACf,GAEM,IAAY,QACV,EAAa,QAAQ,MAAM,MAAK,GACtC,CAAC,CAAY,CACf;CAEA,OACE,kBAAC,GAAD;EACE,MAAM;EACN,SAAS;EACT,OAAM;EACN,UACE,kBAAA,GAAA,EAAA,UAAE,qGAGA,CAAA;EAEJ,SAAS,mBAAmB,EAAe;EAC3C,QACE,kBAAA,GAAA,EAAA,UAAA;GAAE;GACqD;GACrD,kBAAC,GAAD;IACE,QAAO;IACP,KAAI;IACJ,MAAK;cAHP,CAIC,UACQ,IACH;;GAAE;GAAI;EAGZ,EAAA,CAAA;EAEJ,OAAO,GAAG,EAA0B;0BACX,EAAU;;EACnC,aACE,kBAAA,GAAA,EAAA,UAAA;GAAE;GAC0D;GAC1D,kBAAC,GAAD;IACE,QAAO;IACP,KAAI;IACJ,MAAK;cACN;GAEK,CAAA;GAAE;GAAI;EAGZ,EAAA,CAAA;EAEJ,YAAY,GAAG,EAA+B;0BAC1B,EAAU;;CAC/B,CAAA;AAEL"}

package/dist/components/Programs/Programs.Desktop.js.map

@@ -1 +1 @@
-{"version":3,"file":"Programs.Desktop.js","names":[],"sources":["../../../src/components/Programs/Programs.Desktop.tsx"],"sourcesContent":["import LargeButton from '@/components/styled/LargeButton'\nimport { ImageFileHandle } from '../widgets/ImageFileHandle'\nimport { ProgramsDataProps } from './Programs'\n\nexport default function ProgramsDesktop({\n  link,\n  summary,\n  title,\n  color,\n  fileHandleAssociation,\n  exploreLink,\n}: ProgramsDataProps) {\n  return (\n    <div className=\"Programs__Card\">\n      <div\n        className=\"Programs__Card__header\"\n        style={{ backgroundColor: color.replace(')', ',.05)') }}\n      >\n        <div className=\"Programs__Card__header__icon\">\n          {fileHandleAssociation && (\n            <ImageFileHandle fileHandleAssociation={fileHandleAssociation} />\n          )}\n        </div>\n        <div className=\"Programs__Card__header__info\">\n          <span className=\"Programs__Card__header__info__title\"> {title} </span>\n          {link && (\n            <p className=\"Programs__Card__header__info__link\">\n              <a\n                className=\"highlight-link\"\n                href={link}\n                target=\"_blank\"\n                rel=\"noreferrer\"\n              >\n                Visit website\n              </a>\n            </p>\n          )}\n        </div>\n      </div>\n      <div className=\"Programs__Card__summary\">\n        <p> {summary} </p>\n        <LargeButton\n          color=\"secondary\"\n          variant=\"contained\"\n          href={exploreLink}\n          sx={{ width: '120px', marginLeft: 0 }}\n        >\n          Explore\n        </LargeButton>\n      </div>\n    </div>\n  )\n}\n"],"mappings":";;;;AAIA,SAAwB,EAAgB,EACtC,SACA,YACA,UACA,UACA,0BACA,kBACoB;AACpB,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,OAAD;GACE,WAAU;GACV,OAAO,EAAE,iBAAiB,EAAM,QAAQ,KAAK,QAAQ,EAAE;aAFzD,CAIE,kBAAC,OAAD;IAAK,WAAU;cACZ,KACC,kBAAC,GAAD,EAAwC,0BAAyB,CAAA;IAE/D,CAAA,EACN,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,QAAD;KAAM,WAAU;eAAhB;MAAsD;MAAE;MAAM;MAAQ;QACrE,KACC,kBAAC,KAAD;KAAG,WAAU;eACX,kBAAC,KAAD;MACE,WAAU;MACV,MAAM;MACN,QAAO;MACP,KAAI;gBACL;MAEG,CAAA;KACF,CAAA,CAEF;MACF;MACN,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,KAAD,EAAA,UAAA;IAAG;IAAE;IAAQ;IAAK,EAAA,CAAA,EAClB,kBAAC,GAAD;IACE,OAAM;IACN,SAAQ;IACR,MAAM;IACN,IAAI;KAAE,OAAO;KAAS,YAAY;KAAG;cACtC;IAEa,CAAA,CACV;KACF"}
+{"version":3,"file":"Programs.Desktop.js","names":[],"sources":["../../../src/components/Programs/Programs.Desktop.tsx"],"sourcesContent":["import LargeButton from '@/components/styled/LargeButton'\nimport { ImageFileHandle } from '../widgets/ImageFileHandle'\nimport { ProgramsDataProps } from './Programs'\n\nexport default function ProgramsDesktop({\n  link,\n  summary,\n  title,\n  color,\n  fileHandleAssociation,\n  exploreLink,\n}: ProgramsDataProps) {\n  return (\n    <div className=\"Programs__Card\">\n      <div\n        className=\"Programs__Card__header\"\n        style={{ backgroundColor: color.replace(')', ',.05)') }}\n      >\n        <div className=\"Programs__Card__header__icon\">\n          {fileHandleAssociation && (\n            <ImageFileHandle fileHandleAssociation={fileHandleAssociation} />\n          )}\n        </div>\n        <div className=\"Programs__Card__header__info\">\n          <span className=\"Programs__Card__header__info__title\"> {title} </span>\n          {link && (\n            <p className=\"Programs__Card__header__info__link\">\n              <a\n                className=\"highlight-link\"\n                href={link}\n                target=\"_blank\"\n                rel=\"noreferrer\"\n              >\n                Visit website\n              </a>\n            </p>\n          )}\n        </div>\n      </div>\n      <div className=\"Programs__Card__summary\">\n        <p> {summary} </p>\n        <LargeButton\n          color=\"secondary\"\n          variant=\"contained\"\n          href={exploreLink}\n          sx={{ width: '120px', marginLeft: 0 }}\n        >\n          Explore\n        </LargeButton>\n      </div>\n    </div>\n  )\n}\n"],"mappings":";;;;AAIA,SAAwB,EAAgB,EACtC,SACA,YACA,UACA,UACA,0BACA,kBACoB;CACpB,OACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,OAAD;GACE,WAAU;GACV,OAAO,EAAE,iBAAiB,EAAM,QAAQ,KAAK,OAAO,EAAE;aAFxD,CAIE,kBAAC,OAAD;IAAK,WAAU;cACZ,KACC,kBAAC,GAAD,EAAwC,yBAAwB,CAAA;GAE/D,CAAA,GACL,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,QAAD;KAAM,WAAU;eAAhB;MAAsD;MAAE;MAAM;KAAO;QACpE,KACC,kBAAC,KAAD;KAAG,WAAU;eACX,kBAAC,KAAD;MACE,WAAU;MACV,MAAM;MACN,QAAO;MACP,KAAI;gBACL;KAEE,CAAA;IACF,CAAA,CAEF;KACF;MACL,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,KAAD,EAAA,UAAA;IAAG;IAAE;IAAQ;GAAI,EAAA,CAAA,GACjB,kBAAC,GAAD;IACE,OAAM;IACN,SAAQ;IACR,MAAM;IACN,IAAI;KAAE,OAAO;KAAS,YAAY;IAAE;cACrC;GAEY,CAAA,CACV;IACF;;AAET"}

package/dist/components/Programs/Programs.Mobile.js.map

@@ -1 +1 @@
-{"version":3,"file":"Programs.Mobile.js","names":[],"sources":["../../../src/components/Programs/Programs.Mobile.tsx"],"sourcesContent":["import LargeButton from '@/components/styled/LargeButton'\nimport ExpandableContent from '../home_page/ExpandableContent'\nimport { ImageFileHandle } from '../widgets/ImageFileHandle'\nimport { ProgramsDataProps } from './Programs'\n\nexport default function ProgramsMobile({\n  link,\n  summary,\n  title,\n  color,\n  fileHandleAssociation,\n  exploreLink,\n}: ProgramsDataProps) {\n  const titleElement = (\n    <div className=\"Programs__Mobile__Header\">\n      <span className=\"Programs__Card__header__icon\">\n        {fileHandleAssociation && (\n          <ImageFileHandle fileHandleAssociation={fileHandleAssociation} />\n        )}\n      </span>\n      <span className=\"Programs__Mobile__Header__Title\"> {title} </span>\n    </div>\n  )\n  const content = (\n    <div className=\"Programs__Mobile__Content\">\n      {link && (\n        <p className=\"Programs__Card__header__info__link\">\n          <a\n            className=\"highlight-link\"\n            href={link}\n            target=\"_blank\"\n            rel=\"noreferrer\"\n          >\n            Visit website\n          </a>\n        </p>\n      )}\n      <p>{summary}</p>\n      <LargeButton\n        color=\"secondary\"\n        variant=\"contained\"\n        href={exploreLink}\n        sx={{ marginLeft: 0 }}\n      >\n        Explore\n      </LargeButton>\n    </div>\n  )\n  return <ExpandableContent title={titleElement} content={content} />\n}\n"],"mappings":";;;;;AAKA,SAAwB,EAAe,EACrC,SACA,YACA,UACA,UACA,0BACA,kBACoB;AAoCpB,QAAO,kBAAC,GAAD;EAAmB,OAlCxB,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,QAAD;IAAM,WAAU;cACb,KACC,kBAAC,GAAD,EAAwC,0BAAyB,CAAA;IAE9D,CAAA,EACP,kBAAC,QAAD;IAAM,WAAU;cAAhB;KAAkD;KAAE;KAAM;KAAQ;MAC9D;IA2ByB;EAAuB,SAxBtD,kBAAC,OAAD;GAAK,WAAU;aAAf;IACG,KACC,kBAAC,KAAD;KAAG,WAAU;eACX,kBAAC,KAAD;MACE,WAAU;MACV,MAAM;MACN,QAAO;MACP,KAAI;gBACL;MAEG,CAAA;KACF,CAAA;IAEN,kBAAC,KAAD,EAAA,UAAI,GAAY,CAAA;IAChB,kBAAC,GAAD;KACE,OAAM;KACN,SAAQ;KACR,MAAM;KACN,IAAI,EAAE,YAAY,GAAG;eACtB;KAEa,CAAA;IACV;IAEgD;EAAW,CAAA"}
+{"version":3,"file":"Programs.Mobile.js","names":[],"sources":["../../../src/components/Programs/Programs.Mobile.tsx"],"sourcesContent":["import LargeButton from '@/components/styled/LargeButton'\nimport ExpandableContent from '../home_page/ExpandableContent'\nimport { ImageFileHandle } from '../widgets/ImageFileHandle'\nimport { ProgramsDataProps } from './Programs'\n\nexport default function ProgramsMobile({\n  link,\n  summary,\n  title,\n  color,\n  fileHandleAssociation,\n  exploreLink,\n}: ProgramsDataProps) {\n  const titleElement = (\n    <div className=\"Programs__Mobile__Header\">\n      <span className=\"Programs__Card__header__icon\">\n        {fileHandleAssociation && (\n          <ImageFileHandle fileHandleAssociation={fileHandleAssociation} />\n        )}\n      </span>\n      <span className=\"Programs__Mobile__Header__Title\"> {title} </span>\n    </div>\n  )\n  const content = (\n    <div className=\"Programs__Mobile__Content\">\n      {link && (\n        <p className=\"Programs__Card__header__info__link\">\n          <a\n            className=\"highlight-link\"\n            href={link}\n            target=\"_blank\"\n            rel=\"noreferrer\"\n          >\n            Visit website\n          </a>\n        </p>\n      )}\n      <p>{summary}</p>\n      <LargeButton\n        color=\"secondary\"\n        variant=\"contained\"\n        href={exploreLink}\n        sx={{ marginLeft: 0 }}\n      >\n        Explore\n      </LargeButton>\n    </div>\n  )\n  return <ExpandableContent title={titleElement} content={content} />\n}\n"],"mappings":";;;;;AAKA,SAAwB,EAAe,EACrC,SACA,YACA,UACA,UACA,0BACA,kBACoB;CAoCpB,OAAO,kBAAC,GAAD;EAAmB,OAlCxB,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,QAAD;IAAM,WAAU;cACb,KACC,kBAAC,GAAD,EAAwC,yBAAwB,CAAA;GAE9D,CAAA,GACN,kBAAC,QAAD;IAAM,WAAU;cAAhB;KAAkD;KAAE;KAAM;IAAO;KAC9D;GA2B0B;EAAuB,SAxBtD,kBAAC,OAAD;GAAK,WAAU;aAAf;IACG,KACC,kBAAC,KAAD;KAAG,WAAU;eACX,kBAAC,KAAD;MACE,WAAU;MACV,MAAM;MACN,QAAO;MACP,KAAI;gBACL;KAEE,CAAA;IACF,CAAA;IAEL,kBAAC,KAAD,EAAA,UAAI,EAAW,CAAA;IACf,kBAAC,GAAD;KACE,OAAM;KACN,SAAQ;KACR,MAAM;KACN,IAAI,EAAE,YAAY,EAAE;eACrB;IAEY,CAAA;GACV;GAEiD;CAAU,CAAA;AACpE"}

package/dist/components/Programs/Programs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Programs.js","names":[],"sources":["../../../src/components/Programs/Programs.tsx"],"sourcesContent":["import { useGetEntity } from '@/synapse-queries/entity/useEntity'\nimport useGetQueryResultBundle from '@/synapse-queries/entity/useGetQueryResultBundle'\nimport { SynapseConstants } from '@/utils'\nimport { getFieldIndex } from '@/utils/functions/queryUtils'\nimport useShowDesktop from '@/utils/hooks/useShowDesktop'\nimport {\n  FileHandleAssociation,\n  QueryBundleRequest,\n} from '@sage-bionetworks/synapse-types'\nimport { CardLink } from '../CardContainer/CardLink'\nimport { getColorPalette } from '../ColorGradient/ColorGradient'\nimport {\n  getFileHandleAssociation,\n  getLinkParams,\n} from '../GenericCard/CardUtils'\nimport ProgramsDesktop from './Programs.Desktop'\nimport ProgramsMobile from './Programs.Mobile'\n\nexport type ProgramsProps = {\n  entityId: string\n  rgbIndex: number\n  titleColumnName: string\n  linkColumnName: string\n  summaryColumnName: string\n  imageFileHandleColumnName: string\n  linkConfig: CardLink\n}\n\nexport type ProgramsDataProps = {\n  title: string\n  summary: string\n  link: string\n  exploreLink: string\n  color: string\n  fileHandleAssociation?: FileHandleAssociation\n}\n\nexport function Programs(props: ProgramsProps) {\n  const {\n    entityId,\n    titleColumnName,\n    linkColumnName,\n    summaryColumnName,\n    imageFileHandleColumnName,\n    linkConfig,\n    rgbIndex,\n  } = props\n  const showDesktop = useShowDesktop()\n  const entity = useGetEntity(entityId)\n  const color: string = getColorPalette(rgbIndex ?? 0, 2).colorPalette[0]\n  const queryBundleRequest: QueryBundleRequest = {\n    concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n    entityId,\n    partMask:\n      SynapseConstants.BUNDLE_MASK_QUERY_SELECT_COLUMNS |\n      SynapseConstants.BUNDLE_MASK_QUERY_RESULTS,\n    query: {\n      sql: `select * from ${entityId}`,\n    },\n  }\n  const { data: queryResultBundle } =\n    useGetQueryResultBundle(queryBundleRequest)\n\n  const titleColumnIndex = getFieldIndex(titleColumnName, queryResultBundle)\n  const summaryColumnIndex = getFieldIndex(summaryColumnName, queryResultBundle)\n  const linkColumnIndex = getFieldIndex(linkColumnName, queryResultBundle)\n  const iconColumnIndex = getFieldIndex(\n    imageFileHandleColumnName,\n    queryResultBundle,\n  )\n  return (\n    <div className={`Programs${showDesktop ? '__Desktop' : ''}`}>\n      {queryResultBundle?.queryResult!.queryResults.rows.map(el => {\n        const values = el.values as string[]\n        if (values.some(value => value === null)) {\n          // We cast values above assuming there are no null values, emit a warning just in case.\n          console.warn('Row has null value(s) when no nulls expected')\n        }\n\n        const title = values[titleColumnIndex]\n        const summary = values[summaryColumnIndex]\n        const link = values[linkColumnIndex] ?? ''\n        const iconFileHandleIdValue = values[iconColumnIndex]\n\n        const schema: Record<string, number> = {}\n        queryResultBundle?.queryResult!.queryResults.headers.forEach(\n          (header, colIndex) => {\n            schema[header.name] = colIndex\n          },\n        )\n        const { href } = getLinkParams(link, linkConfig, values, schema)\n\n        const fileHandleAssociation = getFileHandleAssociation(\n          entity.data,\n          iconFileHandleIdValue,\n          `syn${el.rowId}`,\n        )\n        const ProgramsDataProps: ProgramsDataProps = {\n          title,\n          summary,\n          link,\n          color,\n          exploreLink: href,\n          fileHandleAssociation,\n        }\n        return showDesktop ? (\n          <ProgramsDesktop {...ProgramsDataProps} />\n        ) : (\n          <ProgramsMobile {...ProgramsDataProps} />\n        )\n      })}\n    </div>\n  )\n}\n\nexport default Programs\n"],"mappings":";;;;;;;;;;;;AAqCA,SAAgB,EAAS,GAAsB;CAC7C,IAAM,EACJ,aACA,oBACA,mBACA,sBACA,8BACA,eACA,gBACE,GACE,IAAc,GAAgB,EAC9B,IAAS,EAAa,EAAS,EAC/B,IAAgB,EAAgB,KAAY,GAAG,EAAE,CAAC,aAAa,IAW/D,EAAE,MAAM,MACZ,EAAwB;EAVxB,cAAc;EACd;EACA,UACE;EAEF,OAAO,EACL,KAAK,iBAAiB,KACvB;EAGuB,CAAmB,EAEvC,IAAmB,EAAc,GAAiB,EAAkB,EACpE,IAAqB,EAAc,GAAmB,EAAkB,EACxE,IAAkB,EAAc,GAAgB,EAAkB,EAClE,IAAkB,EACtB,GACA,EACD;AACD,QACE,kBAAC,OAAD;EAAK,WAAW,WAAW,IAAc,cAAc;YACpD,GAAmB,YAAa,aAAa,KAAK,KAAI,MAAM;GAC3D,IAAM,IAAS,EAAG;AAClB,GAAI,EAAO,MAAK,MAAS,MAAU,KAAK,IAEtC,QAAQ,KAAK,+CAA+C;GAG9D,IAAM,IAAQ,EAAO,IACf,IAAU,EAAO,IACjB,IAAO,EAAO,MAAoB,IAClC,IAAwB,EAAO,IAE/B,IAAiC,EAAE;AACzC,MAAmB,YAAa,aAAa,QAAQ,SAClD,GAAQ,MAAa;AACpB,MAAO,EAAO,QAAQ;KAEzB;GACD,IAAM,EAAE,YAAS,EAAc,GAAM,GAAY,GAAQ,EAAO,EAO1D,IAAuC;IAC3C;IACA;IACA;IACA;IACA,aAAa;IACb,uBAX4B,EAC5B,EAAO,MACP,GACA,MAAM,EAAG,QAQT;IACD;AACD,UACE,EADK,IACJ,IAEA,GAFD,EAAiB,GAAI,GAAqB,CAED;IAE3C;EACE,CAAA"}
+{"version":3,"file":"Programs.js","names":[],"sources":["../../../src/components/Programs/Programs.tsx"],"sourcesContent":["import { useGetEntity } from '@/synapse-queries/entity/useEntity'\nimport useGetQueryResultBundle from '@/synapse-queries/entity/useGetQueryResultBundle'\nimport { SynapseConstants } from '@/utils'\nimport { getFieldIndex } from '@/utils/functions/queryUtils'\nimport useShowDesktop from '@/utils/hooks/useShowDesktop'\nimport {\n  FileHandleAssociation,\n  QueryBundleRequest,\n} from '@sage-bionetworks/synapse-types'\nimport { CardLink } from '../CardContainer/CardLink'\nimport { getColorPalette } from '../ColorGradient/ColorGradient'\nimport {\n  getFileHandleAssociation,\n  getLinkParams,\n} from '../GenericCard/CardUtils'\nimport ProgramsDesktop from './Programs.Desktop'\nimport ProgramsMobile from './Programs.Mobile'\n\nexport type ProgramsProps = {\n  entityId: string\n  rgbIndex: number\n  titleColumnName: string\n  linkColumnName: string\n  summaryColumnName: string\n  imageFileHandleColumnName: string\n  linkConfig: CardLink\n}\n\nexport type ProgramsDataProps = {\n  title: string\n  summary: string\n  link: string\n  exploreLink: string\n  color: string\n  fileHandleAssociation?: FileHandleAssociation\n}\n\nexport function Programs(props: ProgramsProps) {\n  const {\n    entityId,\n    titleColumnName,\n    linkColumnName,\n    summaryColumnName,\n    imageFileHandleColumnName,\n    linkConfig,\n    rgbIndex,\n  } = props\n  const showDesktop = useShowDesktop()\n  const entity = useGetEntity(entityId)\n  const color: string = getColorPalette(rgbIndex ?? 0, 2).colorPalette[0]\n  const queryBundleRequest: QueryBundleRequest = {\n    concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n    entityId,\n    partMask:\n      SynapseConstants.BUNDLE_MASK_QUERY_SELECT_COLUMNS |\n      SynapseConstants.BUNDLE_MASK_QUERY_RESULTS,\n    query: {\n      sql: `select * from ${entityId}`,\n    },\n  }\n  const { data: queryResultBundle } =\n    useGetQueryResultBundle(queryBundleRequest)\n\n  const titleColumnIndex = getFieldIndex(titleColumnName, queryResultBundle)\n  const summaryColumnIndex = getFieldIndex(summaryColumnName, queryResultBundle)\n  const linkColumnIndex = getFieldIndex(linkColumnName, queryResultBundle)\n  const iconColumnIndex = getFieldIndex(\n    imageFileHandleColumnName,\n    queryResultBundle,\n  )\n  return (\n    <div className={`Programs${showDesktop ? '__Desktop' : ''}`}>\n      {queryResultBundle?.queryResult!.queryResults.rows.map(el => {\n        const values = el.values as string[]\n        if (values.some(value => value === null)) {\n          // We cast values above assuming there are no null values, emit a warning just in case.\n          console.warn('Row has null value(s) when no nulls expected')\n        }\n\n        const title = values[titleColumnIndex]\n        const summary = values[summaryColumnIndex]\n        const link = values[linkColumnIndex] ?? ''\n        const iconFileHandleIdValue = values[iconColumnIndex]\n\n        const schema: Record<string, number> = {}\n        queryResultBundle?.queryResult!.queryResults.headers.forEach(\n          (header, colIndex) => {\n            schema[header.name] = colIndex\n          },\n        )\n        const { href } = getLinkParams(link, linkConfig, values, schema)\n\n        const fileHandleAssociation = getFileHandleAssociation(\n          entity.data,\n          iconFileHandleIdValue,\n          `syn${el.rowId}`,\n        )\n        const ProgramsDataProps: ProgramsDataProps = {\n          title,\n          summary,\n          link,\n          color,\n          exploreLink: href,\n          fileHandleAssociation,\n        }\n        return showDesktop ? (\n          <ProgramsDesktop {...ProgramsDataProps} />\n        ) : (\n          <ProgramsMobile {...ProgramsDataProps} />\n        )\n      })}\n    </div>\n  )\n}\n\nexport default Programs\n"],"mappings":";;;;;;;;;;;;AAqCA,SAAgB,EAAS,GAAsB;CAC7C,IAAM,EACJ,aACA,oBACA,mBACA,sBACA,8BACA,eACA,gBACE,GACE,IAAc,EAAe,GAC7B,IAAS,EAAa,CAAQ,GAC9B,IAAgB,EAAgB,KAAY,GAAG,CAAC,EAAE,aAAa,IAW/D,EAAE,MAAM,MACZ,EAAwB;EAVxB,cAAc;EACd;EACA,UACE;EAEF,OAAO,EACL,KAAK,iBAAiB,IACxB;CAGwB,CAAkB,GAEtC,IAAmB,EAAc,GAAiB,CAAiB,GACnE,IAAqB,EAAc,GAAmB,CAAiB,GACvE,IAAkB,EAAc,GAAgB,CAAiB,GACjE,IAAkB,EACtB,GACA,CACF;CACA,OACE,kBAAC,OAAD;EAAK,WAAW,WAAW,IAAc,cAAc;YACpD,GAAmB,YAAa,aAAa,KAAK,KAAI,MAAM;GAC3D,IAAM,IAAS,EAAG;GAClB,AAAI,EAAO,MAAK,MAAS,MAAU,IAAI,KAErC,QAAQ,KAAK,8CAA8C;GAG7D,IAAM,IAAQ,EAAO,IACf,IAAU,EAAO,IACjB,IAAO,EAAO,MAAoB,IAClC,IAAwB,EAAO,IAE/B,IAAiC,CAAC;GACxC,GAAmB,YAAa,aAAa,QAAQ,SAClD,GAAQ,MAAa;IACpB,EAAO,EAAO,QAAQ;GACxB,CACF;GACA,IAAM,EAAE,YAAS,EAAc,GAAM,GAAY,GAAQ,CAAM,GAOzD,IAAuC;IAC3C;IACA;IACA;IACA;IACA,aAAa;IACb,uBAX4B,EAC5B,EAAO,MACP,GACA,MAAM,EAAG,OAQT;GACF;GACA,OACE,EADK,IACJ,IAEA,GAFD,EAAiB,GAAI,EAAoB,CAED;EAE5C,CAAC;CACE,CAAA;AAET"}

package/dist/components/ProjectStorage/ProjectDataAvailability.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProjectDataAvailability.js","names":[],"sources":["../../../src/components/ProjectStorage/ProjectDataAvailability.tsx"],"sourcesContent":["import { SYNAPSE_STORAGE_LOCATION_ID } from '@/synapse-client'\nimport { useProjectStorageUsage } from '@/synapse-queries'\nimport { spreadSx } from '@/theme/spreadSx'\nimport { useSynapseContext } from '@/utils'\nimport { calculateFriendlyFileSize } from '@/utils/functions/calculateFriendlyFileSize'\nimport { SAGE_OFFERINGS_HELP_URL } from '@/utils/SynapseConstants'\nimport { Box, SxProps, Tooltip, Typography } from '@mui/material'\nimport React from 'react'\nimport HelpPopover from '../HelpPopover'\n\nexport type ProjectDataAvailabilityProps = {\n  projectId?: string\n  sx?: SxProps\n}\nconst usageBarWidth = 142 //px\n\nexport function ProjectDataAvailability({\n  projectId,\n  sx,\n}: ProjectDataAvailabilityProps): React.ReactNode {\n  const { isAuthenticated } = useSynapseContext()\n  const { data } = useProjectStorageUsage(projectId!, {\n    enabled: !!projectId && isAuthenticated,\n  })\n  const projectDataUsageArray = data?.locations.filter(\n    v => v.storageLocationId == SYNAPSE_STORAGE_LOCATION_ID,\n  )\n  const synapseStorageUsage =\n    projectDataUsageArray?.length == 1 ? projectDataUsageArray[0] : undefined\n  if (!synapseStorageUsage) {\n    return <></>\n  }\n  const { sumFileBytes = 0, maxAllowedFileBytes = 0 } = synapseStorageUsage\n  if (maxAllowedFileBytes == 0) {\n    return <></>\n  }\n  const usageBarFilledPx = Math.min(\n    Math.round((sumFileBytes / maxAllowedFileBytes) * usageBarWidth),\n    usageBarWidth,\n  )\n  const friendlySumFileBytes = calculateFriendlyFileSize(sumFileBytes, 1)\n  const friendlyMaxAllowedFileBytes = calculateFriendlyFileSize(\n    maxAllowedFileBytes,\n    1,\n  ).replace(/\\.0\\s/, ' ') // SWC-7183: remove '.0 ' from the string if it exists\n  return (\n    <Box\n      sx={spreadSx(\n        {\n          display: 'flex',\n          flexDirection: 'column',\n          width: '210px',\n          fontFamily: 'DM Sans',\n          color: 'white',\n          px: '10px',\n        },\n        sx,\n      )}\n    >\n      <Box\n        sx={{\n          display: 'flex',\n          flexDirection: 'row',\n          gap: '5px',\n        }}\n      >\n        <Typography\n          sx={{\n            // match current styles in Project metadata\n            fontWeight: 700,\n            fontSize: '16px',\n          }}\n        >\n          Data Availability{' '}\n        </Typography>{' '}\n        <HelpPopover\n          containerSx={{\n            fontSize: '12px',\n          }}\n          markdownText=\"Hosting Plan Options:\n- Basic Plan: Free, for sharing small datasets (<100GB) with self-service setup. No direct support.\n- Self-Managed Plan: Ideal for data longevity, FAIR principles, and NIH compliance. Includes consultation services and data access management tools.\n- Data Coordination Plan: For large, multi-institutional projects, with personalized consulting, data curation, and a custom data portal.\"\n          helpUrl={SAGE_OFFERINGS_HELP_URL}\n        />\n      </Box>\n      {synapseStorageUsage.maxAllowedFileBytes && (\n        <Tooltip\n          title={`Using ${friendlySumFileBytes} out of ${friendlyMaxAllowedFileBytes}`}\n        >\n          <Box\n            sx={{\n              display: 'flex',\n              flexDirection: 'row',\n              gap: '5px',\n              alignItems: 'center',\n            }}\n          >\n            <Typography\n              variant=\"body1\"\n              sx={{\n                fontSize: '12px',\n              }}\n            >\n              0\n            </Typography>\n            {/* Progress Bar */}\n            <Box\n              sx={{\n                width: `${usageBarWidth}px`,\n                height: '4px',\n                backgroundColor: 'white',\n                borderRadius: '50px',\n              }}\n            >\n              <Box\n                sx={{\n                  width: `${usageBarFilledPx}px`,\n                  height: '4px',\n                  backgroundColor: '#EDC766',\n                  borderRadius: '50px',\n                }}\n              ></Box>\n            </Box>\n            <Typography\n              variant=\"body1\"\n              sx={{\n                fontSize: '12px',\n                whiteSpace: 'nowrap',\n              }}\n            >\n              {friendlyMaxAllowedFileBytes}\n            </Typography>\n          </Box>\n        </Tooltip>\n      )}\n    </Box>\n  )\n}\n\nexport default ProjectDataAvailability\n"],"mappings":";;;;;;;;;;;;;;AAcA,IAAM,IAAgB;AAEtB,SAAgB,EAAwB,EACtC,cACA,SACgD;CAChD,IAAM,EAAE,uBAAoB,GAAmB,EACzC,EAAE,YAAS,EAAuB,GAAY,EAClD,SAAS,CAAC,CAAC,KAAa,GACzB,CAAC,EACI,IAAwB,GAAM,UAAU,QAC5C,MAAK,EAAE,qBAAA,EACR,EACK,IACJ,GAAuB,UAAU,IAAI,EAAsB,KAAK,KAAA;AAClE,KAAI,CAAC,EACH,QAAO,kBAAA,GAAA,EAAK,CAAA;CAEd,IAAM,EAAE,kBAAe,GAAG,yBAAsB,MAAM;AACtD,KAAI,KAAuB,EACzB,QAAO,kBAAA,GAAA,EAAK,CAAA;CAEd,IAAM,IAAmB,KAAK,IAC5B,KAAK,MAAO,IAAe,IAAuB,EAAc,EAChE,EACD,EACK,IAAuB,EAA0B,GAAc,EAAE,EACjE,IAA8B,EAClC,GACA,EACD,CAAC,QAAQ,SAAS,IAAI;AACvB,QACE,kBAAC,GAAD;EACE,IAAI,EACF;GACE,SAAS;GACT,eAAe;GACf,OAAO;GACP,YAAY;GACZ,OAAO;GACP,IAAI;GACL,EACD,EACD;YAXH,CAaE,kBAAC,GAAD;GACE,IAAI;IACF,SAAS;IACT,eAAe;IACf,KAAK;IACN;aALH;IAOE,kBAAC,GAAD;KACE,IAAI;MAEF,YAAY;MACZ,UAAU;MACX;eALH,CAMC,qBACmB,IACP;;IAAC;IACd,kBAAC,GAAD;KACE,aAAa,EACX,UAAU,QACX;KACD,cAAa;KAIb,SAAS;KACT,CAAA;IACE;MACL,EAAoB,uBACnB,kBAAC,GAAD;GACE,OAAO,SAAS,EAAqB,UAAU;aAE/C,kBAAC,GAAD;IACE,IAAI;KACF,SAAS;KACT,eAAe;KACf,KAAK;KACL,YAAY;KACb;cANH;KAQE,kBAAC,GAAD;MACE,SAAQ;MACR,IAAI,EACF,UAAU,QACX;gBACF;MAEY,CAAA;KAEb,kBAAC,GAAD;MACE,IAAI;OACF,OAAO,GAAG,EAAc;OACxB,QAAQ;OACR,iBAAiB;OACjB,cAAc;OACf;gBAED,kBAAC,GAAD,EACE,IAAI;OACF,OAAO,GAAG,EAAiB;OAC3B,QAAQ;OACR,iBAAiB;OACjB,cAAc;OACf,EACI,CAAA;MACH,CAAA;KACN,kBAAC,GAAD;MACE,SAAQ;MACR,IAAI;OACF,UAAU;OACV,YAAY;OACb;gBAEA;MACU,CAAA;KACT;;GACE,CAAA,CAER"}
+{"version":3,"file":"ProjectDataAvailability.js","names":[],"sources":["../../../src/components/ProjectStorage/ProjectDataAvailability.tsx"],"sourcesContent":["import { SYNAPSE_STORAGE_LOCATION_ID } from '@/synapse-client'\nimport { useProjectStorageUsage } from '@/synapse-queries'\nimport { spreadSx } from '@/theme/spreadSx'\nimport { useSynapseContext } from '@/utils'\nimport { calculateFriendlyFileSize } from '@/utils/functions/calculateFriendlyFileSize'\nimport { SAGE_OFFERINGS_HELP_URL } from '@/utils/SynapseConstants'\nimport { Box, SxProps, Tooltip, Typography } from '@mui/material'\nimport React from 'react'\nimport HelpPopover from '../HelpPopover'\n\nexport type ProjectDataAvailabilityProps = {\n  projectId?: string\n  sx?: SxProps\n}\nconst usageBarWidth = 142 //px\n\nexport function ProjectDataAvailability({\n  projectId,\n  sx,\n}: ProjectDataAvailabilityProps): React.ReactNode {\n  const { isAuthenticated } = useSynapseContext()\n  const { data } = useProjectStorageUsage(projectId!, {\n    enabled: !!projectId && isAuthenticated,\n  })\n  const projectDataUsageArray = data?.locations.filter(\n    v => v.storageLocationId == SYNAPSE_STORAGE_LOCATION_ID,\n  )\n  const synapseStorageUsage =\n    projectDataUsageArray?.length == 1 ? projectDataUsageArray[0] : undefined\n  if (!synapseStorageUsage) {\n    return <></>\n  }\n  const { sumFileBytes = 0, maxAllowedFileBytes = 0 } = synapseStorageUsage\n  if (maxAllowedFileBytes == 0) {\n    return <></>\n  }\n  const usageBarFilledPx = Math.min(\n    Math.round((sumFileBytes / maxAllowedFileBytes) * usageBarWidth),\n    usageBarWidth,\n  )\n  const friendlySumFileBytes = calculateFriendlyFileSize(sumFileBytes, 1)\n  const friendlyMaxAllowedFileBytes = calculateFriendlyFileSize(\n    maxAllowedFileBytes,\n    1,\n  ).replace(/\\.0\\s/, ' ') // SWC-7183: remove '.0 ' from the string if it exists\n  return (\n    <Box\n      sx={spreadSx(\n        {\n          display: 'flex',\n          flexDirection: 'column',\n          width: '210px',\n          fontFamily: 'DM Sans',\n          color: 'white',\n          px: '10px',\n        },\n        sx,\n      )}\n    >\n      <Box\n        sx={{\n          display: 'flex',\n          flexDirection: 'row',\n          gap: '5px',\n        }}\n      >\n        <Typography\n          sx={{\n            // match current styles in Project metadata\n            fontWeight: 700,\n            fontSize: '16px',\n          }}\n        >\n          Data Availability{' '}\n        </Typography>{' '}\n        <HelpPopover\n          containerSx={{\n            fontSize: '12px',\n          }}\n          markdownText=\"Hosting Plan Options:\n- Basic Plan: Free, for sharing small datasets (<100GB) with self-service setup. No direct support.\n- Self-Managed Plan: Ideal for data longevity, FAIR principles, and NIH compliance. Includes consultation services and data access management tools.\n- Data Coordination Plan: For large, multi-institutional projects, with personalized consulting, data curation, and a custom data portal.\"\n          helpUrl={SAGE_OFFERINGS_HELP_URL}\n        />\n      </Box>\n      {synapseStorageUsage.maxAllowedFileBytes && (\n        <Tooltip\n          title={`Using ${friendlySumFileBytes} out of ${friendlyMaxAllowedFileBytes}`}\n        >\n          <Box\n            sx={{\n              display: 'flex',\n              flexDirection: 'row',\n              gap: '5px',\n              alignItems: 'center',\n            }}\n          >\n            <Typography\n              variant=\"body1\"\n              sx={{\n                fontSize: '12px',\n              }}\n            >\n              0\n            </Typography>\n            {/* Progress Bar */}\n            <Box\n              sx={{\n                width: `${usageBarWidth}px`,\n                height: '4px',\n                backgroundColor: 'white',\n                borderRadius: '50px',\n              }}\n            >\n              <Box\n                sx={{\n                  width: `${usageBarFilledPx}px`,\n                  height: '4px',\n                  backgroundColor: '#EDC766',\n                  borderRadius: '50px',\n                }}\n              ></Box>\n            </Box>\n            <Typography\n              variant=\"body1\"\n              sx={{\n                fontSize: '12px',\n                whiteSpace: 'nowrap',\n              }}\n            >\n              {friendlyMaxAllowedFileBytes}\n            </Typography>\n          </Box>\n        </Tooltip>\n      )}\n    </Box>\n  )\n}\n\nexport default ProjectDataAvailability\n"],"mappings":";;;;;;;;;;;;;;AAcA,IAAM,IAAgB;AAEtB,SAAgB,EAAwB,EACtC,cACA,SACgD;CAChD,IAAM,EAAE,uBAAoB,EAAkB,GACxC,EAAE,YAAS,EAAuB,GAAY,EAClD,SAAS,CAAC,CAAC,KAAa,EAC1B,CAAC,GACK,IAAwB,GAAM,UAAU,QAC5C,MAAK,EAAE,qBAAA,CACT,GACM,IACJ,GAAuB,UAAU,IAAI,EAAsB,KAAK,KAAA;CAClE,IAAI,CAAC,GACH,OAAO,kBAAA,GAAA,CAAI,CAAA;CAEb,IAAM,EAAE,kBAAe,GAAG,yBAAsB,MAAM;CACtD,IAAI,KAAuB,GACzB,OAAO,kBAAA,GAAA,CAAI,CAAA;CAEb,IAAM,IAAmB,KAAK,IAC5B,KAAK,MAAO,IAAe,IAAuB,CAAa,GAC/D,CACF,GACM,IAAuB,EAA0B,GAAc,CAAC,GAChE,IAA8B,EAClC,GACA,CACF,EAAE,QAAQ,SAAS,GAAG;CACtB,OACE,kBAAC,GAAD;EACE,IAAI,EACF;GACE,SAAS;GACT,eAAe;GACf,OAAO;GACP,YAAY;GACZ,OAAO;GACP,IAAI;EACN,GACA,CACF;YAXF,CAaE,kBAAC,GAAD;GACE,IAAI;IACF,SAAS;IACT,eAAe;IACf,KAAK;GACP;aALF;IAOE,kBAAC,GAAD;KACE,IAAI;MAEF,YAAY;MACZ,UAAU;KACZ;eALF,CAMC,qBACmB,GACR;;IAAE;IACd,kBAAC,GAAD;KACE,aAAa,EACX,UAAU,OACZ;KACA,cAAa;KAIb,SAAS;IACV,CAAA;GACE;MACJ,EAAoB,uBACnB,kBAAC,GAAD;GACE,OAAO,SAAS,EAAqB,UAAU;aAE/C,kBAAC,GAAD;IACE,IAAI;KACF,SAAS;KACT,eAAe;KACf,KAAK;KACL,YAAY;IACd;cANF;KAQE,kBAAC,GAAD;MACE,SAAQ;MACR,IAAI,EACF,UAAU,OACZ;gBACD;KAEW,CAAA;KAEZ,kBAAC,GAAD;MACE,IAAI;OACF,OAAO,GAAG,EAAc;OACxB,QAAQ;OACR,iBAAiB;OACjB,cAAc;MAChB;gBAEA,kBAAC,GAAD,EACE,IAAI;OACF,OAAO,GAAG,EAAiB;OAC3B,QAAQ;OACR,iBAAiB;OACjB,cAAc;MAChB,EACI,CAAA;KACH,CAAA;KACL,kBAAC,GAAD;MACE,SAAQ;MACR,IAAI;OACF,UAAU;OACV,YAAY;MACd;gBAEC;KACS,CAAA;IACT;;EACE,CAAA,CAER;;AAET"}

package/dist/components/ProvenanceGraph/ActivityNodeLabel.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActivityNodeLabel.js","names":[],"sources":["../../../src/components/ProvenanceGraph/ActivityNodeLabel.tsx"],"sourcesContent":["import React from 'react'\nimport { formatDate } from '@/utils/functions/DateFormatter'\nimport { Tooltip, Typography } from '@mui/material'\nimport { Activity } from '@sage-bionetworks/synapse-types'\nimport dayjs from 'dayjs'\nimport { useMemo } from 'react'\nimport { UserBadge } from '../UserCard/UserBadge'\n\nexport const ActivityNodeLabel = (data: Activity): React.ReactNode => {\n  const friendlyModifiedOn = formatDate(dayjs(data.modifiedOn))\n  const { name, description } = data\n  return useMemo(\n    () => (\n      <>\n        {name && (\n          <Tooltip title={name} placement=\"top\" enterNextDelay={200}>\n            <span>\n              <Typography variant=\"smallText1\" className=\"name\">\n                {name}\n              </Typography>\n            </span>\n          </Tooltip>\n        )}\n        {description && (\n          <Tooltip title={description} placement=\"top\" enterNextDelay={200}>\n            <span>\n              <Typography variant=\"smallText1\" className=\"description\">\n                {description}\n              </Typography>\n            </span>\n          </Tooltip>\n        )}\n        <UserBadge userId={data.modifiedBy} />\n        <div>{friendlyModifiedOn}</div>\n      </>\n    ),\n    [name, description, data.modifiedBy, friendlyModifiedOn],\n  )\n}\n"],"mappings":";;;;;;;AAQA,IAAa,KAAqB,MAAoC;CACpE,IAAM,IAAqB,EAAW,EAAM,EAAK,WAAW,CAAC,EACvD,EAAE,SAAM,mBAAgB;AAC9B,QAAO,QAEH,kBAAA,GAAA,EAAA,UAAA;EACG,KACC,kBAAC,GAAD;GAAS,OAAO;GAAM,WAAU;GAAM,gBAAgB;aACpD,kBAAC,QAAD,EAAA,UACE,kBAAC,GAAD;IAAY,SAAQ;IAAa,WAAU;cACxC;IACU,CAAA,EACR,CAAA;GACC,CAAA;EAEX,KACC,kBAAC,GAAD;GAAS,OAAO;GAAa,WAAU;GAAM,gBAAgB;aAC3D,kBAAC,QAAD,EAAA,UACE,kBAAC,GAAD;IAAY,SAAQ;IAAa,WAAU;cACxC;IACU,CAAA,EACR,CAAA;GACC,CAAA;EAEZ,kBAAC,GAAD,EAAW,QAAQ,EAAK,YAAc,CAAA;EACtC,kBAAC,OAAD,EAAA,UAAM,GAAyB,CAAA;EAC9B,EAAA,CAAA,EAEL;EAAC;EAAM;EAAa,EAAK;EAAY;EAAmB,CACzD"}
+{"version":3,"file":"ActivityNodeLabel.js","names":[],"sources":["../../../src/components/ProvenanceGraph/ActivityNodeLabel.tsx"],"sourcesContent":["import React from 'react'\nimport { formatDate } from '@/utils/functions/DateFormatter'\nimport { Tooltip, Typography } from '@mui/material'\nimport { Activity } from '@sage-bionetworks/synapse-types'\nimport dayjs from 'dayjs'\nimport { useMemo } from 'react'\nimport { UserBadge } from '../UserCard/UserBadge'\n\nexport const ActivityNodeLabel = (data: Activity): React.ReactNode => {\n  const friendlyModifiedOn = formatDate(dayjs(data.modifiedOn))\n  const { name, description } = data\n  return useMemo(\n    () => (\n      <>\n        {name && (\n          <Tooltip title={name} placement=\"top\" enterNextDelay={200}>\n            <span>\n              <Typography variant=\"smallText1\" className=\"name\">\n                {name}\n              </Typography>\n            </span>\n          </Tooltip>\n        )}\n        {description && (\n          <Tooltip title={description} placement=\"top\" enterNextDelay={200}>\n            <span>\n              <Typography variant=\"smallText1\" className=\"description\">\n                {description}\n              </Typography>\n            </span>\n          </Tooltip>\n        )}\n        <UserBadge userId={data.modifiedBy} />\n        <div>{friendlyModifiedOn}</div>\n      </>\n    ),\n    [name, description, data.modifiedBy, friendlyModifiedOn],\n  )\n}\n"],"mappings":";;;;;;;AAQA,IAAa,KAAqB,MAAoC;CACpE,IAAM,IAAqB,EAAW,EAAM,EAAK,UAAU,CAAC,GACtD,EAAE,SAAM,mBAAgB;CAC9B,OAAO,QAEH,kBAAA,GAAA,EAAA,UAAA;EACG,KACC,kBAAC,GAAD;GAAS,OAAO;GAAM,WAAU;GAAM,gBAAgB;aACpD,kBAAC,QAAD,EAAA,UACE,kBAAC,GAAD;IAAY,SAAQ;IAAa,WAAU;cACxC;GACS,CAAA,EACR,CAAA;EACC,CAAA;EAEV,KACC,kBAAC,GAAD;GAAS,OAAO;GAAa,WAAU;GAAM,gBAAgB;aAC3D,kBAAC,QAAD,EAAA,UACE,kBAAC,GAAD;IAAY,SAAQ;IAAa,WAAU;cACxC;GACS,CAAA,EACR,CAAA;EACC,CAAA;EAEX,kBAAC,GAAD,EAAW,QAAQ,EAAK,WAAa,CAAA;EACrC,kBAAC,OAAD,EAAA,UAAM,EAAwB,CAAA;CAC9B,EAAA,CAAA,GAEJ;EAAC;EAAM;EAAa,EAAK;EAAY;CAAkB,CACzD;AACF"}

package/dist/components/ProvenanceGraph/EntityNodeLabel.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityNodeLabel.js","names":[],"sources":["../../../src/components/ProvenanceGraph/EntityNodeLabel.tsx"],"sourcesContent":["import {\n  convertToEntityType,\n  isVersionableEntityType,\n} from '@/utils/functions/EntityTypeUtils'\nimport React from 'react'\nimport { PRODUCTION_ENDPOINT_CONFIG } from '@/utils/functions/getEndpoint'\nimport { Link, Tooltip } from '@mui/material'\nimport { EntityHeader } from '@sage-bionetworks/synapse-types'\nimport { useMemo } from 'react'\nimport { ProvenanceEntityIcon } from './ProvenanceEntityIcon'\n\nexport const EntityNodeLabel = (data: EntityHeader): React.ReactNode => {\n  const targetVersionNumberString = data.versionNumber\n    ? `.${data.versionNumber}`\n    : ''\n  const entityVersionString = `${data.id}${targetVersionNumberString}`\n  return useMemo(\n    () => (\n      <>\n        <div>\n          <ProvenanceEntityIcon entityHeader={data} />\n        </div>\n        <>\n          <div>\n            <Tooltip title={data.name} placement=\"top\" enterNextDelay={300}>\n              <Link\n                href={`${PRODUCTION_ENDPOINT_CONFIG.PORTAL}Synapse:${entityVersionString}`}\n              >\n                {data.name}\n              </Link>\n            </Tooltip>\n          </div>\n          {isVersionableEntityType(convertToEntityType(data.type)) && (\n            <div>\n              <div>v.{data.versionNumber}</div>\n              {!data.isLatestVersion && <div>(old version)</div>}\n            </div>\n          )}\n        </>\n      </>\n    ),\n    [data, entityVersionString],\n  )\n}\n"],"mappings":";;;;;;;AAWA,IAAa,KAAmB,MAAwC;CACtE,IAAM,IAA4B,EAAK,gBACnC,IAAI,EAAK,kBACT,IACE,IAAsB,GAAG,EAAK,KAAK;AACzC,QAAO,QAEH,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,OAAD,EAAA,UACE,kBAAC,GAAD,EAAsB,cAAc,GAAQ,CAAA,EACxC,CAAA,EACN,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,OAAD,EAAA,UACE,kBAAC,GAAD;EAAS,OAAO,EAAK;EAAM,WAAU;EAAM,gBAAgB;YACzD,kBAAC,GAAD;GACE,MAAM,GAAG,EAA2B,OAAO,UAAU;aAEpD,EAAK;GACD,CAAA;EACC,CAAA,EACN,CAAA,EACL,EAAwB,EAAoB,EAAK,KAAK,CAAC,IACtD,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,OAAD,EAAA,UAAA,CAAK,MAAG,EAAK,cAAoB,EAAA,CAAA,EAChC,CAAC,EAAK,mBAAmB,kBAAC,OAAD,EAAA,UAAK,iBAAmB,CAAA,CAC9C,EAAA,CAAA,CAEP,EAAA,CAAA,CACF,EAAA,CAAA,EAEL,CAAC,GAAM,EAAoB,CAC5B"}
+{"version":3,"file":"EntityNodeLabel.js","names":[],"sources":["../../../src/components/ProvenanceGraph/EntityNodeLabel.tsx"],"sourcesContent":["import {\n  convertToEntityType,\n  isVersionableEntityType,\n} from '@/utils/functions/EntityTypeUtils'\nimport React from 'react'\nimport { PRODUCTION_ENDPOINT_CONFIG } from '@/utils/functions/getEndpoint'\nimport { Link, Tooltip } from '@mui/material'\nimport { EntityHeader } from '@sage-bionetworks/synapse-types'\nimport { useMemo } from 'react'\nimport { ProvenanceEntityIcon } from './ProvenanceEntityIcon'\n\nexport const EntityNodeLabel = (data: EntityHeader): React.ReactNode => {\n  const targetVersionNumberString = data.versionNumber\n    ? `.${data.versionNumber}`\n    : ''\n  const entityVersionString = `${data.id}${targetVersionNumberString}`\n  return useMemo(\n    () => (\n      <>\n        <div>\n          <ProvenanceEntityIcon entityHeader={data} />\n        </div>\n        <>\n          <div>\n            <Tooltip title={data.name} placement=\"top\" enterNextDelay={300}>\n              <Link\n                href={`${PRODUCTION_ENDPOINT_CONFIG.PORTAL}Synapse:${entityVersionString}`}\n              >\n                {data.name}\n              </Link>\n            </Tooltip>\n          </div>\n          {isVersionableEntityType(convertToEntityType(data.type)) && (\n            <div>\n              <div>v.{data.versionNumber}</div>\n              {!data.isLatestVersion && <div>(old version)</div>}\n            </div>\n          )}\n        </>\n      </>\n    ),\n    [data, entityVersionString],\n  )\n}\n"],"mappings":";;;;;;;AAWA,IAAa,KAAmB,MAAwC;CACtE,IAAM,IAA4B,EAAK,gBACnC,IAAI,EAAK,kBACT,IACE,IAAsB,GAAG,EAAK,KAAK;CACzC,OAAO,QAEH,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,OAAD,EAAA,UACE,kBAAC,GAAD,EAAsB,cAAc,EAAO,CAAA,EACxC,CAAA,GACL,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,OAAD,EAAA,UACE,kBAAC,GAAD;EAAS,OAAO,EAAK;EAAM,WAAU;EAAM,gBAAgB;YACzD,kBAAC,GAAD;GACE,MAAM,GAAG,EAA2B,OAAO,UAAU;aAEpD,EAAK;EACF,CAAA;CACC,CAAA,EACN,CAAA,GACJ,EAAwB,EAAoB,EAAK,IAAI,CAAC,KACrD,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,OAAD,EAAA,UAAA,CAAK,MAAG,EAAK,aAAmB,EAAA,CAAA,GAC/B,CAAC,EAAK,mBAAmB,kBAAC,OAAD,EAAA,UAAK,gBAAkB,CAAA,CAC9C,EAAA,CAAA,CAEP,EAAA,CAAA,CACF,EAAA,CAAA,GAEJ,CAAC,GAAM,CAAmB,CAC5B;AACF"}

package/dist/components/ProvenanceGraph/EntityPlaceholderNodeLabel.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityPlaceholderNodeLabel.js","names":[],"sources":["../../../src/components/ProvenanceGraph/EntityPlaceholderNodeLabel.tsx"],"sourcesContent":["import React from 'react'\nimport { useMemo } from 'react'\nimport { Reference } from '@sage-bionetworks/synapse-types'\nimport IconSvg from '../IconSvg/IconSvg'\n\n/**\n * This node type is used if the user cannot access the entity for some reason\n */\nexport const EntityPlaceholderNodeLabel = (\n  data: Reference,\n): React.ReactNode => {\n  const targetVersionNumberString = data.targetVersionNumber\n    ? `.${data.targetVersionNumber}`\n    : ''\n  const entityVersionString = `${data.targetId}${targetVersionNumberString}`\n  return useMemo(\n    () => (\n      <>\n        <div>\n          <IconSvg icon=\"fileOutlined\" />\n        </div>\n        <span>{entityVersionString}</span>\n      </>\n    ),\n    [entityVersionString],\n  )\n}\n"],"mappings":";;;;AAQA,IAAa,KACX,MACoB;CACpB,IAAM,IAA4B,EAAK,sBACnC,IAAI,EAAK,wBACT,IACE,IAAsB,GAAG,EAAK,WAAW;AAC/C,QAAO,QAEH,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,OAAD,EAAA,UACE,kBAAC,GAAD,EAAS,MAAK,gBAAiB,CAAA,EAC3B,CAAA,EACN,kBAAC,QAAD,EAAA,UAAO,GAA2B,CAAA,CACjC,EAAA,CAAA,EAEL,CAAC,EAAoB,CACtB"}
+{"version":3,"file":"EntityPlaceholderNodeLabel.js","names":[],"sources":["../../../src/components/ProvenanceGraph/EntityPlaceholderNodeLabel.tsx"],"sourcesContent":["import React from 'react'\nimport { useMemo } from 'react'\nimport { Reference } from '@sage-bionetworks/synapse-types'\nimport IconSvg from '../IconSvg/IconSvg'\n\n/**\n * This node type is used if the user cannot access the entity for some reason\n */\nexport const EntityPlaceholderNodeLabel = (\n  data: Reference,\n): React.ReactNode => {\n  const targetVersionNumberString = data.targetVersionNumber\n    ? `.${data.targetVersionNumber}`\n    : ''\n  const entityVersionString = `${data.targetId}${targetVersionNumberString}`\n  return useMemo(\n    () => (\n      <>\n        <div>\n          <IconSvg icon=\"fileOutlined\" />\n        </div>\n        <span>{entityVersionString}</span>\n      </>\n    ),\n    [entityVersionString],\n  )\n}\n"],"mappings":";;;;AAQA,IAAa,KACX,MACoB;CACpB,IAAM,IAA4B,EAAK,sBACnC,IAAI,EAAK,wBACT,IACE,IAAsB,GAAG,EAAK,WAAW;CAC/C,OAAO,QAEH,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,OAAD,EAAA,UACE,kBAAC,GAAD,EAAS,MAAK,eAAgB,CAAA,EAC3B,CAAA,GACL,kBAAC,QAAD,EAAA,UAAO,EAA0B,CAAA,CACjC,EAAA,CAAA,GAEJ,CAAC,CAAmB,CACtB;AACF"}

package/dist/components/ProvenanceGraph/ExpandGraphNodeLabel.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExpandGraphNodeLabel.js","names":[],"sources":["../../../src/components/ProvenanceGraph/ExpandGraphNodeLabel.tsx"],"sourcesContent":["import React from 'react'\nimport pluralize from 'pluralize'\nimport { useMemo } from 'react'\nimport { EntityHeader } from '@sage-bionetworks/synapse-types'\n\nexport type ExpandGraphNodeDataProps = {\n  entityHeader: EntityHeader\n  itemCount: number\n}\nexport const ExpandGraphNodeLabel = (\n  props: ExpandGraphNodeDataProps,\n): React.ReactNode => {\n  const { itemCount } = props\n  return useMemo(\n    () => (\n      <>\n        <a>\n          Show {itemCount} {pluralize('item', itemCount)}&hellip;\n        </a>\n      </>\n    ),\n    [itemCount],\n  )\n}\n"],"mappings":";;;;AASA,IAAa,KACX,MACoB;CACpB,IAAM,EAAE,iBAAc;AACtB,QAAO,QAEH,kBAAA,GAAA,EAAA,UACE,kBAAC,KAAD,EAAA,UAAA;EAAG;EACK;EAAU;EAAE,EAAU,QAAQ,EAAU;EAAC;EAC7C,EAAA,CAAA,EACH,CAAA,EAEL,CAAC,EAAU,CACZ"}
+{"version":3,"file":"ExpandGraphNodeLabel.js","names":[],"sources":["../../../src/components/ProvenanceGraph/ExpandGraphNodeLabel.tsx"],"sourcesContent":["import React from 'react'\nimport pluralize from 'pluralize'\nimport { useMemo } from 'react'\nimport { EntityHeader } from '@sage-bionetworks/synapse-types'\n\nexport type ExpandGraphNodeDataProps = {\n  entityHeader: EntityHeader\n  itemCount: number\n}\nexport const ExpandGraphNodeLabel = (\n  props: ExpandGraphNodeDataProps,\n): React.ReactNode => {\n  const { itemCount } = props\n  return useMemo(\n    () => (\n      <>\n        <a>\n          Show {itemCount} {pluralize('item', itemCount)}&hellip;\n        </a>\n      </>\n    ),\n    [itemCount],\n  )\n}\n"],"mappings":";;;;AASA,IAAa,KACX,MACoB;CACpB,IAAM,EAAE,iBAAc;CACtB,OAAO,QAEH,kBAAA,GAAA,EAAA,UACE,kBAAC,KAAD,EAAA,UAAA;EAAG;EACK;EAAU;EAAE,EAAU,QAAQ,CAAS;EAAE;CAC9C,EAAA,CAAA,EACH,CAAA,GAEJ,CAAC,CAAS,CACZ;AACF"}

package/dist/components/ProvenanceGraph/ExternalGraphNodeLabel.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExternalGraphNodeLabel.js","names":[],"sources":["../../../src/components/ProvenanceGraph/ExternalGraphNodeLabel.tsx"],"sourcesContent":["import React from 'react'\nimport { useMemo } from 'react'\nimport { UsedURL } from '@sage-bionetworks/synapse-types'\nimport { Tooltip } from '@mui/material'\nimport { ProvenanceExternalIcon } from './ProvenanceExternalIcon'\n\nexport const ExternalGraphNodeLabel = (data: UsedURL): React.ReactNode => {\n  return useMemo(\n    () => (\n      <>\n        <div>\n          <ProvenanceExternalIcon url={data.url} />\n        </div>\n        <Tooltip title={data.name} placement=\"top\" enterNextDelay={300}>\n          <a href={data.url} rel=\"noopener noreferrer\">\n            {data.name}\n          </a>\n        </Tooltip>\n      </>\n    ),\n    [data.name, data.url],\n  )\n}\n"],"mappings":";;;;;AAMA,IAAa,KAA0B,MAC9B,QAEH,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,OAAD,EAAA,UACE,kBAAC,GAAD,EAAwB,KAAK,EAAK,KAAO,CAAA,EACrC,CAAA,EACN,kBAAC,GAAD;CAAS,OAAO,EAAK;CAAM,WAAU;CAAM,gBAAgB;WACzD,kBAAC,KAAD;EAAG,MAAM,EAAK;EAAK,KAAI;YACpB,EAAK;EACJ,CAAA;CACI,CAAA,CACT,EAAA,CAAA,EAEL,CAAC,EAAK,MAAM,EAAK,IAAI,CACtB"}
+{"version":3,"file":"ExternalGraphNodeLabel.js","names":[],"sources":["../../../src/components/ProvenanceGraph/ExternalGraphNodeLabel.tsx"],"sourcesContent":["import React from 'react'\nimport { useMemo } from 'react'\nimport { UsedURL } from '@sage-bionetworks/synapse-types'\nimport { Tooltip } from '@mui/material'\nimport { ProvenanceExternalIcon } from './ProvenanceExternalIcon'\n\nexport const ExternalGraphNodeLabel = (data: UsedURL): React.ReactNode => {\n  return useMemo(\n    () => (\n      <>\n        <div>\n          <ProvenanceExternalIcon url={data.url} />\n        </div>\n        <Tooltip title={data.name} placement=\"top\" enterNextDelay={300}>\n          <a href={data.url} rel=\"noopener noreferrer\">\n            {data.name}\n          </a>\n        </Tooltip>\n      </>\n    ),\n    [data.name, data.url],\n  )\n}\n"],"mappings":";;;;;AAMA,IAAa,KAA0B,MAC9B,QAEH,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,OAAD,EAAA,UACE,kBAAC,GAAD,EAAwB,KAAK,EAAK,IAAM,CAAA,EACrC,CAAA,GACL,kBAAC,GAAD;CAAS,OAAO,EAAK;CAAM,WAAU;CAAM,gBAAgB;WACzD,kBAAC,KAAD;EAAG,MAAM,EAAK;EAAK,KAAI;YACpB,EAAK;CACL,CAAA;AACI,CAAA,CACT,EAAA,CAAA,GAEJ,CAAC,EAAK,MAAM,EAAK,GAAG,CACtB"}

package/dist/components/ProvenanceGraph/ProvenanceEntityIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProvenanceEntityIcon.js","names":[],"sources":["../../../src/components/ProvenanceGraph/ProvenanceEntityIcon.tsx"],"sourcesContent":["import React from 'react'\nimport { convertToEntityType } from '@/utils/functions/EntityTypeUtils'\nimport { EntityType } from '@sage-bionetworks/synapse-client'\nimport { EntityHeader } from '@sage-bionetworks/synapse-types'\nimport { EntityTypeIcon } from '../EntityIcon'\nimport IconSvg from '../IconSvg/IconSvg'\n\nexport type ProvenanceEntityIconProps = {\n  entityHeader?: EntityHeader\n}\n\nconst codeFileExtensionSet = new Set([\n  '.awk',\n  '.bat',\n  '.btm',\n  '.c',\n  '.cmd',\n  '.cpp',\n  '.cxx',\n  '.def',\n  '.dlg',\n  '.dpc',\n  '.dpj',\n  '.dtd',\n  '.h',\n  '.hdl',\n  '.hpp',\n  '.hrc',\n  '.html',\n  '.hxx',\n  '.inc',\n  '.ini',\n  '.inl',\n  '.ins',\n  '.ipy',\n  '.java',\n  '.js',\n  '.jsp',\n  '.l',\n  '.lgt',\n  '.ll',\n  '.par',\n  '.pl',\n  '.py',\n  '.r',\n  '.rc',\n  '.rdb',\n  '.res',\n  '.s',\n  '.sbl',\n  '.scp',\n  '.sh',\n  '.sql',\n  '.src',\n  '.srs',\n  '.xml',\n  '.xrb',\n  '.y',\n  '.yaml',\n  '.yxx',\n  '.cwl',\n  '.wdl',\n  '.json',\n])\n\nexport const ProvenanceEntityIcon = (\n  props: ProvenanceEntityIconProps,\n): React.ReactNode => {\n  const { entityHeader } = props\n  if (entityHeader) {\n    const entityType: EntityType = convertToEntityType(entityHeader?.type)\n    if (entityType == EntityType.file) {\n      // this is a file, may want to use a special icon in this case\n      const lastPeriodIndex = entityHeader.name.lastIndexOf('.')\n      if (lastPeriodIndex > -1) {\n        const extension = entityHeader.name.slice(lastPeriodIndex)\n        if (codeFileExtensionSet.has(extension.toLowerCase())) {\n          return <IconSvg icon=\"code\" />\n        }\n      }\n    } else {\n      return <EntityTypeIcon type={entityType} includeTooltip={false} />\n    }\n  }\n\n  // return the default (File icon)\n  return <EntityTypeIcon type={EntityType.file} includeTooltip={false} />\n}\n"],"mappings":";;;;;;;AAWA,IAAM,IAAuB,IAAI,IAAI,6QAoDpC,CAAC,EAEW,KACX,MACoB;CACpB,IAAM,EAAE,oBAAiB;AACzB,KAAI,GAAc;EAChB,IAAM,IAAyB,EAAoB,GAAc,KAAK;AACtE,MAAI,KAAc,EAAW,MAAM;GAEjC,IAAM,IAAkB,EAAa,KAAK,YAAY,IAAI;AAC1D,OAAI,IAAkB,IAAI;IACxB,IAAM,IAAY,EAAa,KAAK,MAAM,EAAgB;AAC1D,QAAI,EAAqB,IAAI,EAAU,aAAa,CAAC,CACnD,QAAO,kBAAC,GAAD,EAAS,MAAK,QAAS,CAAA;;QAIlC,QAAO,kBAAC,GAAD;GAAgB,MAAM;GAAY,gBAAgB;GAAS,CAAA;;AAKtE,QAAO,kBAAC,GAAD;EAAgB,MAAM,EAAW;EAAM,gBAAgB;EAAS,CAAA"}
+{"version":3,"file":"ProvenanceEntityIcon.js","names":[],"sources":["../../../src/components/ProvenanceGraph/ProvenanceEntityIcon.tsx"],"sourcesContent":["import React from 'react'\nimport { convertToEntityType } from '@/utils/functions/EntityTypeUtils'\nimport { EntityType } from '@sage-bionetworks/synapse-client'\nimport { EntityHeader } from '@sage-bionetworks/synapse-types'\nimport { EntityTypeIcon } from '../EntityIcon'\nimport IconSvg from '../IconSvg/IconSvg'\n\nexport type ProvenanceEntityIconProps = {\n  entityHeader?: EntityHeader\n}\n\nconst codeFileExtensionSet = new Set([\n  '.awk',\n  '.bat',\n  '.btm',\n  '.c',\n  '.cmd',\n  '.cpp',\n  '.cxx',\n  '.def',\n  '.dlg',\n  '.dpc',\n  '.dpj',\n  '.dtd',\n  '.h',\n  '.hdl',\n  '.hpp',\n  '.hrc',\n  '.html',\n  '.hxx',\n  '.inc',\n  '.ini',\n  '.inl',\n  '.ins',\n  '.ipy',\n  '.java',\n  '.js',\n  '.jsp',\n  '.l',\n  '.lgt',\n  '.ll',\n  '.par',\n  '.pl',\n  '.py',\n  '.r',\n  '.rc',\n  '.rdb',\n  '.res',\n  '.s',\n  '.sbl',\n  '.scp',\n  '.sh',\n  '.sql',\n  '.src',\n  '.srs',\n  '.xml',\n  '.xrb',\n  '.y',\n  '.yaml',\n  '.yxx',\n  '.cwl',\n  '.wdl',\n  '.json',\n])\n\nexport const ProvenanceEntityIcon = (\n  props: ProvenanceEntityIconProps,\n): React.ReactNode => {\n  const { entityHeader } = props\n  if (entityHeader) {\n    const entityType: EntityType = convertToEntityType(entityHeader?.type)\n    if (entityType == EntityType.file) {\n      // this is a file, may want to use a special icon in this case\n      const lastPeriodIndex = entityHeader.name.lastIndexOf('.')\n      if (lastPeriodIndex > -1) {\n        const extension = entityHeader.name.slice(lastPeriodIndex)\n        if (codeFileExtensionSet.has(extension.toLowerCase())) {\n          return <IconSvg icon=\"code\" />\n        }\n      }\n    } else {\n      return <EntityTypeIcon type={entityType} includeTooltip={false} />\n    }\n  }\n\n  // return the default (File icon)\n  return <EntityTypeIcon type={EntityType.file} includeTooltip={false} />\n}\n"],"mappings":";;;;;;;AAWA,IAAM,IAAuB,IAAI,IAAI,4QAoDrC,CAAC,GAEY,KACX,MACoB;CACpB,IAAM,EAAE,oBAAiB;CACzB,IAAI,GAAc;EAChB,IAAM,IAAyB,EAAoB,GAAc,IAAI;EACrE,IAAI,KAAc,EAAW,MAAM;GAEjC,IAAM,IAAkB,EAAa,KAAK,YAAY,GAAG;GACzD,IAAI,IAAkB,IAAI;IACxB,IAAM,IAAY,EAAa,KAAK,MAAM,CAAe;IACzD,IAAI,EAAqB,IAAI,EAAU,YAAY,CAAC,GAClD,OAAO,kBAAC,GAAD,EAAS,MAAK,OAAQ,CAAA;GAEjC;EACF,OACE,OAAO,kBAAC,GAAD;GAAgB,MAAM;GAAY,gBAAgB;EAAQ,CAAA;CAErE;CAGA,OAAO,kBAAC,GAAD;EAAgB,MAAM,EAAW;EAAM,gBAAgB;CAAQ,CAAA;AACxE"}

package/dist/components/ProvenanceGraph/ProvenanceExternalIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProvenanceExternalIcon.js","names":[],"sources":["../../../src/components/ProvenanceGraph/ProvenanceExternalIcon.tsx"],"sourcesContent":["import React from 'react'\nimport IconSvg, { IconName } from '../IconSvg/IconSvg'\n\nexport type ProvenanceExternalIconProps = {\n  url: string\n}\nconst githubRegex = /^(.+?\\.)?github\\.com$/\nconst githubusercontentRegex = /^(.+?\\.)?githubusercontent\\.com$/\n\nexport const ProvenanceExternalIcon = (\n  props: ProvenanceExternalIconProps,\n): React.ReactNode => {\n  const { url } = props\n  let icon: IconName = 'link'\n  const parsedUrl = new URL(url)\n  const { hostname } = parsedUrl\n\n  if (hostname.match(githubRegex) || hostname.match(githubusercontentRegex)) {\n    icon = 'github'\n  }\n  // else if (url.includes(\"genomespace.org\")) {\n  //   icon = 'genomespace'\n  // }\n\n  // return the default (File icon)\n  return <IconSvg icon={icon} />\n}\n"],"mappings":";;;;AAMA,IAAM,IAAc,yBACd,IAAyB,oCAElB,KACX,MACoB;CACpB,IAAM,EAAE,WAAQ,GACZ,IAAiB,QAEf,EAAE,gBAAa,IADC,IAAI,EACL;AAUrB,SARI,EAAS,MAAM,EAAY,IAAI,EAAS,MAAM,EAAuB,MACvE,IAAO,WAOF,kBAAC,GAAD,EAAe,SAAQ,CAAA"}
+{"version":3,"file":"ProvenanceExternalIcon.js","names":[],"sources":["../../../src/components/ProvenanceGraph/ProvenanceExternalIcon.tsx"],"sourcesContent":["import React from 'react'\nimport IconSvg, { IconName } from '../IconSvg/IconSvg'\n\nexport type ProvenanceExternalIconProps = {\n  url: string\n}\nconst githubRegex = /^(.+?\\.)?github\\.com$/\nconst githubusercontentRegex = /^(.+?\\.)?githubusercontent\\.com$/\n\nexport const ProvenanceExternalIcon = (\n  props: ProvenanceExternalIconProps,\n): React.ReactNode => {\n  const { url } = props\n  let icon: IconName = 'link'\n  const parsedUrl = new URL(url)\n  const { hostname } = parsedUrl\n\n  if (hostname.match(githubRegex) || hostname.match(githubusercontentRegex)) {\n    icon = 'github'\n  }\n  // else if (url.includes(\"genomespace.org\")) {\n  //   icon = 'genomespace'\n  // }\n\n  // return the default (File icon)\n  return <IconSvg icon={icon} />\n}\n"],"mappings":";;;;AAMA,IAAM,IAAc,yBACd,IAAyB,oCAElB,KACX,MACoB;CACpB,IAAM,EAAE,WAAQ,GACZ,IAAiB,QAEf,EAAE,gBAAa,IADC,IAAI,CACL;CAUrB,QARI,EAAS,MAAM,CAAW,KAAK,EAAS,MAAM,CAAsB,OACtE,IAAO,WAOF,kBAAC,GAAD,EAAe,QAAO,CAAA;AAC/B"}

package/dist/components/ProvenanceGraph/ProvenanceGraph.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProvenanceGraph.js","names":[],"sources":["../../../src/components/ProvenanceGraph/ProvenanceGraph.tsx"],"sourcesContent":["import SynapseClient from '@/synapse-client'\nimport { useGetEntityHeaders } from '@/synapse-queries'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport { CircularProgress } from '@mui/material'\nimport {\n  Activity,\n  EntityHeader,\n  ReferenceList,\n  Used,\n  USED_ENTITY_CONCRETE_TYPE_VALUE,\n  UsedEntity,\n  UsedURL,\n} from '@sage-bionetworks/synapse-types'\nimport { MouseEvent, useCallback, useEffect, useState, WheelEvent } from 'react'\nimport { useErrorHandler } from 'react-error-boundary'\nimport ReactFlow, {\n  Controls,\n  Edge,\n  getConnectedEdges,\n  Node,\n  ReactFlowProvider,\n  useEdgesState,\n  useNodesState,\n  useReactFlow,\n} from 'reactflow'\nimport { SynapseErrorBoundary } from '../error/ErrorBanner'\nimport { displayToast } from '../ToastMessage/ToastMessage'\nimport { ExpandGraphNodeDataProps } from './ExpandGraphNodeLabel'\nimport {\n  addActivityNode,\n  addEntityNode,\n  addEntityPlaceholderNode,\n  addExpandNode,\n  addExternalNode,\n  addUndefinedNode,\n  findEntityNode,\n  isRootEntity,\n} from './ProvenanceGraphUtils'\nimport {\n  getLayoutedElements,\n  isArrayEqual,\n  NodeType,\n  ProvenanceNodeData,\n} from './ProvenanceUtils'\nimport 'reactflow/dist/style.css'\n\nexport type ProvenanceProps = {\n  // what entity nodes should we start with?\n  entityRefs: ReferenceList\n  containerHeight?: string\n  initialNodes?: Node[]\n  initialEdges?: Edge[]\n  onNodesChangedListener?: (nodes: Node[]) => void\n  onEdgesChangedListener?: (edges: Edge[]) => void\n}\n\nconst MAX_ACTIVITY_EXPAND_NODES = 400\nconst DEFAULT_ZOOM = 0.85\n\n/**\n * Renders a Provenance Graph for a set of entities.\n * New Nodes are added to tempNodes, and new Edges are added to tempEdges.\n * On change, these are fed into the dagre js graph library to figure out the node positions,\n * and the output stored in 'nodes' and 'edges'. The 'nodes' and 'edges' arrays are used by the\n * ReactFlow component.\n */\nconst ProvenanceReactFlow = (props: ProvenanceProps): React.ReactNode => {\n  const {\n    entityRefs: rootEntityRefs,\n    containerHeight = '200px',\n    initialNodes = [],\n    initialEdges = [],\n    onNodesChangedListener,\n    onEdgesChangedListener,\n  } = props\n  const { accessToken } = useSynapseContext()\n  const [tempNodes, setTempNodes] = useState<Node[]>(initialNodes)\n  const [tempEdges, setTempEdges] = useState<Edge[]>(initialEdges)\n  const [nodes, setNodes] = useNodesState([])\n  const [edges, setEdges] = useEdgesState([])\n  const [clickedNode, setClickedNode] = useState<Node>()\n  const handleError = useErrorHandler()\n\n  const { data: rootEntityHeadersPage, isSuccess } = useGetEntityHeaders(\n    rootEntityRefs,\n    { throwOnError: true },\n  )\n  if (\n    isSuccess &&\n    rootEntityHeadersPage &&\n    rootEntityHeadersPage.totalNumberOfResults == 0\n  ) {\n    const synapseIds = rootEntityRefs.map(ref => ref.targetId).join(',')\n    handleError(\n      `Unable to load provenance for the given Synapse IDs: ${synapseIds}`,\n    )\n  }\n  const rootEntityHeaders = rootEntityHeadersPage?.results\n  const [initializedPosition, setInitializedPosition] = useState<boolean>(false)\n\n  // Get the react flow instance so we attempt to properly center the view.\n  const reactFlowInstance = useReactFlow()\n\n  const onClickNode = useCallback((_event: MouseEvent, node: Node) => {\n    setClickedNode(node)\n  }, [])\n\n  /**\n   * Called when we have a new entity to add to the graph.  This will result in adding\n   * a new Entity Node to the nodesCopy, a link from the usedInActivity to the new Entity Node,\n   * AND it will look for an Activity associated with the new entity.  If an Activity is found,\n   * it will add an Expand Node for the user to click (to expand to see this Activity!).\n   * If this is a root node (starting entity node), then we automatically add the Activity Node\n   * and process it.\n   */\n  const addEntity = useCallback(\n    async (params: {\n      entityHeader: EntityHeader\n      usedInActivity?: Activity\n      nodesCopy: Node[]\n      edgesCopy: Edge[]\n    }) => {\n      const { entityHeader, nodesCopy, edgesCopy, usedInActivity } = params\n      addEntityNode({\n        entityHeader,\n        activity: usedInActivity,\n        nodesCopy,\n        edgesCopy,\n      })\n      //look for Activity\n      try {\n        const activity = await SynapseClient.getActivityForEntity(\n          entityHeader.id,\n          entityHeader.versionNumber,\n          accessToken,\n        )\n        // if this is not a root node (or there are too many items to show), add an expand node\n        if (\n          !isRootEntity({ entityHeader, rootEntityHeaders }) ||\n          (activity.used && activity.used.length >= MAX_ACTIVITY_EXPAND_NODES)\n        ) {\n          addExpandNode({\n            entityHeader,\n            itemCount: activity.used?.length,\n            nodesCopy,\n            edgesCopy,\n          })\n        }\n      } catch (e) {\n        // Activity is not accessible\n        console.error(e)\n        if (\n          isRootEntity({\n            entityHeader,\n            rootEntityHeaders,\n          })\n        ) {\n          // add provenance undefined node\n          addUndefinedNode({\n            entityHeader,\n            nodesCopy,\n            edgesCopy,\n          })\n        }\n      }\n    },\n    [accessToken, rootEntityHeaders],\n  )\n\n  /**\n   * This effect attempts to center the graph on one of the root nodes.\n   * Only initializes after after a root node has been added to the graph.\n   */\n  useEffect(() => {\n    if (!initializedPosition && nodes.length > 0) {\n      setTimeout(() => {\n        if (rootEntityHeaders) {\n          const rootEntityNode = findEntityNode(rootEntityHeaders[0], nodes)\n          if (rootEntityNode) {\n            const currentZoom = reactFlowInstance.getZoom()\n            const zoom = currentZoom > DEFAULT_ZOOM ? DEFAULT_ZOOM : currentZoom\n            reactFlowInstance?.setCenter(\n              rootEntityNode.position.x + 150,\n              rootEntityNode.position.y - 30,\n              { zoom, duration: 0 },\n            )\n          }\n          setInitializedPosition(true)\n        }\n      })\n    }\n  }, [initializedPosition, nodes, reactFlowInstance, rootEntityHeaders])\n\n  /**\n   * This is called when the user clicks on an Expand Node.  It will add the associated Activity\n   * and all \"used\" items (entities and urls) to the graph by adding items to the nodesCopy and edgesCopy arrays.\n   */\n  const onExpandEntity = useCallback(\n    async (params: {\n      entityHeader: EntityHeader\n      nodesCopy: Node[]\n      edgesCopy: Edge[]\n    }) => {\n      const { entityHeader, nodesCopy, edgesCopy } = params\n      try {\n        const activity = await SynapseClient.getActivityForEntity(\n          entityHeader.id,\n          entityHeader.versionNumber,\n          accessToken,\n        )\n        addActivityNode({\n          activity,\n          entityHeader,\n          nodesCopy,\n          edgesCopy,\n        })\n        // go through Activity.used array to add these nodes/edges\n        if (activity.used && activity.used.length < MAX_ACTIVITY_EXPAND_NODES) {\n          const usedEntityReferences: ReferenceList = []\n          activity.used.forEach((usedItem: Used) => {\n            if (usedItem.concreteType == USED_ENTITY_CONCRETE_TYPE_VALUE) {\n              usedEntityReferences.push((usedItem as UsedEntity).reference)\n            } else {\n              // UsedURL\n              const usedURL = usedItem as UsedURL\n              addExternalNode({ usedURL, activity, nodesCopy, edgesCopy })\n            }\n          })\n          const usedEntityHeadersPage = await SynapseClient.getEntityHeaders(\n            usedEntityReferences,\n            accessToken,\n          )\n          const { results: usedEntityHeaderPageResults } = usedEntityHeadersPage\n          // find refs that were not returned by the entity header call\n          const refsMissingEntityHeaders = usedEntityReferences.filter(ref => {\n            return (\n              usedEntityHeaderPageResults.find(header => {\n                return header.id == ref.targetId\n              }) == undefined\n            )\n          })\n          refsMissingEntityHeaders.forEach(ref => {\n            addEntityPlaceholderNode({ ref, activity, nodesCopy, edgesCopy })\n          })\n          const addEntityPromises: Promise<void>[] = []\n          usedEntityHeaderPageResults.forEach(header => {\n            addEntityPromises.push(\n              addEntity({\n                entityHeader: header,\n                nodesCopy,\n                edgesCopy,\n                usedInActivity: activity,\n              }),\n            )\n          })\n          await Promise.allSettled(addEntityPromises)\n        }\n      } catch (e) {\n        // Activity is not accessible\n        console.error(e)\n      }\n    },\n    [accessToken, addEntity],\n  )\n\n  /**\n   * This effect code executes when no nodes have been added.\n   * It will add the root nodes, and attempt to expand the root nodes.\n   */\n  useEffect(() => {\n    if (rootEntityHeaders && tempNodes.length == 0) {\n      const nodesCopy = [...tempNodes]\n      const edgesCopy = [...tempEdges]\n      const addAndExpandPromises: Promise<void>[] = []\n      rootEntityHeaders.forEach(header => {\n        const addEntityPromise = addEntity({\n          entityHeader: header,\n          nodesCopy,\n          edgesCopy,\n        })\n        addAndExpandPromises.push(addEntityPromise)\n\n        const expandEntityPromise = onExpandEntity({\n          entityHeader: header,\n          nodesCopy,\n          edgesCopy,\n        })\n        addAndExpandPromises.push(expandEntityPromise)\n      })\n      Promise.allSettled(addAndExpandPromises).finally(() => {\n        setTempNodes(nodesCopy)\n        setTempEdges(edgesCopy)\n      })\n    }\n  }, [\n    addEntity,\n    handleError,\n    onExpandEntity,\n    rootEntityHeaders,\n    rootEntityRefs,\n    tempEdges,\n    tempNodes,\n  ])\n\n  /**\n   * This effect code executes when a node is clicked.\n   * We check to see if it is an expand node.  If it is, then we remove the expand node (and associated edge)\n   * and ask for the Activity and associated \"used\" nodes (entities and URLs)\n   */\n  useEffect(() => {\n    const nodeData: ProvenanceNodeData = clickedNode?.data as ProvenanceNodeData\n    if (clickedNode && nodeData?.type == NodeType.EXPAND) {\n      const expandNodeDataProps = nodeData.props as ExpandGraphNodeDataProps\n      if (expandNodeDataProps.itemCount > MAX_ACTIVITY_EXPAND_NODES) {\n        displayToast(\n          'Web visualization does not support expanding this many items at this time.',\n          'danger',\n        )\n        return\n      } else {\n        // graph will be used outside of synapse, so show a non-branded spinner\n        nodeData.label = <CircularProgress size={30} />\n        // remove clicked node\n        const nodesWithoutExpandNode = tempNodes.filter(\n          node => node.id != clickedNode.id,\n        )\n        const edgeToRemove = getConnectedEdges([clickedNode], tempEdges)[0]\n        const edgesWithoutExpandEdge = tempEdges.filter(\n          edge => edge != edgeToRemove,\n        )\n        onExpandEntity({\n          entityHeader: expandNodeDataProps.entityHeader,\n          nodesCopy: nodesWithoutExpandNode,\n          edgesCopy: edgesWithoutExpandEdge,\n        }).finally(() => {\n          setTempNodes(nodesWithoutExpandNode)\n          setTempEdges(edgesWithoutExpandEdge)\n        })\n      }\n      setClickedNode(undefined)\n    }\n  }, [clickedNode, tempNodes, tempEdges, onExpandEntity])\n\n  /**\n   * This effect code is run when the graph nodes or edges change.\n   * It feeds the nodes and edges into our layout library to figure out where they should be positioned.\n   * The result is saved in the state variable \"nodes\" and \"edges\".\n   */\n  useEffect(() => {\n    const { nodes: layoutedNodes, edges: layoutedEdges } = getLayoutedElements(\n      tempNodes,\n      tempEdges,\n      'TB',\n    )\n    // hack: ProvenanceUtils.getProvenanceNode() returns a new object every time, so check to see if\n    // there were any real changes\n    if (!isArrayEqual(layoutedNodes, nodes)) {\n      setNodes(layoutedNodes)\n      if (onNodesChangedListener) {\n        onNodesChangedListener(layoutedNodes)\n      }\n    }\n    if (!isArrayEqual(layoutedEdges, edges)) {\n      setEdges(layoutedEdges)\n      if (onEdgesChangedListener) {\n        onEdgesChangedListener(layoutedEdges)\n      }\n    }\n  }, [\n    tempNodes,\n    tempEdges,\n    nodes,\n    edges,\n    setNodes,\n    setEdges,\n    initializedPosition,\n    reactFlowInstance,\n    rootEntityRefs,\n    onNodesChangedListener,\n    onEdgesChangedListener,\n  ])\n\n  const onPaneScrollFunction: (event?: WheelEvent) => void = useCallback(\n    event => {\n      // Cannot simply check the truthy value of event.deltaX (or Y) because the value might be 0 (or -0), which is falsy\n      if (\n        event &&\n        typeof event.deltaX !== 'undefined' &&\n        typeof event.deltaY !== 'undefined'\n      ) {\n        window.scrollTo(\n          window.scrollX + event.deltaX,\n          window.scrollY + event.deltaY,\n        )\n      }\n    },\n    [],\n  )\n  return (\n    <div\n      className=\"ProvenanceWidget\"\n      role=\"graphics-doc\" //https://www.w3.org/wiki/SVG_Accessibility/ARIA_roles_for_charts#Document_Roles\n      style={{ width: '100%', height: containerHeight }}\n    >\n      <ReactFlow\n        defaultViewport={{ x: 0, y: 0, zoom: DEFAULT_ZOOM }}\n        nodes={nodes}\n        edges={edges}\n        onNodeClick={onClickNode}\n        // onNodesChange={onNodesChange}  // SWC-6804: When the nodes/edges are updated (expanded) the graph is already re-rendered.\n        // onEdgesChange={onEdgesChange}  // Specifying these callbacks causes an infinite re-rendering loop.\n        attributionPosition=\"bottom-right\"\n        onConnect={undefined}\n        zoomOnScroll={false}\n        onPaneScroll={onPaneScrollFunction}\n      >\n        <Controls />\n      </ReactFlow>\n    </div>\n  )\n}\n\nconst ProvenanceGraph = (props: ProvenanceProps): React.ReactNode => {\n  return (\n    <SynapseErrorBoundary>\n      <ReactFlowProvider>\n        <ProvenanceReactFlow {...props} />\n      </ReactFlowProvider>\n    </SynapseErrorBoundary>\n  )\n}\n\nexport default ProvenanceGraph\n"],"mappings":"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"}
+{"version":3,"file":"ProvenanceGraph.js","names":[],"sources":["../../../src/components/ProvenanceGraph/ProvenanceGraph.tsx"],"sourcesContent":["import SynapseClient from '@/synapse-client'\nimport { useGetEntityHeaders } from '@/synapse-queries'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport { CircularProgress } from '@mui/material'\nimport {\n  Activity,\n  EntityHeader,\n  ReferenceList,\n  Used,\n  USED_ENTITY_CONCRETE_TYPE_VALUE,\n  UsedEntity,\n  UsedURL,\n} from '@sage-bionetworks/synapse-types'\nimport { MouseEvent, useCallback, useEffect, useState, WheelEvent } from 'react'\nimport { useErrorHandler } from 'react-error-boundary'\nimport ReactFlow, {\n  Controls,\n  Edge,\n  getConnectedEdges,\n  Node,\n  ReactFlowProvider,\n  useEdgesState,\n  useNodesState,\n  useReactFlow,\n} from 'reactflow'\nimport { SynapseErrorBoundary } from '../error/ErrorBanner'\nimport { displayToast } from '../ToastMessage/ToastMessage'\nimport { ExpandGraphNodeDataProps } from './ExpandGraphNodeLabel'\nimport {\n  addActivityNode,\n  addEntityNode,\n  addEntityPlaceholderNode,\n  addExpandNode,\n  addExternalNode,\n  addUndefinedNode,\n  findEntityNode,\n  isRootEntity,\n} from './ProvenanceGraphUtils'\nimport {\n  getLayoutedElements,\n  isArrayEqual,\n  NodeType,\n  ProvenanceNodeData,\n} from './ProvenanceUtils'\nimport 'reactflow/dist/style.css'\n\nexport type ProvenanceProps = {\n  // what entity nodes should we start with?\n  entityRefs: ReferenceList\n  containerHeight?: string\n  initialNodes?: Node[]\n  initialEdges?: Edge[]\n  onNodesChangedListener?: (nodes: Node[]) => void\n  onEdgesChangedListener?: (edges: Edge[]) => void\n}\n\nconst MAX_ACTIVITY_EXPAND_NODES = 400\nconst DEFAULT_ZOOM = 0.85\n\n/**\n * Renders a Provenance Graph for a set of entities.\n * New Nodes are added to tempNodes, and new Edges are added to tempEdges.\n * On change, these are fed into the dagre js graph library to figure out the node positions,\n * and the output stored in 'nodes' and 'edges'. The 'nodes' and 'edges' arrays are used by the\n * ReactFlow component.\n */\nconst ProvenanceReactFlow = (props: ProvenanceProps): React.ReactNode => {\n  const {\n    entityRefs: rootEntityRefs,\n    containerHeight = '200px',\n    initialNodes = [],\n    initialEdges = [],\n    onNodesChangedListener,\n    onEdgesChangedListener,\n  } = props\n  const { accessToken } = useSynapseContext()\n  const [tempNodes, setTempNodes] = useState<Node[]>(initialNodes)\n  const [tempEdges, setTempEdges] = useState<Edge[]>(initialEdges)\n  const [nodes, setNodes] = useNodesState([])\n  const [edges, setEdges] = useEdgesState([])\n  const [clickedNode, setClickedNode] = useState<Node>()\n  const handleError = useErrorHandler()\n\n  const { data: rootEntityHeadersPage, isSuccess } = useGetEntityHeaders(\n    rootEntityRefs,\n    { throwOnError: true },\n  )\n  if (\n    isSuccess &&\n    rootEntityHeadersPage &&\n    rootEntityHeadersPage.totalNumberOfResults == 0\n  ) {\n    const synapseIds = rootEntityRefs.map(ref => ref.targetId).join(',')\n    handleError(\n      `Unable to load provenance for the given Synapse IDs: ${synapseIds}`,\n    )\n  }\n  const rootEntityHeaders = rootEntityHeadersPage?.results\n  const [initializedPosition, setInitializedPosition] = useState<boolean>(false)\n\n  // Get the react flow instance so we attempt to properly center the view.\n  const reactFlowInstance = useReactFlow()\n\n  const onClickNode = useCallback((_event: MouseEvent, node: Node) => {\n    setClickedNode(node)\n  }, [])\n\n  /**\n   * Called when we have a new entity to add to the graph.  This will result in adding\n   * a new Entity Node to the nodesCopy, a link from the usedInActivity to the new Entity Node,\n   * AND it will look for an Activity associated with the new entity.  If an Activity is found,\n   * it will add an Expand Node for the user to click (to expand to see this Activity!).\n   * If this is a root node (starting entity node), then we automatically add the Activity Node\n   * and process it.\n   */\n  const addEntity = useCallback(\n    async (params: {\n      entityHeader: EntityHeader\n      usedInActivity?: Activity\n      nodesCopy: Node[]\n      edgesCopy: Edge[]\n    }) => {\n      const { entityHeader, nodesCopy, edgesCopy, usedInActivity } = params\n      addEntityNode({\n        entityHeader,\n        activity: usedInActivity,\n        nodesCopy,\n        edgesCopy,\n      })\n      //look for Activity\n      try {\n        const activity = await SynapseClient.getActivityForEntity(\n          entityHeader.id,\n          entityHeader.versionNumber,\n          accessToken,\n        )\n        // if this is not a root node (or there are too many items to show), add an expand node\n        if (\n          !isRootEntity({ entityHeader, rootEntityHeaders }) ||\n          (activity.used && activity.used.length >= MAX_ACTIVITY_EXPAND_NODES)\n        ) {\n          addExpandNode({\n            entityHeader,\n            itemCount: activity.used?.length,\n            nodesCopy,\n            edgesCopy,\n          })\n        }\n      } catch (e) {\n        // Activity is not accessible\n        console.error(e)\n        if (\n          isRootEntity({\n            entityHeader,\n            rootEntityHeaders,\n          })\n        ) {\n          // add provenance undefined node\n          addUndefinedNode({\n            entityHeader,\n            nodesCopy,\n            edgesCopy,\n          })\n        }\n      }\n    },\n    [accessToken, rootEntityHeaders],\n  )\n\n  /**\n   * This effect attempts to center the graph on one of the root nodes.\n   * Only initializes after after a root node has been added to the graph.\n   */\n  useEffect(() => {\n    if (!initializedPosition && nodes.length > 0) {\n      setTimeout(() => {\n        if (rootEntityHeaders) {\n          const rootEntityNode = findEntityNode(rootEntityHeaders[0], nodes)\n          if (rootEntityNode) {\n            const currentZoom = reactFlowInstance.getZoom()\n            const zoom = currentZoom > DEFAULT_ZOOM ? DEFAULT_ZOOM : currentZoom\n            reactFlowInstance?.setCenter(\n              rootEntityNode.position.x + 150,\n              rootEntityNode.position.y - 30,\n              { zoom, duration: 0 },\n            )\n          }\n          setInitializedPosition(true)\n        }\n      })\n    }\n  }, [initializedPosition, nodes, reactFlowInstance, rootEntityHeaders])\n\n  /**\n   * This is called when the user clicks on an Expand Node.  It will add the associated Activity\n   * and all \"used\" items (entities and urls) to the graph by adding items to the nodesCopy and edgesCopy arrays.\n   */\n  const onExpandEntity = useCallback(\n    async (params: {\n      entityHeader: EntityHeader\n      nodesCopy: Node[]\n      edgesCopy: Edge[]\n    }) => {\n      const { entityHeader, nodesCopy, edgesCopy } = params\n      try {\n        const activity = await SynapseClient.getActivityForEntity(\n          entityHeader.id,\n          entityHeader.versionNumber,\n          accessToken,\n        )\n        addActivityNode({\n          activity,\n          entityHeader,\n          nodesCopy,\n          edgesCopy,\n        })\n        // go through Activity.used array to add these nodes/edges\n        if (activity.used && activity.used.length < MAX_ACTIVITY_EXPAND_NODES) {\n          const usedEntityReferences: ReferenceList = []\n          activity.used.forEach((usedItem: Used) => {\n            if (usedItem.concreteType == USED_ENTITY_CONCRETE_TYPE_VALUE) {\n              usedEntityReferences.push((usedItem as UsedEntity).reference)\n            } else {\n              // UsedURL\n              const usedURL = usedItem as UsedURL\n              addExternalNode({ usedURL, activity, nodesCopy, edgesCopy })\n            }\n          })\n          const usedEntityHeadersPage = await SynapseClient.getEntityHeaders(\n            usedEntityReferences,\n            accessToken,\n          )\n          const { results: usedEntityHeaderPageResults } = usedEntityHeadersPage\n          // find refs that were not returned by the entity header call\n          const refsMissingEntityHeaders = usedEntityReferences.filter(ref => {\n            return (\n              usedEntityHeaderPageResults.find(header => {\n                return header.id == ref.targetId\n              }) == undefined\n            )\n          })\n          refsMissingEntityHeaders.forEach(ref => {\n            addEntityPlaceholderNode({ ref, activity, nodesCopy, edgesCopy })\n          })\n          const addEntityPromises: Promise<void>[] = []\n          usedEntityHeaderPageResults.forEach(header => {\n            addEntityPromises.push(\n              addEntity({\n                entityHeader: header,\n                nodesCopy,\n                edgesCopy,\n                usedInActivity: activity,\n              }),\n            )\n          })\n          await Promise.allSettled(addEntityPromises)\n        }\n      } catch (e) {\n        // Activity is not accessible\n        console.error(e)\n      }\n    },\n    [accessToken, addEntity],\n  )\n\n  /**\n   * This effect code executes when no nodes have been added.\n   * It will add the root nodes, and attempt to expand the root nodes.\n   */\n  useEffect(() => {\n    if (rootEntityHeaders && tempNodes.length == 0) {\n      const nodesCopy = [...tempNodes]\n      const edgesCopy = [...tempEdges]\n      const addAndExpandPromises: Promise<void>[] = []\n      rootEntityHeaders.forEach(header => {\n        const addEntityPromise = addEntity({\n          entityHeader: header,\n          nodesCopy,\n          edgesCopy,\n        })\n        addAndExpandPromises.push(addEntityPromise)\n\n        const expandEntityPromise = onExpandEntity({\n          entityHeader: header,\n          nodesCopy,\n          edgesCopy,\n        })\n        addAndExpandPromises.push(expandEntityPromise)\n      })\n      Promise.allSettled(addAndExpandPromises).finally(() => {\n        setTempNodes(nodesCopy)\n        setTempEdges(edgesCopy)\n      })\n    }\n  }, [\n    addEntity,\n    handleError,\n    onExpandEntity,\n    rootEntityHeaders,\n    rootEntityRefs,\n    tempEdges,\n    tempNodes,\n  ])\n\n  /**\n   * This effect code executes when a node is clicked.\n   * We check to see if it is an expand node.  If it is, then we remove the expand node (and associated edge)\n   * and ask for the Activity and associated \"used\" nodes (entities and URLs)\n   */\n  useEffect(() => {\n    const nodeData: ProvenanceNodeData = clickedNode?.data as ProvenanceNodeData\n    if (clickedNode && nodeData?.type == NodeType.EXPAND) {\n      const expandNodeDataProps = nodeData.props as ExpandGraphNodeDataProps\n      if (expandNodeDataProps.itemCount > MAX_ACTIVITY_EXPAND_NODES) {\n        displayToast(\n          'Web visualization does not support expanding this many items at this time.',\n          'danger',\n        )\n        return\n      } else {\n        // graph will be used outside of synapse, so show a non-branded spinner\n        nodeData.label = <CircularProgress size={30} />\n        // remove clicked node\n        const nodesWithoutExpandNode = tempNodes.filter(\n          node => node.id != clickedNode.id,\n        )\n        const edgeToRemove = getConnectedEdges([clickedNode], tempEdges)[0]\n        const edgesWithoutExpandEdge = tempEdges.filter(\n          edge => edge != edgeToRemove,\n        )\n        onExpandEntity({\n          entityHeader: expandNodeDataProps.entityHeader,\n          nodesCopy: nodesWithoutExpandNode,\n          edgesCopy: edgesWithoutExpandEdge,\n        }).finally(() => {\n          setTempNodes(nodesWithoutExpandNode)\n          setTempEdges(edgesWithoutExpandEdge)\n        })\n      }\n      setClickedNode(undefined)\n    }\n  }, [clickedNode, tempNodes, tempEdges, onExpandEntity])\n\n  /**\n   * This effect code is run when the graph nodes or edges change.\n   * It feeds the nodes and edges into our layout library to figure out where they should be positioned.\n   * The result is saved in the state variable \"nodes\" and \"edges\".\n   */\n  useEffect(() => {\n    const { nodes: layoutedNodes, edges: layoutedEdges } = getLayoutedElements(\n      tempNodes,\n      tempEdges,\n      'TB',\n    )\n    // hack: ProvenanceUtils.getProvenanceNode() returns a new object every time, so check to see if\n    // there were any real changes\n    if (!isArrayEqual(layoutedNodes, nodes)) {\n      setNodes(layoutedNodes)\n      if (onNodesChangedListener) {\n        onNodesChangedListener(layoutedNodes)\n      }\n    }\n    if (!isArrayEqual(layoutedEdges, edges)) {\n      setEdges(layoutedEdges)\n      if (onEdgesChangedListener) {\n        onEdgesChangedListener(layoutedEdges)\n      }\n    }\n  }, [\n    tempNodes,\n    tempEdges,\n    nodes,\n    edges,\n    setNodes,\n    setEdges,\n    initializedPosition,\n    reactFlowInstance,\n    rootEntityRefs,\n    onNodesChangedListener,\n    onEdgesChangedListener,\n  ])\n\n  const onPaneScrollFunction: (event?: WheelEvent) => void = useCallback(\n    event => {\n      // Cannot simply check the truthy value of event.deltaX (or Y) because the value might be 0 (or -0), which is falsy\n      if (\n        event &&\n        typeof event.deltaX !== 'undefined' &&\n        typeof event.deltaY !== 'undefined'\n      ) {\n        window.scrollTo(\n          window.scrollX + event.deltaX,\n          window.scrollY + event.deltaY,\n        )\n      }\n    },\n    [],\n  )\n  return (\n    <div\n      className=\"ProvenanceWidget\"\n      role=\"graphics-doc\" //https://www.w3.org/wiki/SVG_Accessibility/ARIA_roles_for_charts#Document_Roles\n      style={{ width: '100%', height: containerHeight }}\n    >\n      <ReactFlow\n        defaultViewport={{ x: 0, y: 0, zoom: DEFAULT_ZOOM }}\n        nodes={nodes}\n        edges={edges}\n        onNodeClick={onClickNode}\n        // onNodesChange={onNodesChange}  // SWC-6804: When the nodes/edges are updated (expanded) the graph is already re-rendered.\n        // onEdgesChange={onEdgesChange}  // Specifying these callbacks causes an infinite re-rendering loop.\n        attributionPosition=\"bottom-right\"\n        onConnect={undefined}\n        zoomOnScroll={false}\n        onPaneScroll={onPaneScrollFunction}\n      >\n        <Controls />\n      </ReactFlow>\n    </div>\n  )\n}\n\nconst ProvenanceGraph = (props: ProvenanceProps): React.ReactNode => {\n  return (\n    <SynapseErrorBoundary>\n      <ReactFlowProvider>\n        <ProvenanceReactFlow {...props} />\n      </ReactFlowProvider>\n    </SynapseErrorBoundary>\n  )\n}\n\nexport default ProvenanceGraph\n"],"mappings":"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"}

package/dist/components/ProvenanceGraph/ProvenanceGraphUtils.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProvenanceGraphUtils.js","names":[],"sources":["../../../src/components/ProvenanceGraph/ProvenanceGraphUtils.ts"],"sourcesContent":["import { Edge, Node } from 'reactflow'\nimport { EntityHeader, Reference } from '@sage-bionetworks/synapse-types'\nimport { Activity, UsedURL } from '@sage-bionetworks/synapse-types'\nimport {\n  getNodeId,\n  getProvenanceEdge,\n  getProvenanceNode,\n  NodeType,\n  ProvenanceNodeProps,\n} from './ProvenanceUtils'\n\n/**\n * Is one of the root Entities given by the user\n */\nexport const isRootEntity = (params: {\n  entityHeader: EntityHeader\n  rootEntityHeaders?: EntityHeader[]\n}) => {\n  const { entityHeader, rootEntityHeaders } = params\n  const foundNode = rootEntityHeaders?.find(header => {\n    return (\n      entityHeader.id == header.id &&\n      entityHeader.versionNumber == header.versionNumber\n    )\n  })\n  return foundNode !== undefined\n}\n\n/**\n * Given the node properties, will return true if this node is already in the nodesCopy array.\n */\nexport const isNodeNotFound = (\n  nodeProps: ProvenanceNodeProps,\n  nodesCopy: Node[],\n) => {\n  const foundNode = nodesCopy.find(node => {\n    return node.id === getNodeId(nodeProps)\n  })\n  return foundNode === undefined\n}\n\nexport const findEntityNode = (\n  entityHeader: EntityHeader,\n  nodesCopy: Node[],\n) => {\n  const nodeProps = {\n    type: NodeType.ENTITY,\n    data: entityHeader,\n  }\n  return nodesCopy.find(node => {\n    return node.id === getNodeId(nodeProps)\n  })\n}\n\n/**\n * Given the node properties, will return true if this edge is already in the edgesCopy array.\n */\nexport const isEdgeNotFound = (\n  nodeProps1: ProvenanceNodeProps,\n  nodeProps2: ProvenanceNodeProps,\n  edgesCopy: Edge[],\n) => {\n  const foundEdge = edgesCopy.find(edge => {\n    return (\n      edge.source === getNodeId(nodeProps1) &&\n      edge.target === getNodeId(nodeProps2)\n    )\n  })\n  return foundEdge === undefined\n}\n\n/**\n * Given node properties of the new node and existing node, this function creates and adds a new node to\n * nodesCopy, and creates an edge from the new node to the existing node.  Note, this will only create\n * a new node or edge if these items are not found in the input nodesCopy array and edgesCopy array.\n */\nexport const addNodeAndEdge = (params: {\n  newNodeProps: ProvenanceNodeProps\n  existingNodeProps: ProvenanceNodeProps\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { newNodeProps, existingNodeProps, nodesCopy, edgesCopy } = params\n  if (isNodeNotFound(newNodeProps, nodesCopy)) {\n    nodesCopy.push(getProvenanceNode(newNodeProps))\n  }\n  if (isEdgeNotFound(newNodeProps, existingNodeProps, edgesCopy)) {\n    edgesCopy.push(getProvenanceEdge(newNodeProps, existingNodeProps))\n  }\n}\n\nexport const addActivityNode = (params: {\n  activity: Activity\n  entityHeader: EntityHeader\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { activity, entityHeader, nodesCopy, edgesCopy } = params\n  const activityNodeProps = {\n    type: NodeType.ACTIVITY,\n    data: activity,\n  }\n  const entityNodeProps = {\n    type: NodeType.ENTITY,\n    data: entityHeader,\n  }\n  addNodeAndEdge({\n    newNodeProps: activityNodeProps,\n    existingNodeProps: entityNodeProps,\n    nodesCopy,\n    edgesCopy,\n  })\n}\n\nexport const addExpandNode = (params: {\n  entityHeader: EntityHeader\n  itemCount: number | undefined\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { entityHeader, itemCount = 0, nodesCopy, edgesCopy } = params\n  const expandNodeProps = {\n    type: NodeType.EXPAND,\n    data: {\n      itemCount,\n      entityHeader,\n    },\n  }\n  const entityNodeProps = {\n    type: NodeType.ENTITY,\n    data: entityHeader,\n  }\n  addNodeAndEdge({\n    newNodeProps: expandNodeProps,\n    existingNodeProps: entityNodeProps,\n    nodesCopy,\n    edgesCopy,\n  })\n}\n\nexport const addEntityPlaceholderNode = (params: {\n  ref: Reference\n  activity: Activity\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { ref, activity, nodesCopy, edgesCopy } = params\n  const entityPlaceholderNodeProps = {\n    type: NodeType.ENTITY_PLACEHOLDER,\n    data: ref,\n  }\n  const activityNodeProps = {\n    type: NodeType.ACTIVITY,\n    data: activity,\n  }\n  addNodeAndEdge({\n    newNodeProps: entityPlaceholderNodeProps,\n    existingNodeProps: activityNodeProps,\n    nodesCopy,\n    edgesCopy,\n  })\n}\n\nexport const addUndefinedNode = (params: {\n  entityHeader: EntityHeader\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { entityHeader, nodesCopy, edgesCopy } = params\n  const undefinedNodeProps = {\n    type: NodeType.UNDEFINED,\n    data: entityHeader,\n  }\n  const entityNodeProps = {\n    type: NodeType.ENTITY,\n    data: entityHeader,\n  }\n  addNodeAndEdge({\n    newNodeProps: undefinedNodeProps,\n    existingNodeProps: entityNodeProps,\n    nodesCopy,\n    edgesCopy,\n  })\n}\n\nexport const addExternalNode = (params: {\n  usedURL: UsedURL\n  activity: Activity\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { usedURL, activity, nodesCopy, edgesCopy } = params\n  const activityNodeProps = {\n    type: NodeType.ACTIVITY,\n    data: activity,\n  }\n  const externalNodeProps = {\n    type: NodeType.EXTERNAL,\n    data: usedURL,\n  }\n  addNodeAndEdge({\n    newNodeProps: externalNodeProps,\n    existingNodeProps: activityNodeProps,\n    nodesCopy,\n    edgesCopy,\n  })\n}\n\nexport const addEntityNode = (params: {\n  entityHeader: EntityHeader\n  activity: Activity | undefined\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { entityHeader, activity, nodesCopy, edgesCopy } = params\n  const entityNodeProps = {\n    type: NodeType.ENTITY,\n    data: entityHeader,\n  }\n  if (isNodeNotFound(entityNodeProps, nodesCopy)) {\n    // add the new entity node\n    nodesCopy.push(getProvenanceNode(entityNodeProps))\n    if (activity) {\n      const activityNodeProps = {\n        type: NodeType.ACTIVITY,\n        data: activity,\n      }\n      edgesCopy.push(getProvenanceEdge(entityNodeProps, activityNodeProps))\n    }\n  }\n}\n"],"mappings":";;AAcA,IAAa,KAAgB,MAGvB;CACJ,IAAM,EAAE,iBAAc,yBAAsB;AAO5C,QANkB,GAAmB,MAAK,MAEtC,EAAa,MAAM,EAAO,MAC1B,EAAa,iBAAiB,EAAO,cAEvC,KACmB,KAAA;GAMV,KACX,GACA,MAEkB,EAAU,MAAK,MACxB,EAAK,OAAO,EAAU,EAAU,CAElC,KAAc,KAAA,GAGV,KACX,GACA,MACG;CACH,IAAM,IAAY;EAChB,MAAM,EAAS;EACf,MAAM;EACP;AACD,QAAO,EAAU,MAAK,MACb,EAAK,OAAO,EAAU,EAAU,CACvC;GAMS,KACX,GACA,GACA,MAEkB,EAAU,MAAK,MAE7B,EAAK,WAAW,EAAU,EAAW,IACrC,EAAK,WAAW,EAAU,EAAW,CAGlC,KAAc,KAAA,GAQV,KAAkB,MAKzB;CACJ,IAAM,EAAE,iBAAc,sBAAmB,cAAW,iBAAc;AAIlE,CAHI,EAAe,GAAc,EAAU,IACzC,EAAU,KAAK,EAAkB,EAAa,CAAC,EAE7C,EAAe,GAAc,GAAmB,EAAU,IAC5D,EAAU,KAAK,EAAkB,GAAc,EAAkB,CAAC;GAIzD,KAAmB,MAK1B;CACJ,IAAM,EAAE,aAAU,iBAAc,cAAW,iBAAc;AASzD,GAAe;EACb,cAAc;GARd,MAAM,EAAS;GACf,MAAM;GAOQ;EACd,mBAAmB;GALnB,MAAM,EAAS;GACf,MAAM;GAIa;EACnB;EACA;EACD,CAAC;GAGS,KAAiB,MAKxB;CACJ,IAAM,EAAE,iBAAc,eAAY,GAAG,cAAW,iBAAc;AAY9D,GAAe;EACb,cAAc;GAXd,MAAM,EAAS;GACf,MAAM;IACJ;IACA;IACD;GAOa;EACd,mBAAmB;GALnB,MAAM,EAAS;GACf,MAAM;GAIa;EACnB;EACA;EACD,CAAC;GAGS,KAA4B,MAKnC;CACJ,IAAM,EAAE,QAAK,aAAU,cAAW,iBAAc;AAShD,GAAe;EACb,cAAc;GARd,MAAM,EAAS;GACf,MAAM;GAOQ;EACd,mBAAmB;GALnB,MAAM,EAAS;GACf,MAAM;GAIa;EACnB;EACA;EACD,CAAC;GAGS,KAAoB,MAI3B;CACJ,IAAM,EAAE,iBAAc,cAAW,iBAAc;AAS/C,GAAe;EACb,cAAc;GARd,MAAM,EAAS;GACf,MAAM;GAOQ;EACd,mBAAmB;GALnB,MAAM,EAAS;GACf,MAAM;GAIa;EACnB;EACA;EACD,CAAC;GAGS,KAAmB,MAK1B;CACJ,IAAM,EAAE,YAAS,aAAU,cAAW,iBAAc,GAC9C,IAAoB;EACxB,MAAM,EAAS;EACf,MAAM;EACP;AAKD,GAAe;EACb,cAAc;GAJd,MAAM,EAAS;GACf,MAAM;GAGQ;EACd,mBAAmB;EACnB;EACA;EACD,CAAC;GAGS,KAAiB,MAKxB;CACJ,IAAM,EAAE,iBAAc,aAAU,cAAW,iBAAc,GACnD,IAAkB;EACtB,MAAM,EAAS;EACf,MAAM;EACP;AACD,KAAI,EAAe,GAAiB,EAAU,KAE5C,EAAU,KAAK,EAAkB,EAAgB,CAAC,EAC9C,IAAU;EACZ,IAAM,IAAoB;GACxB,MAAM,EAAS;GACf,MAAM;GACP;AACD,IAAU,KAAK,EAAkB,GAAiB,EAAkB,CAAC"}
+{"version":3,"file":"ProvenanceGraphUtils.js","names":[],"sources":["../../../src/components/ProvenanceGraph/ProvenanceGraphUtils.ts"],"sourcesContent":["import { Edge, Node } from 'reactflow'\nimport { EntityHeader, Reference } from '@sage-bionetworks/synapse-types'\nimport { Activity, UsedURL } from '@sage-bionetworks/synapse-types'\nimport {\n  getNodeId,\n  getProvenanceEdge,\n  getProvenanceNode,\n  NodeType,\n  ProvenanceNodeProps,\n} from './ProvenanceUtils'\n\n/**\n * Is one of the root Entities given by the user\n */\nexport const isRootEntity = (params: {\n  entityHeader: EntityHeader\n  rootEntityHeaders?: EntityHeader[]\n}) => {\n  const { entityHeader, rootEntityHeaders } = params\n  const foundNode = rootEntityHeaders?.find(header => {\n    return (\n      entityHeader.id == header.id &&\n      entityHeader.versionNumber == header.versionNumber\n    )\n  })\n  return foundNode !== undefined\n}\n\n/**\n * Given the node properties, will return true if this node is already in the nodesCopy array.\n */\nexport const isNodeNotFound = (\n  nodeProps: ProvenanceNodeProps,\n  nodesCopy: Node[],\n) => {\n  const foundNode = nodesCopy.find(node => {\n    return node.id === getNodeId(nodeProps)\n  })\n  return foundNode === undefined\n}\n\nexport const findEntityNode = (\n  entityHeader: EntityHeader,\n  nodesCopy: Node[],\n) => {\n  const nodeProps = {\n    type: NodeType.ENTITY,\n    data: entityHeader,\n  }\n  return nodesCopy.find(node => {\n    return node.id === getNodeId(nodeProps)\n  })\n}\n\n/**\n * Given the node properties, will return true if this edge is already in the edgesCopy array.\n */\nexport const isEdgeNotFound = (\n  nodeProps1: ProvenanceNodeProps,\n  nodeProps2: ProvenanceNodeProps,\n  edgesCopy: Edge[],\n) => {\n  const foundEdge = edgesCopy.find(edge => {\n    return (\n      edge.source === getNodeId(nodeProps1) &&\n      edge.target === getNodeId(nodeProps2)\n    )\n  })\n  return foundEdge === undefined\n}\n\n/**\n * Given node properties of the new node and existing node, this function creates and adds a new node to\n * nodesCopy, and creates an edge from the new node to the existing node.  Note, this will only create\n * a new node or edge if these items are not found in the input nodesCopy array and edgesCopy array.\n */\nexport const addNodeAndEdge = (params: {\n  newNodeProps: ProvenanceNodeProps\n  existingNodeProps: ProvenanceNodeProps\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { newNodeProps, existingNodeProps, nodesCopy, edgesCopy } = params\n  if (isNodeNotFound(newNodeProps, nodesCopy)) {\n    nodesCopy.push(getProvenanceNode(newNodeProps))\n  }\n  if (isEdgeNotFound(newNodeProps, existingNodeProps, edgesCopy)) {\n    edgesCopy.push(getProvenanceEdge(newNodeProps, existingNodeProps))\n  }\n}\n\nexport const addActivityNode = (params: {\n  activity: Activity\n  entityHeader: EntityHeader\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { activity, entityHeader, nodesCopy, edgesCopy } = params\n  const activityNodeProps = {\n    type: NodeType.ACTIVITY,\n    data: activity,\n  }\n  const entityNodeProps = {\n    type: NodeType.ENTITY,\n    data: entityHeader,\n  }\n  addNodeAndEdge({\n    newNodeProps: activityNodeProps,\n    existingNodeProps: entityNodeProps,\n    nodesCopy,\n    edgesCopy,\n  })\n}\n\nexport const addExpandNode = (params: {\n  entityHeader: EntityHeader\n  itemCount: number | undefined\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { entityHeader, itemCount = 0, nodesCopy, edgesCopy } = params\n  const expandNodeProps = {\n    type: NodeType.EXPAND,\n    data: {\n      itemCount,\n      entityHeader,\n    },\n  }\n  const entityNodeProps = {\n    type: NodeType.ENTITY,\n    data: entityHeader,\n  }\n  addNodeAndEdge({\n    newNodeProps: expandNodeProps,\n    existingNodeProps: entityNodeProps,\n    nodesCopy,\n    edgesCopy,\n  })\n}\n\nexport const addEntityPlaceholderNode = (params: {\n  ref: Reference\n  activity: Activity\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { ref, activity, nodesCopy, edgesCopy } = params\n  const entityPlaceholderNodeProps = {\n    type: NodeType.ENTITY_PLACEHOLDER,\n    data: ref,\n  }\n  const activityNodeProps = {\n    type: NodeType.ACTIVITY,\n    data: activity,\n  }\n  addNodeAndEdge({\n    newNodeProps: entityPlaceholderNodeProps,\n    existingNodeProps: activityNodeProps,\n    nodesCopy,\n    edgesCopy,\n  })\n}\n\nexport const addUndefinedNode = (params: {\n  entityHeader: EntityHeader\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { entityHeader, nodesCopy, edgesCopy } = params\n  const undefinedNodeProps = {\n    type: NodeType.UNDEFINED,\n    data: entityHeader,\n  }\n  const entityNodeProps = {\n    type: NodeType.ENTITY,\n    data: entityHeader,\n  }\n  addNodeAndEdge({\n    newNodeProps: undefinedNodeProps,\n    existingNodeProps: entityNodeProps,\n    nodesCopy,\n    edgesCopy,\n  })\n}\n\nexport const addExternalNode = (params: {\n  usedURL: UsedURL\n  activity: Activity\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { usedURL, activity, nodesCopy, edgesCopy } = params\n  const activityNodeProps = {\n    type: NodeType.ACTIVITY,\n    data: activity,\n  }\n  const externalNodeProps = {\n    type: NodeType.EXTERNAL,\n    data: usedURL,\n  }\n  addNodeAndEdge({\n    newNodeProps: externalNodeProps,\n    existingNodeProps: activityNodeProps,\n    nodesCopy,\n    edgesCopy,\n  })\n}\n\nexport const addEntityNode = (params: {\n  entityHeader: EntityHeader\n  activity: Activity | undefined\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { entityHeader, activity, nodesCopy, edgesCopy } = params\n  const entityNodeProps = {\n    type: NodeType.ENTITY,\n    data: entityHeader,\n  }\n  if (isNodeNotFound(entityNodeProps, nodesCopy)) {\n    // add the new entity node\n    nodesCopy.push(getProvenanceNode(entityNodeProps))\n    if (activity) {\n      const activityNodeProps = {\n        type: NodeType.ACTIVITY,\n        data: activity,\n      }\n      edgesCopy.push(getProvenanceEdge(entityNodeProps, activityNodeProps))\n    }\n  }\n}\n"],"mappings":";;AAcA,IAAa,KAAgB,MAGvB;CACJ,IAAM,EAAE,iBAAc,yBAAsB;CAO5C,OANkB,GAAmB,MAAK,MAEtC,EAAa,MAAM,EAAO,MAC1B,EAAa,iBAAiB,EAAO,aAExC,MACoB,KAAA;AACvB,GAKa,KACX,GACA,MAEkB,EAAU,MAAK,MACxB,EAAK,OAAO,EAAU,CAAS,CAEjC,MAAc,KAAA,GAGV,KACX,GACA,MACG;CACH,IAAM,IAAY;EAChB,MAAM,EAAS;EACf,MAAM;CACR;CACA,OAAO,EAAU,MAAK,MACb,EAAK,OAAO,EAAU,CAAS,CACvC;AACH,GAKa,KACX,GACA,GACA,MAEkB,EAAU,MAAK,MAE7B,EAAK,WAAW,EAAU,CAAU,KACpC,EAAK,WAAW,EAAU,CAAU,CAGjC,MAAc,KAAA,GAQV,KAAkB,MAKzB;CACJ,IAAM,EAAE,iBAAc,sBAAmB,cAAW,iBAAc;CAIlE,AAHI,EAAe,GAAc,CAAS,KACxC,EAAU,KAAK,EAAkB,CAAY,CAAC,GAE5C,EAAe,GAAc,GAAmB,CAAS,KAC3D,EAAU,KAAK,EAAkB,GAAc,CAAiB,CAAC;AAErE,GAEa,KAAmB,MAK1B;CACJ,IAAM,EAAE,aAAU,iBAAc,cAAW,iBAAc;CASzD,EAAe;EACb,cAAc;GARd,MAAM,EAAS;GACf,MAAM;EAOQ;EACd,mBAAmB;GALnB,MAAM,EAAS;GACf,MAAM;EAIa;EACnB;EACA;CACF,CAAC;AACH,GAEa,KAAiB,MAKxB;CACJ,IAAM,EAAE,iBAAc,eAAY,GAAG,cAAW,iBAAc;CAY9D,EAAe;EACb,cAAc;GAXd,MAAM,EAAS;GACf,MAAM;IACJ;IACA;GACF;EAOc;EACd,mBAAmB;GALnB,MAAM,EAAS;GACf,MAAM;EAIa;EACnB;EACA;CACF,CAAC;AACH,GAEa,KAA4B,MAKnC;CACJ,IAAM,EAAE,QAAK,aAAU,cAAW,iBAAc;CAShD,EAAe;EACb,cAAc;GARd,MAAM,EAAS;GACf,MAAM;EAOQ;EACd,mBAAmB;GALnB,MAAM,EAAS;GACf,MAAM;EAIa;EACnB;EACA;CACF,CAAC;AACH,GAEa,KAAoB,MAI3B;CACJ,IAAM,EAAE,iBAAc,cAAW,iBAAc;CAS/C,EAAe;EACb,cAAc;GARd,MAAM,EAAS;GACf,MAAM;EAOQ;EACd,mBAAmB;GALnB,MAAM,EAAS;GACf,MAAM;EAIa;EACnB;EACA;CACF,CAAC;AACH,GAEa,KAAmB,MAK1B;CACJ,IAAM,EAAE,YAAS,aAAU,cAAW,iBAAc,GAC9C,IAAoB;EACxB,MAAM,EAAS;EACf,MAAM;CACR;CAKA,EAAe;EACb,cAAc;GAJd,MAAM,EAAS;GACf,MAAM;EAGQ;EACd,mBAAmB;EACnB;EACA;CACF,CAAC;AACH,GAEa,KAAiB,MAKxB;CACJ,IAAM,EAAE,iBAAc,aAAU,cAAW,iBAAc,GACnD,IAAkB;EACtB,MAAM,EAAS;EACf,MAAM;CACR;CACA,IAAI,EAAe,GAAiB,CAAS,MAE3C,EAAU,KAAK,EAAkB,CAAe,CAAC,GAC7C,IAAU;EACZ,IAAM,IAAoB;GACxB,MAAM,EAAS;GACf,MAAM;EACR;EACA,EAAU,KAAK,EAAkB,GAAiB,CAAiB,CAAC;CACtE;AAEJ"}