synapse-react-client 4.0.19 → 4.0.21

package/dist/components/styled/LeftRightPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"LeftRightPanel.js","names":[],"sources":["../../../src/components/styled/LeftRightPanel.tsx"],"sourcesContent":["import { Box, BoxProps, Paper, PaperProps, styled } from '@mui/material'\nimport { StyledComponent } from '@emotion/styled'\nimport { ReactNode } from 'react'\n\nexport const StyledOuterContainer: StyledComponent<BoxProps> = styled(Box, {\n  label: 'StyledOuterContainer',\n})(({ theme }) => ({\n  minHeight: '100vh',\n  paddingTop: '50px',\n  paddingBottom: '50px',\n  background: theme.styledBackground,\n  backgroundSize: 'cover',\n  [theme.breakpoints.down('md')]: {\n    padding: 0,\n  },\n}))\n\nexport const StyledInnerContainer: StyledComponent<PaperProps> = styled(Paper, {\n  label: 'StyledInnerContainer',\n})(({ theme }) => ({\n  width: '900px',\n  minHeight: '675px',\n  margin: '0 auto',\n  display: 'flex',\n  '& > div:nth-of-type(1), & > div:nth-of-type(2)': {\n    borderRadius: 'inherit',\n    width: '450px',\n  },\n  '& > div:nth-of-type(1)': {\n    backgroundColor: theme.palette.background.paper,\n  },\n  '& > div:nth-of-type(2)': {\n    backgroundColor: theme.palette.grey[200],\n  },\n}))\n\ntype LeftRightPanelProps = {\n  leftContent: ReactNode\n  rightContent: ReactNode\n  className?: string\n}\n\nexport function LeftRightPanel({\n  leftContent,\n  rightContent,\n  className,\n}: LeftRightPanelProps) {\n  return (\n    <StyledOuterContainer className={className}>\n      <StyledInnerContainer>\n        <Box>{leftContent}</Box>\n        <Box>{rightContent}</Box>\n      </StyledInnerContainer>\n    </StyledOuterContainer>\n  )\n}\n"],"mappings":";;;AAIA,IAAa,IAAkD,EAAO,GAAK,EACzE,OAAO,wBACR,CAAC,EAAE,EAAE,gBAAa;CACjB,WAAW;CACX,YAAY;CACZ,eAAe;CACf,YAAY,EAAM;CAClB,gBAAgB;EACf,EAAM,YAAY,KAAK,KAAK,GAAG,EAC9B,SAAS,GACV;CACF,EAAE,EAEU,IAAoD,EAAO,GAAO,EAC7E,OAAO,wBACR,CAAC,EAAE,EAAE,gBAAa;CACjB,OAAO;CACP,WAAW;CACX,QAAQ;CACR,SAAS;CACT,kDAAkD;EAChD,cAAc;EACd,OAAO;EACR;CACD,0BAA0B,EACxB,iBAAiB,EAAM,QAAQ,WAAW,OAC3C;CACD,0BAA0B,EACxB,iBAAiB,EAAM,QAAQ,KAAK,MACrC;CACF,EAAE;AAQH,SAAgB,EAAe,EAC7B,gBACA,iBACA,gBACsB;AACtB,QACE,kBAAC,GAAD;EAAiC;YAC/B,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD,EAAA,UAAM,GAAkB,CAAA,EACxB,kBAAC,GAAD,EAAA,UAAM,GAAmB,CAAA,CACJ,EAAA,CAAA;EACF,CAAA"}
+{"version":3,"file":"LeftRightPanel.js","names":[],"sources":["../../../src/components/styled/LeftRightPanel.tsx"],"sourcesContent":["import { Box, BoxProps, Paper, PaperProps, styled } from '@mui/material'\nimport { StyledComponent } from '@emotion/styled'\nimport { ReactNode } from 'react'\n\nexport const StyledOuterContainer: StyledComponent<BoxProps> = styled(Box, {\n  label: 'StyledOuterContainer',\n})(({ theme }) => ({\n  minHeight: '100vh',\n  paddingTop: '50px',\n  paddingBottom: '50px',\n  background: theme.styledBackground,\n  backgroundSize: 'cover',\n  [theme.breakpoints.down('md')]: {\n    padding: 0,\n  },\n}))\n\nexport const StyledInnerContainer: StyledComponent<PaperProps> = styled(Paper, {\n  label: 'StyledInnerContainer',\n})(({ theme }) => ({\n  width: '900px',\n  minHeight: '675px',\n  margin: '0 auto',\n  display: 'flex',\n  '& > div:nth-of-type(1), & > div:nth-of-type(2)': {\n    borderRadius: 'inherit',\n    width: '450px',\n  },\n  '& > div:nth-of-type(1)': {\n    backgroundColor: theme.palette.background.paper,\n  },\n  '& > div:nth-of-type(2)': {\n    backgroundColor: theme.palette.grey[200],\n  },\n}))\n\ntype LeftRightPanelProps = {\n  leftContent: ReactNode\n  rightContent: ReactNode\n  className?: string\n}\n\nexport function LeftRightPanel({\n  leftContent,\n  rightContent,\n  className,\n}: LeftRightPanelProps) {\n  return (\n    <StyledOuterContainer className={className}>\n      <StyledInnerContainer>\n        <Box>{leftContent}</Box>\n        <Box>{rightContent}</Box>\n      </StyledInnerContainer>\n    </StyledOuterContainer>\n  )\n}\n"],"mappings":";;;AAIA,IAAa,IAAkD,EAAO,GAAK,EACzE,OAAO,uBACT,CAAC,GAAG,EAAE,gBAAa;CACjB,WAAW;CACX,YAAY;CACZ,eAAe;CACf,YAAY,EAAM;CAClB,gBAAgB;EACf,EAAM,YAAY,KAAK,IAAI,IAAI,EAC9B,SAAS,EACX;AACF,EAAE,GAEW,IAAoD,EAAO,GAAO,EAC7E,OAAO,uBACT,CAAC,GAAG,EAAE,gBAAa;CACjB,OAAO;CACP,WAAW;CACX,QAAQ;CACR,SAAS;CACT,kDAAkD;EAChD,cAAc;EACd,OAAO;CACT;CACA,0BAA0B,EACxB,iBAAiB,EAAM,QAAQ,WAAW,MAC5C;CACA,0BAA0B,EACxB,iBAAiB,EAAM,QAAQ,KAAK,KACtC;AACF,EAAE;AAQF,SAAgB,EAAe,EAC7B,gBACA,iBACA,gBACsB;CACtB,OACE,kBAAC,GAAD;EAAiC;YAC/B,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD,EAAA,UAAM,EAAiB,CAAA,GACvB,kBAAC,GAAD,EAAA,UAAM,EAAkB,CAAA,CACJ,EAAA,CAAA;CACF,CAAA;AAE1B"}

package/dist/components/styled/LightTooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"LightTooltip.js","names":[],"sources":["../../../src/components/styled/LightTooltip.tsx"],"sourcesContent":["import {\n  Tooltip,\n  TooltipProps,\n  tooltipClasses,\n  styled,\n  linkClasses,\n} from '@mui/material'\nimport { StyledComponent } from '@emotion/styled'\n\nexport const LightTooltip: StyledComponent<TooltipProps> = styled(\n  ({ className, ...props }: TooltipProps) => (\n    <Tooltip {...props} classes={{ popper: className }} />\n  ),\n)(({ theme }) => ({\n  [`& .${tooltipClasses.tooltip}`]: {\n    backgroundColor: theme.palette.background.paper,\n    color: theme.palette.grey[1000],\n    boxShadow: theme.shadows[1],\n    border: `1px solid ${theme.palette.grey[500]}`,\n  },\n  [`& .${tooltipClasses.arrow}`]: {\n    '&:before': {\n      boxShadow: theme.shadows[1],\n      border: `1px solid ${theme.palette.grey[500]}`,\n    },\n    color: theme.palette.background.paper,\n  },\n  [`& .${tooltipClasses.tooltip} .${linkClasses.root}`]: {\n    color: `${theme.palette.primary.main}`,\n  },\n}))\n\nexport default LightTooltip\n"],"mappings":";;;AASA,IAAa,IAA8C,GACxD,EAAE,cAAW,GAAG,QACf,kBAAC,GAAD;CAAS,GAAI;CAAO,SAAS,EAAE,QAAQ,GAAW;CAAI,CAAA,CAEzD,EAAE,EAAE,gBAAa;EACf,MAAM,EAAe,YAAY;EAChC,iBAAiB,EAAM,QAAQ,WAAW;EAC1C,OAAO,EAAM,QAAQ,KAAK;EAC1B,WAAW,EAAM,QAAQ;EACzB,QAAQ,aAAa,EAAM,QAAQ,KAAK;EACzC;EACA,MAAM,EAAe,UAAU;EAC9B,YAAY;GACV,WAAW,EAAM,QAAQ;GACzB,QAAQ,aAAa,EAAM,QAAQ,KAAK;GACzC;EACD,OAAO,EAAM,QAAQ,WAAW;EACjC;EACA,MAAM,EAAe,QAAQ,IAAI,EAAY,SAAS,EACrD,OAAO,GAAG,EAAM,QAAQ,QAAQ,QACjC;CACF,EAAE"}
+{"version":3,"file":"LightTooltip.js","names":[],"sources":["../../../src/components/styled/LightTooltip.tsx"],"sourcesContent":["import {\n  Tooltip,\n  TooltipProps,\n  tooltipClasses,\n  styled,\n  linkClasses,\n} from '@mui/material'\nimport { StyledComponent } from '@emotion/styled'\n\nexport const LightTooltip: StyledComponent<TooltipProps> = styled(\n  ({ className, ...props }: TooltipProps) => (\n    <Tooltip {...props} classes={{ popper: className }} />\n  ),\n)(({ theme }) => ({\n  [`& .${tooltipClasses.tooltip}`]: {\n    backgroundColor: theme.palette.background.paper,\n    color: theme.palette.grey[1000],\n    boxShadow: theme.shadows[1],\n    border: `1px solid ${theme.palette.grey[500]}`,\n  },\n  [`& .${tooltipClasses.arrow}`]: {\n    '&:before': {\n      boxShadow: theme.shadows[1],\n      border: `1px solid ${theme.palette.grey[500]}`,\n    },\n    color: theme.palette.background.paper,\n  },\n  [`& .${tooltipClasses.tooltip} .${linkClasses.root}`]: {\n    color: `${theme.palette.primary.main}`,\n  },\n}))\n\nexport default LightTooltip\n"],"mappings":";;;AASA,IAAa,IAA8C,GACxD,EAAE,cAAW,GAAG,QACf,kBAAC,GAAD;CAAS,GAAI;CAAO,SAAS,EAAE,QAAQ,EAAU;AAAI,CAAA,CAEzD,GAAG,EAAE,gBAAa;EACf,MAAM,EAAe,YAAY;EAChC,iBAAiB,EAAM,QAAQ,WAAW;EAC1C,OAAO,EAAM,QAAQ,KAAK;EAC1B,WAAW,EAAM,QAAQ;EACzB,QAAQ,aAAa,EAAM,QAAQ,KAAK;CAC1C;EACC,MAAM,EAAe,UAAU;EAC9B,YAAY;GACV,WAAW,EAAM,QAAQ;GACzB,QAAQ,aAAa,EAAM,QAAQ,KAAK;EAC1C;EACA,OAAO,EAAM,QAAQ,WAAW;CAClC;EACC,MAAM,EAAe,QAAQ,IAAI,EAAY,SAAS,EACrD,OAAO,GAAG,EAAM,QAAQ,QAAQ,OAClC;AACF,EAAE"}

package/dist/components/styled/StyledFormControl.js.map

@@ -1 +1 @@
-{"version":3,"file":"StyledFormControl.js","names":[],"sources":["../../../src/components/styled/StyledFormControl.tsx"],"sourcesContent":["import {\n  FormControl,\n  FormControlProps,\n  formHelperTextClasses,\n  inputBaseClasses,\n  styled,\n} from '@mui/material'\nimport { StyledComponent } from '@emotion/styled'\n\n/**\n * Provides bootstrap-like label/text inputs for a MUI FormControl.\n *\n * This should not be used with components that provide their own FormControl, such as TextField.\n *\n * @example\n * ```tsx\n *       <StyledFormControl fullWidth variant=\"standard\" margin=\"normal\">\n *         <InputLabel shrink htmlFor=\"someinput\">\n *           labelText\n *         </InputLabel>\n *         <InputBase id=\"someinput\"/>\n *       </StyledFormControl>\n * ```\n */\nexport const StyledFormControl: StyledComponent<FormControlProps> = styled(\n  FormControl,\n  {\n    label: 'StyledFormControl',\n  },\n)(({ theme }) => ({\n  '& label': {\n    position: 'static',\n    fontSize: '14px',\n    transform: 'none',\n  },\n  [`& .${formHelperTextClasses.root}`]: {\n    marginLeft: '0',\n    [`&.Mui-error`]: {\n      color: '#c13415',\n    },\n  },\n\n  [`& .${inputBaseClasses.root}`]: {\n    marginTop: theme.spacing(0.5),\n  },\n  '& .MuiInputBase-multiline': {\n    padding: '0px',\n  },\n  '& fieldset': {\n    border: 'none',\n  },\n}))\n\nexport default StyledFormControl\n"],"mappings":";;AAwBA,IAAa,IAAuD,EAClE,GACA,EACE,OAAO,qBACR,CACF,EAAE,EAAE,gBAAa;CAChB,WAAW;EACT,UAAU;EACV,UAAU;EACV,WAAW;EACZ;EACA,MAAM,EAAsB,SAAS;EACpC,YAAY;EACX,eAAgB,EACf,OAAO,WACR;EACF;EAEA,MAAM,EAAiB,SAAS,EAC/B,WAAW,EAAM,QAAQ,GAAI,EAC9B;CACD,6BAA6B,EAC3B,SAAS,OACV;CACD,cAAc,EACZ,QAAQ,QACT;CACF,EAAE"}
+{"version":3,"file":"StyledFormControl.js","names":[],"sources":["../../../src/components/styled/StyledFormControl.tsx"],"sourcesContent":["import {\n  FormControl,\n  FormControlProps,\n  formHelperTextClasses,\n  inputBaseClasses,\n  styled,\n} from '@mui/material'\nimport { StyledComponent } from '@emotion/styled'\n\n/**\n * Provides bootstrap-like label/text inputs for a MUI FormControl.\n *\n * This should not be used with components that provide their own FormControl, such as TextField.\n *\n * @example\n * ```tsx\n *       <StyledFormControl fullWidth variant=\"standard\" margin=\"normal\">\n *         <InputLabel shrink htmlFor=\"someinput\">\n *           labelText\n *         </InputLabel>\n *         <InputBase id=\"someinput\"/>\n *       </StyledFormControl>\n * ```\n */\nexport const StyledFormControl: StyledComponent<FormControlProps> = styled(\n  FormControl,\n  {\n    label: 'StyledFormControl',\n  },\n)(({ theme }) => ({\n  '& label': {\n    position: 'static',\n    fontSize: '14px',\n    transform: 'none',\n  },\n  [`& .${formHelperTextClasses.root}`]: {\n    marginLeft: '0',\n    [`&.Mui-error`]: {\n      color: '#c13415',\n    },\n  },\n\n  [`& .${inputBaseClasses.root}`]: {\n    marginTop: theme.spacing(0.5),\n  },\n  '& .MuiInputBase-multiline': {\n    padding: '0px',\n  },\n  '& fieldset': {\n    border: 'none',\n  },\n}))\n\nexport default StyledFormControl\n"],"mappings":";;AAwBA,IAAa,IAAuD,EAClE,GACA,EACE,OAAO,oBACT,CACF,GAAG,EAAE,gBAAa;CAChB,WAAW;EACT,UAAU;EACV,UAAU;EACV,WAAW;CACb;EACC,MAAM,EAAsB,SAAS;EACpC,YAAY;EACX,eAAgB,EACf,OAAO,UACT;CACF;EAEC,MAAM,EAAiB,SAAS,EAC/B,WAAW,EAAM,QAAQ,EAAG,EAC9B;CACA,6BAA6B,EAC3B,SAAS,MACX;CACA,cAAc,EACZ,QAAQ,OACV;AACF,EAAE"}

package/dist/components/styled/StyledPopover.js.map

