@oneblink/apps-react 0.6.2-beta.3 → 1.0.0-beta.2

package/dist/components/ErrorSnackbar.js

@@ -0,0 +1,49 @@
+import * as React from 'react';
+import clsx from 'clsx';
+import withStyles from '@mui/styles/withStyles';
+import IconButton from '@mui/material/IconButton';
+import Snackbar from '@mui/material/Snackbar';
+import SnackbarContent from '@mui/material/SnackbarContent';
+import ErrorIcon from '@mui/icons-material/Error';
+import CloseIcon from '@mui/icons-material/Close';
+const styles = (theme) => ({
+    snackbarContent: {
+        backgroundColor: theme.palette.error.dark,
+    },
+    icon: {
+        fontSize: 20,
+    },
+    iconVariant: {
+        marginRight: theme.spacing(2),
+    },
+    message: {
+        display: 'flex',
+        alignItems: 'center',
+    },
+});
+class ErrorSnackbar extends React.Component {
+    constructor() {
+        super(...arguments);
+        this.handleClose = (e, reason) => {
+            if (reason !== 'clickaway') {
+                this.props.onClose(null);
+            }
+        };
+    }
+    render() {
+        const { classes, open, children } = this.props;
+        return (React.createElement(Snackbar, { anchorOrigin: {
+                vertical: 'bottom',
+                horizontal: 'right',
+            }, open: open, onClose: this.handleClose },
+            React.createElement(SnackbarContent, { className: classes.snackbarContent, message: React.createElement("span", { className: classes.message },
+                    React.createElement(ErrorIcon, { className: clsx(classes.icon, classes.iconVariant) }),
+                    children), action: [
+                    // @ts-expect-error ???
+                    React.createElement(IconButton, { key: "close", "aria-label": "Close", color: "inherit", className: classes.close, onClick: this.handleClose, "data-cypress": "error-snackbar-close", size: "large" },
+                        React.createElement(CloseIcon, { className: classes.icon })),
+                ] })));
+    }
+}
+export default withStyles(styles)(ErrorSnackbar);
+//# sourceMappingURL=ErrorSnackbar.js.map