@@ -1 +1 @@
-{"version":3,"file":"StyledPopover.js","names":[],"sources":["../../../src/components/styled/StyledPopover.tsx"],"sourcesContent":["import LightTooltip from '@/components/styled/LightTooltip'\nimport { spreadSx } from '@/theme/spreadSx'\nimport {\n  Box,\n  Button,\n  ButtonProps,\n  SxProps,\n  tooltipClasses,\n  TooltipProps,\n} from '@mui/material'\nimport { atom, useAtom } from 'jotai'\nimport { PropsWithChildren, ReactNode, useId } from 'react'\n\nexport type StyledPopoverProps = PropsWithChildren<{\n  popoverContent: React.ReactNode\n  sx?: TooltipProps['sx']\n  placement?: TooltipProps['placement']\n  showCloseButton?: boolean\n  actionButton?: {\n    content: ReactNode\n    color?: ButtonProps['color']\n    variant?: ButtonProps['variant']\n    onClick: () => void\n    closePopoverOnClick?: boolean\n  }\n  maxWidth?: string\n  minWidth?: string\n  containerSx?: SxProps\n}>\n\nconst buttonBoxSx: SxProps = {\n  mt: 2,\n  display: 'flex',\n  justifyContent: 'space-between',\n  flexDirection: 'row-reverse',\n  '> button': {\n    flexGrow: 1,\n    maxWidth: '45%',\n  },\n}\n\n// Register a global atom to track which popover is open, to ensure only one is shown at any given time\nconst openMarkdownPopoverAtom = atom<string | null>(null)\n\nexport function StyledPopover({\n  children,\n  popoverContent,\n  placement = 'bottom-start',\n  showCloseButton = true,\n  actionButton,\n  sx,\n  maxWidth = '500px',\n  minWidth = '300px',\n  containerSx,\n}: StyledPopoverProps) {\n  const id = useId()\n  const [openMarkdownPopoverId, setOpenMarkdownPopoverId] = useAtom(\n    openMarkdownPopoverAtom,\n  )\n\n  const show = openMarkdownPopoverId === id\n\n  const content = (\n    <Box sx={{ padding: '20px' }}>\n      {popoverContent}\n      <Box sx={buttonBoxSx}>\n        {actionButton && (\n          <Button\n            color={actionButton.color || 'primary'}\n            variant={actionButton.variant || 'contained'}\n            onClick={() => {\n              actionButton.onClick()\n              if (actionButton.closePopoverOnClick) {\n                setOpenMarkdownPopoverId(null)\n              }\n            }}\n          >\n            {actionButton.content}\n          </Button>\n        )}\n        {showCloseButton && (\n          <Button\n            variant=\"outlined\"\n            onClick={() => setOpenMarkdownPopoverId(null)}\n          >\n            Close\n          </Button>\n        )}\n      </Box>\n    </Box>\n  )\n\n  return (\n    <LightTooltip\n      title={content}\n      placement={placement}\n      open={show}\n      sx={spreadSx(sx, {\n        [`& .${tooltipClasses.tooltip}`]: {\n          maxWidth: { maxWidth },\n          minWidth: { minWidth },\n        },\n      })}\n    >\n      <Box\n        role=\"button\"\n        className={'PopoverContainer'}\n        onClick={e => {\n          // Prevent the default action of the click event -- for example, if this is in a `label` tag for a checkbox,\n          // prevent the click from toggling the checkbox value\n          e.preventDefault()\n          // Prevent the click from propagating to the parent container\n          e.stopPropagation()\n          setOpenMarkdownPopoverId(currentId => (currentId == id ? null : id))\n        }}\n        sx={{ display: 'inline-block', cursor: 'pointer', ...containerSx }}\n      >\n        {children}\n      </Box>\n    </LightTooltip>\n  )\n}\n"],"mappings":";;;;;;;AA8BA,IAAM,IAAuB;CAC3B,IAAI;CACJ,SAAS;CACT,gBAAgB;CAChB,eAAe;CACf,YAAY;EACV,UAAU;EACV,UAAU;EACX;CACF,EAGK,IAA0B,EAAoB,KAAK;AAEzD,SAAgB,EAAc,EAC5B,aACA,mBACA,eAAY,gBACZ,qBAAkB,IAClB,iBACA,OACA,cAAW,SACX,cAAW,SACX,kBACqB;CACrB,IAAM,IAAK,GAAO,EACZ,CAAC,GAAuB,KAA4B,EACxD,EACD,EAEK,IAAO,MAA0B;AAgCvC,QACE,kBAAC,GAAD;EACE,OA/BF,kBAAC,GAAD;GAAK,IAAI,EAAE,SAAS,QAAQ;aAA5B,CACG,GACD,kBAAC,GAAD;IAAK,IAAI;cAAT,CACG,KACC,kBAAC,GAAD;KACE,OAAO,EAAa,SAAS;KAC7B,SAAS,EAAa,WAAW;KACjC,eAAe;AAEb,MADA,EAAa,SAAS,EAClB,EAAa,uBACf,EAAyB,KAAK;;eAIjC,EAAa;KACP,CAAA,EAEV,KACC,kBAAC,GAAD;KACE,SAAQ;KACR,eAAe,EAAyB,KAAK;eAC9C;KAEQ,CAAA,CAEP;MACF;IAKG;EACI;EACX,MAAM;EACN,IAAI,EAAS,GAAI,GACd,MAAM,EAAe,YAAY;GAChC,UAAU,EAAE,aAAU;GACtB,UAAU,EAAE,aAAU;GACvB,EACF,CAAC;YAEF,kBAAC,GAAD;GACE,MAAK;GACL,WAAW;GACX,UAAS,MAAK;AAMZ,IAHA,EAAE,gBAAgB,EAElB,EAAE,iBAAiB,EACnB,GAAyB,MAAc,KAAa,IAAK,OAAO,EAAI;;GAEtE,IAAI;IAAE,SAAS;IAAgB,QAAQ;IAAW,GAAG;IAAa;GAEjE;GACG,CAAA;EACO,CAAA"}
+{"version":3,"file":"StyledPopover.js","names":[],"sources":["../../../src/components/styled/StyledPopover.tsx"],"sourcesContent":["import LightTooltip from '@/components/styled/LightTooltip'\nimport { spreadSx } from '@/theme/spreadSx'\nimport {\n  Box,\n  Button,\n  ButtonProps,\n  SxProps,\n  tooltipClasses,\n  TooltipProps,\n} from '@mui/material'\nimport { atom, useAtom } from 'jotai'\nimport { PropsWithChildren, ReactNode, useId } from 'react'\n\nexport type StyledPopoverProps = PropsWithChildren<{\n  popoverContent: React.ReactNode\n  sx?: TooltipProps['sx']\n  placement?: TooltipProps['placement']\n  showCloseButton?: boolean\n  actionButton?: {\n    content: ReactNode\n    color?: ButtonProps['color']\n    variant?: ButtonProps['variant']\n    onClick: () => void\n    closePopoverOnClick?: boolean\n  }\n  maxWidth?: string\n  minWidth?: string\n  containerSx?: SxProps\n}>\n\nconst buttonBoxSx: SxProps = {\n  mt: 2,\n  display: 'flex',\n  justifyContent: 'space-between',\n  flexDirection: 'row-reverse',\n  '> button': {\n    flexGrow: 1,\n    maxWidth: '45%',\n  },\n}\n\n// Register a global atom to track which popover is open, to ensure only one is shown at any given time\nconst openMarkdownPopoverAtom = atom<string | null>(null)\n\nexport function StyledPopover({\n  children,\n  popoverContent,\n  placement = 'bottom-start',\n  showCloseButton = true,\n  actionButton,\n  sx,\n  maxWidth = '500px',\n  minWidth = '300px',\n  containerSx,\n}: StyledPopoverProps) {\n  const id = useId()\n  const [openMarkdownPopoverId, setOpenMarkdownPopoverId] = useAtom(\n    openMarkdownPopoverAtom,\n  )\n\n  const show = openMarkdownPopoverId === id\n\n  const content = (\n    <Box sx={{ padding: '20px' }}>\n      {popoverContent}\n      <Box sx={buttonBoxSx}>\n        {actionButton && (\n          <Button\n            color={actionButton.color || 'primary'}\n            variant={actionButton.variant || 'contained'}\n            onClick={() => {\n              actionButton.onClick()\n              if (actionButton.closePopoverOnClick) {\n                setOpenMarkdownPopoverId(null)\n              }\n            }}\n          >\n            {actionButton.content}\n          </Button>\n        )}\n        {showCloseButton && (\n          <Button\n            variant=\"outlined\"\n            onClick={() => setOpenMarkdownPopoverId(null)}\n          >\n            Close\n          </Button>\n        )}\n      </Box>\n    </Box>\n  )\n\n  return (\n    <LightTooltip\n      title={content}\n      placement={placement}\n      open={show}\n      sx={spreadSx(sx, {\n        [`& .${tooltipClasses.tooltip}`]: {\n          maxWidth: { maxWidth },\n          minWidth: { minWidth },\n        },\n      })}\n    >\n      <Box\n        role=\"button\"\n        className={'PopoverContainer'}\n        onClick={e => {\n          // Prevent the default action of the click event -- for example, if this is in a `label` tag for a checkbox,\n          // prevent the click from toggling the checkbox value\n          e.preventDefault()\n          // Prevent the click from propagating to the parent container\n          e.stopPropagation()\n          setOpenMarkdownPopoverId(currentId => (currentId == id ? null : id))\n        }}\n        sx={{ display: 'inline-block', cursor: 'pointer', ...containerSx }}\n      >\n        {children}\n      </Box>\n    </LightTooltip>\n  )\n}\n"],"mappings":";;;;;;;AA8BA,IAAM,IAAuB;CAC3B,IAAI;CACJ,SAAS;CACT,gBAAgB;CAChB,eAAe;CACf,YAAY;EACV,UAAU;EACV,UAAU;CACZ;AACF,GAGM,IAA0B,EAAoB,IAAI;AAExD,SAAgB,EAAc,EAC5B,aACA,mBACA,eAAY,gBACZ,qBAAkB,IAClB,iBACA,OACA,cAAW,SACX,cAAW,SACX,kBACqB;CACrB,IAAM,IAAK,EAAM,GACX,CAAC,GAAuB,KAA4B,EACxD,CACF,GAEM,IAAO,MAA0B;CAgCvC,OACE,kBAAC,GAAD;EACE,OA/BF,kBAAC,GAAD;GAAK,IAAI,EAAE,SAAS,OAAO;aAA3B,CACG,GACD,kBAAC,GAAD;IAAK,IAAI;cAAT,CACG,KACC,kBAAC,GAAD;KACE,OAAO,EAAa,SAAS;KAC7B,SAAS,EAAa,WAAW;KACjC,eAAe;MAEb,AADA,EAAa,QAAQ,GACjB,EAAa,uBACf,EAAyB,IAAI;KAEjC;eAEC,EAAa;IACR,CAAA,GAET,KACC,kBAAC,GAAD;KACE,SAAQ;KACR,eAAe,EAAyB,IAAI;eAC7C;IAEO,CAAA,CAEP;KACF;GAKI;EACI;EACX,MAAM;EACN,IAAI,EAAS,GAAI,GACd,MAAM,EAAe,YAAY;GAChC,UAAU,EAAE,YAAS;GACrB,UAAU,EAAE,YAAS;EACvB,EACF,CAAC;YAED,kBAAC,GAAD;GACE,MAAK;GACL,WAAW;GACX,UAAS,MAAK;IAMZ,AAHA,EAAE,eAAe,GAEjB,EAAE,gBAAgB,GAClB,GAAyB,MAAc,KAAa,IAAK,OAAO,CAAG;GACrE;GACA,IAAI;IAAE,SAAS;IAAgB,QAAQ;IAAW,GAAG;GAAY;GAEhE;EACE,CAAA;CACO,CAAA;AAElB"}

package/dist/components/styled/StyledTableContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"StyledTableContainer.js","names":[],"sources":["../../../src/components/styled/StyledTableContainer.tsx"],"sourcesContent":["import { StyledComponent } from '@emotion/styled'\nimport { Box, BoxProps, styled } from '@mui/material'\n\nexport type StyledTableContainerProps = BoxProps & {\n  /**\n   * Controls the padding of the table cells\n   * @default 'default'\n   */\n  density?: 'default' | 'compact'\n  /**\n   * Controls whether the rows of the table are striped using CSS. For virtualized tables, this should be set to false, since the\n   * row even/oddness is not guaranteed to be consistent as DOM nodes are loaded and unloaded.\n   * @default false\n   */\n  noStripedRows?: boolean\n  ['data-testid']?: string\n}\n\nexport const StyledTableContainer: StyledComponent<StyledTableContainerProps> =\n  styled(Box, {\n    shouldForwardProp: prop => prop !== 'density' && prop !== 'noStripedRows',\n  })<StyledTableContainerProps>(\n    ({ theme, density = 'default', noStripedRows = false }) => ({\n      overflow: 'auto',\n      paddingLeft: '2px',\n      ['thead > tr']: {\n        backgroundColor: theme.palette.grey[200],\n      },\n      th: {\n        height: '38px',\n        backgroundColor: theme.palette.grey[200],\n        borderRight: '1px solid',\n        borderColor: theme.palette.grey[400],\n      },\n      ['th:first-of-type']: {\n        paddingLeft: '10px',\n      },\n      ['td:first-of-type']: {\n        paddingLeft: '10px',\n      },\n      ['tr:nth-of-type(2n)']: noStripedRows\n        ? undefined\n        : {\n            backgroundColor: theme.palette.grey[100],\n          },\n      ['tr']: {\n        backgroundColor: theme.palette.background.default,\n      },\n      ['tr:nth-of-type(even)']: noStripedRows\n        ? undefined\n        : {\n            backgroundColor: theme.palette.grey[100],\n          },\n      ['th,td']: {\n        position: 'relative',\n        paddingLeft: theme.spacing(density === 'compact' ? 0 : 1),\n        paddingRight: theme.spacing(density === 'compact' ? 0 : 1),\n      },\n      td: {\n        paddingTop: theme.spacing(density === 'compact' ? 0 : 1),\n        paddingBottom: theme.spacing(density === 'compact' ? 0 : 1),\n        textOverflow: 'ellipsis',\n        overflow: 'hidden',\n      },\n      '.resizer': {\n        position: 'absolute',\n        right: 0,\n        top: 0,\n        height: '100%',\n        width: '3px',\n        padding: 0,\n        background: 'rgba(0,0,0,0.25)',\n        cursor: 'col-resize',\n        userSelect: 'none',\n        touchAction: 'none',\n      },\n      '.resizer.isResizing': {\n        background: theme.palette.primary.main,\n        opacity: 1,\n      },\n      '@media (hover: hover)': {\n        '.resizer': {\n          opacity: 0,\n        },\n        '*:hover > .resizer': {\n          opacity: 0.75,\n        },\n      },\n      '.MuiButton-root': {\n        whiteSpace: 'nowrap',\n      },\n    }),\n  )\n"],"mappings":";;AAkBA,IAAa,IACX,EAAO,GAAK,EACV,oBAAmB,MAAQ,MAAS,aAAa,MAAS,iBAC3D,CAAC,EACC,EAAE,UAAO,aAAU,WAAW,mBAAgB,UAAa;CAC1D,UAAU;CACV,aAAa;CACZ,cAAe,EACd,iBAAiB,EAAM,QAAQ,KAAK,MACrC;CACD,IAAI;EACF,QAAQ;EACR,iBAAiB,EAAM,QAAQ,KAAK;EACpC,aAAa;EACb,aAAa,EAAM,QAAQ,KAAK;EACjC;CACA,oBAAqB,EACpB,aAAa,QACd;CACA,oBAAqB,EACpB,aAAa,QACd;CACA,sBAAuB,IACpB,KAAA,IACA,EACE,iBAAiB,EAAM,QAAQ,KAAK,MACrC;CACJ,IAAO,EACN,iBAAiB,EAAM,QAAQ,WAAW,SAC3C;CACA,wBAAyB,IACtB,KAAA,IACA,EACE,iBAAiB,EAAM,QAAQ,KAAK,MACrC;CACJ,SAAU;EACT,UAAU;EACV,aAAa,EAAM,QAAQ,MAAY,YAAY,IAAI,EAAE;EACzD,cAAc,EAAM,QAAQ,MAAY,YAAY,IAAI,EAAE;EAC3D;CACD,IAAI;EACF,YAAY,EAAM,QAAQ,MAAY,YAAY,IAAI,EAAE;EACxD,eAAe,EAAM,QAAQ,MAAY,YAAY,IAAI,EAAE;EAC3D,cAAc;EACd,UAAU;EACX;CACD,YAAY;EACV,UAAU;EACV,OAAO;EACP,KAAK;EACL,QAAQ;EACR,OAAO;EACP,SAAS;EACT,YAAY;EACZ,QAAQ;EACR,YAAY;EACZ,aAAa;EACd;CACD,uBAAuB;EACrB,YAAY,EAAM,QAAQ,QAAQ;EAClC,SAAS;EACV;CACD,yBAAyB;EACvB,YAAY,EACV,SAAS,GACV;EACD,sBAAsB,EACpB,SAAS,KACV;EACF;CACD,mBAAmB,EACjB,YAAY,UACb;CACF,EACF"}
+{"version":3,"file":"StyledTableContainer.js","names":[],"sources":["../../../src/components/styled/StyledTableContainer.tsx"],"sourcesContent":["import { StyledComponent } from '@emotion/styled'\nimport { Box, BoxProps, styled } from '@mui/material'\n\nexport type StyledTableContainerProps = BoxProps & {\n  /**\n   * Controls the padding of the table cells\n   * @default 'default'\n   */\n  density?: 'default' | 'compact'\n  /**\n   * Controls whether the rows of the table are striped using CSS. For virtualized tables, this should be set to false, since the\n   * row even/oddness is not guaranteed to be consistent as DOM nodes are loaded and unloaded.\n   * @default false\n   */\n  noStripedRows?: boolean\n  ['data-testid']?: string\n}\n\nexport const StyledTableContainer: StyledComponent<StyledTableContainerProps> =\n  styled(Box, {\n    shouldForwardProp: prop => prop !== 'density' && prop !== 'noStripedRows',\n  })<StyledTableContainerProps>(\n    ({ theme, density = 'default', noStripedRows = false }) => ({\n      overflow: 'auto',\n      paddingLeft: '2px',\n      ['thead > tr']: {\n        backgroundColor: theme.palette.grey[200],\n      },\n      th: {\n        height: '38px',\n        backgroundColor: theme.palette.grey[200],\n        borderRight: '1px solid',\n        borderColor: theme.palette.grey[400],\n      },\n      ['th:first-of-type']: {\n        paddingLeft: '10px',\n      },\n      ['td:first-of-type']: {\n        paddingLeft: '10px',\n      },\n      ['tr:nth-of-type(2n)']: noStripedRows\n        ? undefined\n        : {\n            backgroundColor: theme.palette.grey[100],\n          },\n      ['tr']: {\n        backgroundColor: theme.palette.background.default,\n      },\n      ['tr:nth-of-type(even)']: noStripedRows\n        ? undefined\n        : {\n            backgroundColor: theme.palette.grey[100],\n          },\n      ['th,td']: {\n        position: 'relative',\n        paddingLeft: theme.spacing(density === 'compact' ? 0 : 1),\n        paddingRight: theme.spacing(density === 'compact' ? 0 : 1),\n      },\n      td: {\n        paddingTop: theme.spacing(density === 'compact' ? 0 : 1),\n        paddingBottom: theme.spacing(density === 'compact' ? 0 : 1),\n        textOverflow: 'ellipsis',\n        overflow: 'hidden',\n      },\n      '.resizer': {\n        position: 'absolute',\n        right: 0,\n        top: 0,\n        height: '100%',\n        width: '3px',\n        padding: 0,\n        background: 'rgba(0,0,0,0.25)',\n        cursor: 'col-resize',\n        userSelect: 'none',\n        touchAction: 'none',\n      },\n      '.resizer.isResizing': {\n        background: theme.palette.primary.main,\n        opacity: 1,\n      },\n      '@media (hover: hover)': {\n        '.resizer': {\n          opacity: 0,\n        },\n        '*:hover > .resizer': {\n          opacity: 0.75,\n        },\n      },\n      '.MuiButton-root': {\n        whiteSpace: 'nowrap',\n      },\n    }),\n  )\n"],"mappings":";;AAkBA,IAAa,IACX,EAAO,GAAK,EACV,oBAAmB,MAAQ,MAAS,aAAa,MAAS,gBAC5D,CAAC,GACE,EAAE,UAAO,aAAU,WAAW,mBAAgB,UAAa;CAC1D,UAAU;CACV,aAAa;CACZ,cAAe,EACd,iBAAiB,EAAM,QAAQ,KAAK,KACtC;CACA,IAAI;EACF,QAAQ;EACR,iBAAiB,EAAM,QAAQ,KAAK;EACpC,aAAa;EACb,aAAa,EAAM,QAAQ,KAAK;CAClC;CACC,oBAAqB,EACpB,aAAa,OACf;CACC,oBAAqB,EACpB,aAAa,OACf;CACC,sBAAuB,IACpB,KAAA,IACA,EACE,iBAAiB,EAAM,QAAQ,KAAK,KACtC;CACH,IAAO,EACN,iBAAiB,EAAM,QAAQ,WAAW,QAC5C;CACC,wBAAyB,IACtB,KAAA,IACA,EACE,iBAAiB,EAAM,QAAQ,KAAK,KACtC;CACH,SAAU;EACT,UAAU;EACV,aAAa,EAAM,QAAQ,MAAY,YAAY,IAAI,CAAC;EACxD,cAAc,EAAM,QAAQ,MAAY,YAAY,IAAI,CAAC;CAC3D;CACA,IAAI;EACF,YAAY,EAAM,QAAQ,MAAY,YAAY,IAAI,CAAC;EACvD,eAAe,EAAM,QAAQ,MAAY,YAAY,IAAI,CAAC;EAC1D,cAAc;EACd,UAAU;CACZ;CACA,YAAY;EACV,UAAU;EACV,OAAO;EACP,KAAK;EACL,QAAQ;EACR,OAAO;EACP,SAAS;EACT,YAAY;EACZ,QAAQ;EACR,YAAY;EACZ,aAAa;CACf;CACA,uBAAuB;EACrB,YAAY,EAAM,QAAQ,QAAQ;EAClC,SAAS;CACX;CACA,yBAAyB;EACvB,YAAY,EACV,SAAS,EACX;EACA,sBAAsB,EACpB,SAAS,IACX;CACF;CACA,mBAAmB,EACjB,YAAY,SACd;AACF,EACF"}

package/dist/components/styled/WideButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"WideButton.js","names":[],"sources":["../../../src/components/styled/WideButton.tsx"],"sourcesContent":["import { Button, ButtonProps, styled } from '@mui/material'\nimport { StyledComponent } from '@emotion/styled'\n\nexport const WideButton: StyledComponent<ButtonProps> = styled(Button, {\n  label: 'WideButton',\n})(({ theme }) => ({\n  minWidth: '168px',\n  padding: '10px',\n  fontSize: '16px',\n}))\n\nexport default WideButton\n"],"mappings":";;AAGA,IAAa,IAA2C,EAAO,GAAQ,EACrE,OAAO,cACR,CAAC,EAAE,EAAE,gBAAa;CACjB,UAAU;CACV,SAAS;CACT,UAAU;CACX,EAAE"}
+{"version":3,"file":"WideButton.js","names":[],"sources":["../../../src/components/styled/WideButton.tsx"],"sourcesContent":["import { Button, ButtonProps, styled } from '@mui/material'\nimport { StyledComponent } from '@emotion/styled'\n\nexport const WideButton: StyledComponent<ButtonProps> = styled(Button, {\n  label: 'WideButton',\n})(({ theme }) => ({\n  minWidth: '168px',\n  padding: '10px',\n  fontSize: '16px',\n}))\n\nexport default WideButton\n"],"mappings":";;AAGA,IAAa,IAA2C,EAAO,GAAQ,EACrE,OAAO,aACT,CAAC,GAAG,EAAE,gBAAa;CACjB,UAAU;CACV,SAAS;CACT,UAAU;AACZ,EAAE"}

package/dist/components/table/CsvPreview/CreateTableFromCsvDialog.js

@@ -17,44 +17,41 @@ import x from "@mui/material/Accordion";
 import S from "@mui/material/AccordionDetails";
 import C from "@mui/material/AccordionSummary";
 //#region src/components/table/CsvPreview/CreateTableFromCsvDialog.tsx
-var w = /* @__PURE__ */ function(e) {
-	return e[e.CSV_UPLOAD_PREVIEW = 0] = "CSV_UPLOAD_PREVIEW", e[e.TABLE_NAME = 1] = "TABLE_NAME", e;
-}(w || {});
-function T(T) {
-	let { open: E, onClose: D, parentId: O, onSuccess: k } = T, A = n(), [j, M] = l(w.CSV_UPLOAD_PREVIEW), [N, P] = l(""), [F, I] = l([]), L = c(null), { mutate: R, isPending: z } = a({
+function w(w) {
+	let { open: T, onClose: E, parentId: D, onSuccess: O } = w, k = n(), [A, j] = l(0), [M, N] = l(""), [P, F] = l([]), I = c(null), { mutate: L, isPending: R } = a({
 		onSuccess() {
-			k?.();
+			O?.();
 		},
 		onError(t) {
 			e(t.message, "danger");
 		}
-	}), B = s((e = []) => {
-		R({
-			parentId: O,
-			tableName: N,
+	}), z = s((e = []) => {
+		L({
+			parentId: D,
+			tableName: M,
 			columnModels: e,
-			csvTableDescriptor: A.csvTableDescriptor,
-			fileHandleId: A.uploadedFileHandleId
+			csvTableDescriptor: k.csvTableDescriptor,
+			fileHandleId: k.uploadedFileHandleId
 		});
 	}, [
-		R,
-		O,
-		N,
-		A.csvTableDescriptor,
-		A.uploadedFileHandleId
-	]), V = s((e) => {
-		B(e);
-	}, [B]), H = s(() => {
-		let e = A.csvPreviewData?.suggestedColumns;
-		e && (I(e.map((e) => d(e, u))), M(w.TABLE_NAME));
-	}, [A.csvPreviewData, M]), U = /* @__PURE__ */ m(v, {
+		L,
+		D,
+		M,
+		k.csvTableDescriptor,
+		k.uploadedFileHandleId
+	]), B = s((e) => {
+		z(e);
+	}, [z]), V = s(() => {
+		let e = k.csvPreviewData?.suggestedColumns;
+		e && (F(e.map((e) => d(e, u))), j(1));
+	}, [k.csvPreviewData, j]), H = /* @__PURE__ */ m(v, {
 		spacing: 2,
 		children: [
 			/* @__PURE__ */ p(_, {
 				required: !0,
 				label: "Table Name",
-				value: N,
-				onChange: (e) => P(e.target.value),
+				value: M,
+				onChange: (e) => N(e.target.value),
 				fullWidth: !0
 			}),
 			/* @__PURE__ */ p(g, {
@@ -68,49 +65,49 @@ function T(T) {
 					children: "Schema Options"
 				})
 			}), /* @__PURE__ */ p(S, { children: /* @__PURE__ */ p(o, {
-				initialData: F,
+				initialData: P,
 				entityType: h.table,
-				ref: L,
-				onSubmit: V
+				ref: I,
+				onSubmit: B
 			}) })] })
 		]
 	});
 	return /* @__PURE__ */ p(t, {
 		maxWidth: "lg",
 		title: "Upload CSV",
-		onCancel: D,
-		open: E,
-		content: /* @__PURE__ */ m(f, { children: [j === w.CSV_UPLOAD_PREVIEW && /* @__PURE__ */ p(i, { workflow: A }), j === w.TABLE_NAME && U] }),
+		onCancel: E,
+		open: T,
+		content: /* @__PURE__ */ m(f, { children: [A === 0 && /* @__PURE__ */ p(i, { workflow: k }), A === 1 && H] }),
 		actions: /* @__PURE__ */ m(f, { children: [
 			/* @__PURE__ */ p(y, {
 				variant: "outlined",
-				disabled: A.isLoadingPreview,
+				disabled: k.isLoadingPreview,
 				onClick: () => {
-					D();
+					E();
 				},
 				children: "Cancel"
 			}),
-			j === w.CSV_UPLOAD_PREVIEW && A.step === r.COLUMN_PREVIEW && /* @__PURE__ */ p(y, {
-				disabled: A.isLoadingPreview,
+			A === 0 && k.step === r.COLUMN_PREVIEW && /* @__PURE__ */ p(y, {
+				disabled: k.isLoadingPreview,
 				variant: "contained",
-				onClick: H,
+				onClick: V,
 				children: "Next"
 			}),
-			j === w.TABLE_NAME && /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p(y, {
+			A === 1 && /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p(y, {
 				variant: "outlined",
-				onClick: () => M(w.CSV_UPLOAD_PREVIEW),
+				onClick: () => j(0),
 				children: "Back"
 			}), /* @__PURE__ */ p(y, {
 				variant: "contained",
-				onClick: () => L.current?.submit(),
-				loading: z,
-				disabled: !N,
+				onClick: () => I.current?.submit(),
+				loading: R,
+				disabled: !M,
 				children: "Create"
 			})] })
 		] })
 	});
 }
 //#endregion
-export { T as default };
+export { w as default };
 
 //# sourceMappingURL=CreateTableFromCsvDialog.js.map

package/dist/components/table/CsvPreview/CreateTableFromCsvDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"CreateTableFromCsvDialog.js","names":[],"sources":["../../../../src/components/table/CsvPreview/CreateTableFromCsvDialog.tsx"],"sourcesContent":["import TableColumnSchemaForm, {\n  SubmitHandle,\n} from '@/components/TableColumnSchemaEditor/TableColumnSchemaForm'\nimport { DialogBase } from '@/components/DialogBase'\nimport { displayToast } from '@/components/ToastMessage/ToastMessage'\nimport useCsvUploadPreview, {\n  CsvUploadPreviewStep,\n} from '@/components/table/CsvPreview/useCsvUploadPreview'\nimport ExpandMoreIcon from '@mui/icons-material/ExpandMore'\nimport Accordion from '@mui/material/Accordion'\nimport AccordionDetails from '@mui/material/AccordionDetails'\nimport AccordionSummary from '@mui/material/AccordionSummary'\nimport Button from '@mui/material/Button'\nimport Stack from '@mui/material/Stack'\nimport TextField from '@mui/material/TextField'\nimport Typography from '@mui/material/Typography'\nimport { EntityType } from '@sage-bionetworks/synapse-client'\nimport { isUndefined, omitBy } from 'lodash-es'\nimport { useCallback, useRef, useState } from 'react'\nimport { SetOptional } from 'type-fest'\nimport { ColumnModel as SynapseTypesColumnModel } from '@sage-bionetworks/synapse-types'\nimport useCreateTableFromCsv from './useCreateTableFromCsv'\nimport CsvUploadPreviewContent from './CsvUploadPreviewContent'\n\nexport type CreateTableFromCsvDialogProps = {\n  /** Whether the dialog is open */\n  open: boolean\n  /** Callback when the dialog is closed */\n  onClose: () => void\n  /** Destination project/folder to upload to */\n  parentId: string\n  /** Invoked after all backend operations successfully complete */\n  onSuccess?: () => void\n}\n\nenum CreateTableFromCsvStep {\n  CSV_UPLOAD_PREVIEW = 0,\n  TABLE_NAME = 1,\n}\n\n/**\n * A multi-step modal wizard used to create a Synapse Table entity from an uploaded CSV file.\n * It manages two primary phases:\n * 1. CSV Upload & Preview: Displays data preview and infers suggested column models.\n * 2. Table Configuration: Sets table name and allows schema customization.\n */\nexport default function CreateTableFromCsvDialog(\n  props: CreateTableFromCsvDialogProps,\n) {\n  const { open, onClose, parentId, onSuccess } = props\n  const csvUploadPreviewWorkflow = useCsvUploadPreview()\n  const [step, setStep] = useState(CreateTableFromCsvStep.CSV_UPLOAD_PREVIEW)\n  const [tableName, setTableName] = useState('')\n  const [columnModels, setColumnModels] = useState<\n    SetOptional<SynapseTypesColumnModel, 'id'>[]\n  >([])\n  const columnSchemaFormRef = useRef<SubmitHandle>(null)\n\n  const { mutate: createTableFromCsv, isPending: isUploading } =\n    useCreateTableFromCsv({\n      onSuccess() {\n        onSuccess?.()\n      },\n      onError(error) {\n        displayToast(error.message, 'danger')\n      },\n    })\n\n  const handleFinish = useCallback(\n    (columnModelsParam: SetOptional<SynapseTypesColumnModel, 'id'>[] = []) => {\n      createTableFromCsv({\n        parentId,\n        tableName,\n        columnModels: columnModelsParam,\n        csvTableDescriptor: csvUploadPreviewWorkflow.csvTableDescriptor,\n        fileHandleId: csvUploadPreviewWorkflow.uploadedFileHandleId!,\n      })\n    },\n    [\n      createTableFromCsv,\n      parentId,\n      tableName,\n      csvUploadPreviewWorkflow.csvTableDescriptor,\n      csvUploadPreviewWorkflow.uploadedFileHandleId,\n    ],\n  )\n\n  const onColumnSchemaSubmit = useCallback(\n    (editedColumnModels: SetOptional<SynapseTypesColumnModel, 'id'>[]) => {\n      void handleFinish(editedColumnModels)\n    },\n    [handleFinish],\n  )\n\n  const handlePreviewConfirm = useCallback(() => {\n    const suggestedColumns =\n      csvUploadPreviewWorkflow.csvPreviewData?.suggestedColumns\n    if (!suggestedColumns) {\n      return\n    }\n\n    // create new table; initialize schema editor with suggestions and proceed to naming.\n    setColumnModels(\n      suggestedColumns.map(cm => omitBy(cm, isUndefined)) as SetOptional<\n        SynapseTypesColumnModel,\n        'id'\n      >[],\n    )\n    setStep(CreateTableFromCsvStep.TABLE_NAME)\n  }, [csvUploadPreviewWorkflow.csvPreviewData, setStep])\n\n  const tableNameStepContent = (\n    <Stack spacing={2}>\n      <TextField\n        required\n        label={'Table Name'}\n        value={tableName}\n        onChange={e => setTableName(e.target.value)}\n        fullWidth\n      />\n      <Typography variant={'body1'}>\n        Use the schema options button to make changes to the columns of the\n        table. Use the create button to finish building the table.\n      </Typography>\n      <Accordion>\n        <AccordionSummary expandIcon={<ExpandMoreIcon />}>\n          <Typography variant={'headline3'}>Schema Options</Typography>\n        </AccordionSummary>\n        <AccordionDetails>\n          <TableColumnSchemaForm\n            initialData={columnModels}\n            entityType={EntityType.table}\n            ref={columnSchemaFormRef}\n            onSubmit={onColumnSchemaSubmit}\n          />\n        </AccordionDetails>\n      </Accordion>\n    </Stack>\n  )\n\n  return (\n    <DialogBase\n      maxWidth={'lg'}\n      title={'Upload CSV'}\n      onCancel={onClose}\n      open={open}\n      content={\n        <>\n          {step === CreateTableFromCsvStep.CSV_UPLOAD_PREVIEW && (\n            <CsvUploadPreviewContent workflow={csvUploadPreviewWorkflow} />\n          )}\n          {step === CreateTableFromCsvStep.TABLE_NAME && tableNameStepContent}\n        </>\n      }\n      actions={\n        <>\n          <Button\n            variant={'outlined'}\n            disabled={csvUploadPreviewWorkflow.isLoadingPreview}\n            onClick={() => {\n              onClose()\n            }}\n          >\n            Cancel\n          </Button>\n          {step === CreateTableFromCsvStep.CSV_UPLOAD_PREVIEW &&\n            csvUploadPreviewWorkflow.step ===\n              CsvUploadPreviewStep.COLUMN_PREVIEW && (\n              <Button\n                disabled={csvUploadPreviewWorkflow.isLoadingPreview}\n                variant={'contained'}\n                onClick={handlePreviewConfirm}\n              >\n                Next\n              </Button>\n            )}\n          {step === CreateTableFromCsvStep.TABLE_NAME && (\n            <>\n              <Button\n                variant={'outlined'}\n                onClick={() =>\n                  setStep(CreateTableFromCsvStep.CSV_UPLOAD_PREVIEW)\n                }\n              >\n                Back\n              </Button>\n              <Button\n                variant={'contained'}\n                onClick={() => columnSchemaFormRef.current?.submit()}\n                loading={isUploading}\n                disabled={!tableName}\n              >\n                Create\n              </Button>\n            </>\n          )}\n        </>\n      }\n    />\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAmCA,IAAK,IAAL,yBAAA,GAAA;QACE,EAAA,EAAA,qBAAqB,KAAA,sBACrB,EAAA,EAAA,aAAa,KAAA;EAFV,KAAA,EAAA,CAGJ;AAQD,SAAwB,EACtB,GACA;CACA,IAAM,EAAE,SAAM,YAAS,aAAU,iBAAc,GACzC,IAA2B,GAAqB,EAChD,CAAC,GAAM,KAAW,EAAS,EAAuB,mBAAmB,EACrE,CAAC,GAAW,KAAgB,EAAS,GAAG,EACxC,CAAC,GAAc,KAAmB,EAEtC,EAAE,CAAC,EACC,IAAsB,EAAqB,KAAK,EAEhD,EAAE,QAAQ,GAAoB,WAAW,MAC7C,EAAsB;EACpB,YAAY;AACV,QAAa;;EAEf,QAAQ,GAAO;AACb,KAAa,EAAM,SAAS,SAAS;;EAExC,CAAC,EAEE,IAAe,GAClB,IAAkE,EAAE,KAAK;AACxE,IAAmB;GACjB;GACA;GACA,cAAc;GACd,oBAAoB,EAAyB;GAC7C,cAAc,EAAyB;GACxC,CAAC;IAEJ;EACE;EACA;EACA;EACA,EAAyB;EACzB,EAAyB;EAC1B,CACF,EAEK,IAAuB,GAC1B,MAAqE;AAC/D,IAAa,EAAmB;IAEvC,CAAC,EAAa,CACf,EAEK,IAAuB,QAAkB;EAC7C,IAAM,IACJ,EAAyB,gBAAgB;AACtC,QAKL,EACE,EAAiB,KAAI,MAAM,EAAO,GAAI,EAAY,CAAC,CAIpD,EACD,EAAQ,EAAuB,WAAW;IACzC,CAAC,EAAyB,gBAAgB,EAAQ,CAAC,EAEhD,IACJ,kBAAC,GAAD;EAAO,SAAS;YAAhB;GACE,kBAAC,GAAD;IACE,UAAA;IACA,OAAO;IACP,OAAO;IACP,WAAU,MAAK,EAAa,EAAE,OAAO,MAAM;IAC3C,WAAA;IACA,CAAA;GACF,kBAAC,GAAD;IAAY,SAAS;cAAS;IAGjB,CAAA;GACb,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD;IAAkB,YAAY,kBAAC,GAAD,EAAkB,CAAA;cAC9C,kBAAC,GAAD;KAAY,SAAS;eAAa;KAA2B,CAAA;IAC5C,CAAA,EACnB,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD;IACE,aAAa;IACb,YAAY,EAAW;IACvB,KAAK;IACL,UAAU;IACV,CAAA,EACe,CAAA,CACT,EAAA,CAAA;GACN;;AAGV,QACE,kBAAC,GAAD;EACE,UAAU;EACV,OAAO;EACP,UAAU;EACJ;EACN,SACE,kBAAA,GAAA,EAAA,UAAA,CACG,MAAS,EAAuB,sBAC/B,kBAAC,GAAD,EAAyB,UAAU,GAA4B,CAAA,EAEhE,MAAS,EAAuB,cAAc,EAC9C,EAAA,CAAA;EAEL,SACE,kBAAA,GAAA,EAAA,UAAA;GACE,kBAAC,GAAD;IACE,SAAS;IACT,UAAU,EAAyB;IACnC,eAAe;AACb,QAAS;;cAEZ;IAEQ,CAAA;GACR,MAAS,EAAuB,sBAC/B,EAAyB,SACvB,EAAqB,kBACrB,kBAAC,GAAD;IACE,UAAU,EAAyB;IACnC,SAAS;IACT,SAAS;cACV;IAEQ,CAAA;GAEZ,MAAS,EAAuB,cAC/B,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;IACE,SAAS;IACT,eACE,EAAQ,EAAuB,mBAAmB;cAErD;IAEQ,CAAA,EACT,kBAAC,GAAD;IACE,SAAS;IACT,eAAe,EAAoB,SAAS,QAAQ;IACpD,SAAS;IACT,UAAU,CAAC;cACZ;IAEQ,CAAA,CACR,EAAA,CAAA;GAEJ,EAAA,CAAA;EAEL,CAAA"}
+{"version":3,"file":"CreateTableFromCsvDialog.js","names":[],"sources":["../../../../src/components/table/CsvPreview/CreateTableFromCsvDialog.tsx"],"sourcesContent":["import TableColumnSchemaForm, {\n  SubmitHandle,\n} from '@/components/TableColumnSchemaEditor/TableColumnSchemaForm'\nimport { DialogBase } from '@/components/DialogBase'\nimport { displayToast } from '@/components/ToastMessage/ToastMessage'\nimport useCsvUploadPreview, {\n  CsvUploadPreviewStep,\n} from '@/components/table/CsvPreview/useCsvUploadPreview'\nimport ExpandMoreIcon from '@mui/icons-material/ExpandMore'\nimport Accordion from '@mui/material/Accordion'\nimport AccordionDetails from '@mui/material/AccordionDetails'\nimport AccordionSummary from '@mui/material/AccordionSummary'\nimport Button from '@mui/material/Button'\nimport Stack from '@mui/material/Stack'\nimport TextField from '@mui/material/TextField'\nimport Typography from '@mui/material/Typography'\nimport { EntityType } from '@sage-bionetworks/synapse-client'\nimport { isUndefined, omitBy } from 'lodash-es'\nimport { useCallback, useRef, useState } from 'react'\nimport { SetOptional } from 'type-fest'\nimport { ColumnModel as SynapseTypesColumnModel } from '@sage-bionetworks/synapse-types'\nimport useCreateTableFromCsv from './useCreateTableFromCsv'\nimport CsvUploadPreviewContent from './CsvUploadPreviewContent'\n\nexport type CreateTableFromCsvDialogProps = {\n  /** Whether the dialog is open */\n  open: boolean\n  /** Callback when the dialog is closed */\n  onClose: () => void\n  /** Destination project/folder to upload to */\n  parentId: string\n  /** Invoked after all backend operations successfully complete */\n  onSuccess?: () => void\n}\n\nenum CreateTableFromCsvStep {\n  CSV_UPLOAD_PREVIEW = 0,\n  TABLE_NAME = 1,\n}\n\n/**\n * A multi-step modal wizard used to create a Synapse Table entity from an uploaded CSV file.\n * It manages two primary phases:\n * 1. CSV Upload & Preview: Displays data preview and infers suggested column models.\n * 2. Table Configuration: Sets table name and allows schema customization.\n */\nexport default function CreateTableFromCsvDialog(\n  props: CreateTableFromCsvDialogProps,\n) {\n  const { open, onClose, parentId, onSuccess } = props\n  const csvUploadPreviewWorkflow = useCsvUploadPreview()\n  const [step, setStep] = useState(CreateTableFromCsvStep.CSV_UPLOAD_PREVIEW)\n  const [tableName, setTableName] = useState('')\n  const [columnModels, setColumnModels] = useState<\n    SetOptional<SynapseTypesColumnModel, 'id'>[]\n  >([])\n  const columnSchemaFormRef = useRef<SubmitHandle>(null)\n\n  const { mutate: createTableFromCsv, isPending: isUploading } =\n    useCreateTableFromCsv({\n      onSuccess() {\n        onSuccess?.()\n      },\n      onError(error) {\n        displayToast(error.message, 'danger')\n      },\n    })\n\n  const handleFinish = useCallback(\n    (columnModelsParam: SetOptional<SynapseTypesColumnModel, 'id'>[] = []) => {\n      createTableFromCsv({\n        parentId,\n        tableName,\n        columnModels: columnModelsParam,\n        csvTableDescriptor: csvUploadPreviewWorkflow.csvTableDescriptor,\n        fileHandleId: csvUploadPreviewWorkflow.uploadedFileHandleId!,\n      })\n    },\n    [\n      createTableFromCsv,\n      parentId,\n      tableName,\n      csvUploadPreviewWorkflow.csvTableDescriptor,\n      csvUploadPreviewWorkflow.uploadedFileHandleId,\n    ],\n  )\n\n  const onColumnSchemaSubmit = useCallback(\n    (editedColumnModels: SetOptional<SynapseTypesColumnModel, 'id'>[]) => {\n      void handleFinish(editedColumnModels)\n    },\n    [handleFinish],\n  )\n\n  const handlePreviewConfirm = useCallback(() => {\n    const suggestedColumns =\n      csvUploadPreviewWorkflow.csvPreviewData?.suggestedColumns\n    if (!suggestedColumns) {\n      return\n    }\n\n    // create new table; initialize schema editor with suggestions and proceed to naming.\n    setColumnModels(\n      suggestedColumns.map(cm => omitBy(cm, isUndefined)) as SetOptional<\n        SynapseTypesColumnModel,\n        'id'\n      >[],\n    )\n    setStep(CreateTableFromCsvStep.TABLE_NAME)\n  }, [csvUploadPreviewWorkflow.csvPreviewData, setStep])\n\n  const tableNameStepContent = (\n    <Stack spacing={2}>\n      <TextField\n        required\n        label={'Table Name'}\n        value={tableName}\n        onChange={e => setTableName(e.target.value)}\n        fullWidth\n      />\n      <Typography variant={'body1'}>\n        Use the schema options button to make changes to the columns of the\n        table. Use the create button to finish building the table.\n      </Typography>\n      <Accordion>\n        <AccordionSummary expandIcon={<ExpandMoreIcon />}>\n          <Typography variant={'headline3'}>Schema Options</Typography>\n        </AccordionSummary>\n        <AccordionDetails>\n          <TableColumnSchemaForm\n            initialData={columnModels}\n            entityType={EntityType.table}\n            ref={columnSchemaFormRef}\n            onSubmit={onColumnSchemaSubmit}\n          />\n        </AccordionDetails>\n      </Accordion>\n    </Stack>\n  )\n\n  return (\n    <DialogBase\n      maxWidth={'lg'}\n      title={'Upload CSV'}\n      onCancel={onClose}\n      open={open}\n      content={\n        <>\n          {step === CreateTableFromCsvStep.CSV_UPLOAD_PREVIEW && (\n            <CsvUploadPreviewContent workflow={csvUploadPreviewWorkflow} />\n          )}\n          {step === CreateTableFromCsvStep.TABLE_NAME && tableNameStepContent}\n        </>\n      }\n      actions={\n        <>\n          <Button\n            variant={'outlined'}\n            disabled={csvUploadPreviewWorkflow.isLoadingPreview}\n            onClick={() => {\n              onClose()\n            }}\n          >\n            Cancel\n          </Button>\n          {step === CreateTableFromCsvStep.CSV_UPLOAD_PREVIEW &&\n            csvUploadPreviewWorkflow.step ===\n              CsvUploadPreviewStep.COLUMN_PREVIEW && (\n              <Button\n                disabled={csvUploadPreviewWorkflow.isLoadingPreview}\n                variant={'contained'}\n                onClick={handlePreviewConfirm}\n              >\n                Next\n              </Button>\n            )}\n          {step === CreateTableFromCsvStep.TABLE_NAME && (\n            <>\n              <Button\n                variant={'outlined'}\n                onClick={() =>\n                  setStep(CreateTableFromCsvStep.CSV_UPLOAD_PREVIEW)\n                }\n              >\n                Back\n              </Button>\n              <Button\n                variant={'contained'}\n                onClick={() => columnSchemaFormRef.current?.submit()}\n                loading={isUploading}\n                disabled={!tableName}\n              >\n                Create\n              </Button>\n            </>\n          )}\n        </>\n      }\n    />\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AA8CA,SAAwB,EACtB,GACA;CACA,IAAM,EAAE,SAAM,YAAS,aAAU,iBAAc,GACzC,IAA2B,EAAoB,GAC/C,CAAC,GAAM,KAAW,EAAA,CAAkD,GACpE,CAAC,GAAW,KAAgB,EAAS,EAAE,GACvC,CAAC,GAAc,KAAmB,EAEtC,CAAC,CAAC,GACE,IAAsB,EAAqB,IAAI,GAE/C,EAAE,QAAQ,GAAoB,WAAW,MAC7C,EAAsB;EACpB,YAAY;GACV,IAAY;EACd;EACA,QAAQ,GAAO;GACb,EAAa,EAAM,SAAS,QAAQ;EACtC;CACF,CAAC,GAEG,IAAe,GAClB,IAAkE,CAAC,MAAM;EACxE,EAAmB;GACjB;GACA;GACA,cAAc;GACd,oBAAoB,EAAyB;GAC7C,cAAc,EAAyB;EACzC,CAAC;CACH,GACA;EACE;EACA;EACA;EACA,EAAyB;EACzB,EAAyB;CAC3B,CACF,GAEM,IAAuB,GAC1B,MAAqE;EACpE,EAAkB,CAAkB;CACtC,GACA,CAAC,CAAY,CACf,GAEM,IAAuB,QAAkB;EAC7C,IAAM,IACJ,EAAyB,gBAAgB;EACtC,MAKL,EACE,EAAiB,KAAI,MAAM,EAAO,GAAI,CAAW,CAAC,CAIpD,GACA,EAAA,CAAyC;CAC3C,GAAG,CAAC,EAAyB,gBAAgB,CAAO,CAAC,GAE/C,IACJ,kBAAC,GAAD;EAAO,SAAS;YAAhB;GACE,kBAAC,GAAD;IACE,UAAA;IACA,OAAO;IACP,OAAO;IACP,WAAU,MAAK,EAAa,EAAE,OAAO,KAAK;IAC1C,WAAA;GACD,CAAA;GACD,kBAAC,GAAD;IAAY,SAAS;cAAS;GAGlB,CAAA;GACZ,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD;IAAkB,YAAY,kBAAC,GAAD,CAAiB,CAAA;cAC7C,kBAAC,GAAD;KAAY,SAAS;eAAa;IAA0B,CAAA;GAC5C,CAAA,GAClB,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD;IACE,aAAa;IACb,YAAY,EAAW;IACvB,KAAK;IACL,UAAU;GACX,CAAA,EACe,CAAA,CACT,EAAA,CAAA;EACN;;CAGT,OACE,kBAAC,GAAD;EACE,UAAU;EACV,OAAO;EACP,UAAU;EACJ;EACN,SACE,kBAAA,GAAA,EAAA,UAAA,CACG,MAAA,KACC,kBAAC,GAAD,EAAyB,UAAU,EAA2B,CAAA,GAE/D,MAAA,KAA8C,CAC/C,EAAA,CAAA;EAEJ,SACE,kBAAA,GAAA,EAAA,UAAA;GACE,kBAAC,GAAD;IACE,SAAS;IACT,UAAU,EAAyB;IACnC,eAAe;KACb,EAAQ;IACV;cACD;GAEO,CAAA;GACP,MAAA,KACC,EAAyB,SACvB,EAAqB,kBACrB,kBAAC,GAAD;IACE,UAAU,EAAyB;IACnC,SAAS;IACT,SAAS;cACV;GAEO,CAAA;GAEX,MAAA,KACC,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;IACE,SAAS;IACT,eACE,EAAA,CAAiD;cAEpD;GAEO,CAAA,GACR,kBAAC,GAAD;IACE,SAAS;IACT,eAAe,EAAoB,SAAS,OAAO;IACnD,SAAS;IACT,UAAU,CAAC;cACZ;GAEO,CAAA,CACR,EAAA,CAAA;EAEJ,EAAA,CAAA;CAEL,CAAA;AAEL"}

package/dist/components/table/CsvPreview/CsvPreview.js.map

@@ -1 +1 @@
-{"version":3,"file":"CsvPreview.js","names":[],"sources":["../../../../src/components/table/CsvPreview/CsvPreview.tsx"],"sourcesContent":["import { ErrorBanner } from '@/components/index'\nimport ColumnHeader from '@/components/TanStackTable/ColumnHeader'\nimport StyledTanStackTable from '@/components/TanStackTable/StyledTanStackTable'\nimport { useGetCsvPreview } from '@/synapse-queries/table/useGetCsvPreview'\nimport Typography from '@mui/material/Typography'\nimport {\n  ColumnModel,\n  CsvTableDescriptor,\n  TableRow,\n  UploadToTablePreviewResult,\n} from '@sage-bionetworks/synapse-client'\nimport {\n  createColumnHelper,\n  getCoreRowModel,\n  useReactTable,\n} from '@tanstack/react-table'\nimport noop from 'lodash-es/noop'\nimport { useEffect, useMemo } from 'react'\n\nexport type CsvPreviewProps = {\n  fileHandleId: string\n  csvTableDescriptor: CsvTableDescriptor\n  onCsvPreviewDataChange?: (data: UploadToTablePreviewResult) => void\n  onIsLoadingChange?: (isLoading: boolean) => void\n}\n\n/**\n * Given a file handle ID and CSV Table Descriptor, fetches and displays a preview of the CSV file as it would be parsed into a table.\n */\nexport default function CsvPreview(props: CsvPreviewProps) {\n  const {\n    fileHandleId,\n    csvTableDescriptor,\n    onCsvPreviewDataChange = noop,\n    onIsLoadingChange = noop,\n  } = props\n\n  const {\n    data: csvPreviewData,\n    isLoading,\n    error,\n  } = useGetCsvPreview({\n    concreteType:\n      'org.sagebionetworks.repo.model.table.UploadToTablePreviewRequest',\n    uploadFileHandleId: fileHandleId,\n    csvTableDescriptor,\n  })\n\n  useEffect(() => {\n    if (csvPreviewData) {\n      onCsvPreviewDataChange(csvPreviewData)\n    }\n  }, [csvPreviewData, onCsvPreviewDataChange])\n\n  useEffect(() => {\n    onIsLoadingChange(isLoading)\n  }, [isLoading, onIsLoadingChange])\n\n  const tableData = useMemo(\n    () => csvPreviewData?.sampleRows ?? [],\n    [csvPreviewData?.sampleRows],\n  )\n\n  const columns = useMemo(\n    () => getPreviewColumns(csvPreviewData?.suggestedColumns ?? []),\n    [csvPreviewData?.suggestedColumns],\n  )\n\n  const table = useReactTable({\n    getCoreRowModel: getCoreRowModel(),\n    data: tableData,\n    columns: columns,\n  })\n\n  if (error) {\n    return <ErrorBanner error={error} />\n  }\n\n  return (\n    <>\n      {isLoading && <div>Loading preview...</div>}\n      {!isLoading && csvPreviewData && table && (\n        <>\n          <Typography variant={'body1'}>\n            Scanned {csvPreviewData?.rowsScanned?.toLocaleString()} rows to\n            generate preview:\n          </Typography>\n          <StyledTanStackTable table={table} />\n        </>\n      )}\n    </>\n  )\n}\n\nfunction getPreviewColumns(columnModels: ColumnModel[]) {\n  const columnHelper = createColumnHelper<TableRow>()\n  return columnModels.map((columnModel, index) => {\n    return columnHelper.accessor(tr => tr.values![index], {\n      id: `column-${index}`,\n      header: props => (\n        <ColumnHeader\n          {...props}\n          wrap={true}\n          title={`${columnModel.name}\\n(${columnModel.columnType})`}\n        />\n      ),\n      enableColumnFilter: false,\n      enableSorting: false,\n    })\n  })\n}\n"],"mappings":";;;;;;;;;;;AA6BA,SAAwB,EAAW,GAAwB;CACzD,IAAM,EACJ,iBACA,uBACA,4BAAyB,GACzB,uBAAoB,MAClB,GAEE,EACJ,MAAM,GACN,cACA,aACE,EAAiB;EACnB,cACE;EACF,oBAAoB;EACpB;EACD,CAAC;AAQF,CANA,QAAgB;AACd,EAAI,KACF,EAAuB,EAAe;IAEvC,CAAC,GAAgB,EAAuB,CAAC,EAE5C,QAAgB;AACd,IAAkB,EAAU;IAC3B,CAAC,GAAW,EAAkB,CAAC;CAElC,IAAM,IAAY,QACV,GAAgB,cAAc,EAAE,EACtC,CAAC,GAAgB,WAAW,CAC7B,EAEK,IAAU,QACR,EAAkB,GAAgB,oBAAoB,EAAE,CAAC,EAC/D,CAAC,GAAgB,iBAAiB,CACnC,EAEK,IAAQ,EAAc;EAC1B,iBAAiB,GAAiB;EAClC,MAAM;EACG;EACV,CAAC;AAMF,QAJI,IACK,kBAAC,GAAD,EAAoB,UAAS,CAAA,GAIpC,kBAAA,GAAA,EAAA,UAAA,CACG,KAAa,kBAAC,OAAD,EAAA,UAAK,sBAAwB,CAAA,EAC1C,CAAC,KAAa,KAAkB,KAC/B,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;EAAY,SAAS;YAArB;GAA8B;GACnB,GAAgB,aAAa,gBAAgB;GAAC;GAE5C;KACb,kBAAC,GAAD,EAA4B,UAAS,CAAA,CACpC,EAAA,CAAA,CAEJ,EAAA,CAAA;;AAIP,SAAS,EAAkB,GAA6B;CACtD,IAAM,IAAe,GAA8B;AACnD,QAAO,EAAa,KAAK,GAAa,MAC7B,EAAa,UAAS,MAAM,EAAG,OAAQ,IAAQ;EACpD,IAAI,UAAU;EACd,SAAQ,MACN,kBAAC,GAAD;GACE,GAAI;GACJ,MAAM;GACN,OAAO,GAAG,EAAY,KAAK,KAAK,EAAY,WAAW;GACvD,CAAA;EAEJ,oBAAoB;EACpB,eAAe;EAChB,CAAC,CACF"}
+{"version":3,"file":"CsvPreview.js","names":[],"sources":["../../../../src/components/table/CsvPreview/CsvPreview.tsx"],"sourcesContent":["import { ErrorBanner } from '@/components/index'\nimport ColumnHeader from '@/components/TanStackTable/ColumnHeader'\nimport StyledTanStackTable from '@/components/TanStackTable/StyledTanStackTable'\nimport { useGetCsvPreview } from '@/synapse-queries/table/useGetCsvPreview'\nimport Typography from '@mui/material/Typography'\nimport {\n  ColumnModel,\n  CsvTableDescriptor,\n  TableRow,\n  UploadToTablePreviewResult,\n} from '@sage-bionetworks/synapse-client'\nimport {\n  createColumnHelper,\n  getCoreRowModel,\n  useReactTable,\n} from '@tanstack/react-table'\nimport noop from 'lodash-es/noop'\nimport { useEffect, useMemo } from 'react'\n\nexport type CsvPreviewProps = {\n  fileHandleId: string\n  csvTableDescriptor: CsvTableDescriptor\n  onCsvPreviewDataChange?: (data: UploadToTablePreviewResult) => void\n  onIsLoadingChange?: (isLoading: boolean) => void\n}\n\n/**\n * Given a file handle ID and CSV Table Descriptor, fetches and displays a preview of the CSV file as it would be parsed into a table.\n */\nexport default function CsvPreview(props: CsvPreviewProps) {\n  const {\n    fileHandleId,\n    csvTableDescriptor,\n    onCsvPreviewDataChange = noop,\n    onIsLoadingChange = noop,\n  } = props\n\n  const {\n    data: csvPreviewData,\n    isLoading,\n    error,\n  } = useGetCsvPreview({\n    concreteType:\n      'org.sagebionetworks.repo.model.table.UploadToTablePreviewRequest',\n    uploadFileHandleId: fileHandleId,\n    csvTableDescriptor,\n  })\n\n  useEffect(() => {\n    if (csvPreviewData) {\n      onCsvPreviewDataChange(csvPreviewData)\n    }\n  }, [csvPreviewData, onCsvPreviewDataChange])\n\n  useEffect(() => {\n    onIsLoadingChange(isLoading)\n  }, [isLoading, onIsLoadingChange])\n\n  const tableData = useMemo(\n    () => csvPreviewData?.sampleRows ?? [],\n    [csvPreviewData?.sampleRows],\n  )\n\n  const columns = useMemo(\n    () => getPreviewColumns(csvPreviewData?.suggestedColumns ?? []),\n    [csvPreviewData?.suggestedColumns],\n  )\n\n  const table = useReactTable({\n    getCoreRowModel: getCoreRowModel(),\n    data: tableData,\n    columns: columns,\n  })\n\n  if (error) {\n    return <ErrorBanner error={error} />\n  }\n\n  return (\n    <>\n      {isLoading && <div>Loading preview...</div>}\n      {!isLoading && csvPreviewData && table && (\n        <>\n          <Typography variant={'body1'}>\n            Scanned {csvPreviewData?.rowsScanned?.toLocaleString()} rows to\n            generate preview:\n          </Typography>\n          <StyledTanStackTable table={table} />\n        </>\n      )}\n    </>\n  )\n}\n\nfunction getPreviewColumns(columnModels: ColumnModel[]) {\n  const columnHelper = createColumnHelper<TableRow>()\n  return columnModels.map((columnModel, index) => {\n    return columnHelper.accessor(tr => tr.values![index], {\n      id: `column-${index}`,\n      header: props => (\n        <ColumnHeader\n          {...props}\n          wrap={true}\n          title={`${columnModel.name}\\n(${columnModel.columnType})`}\n        />\n      ),\n      enableColumnFilter: false,\n      enableSorting: false,\n    })\n  })\n}\n"],"mappings":";;;;;;;;;;;AA6BA,SAAwB,EAAW,GAAwB;CACzD,IAAM,EACJ,iBACA,uBACA,4BAAyB,GACzB,uBAAoB,MAClB,GAEE,EACJ,MAAM,GACN,cACA,aACE,EAAiB;EACnB,cACE;EACF,oBAAoB;EACpB;CACF,CAAC;CAQD,AANA,QAAgB;EACd,AAAI,KACF,EAAuB,CAAc;CAEzC,GAAG,CAAC,GAAgB,CAAsB,CAAC,GAE3C,QAAgB;EACd,EAAkB,CAAS;CAC7B,GAAG,CAAC,GAAW,CAAiB,CAAC;CAEjC,IAAM,IAAY,QACV,GAAgB,cAAc,CAAC,GACrC,CAAC,GAAgB,UAAU,CAC7B,GAEM,IAAU,QACR,EAAkB,GAAgB,oBAAoB,CAAC,CAAC,GAC9D,CAAC,GAAgB,gBAAgB,CACnC,GAEM,IAAQ,EAAc;EAC1B,iBAAiB,EAAgB;EACjC,MAAM;EACG;CACX,CAAC;CAMD,OAJI,IACK,kBAAC,GAAD,EAAoB,SAAQ,CAAA,IAInC,kBAAA,GAAA,EAAA,UAAA,CACG,KAAa,kBAAC,OAAD,EAAA,UAAK,qBAAuB,CAAA,GACzC,CAAC,KAAa,KAAkB,KAC/B,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;EAAY,SAAS;YAArB;GAA8B;GACnB,GAAgB,aAAa,eAAe;GAAE;EAE7C;KACZ,kBAAC,GAAD,EAA4B,SAAQ,CAAA,CACpC,EAAA,CAAA,CAEJ,EAAA,CAAA;AAEN;AAEA,SAAS,EAAkB,GAA6B;CACtD,IAAM,IAAe,EAA6B;CAClD,OAAO,EAAa,KAAK,GAAa,MAC7B,EAAa,UAAS,MAAM,EAAG,OAAQ,IAAQ;EACpD,IAAI,UAAU;EACd,SAAQ,MACN,kBAAC,GAAD;GACE,GAAI;GACJ,MAAM;GACN,OAAO,GAAG,EAAY,KAAK,KAAK,EAAY,WAAW;EACxD,CAAA;EAEH,oBAAoB;EACpB,eAAe;CACjB,CAAC,CACF;AACH"}

package/dist/components/table/CsvPreview/CsvPreviewDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"CsvPreviewDialog.js","names":[],"sources":["../../../../src/components/table/CsvPreview/CsvPreviewDialog.tsx"],"sourcesContent":["import { DialogBase } from '@/components/DialogBase'\nimport { ErrorBanner } from '@/components/index'\nimport CsvUploadPreviewContent from '@/components/table/CsvPreview/CsvUploadPreviewContent'\nimport useCsvUploadPreview, {\n  CsvUploadPreviewStep,\n} from '@/components/table/CsvPreview/useCsvUploadPreview'\nimport Button from '@mui/material/Button'\nimport {\n  ColumnModel,\n  CsvTableDescriptor,\n} from '@sage-bionetworks/synapse-client'\nimport { useCallback } from 'react'\n\nexport type CsvPreviewDialogProps = {\n  /** Whether the dialog is open */\n  open: boolean\n  /** Callback when the dialog is closed */\n  onClose: () => void\n  /** Whether the confirm action is pending */\n  confirmIsPending?: boolean\n  /** An optional error message to display */\n  errorMessage?: string\n  /** Callback when the user confirms the column models\n   * @param dataFileHandleId - The file handle ID of the uploaded CSV\n   * @param columnModels - The confirmed column models\n   */\n  onConfirm: (\n    dataFileHandleId: string,\n    columnModels: ColumnModel[],\n    csvTableDescriptor: CsvTableDescriptor,\n  ) => void\n}\n\nexport default function CsvPreviewDialog(props: CsvPreviewDialogProps) {\n  const { open, onClose, onConfirm, confirmIsPending, errorMessage } = props\n\n  const csvUploadPreviewWorkflow = useCsvUploadPreview()\n\n  const handlePreviewConfirm = useCallback(() => {\n    const suggestedColumns =\n      csvUploadPreviewWorkflow.csvPreviewData?.suggestedColumns\n    if (!suggestedColumns) {\n      return\n    }\n\n    if (csvUploadPreviewWorkflow.uploadedFileHandleId != null) {\n      onConfirm(\n        csvUploadPreviewWorkflow.uploadedFileHandleId,\n        suggestedColumns,\n        csvUploadPreviewWorkflow.csvTableDescriptor,\n      )\n    }\n  }, [\n    csvUploadPreviewWorkflow.csvPreviewData,\n    csvUploadPreviewWorkflow.uploadedFileHandleId,\n    csvUploadPreviewWorkflow.csvTableDescriptor,\n    onConfirm,\n  ])\n\n  return (\n    <DialogBase\n      maxWidth={'lg'}\n      title={'Upload CSV'}\n      onCancel={onClose}\n      open={open}\n      content={\n        <>\n          <CsvUploadPreviewContent workflow={csvUploadPreviewWorkflow} />\n          {errorMessage && <ErrorBanner error={errorMessage} />}\n        </>\n      }\n      actions={\n        <>\n          <Button\n            variant={'outlined'}\n            disabled={csvUploadPreviewWorkflow.isLoadingPreview}\n            onClick={() => {\n              onClose()\n            }}\n          >\n            Cancel\n          </Button>\n          {csvUploadPreviewWorkflow.step ===\n            CsvUploadPreviewStep.COLUMN_PREVIEW && (\n            <Button\n              disabled={csvUploadPreviewWorkflow.isLoadingPreview}\n              variant={'contained'}\n              onClick={handlePreviewConfirm}\n              loading={confirmIsPending}\n            >\n              Confirm\n            </Button>\n          )}\n        </>\n      }\n    />\n  )\n}\n"],"mappings":";;;;;;;;;AAiCA,SAAwB,EAAiB,GAA8B;CACrE,IAAM,EAAE,SAAM,YAAS,cAAW,qBAAkB,oBAAiB,GAE/D,IAA2B,GAAqB,EAEhD,IAAuB,QAAkB;EAC7C,IAAM,IACJ,EAAyB,gBAAgB;AACtC,OAID,EAAyB,wBAAwB,QACnD,EACE,EAAyB,sBACzB,GACA,EAAyB,mBAC1B;IAEF;EACD,EAAyB;EACzB,EAAyB;EACzB,EAAyB;EACzB;EACD,CAAC;AAEF,QACE,kBAAC,GAAD;EACE,UAAU;EACV,OAAO;EACP,UAAU;EACJ;EACN,SACE,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD,EAAyB,UAAU,GAA4B,CAAA,EAC9D,KAAgB,kBAAC,GAAD,EAAa,OAAO,GAAgB,CAAA,CACpD,EAAA,CAAA;EAEL,SACE,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;GACE,SAAS;GACT,UAAU,EAAyB;GACnC,eAAe;AACb,OAAS;;aAEZ;GAEQ,CAAA,EACR,EAAyB,SACxB,EAAqB,kBACrB,kBAAC,GAAD;GACE,UAAU,EAAyB;GACnC,SAAS;GACT,SAAS;GACT,SAAS;aACV;GAEQ,CAAA,CAEV,EAAA,CAAA;EAEL,CAAA"}
+{"version":3,"file":"CsvPreviewDialog.js","names":[],"sources":["../../../../src/components/table/CsvPreview/CsvPreviewDialog.tsx"],"sourcesContent":["import { DialogBase } from '@/components/DialogBase'\nimport { ErrorBanner } from '@/components/index'\nimport CsvUploadPreviewContent from '@/components/table/CsvPreview/CsvUploadPreviewContent'\nimport useCsvUploadPreview, {\n  CsvUploadPreviewStep,\n} from '@/components/table/CsvPreview/useCsvUploadPreview'\nimport Button from '@mui/material/Button'\nimport {\n  ColumnModel,\n  CsvTableDescriptor,\n} from '@sage-bionetworks/synapse-client'\nimport { useCallback } from 'react'\n\nexport type CsvPreviewDialogProps = {\n  /** Whether the dialog is open */\n  open: boolean\n  /** Callback when the dialog is closed */\n  onClose: () => void\n  /** Whether the confirm action is pending */\n  confirmIsPending?: boolean\n  /** An optional error message to display */\n  errorMessage?: string\n  /** Callback when the user confirms the column models\n   * @param dataFileHandleId - The file handle ID of the uploaded CSV\n   * @param columnModels - The confirmed column models\n   */\n  onConfirm: (\n    dataFileHandleId: string,\n    columnModels: ColumnModel[],\n    csvTableDescriptor: CsvTableDescriptor,\n  ) => void\n}\n\nexport default function CsvPreviewDialog(props: CsvPreviewDialogProps) {\n  const { open, onClose, onConfirm, confirmIsPending, errorMessage } = props\n\n  const csvUploadPreviewWorkflow = useCsvUploadPreview()\n\n  const handlePreviewConfirm = useCallback(() => {\n    const suggestedColumns =\n      csvUploadPreviewWorkflow.csvPreviewData?.suggestedColumns\n    if (!suggestedColumns) {\n      return\n    }\n\n    if (csvUploadPreviewWorkflow.uploadedFileHandleId != null) {\n      onConfirm(\n        csvUploadPreviewWorkflow.uploadedFileHandleId,\n        suggestedColumns,\n        csvUploadPreviewWorkflow.csvTableDescriptor,\n      )\n    }\n  }, [\n    csvUploadPreviewWorkflow.csvPreviewData,\n    csvUploadPreviewWorkflow.uploadedFileHandleId,\n    csvUploadPreviewWorkflow.csvTableDescriptor,\n    onConfirm,\n  ])\n\n  return (\n    <DialogBase\n      maxWidth={'lg'}\n      title={'Upload CSV'}\n      onCancel={onClose}\n      open={open}\n      content={\n        <>\n          <CsvUploadPreviewContent workflow={csvUploadPreviewWorkflow} />\n          {errorMessage && <ErrorBanner error={errorMessage} />}\n        </>\n      }\n      actions={\n        <>\n          <Button\n            variant={'outlined'}\n            disabled={csvUploadPreviewWorkflow.isLoadingPreview}\n            onClick={() => {\n              onClose()\n            }}\n          >\n            Cancel\n          </Button>\n          {csvUploadPreviewWorkflow.step ===\n            CsvUploadPreviewStep.COLUMN_PREVIEW && (\n            <Button\n              disabled={csvUploadPreviewWorkflow.isLoadingPreview}\n              variant={'contained'}\n              onClick={handlePreviewConfirm}\n              loading={confirmIsPending}\n            >\n              Confirm\n            </Button>\n          )}\n        </>\n      }\n    />\n  )\n}\n"],"mappings":";;;;;;;;;AAiCA,SAAwB,EAAiB,GAA8B;CACrE,IAAM,EAAE,SAAM,YAAS,cAAW,qBAAkB,oBAAiB,GAE/D,IAA2B,EAAoB,GAE/C,IAAuB,QAAkB;EAC7C,IAAM,IACJ,EAAyB,gBAAgB;EACtC,KAID,EAAyB,wBAAwB,QACnD,EACE,EAAyB,sBACzB,GACA,EAAyB,kBAC3B;CAEJ,GAAG;EACD,EAAyB;EACzB,EAAyB;EACzB,EAAyB;EACzB;CACF,CAAC;CAED,OACE,kBAAC,GAAD;EACE,UAAU;EACV,OAAO;EACP,UAAU;EACJ;EACN,SACE,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD,EAAyB,UAAU,EAA2B,CAAA,GAC7D,KAAgB,kBAAC,GAAD,EAAa,OAAO,EAAe,CAAA,CACpD,EAAA,CAAA;EAEJ,SACE,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;GACE,SAAS;GACT,UAAU,EAAyB;GACnC,eAAe;IACb,EAAQ;GACV;aACD;EAEO,CAAA,GACP,EAAyB,SACxB,EAAqB,kBACrB,kBAAC,GAAD;GACE,UAAU,EAAyB;GACnC,SAAS;GACT,SAAS;GACT,SAAS;aACV;EAEO,CAAA,CAEV,EAAA,CAAA;CAEL,CAAA;AAEL"}

package/dist/components/table/CsvPreview/CsvPreviewWithOptions.js.map

@@ -1 +1 @@
-{"version":3,"file":"CsvPreviewWithOptions.js","names":[],"sources":["../../../../src/components/table/CsvPreview/CsvPreviewWithOptions.tsx"],"sourcesContent":["import { RefreshTwoTone } from '@mui/icons-material'\nimport ExpandMoreIcon from '@mui/icons-material/ExpandMore'\nimport {\n  Accordion,\n  AccordionDetails,\n  AccordionSummary,\n  Button,\n  Stack,\n  Typography,\n} from '@mui/material'\nimport {\n  CsvTableDescriptor,\n  UploadToTablePreviewResult,\n} from '@sage-bionetworks/synapse-client'\nimport CsvTableDescriptorForm, {\n  CsvTableDescriptorFormHandle,\n} from '@/components/table/CsvTableDescriptorForm/CsvTableDescriptorForm'\nimport { useRef } from 'react'\nimport CsvPreview from '@/components/table/CsvPreview/CsvPreview'\n\nexport type CsvPreviewWithOptionsProps = {\n  /** File handle ID of the uploaded CSV, or null if not yet uploaded */\n  fileHandleId: string | null\n  /** Current CSV parsing configuration */\n  csvTableDescriptor: CsvTableDescriptor\n  /** Called when the user clicks \"Refresh Preview\" with the form's current values */\n  onCsvTableDescriptorChange: (descriptor: CsvTableDescriptor) => void\n  /** Called when the CSV preview data is fetched */\n  onCsvPreviewDataChange?: (data: UploadToTablePreviewResult) => void\n  /** Called when the preview load state changes */\n  onIsLoadingChange?: (isLoading: boolean) => void\n}\n\n/**\n * Displays a CSV preview table with expandable parsing options.\n * For upload/preview flows, prefer useCsvUploadPreview with CsvUploadPreviewContent.\n */\nexport default function CsvPreviewWithOptions({\n  fileHandleId,\n  csvTableDescriptor,\n  onCsvTableDescriptorChange,\n  onCsvPreviewDataChange,\n  onIsLoadingChange,\n}: CsvPreviewWithOptionsProps) {\n  const csvDescriptorFormRef = useRef<CsvTableDescriptorFormHandle | null>(null)\n\n  return (\n    <Stack spacing={2}>\n      {fileHandleId && (\n        <CsvPreview\n          fileHandleId={fileHandleId}\n          csvTableDescriptor={csvTableDescriptor}\n          onCsvPreviewDataChange={onCsvPreviewDataChange}\n          onIsLoadingChange={onIsLoadingChange}\n        />\n      )}\n      <Accordion>\n        <AccordionSummary expandIcon={<ExpandMoreIcon />}>\n          <Typography variant={'headline3'}>Show Options</Typography>\n        </AccordionSummary>\n        <AccordionDetails>\n          <CsvTableDescriptorForm\n            defaultValue={csvTableDescriptor}\n            ref={csvDescriptorFormRef}\n          />\n          <Button\n            variant={'outlined'}\n            startIcon={<RefreshTwoTone />}\n            sx={{ mt: 2 }}\n            onClick={() => {\n              if (csvDescriptorFormRef.current) {\n                onCsvTableDescriptorChange(\n                  csvDescriptorFormRef.current.getFormData(),\n                )\n              }\n            }}\n          >\n            Refresh Preview\n          </Button>\n        </AccordionDetails>\n      </Accordion>\n    </Stack>\n  )\n}\n"],"mappings":";;;;;;;;AAqCA,SAAwB,EAAsB,EAC5C,iBACA,uBACA,+BACA,2BACA,wBAC6B;CAC7B,IAAM,IAAuB,EAA4C,KAAK;AAE9E,QACE,kBAAC,GAAD;EAAO,SAAS;YAAhB,CACG,KACC,kBAAC,GAAD;GACgB;GACM;GACI;GACL;GACnB,CAAA,EAEJ,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD;GAAkB,YAAY,kBAAC,GAAD,EAAkB,CAAA;aAC9C,kBAAC,GAAD;IAAY,SAAS;cAAa;IAAyB,CAAA;GAC1C,CAAA,EACnB,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD;GACE,cAAc;GACd,KAAK;GACL,CAAA,EACF,kBAAC,GAAD;GACE,SAAS;GACT,WAAW,kBAAC,GAAD,EAAkB,CAAA;GAC7B,IAAI,EAAE,IAAI,GAAG;GACb,eAAe;AACb,IAAI,EAAqB,WACvB,EACE,EAAqB,QAAQ,aAAa,CAC3C;;aAGN;GAEQ,CAAA,CACQ,EAAA,CAAA,CACT,EAAA,CAAA,CACN"}
+{"version":3,"file":"CsvPreviewWithOptions.js","names":[],"sources":["../../../../src/components/table/CsvPreview/CsvPreviewWithOptions.tsx"],"sourcesContent":["import { RefreshTwoTone } from '@mui/icons-material'\nimport ExpandMoreIcon from '@mui/icons-material/ExpandMore'\nimport {\n  Accordion,\n  AccordionDetails,\n  AccordionSummary,\n  Button,\n  Stack,\n  Typography,\n} from '@mui/material'\nimport {\n  CsvTableDescriptor,\n  UploadToTablePreviewResult,\n} from '@sage-bionetworks/synapse-client'\nimport CsvTableDescriptorForm, {\n  CsvTableDescriptorFormHandle,\n} from '@/components/table/CsvTableDescriptorForm/CsvTableDescriptorForm'\nimport { useRef } from 'react'\nimport CsvPreview from '@/components/table/CsvPreview/CsvPreview'\n\nexport type CsvPreviewWithOptionsProps = {\n  /** File handle ID of the uploaded CSV, or null if not yet uploaded */\n  fileHandleId: string | null\n  /** Current CSV parsing configuration */\n  csvTableDescriptor: CsvTableDescriptor\n  /** Called when the user clicks \"Refresh Preview\" with the form's current values */\n  onCsvTableDescriptorChange: (descriptor: CsvTableDescriptor) => void\n  /** Called when the CSV preview data is fetched */\n  onCsvPreviewDataChange?: (data: UploadToTablePreviewResult) => void\n  /** Called when the preview load state changes */\n  onIsLoadingChange?: (isLoading: boolean) => void\n}\n\n/**\n * Displays a CSV preview table with expandable parsing options.\n * For upload/preview flows, prefer useCsvUploadPreview with CsvUploadPreviewContent.\n */\nexport default function CsvPreviewWithOptions({\n  fileHandleId,\n  csvTableDescriptor,\n  onCsvTableDescriptorChange,\n  onCsvPreviewDataChange,\n  onIsLoadingChange,\n}: CsvPreviewWithOptionsProps) {\n  const csvDescriptorFormRef = useRef<CsvTableDescriptorFormHandle | null>(null)\n\n  return (\n    <Stack spacing={2}>\n      {fileHandleId && (\n        <CsvPreview\n          fileHandleId={fileHandleId}\n          csvTableDescriptor={csvTableDescriptor}\n          onCsvPreviewDataChange={onCsvPreviewDataChange}\n          onIsLoadingChange={onIsLoadingChange}\n        />\n      )}\n      <Accordion>\n        <AccordionSummary expandIcon={<ExpandMoreIcon />}>\n          <Typography variant={'headline3'}>Show Options</Typography>\n        </AccordionSummary>\n        <AccordionDetails>\n          <CsvTableDescriptorForm\n            defaultValue={csvTableDescriptor}\n            ref={csvDescriptorFormRef}\n          />\n          <Button\n            variant={'outlined'}\n            startIcon={<RefreshTwoTone />}\n            sx={{ mt: 2 }}\n            onClick={() => {\n              if (csvDescriptorFormRef.current) {\n                onCsvTableDescriptorChange(\n                  csvDescriptorFormRef.current.getFormData(),\n                )\n              }\n            }}\n          >\n            Refresh Preview\n          </Button>\n        </AccordionDetails>\n      </Accordion>\n    </Stack>\n  )\n}\n"],"mappings":";;;;;;;;AAqCA,SAAwB,EAAsB,EAC5C,iBACA,uBACA,+BACA,2BACA,wBAC6B;CAC7B,IAAM,IAAuB,EAA4C,IAAI;CAE7E,OACE,kBAAC,GAAD;EAAO,SAAS;YAAhB,CACG,KACC,kBAAC,GAAD;GACgB;GACM;GACI;GACL;EACpB,CAAA,GAEH,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD;GAAkB,YAAY,kBAAC,GAAD,CAAiB,CAAA;aAC7C,kBAAC,GAAD;IAAY,SAAS;cAAa;GAAwB,CAAA;EAC1C,CAAA,GAClB,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD;GACE,cAAc;GACd,KAAK;EACN,CAAA,GACD,kBAAC,GAAD;GACE,SAAS;GACT,WAAW,kBAAC,GAAD,CAAiB,CAAA;GAC5B,IAAI,EAAE,IAAI,EAAE;GACZ,eAAe;IACb,AAAI,EAAqB,WACvB,EACE,EAAqB,QAAQ,YAAY,CAC3C;GAEJ;aACD;EAEO,CAAA,CACQ,EAAA,CAAA,CACT,EAAA,CAAA,CACN;;AAEX"}

package/dist/components/table/CsvPreview/CsvUploadPreviewContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"CsvUploadPreviewContent.js","names":[],"sources":["../../../../src/components/table/CsvPreview/CsvUploadPreviewContent.tsx"],"sourcesContent":["import { useRef } from 'react'\nimport useCsvUploadPreview from './useCsvUploadPreview'\nimport {\n  BasicFileHandleUpload,\n  FileUploadHandle,\n} from '@/components/file/upload/BasicFileHandleUpload'\nimport { CsvUploadPreviewStep } from '@/components/table/CsvPreview/useCsvUploadPreview'\nimport CsvPreviewWithOptions from './CsvPreviewWithOptions'\n\nexport type CsvUploadPreviewContentProps = {\n  /**\n   * Shared upload/preview workflow state and callbacks from useCsvUploadPreview.\n   */\n  workflow: ReturnType<typeof useCsvUploadPreview>\n}\n\n/**\n * Renders the active CSV upload workflow step: file upload first, then preview/options.\n */\nexport default function CsvUploadPreviewContent({\n  workflow,\n}: CsvUploadPreviewContentProps) {\n  const {\n    step,\n    uploadedFileHandleId,\n    onFileUploaded,\n    csvTableDescriptor,\n    setCsvTableDescriptor,\n    setCsvPreviewData,\n    setIsLoadingPreview,\n  } = workflow\n\n  const uploadRef = useRef<FileUploadHandle | null>(null)\n\n  // Upload step\n  if (step === CsvUploadPreviewStep.UPLOAD_CSV) {\n    return (\n      <BasicFileHandleUpload\n        ref={uploadRef}\n        allowMultipleUpload={false}\n        onFileUploadComplete={onFileUploaded}\n        disableDragAndDrop={true}\n      />\n    )\n  }\n\n  // Preview step\n  return (\n    <CsvPreviewWithOptions\n      fileHandleId={uploadedFileHandleId}\n      csvTableDescriptor={csvTableDescriptor}\n      onCsvTableDescriptorChange={setCsvTableDescriptor}\n      onCsvPreviewDataChange={setCsvPreviewData}\n      onIsLoadingChange={setIsLoadingPreview}\n    />\n  )\n}\n"],"mappings":";;;;;;AAmBA,SAAwB,EAAwB,EAC9C,eAC+B;CAC/B,IAAM,EACJ,SACA,yBACA,mBACA,uBACA,0BACA,sBACA,2BACE,GAEE,IAAY,EAAgC,KAAK;AAevD,QAZI,MAAS,EAAqB,aAE9B,kBAAC,GAAD;EACE,KAAK;EACL,qBAAqB;EACrB,sBAAsB;EACtB,oBAAoB;EACpB,CAAA,GAMJ,kBAAC,GAAD;EACE,cAAc;EACM;EACpB,4BAA4B;EAC5B,wBAAwB;EACxB,mBAAmB;EACnB,CAAA"}
+{"version":3,"file":"CsvUploadPreviewContent.js","names":[],"sources":["../../../../src/components/table/CsvPreview/CsvUploadPreviewContent.tsx"],"sourcesContent":["import { useRef } from 'react'\nimport useCsvUploadPreview from './useCsvUploadPreview'\nimport {\n  BasicFileHandleUpload,\n  FileUploadHandle,\n} from '@/components/file/upload/BasicFileHandleUpload'\nimport { CsvUploadPreviewStep } from '@/components/table/CsvPreview/useCsvUploadPreview'\nimport CsvPreviewWithOptions from './CsvPreviewWithOptions'\n\nexport type CsvUploadPreviewContentProps = {\n  /**\n   * Shared upload/preview workflow state and callbacks from useCsvUploadPreview.\n   */\n  workflow: ReturnType<typeof useCsvUploadPreview>\n}\n\n/**\n * Renders the active CSV upload workflow step: file upload first, then preview/options.\n */\nexport default function CsvUploadPreviewContent({\n  workflow,\n}: CsvUploadPreviewContentProps) {\n  const {\n    step,\n    uploadedFileHandleId,\n    onFileUploaded,\n    csvTableDescriptor,\n    setCsvTableDescriptor,\n    setCsvPreviewData,\n    setIsLoadingPreview,\n  } = workflow\n\n  const uploadRef = useRef<FileUploadHandle | null>(null)\n\n  // Upload step\n  if (step === CsvUploadPreviewStep.UPLOAD_CSV) {\n    return (\n      <BasicFileHandleUpload\n        ref={uploadRef}\n        allowMultipleUpload={false}\n        onFileUploadComplete={onFileUploaded}\n        disableDragAndDrop={true}\n      />\n    )\n  }\n\n  // Preview step\n  return (\n    <CsvPreviewWithOptions\n      fileHandleId={uploadedFileHandleId}\n      csvTableDescriptor={csvTableDescriptor}\n      onCsvTableDescriptorChange={setCsvTableDescriptor}\n      onCsvPreviewDataChange={setCsvPreviewData}\n      onIsLoadingChange={setIsLoadingPreview}\n    />\n  )\n}\n"],"mappings":";;;;;;AAmBA,SAAwB,EAAwB,EAC9C,eAC+B;CAC/B,IAAM,EACJ,SACA,yBACA,mBACA,uBACA,0BACA,sBACA,2BACE,GAEE,IAAY,EAAgC,IAAI;CAetD,OAZI,MAAS,EAAqB,aAE9B,kBAAC,GAAD;EACE,KAAK;EACL,qBAAqB;EACrB,sBAAsB;EACtB,oBAAoB;CACrB,CAAA,IAMH,kBAAC,GAAD;EACE,cAAc;EACM;EACpB,4BAA4B;EAC5B,wBAAwB;EACxB,mBAAmB;CACpB,CAAA;AAEL"}

package/dist/components/table/CsvPreview/UpdateTableWithCsvDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"UpdateTableWithCsvDialog.js","names":[],"sources":["../../../../src/components/table/CsvPreview/UpdateTableWithCsvDialog.tsx"],"sourcesContent":["import { DialogBase } from '@/components/DialogBase'\nimport { displayToast } from '@/components/ToastMessage/ToastMessage'\nimport useCsvUploadPreview, {\n  CsvUploadPreviewStep,\n} from '@/components/table/CsvPreview/useCsvUploadPreview'\nimport Button from '@mui/material/Button'\nimport { useCallback } from 'react'\nimport useUploadCsvToExistingTable from './useUploadCsvToExistingTable'\nimport CsvUploadPreviewContent from './CsvUploadPreviewContent'\n\nexport type UpdateTableWithCsvDialogProps = {\n  /** Whether the dialog is open */\n  open: boolean\n  /** Callback when the dialog is closed */\n  onClose: () => void\n  /** If provided, upload csv rows to existing table */\n  tableId: string\n  /** Invoked after all backend operations successfully complete */\n  onSuccess?: () => void\n}\n\n/**\n * A dialog used to upload CSV data to an existing Synapse Table entity.\n * It handles a single-phase workflow:\n * 1. CSV Upload & Preview: Displays data preview and applies the rows directly\n * to the target table upon confirmation.\n */\nexport default function UpdateTableWithCsvDialog(\n  props: UpdateTableWithCsvDialogProps,\n) {\n  const { open, onClose, tableId, onSuccess } = props\n  const csvUploadPreviewWorkflow = useCsvUploadPreview()\n\n  const { mutate: uploadCsvToExistingTable, isPending: isUploading } =\n    useUploadCsvToExistingTable({\n      onSuccess() {\n        onSuccess?.()\n      },\n      onError(error) {\n        displayToast(error.message, 'danger')\n      },\n    })\n\n  const handleFinish = useCallback(() => {\n    // table already exists; upload csv rows directly to table\n    uploadCsvToExistingTable({\n      tableId,\n      csvTableDescriptor: csvUploadPreviewWorkflow.csvTableDescriptor,\n      fileHandleId: csvUploadPreviewWorkflow.uploadedFileHandleId!,\n    })\n  }, [\n    uploadCsvToExistingTable,\n    tableId,\n    csvUploadPreviewWorkflow.csvTableDescriptor,\n    csvUploadPreviewWorkflow.uploadedFileHandleId,\n  ])\n\n  return (\n    <DialogBase\n      maxWidth={'lg'}\n      title={'Upload CSV'}\n      onCancel={onClose}\n      open={open}\n      content={<CsvUploadPreviewContent workflow={csvUploadPreviewWorkflow} />}\n      actions={\n        <>\n          <Button\n            variant={'outlined'}\n            disabled={csvUploadPreviewWorkflow.isLoadingPreview}\n            onClick={() => {\n              onClose()\n            }}\n          >\n            Cancel\n          </Button>\n          {csvUploadPreviewWorkflow.step ===\n            CsvUploadPreviewStep.COLUMN_PREVIEW && (\n            <Button\n              disabled={csvUploadPreviewWorkflow.isLoadingPreview}\n              variant={'contained'}\n              onClick={handleFinish}\n              loading={isUploading}\n            >\n              Confirm\n            </Button>\n          )}\n        </>\n      }\n    />\n  )\n}\n"],"mappings":";;;;;;;;;AA2BA,SAAwB,EACtB,GACA;CACA,IAAM,EAAE,SAAM,YAAS,YAAS,iBAAc,GACxC,IAA2B,GAAqB,EAEhD,EAAE,QAAQ,GAA0B,WAAW,MACnD,EAA4B;EAC1B,YAAY;AACV,QAAa;;EAEf,QAAQ,GAAO;AACb,KAAa,EAAM,SAAS,SAAS;;EAExC,CAAC,EAEE,IAAe,QAAkB;AAErC,IAAyB;GACvB;GACA,oBAAoB,EAAyB;GAC7C,cAAc,EAAyB;GACxC,CAAC;IACD;EACD;EACA;EACA,EAAyB;EACzB,EAAyB;EAC1B,CAAC;AAEF,QACE,kBAAC,GAAD;EACE,UAAU;EACV,OAAO;EACP,UAAU;EACJ;EACN,SAAS,kBAAC,GAAD,EAAyB,UAAU,GAA4B,CAAA;EACxE,SACE,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;GACE,SAAS;GACT,UAAU,EAAyB;GACnC,eAAe;AACb,OAAS;;aAEZ;GAEQ,CAAA,EACR,EAAyB,SACxB,EAAqB,kBACrB,kBAAC,GAAD;GACE,UAAU,EAAyB;GACnC,SAAS;GACT,SAAS;GACT,SAAS;aACV;GAEQ,CAAA,CAEV,EAAA,CAAA;EAEL,CAAA"}
+{"version":3,"file":"UpdateTableWithCsvDialog.js","names":[],"sources":["../../../../src/components/table/CsvPreview/UpdateTableWithCsvDialog.tsx"],"sourcesContent":["import { DialogBase } from '@/components/DialogBase'\nimport { displayToast } from '@/components/ToastMessage/ToastMessage'\nimport useCsvUploadPreview, {\n  CsvUploadPreviewStep,\n} from '@/components/table/CsvPreview/useCsvUploadPreview'\nimport Button from '@mui/material/Button'\nimport { useCallback } from 'react'\nimport useUploadCsvToExistingTable from './useUploadCsvToExistingTable'\nimport CsvUploadPreviewContent from './CsvUploadPreviewContent'\n\nexport type UpdateTableWithCsvDialogProps = {\n  /** Whether the dialog is open */\n  open: boolean\n  /** Callback when the dialog is closed */\n  onClose: () => void\n  /** If provided, upload csv rows to existing table */\n  tableId: string\n  /** Invoked after all backend operations successfully complete */\n  onSuccess?: () => void\n}\n\n/**\n * A dialog used to upload CSV data to an existing Synapse Table entity.\n * It handles a single-phase workflow:\n * 1. CSV Upload & Preview: Displays data preview and applies the rows directly\n * to the target table upon confirmation.\n */\nexport default function UpdateTableWithCsvDialog(\n  props: UpdateTableWithCsvDialogProps,\n) {\n  const { open, onClose, tableId, onSuccess } = props\n  const csvUploadPreviewWorkflow = useCsvUploadPreview()\n\n  const { mutate: uploadCsvToExistingTable, isPending: isUploading } =\n    useUploadCsvToExistingTable({\n      onSuccess() {\n        onSuccess?.()\n      },\n      onError(error) {\n        displayToast(error.message, 'danger')\n      },\n    })\n\n  const handleFinish = useCallback(() => {\n    // table already exists; upload csv rows directly to table\n    uploadCsvToExistingTable({\n      tableId,\n      csvTableDescriptor: csvUploadPreviewWorkflow.csvTableDescriptor,\n      fileHandleId: csvUploadPreviewWorkflow.uploadedFileHandleId!,\n    })\n  }, [\n    uploadCsvToExistingTable,\n    tableId,\n    csvUploadPreviewWorkflow.csvTableDescriptor,\n    csvUploadPreviewWorkflow.uploadedFileHandleId,\n  ])\n\n  return (\n    <DialogBase\n      maxWidth={'lg'}\n      title={'Upload CSV'}\n      onCancel={onClose}\n      open={open}\n      content={<CsvUploadPreviewContent workflow={csvUploadPreviewWorkflow} />}\n      actions={\n        <>\n          <Button\n            variant={'outlined'}\n            disabled={csvUploadPreviewWorkflow.isLoadingPreview}\n            onClick={() => {\n              onClose()\n            }}\n          >\n            Cancel\n          </Button>\n          {csvUploadPreviewWorkflow.step ===\n            CsvUploadPreviewStep.COLUMN_PREVIEW && (\n            <Button\n              disabled={csvUploadPreviewWorkflow.isLoadingPreview}\n              variant={'contained'}\n              onClick={handleFinish}\n              loading={isUploading}\n            >\n              Confirm\n            </Button>\n          )}\n        </>\n      }\n    />\n  )\n}\n"],"mappings":";;;;;;;;;AA2BA,SAAwB,EACtB,GACA;CACA,IAAM,EAAE,SAAM,YAAS,YAAS,iBAAc,GACxC,IAA2B,EAAoB,GAE/C,EAAE,QAAQ,GAA0B,WAAW,MACnD,EAA4B;EAC1B,YAAY;GACV,IAAY;EACd;EACA,QAAQ,GAAO;GACb,EAAa,EAAM,SAAS,QAAQ;EACtC;CACF,CAAC,GAEG,IAAe,QAAkB;EAErC,EAAyB;GACvB;GACA,oBAAoB,EAAyB;GAC7C,cAAc,EAAyB;EACzC,CAAC;CACH,GAAG;EACD;EACA;EACA,EAAyB;EACzB,EAAyB;CAC3B,CAAC;CAED,OACE,kBAAC,GAAD;EACE,UAAU;EACV,OAAO;EACP,UAAU;EACJ;EACN,SAAS,kBAAC,GAAD,EAAyB,UAAU,EAA2B,CAAA;EACvE,SACE,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;GACE,SAAS;GACT,UAAU,EAAyB;GACnC,eAAe;IACb,EAAQ;GACV;aACD;EAEO,CAAA,GACP,EAAyB,SACxB,EAAqB,kBACrB,kBAAC,GAAD;GACE,UAAU,EAAyB;GACnC,SAAS;GACT,SAAS;GACT,SAAS;aACV;EAEO,CAAA,CAEV,EAAA,CAAA;CAEL,CAAA;AAEL"}