package/dist/components/ErrorSnackbar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ErrorSnackbar.js","sourceRoot":"","sources":["../../src/components/ErrorSnackbar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,IAAI,MAAM,MAAM,CAAA;AAEvB,OAAO,UAAU,MAAM,wBAAwB,CAAA;AAC/C,OAAO,UAAU,MAAM,0BAA0B,CAAA;AACjD,OAAO,QAAQ,MAAM,wBAAwB,CAAA;AAC7C,OAAO,eAAe,MAAM,+BAA+B,CAAA;AAC3D,OAAO,SAAS,MAAM,2BAA2B,CAAA;AACjD,OAAO,SAAS,MAAM,2BAA2B,CAAA;AAEjD,MAAM,MAAM,GAAG,CAAC,KAAY,EAAE,EAAE,CAAC,CAAC;IAChC,eAAe,EAAE;QACf,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI;KAC1C;IACD,IAAI,EAAE;QACJ,QAAQ,EAAE,EAAE;KACb;IACD,WAAW,EAAE;QACX,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;KAC9B;IACD,OAAO,EAAE;QACP,OAAO,EAAE,MAAM;QACf,UAAU,EAAE,QAAQ;KACrB;CACF,CAAC,CAAA;AAQF,MAAM,aAAc,SAAQ,KAAK,CAAC,SAIjC;IAJD;;QAKE,gBAAW,GAAG,CAAC,CAAU,EAAE,MAAc,EAAE,EAAE;YAC3C,IAAI,MAAM,KAAK,WAAW,EAAE;gBAC1B,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,CAAA;aACzB;QACH,CAAC,CAAA;IAuCH,CAAC;IArCC,MAAM;QACJ,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA;QAC9C,OAAO,CACL,oBAAC,QAAQ,IACP,YAAY,EAAE;gBACZ,QAAQ,EAAE,QAAQ;gBAClB,UAAU,EAAE,OAAO;aACpB,EACD,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,IAAI,CAAC,WAAW;YAEzB,oBAAC,eAAe,IACd,SAAS,EAAE,OAAO,CAAC,eAAe,EAClC,OAAO,EACL,8BAAM,SAAS,EAAE,OAAO,CAAC,OAAO;oBAC9B,oBAAC,SAAS,IAAC,SAAS,EAAE,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC,WAAW,CAAC,GAAI;oBAChE,QAAQ,CACJ,EAET,MAAM,EAAE;oBACN,uBAAuB;oBACvB,oBAAC,UAAU,IACT,GAAG,EAAC,OAAO,gBACA,OAAO,EAClB,KAAK,EAAC,SAAS,EACf,SAAS,EAAE,OAAO,CAAC,KAAK,EACxB,OAAO,EAAE,IAAI,CAAC,WAAW,kBACZ,sBAAsB,EACnC,IAAI,EAAC,OAAO;wBAEZ,oBAAC,SAAS,IAAC,SAAS,EAAE,OAAO,CAAC,IAAI,GAAI,CAC3B;iBACd,GACD,CACO,CACZ,CAAA;IACH,CAAC;CACF;AAED,eAAe,UAAU,CAAC,MAAM,CAAC,CAAC,aAAa,CAA+B,CAAA","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport { Theme } from '@mui/material/styles'\nimport withStyles from '@mui/styles/withStyles'\nimport IconButton from '@mui/material/IconButton'\nimport Snackbar from '@mui/material/Snackbar'\nimport SnackbarContent from '@mui/material/SnackbarContent'\nimport ErrorIcon from '@mui/icons-material/Error'\nimport CloseIcon from '@mui/icons-material/Close'\n\nconst styles = (theme: Theme) => ({\n  snackbarContent: {\n    backgroundColor: theme.palette.error.dark,\n  },\n  icon: {\n    fontSize: 20,\n  },\n  iconVariant: {\n    marginRight: theme.spacing(2),\n  },\n  message: {\n    display: 'flex',\n    alignItems: 'center',\n  },\n})\n\ntype Props = {\n  open: boolean\n  children: React.ReactNode\n  onClose: (arg: null) => unknown\n}\n\nclass ErrorSnackbar extends React.Component<\n  Props & {\n    classes: Record<string, string>\n  }\n> {\n  handleClose = (e: unknown, reason: string) => {\n    if (reason !== 'clickaway') {\n      this.props.onClose(null)\n    }\n  }\n\n  render() {\n    const { classes, open, children } = this.props\n    return (\n      <Snackbar\n        anchorOrigin={{\n          vertical: 'bottom',\n          horizontal: 'right',\n        }}\n        open={open}\n        onClose={this.handleClose}\n      >\n        <SnackbarContent\n          className={classes.snackbarContent}\n          message={\n            <span className={classes.message}>\n              <ErrorIcon className={clsx(classes.icon, classes.iconVariant)} />\n              {children}\n            </span>\n          }\n          action={[\n            // @ts-expect-error ???\n            <IconButton\n              key=\"close\"\n              aria-label=\"Close\"\n              color=\"inherit\"\n              className={classes.close}\n              onClick={this.handleClose}\n              data-cypress=\"error-snackbar-close\"\n              size=\"large\"\n            >\n              <CloseIcon className={classes.icon} />\n            </IconButton>,\n          ]}\n        />\n      </Snackbar>\n    )\n  }\n}\n\nexport default withStyles(styles)(ErrorSnackbar) as React.ComponentType<Props>\n"]}

package/dist/components/Lists.d.ts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+declare type Props = {
+    children: React.ReactNode;
+    disablePadding?: boolean;
+    spaced?: boolean;
+};
+export declare const OrderedList: React.ComponentType<Props>;
+export declare const UnorderedList: React.ComponentType<Props>;
+export declare const ListItem: React.ComponentType<Props>;
+export {};

package/dist/components/Lists.js

@@ -0,0 +1,43 @@
+import * as React from 'react';
+import clsx from 'clsx';
+import withStyles from '@mui/styles/withStyles';
+import Typography from '@mui/material/Typography';
+const styles = (theme) => ({
+    list: {
+        margin: 0,
+        padding: theme.spacing(1, 1, 1, 4),
+        '& > ul, & > ol': {
+            'padding-top': 0,
+            'padding-bottom': 0,
+        },
+    },
+    noPadding: {
+        'padding-top': 0,
+        'padding-bottom': 0,
+    },
+    listItem: {
+        display: 'list-item',
+    },
+    spacedLineHeight: {
+        lineHeight: 1.9,
+    },
+});
+function ol({ classes, disablePadding, children, ...props }) {
+    return (React.createElement("ol", { className: clsx(classes.list, {
+            [classes.noPadding]: disablePadding,
+        }), ...props }, children));
+}
+function ul({ classes, disablePadding, children, ...props }) {
+    return (React.createElement("ul", { className: clsx(classes.list, {
+            [classes.noPadding]: disablePadding,
+        }), ...props }, children));
+}
+function li({ classes, children, spaced, ...props }) {
+    return (React.createElement(Typography, { component: "li", color: "inherit", variant: "body2", className: clsx(classes.listItem, {
+            [classes.spacedLineHeight]: spaced,
+        }), ...props }, children));
+}
+export const OrderedList = withStyles(styles)(ol);
+export const UnorderedList = withStyles(styles)(ul);
+export const ListItem = withStyles(styles)(li);
+//# sourceMappingURL=Lists.js.map

package/dist/components/Lists.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Lists.js","sourceRoot":"","sources":["../../src/components/Lists.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,IAAI,MAAM,MAAM,CAAA;AAEvB,OAAO,UAAU,MAAM,wBAAwB,CAAA;AAC/C,OAAO,UAAU,MAAM,0BAA0B,CAAA;AAMjD,MAAM,MAAM,GAAG,CAAC,KAAY,EAAE,EAAE,CAAC,CAAC;IAChC,IAAI,EAAE;QACJ,MAAM,EAAE,CAAC;QACT,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;QAClC,gBAAgB,EAAE;YAChB,aAAa,EAAE,CAAC;YAChB,gBAAgB,EAAE,CAAC;SACpB;KACF;IACD,SAAS,EAAE;QACT,aAAa,EAAE,CAAC;QAChB,gBAAgB,EAAE,CAAC;KACpB;IACD,QAAQ,EAAE;QACR,OAAO,EAAE,WAAW;KACrB;IACD,gBAAgB,EAAE;QAChB,UAAU,EAAE,GAAG;KAChB;CACF,CAAC,CAAA;AAQF,SAAS,EAAE,CAAC,EACV,OAAO,EACP,cAAc,EACd,QAAQ,EACR,GAAG,KAAK,EACgB;IACxB,OAAO,CACL,4BACE,SAAS,EAAE,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE;YAC5B,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,cAAc;SACpC,CAAC,KACE,KAAK,IAER,QAAQ,CACN,CACN,CAAA;AACH,CAAC;AAED,SAAS,EAAE,CAAC,EACV,OAAO,EACP,cAAc,EACd,QAAQ,EACR,GAAG,KAAK,EACgB;IACxB,OAAO,CACL,4BACE,SAAS,EAAE,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE;YAC5B,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,cAAc;SACpC,CAAC,KACE,KAAK,IAER,QAAQ,CACN,CACN,CAAA;AACH,CAAC;AAED,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,KAAK,EAA2B;IAC1E,OAAO,CACL,oBAAC,UAAU,IACT,SAAS,EAAC,IAAI,EACd,KAAK,EAAC,SAAS,EACf,OAAO,EAAC,OAAO,EACf,SAAS,EAAE,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAE;YAChC,CAAC,OAAO,CAAC,gBAAgB,CAAC,EAAE,MAAM;SACnC,CAAC,KACE,KAAK,IAER,QAAQ,CACE,CACd,CAAA;AACH,CAAC;AAED,MAAM,CAAC,MAAM,WAAW,GAAG,UAAU,CAAC,MAAM,CAAC,CAAC,EAAE,CAA+B,CAAA;AAC/E,MAAM,CAAC,MAAM,aAAa,GAAG,UAAU,CAAC,MAAM,CAAC,CAC7C,EAAE,CAC2B,CAAA;AAC/B,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAAC,MAAM,CAAC,CAAC,EAAE,CAA+B,CAAA","sourcesContent":["import * as React from 'react'\nimport clsx from 'clsx'\nimport { Theme } from '@mui/material/styles'\nimport withStyles from '@mui/styles/withStyles'\nimport Typography from '@mui/material/Typography'\n\ninterface WithStylesProps {\n  classes: Record<string, string>\n}\n\nconst styles = (theme: Theme) => ({\n  list: {\n    margin: 0,\n    padding: theme.spacing(1, 1, 1, 4),\n    '& > ul, & > ol': {\n      'padding-top': 0,\n      'padding-bottom': 0,\n    },\n  },\n  noPadding: {\n    'padding-top': 0,\n    'padding-bottom': 0,\n  },\n  listItem: {\n    display: 'list-item',\n  },\n  spacedLineHeight: {\n    lineHeight: 1.9,\n  },\n})\n\ntype Props = {\n  children: React.ReactNode\n  disablePadding?: boolean\n  spaced?: boolean\n}\n\nfunction ol({\n  classes,\n  disablePadding,\n  children,\n  ...props\n}: Props & WithStylesProps) {\n  return (\n    <ol\n      className={clsx(classes.list, {\n        [classes.noPadding]: disablePadding,\n      })}\n      {...props}\n    >\n      {children}\n    </ol>\n  )\n}\n\nfunction ul({\n  classes,\n  disablePadding,\n  children,\n  ...props\n}: Props & WithStylesProps) {\n  return (\n    <ul\n      className={clsx(classes.list, {\n        [classes.noPadding]: disablePadding,\n      })}\n      {...props}\n    >\n      {children}\n    </ul>\n  )\n}\n\nfunction li({ classes, children, spaced, ...props }: Props & WithStylesProps) {\n  return (\n    <Typography\n      component=\"li\"\n      color=\"inherit\"\n      variant=\"body2\"\n      className={clsx(classes.listItem, {\n        [classes.spacedLineHeight]: spaced,\n      })}\n      {...props}\n    >\n      {children}\n    </Typography>\n  )\n}\n\nexport const OrderedList = withStyles(styles)(ol) as React.ComponentType<Props>\nexport const UnorderedList = withStyles(styles)(\n  ul,\n) as React.ComponentType<Props>\nexport const ListItem = withStyles(styles)(li) as React.ComponentType<Props>\n"]}

package/dist/components/LoadingWithMessage.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+declare type Props = {
+    message?: string;
+};
+declare const _default: React.NamedExoticComponent<Props>;
+export default _default;

package/dist/components/LoadingWithMessage.js

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import { Box, CircularProgress, Grid, Typography } from '@mui/material';
+const Loading = ({ message }) => {
+    return (React.createElement(Box, { p: 2 },
+        React.createElement(Grid, { container: true, spacing: 2 },
+            React.createElement(Grid, { xs: 12, container: true, item: true, justifyContent: "center" },
+                React.createElement(CircularProgress, null)),
+            message && (React.createElement(Grid, { xs: 12, container: true, item: true, justifyContent: "center" },
+                React.createElement(Typography, { variant: "body2", align: "center" }, message))))));
+};
+export default React.memo(Loading);
+//# sourceMappingURL=LoadingWithMessage.js.map

package/dist/components/LoadingWithMessage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoadingWithMessage.js","sourceRoot":"","sources":["../../src/components/LoadingWithMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,GAAG,EAAE,gBAAgB,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAKvE,MAAM,OAAO,GAAG,CAAC,EAAE,OAAO,EAAS,EAAE,EAAE;IACrC,OAAO,CACL,oBAAC,GAAG,IAAC,CAAC,EAAE,CAAC;QACP,oBAAC,IAAI,IAAC,SAAS,QAAC,OAAO,EAAE,CAAC;YACxB,oBAAC,IAAI,IAAC,EAAE,EAAE,EAAE,EAAE,SAAS,QAAC,IAAI,QAAC,cAAc,EAAC,QAAQ;gBAClD,oBAAC,gBAAgB,OAAoB,CAChC;YACN,OAAO,IAAI,CACV,oBAAC,IAAI,IAAC,EAAE,EAAE,EAAE,EAAE,SAAS,QAAC,IAAI,QAAC,cAAc,EAAC,QAAQ;gBAClD,oBAAC,UAAU,IAAC,OAAO,EAAC,OAAO,EAAC,KAAK,EAAC,QAAQ,IACvC,OAAO,CACG,CACR,CACR,CACI,CACH,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,KAAK,CAAC,IAAI,CAAQ,OAAO,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport { Box, CircularProgress, Grid, Typography } from '@mui/material'\ntype Props = {\n  message?: string\n}\n\nconst Loading = ({ message }: Props) => {\n  return (\n    <Box p={2}>\n      <Grid container spacing={2}>\n        <Grid xs={12} container item justifyContent=\"center\">\n          <CircularProgress></CircularProgress>\n        </Grid>\n        {message && (\n          <Grid xs={12} container item justifyContent=\"center\">\n            <Typography variant=\"body2\" align=\"center\">\n              {message}\n            </Typography>\n          </Grid>\n        )}\n      </Grid>\n    </Box>\n  )\n}\n\nexport default React.memo<Props>(Loading)\n"]}

package/dist/components/NoResourcesYet.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+declare type Props = {
+    IconComponent: React.ComponentType<{
+        className: string;
+    }>;
+    title: string;
+    gutterBottom?: boolean;
+    children?: React.ReactNode;
+};
+export declare function NoResourcesYet({ title, children, IconComponent, gutterBottom, }: Props): JSX.Element;
+declare const _default: React.NamedExoticComponent<Props>;
+export default _default;

package/dist/components/NoResourcesYet.js

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import LargeIconMessage from './messages/LargeIconMessage';
+export function NoResourcesYet({ title, children, IconComponent, gutterBottom, }) {
+    return (React.createElement(LargeIconMessage, { IconComponent: IconComponent, title: title, variant: "primary", gutterBottom: gutterBottom, gutterTop: true }, children));
+}
+export default React.memo(NoResourcesYet);
+//# sourceMappingURL=NoResourcesYet.js.map

package/dist/components/NoResourcesYet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NoResourcesYet.js","sourceRoot":"","sources":["../../src/components/NoResourcesYet.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,gBAAgB,MAAM,6BAA6B,CAAA;AAS1D,MAAM,UAAU,cAAc,CAAC,EAC7B,KAAK,EACL,QAAQ,EACR,aAAa,EACb,YAAY,GACN;IACN,OAAO,CACL,oBAAC,gBAAgB,IACf,aAAa,EAAE,aAAa,EAC5B,KAAK,EAAE,KAAK,EACZ,OAAO,EAAC,SAAS,EACjB,YAAY,EAAE,YAAY,EAC1B,SAAS,UAER,QAAQ,CACQ,CACpB,CAAA;AACH,CAAC;AACD,eAAe,KAAK,CAAC,IAAI,CAAQ,cAAc,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport LargeIconMessage from './messages/LargeIconMessage'\ntype Props = {\n  IconComponent: React.ComponentType<{\n    className: string\n  }>\n  title: string\n  gutterBottom?: boolean\n  children?: React.ReactNode\n}\nexport function NoResourcesYet({\n  title,\n  children,\n  IconComponent,\n  gutterBottom,\n}: Props) {\n  return (\n    <LargeIconMessage\n      IconComponent={IconComponent}\n      title={title}\n      variant=\"primary\"\n      gutterBottom={gutterBottom}\n      gutterTop\n    >\n      {children}\n    </LargeIconMessage>\n  )\n}\nexport default React.memo<Props>(NoResourcesYet)\n"]}

package/dist/components/formStore/ColumnsConfigurationButton.d.ts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+import { ColumnInstance } from 'react-table';
+import { Checkbox } from '@mui/material';
+import { SubmissionTypes } from '@oneblink/types';
+declare function ColumnsConfigurationButton({ allColumns, getToggleHideAllColumnsProps, }: {
+    allColumns: ColumnInstance<SubmissionTypes.FormStoreRecord>[];
+    getToggleHideAllColumnsProps: () => React.ComponentProps<typeof Checkbox>;
+}): JSX.Element;
+declare const _default: React.MemoExoticComponent<typeof ColumnsConfigurationButton>;
+export default _default;

package/dist/components/formStore/ColumnsConfigurationButton.js

@@ -0,0 +1,29 @@
+import * as React from 'react';
+import { Button, Checkbox, Dialog, DialogActions, DialogContent, DialogTitle, FormControlLabel, FormGroup, Typography, } from '@mui/material';
+import { Settings as SettingsIcon } from '@mui/icons-material';
+import useBooleanState from '../../hooks/useBooleanState';
+function ColumnsConfigurationButton({ allColumns, getToggleHideAllColumnsProps, }) {
+    const [isConfiguringColumns, showColumnConfiguration, hideColumnConfiguration,] = useBooleanState(false);
+    const toggleHideAllColumnsProps = getToggleHideAllColumnsProps();
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Button, { startIcon: React.createElement(SettingsIcon, null), onClick: showColumnConfiguration, variant: "outlined" }, "Columns"),
+        React.createElement(Dialog, { open: isConfiguringColumns, maxWidth: "sm", fullWidth: true, onClose: hideColumnConfiguration },
+            React.createElement(DialogTitle, null, "Column Configuration"),
+            React.createElement(DialogContent, { dividers: true },
+                React.createElement(FormGroup, null,
+                    React.createElement(FormControlLabel, { control: React.createElement(Checkbox, { ...toggleHideAllColumnsProps, indeterminate: !!toggleHideAllColumnsProps.indeterminate }), label: React.createElement("b", null, "Toggle All") }),
+                    allColumns.map((column) => {
+                        return (React.createElement(React.Fragment, { key: column.id },
+                            React.createElement(FormControlLabel, { control: React.createElement(Checkbox, { ...column.getToggleHiddenProps() }), label: React.createElement(React.Fragment, null,
+                                    column.headerText,
+                                    column.tooltip && (React.createElement(Typography, { component: "span", color: "textSecondary" },
+                                        ' ',
+                                        "(",
+                                        column.tooltip,
+                                        ")"))) })));
+                    }))),
+            React.createElement(DialogActions, null,
+                React.createElement(Button, { onClick: hideColumnConfiguration, color: "primary", variant: "contained" }, "Done")))));
+}
+export default React.memo(ColumnsConfigurationButton);
+//# sourceMappingURL=ColumnsConfigurationButton.js.map

package/dist/components/formStore/ColumnsConfigurationButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColumnsConfigurationButton.js","sourceRoot":"","sources":["../../../src/components/formStore/ColumnsConfigurationButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EACL,MAAM,EACN,QAAQ,EACR,MAAM,EACN,aAAa,EACb,aAAa,EACb,WAAW,EACX,gBAAgB,EAChB,SAAS,EACT,UAAU,GACX,MAAM,eAAe,CAAA;AACtB,OAAO,EAAE,QAAQ,IAAI,YAAY,EAAE,MAAM,qBAAqB,CAAA;AAC9D,OAAO,eAAe,MAAM,6BAA6B,CAAA;AAGzD,SAAS,0BAA0B,CAAC,EAClC,UAAU,EACV,4BAA4B,GAI7B;IACC,MAAM,CACJ,oBAAoB,EACpB,uBAAuB,EACvB,uBAAuB,EACxB,GAAG,eAAe,CAAC,KAAK,CAAC,CAAA;IAE1B,MAAM,yBAAyB,GAAG,4BAA4B,EAAE,CAAA;IAEhE,OAAO,CACL;QACE,oBAAC,MAAM,IACL,SAAS,EAAE,oBAAC,YAAY,OAAG,EAC3B,OAAO,EAAE,uBAAuB,EAChC,OAAO,EAAC,UAAU,cAGX;QACT,oBAAC,MAAM,IACL,IAAI,EAAE,oBAAoB,EAC1B,QAAQ,EAAC,IAAI,EACb,SAAS,QACT,OAAO,EAAE,uBAAuB;YAEhC,oBAAC,WAAW,+BAAmC;YAC/C,oBAAC,aAAa,IAAC,QAAQ;gBACrB,oBAAC,SAAS;oBACR,oBAAC,gBAAgB,IACf,OAAO,EACL,oBAAC,QAAQ,OACH,yBAAyB,EAC7B,aAAa,EAAE,CAAC,CAAC,yBAAyB,CAAC,aAAa,GACxD,EAEJ,KAAK,EAAE,4CAAiB,GACxB;oBACD,UAAU,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE;wBACzB,OAAO,CACL,oBAAC,KAAK,CAAC,QAAQ,IAAC,GAAG,EAAE,MAAM,CAAC,EAAE;4BAC5B,oBAAC,gBAAgB,IACf,OAAO,EAAE,oBAAC,QAAQ,OAAK,MAAM,CAAC,oBAAoB,EAAE,GAAI,EACxD,KAAK,EACH;oCACG,MAAM,CAAC,UAAU;oCACjB,MAAM,CAAC,OAAO,IAAI,CACjB,oBAAC,UAAU,IAAC,SAAS,EAAC,MAAM,EAAC,KAAK,EAAC,eAAe;wCAC/C,GAAG;;wCACF,MAAM,CAAC,OAAO;4CACL,CACd,CACA,GAEL,CACa,CAClB,CAAA;oBACH,CAAC,CAAC,CACQ,CACE;YAChB,oBAAC,aAAa;gBACZ,oBAAC,MAAM,IACL,OAAO,EAAE,uBAAuB,EAChC,KAAK,EAAC,SAAS,EACf,OAAO,EAAC,WAAW,WAGZ,CACK,CACT,CACR,CACJ,CAAA;AACH,CAAC;AAED,eAAe,KAAK,CAAC,IAAI,CAAC,0BAA0B,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport { ColumnInstance } from 'react-table'\nimport {\n  Button,\n  Checkbox,\n  Dialog,\n  DialogActions,\n  DialogContent,\n  DialogTitle,\n  FormControlLabel,\n  FormGroup,\n  Typography,\n} from '@mui/material'\nimport { Settings as SettingsIcon } from '@mui/icons-material'\nimport useBooleanState from '../../hooks/useBooleanState'\nimport { SubmissionTypes } from '@oneblink/types'\n\nfunction ColumnsConfigurationButton({\n  allColumns,\n  getToggleHideAllColumnsProps,\n}: {\n  allColumns: ColumnInstance<SubmissionTypes.FormStoreRecord>[]\n  getToggleHideAllColumnsProps: () => React.ComponentProps<typeof Checkbox>\n}) {\n  const [\n    isConfiguringColumns,\n    showColumnConfiguration,\n    hideColumnConfiguration,\n  ] = useBooleanState(false)\n\n  const toggleHideAllColumnsProps = getToggleHideAllColumnsProps()\n\n  return (\n    <>\n      <Button\n        startIcon={<SettingsIcon />}\n        onClick={showColumnConfiguration}\n        variant=\"outlined\"\n      >\n        Columns\n      </Button>\n      <Dialog\n        open={isConfiguringColumns}\n        maxWidth=\"sm\"\n        fullWidth\n        onClose={hideColumnConfiguration}\n      >\n        <DialogTitle>Column Configuration</DialogTitle>\n        <DialogContent dividers>\n          <FormGroup>\n            <FormControlLabel\n              control={\n                <Checkbox\n                  {...toggleHideAllColumnsProps}\n                  indeterminate={!!toggleHideAllColumnsProps.indeterminate}\n                />\n              }\n              label={<b>Toggle All</b>}\n            />\n            {allColumns.map((column) => {\n              return (\n                <React.Fragment key={column.id}>\n                  <FormControlLabel\n                    control={<Checkbox {...column.getToggleHiddenProps()} />}\n                    label={\n                      <>\n                        {column.headerText}\n                        {column.tooltip && (\n                          <Typography component=\"span\" color=\"textSecondary\">\n                            {' '}\n                            ({column.tooltip})\n                          </Typography>\n                        )}\n                      </>\n                    }\n                  />\n                </React.Fragment>\n              )\n            })}\n          </FormGroup>\n        </DialogContent>\n        <DialogActions>\n          <Button\n            onClick={hideColumnConfiguration}\n            color=\"primary\"\n            variant=\"contained\"\n          >\n            Done\n          </Button>\n        </DialogActions>\n      </Dialog>\n    </>\n  )\n}\n\nexport default React.memo(ColumnsConfigurationButton)\n"]}

package/dist/components/formStore/DownloadSubmissionDataButton.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import { Form } from '@oneblink/types/typescript/forms';
+import { ColumnInstance } from 'react-table';
+import { FormStoreRecord } from '@oneblink/types/typescript/submissions';
+import { formStoreService } from '@oneblink/apps';
+declare function DownloadSubmissionDataButton({ disabled, form, filters, visibleColumns, }: {
+    disabled: boolean;
+    form: Form;
+    filters?: formStoreService.FormStoreFilters;
+    visibleColumns: ColumnInstance<FormStoreRecord>[];
+}): JSX.Element;
+declare const _default: React.MemoExoticComponent<typeof DownloadSubmissionDataButton>;
+export default _default;

package/dist/components/formStore/DownloadSubmissionDataButton.js

@@ -0,0 +1,45 @@
+import * as React from 'react';
+import { Tooltip } from '@mui/material';
+import { LoadingButton } from '@mui/lab';
+import CsvIcon from '@mui/icons-material/Download';
+import ErrorSnackbar from '../ErrorSnackbar';
+import { formStoreService } from '@oneblink/apps';
+function DownloadSubmissionDataButton({ disabled, form, filters, visibleColumns, }) {
+    const [{ isDownloadingCsv, downloadingCsvError }, setState] = React.useState({
+        isDownloadingCsv: false,
+        downloadingCsvError: null,
+    });
+    const clearError = React.useCallback(() => {
+        setState({
+            isDownloadingCsv: false,
+            downloadingCsvError: null,
+        });
+    }, []);
+    const downloadCsv = React.useCallback(async () => {
+        setState({ isDownloadingCsv: true, downloadingCsvError: null });
+        try {
+            await formStoreService.exportFormStoreRecords(form.name, {
+                formId: form.id,
+                filters,
+                includeColumns: visibleColumns.map((visibleColumn) => visibleColumn.id),
+            });
+            setState({
+                isDownloadingCsv: false,
+                downloadingCsvError: null,
+            });
+        }
+        catch (error) {
+            setState({
+                isDownloadingCsv: false,
+                downloadingCsvError: error,
+            });
+        }
+    }, [form, filters, visibleColumns]);
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Tooltip, { title: "Download submission data as a CSV file" },
+            React.createElement(LoadingButton, { type: "button", loading: isDownloadingCsv, loadingPosition: "start", startIcon: React.createElement(CsvIcon, null), onClick: downloadCsv, color: "primary", variant: "outlined", disabled: disabled }, "Download")),
+        React.createElement(ErrorSnackbar, { open: !!downloadingCsvError, onClose: clearError },
+            React.createElement("span", { "data-cypress": "edit-dialog-error-message" }, downloadingCsvError && downloadingCsvError.message))));
+}
+export default React.memo(DownloadSubmissionDataButton);
+//# sourceMappingURL=DownloadSubmissionDataButton.js.map