package/dist/components/table/CsvPreview/useCreateTableFromCsv.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCreateTableFromCsv.js","names":[],"sources":["../../../../src/components/table/CsvPreview/useCreateTableFromCsv.ts"],"sourcesContent":["import {\n  CsvTableDescriptor,\n  TableUpdateTransactionRequest,\n  TableUpdateTransactionResponse,\n} from '@sage-bionetworks/synapse-client'\nimport { useMutation, UseMutationOptions } from '@tanstack/react-query'\nimport {\n  Entity,\n  ColumnModel as SynapseTypesColumnModel,\n  Table,\n} from '@sage-bionetworks/synapse-types'\nimport { SetOptional } from 'type-fest'\nimport { SynapseClientError } from '@/utils/index'\nimport { useCreateEntity } from '@/synapse-queries'\nimport { useCreateColumnModels } from '@/synapse-queries/table/useColumnModel'\nimport { useTableUpdateTransaction } from '@/synapse-queries/table/useTableUpdateTransaction'\n\ntype CreateTableFromCsvProps = {\n  parentId: string\n  tableName: string\n  columnModels: SetOptional<SynapseTypesColumnModel, 'id'>[]\n  csvTableDescriptor: CsvTableDescriptor\n  fileHandleId: string\n}\n\n/**\n * Mutation hook that creates a new Synapse Table from a CSV.\n * Creates ColumnModels, creates the TableEntity, then uploads the CSV rows.\n */\nexport default function useCreateTableFromCsv(\n  options?: Omit<\n    UseMutationOptions<\n      TableUpdateTransactionResponse,\n      SynapseClientError,\n      CreateTableFromCsvProps\n    >,\n    'mutationFn'\n  >,\n) {\n  const { mutateAsync: createColumnModels } = useCreateColumnModels()\n  const { mutateAsync: createEntity } = useCreateEntity()\n  const { mutateAsync: updateTableInTransaction } = useTableUpdateTransaction()\n\n  return useMutation<\n    TableUpdateTransactionResponse,\n    SynapseClientError,\n    CreateTableFromCsvProps\n  >({\n    ...options,\n    mutationFn: async ({\n      parentId,\n      tableName,\n      columnModels,\n      csvTableDescriptor,\n      fileHandleId,\n    }) => {\n      const createdColumnModelResults = await createColumnModels(columnModels)\n\n      const entityToCreate: Entity = {\n        name: tableName,\n        parentId: parentId,\n        concreteType: 'org.sagebionetworks.repo.model.table.TableEntity',\n      }\n      ;(entityToCreate as Table)['columnIds'] = createdColumnModelResults.map(\n        cm => cm.id,\n      )\n\n      const newEntity = await createEntity(entityToCreate)\n\n      const tableUpdateRequest: TableUpdateTransactionRequest = {\n        concreteType:\n          'org.sagebionetworks.repo.model.table.TableUpdateTransactionRequest',\n        entityId: newEntity.id!,\n        changes: [\n          {\n            tableId: newEntity.id!,\n            uploadFileHandleId: fileHandleId,\n            csvTableDescriptor,\n            concreteType:\n              'org.sagebionetworks.repo.model.table.UploadToTableRequest',\n          },\n        ],\n      }\n\n      return updateTableInTransaction(tableUpdateRequest)\n    },\n  })\n}\n"],"mappings":";;;;;;AA6BA,SAAwB,EACtB,GAQA;CACA,IAAM,EAAE,aAAa,MAAuB,GAAuB,EAC7D,EAAE,aAAa,MAAiB,GAAiB,EACjD,EAAE,aAAa,MAA6B,GAA2B;AAE7E,QAAO,EAIL;EACA,GAAG;EACH,YAAY,OAAO,EACjB,aACA,cACA,iBACA,uBACA,sBACI;GACJ,IAAM,IAA4B,MAAM,EAAmB,EAAa,EAElE,IAAyB;IAC7B,MAAM;IACI;IACV,cAAc;IACf;AACC,KAAyB,YAAe,EAA0B,KAClE,MAAM,EAAG,GACV;GAED,IAAM,IAAY,MAAM,EAAa,EAAe;AAiBpD,UAAO,EAAyB;IAd9B,cACE;IACF,UAAU,EAAU;IACpB,SAAS,CACP;KACE,SAAS,EAAU;KACnB,oBAAoB;KACpB;KACA,cACE;KACH,CACF;IAG6B,CAAmB;;EAEtD,CAAC"}
+{"version":3,"file":"useCreateTableFromCsv.js","names":[],"sources":["../../../../src/components/table/CsvPreview/useCreateTableFromCsv.ts"],"sourcesContent":["import {\n  CsvTableDescriptor,\n  TableUpdateTransactionRequest,\n  TableUpdateTransactionResponse,\n} from '@sage-bionetworks/synapse-client'\nimport { useMutation, UseMutationOptions } from '@tanstack/react-query'\nimport {\n  Entity,\n  ColumnModel as SynapseTypesColumnModel,\n  Table,\n} from '@sage-bionetworks/synapse-types'\nimport { SetOptional } from 'type-fest'\nimport { SynapseClientError } from '@/utils/index'\nimport { useCreateEntity } from '@/synapse-queries'\nimport { useCreateColumnModels } from '@/synapse-queries/table/useColumnModel'\nimport { useTableUpdateTransaction } from '@/synapse-queries/table/useTableUpdateTransaction'\n\ntype CreateTableFromCsvProps = {\n  parentId: string\n  tableName: string\n  columnModels: SetOptional<SynapseTypesColumnModel, 'id'>[]\n  csvTableDescriptor: CsvTableDescriptor\n  fileHandleId: string\n}\n\n/**\n * Mutation hook that creates a new Synapse Table from a CSV.\n * Creates ColumnModels, creates the TableEntity, then uploads the CSV rows.\n */\nexport default function useCreateTableFromCsv(\n  options?: Omit<\n    UseMutationOptions<\n      TableUpdateTransactionResponse,\n      SynapseClientError,\n      CreateTableFromCsvProps\n    >,\n    'mutationFn'\n  >,\n) {\n  const { mutateAsync: createColumnModels } = useCreateColumnModels()\n  const { mutateAsync: createEntity } = useCreateEntity()\n  const { mutateAsync: updateTableInTransaction } = useTableUpdateTransaction()\n\n  return useMutation<\n    TableUpdateTransactionResponse,\n    SynapseClientError,\n    CreateTableFromCsvProps\n  >({\n    ...options,\n    mutationFn: async ({\n      parentId,\n      tableName,\n      columnModels,\n      csvTableDescriptor,\n      fileHandleId,\n    }) => {\n      const createdColumnModelResults = await createColumnModels(columnModels)\n\n      const entityToCreate: Entity = {\n        name: tableName,\n        parentId: parentId,\n        concreteType: 'org.sagebionetworks.repo.model.table.TableEntity',\n      }\n      ;(entityToCreate as Table)['columnIds'] = createdColumnModelResults.map(\n        cm => cm.id,\n      )\n\n      const newEntity = await createEntity(entityToCreate)\n\n      const tableUpdateRequest: TableUpdateTransactionRequest = {\n        concreteType:\n          'org.sagebionetworks.repo.model.table.TableUpdateTransactionRequest',\n        entityId: newEntity.id!,\n        changes: [\n          {\n            tableId: newEntity.id!,\n            uploadFileHandleId: fileHandleId,\n            csvTableDescriptor,\n            concreteType:\n              'org.sagebionetworks.repo.model.table.UploadToTableRequest',\n          },\n        ],\n      }\n\n      return updateTableInTransaction(tableUpdateRequest)\n    },\n  })\n}\n"],"mappings":";;;;;;AA6BA,SAAwB,EACtB,GAQA;CACA,IAAM,EAAE,aAAa,MAAuB,EAAsB,GAC5D,EAAE,aAAa,MAAiB,EAAgB,GAChD,EAAE,aAAa,MAA6B,EAA0B;CAE5E,OAAO,EAIL;EACA,GAAG;EACH,YAAY,OAAO,EACjB,aACA,cACA,iBACA,uBACA,sBACI;GACJ,IAAM,IAA4B,MAAM,EAAmB,CAAY,GAEjE,IAAyB;IAC7B,MAAM;IACI;IACV,cAAc;GAChB;GACC,EAA0B,YAAe,EAA0B,KAClE,MAAM,EAAG,EACX;GAEA,IAAM,IAAY,MAAM,EAAa,CAAc;GAiBnD,OAAO,EAAyB;IAd9B,cACE;IACF,UAAU,EAAU;IACpB,SAAS,CACP;KACE,SAAS,EAAU;KACnB,oBAAoB;KACpB;KACA,cACE;IACJ,CACF;GAG8B,CAAkB;EACpD;CACF,CAAC;AACH"}

package/dist/components/table/CsvPreview/useCsvUploadPreview.js

@@ -10,19 +10,19 @@ var n = {
 	return e[e.UPLOAD_CSV = 0] = "UPLOAD_CSV", e[e.COLUMN_PREVIEW = 1] = "COLUMN_PREVIEW", e;
 }({});
 function i() {
-	let [i, a] = t(r.UPLOAD_CSV), [o, s] = t(n), [c, l] = t(null), [u, d] = t(null), [f, p] = t(!1);
+	let [r, i] = t(0), [a, o] = t(n), [s, c] = t(null), [l, u] = t(null), [d, f] = t(!1);
 	return {
-		step: i,
-		setStep: a,
-		csvTableDescriptor: o,
-		setCsvTableDescriptor: s,
-		uploadedFileHandleId: c,
-		csvPreviewData: u,
-		setCsvPreviewData: d,
-		isLoadingPreview: f,
-		setIsLoadingPreview: p,
+		step: r,
+		setStep: i,
+		csvTableDescriptor: a,
+		setCsvTableDescriptor: o,
+		uploadedFileHandleId: s,
+		csvPreviewData: l,
+		setCsvPreviewData: u,
+		isLoadingPreview: d,
+		setIsLoadingPreview: f,
 		onFileUploaded: e((e) => {
-			l(e), a(r.COLUMN_PREVIEW);
+			c(e), i(1);
 		}, [])
 	};
 }