package/dist/components/formStore/DownloadSubmissionDataButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DownloadSubmissionDataButton.js","sourceRoot":"","sources":["../../../src/components/formStore/DownloadSubmissionDataButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAA;AACxC,OAAO,OAAO,MAAM,8BAA8B,CAAA;AAElD,OAAO,aAAa,MAAM,kBAAkB,CAAA;AAG5C,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AAEjD,SAAS,4BAA4B,CAAC,EACpC,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,cAAc,GAMf;IACC,MAAM,CAAC,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,CAGzE;QACD,gBAAgB,EAAE,KAAK;QACvB,mBAAmB,EAAE,IAAI;KAC1B,CAAC,CAAA;IACF,MAAM,UAAU,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACxC,QAAQ,CAAC;YACP,gBAAgB,EAAE,KAAK;YACvB,mBAAmB,EAAE,IAAI;SAC1B,CAAC,CAAA;IACJ,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,IAAI,EAAE;QAC/C,QAAQ,CAAC,EAAE,gBAAgB,EAAE,IAAI,EAAE,mBAAmB,EAAE,IAAI,EAAE,CAAC,CAAA;QAC/D,IAAI;YACF,MAAM,gBAAgB,CAAC,sBAAsB,CAAC,IAAI,CAAC,IAAI,EAAE;gBACvD,MAAM,EAAE,IAAI,CAAC,EAAE;gBACf,OAAO;gBACP,cAAc,EAAE,cAAc,CAAC,GAAG,CAChC,CAAC,aAA8C,EAAE,EAAE,CAAC,aAAa,CAAC,EAAE,CACrE;aACF,CAAC,CAAA;YACF,QAAQ,CAAC;gBACP,gBAAgB,EAAE,KAAK;gBACvB,mBAAmB,EAAE,IAAI;aAC1B,CAAC,CAAA;SACH;QAAC,OAAO,KAAK,EAAE;YACd,QAAQ,CAAC;gBACP,gBAAgB,EAAE,KAAK;gBACvB,mBAAmB,EAAE,KAAc;aACpC,CAAC,CAAA;SACH;IACH,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,cAAc,CAAC,CAAC,CAAA;IAEnC,OAAO,CACL;QACE,oBAAC,OAAO,IAAC,KAAK,EAAC,wCAAwC;YACrD,oBAAC,aAAa,IACZ,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,gBAAgB,EACzB,eAAe,EAAC,OAAO,EACvB,SAAS,EAAE,oBAAC,OAAO,OAAG,EACtB,OAAO,EAAE,WAAW,EACpB,KAAK,EAAC,SAAS,EACf,OAAO,EAAC,UAAU,EAClB,QAAQ,EAAE,QAAQ,eAGJ,CACR;QAEV,oBAAC,aAAa,IAAC,IAAI,EAAE,CAAC,CAAC,mBAAmB,EAAE,OAAO,EAAE,UAAU;YAC7D,8CAAmB,2BAA2B,IAC3C,mBAAmB,IAAI,mBAAmB,CAAC,OAAO,CAC9C,CACO,CACf,CACJ,CAAA;AACH,CAAC;AACD,eAAe,KAAK,CAAC,IAAI,CAAC,4BAA4B,CAAC,CAAA","sourcesContent":["import * as React from 'react'\nimport { Tooltip } from '@mui/material'\nimport { LoadingButton } from '@mui/lab'\nimport CsvIcon from '@mui/icons-material/Download'\nimport { Form } from '@oneblink/types/typescript/forms'\nimport ErrorSnackbar from '../ErrorSnackbar'\nimport { ColumnInstance } from 'react-table'\nimport { FormStoreRecord } from '@oneblink/types/typescript/submissions'\nimport { formStoreService } from '@oneblink/apps'\n\nfunction DownloadSubmissionDataButton({\n  disabled,\n  form,\n  filters,\n  visibleColumns,\n}: {\n  disabled: boolean\n  form: Form\n  filters?: formStoreService.FormStoreFilters\n  visibleColumns: ColumnInstance<FormStoreRecord>[]\n}) {\n  const [{ isDownloadingCsv, downloadingCsvError }, setState] = React.useState<{\n    isDownloadingCsv: boolean\n    downloadingCsvError: Error | null\n  }>({\n    isDownloadingCsv: false,\n    downloadingCsvError: null,\n  })\n  const clearError = React.useCallback(() => {\n    setState({\n      isDownloadingCsv: false,\n      downloadingCsvError: null,\n    })\n  }, [])\n\n  const downloadCsv = React.useCallback(async () => {\n    setState({ isDownloadingCsv: true, downloadingCsvError: null })\n    try {\n      await formStoreService.exportFormStoreRecords(form.name, {\n        formId: form.id,\n        filters,\n        includeColumns: visibleColumns.map(\n          (visibleColumn: ColumnInstance<FormStoreRecord>) => visibleColumn.id,\n        ),\n      })\n      setState({\n        isDownloadingCsv: false,\n        downloadingCsvError: null,\n      })\n    } catch (error) {\n      setState({\n        isDownloadingCsv: false,\n        downloadingCsvError: error as Error,\n      })\n    }\n  }, [form, filters, visibleColumns])\n\n  return (\n    <>\n      <Tooltip title=\"Download submission data as a CSV file\">\n        <LoadingButton\n          type=\"button\"\n          loading={isDownloadingCsv}\n          loadingPosition=\"start\"\n          startIcon={<CsvIcon />}\n          onClick={downloadCsv}\n          color=\"primary\"\n          variant=\"outlined\"\n          disabled={disabled}\n        >\n          Download\n        </LoadingButton>\n      </Tooltip>\n\n      <ErrorSnackbar open={!!downloadingCsvError} onClose={clearError}>\n        <span data-cypress=\"edit-dialog-error-message\">\n          {downloadingCsvError && downloadingCsvError.message}\n        </span>\n      </ErrorSnackbar>\n    </>\n  )\n}\nexport default React.memo(DownloadSubmissionDataButton)\n"]}