package/dist/components/table/CsvPreview/useCsvUploadPreview.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCsvUploadPreview.js","names":[],"sources":["../../../../src/components/table/CsvPreview/useCsvUploadPreview.ts"],"sourcesContent":["import { useCallback, useState } from 'react'\nimport {\n  CsvTableDescriptor,\n  UploadToTablePreviewResult,\n} from '@sage-bionetworks/synapse-client'\n\nconst DEFAULT_CSV_TABLE_DESCRIPTOR: CsvTableDescriptor = {\n  separator: ',',\n  quoteCharacter: '\"',\n  escapeCharacter: '\\\\',\n  lineEnd: '\\n',\n  isFirstLineHeader: true,\n}\n\nexport enum CsvUploadPreviewStep {\n  UPLOAD_CSV = 0,\n  COLUMN_PREVIEW = 1,\n}\n\n/**\n * Shared state and logic for CSV upload/preview dialogs.\n * Manages the common state needed for uploading a CSV file and previewing its contents.\n */\nexport default function useCsvUploadPreview() {\n  const [step, setStep] = useState(CsvUploadPreviewStep.UPLOAD_CSV)\n  const [csvTableDescriptor, setCsvTableDescriptor] =\n    useState<CsvTableDescriptor>(DEFAULT_CSV_TABLE_DESCRIPTOR)\n  const [uploadedFileHandleId, setUploadedFileHandleId] = useState<\n    string | null\n  >(null)\n  const [csvPreviewData, setCsvPreviewData] =\n    useState<UploadToTablePreviewResult | null>(null)\n  const [isLoadingPreview, setIsLoadingPreview] = useState(false)\n\n  const onFileUploaded = useCallback((fileHandleId: string) => {\n    setUploadedFileHandleId(fileHandleId)\n    setStep(CsvUploadPreviewStep.COLUMN_PREVIEW)\n  }, [])\n\n  return {\n    step,\n    setStep,\n    csvTableDescriptor,\n    setCsvTableDescriptor,\n    uploadedFileHandleId,\n    csvPreviewData,\n    setCsvPreviewData,\n    isLoadingPreview,\n    setIsLoadingPreview,\n    onFileUploaded,\n  }\n}\n"],"mappings":";;AAMA,IAAM,IAAmD;CACvD,WAAW;CACX,gBAAgB;CAChB,iBAAiB;CACjB,SAAS;CACT,mBAAmB;CACpB,EAEW,IAAL,yBAAA,GAAA;QACL,EAAA,EAAA,aAAa,KAAA,cACb,EAAA,EAAA,iBAAiB,KAAA;KAClB;AAMD,SAAwB,IAAsB;CAC5C,IAAM,CAAC,GAAM,KAAW,EAAS,EAAqB,WAAW,EAC3D,CAAC,GAAoB,KACzB,EAA6B,EAA6B,EACtD,CAAC,GAAsB,KAA2B,EAEtD,KAAK,EACD,CAAC,GAAgB,KACrB,EAA4C,KAAK,EAC7C,CAAC,GAAkB,KAAuB,EAAS,GAAM;AAO/D,QAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,gBAfqB,GAAa,MAAyB;AAE3D,GADA,EAAwB,EAAa,EACrC,EAAQ,EAAqB,eAAe;KAC3C,EAAE,CAYH;EACD"}
+{"version":3,"file":"useCsvUploadPreview.js","names":[],"sources":["../../../../src/components/table/CsvPreview/useCsvUploadPreview.ts"],"sourcesContent":["import { useCallback, useState } from 'react'\nimport {\n  CsvTableDescriptor,\n  UploadToTablePreviewResult,\n} from '@sage-bionetworks/synapse-client'\n\nconst DEFAULT_CSV_TABLE_DESCRIPTOR: CsvTableDescriptor = {\n  separator: ',',\n  quoteCharacter: '\"',\n  escapeCharacter: '\\\\',\n  lineEnd: '\\n',\n  isFirstLineHeader: true,\n}\n\nexport enum CsvUploadPreviewStep {\n  UPLOAD_CSV = 0,\n  COLUMN_PREVIEW = 1,\n}\n\n/**\n * Shared state and logic for CSV upload/preview dialogs.\n * Manages the common state needed for uploading a CSV file and previewing its contents.\n */\nexport default function useCsvUploadPreview() {\n  const [step, setStep] = useState(CsvUploadPreviewStep.UPLOAD_CSV)\n  const [csvTableDescriptor, setCsvTableDescriptor] =\n    useState<CsvTableDescriptor>(DEFAULT_CSV_TABLE_DESCRIPTOR)\n  const [uploadedFileHandleId, setUploadedFileHandleId] = useState<\n    string | null\n  >(null)\n  const [csvPreviewData, setCsvPreviewData] =\n    useState<UploadToTablePreviewResult | null>(null)\n  const [isLoadingPreview, setIsLoadingPreview] = useState(false)\n\n  const onFileUploaded = useCallback((fileHandleId: string) => {\n    setUploadedFileHandleId(fileHandleId)\n    setStep(CsvUploadPreviewStep.COLUMN_PREVIEW)\n  }, [])\n\n  return {\n    step,\n    setStep,\n    csvTableDescriptor,\n    setCsvTableDescriptor,\n    uploadedFileHandleId,\n    csvPreviewData,\n    setCsvPreviewData,\n    isLoadingPreview,\n    setIsLoadingPreview,\n    onFileUploaded,\n  }\n}\n"],"mappings":";;AAMA,IAAM,IAAmD;CACvD,WAAW;CACX,gBAAgB;CAChB,iBAAiB;CACjB,SAAS;CACT,mBAAmB;AACrB,GAEY,IAAL,yBAAA,GAAA;QACL,EAAA,EAAA,aAAA,KAAA,cACA,EAAA,EAAA,iBAAA,KAAA;AACF,EAAA,CAAA,CAAA;AAMA,SAAwB,IAAsB;CAC5C,IAAM,CAAC,GAAM,KAAW,EAAA,CAAwC,GAC1D,CAAC,GAAoB,KACzB,EAA6B,CAA4B,GACrD,CAAC,GAAsB,KAA2B,EAEtD,IAAI,GACA,CAAC,GAAgB,KACrB,EAA4C,IAAI,GAC5C,CAAC,GAAkB,KAAuB,EAAS,EAAK;CAO9D,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,gBAfqB,GAAa,MAAyB;GAE3D,AADA,EAAwB,CAAY,GACpC,EAAA,CAA2C;EAC7C,GAAG,CAAC,CAYF;CACF;AACF"}