package/dist/components/formStore/FormStore.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import { Form } from '@oneblink/types/typescript/forms';
+import { FormTypes } from '@oneblink/types';
+declare function FormStoreContainer({ form, formElements, }: {
+    form: Form;
+    formElements: FormTypes.FormElementWithName[];
+}): JSX.Element;
+declare const _default: React.MemoExoticComponent<typeof FormStoreContainer>;
+export default _default;

package/dist/components/formStore/FormStore.js

@@ -0,0 +1,103 @@
+import * as React from 'react';
+import { useHistory } from 'react-router-dom';
+import querystring from 'query-string';
+import { formStoreService } from '@oneblink/apps';
+import useInfiniteScrollDataLoad from '../../hooks/useInfiniteScrollDataLoad';
+import FormStoreTable from './table';
+import useFormStoreTable from './table/useFormStoreTable';
+import { Box, Button, Grid, Typography } from '@mui/material';
+import { FilterList as FilterIcon, Settings as SettingsIcon, Sync as SyncIcon, } from '@mui/icons-material';
+import useSubmissionIdValidationMessage, { validateIsUUID, } from '../../hooks/useSubmissionIdIsValid';
+import DownloadSubmissionDataButton from './DownloadSubmissionDataButton';
+import ColumnsConfigurationButton from './ColumnsConfigurationButton';
+import ErrorMessage from '../ErrorMessage';
+import LoadingWithMessage from '../LoadingWithMessage';
+import NoResourcesYet from '../NoResourcesYet';
+function FormStoreContainer({ form, formElements, }) {
+    var _a;
+    const history = useHistory();
+    const { isLoading, loadError, records: formStoreRecords, onTryAgain, onRefresh, filters, onChangeFilters, } = useInfiniteScrollDataLoad({
+        limit: 50,
+        debounceSearchMs: 1000,
+        onDefaultFilters: React.useCallback((query) => {
+            let filters = {};
+            try {
+                if (typeof query.filters === 'string') {
+                    filters = JSON.parse(query.filters);
+                }
+            }
+            catch (error) {
+                console.warn('Could not parse filter as JSON', error);
+            }
+            if (!filters.sorting) {
+                filters.sorting = [
+                    { property: 'dateTimeSubmitted', direction: 'descending' },
+                ];
+            }
+            return filters;
+        }, []),
+        onSearch: React.useCallback(async (filters, paging, abortSignal) => {
+            // Exclude all search parameters if searching
+            // for a specific submission using an identifier
+            const searchFilters = filters.submissionId
+                ? {
+                    submissionId: filters.submissionId,
+                }
+                : filters;
+            const result = await formStoreService.searchFormStoreRecords({
+                paging,
+                formId: form.id,
+                filters: searchFilters,
+            }, abortSignal);
+            return {
+                records: result.formStoreRecords,
+                meta: result.meta,
+            };
+        }, [form.id]),
+        onValidateFilters: React.useCallback((currentFilters) => {
+            var _a;
+            return validateIsUUID((_a = currentFilters.submissionId) === null || _a === void 0 ? void 0 : _a.$eq);
+        }, []),
+    });
+    React.useEffect(() => {
+        history.replace({
+            search: querystring.stringify({
+                filters: JSON.stringify(filters),
+            }),
+        });
+    }, [filters, history]);
+    const submissionIdValidationMessage = useSubmissionIdValidationMessage((_a = filters.submissionId) === null || _a === void 0 ? void 0 : _a.$eq);
+    const { getTableProps, getTableBodyProps, headerGroups, rows, prepareRow, allColumns, visibleColumns, getToggleHideAllColumnsProps, } = useFormStoreTable({
+        formStoreRecords,
+        filters,
+        onChangeFilters,
+        submissionIdValidationMessage,
+        form,
+        formElements,
+    });
+    return (React.createElement(Box, { padding: 2, paddingBottom: 16 },
+        React.createElement(Grid, { container: true, spacing: 2, alignItems: "center" },
+            React.createElement(Grid, { item: true, xs: true },
+                React.createElement(Typography, { variant: "h6" }, form === null || form === void 0 ? void 0 : form.name)),
+            React.createElement(Grid, { item: true, xs: false },
+                React.createElement(Button, { startIcon: React.createElement(FilterIcon, null), disabled: !Object.keys(filters).length, onClick: () => {
+                        onChangeFilters((currentFilters) => ({
+                            sorting: currentFilters.sorting,
+                        }), false);
+                    }, variant: "text" }, "Clear Filters")),
+            React.createElement(Grid, { item: true, xs: false },
+                React.createElement(ColumnsConfigurationButton, { allColumns: allColumns, getToggleHideAllColumnsProps: getToggleHideAllColumnsProps })),
+            React.createElement(Grid, { item: true, xs: false },
+                React.createElement(DownloadSubmissionDataButton, { disabled: false, form: form, filters: filters, visibleColumns: visibleColumns })),
+            React.createElement(Grid, { item: true, xs: false },
+                React.createElement(Button, { startIcon: React.createElement(SyncIcon, null), onClick: onRefresh, color: "primary", variant: "contained", disabled: !!submissionIdValidationMessage }, "Refresh")),
+            React.createElement(Grid, { item: true, xs: 12 },
+                visibleColumns.length ? (React.createElement(FormStoreTable, { isEmptyResults: !formStoreRecords.length && !isLoading && !loadError, getTableProps: getTableProps, getTableBodyProps: getTableBodyProps, headerGroups: headerGroups, rows: rows, prepareRow: prepareRow, onChangeFilters: onChangeFilters })) : (React.createElement(NoResourcesYet, { IconComponent: SettingsIcon, title: "No Columns Visible", gutterBottom: true }, "It looks like you have hidden all of the available columns. Please enable at least one column to view submissions.")),
+                isLoading && (React.createElement(LoadingWithMessage, { message: "Loading more records..." })),
+                loadError && (React.createElement(React.Fragment, null,
+                    React.createElement(ErrorMessage, { title: "Error Retrieving Submissions", gutterBottom: true, gutterTop: true }, loadError.message),
+                    React.createElement(Grid, { container: true, justifyContent: "center" },
+                        React.createElement(Button, { variant: "outlined", color: "primary", onClick: () => onTryAgain() }, "Try Again"))))))));
+}
+export default React.memo(FormStoreContainer);
+//# sourceMappingURL=FormStore.js.map