package/dist/components/table/CsvPreview/useUploadCsvToExistingTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"useUploadCsvToExistingTable.js","names":[],"sources":["../../../../src/components/table/CsvPreview/useUploadCsvToExistingTable.ts"],"sourcesContent":["import {\n  CsvTableDescriptor,\n  TableUpdateTransactionRequest,\n  TableUpdateTransactionResponse,\n} from '@sage-bionetworks/synapse-client'\nimport { useMutation, UseMutationOptions } from '@tanstack/react-query'\nimport { SynapseClientError } from '@/utils/index'\nimport { useTableUpdateTransaction } from '@/synapse-queries/table/useTableUpdateTransaction'\n\ntype UploadCsvToExistingTableProps = {\n  tableId: string\n  csvTableDescriptor: CsvTableDescriptor\n  fileHandleId: string\n}\n\n/**\n * Mutation hook that uploads CSV rows to an existing Synapse Table.\n */\nexport default function useUploadCsvToExistingTable(\n  options?: Omit<\n    UseMutationOptions<\n      TableUpdateTransactionResponse,\n      SynapseClientError,\n      UploadCsvToExistingTableProps\n    >,\n    'mutationFn'\n  >,\n) {\n  const { mutateAsync: updateTableInTransaction } = useTableUpdateTransaction()\n\n  return useMutation<\n    TableUpdateTransactionResponse,\n    SynapseClientError,\n    UploadCsvToExistingTableProps\n  >({\n    ...options,\n    mutationFn: async ({ tableId, csvTableDescriptor, fileHandleId }) => {\n      const tableUpdateRequest: TableUpdateTransactionRequest = {\n        concreteType:\n          'org.sagebionetworks.repo.model.table.TableUpdateTransactionRequest',\n        entityId: tableId,\n        changes: [\n          {\n            tableId: tableId,\n            uploadFileHandleId: fileHandleId,\n            csvTableDescriptor,\n            concreteType:\n              'org.sagebionetworks.repo.model.table.UploadToTableRequest',\n          },\n        ],\n      }\n\n      return updateTableInTransaction(tableUpdateRequest)\n    },\n  })\n}\n"],"mappings":";;;AAkBA,SAAwB,EACtB,GAQA;CACA,IAAM,EAAE,aAAa,MAA6B,GAA2B;AAE7E,QAAO,EAIL;EACA,GAAG;EACH,YAAY,OAAO,EAAE,YAAS,uBAAoB,sBAgBzC,EAAyB;GAd9B,cACE;GACF,UAAU;GACV,SAAS,CACP;IACW;IACT,oBAAoB;IACpB;IACA,cACE;IACH,CACF;GAG6B,CAAmB;EAEtD,CAAC"}
+{"version":3,"file":"useUploadCsvToExistingTable.js","names":[],"sources":["../../../../src/components/table/CsvPreview/useUploadCsvToExistingTable.ts"],"sourcesContent":["import {\n  CsvTableDescriptor,\n  TableUpdateTransactionRequest,\n  TableUpdateTransactionResponse,\n} from '@sage-bionetworks/synapse-client'\nimport { useMutation, UseMutationOptions } from '@tanstack/react-query'\nimport { SynapseClientError } from '@/utils/index'\nimport { useTableUpdateTransaction } from '@/synapse-queries/table/useTableUpdateTransaction'\n\ntype UploadCsvToExistingTableProps = {\n  tableId: string\n  csvTableDescriptor: CsvTableDescriptor\n  fileHandleId: string\n}\n\n/**\n * Mutation hook that uploads CSV rows to an existing Synapse Table.\n */\nexport default function useUploadCsvToExistingTable(\n  options?: Omit<\n    UseMutationOptions<\n      TableUpdateTransactionResponse,\n      SynapseClientError,\n      UploadCsvToExistingTableProps\n    >,\n    'mutationFn'\n  >,\n) {\n  const { mutateAsync: updateTableInTransaction } = useTableUpdateTransaction()\n\n  return useMutation<\n    TableUpdateTransactionResponse,\n    SynapseClientError,\n    UploadCsvToExistingTableProps\n  >({\n    ...options,\n    mutationFn: async ({ tableId, csvTableDescriptor, fileHandleId }) => {\n      const tableUpdateRequest: TableUpdateTransactionRequest = {\n        concreteType:\n          'org.sagebionetworks.repo.model.table.TableUpdateTransactionRequest',\n        entityId: tableId,\n        changes: [\n          {\n            tableId: tableId,\n            uploadFileHandleId: fileHandleId,\n            csvTableDescriptor,\n            concreteType:\n              'org.sagebionetworks.repo.model.table.UploadToTableRequest',\n          },\n        ],\n      }\n\n      return updateTableInTransaction(tableUpdateRequest)\n    },\n  })\n}\n"],"mappings":";;;AAkBA,SAAwB,EACtB,GAQA;CACA,IAAM,EAAE,aAAa,MAA6B,EAA0B;CAE5E,OAAO,EAIL;EACA,GAAG;EACH,YAAY,OAAO,EAAE,YAAS,uBAAoB,sBAgBzC,EAAyB;GAd9B,cACE;GACF,UAAU;GACV,SAAS,CACP;IACW;IACT,oBAAoB;IACpB;IACA,cACE;GACJ,CACF;EAG8B,CAAkB;CAEtD,CAAC;AACH"}

package/dist/components/table/CsvTableDescriptorForm/CsvTableDescriptorForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"CsvTableDescriptorForm.js","names":[],"sources":["../../../../src/components/table/CsvTableDescriptorForm/CsvTableDescriptorForm.tsx"],"sourcesContent":["import RadioGroupWithOtherString from '@/components/form/RadioGroupWithOtherString'\nimport Checkbox from '@mui/material/Checkbox'\nimport FormControlLabel from '@mui/material/FormControlLabel'\nimport Grid from '@mui/material/Grid'\nimport InputLabel from '@mui/material/InputLabel'\nimport { CsvTableDescriptor } from '@sage-bionetworks/synapse-client'\nimport noop from 'lodash-es/noop'\nimport { useEffect, useImperativeHandle, useState, Ref } from 'react'\n\nconst DEFAULT_DESCRIPTOR_VALUE: CsvTableDescriptor = {\n  separator: ',',\n  quoteCharacter: '\"',\n  escapeCharacter: '\\\\',\n  lineEnd: '\\n',\n  isFirstLineHeader: true,\n}\n\nexport type CsvTableDescriptorFormHandle = {\n  /** Call to retrieve the current form data */\n  getFormData: () => CsvTableDescriptor\n}\n\nexport type CsvTableDescriptorFormProps = {\n  ref?: Ref<CsvTableDescriptorFormHandle>\n  /** The initial value of the form, if an uncontrolled form */\n  defaultValue?: CsvTableDescriptor\n  /** The current value of the form, if a controlled form */\n  value?: CsvTableDescriptor\n  /** Invoked when the form data changes */\n  onChange?: (descriptor: CsvTableDescriptor) => void\n}\n\n/**\n * A form to describe a CsvTableDescriptor\n */\nexport default function CsvTableDescriptorForm(\n  props: CsvTableDescriptorFormProps,\n) {\n  const { value: valueFromProps, onChange = noop } = props\n  const defaultValue =\n    valueFromProps ?? props.defaultValue ?? DEFAULT_DESCRIPTOR_VALUE\n\n  const [localStateValue, setLocalStateValue] =\n    useState<CsvTableDescriptor>(defaultValue)\n\n  const value = valueFromProps ?? localStateValue\n\n  useEffect(() => {\n    onChange(localStateValue)\n  }, [localStateValue, onChange])\n\n  useImperativeHandle(\n    props.ref,\n    () => ({\n      getFormData: () => value,\n    }),\n    [value],\n  )\n\n  return (\n    <Grid container spacing={2}>\n      <Grid size={{ xs: 12 }}>\n        <InputLabel>Separator</InputLabel>\n        <RadioGroupWithOtherString\n          radioGroupProps={{ row: true, name: 'separator' }}\n          value={value.separator ?? ','}\n          onChange={value =>\n            setLocalStateValue(current => ({\n              ...current,\n              separator: value,\n            }))\n          }\n          options={[\n            { value: ',', label: 'Comma' },\n            {\n              value: '\\t',\n              label: 'Tab',\n            },\n            {\n              value: ';',\n              label: 'Semicolon',\n            },\n          ]}\n        />\n      </Grid>\n      <Grid size={{ xs: 12 }}>\n        <InputLabel>Escape Character</InputLabel>\n        <RadioGroupWithOtherString\n          radioGroupProps={{ row: true, name: 'escapeCharacter' }}\n          value={value.escapeCharacter ?? '\\\\'}\n          onChange={value =>\n            setLocalStateValue(current => ({\n              ...current,\n              escapeCharacter: value,\n            }))\n          }\n          options={[{ value: '\\\\', label: 'Backslash' }]}\n        />\n      </Grid>\n      <Grid size={{ xs: 12 }}>\n        <FormControlLabel\n          control={<Checkbox />}\n          label={'First line is the header'}\n          checked={value.isFirstLineHeader}\n          onChange={(_e, checked) => {\n            setLocalStateValue(current => ({\n              ...current,\n              isFirstLineHeader: checked,\n            }))\n          }}\n        />\n      </Grid>\n    </Grid>\n  )\n}\n"],"mappings":";;;;;;;;;AASA,IAAM,IAA+C;CACnD,WAAW;CACX,gBAAgB;CAChB,iBAAiB;CACjB,SAAS;CACT,mBAAmB;CACpB;AAoBD,SAAwB,EACtB,GACA;CACA,IAAM,EAAE,OAAO,GAAgB,cAAW,MAAS,GAI7C,CAAC,GAAiB,KACtB,EAHA,KAAkB,EAAM,gBAAgB,EAGE,EAEtC,IAAQ,KAAkB;AAchC,QAZA,QAAgB;AACd,IAAS,EAAgB;IACxB,CAAC,GAAiB,EAAS,CAAC,EAE/B,EACE,EAAM,YACC,EACL,mBAAmB,GACpB,GACD,CAAC,EAAM,CACR,EAGC,kBAAC,GAAD;EAAM,WAAA;EAAU,SAAS;YAAzB;GACE,kBAAC,GAAD;IAAM,MAAM,EAAE,IAAI,IAAI;cAAtB,CACE,kBAAC,GAAD,EAAA,UAAY,aAAsB,CAAA,EAClC,kBAAC,GAAD;KACE,iBAAiB;MAAE,KAAK;MAAM,MAAM;MAAa;KACjD,OAAO,EAAM,aAAa;KAC1B,WAAU,MACR,GAAmB,OAAY;MAC7B,GAAG;MACH,WAAW;MACZ,EAAE;KAEL,SAAS;MACP;OAAE,OAAO;OAAK,OAAO;OAAS;MAC9B;OACE,OAAO;OACP,OAAO;OACR;MACD;OACE,OAAO;OACP,OAAO;OACR;MACF;KACD,CAAA,CACG;;GACP,kBAAC,GAAD;IAAM,MAAM,EAAE,IAAI,IAAI;cAAtB,CACE,kBAAC,GAAD,EAAA,UAAY,oBAA6B,CAAA,EACzC,kBAAC,GAAD;KACE,iBAAiB;MAAE,KAAK;MAAM,MAAM;MAAmB;KACvD,OAAO,EAAM,mBAAmB;KAChC,WAAU,MACR,GAAmB,OAAY;MAC7B,GAAG;MACH,iBAAiB;MAClB,EAAE;KAEL,SAAS,CAAC;MAAE,OAAO;MAAM,OAAO;MAAa,CAAC;KAC9C,CAAA,CACG;;GACP,kBAAC,GAAD;IAAM,MAAM,EAAE,IAAI,IAAI;cACpB,kBAAC,GAAD;KACE,SAAS,kBAAC,GAAD,EAAY,CAAA;KACrB,OAAO;KACP,SAAS,EAAM;KACf,WAAW,GAAI,MAAY;AACzB,SAAmB,OAAY;OAC7B,GAAG;OACH,mBAAmB;OACpB,EAAE;;KAEL,CAAA;IACG,CAAA;GACF"}
+{"version":3,"file":"CsvTableDescriptorForm.js","names":[],"sources":["../../../../src/components/table/CsvTableDescriptorForm/CsvTableDescriptorForm.tsx"],"sourcesContent":["import RadioGroupWithOtherString from '@/components/form/RadioGroupWithOtherString'\nimport Checkbox from '@mui/material/Checkbox'\nimport FormControlLabel from '@mui/material/FormControlLabel'\nimport Grid from '@mui/material/Grid'\nimport InputLabel from '@mui/material/InputLabel'\nimport { CsvTableDescriptor } from '@sage-bionetworks/synapse-client'\nimport noop from 'lodash-es/noop'\nimport { useEffect, useImperativeHandle, useState, Ref } from 'react'\n\nconst DEFAULT_DESCRIPTOR_VALUE: CsvTableDescriptor = {\n  separator: ',',\n  quoteCharacter: '\"',\n  escapeCharacter: '\\\\',\n  lineEnd: '\\n',\n  isFirstLineHeader: true,\n}\n\nexport type CsvTableDescriptorFormHandle = {\n  /** Call to retrieve the current form data */\n  getFormData: () => CsvTableDescriptor\n}\n\nexport type CsvTableDescriptorFormProps = {\n  ref?: Ref<CsvTableDescriptorFormHandle>\n  /** The initial value of the form, if an uncontrolled form */\n  defaultValue?: CsvTableDescriptor\n  /** The current value of the form, if a controlled form */\n  value?: CsvTableDescriptor\n  /** Invoked when the form data changes */\n  onChange?: (descriptor: CsvTableDescriptor) => void\n}\n\n/**\n * A form to describe a CsvTableDescriptor\n */\nexport default function CsvTableDescriptorForm(\n  props: CsvTableDescriptorFormProps,\n) {\n  const { value: valueFromProps, onChange = noop } = props\n  const defaultValue =\n    valueFromProps ?? props.defaultValue ?? DEFAULT_DESCRIPTOR_VALUE\n\n  const [localStateValue, setLocalStateValue] =\n    useState<CsvTableDescriptor>(defaultValue)\n\n  const value = valueFromProps ?? localStateValue\n\n  useEffect(() => {\n    onChange(localStateValue)\n  }, [localStateValue, onChange])\n\n  useImperativeHandle(\n    props.ref,\n    () => ({\n      getFormData: () => value,\n    }),\n    [value],\n  )\n\n  return (\n    <Grid container spacing={2}>\n      <Grid size={{ xs: 12 }}>\n        <InputLabel>Separator</InputLabel>\n        <RadioGroupWithOtherString\n          radioGroupProps={{ row: true, name: 'separator' }}\n          value={value.separator ?? ','}\n          onChange={value =>\n            setLocalStateValue(current => ({\n              ...current,\n              separator: value,\n            }))\n          }\n          options={[\n            { value: ',', label: 'Comma' },\n            {\n              value: '\\t',\n              label: 'Tab',\n            },\n            {\n              value: ';',\n              label: 'Semicolon',\n            },\n          ]}\n        />\n      </Grid>\n      <Grid size={{ xs: 12 }}>\n        <InputLabel>Escape Character</InputLabel>\n        <RadioGroupWithOtherString\n          radioGroupProps={{ row: true, name: 'escapeCharacter' }}\n          value={value.escapeCharacter ?? '\\\\'}\n          onChange={value =>\n            setLocalStateValue(current => ({\n              ...current,\n              escapeCharacter: value,\n            }))\n          }\n          options={[{ value: '\\\\', label: 'Backslash' }]}\n        />\n      </Grid>\n      <Grid size={{ xs: 12 }}>\n        <FormControlLabel\n          control={<Checkbox />}\n          label={'First line is the header'}\n          checked={value.isFirstLineHeader}\n          onChange={(_e, checked) => {\n            setLocalStateValue(current => ({\n              ...current,\n              isFirstLineHeader: checked,\n            }))\n          }}\n        />\n      </Grid>\n    </Grid>\n  )\n}\n"],"mappings":";;;;;;;;;AASA,IAAM,IAA+C;CACnD,WAAW;CACX,gBAAgB;CAChB,iBAAiB;CACjB,SAAS;CACT,mBAAmB;AACrB;AAoBA,SAAwB,EACtB,GACA;CACA,IAAM,EAAE,OAAO,GAAgB,cAAW,MAAS,GAI7C,CAAC,GAAiB,KACtB,EAHA,KAAkB,EAAM,gBAAgB,CAGC,GAErC,IAAQ,KAAkB;CAchC,OAZA,QAAgB;EACd,EAAS,CAAe;CAC1B,GAAG,CAAC,GAAiB,CAAQ,CAAC,GAE9B,EACE,EAAM,YACC,EACL,mBAAmB,EACrB,IACA,CAAC,CAAK,CACR,GAGE,kBAAC,GAAD;EAAM,WAAA;EAAU,SAAS;YAAzB;GACE,kBAAC,GAAD;IAAM,MAAM,EAAE,IAAI,GAAG;cAArB,CACE,kBAAC,GAAD,EAAA,UAAY,YAAqB,CAAA,GACjC,kBAAC,GAAD;KACE,iBAAiB;MAAE,KAAK;MAAM,MAAM;KAAY;KAChD,OAAO,EAAM,aAAa;KAC1B,WAAU,MACR,GAAmB,OAAY;MAC7B,GAAG;MACH,WAAW;KACb,EAAE;KAEJ,SAAS;MACP;OAAE,OAAO;OAAK,OAAO;MAAQ;MAC7B;OACE,OAAO;OACP,OAAO;MACT;MACA;OACE,OAAO;OACP,OAAO;MACT;KACF;IACD,CAAA,CACG;;GACN,kBAAC,GAAD;IAAM,MAAM,EAAE,IAAI,GAAG;cAArB,CACE,kBAAC,GAAD,EAAA,UAAY,mBAA4B,CAAA,GACxC,kBAAC,GAAD;KACE,iBAAiB;MAAE,KAAK;MAAM,MAAM;KAAkB;KACtD,OAAO,EAAM,mBAAmB;KAChC,WAAU,MACR,GAAmB,OAAY;MAC7B,GAAG;MACH,iBAAiB;KACnB,EAAE;KAEJ,SAAS,CAAC;MAAE,OAAO;MAAM,OAAO;KAAY,CAAC;IAC9C,CAAA,CACG;;GACN,kBAAC,GAAD;IAAM,MAAM,EAAE,IAAI,GAAG;cACnB,kBAAC,GAAD;KACE,SAAS,kBAAC,GAAD,CAAW,CAAA;KACpB,OAAO;KACP,SAAS,EAAM;KACf,WAAW,GAAI,MAAY;MACzB,GAAmB,OAAY;OAC7B,GAAG;OACH,mBAAmB;MACrB,EAAE;KACJ;IACD,CAAA;GACG,CAAA;EACF;;AAEV"}

package/dist/components/trash/TrashCanList.js.map

@@ -1 +1 @@
-{"version":3,"file":"TrashCanList.js","names":[],"sources":["../../../src/components/trash/TrashCanList.tsx"],"sourcesContent":["import {\n  useGetItemsInTrashCanInfinite,\n  usePurgeEntities,\n  useRestoreEntities,\n} from '@/synapse-queries/trash/useTrashCan'\nimport { formatDate } from '@/utils/functions/DateFormatter'\nimport { entityTypeToFriendlyName } from '@/utils/functions/EntityTypeUtils'\nimport { Alert, Box, Button, Typography } from '@mui/material'\nimport { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError'\nimport { TrashedEntity } from '@sage-bionetworks/synapse-types'\nimport {\n  ColumnDef,\n  createColumnHelper,\n  getCoreRowModel,\n  RowSelectionState,\n  Table,\n  useReactTable,\n} from '@tanstack/react-table'\nimport dayjs from 'dayjs'\nimport { useMemo, useState } from 'react'\nimport {\n  CheckBoxCell,\n  CheckBoxHeader,\n} from '../EntityHeaderTable/EntityHeaderTableCellRenderers'\nimport { EntityLink } from '../EntityLink'\nimport { BlockingLoader, SynapseSpinner } from '../LoadingScreen/LoadingScreen'\nimport WarningDialog from '../SynapseForm/WarningDialog'\nimport StyledTanStackTable from '../TanStackTable/StyledTanStackTable'\n\n/**\n * Convert an array of Promise results to an array of errors\n */\nfunction toSynapseClientErrorList(\n  results: PromiseSettledResult<void>[],\n): SynapseClientError[] {\n  return results\n    .filter(\n      (result): result is PromiseRejectedResult => result.status === 'rejected',\n    )\n    .map(result => result.reason as SynapseClientError)\n}\n\nconst columnHelper = createColumnHelper<TrashedEntity>()\n\nfunction getTrashCanColumns(\n  onRestore: (entityId: string) => void,\n): ColumnDef<TrashedEntity, any>[] {\n  return [\n    {\n      id: 'select',\n      header: CheckBoxHeader,\n      cell: CheckBoxCell,\n      maxSize: 50,\n    },\n    columnHelper.accessor('entityId', {\n      header: 'ID',\n    }),\n    columnHelper.accessor('entityName', {\n      header: 'Name',\n    }),\n    columnHelper.accessor('entityType', {\n      header: 'Entity Type',\n      cell: info => entityTypeToFriendlyName(info.getValue()),\n    }),\n    columnHelper.accessor('originalParentId', {\n      header: 'Location',\n      cell: info => (\n        <>\n          {info.getValue() && <EntityLink entity={info.getValue()} />} (\n          {info.getValue()})\n        </>\n      ),\n      size: 200,\n    }),\n    columnHelper.accessor('deletedOn', {\n      header: 'Deleted On',\n      cell: info => formatDate(dayjs(info.getValue())),\n    }),\n    {\n      id: 'restoreButton',\n      header: '',\n      cell: ({ row }) => (\n        <Button\n          size=\"small\"\n          variant=\"outlined\"\n          onClick={() => {\n            onRestore(row.original.entityId)\n            row.toggleSelected(false)\n          }}\n        >\n          Restore\n        </Button>\n      ),\n      maxSize: 100,\n    },\n  ]\n}\n\nexport function TrashCanList() {\n  const [showDeleteConfirmation, setShowDeleteConfirmation] = useState(false)\n  const [errors, setErrors] = useState<SynapseClientError[]>([])\n  const [rowSelection, setRowSelection] = useState<RowSelectionState>({})\n\n  /**\n   * When a mutation operation settles, update the list of errors and clear the selected set\n   */\n  function onMutateSettled(\n    results?: PromiseSettledResult<void>[],\n    error?: SynapseClientError | null,\n  ) {\n    if (results) {\n      setErrors(toSynapseClientErrorList(results))\n    } else if (error) {\n      setErrors([error])\n    }\n    setRowSelection({})\n  }\n\n  const { mutate: restore, isPending: isPendingRestore } = useRestoreEntities({\n    onSettled: onMutateSettled,\n  })\n  const { mutate: purge, isPending: isPendingPurge } = usePurgeEntities({\n    onSettled: onMutateSettled,\n  })\n\n  const isMutating = isPendingRestore || isPendingPurge\n\n  const { data, isLoading, hasNextPage, fetchNextPage, isFetchingNextPage } =\n    useGetItemsInTrashCanInfinite({\n      throwOnError: true,\n    })\n  const items = useMemo(\n    () => data?.pages.flatMap(page => page.results) ?? [],\n    [data],\n  )\n\n  const columns = useMemo<ColumnDef<TrashedEntity, any>[]>(\n    () =>\n      getTrashCanColumns(entityId => {\n        restore(entityId)\n      }),\n    [restore],\n  )\n\n  const table: Table<TrashedEntity> = useReactTable<TrashedEntity>({\n    data: items,\n    columns,\n    state: {\n      rowSelection: rowSelection,\n    },\n    getRowId: row => row.entityId,\n    enableRowSelection: true,\n    onRowSelectionChange: setRowSelection,\n    getCoreRowModel: getCoreRowModel(),\n    columnResizeMode: 'onChange',\n  })\n\n  const selectedEntityIds = table\n    .getSelectedRowModel()\n    .rows.map(row => row.original.entityId)\n\n  return (\n    <div>\n      <BlockingLoader\n        show={isMutating}\n        headlineText={isPendingPurge ? 'Deleting...' : 'Restoring...'}\n      />\n      <Typography variant=\"body1\">\n        The trash can contains items that were recently deleted. You can recover\n        deleted items in the trash can by clicking &quot;Restore&quot;. Items\n        will remain in the trash can for 30 days before being automatically\n        purged.\n      </Typography>\n      <WarningDialog\n        title=\"Delete selected items from your Trash?\"\n        content={\n          <Typography variant=\"body1\">\n            You can&apos;t undo this action.\n          </Typography>\n        }\n        confirmButtonText=\"Delete\"\n        confirmButtonColor=\"error\"\n        onConfirm={() => {\n          purge(selectedEntityIds)\n          setShowDeleteConfirmation(false)\n        }}\n        onCancel={() => {\n          setShowDeleteConfirmation(false)\n        }}\n        open={showDeleteConfirmation}\n      />\n      {isLoading && <SynapseSpinner />}\n      {!isLoading && items.length === 0 && (\n        <Alert severity={'info'} sx={{ my: 2 }}>\n          <Typography variant=\"body1\">\n            Your trash can is currently empty.\n          </Typography>\n        </Alert>\n      )}\n      {!isLoading && items.length > 0 && (\n        <>\n          <StyledTanStackTable\n            table={table}\n            styledTableContainerProps={{ sx: { my: 4 } }}\n          />\n          {errors.length > 0 && (\n            <Alert severity={'error'} sx={{ mb: 1 }}>\n              The following errors were encountered:\n              <ul style={{ marginBottom: 0 }}>\n                {errors.map(error => (\n                  <li key={error.message}>{error.message}</li>\n                ))}\n              </ul>\n            </Alert>\n          )}\n          <Box\n            sx={{\n              display: 'flex',\n              justifyContent: 'flex-end',\n              gap: 2,\n            }}\n          >\n            {hasNextPage && (\n              <Button\n                variant=\"contained\"\n                disabled={isFetchingNextPage}\n                onClick={() => {\n                  fetchNextPage()\n                }}\n              >\n                Load More\n              </Button>\n            )}\n            <div style={{ margin: 'auto' }} />\n            <Button\n              variant=\"contained\"\n              color=\"error\"\n              disabled={selectedEntityIds.length === 0}\n              onClick={() => {\n                setShowDeleteConfirmation(true)\n              }}\n            >\n              Delete Selected\n            </Button>\n            <Button\n              variant=\"outlined\"\n              disabled={selectedEntityIds.length === 0}\n              onClick={() => {\n                restore(selectedEntityIds)\n              }}\n            >\n              Restore Selected\n            </Button>\n          </Box>\n        </>\n      )}\n    </div>\n  )\n}\n\nexport default TrashCanList\n"],"mappings":"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"}
+{"version":3,"file":"TrashCanList.js","names":[],"sources":["../../../src/components/trash/TrashCanList.tsx"],"sourcesContent":["import {\n  useGetItemsInTrashCanInfinite,\n  usePurgeEntities,\n  useRestoreEntities,\n} from '@/synapse-queries/trash/useTrashCan'\nimport { formatDate } from '@/utils/functions/DateFormatter'\nimport { entityTypeToFriendlyName } from '@/utils/functions/EntityTypeUtils'\nimport { Alert, Box, Button, Typography } from '@mui/material'\nimport { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError'\nimport { TrashedEntity } from '@sage-bionetworks/synapse-types'\nimport {\n  ColumnDef,\n  createColumnHelper,\n  getCoreRowModel,\n  RowSelectionState,\n  Table,\n  useReactTable,\n} from '@tanstack/react-table'\nimport dayjs from 'dayjs'\nimport { useMemo, useState } from 'react'\nimport {\n  CheckBoxCell,\n  CheckBoxHeader,\n} from '../EntityHeaderTable/EntityHeaderTableCellRenderers'\nimport { EntityLink } from '../EntityLink'\nimport { BlockingLoader, SynapseSpinner } from '../LoadingScreen/LoadingScreen'\nimport WarningDialog from '../SynapseForm/WarningDialog'\nimport StyledTanStackTable from '../TanStackTable/StyledTanStackTable'\n\n/**\n * Convert an array of Promise results to an array of errors\n */\nfunction toSynapseClientErrorList(\n  results: PromiseSettledResult<void>[],\n): SynapseClientError[] {\n  return results\n    .filter(\n      (result): result is PromiseRejectedResult => result.status === 'rejected',\n    )\n    .map(result => result.reason as SynapseClientError)\n}\n\nconst columnHelper = createColumnHelper<TrashedEntity>()\n\nfunction getTrashCanColumns(\n  onRestore: (entityId: string) => void,\n): ColumnDef<TrashedEntity, any>[] {\n  return [\n    {\n      id: 'select',\n      header: CheckBoxHeader,\n      cell: CheckBoxCell,\n      maxSize: 50,\n    },\n    columnHelper.accessor('entityId', {\n      header: 'ID',\n    }),\n    columnHelper.accessor('entityName', {\n      header: 'Name',\n    }),\n    columnHelper.accessor('entityType', {\n      header: 'Entity Type',\n      cell: info => entityTypeToFriendlyName(info.getValue()),\n    }),\n    columnHelper.accessor('originalParentId', {\n      header: 'Location',\n      cell: info => (\n        <>\n          {info.getValue() && <EntityLink entity={info.getValue()} />} (\n          {info.getValue()})\n        </>\n      ),\n      size: 200,\n    }),\n    columnHelper.accessor('deletedOn', {\n      header: 'Deleted On',\n      cell: info => formatDate(dayjs(info.getValue())),\n    }),\n    {\n      id: 'restoreButton',\n      header: '',\n      cell: ({ row }) => (\n        <Button\n          size=\"small\"\n          variant=\"outlined\"\n          onClick={() => {\n            onRestore(row.original.entityId)\n            row.toggleSelected(false)\n          }}\n        >\n          Restore\n        </Button>\n      ),\n      maxSize: 100,\n    },\n  ]\n}\n\nexport function TrashCanList() {\n  const [showDeleteConfirmation, setShowDeleteConfirmation] = useState(false)\n  const [errors, setErrors] = useState<SynapseClientError[]>([])\n  const [rowSelection, setRowSelection] = useState<RowSelectionState>({})\n\n  /**\n   * When a mutation operation settles, update the list of errors and clear the selected set\n   */\n  function onMutateSettled(\n    results?: PromiseSettledResult<void>[],\n    error?: SynapseClientError | null,\n  ) {\n    if (results) {\n      setErrors(toSynapseClientErrorList(results))\n    } else if (error) {\n      setErrors([error])\n    }\n    setRowSelection({})\n  }\n\n  const { mutate: restore, isPending: isPendingRestore } = useRestoreEntities({\n    onSettled: onMutateSettled,\n  })\n  const { mutate: purge, isPending: isPendingPurge } = usePurgeEntities({\n    onSettled: onMutateSettled,\n  })\n\n  const isMutating = isPendingRestore || isPendingPurge\n\n  const { data, isLoading, hasNextPage, fetchNextPage, isFetchingNextPage } =\n    useGetItemsInTrashCanInfinite({\n      throwOnError: true,\n    })\n  const items = useMemo(\n    () => data?.pages.flatMap(page => page.results) ?? [],\n    [data],\n  )\n\n  const columns = useMemo<ColumnDef<TrashedEntity, any>[]>(\n    () =>\n      getTrashCanColumns(entityId => {\n        restore(entityId)\n      }),\n    [restore],\n  )\n\n  const table: Table<TrashedEntity> = useReactTable<TrashedEntity>({\n    data: items,\n    columns,\n    state: {\n      rowSelection: rowSelection,\n    },\n    getRowId: row => row.entityId,\n    enableRowSelection: true,\n    onRowSelectionChange: setRowSelection,\n    getCoreRowModel: getCoreRowModel(),\n    columnResizeMode: 'onChange',\n  })\n\n  const selectedEntityIds = table\n    .getSelectedRowModel()\n    .rows.map(row => row.original.entityId)\n\n  return (\n    <div>\n      <BlockingLoader\n        show={isMutating}\n        headlineText={isPendingPurge ? 'Deleting...' : 'Restoring...'}\n      />\n      <Typography variant=\"body1\">\n        The trash can contains items that were recently deleted. You can recover\n        deleted items in the trash can by clicking &quot;Restore&quot;. Items\n        will remain in the trash can for 30 days before being automatically\n        purged.\n      </Typography>\n      <WarningDialog\n        title=\"Delete selected items from your Trash?\"\n        content={\n          <Typography variant=\"body1\">\n            You can&apos;t undo this action.\n          </Typography>\n        }\n        confirmButtonText=\"Delete\"\n        confirmButtonColor=\"error\"\n        onConfirm={() => {\n          purge(selectedEntityIds)\n          setShowDeleteConfirmation(false)\n        }}\n        onCancel={() => {\n          setShowDeleteConfirmation(false)\n        }}\n        open={showDeleteConfirmation}\n      />\n      {isLoading && <SynapseSpinner />}\n      {!isLoading && items.length === 0 && (\n        <Alert severity={'info'} sx={{ my: 2 }}>\n          <Typography variant=\"body1\">\n            Your trash can is currently empty.\n          </Typography>\n        </Alert>\n      )}\n      {!isLoading && items.length > 0 && (\n        <>\n          <StyledTanStackTable\n            table={table}\n            styledTableContainerProps={{ sx: { my: 4 } }}\n          />\n          {errors.length > 0 && (\n            <Alert severity={'error'} sx={{ mb: 1 }}>\n              The following errors were encountered:\n              <ul style={{ marginBottom: 0 }}>\n                {errors.map(error => (\n                  <li key={error.message}>{error.message}</li>\n                ))}\n              </ul>\n            </Alert>\n          )}\n          <Box\n            sx={{\n              display: 'flex',\n              justifyContent: 'flex-end',\n              gap: 2,\n            }}\n          >\n            {hasNextPage && (\n              <Button\n                variant=\"contained\"\n                disabled={isFetchingNextPage}\n                onClick={() => {\n                  fetchNextPage()\n                }}\n              >\n                Load More\n              </Button>\n            )}\n            <div style={{ margin: 'auto' }} />\n            <Button\n              variant=\"contained\"\n              color=\"error\"\n              disabled={selectedEntityIds.length === 0}\n              onClick={() => {\n                setShowDeleteConfirmation(true)\n              }}\n            >\n              Delete Selected\n            </Button>\n            <Button\n              variant=\"outlined\"\n              disabled={selectedEntityIds.length === 0}\n              onClick={() => {\n                restore(selectedEntityIds)\n              }}\n            >\n              Restore Selected\n            </Button>\n          </Box>\n        </>\n      )}\n    </div>\n  )\n}\n\nexport default TrashCanList\n"],"mappings":"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"}

package/dist/components/utils/Blocker.js.map

@@ -1 +1 @@
-{"version":3,"file":"Blocker.js","names":[],"sources":["../../../src/components/utils/Blocker.tsx"],"sourcesContent":["import { ReactNode } from 'react'\nimport { useBlocker } from 'react-router'\n\n/**\n * Component wrapper for react-router `useBlocker` hook where the blocker is passed as a render prop. Use the hook when possible.\n * @constructor\n */\nexport default function Blocker(props: {\n  shouldBlock: Parameters<typeof useBlocker>[0]\n  children: (blocker: ReturnType<typeof useBlocker>) => ReactNode\n}) {\n  const blocker = useBlocker(props.shouldBlock)\n\n  return props.children(blocker)\n}\n"],"mappings":";;AAOA,SAAwB,EAAQ,GAG7B;CACD,IAAM,IAAU,EAAW,EAAM,YAAY;AAE7C,QAAO,EAAM,SAAS,EAAQ"}
+{"version":3,"file":"Blocker.js","names":[],"sources":["../../../src/components/utils/Blocker.tsx"],"sourcesContent":["import { ReactNode } from 'react'\nimport { useBlocker } from 'react-router'\n\n/**\n * Component wrapper for react-router `useBlocker` hook where the blocker is passed as a render prop. Use the hook when possible.\n * @constructor\n */\nexport default function Blocker(props: {\n  shouldBlock: Parameters<typeof useBlocker>[0]\n  children: (blocker: ReturnType<typeof useBlocker>) => ReactNode\n}) {\n  const blocker = useBlocker(props.shouldBlock)\n\n  return props.children(blocker)\n}\n"],"mappings":";;AAOA,SAAwB,EAAQ,GAG7B;CACD,IAAM,IAAU,EAAW,EAAM,WAAW;CAE5C,OAAO,EAAM,SAAS,CAAO;AAC/B"}

package/dist/components/utils/ConditionalWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"ConditionalWrapper.js","names":[],"sources":["../../../src/components/utils/ConditionalWrapper.tsx"],"sourcesContent":["import {\n  ComponentProps,\n  ComponentType,\n  PropsWithChildren,\n  ReactNode,\n} from 'react'\n\ntype ConditionalWrapperProps<\n  TWrapper extends ComponentType<PropsWithChildren> =\n    ComponentType<PropsWithChildren>,\n> = {\n  condition: boolean\n  wrapper: TWrapper\n  wrapperProps?: Omit<ComponentProps<TWrapper>, 'children'>\n  children: ReactNode\n}\n\nexport default function ConditionalWrapper(props: ConditionalWrapperProps) {\n  const { condition, wrapper: Wrapper, wrapperProps, children } = props\n\n  return condition ? (\n    <Wrapper {...wrapperProps}>{children}</Wrapper>\n  ) : (\n    <>{children}</>\n  )\n}\n"],"mappings":";;AAiBA,SAAwB,EAAmB,GAAgC;CACzE,IAAM,EAAE,cAAW,SAAS,GAAS,iBAAc,gBAAa;AAEhE,QAAO,IACL,kBAAC,GAAD;EAAS,GAAI;EAAe;EAAmB,CAAA,GAE/C,kBAAA,GAAA,EAAG,aAAY,CAAA"}
+{"version":3,"file":"ConditionalWrapper.js","names":[],"sources":["../../../src/components/utils/ConditionalWrapper.tsx"],"sourcesContent":["import {\n  ComponentProps,\n  ComponentType,\n  PropsWithChildren,\n  ReactNode,\n} from 'react'\n\ntype ConditionalWrapperProps<\n  TWrapper extends ComponentType<PropsWithChildren> =\n    ComponentType<PropsWithChildren>,\n> = {\n  condition: boolean\n  wrapper: TWrapper\n  wrapperProps?: Omit<ComponentProps<TWrapper>, 'children'>\n  children: ReactNode\n}\n\nexport default function ConditionalWrapper(props: ConditionalWrapperProps) {\n  const { condition, wrapper: Wrapper, wrapperProps, children } = props\n\n  return condition ? (\n    <Wrapper {...wrapperProps}>{children}</Wrapper>\n  ) : (\n    <>{children}</>\n  )\n}\n"],"mappings":";;AAiBA,SAAwB,EAAmB,GAAgC;CACzE,IAAM,EAAE,cAAW,SAAS,GAAS,iBAAc,gBAAa;CAEhE,OAAO,IACL,kBAAC,GAAD;EAAS,GAAI;EAAe;CAAkB,CAAA,IAE9C,kBAAA,GAAA,EAAG,YAAW,CAAA;AAElB"}