package/dist/components/formStore/FormStore.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormStore.js","sourceRoot":"","sources":["../../../src/components/formStore/FormStore.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport { useHistory } from 'react-router-dom'\nimport querystring from 'query-string'\nimport { FormStoreRecord } from '@oneblink/types/typescript/submissions'\nimport { formStoreService } from '@oneblink/apps'\nimport useInfiniteScrollDataLoad from '../../hooks/useInfiniteScrollDataLoad'\nimport FormStoreTable from './table'\nimport useFormStoreTable from './table/useFormStoreTable'\nimport { Box, Button, Grid, Typography } from '@mui/material'\nimport {\n  FilterList as FilterIcon,\n  Settings as SettingsIcon,\n  Sync as SyncIcon,\n} from '@mui/icons-material'\nimport { Form } from '@oneblink/types/typescript/forms'\nimport useSubmissionIdValidationMessage, {\n  validateIsUUID,\n} from '../../hooks/useSubmissionIdIsValid'\nimport { FormTypes } from '@oneblink/types'\nimport DownloadSubmissionDataButton from './DownloadSubmissionDataButton'\nimport ColumnsConfigurationButton from './ColumnsConfigurationButton'\nimport ErrorMessage from '../ErrorMessage'\nimport LoadingWithMessage from '../LoadingWithMessage'\nimport NoResourcesYet from '../NoResourcesYet'\n\nfunction FormStoreContainer({\n  form,\n  formElements,\n}: {\n  form: Form\n  formElements: FormTypes.FormElementWithName[]\n}) {\n  const history = useHistory()\n  const {\n    isLoading,\n    loadError,\n    records: formStoreRecords,\n    onTryAgain,\n    onRefresh,\n    filters,\n    onChangeFilters,\n  } = useInfiniteScrollDataLoad<\n    formStoreService.FormStoreFilters,\n    FormStoreRecord\n  >({\n    limit: 50,\n    debounceSearchMs: 1000,\n    onDefaultFilters: React.useCallback((query) => {\n      let filters: formStoreService.FormStoreFilters = {}\n      try {\n        if (typeof query.filters === 'string') {\n          filters = JSON.parse(query.filters)\n        }\n      } catch (error) {\n        console.warn('Could not parse filter as JSON', error)\n      }\n      if (!filters.sorting) {\n        filters.sorting = [\n          { property: 'dateTimeSubmitted', direction: 'descending' },\n        ]\n      }\n      return filters\n    }, []),\n    onSearch: React.useCallback(\n      async (filters, paging, abortSignal) => {\n        // Exclude all search parameters if searching\n        // for a specific submission using an identifier\n        const searchFilters = filters.submissionId\n          ? {\n              submissionId: filters.submissionId,\n            }\n          : filters\n        const result = await formStoreService.searchFormStoreRecords(\n          {\n            paging,\n            formId: form.id,\n            filters: searchFilters,\n          },\n          abortSignal,\n        )\n        return {\n          records: result.formStoreRecords,\n          meta: result.meta,\n        }\n      },\n      [form.id],\n    ),\n    onValidateFilters: React.useCallback(\n      (currentFilters: formStoreService.FormStoreFilters) => {\n        return validateIsUUID(currentFilters.submissionId?.$eq)\n      },\n      [],\n    ),\n  })\n\n  React.useEffect(() => {\n    history.replace({\n      search: querystring.stringify({\n        filters: JSON.stringify(filters),\n      }),\n    })\n  }, [filters, history])\n\n  const submissionIdValidationMessage = useSubmissionIdValidationMessage(\n    filters.submissionId?.$eq,\n  )\n\n  const {\n    getTableProps,\n    getTableBodyProps,\n    headerGroups,\n    rows,\n    prepareRow,\n    allColumns,\n    visibleColumns,\n    getToggleHideAllColumnsProps,\n  } = useFormStoreTable({\n    formStoreRecords,\n    filters,\n    onChangeFilters,\n    submissionIdValidationMessage,\n    form,\n    formElements,\n  })\n\n  return (\n    <Box padding={2} paddingBottom={16}>\n      <Grid container spacing={2} alignItems=\"center\">\n        <Grid item xs={true}>\n          <Typography variant=\"h6\">{form?.name}</Typography>\n        </Grid>\n        <Grid item xs={false}>\n          <Button\n            startIcon={<FilterIcon />}\n            disabled={!Object.keys(filters).length}\n            onClick={() => {\n              onChangeFilters(\n                (currentFilters) => ({\n                  sorting: currentFilters.sorting,\n                }),\n                false,\n              )\n            }}\n            variant=\"text\"\n          >\n            Clear Filters\n          </Button>\n        </Grid>\n        <Grid item xs={false}>\n          <ColumnsConfigurationButton\n            allColumns={allColumns}\n            getToggleHideAllColumnsProps={getToggleHideAllColumnsProps}\n          />\n        </Grid>\n        <Grid item xs={false}>\n          <DownloadSubmissionDataButton\n            disabled={false}\n            form={form}\n            filters={filters}\n            visibleColumns={visibleColumns}\n          />\n        </Grid>\n        <Grid item xs={false}>\n          <Button\n            startIcon={<SyncIcon />}\n            onClick={onRefresh}\n            color=\"primary\"\n            variant=\"contained\"\n            disabled={!!submissionIdValidationMessage}\n          >\n            Refresh\n          </Button>\n        </Grid>\n        <Grid item xs={12}>\n          {visibleColumns.length ? (\n            <FormStoreTable\n              isEmptyResults={\n                !formStoreRecords.length && !isLoading && !loadError\n              }\n              getTableProps={getTableProps}\n              getTableBodyProps={getTableBodyProps}\n              headerGroups={headerGroups}\n              rows={rows}\n              prepareRow={prepareRow}\n              onChangeFilters={onChangeFilters}\n            />\n          ) : (\n            <NoResourcesYet\n              IconComponent={SettingsIcon}\n              title=\"No Columns Visible\"\n              gutterBottom\n            >\n              It looks like you have hidden all of the available columns. Please\n              enable at least one column to view submissions.\n            </NoResourcesYet>\n          )}\n\n          {isLoading && (\n            <LoadingWithMessage message=\"Loading more records...\" />\n          )}\n\n          {loadError && (\n            <>\n              <ErrorMessage\n                title=\"Error Retrieving Submissions\"\n                gutterBottom\n                gutterTop\n              >\n                {loadError.message}\n              </ErrorMessage>\n              <Grid container justifyContent=\"center\">\n                <Button\n                  variant=\"outlined\"\n                  color=\"primary\"\n                  onClick={() => onTryAgain()}\n                >\n                  Try Again\n                </Button>\n              </Grid>\n            </>\n          )}\n        </Grid>\n      </Grid>\n    </Box>\n  )\n}\n\nexport default React.memo(FormStoreContainer)\n"]}

package/dist/components/formStore/display/ElementDisplay.d.ts

@@ -0,0 +1,23 @@
+/// <reference types="react" />
+import { FormElementWithOptions } from '@oneblink/types/typescript/forms';
+export declare function FileChip({ file: { fileName, url, isPrivate, data }, }: {
+    file: {
+        fileName: string;
+        url?: string;
+        isPrivate?: boolean;
+        data?: string;
+    };
+}): JSX.Element;
+export declare function FilesElementDataTableCellContent({ value, }: {
+    value: Array<{
+        fileName: string;
+        url?: string | undefined;
+        isPrivate?: boolean | undefined;
+        data?: string | undefined;
+    }>;
+}): JSX.Element;
+export declare function MultiSelectFormElementTableCellContent({ value, formElement, }: {
+    value: string[];
+    formElement: FormElementWithOptions;
+}): JSX.Element;
+export declare function getSelectedOptionLabel(formElement: FormElementWithOptions, value: string): string;

package/dist/components/formStore/display/ElementDisplay.js

@@ -0,0 +1,78 @@
+import * as React from 'react';
+import { saveAs } from 'file-saver';
+import { Chip, CircularProgress, Grid } from '@mui/material';
+import { SaveAlt, AttachFile } from '@mui/icons-material';
+import ErrorSnackbar from '../../ErrorSnackbar';
+import { UnorderedList, ListItem } from '../../Lists';
+import { getCognitoIdToken } from '@oneblink/apps/dist/services/cognito';
+async function fetchFile(url) {
+    const idToken = await getCognitoIdToken();
+    const response = await fetch(url, {
+        headers: {
+            Authorization: `Bearer ${idToken}`,
+        },
+    });
+    if (!response.ok) {
+        throw new Error(`Unable to download file. HTTP Status Code: ${response.status}`);
+    }
+    return await response.blob();
+}
+export function FileChip({ file: { fileName, url, isPrivate, data }, }) {
+    const [{ isDownloading, error }, setState] = React.useState({
+        isDownloading: false,
+    });
+    const clearError = React.useCallback(() => {
+        setState({
+            isDownloading: false,
+        });
+    }, []);
+    const handleDownload = React.useCallback(async () => {
+        try {
+            setState({
+                isDownloading: true,
+            });
+            if (url) {
+                if (isPrivate) {
+                    const blob = await fetchFile(url);
+                    saveAs(blob, fileName);
+                }
+                else {
+                    saveAs(url, fileName);
+                }
+            }
+            else if (data) {
+                saveAs(data, fileName);
+            }
+            setState({
+                isDownloading: false,
+            });
+        }
+        catch (error) {
+            setState({
+                isDownloading: false,
+                error: error,
+            });
+        }
+    }, [data, fileName, isPrivate, url]);
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Chip, { label: fileName, deleteIcon: React.createElement(SaveAlt, null), onDelete: handleDownload, variant: "outlined", icon: isDownloading ? React.createElement(CircularProgress, { size: 16 }) : React.createElement(AttachFile, null) }),
+        React.createElement(ErrorSnackbar, { open: !!error, onClose: clearError },
+            React.createElement("span", { "data-cypress": "download-legacy-file-error-message" }, error && error.message))));
+}
+export function FilesElementDataTableCellContent({ value, }) {
+    return (React.createElement(Grid, { container: true, spacing: 1 }, value.map((file, index) => {
+        return (React.createElement(Grid, { item: true, key: index, xs: 12 },
+            React.createElement(FileChip, { file: file })));
+    })));
+}
+export function MultiSelectFormElementTableCellContent({ value, formElement, }) {
+    return (React.createElement(UnorderedList, { disablePadding: true }, value.map((selection, index) => {
+        const label = getSelectedOptionLabel(formElement, selection);
+        return React.createElement(ListItem, { key: index }, label);
+    })));
+}
+export function getSelectedOptionLabel(formElement, value) {
+    const selectedOption = (formElement.options || []).find((opt) => opt.value === value);
+    return selectedOption ? selectedOption.label : value;
+}
+//# sourceMappingURL=ElementDisplay.js.map

package/dist/components/formStore/display/ElementDisplay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ElementDisplay.js","sourceRoot":"","sources":["../../../../src/components/formStore/display/ElementDisplay.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AACnC,OAAO,EAAE,IAAI,EAAE,gBAAgB,EAAE,IAAI,EAAE,MAAM,eAAe,CAAA;AAC5D,OAAO,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAA;AACzD,OAAO,aAAa,MAAM,qBAAqB,CAAA;AAC/C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AAErD,OAAO,EAAE,iBAAiB,EAAE,MAAM,sCAAsC,CAAA;AAExE,KAAK,UAAU,SAAS,CAAC,GAAW;IAClC,MAAM,OAAO,GAAG,MAAM,iBAAiB,EAAE,CAAA;IACzC,MAAM,QAAQ,GAAG,MAAM,KAAK,CAAC,GAAG,EAAE;QAChC,OAAO,EAAE;YACP,aAAa,EAAE,UAAU,OAAO,EAAE;SACnC;KACF,CAAC,CAAA;IAEF,IAAI,CAAC,QAAQ,CAAC,EAAE,EAAE;QAChB,MAAM,IAAI,KAAK,CACb,8CAA8C,QAAQ,CAAC,MAAM,EAAE,CAChE,CAAA;KACF;IAED,OAAO,MAAM,QAAQ,CAAC,IAAI,EAAE,CAAA;AAC9B,CAAC;AAED,MAAM,UAAU,QAAQ,CAAC,EACvB,IAAI,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE,SAAS,EAAE,IAAI,EAAE,GAQzC;IACC,MAAM,CAAC,EAAE,aAAa,EAAE,KAAK,EAAE,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,CAGxD;QACD,aAAa,EAAE,KAAK;KACrB,CAAC,CAAA;IACF,MAAM,UAAU,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACxC,QAAQ,CAAC;YACP,aAAa,EAAE,KAAK;SACrB,CAAC,CAAA;IACJ,CAAC,EAAE,EAAE,CAAC,CAAA;IACN,MAAM,cAAc,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,IAAI,EAAE;QAClD,IAAI;YACF,QAAQ,CAAC;gBACP,aAAa,EAAE,IAAI;aACpB,CAAC,CAAA;YAEF,IAAI,GAAG,EAAE;gBACP,IAAI,SAAS,EAAE;oBACb,MAAM,IAAI,GAAG,MAAM,SAAS,CAAC,GAAG,CAAC,CAAA;oBACjC,MAAM,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAA;iBACvB;qBAAM;oBACL,MAAM,CAAC,GAAG,EAAE,QAAQ,CAAC,CAAA;iBACtB;aACF;iBAAM,IAAI,IAAI,EAAE;gBACf,MAAM,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAA;aACvB;YAED,QAAQ,CAAC;gBACP,aAAa,EAAE,KAAK;aACrB,CAAC,CAAA;SACH;QAAC,OAAO,KAAK,EAAE;YACd,QAAQ,CAAC;gBACP,aAAa,EAAE,KAAK;gBACpB,KAAK,EAAE,KAAc;aACtB,CAAC,CAAA;SACH;IACH,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,CAAC,CAAC,CAAA;IACpC,OAAO,CACL;QACE,oBAAC,IAAI,IACH,KAAK,EAAE,QAAQ,EACf,UAAU,EAAE,oBAAC,OAAO,OAAG,EACvB,QAAQ,EAAE,cAAc,EACxB,OAAO,EAAC,UAAU,EAClB,IAAI,EAAE,aAAa,CAAC,CAAC,CAAC,oBAAC,gBAAgB,IAAC,IAAI,EAAE,EAAE,GAAI,CAAC,CAAC,CAAC,oBAAC,UAAU,OAAG,GACrE;QACF,oBAAC,aAAa,IAAC,IAAI,EAAE,CAAC,CAAC,KAAK,EAAE,OAAO,EAAE,UAAU;YAC/C,8CAAmB,oCAAoC,IACpD,KAAK,IAAI,KAAK,CAAC,OAAO,CAClB,CACO,CACf,CACJ,CAAA;AACH,CAAC;AAED,MAAM,UAAU,gCAAgC,CAAC,EAC/C,KAAK,GAQN;IACC,OAAO,CACL,oBAAC,IAAI,IAAC,SAAS,QAAC,OAAO,EAAE,CAAC,IACvB,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;QACzB,OAAO,CACL,oBAAC,IAAI,IAAC,IAAI,QAAC,GAAG,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE;YAC3B,oBAAC,QAAQ,IAAC,IAAI,EAAE,IAAI,GAAI,CACnB,CACR,CAAA;IACH,CAAC,CAAC,CACG,CACR,CAAA;AACH,CAAC;AAED,MAAM,UAAU,sCAAsC,CAAC,EACrD,KAAK,EACL,WAAW,GAIZ;IACC,OAAO,CACL,oBAAC,aAAa,IAAC,cAAc,UAC1B,KAAK,CAAC,GAAG,CAAC,CAAC,SAAS,EAAE,KAAK,EAAE,EAAE;QAC9B,MAAM,KAAK,GAAG,sBAAsB,CAAC,WAAW,EAAE,SAAS,CAAC,CAAA;QAC5D,OAAO,oBAAC,QAAQ,IAAC,GAAG,EAAE,KAAK,IAAG,KAAK,CAAY,CAAA;IACjD,CAAC,CAAC,CACY,CACjB,CAAA;AACH,CAAC;AAED,MAAM,UAAU,sBAAsB,CACpC,WAAmC,EACnC,KAAa;IAEb,MAAM,cAAc,GAAG,CAAC,WAAW,CAAC,OAAO,IAAI,EAAE,CAAC,CAAC,IAAI,CACrD,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,CAAC,KAAK,KAAK,KAAK,CAC7B,CAAA;IACD,OAAO,cAAc,CAAC,CAAC,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAA;AACtD,CAAC","sourcesContent":["import * as React from 'react'\nimport { saveAs } from 'file-saver'\nimport { Chip, CircularProgress, Grid } from '@mui/material'\nimport { SaveAlt, AttachFile } from '@mui/icons-material'\nimport ErrorSnackbar from '../../ErrorSnackbar'\nimport { UnorderedList, ListItem } from '../../Lists'\nimport { FormElementWithOptions } from '@oneblink/types/typescript/forms'\nimport { getCognitoIdToken } from '@oneblink/apps/dist/services/cognito'\n\nasync function fetchFile(url: string) {\n  const idToken = await getCognitoIdToken()\n  const response = await fetch(url, {\n    headers: {\n      Authorization: `Bearer ${idToken}`,\n    },\n  })\n\n  if (!response.ok) {\n    throw new Error(\n      `Unable to download file. HTTP Status Code: ${response.status}`,\n    )\n  }\n\n  return await response.blob()\n}\n\nexport function FileChip({\n  file: { fileName, url, isPrivate, data },\n}: {\n  file: {\n    fileName: string\n    url?: string\n    isPrivate?: boolean\n    data?: string\n  }\n}) {\n  const [{ isDownloading, error }, setState] = React.useState<{\n    error?: Error\n    isDownloading: boolean\n  }>({\n    isDownloading: false,\n  })\n  const clearError = React.useCallback(() => {\n    setState({\n      isDownloading: false,\n    })\n  }, [])\n  const handleDownload = React.useCallback(async () => {\n    try {\n      setState({\n        isDownloading: true,\n      })\n\n      if (url) {\n        if (isPrivate) {\n          const blob = await fetchFile(url)\n          saveAs(blob, fileName)\n        } else {\n          saveAs(url, fileName)\n        }\n      } else if (data) {\n        saveAs(data, fileName)\n      }\n\n      setState({\n        isDownloading: false,\n      })\n    } catch (error) {\n      setState({\n        isDownloading: false,\n        error: error as Error,\n      })\n    }\n  }, [data, fileName, isPrivate, url])\n  return (\n    <>\n      <Chip\n        label={fileName}\n        deleteIcon={<SaveAlt />}\n        onDelete={handleDownload}\n        variant=\"outlined\"\n        icon={isDownloading ? <CircularProgress size={16} /> : <AttachFile />}\n      />\n      <ErrorSnackbar open={!!error} onClose={clearError}>\n        <span data-cypress=\"download-legacy-file-error-message\">\n          {error && error.message}\n        </span>\n      </ErrorSnackbar>\n    </>\n  )\n}\n\nexport function FilesElementDataTableCellContent({\n  value,\n}: {\n  value: Array<{\n    fileName: string\n    url?: string | undefined\n    isPrivate?: boolean | undefined\n    data?: string | undefined\n  }>\n}) {\n  return (\n    <Grid container spacing={1}>\n      {value.map((file, index) => {\n        return (\n          <Grid item key={index} xs={12}>\n            <FileChip file={file} />\n          </Grid>\n        )\n      })}\n    </Grid>\n  )\n}\n\nexport function MultiSelectFormElementTableCellContent({\n  value,\n  formElement,\n}: {\n  value: string[]\n  formElement: FormElementWithOptions\n}) {\n  return (\n    <UnorderedList disablePadding>\n      {value.map((selection, index) => {\n        const label = getSelectedOptionLabel(formElement, selection)\n        return <ListItem key={index}>{label}</ListItem>\n      })}\n    </UnorderedList>\n  )\n}\n\nexport function getSelectedOptionLabel(\n  formElement: FormElementWithOptions,\n  value: string,\n) {\n  const selectedOption = (formElement.options || []).find(\n    (opt) => opt.value === value,\n  )\n  return selectedOption ? selectedOption.label : value\n}\n"]}

package/dist/components/formStore/display/FormStoreIcon.d.ts

@@ -0,0 +1,2 @@
+import Work from '@mui/icons-material/Work';
+export default Work;

package/dist/components/formStore/display/FormStoreIcon.js

@@ -0,0 +1,3 @@
+import Work from '@mui/icons-material/Work';
+export default Work;
+//# sourceMappingURL=FormStoreIcon.js.map

package/dist/components/formStore/display/FormStoreIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormStoreIcon.js","sourceRoot":"","sources":["../../../../src/components/formStore/display/FormStoreIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,0BAA0B,CAAA;AAC3C,eAAe,IAAI,CAAA","sourcesContent":["import Work from '@mui/icons-material/Work'\nexport default Work\n"]}

package/dist/components/formStore/table/ActionedByTableCell.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import { UserProfile } from '@oneblink/types/typescript/misc';
+import { Chip } from '@mui/material';
+declare function ActionedByTableCell({ userProfile, developerKey, ...rest }: React.ComponentProps<typeof Chip> & {
+    userProfile?: UserProfile;
+    developerKey?: {
+        name: string;
+    };
+}): JSX.Element;
+declare const _default: React.MemoExoticComponent<typeof ActionedByTableCell>;
+export default _default;