synapse-react-client 4.0.46 → 4.0.47

package/dist/components/TableColumnSchemaEditor/TableColumnSchemaForm.js

@@ -10,22 +10,22 @@ import d from "./ColumnModelForm.js";
 import f from "./ImportTableColumnsButton.js";
 import { TableColumnSchemaFormActions as p } from "./TableColumnSchemaFormActions.js";
 import { validateColumnModelFormData as m } from "./Validators/ColumnModelValidator.js";
-import { forwardRef as h, useCallback as g, useEffect as ee, useImperativeHandle as _, useMemo as v, useState as y } from "react";
-import { groupBy as b, isEqual as x, noop as S, omit as C, times as te } from "lodash-es";
-import { Box as w, Button as T, styled as E } from "@mui/material";
-import { Fragment as D, jsx as O, jsxs as k } from "react/jsx-runtime";
-import { ColumnTypeEnum as A, VIEW_CONCRETE_TYPE_VALUES as ne } from "@sage-bionetworks/synapse-types";
-import { Provider as j, atom as re, useAtomValue as M, useSetAtom as N } from "jotai";
-import P from "@mui/icons-material/AddCircleTwoTone";
-import F from "pluralize";
+import { forwardRef as h, useCallback as g, useEffect as _, useImperativeHandle as v, useMemo as y, useState as b } from "react";
+import { groupBy as x, isEqual as S, noop as C, omit as w, times as ee } from "lodash-es";
+import { Box as T, Button as E, styled as D } from "@mui/material";
+import { Fragment as O, jsx as k, jsxs as A } from "react/jsx-runtime";
+import { ColumnTypeEnum as j, VIEW_CONCRETE_TYPE_VALUES as te } from "@sage-bionetworks/synapse-types";
+import ne from "pluralize";
+import { Provider as M, atom as re, useAtomValue as N, useSetAtom as P } from "jotai";
+import F from "@mui/icons-material/AddCircleTwoTone";
 import { selectAtom as I, useAtomCallback as L } from "jotai/utils";
 //#region src/components/TableColumnSchemaEditor/TableColumnSchemaForm.tsx
-var R = "18px 18px 1.75fr 1.75fr 0.75fr 1fr 1.25fr 1.25fr 1fr 1.25fr", z = /* @__PURE__ */ O(w, { sx: {
+var R = "18px 18px 1.75fr 1.75fr 0.75fr 1fr 1.25fr 1.25fr 1fr 1.25fr", z = /* @__PURE__ */ k(T, { sx: {
 	width: "1px",
 	height: "calc(100% + 2 * 6px)",
 	backgroundColor: "grey.400",
 	marginLeft: "8px"
-} }), B = /* @__PURE__ */ O(w, { sx: (e) => ({
+} }), B = /* @__PURE__ */ k(T, { sx: (e) => ({
 	width: "50%",
 	height: "60%",
 	borderLeft: `1px solid ${e.palette.grey[400]}`,
@@ -34,17 +34,17 @@ var R = "18px 18px 1.75fr 1.75fr 0.75fr 1fr 1.25fr 1.25fr 1fr 1.25fr", z = /* @_
 	marginBottom: "auto",
 	marginRight: "0",
 	borderBottomLeftRadius: "5px"
-}) }), V = E(w, { label: "ColumnHeader" })({ fontWeight: 700 }), H = "Add All Annotations";
+}) }), V = D(T, { label: "ColumnHeader" })({ fontWeight: 700 }), H = "Add All Annotations";
 function U(i, s) {
-	let { initialData: d, entityType: h, viewScope: x, onSubmit: E = S, isSubmitting: D = !1, originalColumnModels: A } = i, j = M(v(() => re((e) => e(u).length), [])), I = N(u), [z, B] = y(null), H = L(g((e) => e(u), [])), U = t(h), W = ne.includes(U), G = W, K = W, { data: q, isLoading: J } = o(x?.viewEntityType, x?.viewTypeMask, {
+	let { initialData: d, entityType: h, viewScope: S, onSubmit: D = C, isSubmitting: O = !1, originalColumnModels: j } = i, M = N(y(() => re((e) => e(u).length), [])), I = P(u), [z, B] = b(null), H = L(g((e) => e(u), [])), U = t(h), W = te.includes(U), G = W, K = W, { data: q, isLoading: J } = o(S?.viewEntityType, S?.viewTypeMask, {
 		enabled: K,
 		staleTime: Infinity
 	}), Y = a({
-		viewScope: x,
+		viewScope: S,
 		includeDerivedAnnotations: !0,
 		concreteType: "org.sagebionetworks.repo.model.table.ViewColumnModelRequest"
 	}, { enabled: G }), { data: X, isLoading: Z } = Y;
-	ee(() => {
+	_(() => {
 		d && !J && I({
 			type: "setValue",
 			value: l(d, q ?? [])
@@ -54,10 +54,10 @@ function U(i, s) {
 		let e = m(H());
 		return e.success ? B(null) : B(e.error), e;
 	}, [H]);
-	_(s, () => ({
+	v(s, () => ({
 		submit() {
 			let e = Q();
-			e.success && E(e.data);
+			e.success && D(e.data);
 		},
 		getEditedColumnModels() {
 			let e = Q();
@@ -67,13 +67,13 @@ function U(i, s) {
 		validate() {
 			return Q().success;
 		}
-	}), [E, Q]);
+	}), [D, Q]);
 	let $ = g((t) => {
-		let n = H(), r = t.filter((e) => c(W, !1).includes(e.columnType) ? !n.find((t) => t.name === e.name) : !1);
-		r = r.map((e) => C(e, ["id"])), r.length > 0 ? (I({
+		let n = H(), r = t.filter((e) => c(W, !1).includes(e.columnType) ? !n.some((t) => t.name === e.name) : !1);
+		r = r.map((e) => w(e, ["id"])), r.length > 0 ? (I({
 			type: "setValue",
 			value: [...n, ...l(r, q)]
-		}), e(`${r.length} ${F("column", r.length)} added to schema.`, "success")) : e("No columns added. All columns to add are present in the column schema.", "info");
+		}), e(`${r.length} ${ne("column", r.length)} added to schema.`, "success")) : e("No columns added. All columns to add are present in the column schema.", "info");
 	}, [
 		q,
 		I,
@@ -83,16 +83,16 @@ function U(i, s) {
 		q && $(q);
 	}, [q, $]), oe = g(() => {
 		X && $(X);
-	}, [X, $]), se = v(() => z ? b(z.issues, (e) => e.path[0]) : {}, [z]);
-	return /* @__PURE__ */ k(w, {
+	}, [X, $]), se = y(() => z ? x(z.issues, (e) => e.path[0]) : {}, [z]);
+	return /* @__PURE__ */ A(T, {
 		component: "form",
 		sx: { py: 2.5 },
 		children: [
-			/* @__PURE__ */ O(p, {
-				disabled: D,
+			/* @__PURE__ */ k(p, {
+				disabled: O,
 				annotationColumnModelsQuery: Y
 			}),
-			/* @__PURE__ */ k(w, {
+			/* @__PURE__ */ A(T, {
 				sx: {
 					display: "grid",
 					gap: "8px",
@@ -100,75 +100,75 @@ function U(i, s) {
 					py: 2.5
 				},
 				children: [
-					/* @__PURE__ */ O(V, {}),
-					/* @__PURE__ */ O(V, {
+					/* @__PURE__ */ k(V, {}),
+					/* @__PURE__ */ k(V, {
 						sx: { gridColumn: "2 / span 2" },
 						children: "Column Name"
 					}),
-					/* @__PURE__ */ O(V, { children: "Column Type" }),
-					/* @__PURE__ */ O(V, { children: "Size" }),
-					/* @__PURE__ */ O(V, { children: "Max List Length" }),
-					/* @__PURE__ */ O(V, { children: "Default Value" }),
-					/* @__PURE__ */ O(V, { children: "Restrict Values" }),
-					/* @__PURE__ */ O(V, { children: "Facet" }),
-					/* @__PURE__ */ O(V, { children: "Sort Facet Values" }),
-					/* @__PURE__ */ O(w, { sx: {
+					/* @__PURE__ */ k(V, { children: "Column Type" }),
+					/* @__PURE__ */ k(V, { children: "Size" }),
+					/* @__PURE__ */ k(V, { children: "Max List Length" }),
+					/* @__PURE__ */ k(V, { children: "Default Value" }),
+					/* @__PURE__ */ k(V, { children: "Restrict Values" }),
+					/* @__PURE__ */ k(V, { children: "Facet" }),
+					/* @__PURE__ */ k(V, { children: "Sort Facet Values" }),
+					/* @__PURE__ */ k(T, { sx: {
 						gridColumn: "1 / span 11",
 						backgroundColor: "grey.300",
 						height: "2px"
 					} }),
-					te(j, (e) => /* @__PURE__ */ O(ie, {
+					ee(M, (e) => /* @__PURE__ */ k(ie, {
 						entityType: h,
 						columnModelIndex: e,
-						disabled: D,
+						disabled: O,
 						columnModelValidationErrors: se[e],
 						annotationColumnModels: X,
-						originalColumnModels: A
+						originalColumnModels: j
 					}, e))
 				]
 			}),
-			/* @__PURE__ */ k(w, {
+			/* @__PURE__ */ A(T, {
 				sx: {
 					display: "flex",
 					gap: 1
 				},
 				children: [
-					/* @__PURE__ */ O(T, {
+					/* @__PURE__ */ k(E, {
 						variant: "outlined",
 						onClick: () => {
 							I({ type: "appendColumn" });
 						},
-						startIcon: /* @__PURE__ */ O(P, {}),
-						disabled: D,
+						startIcon: /* @__PURE__ */ k(F, {}),
+						disabled: O,
 						children: "Add Column"
 					}),
-					K && /* @__PURE__ */ k(T, {
+					K && /* @__PURE__ */ A(E, {
 						variant: "outlined",
-						startIcon: O(J ? r : P, {}),
+						startIcon: k(J ? r : F, {}),
 						onClick: () => {
 							ae();
 						},
-						disabled: J || D,
+						disabled: J || O,
 						children: [
 							"Add Default ",
 							n(h),
 							" Columns"
 						]
 					}),
-					G && /* @__PURE__ */ O(T, {
+					G && /* @__PURE__ */ k(E, {
 						variant: "outlined",
-						startIcon: O(Z ? r : P, {}),
-						disabled: Z || D,
+						startIcon: k(Z ? r : F, {}),
+						disabled: Z || O,
 						onClick: () => {
 							oe();
 						},
 						children: "Add All Annotations"
 					}),
-					/* @__PURE__ */ O(f, {
+					/* @__PURE__ */ k(f, {
 						onAddColumns: (e) => {
 							$(e);
 						},
-						disabled: D
+						disabled: O
 					})
 				]
 			})
@@ -176,11 +176,11 @@ function U(i, s) {
 	});
 }
 function ie(e) {
-	let { columnModelIndex: t, entityType: n, disabled: r, columnModelValidationErrors: a = null, annotationColumnModels: o, originalColumnModels: c } = e, l = N(u), f = M(v(() => I(u, (e) => e[t], x), [t])), p = c ? s(c, f) : void 0, m = o ? s(o, f) : void 0, h = v(() => a ? b(a.filter((e) => e.path[0] === t && e.path[1] == "jsonSubColumns"), (e) => e.path[2]) : {}, [t, a]);
-	if (!f) return /* @__PURE__ */ O(D, {});
+	let { columnModelIndex: t, entityType: n, disabled: r, columnModelValidationErrors: a = null, annotationColumnModels: o, originalColumnModels: c } = e, l = P(u), f = N(y(() => I(u, (e) => e[t], S), [t])), p = c ? s(c, f) : void 0, m = o ? s(o, f) : void 0, h = y(() => a ? x(a.filter((e) => e.path[0] === t && e.path[1] == "jsonSubColumns"), (e) => e.path[2]) : {}, [t, a]);
+	if (!f) return /* @__PURE__ */ k(O, {});
 	let g = f.isOriginallyDefaultColumn;
-	return /* @__PURE__ */ k(D, { children: [
-		/* @__PURE__ */ O(d, {
+	return /* @__PURE__ */ A(O, { children: [
+		/* @__PURE__ */ k(d, {
 			entityType: n,
 			columnModelIndex: t,
 			isDefaultColumn: g,
@@ -189,7 +189,7 @@ function ie(e) {
 			defaultAnnotationModel: m,
 			originalColumnModel: p
 		}),
-		f.columnType === A.JSON && f.jsonSubColumns && f.jsonSubColumns.map((e, i) => /* @__PURE__ */ O(d, {
+		f.columnType === j.JSON && f.jsonSubColumns && f.jsonSubColumns.map((e, i) => /* @__PURE__ */ k(d, {
 			entityType: n,
 			columnModelIndex: t,
 			jsonSubColumnIndex: i,
@@ -197,13 +197,13 @@ function ie(e) {
 			disabled: r,
 			validationErrors: h[i]
 		}, i)),
-		f.columnType === A.JSON && /* @__PURE__ */ k(D, { children: [/* @__PURE__ */ O(w, {
+		f.columnType === j.JSON && /* @__PURE__ */ A(O, { children: [/* @__PURE__ */ k(T, {
 			sx: { gridColumn: "1 / span 2" },
 			children: B
-		}), /* @__PURE__ */ O(w, {
+		}), /* @__PURE__ */ k(T, {
 			sx: { gridColumn: "3 / span 5" },
-			children: /* @__PURE__ */ O(T, {
-				startIcon: /* @__PURE__ */ O(i, {}),
+			children: /* @__PURE__ */ k(E, {
+				startIcon: /* @__PURE__ */ k(i, {}),
 				variant: "text",
 				disabled: r,
 				onClick: () => l({
@@ -216,7 +216,7 @@ function ie(e) {
 	] });
 }
 var W = h(U), G = h(function(e, t) {
-	return /* @__PURE__ */ O(j, { children: /* @__PURE__ */ O(W, {
+	return /* @__PURE__ */ k(M, { children: /* @__PURE__ */ k(W, {
 		...e,
 		ref: t
 	}) });

package/dist/components/TableColumnSchemaEditor/TableColumnSchemaForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableColumnSchemaForm.js","names":[],"sources":["../../../src/components/TableColumnSchemaEditor/TableColumnSchemaForm.tsx"],"sourcesContent":["import AddToList from '@/assets/icons/AddToList'\nimport {\n  useGetAnnotationColumnModels,\n  useGetDefaultColumnModels,\n} from '@/synapse-queries/table/useColumnModel'\nimport {\n  convertToConcreteEntityType,\n  entityTypeToFriendlyName,\n} from '@/utils/functions/EntityTypeUtils'\nimport AddCircleTwoTone from '@mui/icons-material/AddCircleTwoTone'\nimport { Box, Button, styled } from '@mui/material'\nimport { EntityType } from '@sage-bionetworks/synapse-client'\nimport {\n  ColumnModel,\n  ColumnTypeEnum,\n  VIEW_CONCRETE_TYPE_VALUES,\n  ViewScope,\n} from '@sage-bionetworks/synapse-types'\nimport { atom, Provider, useAtomValue, useSetAtom } from 'jotai'\nimport { selectAtom, useAtomCallback } from 'jotai/utils'\nimport { groupBy, isEqual, noop, omit, times } from 'lodash-es'\nimport pluralize from 'pluralize'\nimport {\n  ForwardedRef,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useState,\n} from 'react'\nimport { SetOptional } from 'type-fest'\nimport { ZodError, ZodIssue } from 'zod'\nimport { SynapseSpinner } from '../LoadingScreen/LoadingScreen'\nimport { displayToast } from '../ToastMessage'\nimport ColumnModelForm from './ColumnModelForm'\nimport ImportTableColumnsButton from './ImportTableColumnsButton'\nimport {\n  findMatchingColumnModel,\n  getAllowedColumnTypes,\n  transformColumnModelsToFormData,\n} from './TableColumnSchemaEditorUtils'\nimport { TableColumnSchemaFormActions } from './TableColumnSchemaFormActions'\nimport { tableColumnSchemaFormDataAtom } from './TableColumnSchemaFormReducer'\nimport { validateColumnModelFormData } from './Validators/ColumnModelValidator'\n\nconst COLUMN_SCHEMA_FORM_GRID_TEMPLATE_COLUMNS =\n  '18px 18px 1.75fr 1.75fr 0.75fr 1fr 1.25fr 1.25fr 1fr 1.25fr'\nconst GRID_CONTAINER_Y_MARGIN_PX = 6\nexport const HIERARCHY_VERTICAL_LINE_COMPONENT = (\n  <Box\n    sx={{\n      width: '1px',\n      height: `calc(100% + 2 * ${GRID_CONTAINER_Y_MARGIN_PX}px)`,\n      backgroundColor: 'grey.400',\n      marginLeft: '8px',\n    }}\n  />\n)\nexport const HIERARCHY_END_COMPONENT = (\n  <Box\n    sx={theme => ({\n      width: '50%',\n      height: '60%',\n      borderLeft: `1px solid ${theme.palette.grey[400]}`,\n      borderBottom: `1px solid ${theme.palette.grey[400]}`,\n      marginLeft: '8px',\n      marginBottom: 'auto',\n      marginRight: '0',\n      borderBottomLeftRadius: '5px',\n    })}\n  />\n)\n\nexport type SubmitHandle = {\n  // Allow the parent component to trigger a submit of the form, so this may be embedded in an arbitrary modal.\n  submit: () => void\n  // Imperative handle to get the data out of the form for SWC compatibility\n  getEditedColumnModels: () => SetOptional<ColumnModel, 'id'>[]\n  // Used to check if all form data is valid. Returns the current validity state\n  validate: () => boolean\n}\n\ntype TableColumnSchemaFormProps = {\n  /* The type of the Table, which determines various schema restrictions and form functionality */\n  entityType: EntityType\n  /* If this is an entity view, the ViewScope can be used to determine the default column models and fetch annotation column models */\n  viewScope?: ViewScope\n  initialData?: SetOptional<ColumnModel, 'id'>[]\n  onSubmit?: (newColumnModels: SetOptional<ColumnModel, 'id'>[]) => void\n  isSubmitting?: boolean\n  /** The original/current column models that are applied to the table, if they exist. */\n  originalColumnModels?: ColumnModel[]\n}\n\nconst ColumnHeader = styled(Box, {\n  label: 'ColumnHeader',\n})({\n  fontWeight: 700,\n})\n\nexport const ADD_ALL_ANNOTATIONS_BUTTON_TEXT = 'Add All Annotations'\n\nfunction TableColumnSchemaFormInternal(\n  props: TableColumnSchemaFormProps,\n  ref: ForwardedRef<SubmitHandle>,\n) {\n  const {\n    initialData,\n    entityType,\n    viewScope,\n    onSubmit = noop,\n    isSubmitting = false,\n    originalColumnModels,\n  } = props\n\n  const numColumnModels = useAtomValue(\n    useMemo(() => atom(get => get(tableColumnSchemaFormDataAtom).length), []),\n  )\n\n  const dispatch = useSetAtom(tableColumnSchemaFormDataAtom)\n  const [validationErrors, setValidationErrors] = useState<ZodError | null>(\n    null,\n  )\n\n  // useAtomCallback will let us imperatively read the form data, instead of tracking it in state and triggering a full re-render of the form when any data changes\n  const readFormData = useAtomCallback(\n    useCallback(get => {\n      return get(tableColumnSchemaFormDataAtom)\n    }, []),\n  )\n  const concreteTableType = convertToConcreteEntityType(entityType)\n  const isView = VIEW_CONCRETE_TYPE_VALUES.includes(\n    concreteTableType as (typeof VIEW_CONCRETE_TYPE_VALUES)[number],\n  )\n  const hasAnnotationColumnModels = isView,\n    hasDefaultColumnModels = isView\n\n  const { data: defaultColumnModels, isLoading: isLoadingDefaultColumns } =\n    useGetDefaultColumnModels(\n      viewScope?.viewEntityType!,\n      viewScope?.viewTypeMask,\n      {\n        enabled: hasDefaultColumnModels,\n        staleTime: Infinity, // The default column models will never change\n      },\n    )\n\n  const annotationColumnModelsQuery = useGetAnnotationColumnModels(\n    {\n      viewScope: viewScope!,\n      includeDerivedAnnotations: true,\n      concreteType:\n        'org.sagebionetworks.repo.model.table.ViewColumnModelRequest',\n    },\n    {\n      enabled: hasAnnotationColumnModels,\n    },\n  )\n\n  const {\n    data: annotationColumnModels,\n    isLoading: isLoadingAnnotationColumns,\n  } = annotationColumnModelsQuery\n\n  /**\n   * Set the initialData in the form state atom on mount, if it exists and we have no data.\n   */\n  useEffect(() => {\n    if (initialData && !isLoadingDefaultColumns) {\n      dispatch({\n        type: 'setValue',\n        value: transformColumnModelsToFormData(\n          initialData,\n          defaultColumnModels ?? [],\n        ),\n      })\n    }\n    // Don't re-run if initial data changes\n    // oxlint-disable-next-line react-hooks/exhaustive-deps\n  }, [isLoadingDefaultColumns])\n\n  const validateInternal = useCallback(() => {\n    const result = validateColumnModelFormData(readFormData())\n    if (result.success) {\n      setValidationErrors(null)\n    } else {\n      setValidationErrors(result.error)\n    }\n    return result\n  }, [readFormData])\n\n  useImperativeHandle(ref, () => {\n    return {\n      submit() {\n        const result = validateInternal()\n        if (result.success) {\n          onSubmit(result.data)\n        }\n      },\n      getEditedColumnModels() {\n        const result = validateInternal()\n        if (!result.success) {\n          throw new Error('Column models were not valid')\n        }\n        return result.data\n      },\n      validate() {\n        const result = validateInternal()\n        return result.success\n      },\n    }\n  }, [onSubmit, validateInternal])\n\n  // Generic function to add a set of columns to the schema (e.g. default columns, annotation columns)\n  const addColumnSet = useCallback(\n    (newColumns: SetOptional<ColumnModel, 'id'>[]) => {\n      const currentFormData = readFormData()\n      let columnsToAdd = newColumns.filter(\n        (cm: SetOptional<ColumnModel, 'id'>) => {\n          // Don't add columns that cannot be added (for example, Views cannot have JSON columns)\n          if (\n            !getAllowedColumnTypes(isView, false).includes(\n              cm.columnType as ColumnTypeEnum,\n            )\n          ) {\n            return false\n          }\n          // Only add columns that are not already present\n          // Use the name column to match because the ID may vary, e.g. if the facetType was changed\n          return !currentFormData.find(fd => fd.name === cm.name)\n        },\n      )\n      // Remove the ID column so TableColumnSchemaUtils.createTableUpdateTransactionRequest recognizes these as new columns\n      // createTableUpdateTransactionRequest uses the existing column ID to track column updates in the table, so any new columns should have no ID\n      // The user can also modify these columns before submitting them, so the ID may not be accurate when we end up submitting them\n      columnsToAdd = columnsToAdd.map(cm => omit(cm, ['id']))\n      if (columnsToAdd.length > 0) {\n        dispatch({\n          type: 'setValue',\n          value: [\n            ...currentFormData,\n            ...transformColumnModelsToFormData(\n              columnsToAdd,\n              defaultColumnModels,\n            ),\n          ],\n        })\n        displayToast(\n          `${columnsToAdd.length} ${pluralize(\n            'column',\n            columnsToAdd.length,\n          )} added to schema.`,\n          'success',\n        )\n      } else {\n        displayToast(\n          'No columns added. All columns to add are present in the column schema.',\n          'info',\n        )\n      }\n    },\n    [defaultColumnModels, dispatch, isView, readFormData],\n  )\n\n  const addDefaultColumns = useCallback(() => {\n    if (defaultColumnModels) {\n      addColumnSet(defaultColumnModels)\n    }\n  }, [defaultColumnModels, addColumnSet])\n\n  const addAnnotationColumns = useCallback(() => {\n    if (annotationColumnModels) {\n      addColumnSet(annotationColumnModels)\n    }\n  }, [annotationColumnModels, addColumnSet])\n\n  // Put the errors into a map of columnModelIndex -> errors\n  const errorsByColumnModel = useMemo(() => {\n    if (validationErrors) {\n      return groupBy(validationErrors.issues, e => e.path[0])\n    }\n    return {}\n  }, [validationErrors])\n\n  return (\n    <Box\n      component={'form'}\n      sx={{\n        py: 2.5,\n      }}\n    >\n      <TableColumnSchemaFormActions\n        disabled={isSubmitting}\n        annotationColumnModelsQuery={annotationColumnModelsQuery}\n      />\n      <Box\n        sx={{\n          display: 'grid',\n          gap: '8px',\n          gridTemplateColumns: COLUMN_SCHEMA_FORM_GRID_TEMPLATE_COLUMNS,\n          py: 2.5,\n        }}\n      >\n        <ColumnHeader>{/* Checkbox */}</ColumnHeader>\n        <ColumnHeader sx={{ gridColumn: '2 / span 2' }}>\n          Column Name\n        </ColumnHeader>\n        <ColumnHeader>Column Type</ColumnHeader>\n        <ColumnHeader>Size</ColumnHeader>\n        <ColumnHeader>Max List Length</ColumnHeader>\n        <ColumnHeader>Default Value</ColumnHeader>\n        <ColumnHeader>Restrict Values</ColumnHeader>\n        <ColumnHeader>Facet</ColumnHeader>\n        <ColumnHeader>Sort Facet Values</ColumnHeader>\n        <Box\n          sx={{\n            gridColumn: '1 / span 11',\n            backgroundColor: 'grey.300',\n            height: '2px',\n          }}\n        />\n        {times(numColumnModels, index => {\n          return (\n            <TableColumnSchemaFormRow\n              entityType={entityType}\n              columnModelIndex={index}\n              disabled={isSubmitting}\n              key={index}\n              columnModelValidationErrors={errorsByColumnModel[index]}\n              annotationColumnModels={annotationColumnModels}\n              originalColumnModels={originalColumnModels}\n            />\n          )\n        })}\n      </Box>\n      <Box\n        sx={{\n          display: 'flex',\n          gap: 1,\n        }}\n      >\n        <Button\n          variant={'outlined'}\n          onClick={() => {\n            dispatch({ type: 'appendColumn' })\n          }}\n          startIcon={<AddCircleTwoTone />}\n          disabled={isSubmitting}\n        >\n          Add Column\n        </Button>\n\n        {hasDefaultColumnModels && (\n          <Button\n            variant={'outlined'}\n            startIcon={\n              isLoadingDefaultColumns ? (\n                <SynapseSpinner />\n              ) : (\n                <AddCircleTwoTone />\n              )\n            }\n            onClick={() => {\n              addDefaultColumns()\n            }}\n            disabled={isLoadingDefaultColumns || isSubmitting}\n          >\n            Add Default {entityTypeToFriendlyName(entityType)} Columns\n          </Button>\n        )}\n\n        {hasAnnotationColumnModels && (\n          <Button\n            variant={'outlined'}\n            startIcon={\n              isLoadingAnnotationColumns ? (\n                <SynapseSpinner />\n              ) : (\n                <AddCircleTwoTone />\n              )\n            }\n            disabled={isLoadingAnnotationColumns || isSubmitting}\n            onClick={() => {\n              addAnnotationColumns()\n            }}\n          >\n            {ADD_ALL_ANNOTATIONS_BUTTON_TEXT}\n          </Button>\n        )}\n        <ImportTableColumnsButton\n          onAddColumns={cms => {\n            addColumnSet(cms)\n          }}\n          disabled={isSubmitting}\n        />\n      </Box>\n    </Box>\n  )\n}\n\ntype TableColumnSchemaFormRowProps = {\n  entityType: EntityType\n  columnModelIndex: number\n  disabled: boolean\n  columnModelValidationErrors: ZodIssue[] | null\n  annotationColumnModels?: ColumnModel[]\n  originalColumnModels?: ColumnModel[]\n}\n\nfunction TableColumnSchemaFormRow(props: TableColumnSchemaFormRowProps) {\n  const {\n    columnModelIndex,\n    entityType,\n    disabled,\n    columnModelValidationErrors = null,\n    annotationColumnModels,\n    originalColumnModels,\n  } = props\n  const dispatch = useSetAtom(tableColumnSchemaFormDataAtom)\n  const columnModel = useAtomValue(\n    useMemo(\n      () =>\n        selectAtom(\n          tableColumnSchemaFormDataAtom,\n          formData => formData[columnModelIndex],\n          isEqual,\n        ),\n      [columnModelIndex],\n    ),\n  )\n\n  // Find the original column model that matches the current column model by name and type, so we can tell the user what fields have changed\n  const originalColumnModel = originalColumnModels\n    ? findMatchingColumnModel(originalColumnModels, columnModel)\n    : undefined\n\n  // Find the closest match between passed column model and current column model with name and type\n  const defaultAnnotationModel = annotationColumnModels\n    ? findMatchingColumnModel(annotationColumnModels, columnModel)\n    : undefined\n\n  // Organize the JSON Subcolumn errors into a map of subcolumn index to errors\n  const errorsForSubcolumns = useMemo(() => {\n    if (columnModelValidationErrors) {\n      const errorsForAllSubcolumns = columnModelValidationErrors.filter(e => {\n        return e.path[0] === columnModelIndex && e.path[1] == 'jsonSubColumns'\n      })\n      return groupBy(errorsForAllSubcolumns, e => e.path[2])\n    }\n    return {}\n  }, [columnModelIndex, columnModelValidationErrors])\n\n  if (!columnModel) {\n    return <></>\n  }\n  const isDefaultColumn = columnModel.isOriginallyDefaultColumn\n\n  return (\n    <>\n      <ColumnModelForm\n        entityType={entityType}\n        columnModelIndex={columnModelIndex}\n        isDefaultColumn={isDefaultColumn}\n        disabled={disabled}\n        validationErrors={columnModelValidationErrors}\n        defaultAnnotationModel={defaultAnnotationModel}\n        originalColumnModel={originalColumnModel}\n      />\n      {columnModel.columnType === ColumnTypeEnum.JSON &&\n        columnModel.jsonSubColumns &&\n        columnModel.jsonSubColumns.map((subColumnFacet, index) => (\n          <ColumnModelForm\n            key={index}\n            entityType={entityType}\n            columnModelIndex={columnModelIndex}\n            jsonSubColumnIndex={index}\n            isDefaultColumn={isDefaultColumn}\n            disabled={disabled}\n            validationErrors={errorsForSubcolumns[index]}\n          />\n        ))}\n      {columnModel.columnType === ColumnTypeEnum.JSON && (\n        <>\n          <Box\n            sx={{\n              gridColumn: '1 / span 2',\n            }}\n          >\n            {HIERARCHY_END_COMPONENT}\n          </Box>\n          <Box\n            sx={{\n              gridColumn: '3 / span 5',\n            }}\n          >\n            <Button\n              startIcon={<AddToList />}\n              variant={'text'}\n              disabled={disabled}\n              onClick={() =>\n                dispatch({ type: 'appendJsonSubColumn', columnModelIndex })\n              }\n            >\n              Add sub-column\n            </Button>\n          </Box>\n        </>\n      )}\n    </>\n  )\n}\n\nconst TableColumnSchemaFormInternalWithForwardRef = forwardRef<\n  SubmitHandle,\n  TableColumnSchemaFormProps\n>(TableColumnSchemaFormInternal)\n\nconst TableColumnSchemaFormWrapped = forwardRef<\n  SubmitHandle,\n  TableColumnSchemaFormProps\n>(function TableColumnSchemaForm(props: TableColumnSchemaFormProps, ref) {\n  // Wrap the form in a Jotai provider so that the internal atoms are scoped to just this component instance\n  // Use forwardRef to ensure that the ref can be passed along\n  return (\n    <Provider>\n      <TableColumnSchemaFormInternalWithForwardRef {...props} ref={ref} />\n    </Provider>\n  )\n})\n\nexport default TableColumnSchemaFormWrapped\n"],"mappings":"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"}
+{"version":3,"file":"TableColumnSchemaForm.js","names":[],"sources":["../../../src/components/TableColumnSchemaEditor/TableColumnSchemaForm.tsx"],"sourcesContent":["import AddToList from '@/assets/icons/AddToList'\nimport {\n  useGetAnnotationColumnModels,\n  useGetDefaultColumnModels,\n} from '@/synapse-queries/table/useColumnModel'\nimport {\n  convertToConcreteEntityType,\n  entityTypeToFriendlyName,\n} from '@/utils/functions/EntityTypeUtils'\nimport AddCircleTwoTone from '@mui/icons-material/AddCircleTwoTone'\nimport { Box, Button, styled } from '@mui/material'\nimport { EntityType } from '@sage-bionetworks/synapse-client'\nimport {\n  ColumnModel,\n  ColumnTypeEnum,\n  VIEW_CONCRETE_TYPE_VALUES,\n  ViewScope,\n} from '@sage-bionetworks/synapse-types'\nimport { atom, Provider, useAtomValue, useSetAtom } from 'jotai'\nimport { selectAtom, useAtomCallback } from 'jotai/utils'\nimport { groupBy, isEqual, noop, omit, times } from 'lodash-es'\nimport pluralize from 'pluralize'\nimport {\n  ForwardedRef,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useState,\n} from 'react'\nimport { SetOptional } from 'type-fest'\nimport { ZodError, ZodIssue } from 'zod'\nimport { SynapseSpinner } from '../LoadingScreen/LoadingScreen'\nimport { displayToast } from '../ToastMessage'\nimport ColumnModelForm from './ColumnModelForm'\nimport ImportTableColumnsButton from './ImportTableColumnsButton'\nimport {\n  findMatchingColumnModel,\n  getAllowedColumnTypes,\n  transformColumnModelsToFormData,\n} from './TableColumnSchemaEditorUtils'\nimport { TableColumnSchemaFormActions } from './TableColumnSchemaFormActions'\nimport { tableColumnSchemaFormDataAtom } from './TableColumnSchemaFormReducer'\nimport { validateColumnModelFormData } from './Validators/ColumnModelValidator'\n\nconst COLUMN_SCHEMA_FORM_GRID_TEMPLATE_COLUMNS =\n  '18px 18px 1.75fr 1.75fr 0.75fr 1fr 1.25fr 1.25fr 1fr 1.25fr'\nconst GRID_CONTAINER_Y_MARGIN_PX = 6\nexport const HIERARCHY_VERTICAL_LINE_COMPONENT = (\n  <Box\n    sx={{\n      width: '1px',\n      height: `calc(100% + 2 * ${GRID_CONTAINER_Y_MARGIN_PX}px)`,\n      backgroundColor: 'grey.400',\n      marginLeft: '8px',\n    }}\n  />\n)\nexport const HIERARCHY_END_COMPONENT = (\n  <Box\n    sx={theme => ({\n      width: '50%',\n      height: '60%',\n      borderLeft: `1px solid ${theme.palette.grey[400]}`,\n      borderBottom: `1px solid ${theme.palette.grey[400]}`,\n      marginLeft: '8px',\n      marginBottom: 'auto',\n      marginRight: '0',\n      borderBottomLeftRadius: '5px',\n    })}\n  />\n)\n\nexport type SubmitHandle = {\n  // Allow the parent component to trigger a submit of the form, so this may be embedded in an arbitrary modal.\n  submit: () => void\n  // Imperative handle to get the data out of the form for SWC compatibility\n  getEditedColumnModels: () => SetOptional<ColumnModel, 'id'>[]\n  // Used to check if all form data is valid. Returns the current validity state\n  validate: () => boolean\n}\n\ntype TableColumnSchemaFormProps = {\n  /* The type of the Table, which determines various schema restrictions and form functionality */\n  entityType: EntityType\n  /* If this is an entity view, the ViewScope can be used to determine the default column models and fetch annotation column models */\n  viewScope?: ViewScope\n  initialData?: SetOptional<ColumnModel, 'id'>[]\n  onSubmit?: (newColumnModels: SetOptional<ColumnModel, 'id'>[]) => void\n  isSubmitting?: boolean\n  /** The original/current column models that are applied to the table, if they exist. */\n  originalColumnModels?: ColumnModel[]\n}\n\nconst ColumnHeader = styled(Box, {\n  label: 'ColumnHeader',\n})({\n  fontWeight: 700,\n})\n\nexport const ADD_ALL_ANNOTATIONS_BUTTON_TEXT = 'Add All Annotations'\n\nfunction TableColumnSchemaFormInternal(\n  props: TableColumnSchemaFormProps,\n  ref: ForwardedRef<SubmitHandle>,\n) {\n  const {\n    initialData,\n    entityType,\n    viewScope,\n    onSubmit = noop,\n    isSubmitting = false,\n    originalColumnModels,\n  } = props\n\n  const numColumnModels = useAtomValue(\n    useMemo(() => atom(get => get(tableColumnSchemaFormDataAtom).length), []),\n  )\n\n  const dispatch = useSetAtom(tableColumnSchemaFormDataAtom)\n  const [validationErrors, setValidationErrors] = useState<ZodError | null>(\n    null,\n  )\n\n  // useAtomCallback will let us imperatively read the form data, instead of tracking it in state and triggering a full re-render of the form when any data changes\n  const readFormData = useAtomCallback(\n    useCallback(get => {\n      return get(tableColumnSchemaFormDataAtom)\n    }, []),\n  )\n  const concreteTableType = convertToConcreteEntityType(entityType)\n  const isView = VIEW_CONCRETE_TYPE_VALUES.includes(\n    concreteTableType as (typeof VIEW_CONCRETE_TYPE_VALUES)[number],\n  )\n  const hasAnnotationColumnModels = isView,\n    hasDefaultColumnModels = isView\n\n  const { data: defaultColumnModels, isLoading: isLoadingDefaultColumns } =\n    useGetDefaultColumnModels(\n      viewScope?.viewEntityType!,\n      viewScope?.viewTypeMask,\n      {\n        enabled: hasDefaultColumnModels,\n        staleTime: Infinity, // The default column models will never change\n      },\n    )\n\n  const annotationColumnModelsQuery = useGetAnnotationColumnModels(\n    {\n      viewScope: viewScope!,\n      includeDerivedAnnotations: true,\n      concreteType:\n        'org.sagebionetworks.repo.model.table.ViewColumnModelRequest',\n    },\n    {\n      enabled: hasAnnotationColumnModels,\n    },\n  )\n\n  const {\n    data: annotationColumnModels,\n    isLoading: isLoadingAnnotationColumns,\n  } = annotationColumnModelsQuery\n\n  /**\n   * Set the initialData in the form state atom on mount, if it exists and we have no data.\n   */\n  useEffect(() => {\n    if (initialData && !isLoadingDefaultColumns) {\n      dispatch({\n        type: 'setValue',\n        value: transformColumnModelsToFormData(\n          initialData,\n          defaultColumnModels ?? [],\n        ),\n      })\n    }\n    // Don't re-run if initial data changes\n    // oxlint-disable-next-line react-hooks/exhaustive-deps\n  }, [isLoadingDefaultColumns])\n\n  const validateInternal = useCallback(() => {\n    const result = validateColumnModelFormData(readFormData())\n    if (result.success) {\n      setValidationErrors(null)\n    } else {\n      setValidationErrors(result.error)\n    }\n    return result\n  }, [readFormData])\n\n  useImperativeHandle(ref, () => {\n    return {\n      submit() {\n        const result = validateInternal()\n        if (result.success) {\n          onSubmit(result.data)\n        }\n      },\n      getEditedColumnModels() {\n        const result = validateInternal()\n        if (!result.success) {\n          throw new Error('Column models were not valid')\n        }\n        return result.data\n      },\n      validate() {\n        const result = validateInternal()\n        return result.success\n      },\n    }\n  }, [onSubmit, validateInternal])\n\n  // Generic function to add a set of columns to the schema (e.g. default columns, annotation columns)\n  const addColumnSet = useCallback(\n    (newColumns: SetOptional<ColumnModel, 'id'>[]) => {\n      const currentFormData = readFormData()\n      let columnsToAdd = newColumns.filter(\n        (cm: SetOptional<ColumnModel, 'id'>) => {\n          // Don't add columns that cannot be added (for example, Views cannot have JSON columns)\n          if (\n            !getAllowedColumnTypes(isView, false).includes(\n              cm.columnType as ColumnTypeEnum,\n            )\n          ) {\n            return false\n          }\n          // Only add columns that are not already present\n          // Use the name column to match because the ID may vary, e.g. if the facetType was changed\n          return !currentFormData.some(fd => fd.name === cm.name)\n        },\n      )\n      // Remove the ID column so TableColumnSchemaUtils.createTableUpdateTransactionRequest recognizes these as new columns\n      // createTableUpdateTransactionRequest uses the existing column ID to track column updates in the table, so any new columns should have no ID\n      // The user can also modify these columns before submitting them, so the ID may not be accurate when we end up submitting them\n      columnsToAdd = columnsToAdd.map(cm => omit(cm, ['id']))\n      if (columnsToAdd.length > 0) {\n        dispatch({\n          type: 'setValue',\n          value: [\n            ...currentFormData,\n            ...transformColumnModelsToFormData(\n              columnsToAdd,\n              defaultColumnModels,\n            ),\n          ],\n        })\n        displayToast(\n          `${columnsToAdd.length} ${pluralize(\n            'column',\n            columnsToAdd.length,\n          )} added to schema.`,\n          'success',\n        )\n      } else {\n        displayToast(\n          'No columns added. All columns to add are present in the column schema.',\n          'info',\n        )\n      }\n    },\n    [defaultColumnModels, dispatch, isView, readFormData],\n  )\n\n  const addDefaultColumns = useCallback(() => {\n    if (defaultColumnModels) {\n      addColumnSet(defaultColumnModels)\n    }\n  }, [defaultColumnModels, addColumnSet])\n\n  const addAnnotationColumns = useCallback(() => {\n    if (annotationColumnModels) {\n      addColumnSet(annotationColumnModels)\n    }\n  }, [annotationColumnModels, addColumnSet])\n\n  // Put the errors into a map of columnModelIndex -> errors\n  const errorsByColumnModel = useMemo(() => {\n    if (validationErrors) {\n      return groupBy(validationErrors.issues, e => e.path[0])\n    }\n    return {}\n  }, [validationErrors])\n\n  return (\n    <Box\n      component={'form'}\n      sx={{\n        py: 2.5,\n      }}\n    >\n      <TableColumnSchemaFormActions\n        disabled={isSubmitting}\n        annotationColumnModelsQuery={annotationColumnModelsQuery}\n      />\n      <Box\n        sx={{\n          display: 'grid',\n          gap: '8px',\n          gridTemplateColumns: COLUMN_SCHEMA_FORM_GRID_TEMPLATE_COLUMNS,\n          py: 2.5,\n        }}\n      >\n        <ColumnHeader>{/* Checkbox */}</ColumnHeader>\n        <ColumnHeader sx={{ gridColumn: '2 / span 2' }}>\n          Column Name\n        </ColumnHeader>\n        <ColumnHeader>Column Type</ColumnHeader>\n        <ColumnHeader>Size</ColumnHeader>\n        <ColumnHeader>Max List Length</ColumnHeader>\n        <ColumnHeader>Default Value</ColumnHeader>\n        <ColumnHeader>Restrict Values</ColumnHeader>\n        <ColumnHeader>Facet</ColumnHeader>\n        <ColumnHeader>Sort Facet Values</ColumnHeader>\n        <Box\n          sx={{\n            gridColumn: '1 / span 11',\n            backgroundColor: 'grey.300',\n            height: '2px',\n          }}\n        />\n        {times(numColumnModels, index => {\n          return (\n            <TableColumnSchemaFormRow\n              entityType={entityType}\n              columnModelIndex={index}\n              disabled={isSubmitting}\n              key={index}\n              columnModelValidationErrors={errorsByColumnModel[index]}\n              annotationColumnModels={annotationColumnModels}\n              originalColumnModels={originalColumnModels}\n            />\n          )\n        })}\n      </Box>\n      <Box\n        sx={{\n          display: 'flex',\n          gap: 1,\n        }}\n      >\n        <Button\n          variant={'outlined'}\n          onClick={() => {\n            dispatch({ type: 'appendColumn' })\n          }}\n          startIcon={<AddCircleTwoTone />}\n          disabled={isSubmitting}\n        >\n          Add Column\n        </Button>\n\n        {hasDefaultColumnModels && (\n          <Button\n            variant={'outlined'}\n            startIcon={\n              isLoadingDefaultColumns ? (\n                <SynapseSpinner />\n              ) : (\n                <AddCircleTwoTone />\n              )\n            }\n            onClick={() => {\n              addDefaultColumns()\n            }}\n            disabled={isLoadingDefaultColumns || isSubmitting}\n          >\n            Add Default {entityTypeToFriendlyName(entityType)} Columns\n          </Button>\n        )}\n\n        {hasAnnotationColumnModels && (\n          <Button\n            variant={'outlined'}\n            startIcon={\n              isLoadingAnnotationColumns ? (\n                <SynapseSpinner />\n              ) : (\n                <AddCircleTwoTone />\n              )\n            }\n            disabled={isLoadingAnnotationColumns || isSubmitting}\n            onClick={() => {\n              addAnnotationColumns()\n            }}\n          >\n            {ADD_ALL_ANNOTATIONS_BUTTON_TEXT}\n          </Button>\n        )}\n        <ImportTableColumnsButton\n          onAddColumns={cms => {\n            addColumnSet(cms)\n          }}\n          disabled={isSubmitting}\n        />\n      </Box>\n    </Box>\n  )\n}\n\ntype TableColumnSchemaFormRowProps = {\n  entityType: EntityType\n  columnModelIndex: number\n  disabled: boolean\n  columnModelValidationErrors: ZodIssue[] | null\n  annotationColumnModels?: ColumnModel[]\n  originalColumnModels?: ColumnModel[]\n}\n\nfunction TableColumnSchemaFormRow(props: TableColumnSchemaFormRowProps) {\n  const {\n    columnModelIndex,\n    entityType,\n    disabled,\n    columnModelValidationErrors = null,\n    annotationColumnModels,\n    originalColumnModels,\n  } = props\n  const dispatch = useSetAtom(tableColumnSchemaFormDataAtom)\n  const columnModel = useAtomValue(\n    useMemo(\n      () =>\n        selectAtom(\n          tableColumnSchemaFormDataAtom,\n          formData => formData[columnModelIndex],\n          isEqual,\n        ),\n      [columnModelIndex],\n    ),\n  )\n\n  // Find the original column model that matches the current column model by name and type, so we can tell the user what fields have changed\n  const originalColumnModel = originalColumnModels\n    ? findMatchingColumnModel(originalColumnModels, columnModel)\n    : undefined\n\n  // Find the closest match between passed column model and current column model with name and type\n  const defaultAnnotationModel = annotationColumnModels\n    ? findMatchingColumnModel(annotationColumnModels, columnModel)\n    : undefined\n\n  // Organize the JSON Subcolumn errors into a map of subcolumn index to errors\n  const errorsForSubcolumns = useMemo(() => {\n    if (columnModelValidationErrors) {\n      const errorsForAllSubcolumns = columnModelValidationErrors.filter(e => {\n        return e.path[0] === columnModelIndex && e.path[1] == 'jsonSubColumns'\n      })\n      return groupBy(errorsForAllSubcolumns, e => e.path[2])\n    }\n    return {}\n  }, [columnModelIndex, columnModelValidationErrors])\n\n  if (!columnModel) {\n    return <></>\n  }\n  const isDefaultColumn = columnModel.isOriginallyDefaultColumn\n\n  return (\n    <>\n      <ColumnModelForm\n        entityType={entityType}\n        columnModelIndex={columnModelIndex}\n        isDefaultColumn={isDefaultColumn}\n        disabled={disabled}\n        validationErrors={columnModelValidationErrors}\n        defaultAnnotationModel={defaultAnnotationModel}\n        originalColumnModel={originalColumnModel}\n      />\n      {columnModel.columnType === ColumnTypeEnum.JSON &&\n        columnModel.jsonSubColumns &&\n        columnModel.jsonSubColumns.map((subColumnFacet, index) => (\n          <ColumnModelForm\n            key={index}\n            entityType={entityType}\n            columnModelIndex={columnModelIndex}\n            jsonSubColumnIndex={index}\n            isDefaultColumn={isDefaultColumn}\n            disabled={disabled}\n            validationErrors={errorsForSubcolumns[index]}\n          />\n        ))}\n      {columnModel.columnType === ColumnTypeEnum.JSON && (\n        <>\n          <Box\n            sx={{\n              gridColumn: '1 / span 2',\n            }}\n          >\n            {HIERARCHY_END_COMPONENT}\n          </Box>\n          <Box\n            sx={{\n              gridColumn: '3 / span 5',\n            }}\n          >\n            <Button\n              startIcon={<AddToList />}\n              variant={'text'}\n              disabled={disabled}\n              onClick={() =>\n                dispatch({ type: 'appendJsonSubColumn', columnModelIndex })\n              }\n            >\n              Add sub-column\n            </Button>\n          </Box>\n        </>\n      )}\n    </>\n  )\n}\n\nconst TableColumnSchemaFormInternalWithForwardRef = forwardRef<\n  SubmitHandle,\n  TableColumnSchemaFormProps\n>(TableColumnSchemaFormInternal)\n\nconst TableColumnSchemaFormWrapped = forwardRef<\n  SubmitHandle,\n  TableColumnSchemaFormProps\n>(function TableColumnSchemaForm(props: TableColumnSchemaFormProps, ref) {\n  // Wrap the form in a Jotai provider so that the internal atoms are scoped to just this component instance\n  // Use forwardRef to ensure that the ref can be passed along\n  return (\n    <Provider>\n      <TableColumnSchemaFormInternalWithForwardRef {...props} ref={ref} />\n    </Provider>\n  )\n})\n\nexport default TableColumnSchemaFormWrapped\n"],"mappings":"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"}

package/dist/components/TableColumnSchemaEditor/Validators/DatetimeSchema.js

@@ -3,7 +3,7 @@ import t from "dayjs/plugin/utc";
 import { z as n } from "zod";
 //#region src/components/TableColumnSchemaEditor/Validators/DatetimeSchema.ts
 e.extend(t);
-var r = n.string().transform((t) => t.match(/^\d+$/) ? e.utc(parseInt(t)).toISOString() : e.utc(t).toISOString()), i = n.union([
+var r = n.string().transform((t) => /^\d+$/.exec(t) ? e.utc(parseInt(t)).toISOString() : e.utc(t).toISOString()), i = n.union([
 	n.number(),
 	r,
 	n.date()

package/dist/components/TableColumnSchemaEditor/Validators/DatetimeSchema.js.map

@@ -1 +1 @@
-{"version":3,"file":"DatetimeSchema.js","names":[],"sources":["../../../../src/components/TableColumnSchemaEditor/Validators/DatetimeSchema.ts"],"sourcesContent":["import { z } from 'zod'\nimport dayjs from 'dayjs'\nimport utc from 'dayjs/plugin/utc'\n\ndayjs.extend(utc)\n\n// Accepts a string that is either a UNIX timestamp in milliseconds or in ISO 8601 format, and returns a string in ISO 8601 format\nconst dateTimeString = z.string().transform(data => {\n  // Note: can't use parseInt on a timestamp! \"2000-01-01T00:00:00Z\" will be parsed as 2000\n  const isInt = data.match(/^\\d+$/)\n  if (isInt) {\n    return dayjs.utc(parseInt(data)).toISOString()\n  }\n  return dayjs.utc(data).toISOString()\n})\n\n/**\n * Validates and converts a value to a valid Synapse DATE value\n */\nexport const dateTimeSchema = z\n  .union([z.number(), dateTimeString, z.date()])\n  .transform(timestampMs => dayjs(timestampMs).toISOString())\n"],"mappings":";;;;AAIA,EAAM,OAAO,CAAG;AAGhB,IAAM,IAAiB,EAAE,OAAO,EAAE,WAAU,MAE5B,EAAK,MAAM,OACrB,IACK,EAAM,IAAI,SAAS,CAAI,CAAC,EAAE,YAAY,IAExC,EAAM,IAAI,CAAI,EAAE,YAAY,CACpC,GAKY,IAAiB,EAC3B,MAAM;CAAC,EAAE,OAAO;CAAG;CAAgB,EAAE,KAAK;AAAC,CAAC,EAC5C,WAAU,MAAe,EAAM,CAAW,EAAE,YAAY,CAAC"}
+{"version":3,"file":"DatetimeSchema.js","names":[],"sources":["../../../../src/components/TableColumnSchemaEditor/Validators/DatetimeSchema.ts"],"sourcesContent":["import { z } from 'zod'\nimport dayjs from 'dayjs'\nimport utc from 'dayjs/plugin/utc'\n\ndayjs.extend(utc)\n\n// Accepts a string that is either a UNIX timestamp in milliseconds or in ISO 8601 format, and returns a string in ISO 8601 format\nconst dateTimeString = z.string().transform(data => {\n  // Note: can't use parseInt on a timestamp! \"2000-01-01T00:00:00Z\" will be parsed as 2000\n  const isInt = /^\\d+$/.exec(data)\n  if (isInt) {\n    return dayjs.utc(parseInt(data)).toISOString()\n  }\n  return dayjs.utc(data).toISOString()\n})\n\n/**\n * Validates and converts a value to a valid Synapse DATE value\n */\nexport const dateTimeSchema = z\n  .union([z.number(), dateTimeString, z.date()])\n  .transform(timestampMs => dayjs(timestampMs).toISOString())\n"],"mappings":";;;;AAIA,EAAM,OAAO,CAAG;AAGhB,IAAM,IAAiB,EAAE,OAAO,EAAE,WAAU,MAE5B,QAAQ,KAAK,CACvB,IACK,EAAM,IAAI,SAAS,CAAI,CAAC,EAAE,YAAY,IAExC,EAAM,IAAI,CAAI,EAAE,YAAY,CACpC,GAKY,IAAiB,EAC3B,MAAM;CAAC,EAAE,OAAO;CAAG;CAAgB,EAAE,KAAK;AAAC,CAAC,EAC5C,WAAU,MAAe,EAAM,CAAW,EAAE,YAAY,CAAC"}

package/dist/components/TanStackTable/ColumnHeaderEnumFilter.js

@@ -9,7 +9,7 @@ function o(e, t) {
 function s(e, t) {
 	e.setFilterValue((e) => {
 		if (e) {
-			let i = [...e.filter((e) => !r(e, t))];
+			let i = e.filter((e) => !r(e, t));
 			if (!n(i)) return i;
 		}
 		return null;

package/dist/components/TanStackTable/ColumnHeaderEnumFilter.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColumnHeaderEnumFilter.js","names":[],"sources":["../../../src/components/TanStackTable/ColumnHeaderEnumFilter.tsx"],"sourcesContent":["import { Column, RowData } from '@tanstack/react-table'\nimport { isEmpty, isEqual, noop } from 'lodash-es'\nimport { useMemo } from 'react'\nimport EnumFacetFilterUI, {\n  EnumFacetFilterUIProps,\n  RenderedFacetValue,\n} from '../widgets/query-filter/EnumFacetFilter/EnumFacetFilterUI'\n\nfunction setEnumFilterValue<TData extends RowData, TValue = unknown>(\n  column: Column<TData, TValue>,\n  newValue: TValue,\n) {\n  if (column.columnDef.meta?.enableMultipleSelect) {\n    // Append the value to the list, or create the list if it does not exist\n    column.setFilterValue((curr: TValue[] | null): TValue[] | null => {\n      if (curr) {\n        return [...curr, newValue]\n      }\n      return [newValue]\n    })\n  } else {\n    // Replace the list\n    column.setFilterValue([newValue])\n  }\n}\n\nfunction removeEnumFilterValue<TData extends RowData, TValue = unknown>(\n  column: Column<TData, TValue>,\n  valueToRemove: TValue,\n) {\n  column.setFilterValue((curr: TValue[] | null): TValue[] | null => {\n    if (curr) {\n      const newValue = [\n        ...curr.filter(currValue => !isEqual(currValue, valueToRemove)),\n      ]\n      if (!isEmpty(newValue)) {\n        return newValue\n      }\n    }\n    return null\n  })\n}\n\ntype ColumnHeaderEnumFilterProps<TData = unknown, TValue = unknown> = {\n  column: Column<TData, TValue>\n  title: string\n}\n\nfunction getMaybeFacetedUniqueValues<TValue = unknown>(\n  columnFacetedUniqueValues: Map<TValue, number>,\n): {\n  value: TValue\n  count?: number\n}[] {\n  if (columnFacetedUniqueValues) {\n    // @tanstack/table currently has no API to define a unique set of values for a column without count statistics\n    // In each instance, we manually defined a set of unique values and set the count to 0\n    const hasFacetCounts = Array.from(columnFacetedUniqueValues.values()).some(\n      v => v != 0,\n    )\n    return Array.from(columnFacetedUniqueValues.entries()).map(\n      (entry: [TValue, number]) => ({\n        value: entry[0],\n        count: hasFacetCounts ? entry[1] : undefined,\n      }),\n    )\n  }\n  return []\n}\n\n/**\n * Used to create {@link EnumFacetFilterUIProps} that can be used to create a control to filter column values based on\n * the provided @tanstack/react-table {@link Column}. The custom properties used to configure the filter should be set\n * in the column's `meta` field.\n * @param props\n * @constructor\n */\nexport function ColumnHeaderEnumFilter<TData = unknown, TValue = unknown>(\n  props: ColumnHeaderEnumFilterProps<TData, TValue>,\n) {\n  type EnumFilterValue = TValue[]\n  const { column, title } = props\n\n  const canMultiSelect = column.columnDef.meta?.enableMultipleSelect || false\n\n  const _uncheckedFilterValues = column.getFilterValue() as EnumFilterValue\n  const filterValues = useMemo(\n    () => _uncheckedFilterValues || [],\n    [_uncheckedFilterValues],\n  )\n\n  // Use the column's enumValues and filterValues to create the facet value objects used by EnumFacetFilterUI\n  const facetedUniqueValues = column.getFacetedUniqueValues() as Map<\n    TValue,\n    number\n  >\n  const transformedFilterValues: RenderedFacetValue<TValue>[] = useMemo(\n    () =>\n      getMaybeFacetedUniqueValues(facetedUniqueValues).map(\n        (facetValue): RenderedFacetValue<TValue> => {\n          let displayText: string = facetValue.value as unknown as string\n          if (column.columnDef?.meta?.getDisplayText) {\n            displayText = column.columnDef.meta.getDisplayText(facetValue.value)\n          }\n          const currentFilterValue = filterValues || []\n          const isSelected = Boolean(\n            currentFilterValue.find(\n              filterValue => filterValue === facetValue.value,\n            ),\n          )\n          return { ...facetValue, displayText, isSelected }\n        },\n      ),\n    [column, filterValues, facetedUniqueValues],\n  )\n  return (\n    <EnumFacetFilterUI\n      facetTitle={title}\n      facetValues={transformedFilterValues}\n      filterIsActive={column.getIsFiltered()}\n      containerAs={'Dropdown'}\n      dropdownType={'Icon'}\n      defaultShowAllValues={true}\n      onAddValueToSelection={newFilterValue => {\n        setEnumFilterValue(column, newFilterValue)\n      }}\n      onRemoveValueFromSelection={valueToRemove => {\n        removeEnumFilterValue(column, valueToRemove)\n      }}\n      onRemoveAllFacetSelections={() => {\n        column.setFilterValue(null)\n      }}\n      onHoverOverValue={noop}\n      canMultiSelect={canMultiSelect}\n    />\n  )\n}\n"],"mappings":";;;;;AAQA,SAAS,EACP,GACA,GACA;CACA,AAAI,EAAO,UAAU,MAAM,uBAEzB,EAAO,gBAAgB,MACjB,IACK,CAAC,GAAG,GAAM,CAAQ,IAEpB,CAAC,CAAQ,CACjB,IAGD,EAAO,eAAe,CAAC,CAAQ,CAAC;AAEpC;AAEA,SAAS,EACP,GACA,GACA;CACA,EAAO,gBAAgB,MAA2C;EAChE,IAAI,GAAM;GACR,IAAM,IAAW,CACf,GAAG,EAAK,QAAO,MAAa,CAAC,EAAQ,GAAW,CAAa,CAAC,CAChE;GACA,IAAI,CAAC,EAAQ,CAAQ,GACnB,OAAO;EAEX;EACA,OAAO;CACT,CAAC;AACH;AAOA,SAAS,EACP,GAIE;CACF,IAAI,GAA2B;EAG7B,IAAM,IAAiB,MAAM,KAAK,EAA0B,OAAO,CAAC,EAAE,MACpE,MAAK,KAAK,CACZ;EACA,OAAO,MAAM,KAAK,EAA0B,QAAQ,CAAC,EAAE,KACpD,OAA6B;GAC5B,OAAO,EAAM;GACb,OAAO,IAAiB,EAAM,KAAK,KAAA;EACrC,EACF;CACF;CACA,OAAO,CAAC;AACV;AASA,SAAgB,EACd,GACA;CAEA,IAAM,EAAE,WAAQ,aAAU,GAEpB,IAAiB,EAAO,UAAU,MAAM,wBAAwB,IAEhE,IAAyB,EAAO,eAAe,GAC/C,IAAe,QACb,KAA0B,CAAC,GACjC,CAAC,CAAsB,CACzB,GAGM,IAAsB,EAAO,uBAAuB;CAuB1D,OACE,kBAAC,GAAD;EACE,YAAY;EACZ,aAtB0D,QAE1D,EAA4B,CAAmB,EAAE,KAC9C,MAA2C;GAC1C,IAAI,IAAsB,EAAW;GACrC,AAAI,EAAO,WAAW,MAAM,mBAC1B,IAAc,EAAO,UAAU,KAAK,eAAe,EAAW,KAAK;GAGrE,IAAM,IAAa,GADQ,KAAgB,CAAC,GAEvB,MACjB,MAAe,MAAgB,EAAW,KAC5C;GAEF,OAAO;IAAE,GAAG;IAAY;IAAa;GAAW;EAClD,CACF,GACF;GAAC;GAAQ;GAAc;EAAmB,CAK3B;EACb,gBAAgB,EAAO,cAAc;EACrC,aAAa;EACb,cAAc;EACd,sBAAsB;EACtB,wBAAuB,MAAkB;GACvC,EAAmB,GAAQ,CAAc;EAC3C;EACA,6BAA4B,MAAiB;GAC3C,EAAsB,GAAQ,CAAa;EAC7C;EACA,kCAAkC;GAChC,EAAO,eAAe,IAAI;EAC5B;EACA,kBAAkB;EACF;CACjB,CAAA;AAEL"}
+{"version":3,"file":"ColumnHeaderEnumFilter.js","names":[],"sources":["../../../src/components/TanStackTable/ColumnHeaderEnumFilter.tsx"],"sourcesContent":["import { Column, RowData } from '@tanstack/react-table'\nimport { isEmpty, isEqual, noop } from 'lodash-es'\nimport { useMemo } from 'react'\nimport EnumFacetFilterUI, {\n  EnumFacetFilterUIProps,\n  RenderedFacetValue,\n} from '../widgets/query-filter/EnumFacetFilter/EnumFacetFilterUI'\n\nfunction setEnumFilterValue<TData extends RowData, TValue = unknown>(\n  column: Column<TData, TValue>,\n  newValue: TValue,\n) {\n  if (column.columnDef.meta?.enableMultipleSelect) {\n    // Append the value to the list, or create the list if it does not exist\n    column.setFilterValue((curr: TValue[] | null): TValue[] | null => {\n      if (curr) {\n        return [...curr, newValue]\n      }\n      return [newValue]\n    })\n  } else {\n    // Replace the list\n    column.setFilterValue([newValue])\n  }\n}\n\nfunction removeEnumFilterValue<TData extends RowData, TValue = unknown>(\n  column: Column<TData, TValue>,\n  valueToRemove: TValue,\n) {\n  column.setFilterValue((curr: TValue[] | null): TValue[] | null => {\n    if (curr) {\n      const newValue = curr.filter(\n        currValue => !isEqual(currValue, valueToRemove),\n      )\n      if (!isEmpty(newValue)) {\n        return newValue\n      }\n    }\n    return null\n  })\n}\n\ntype ColumnHeaderEnumFilterProps<TData = unknown, TValue = unknown> = {\n  column: Column<TData, TValue>\n  title: string\n}\n\nfunction getMaybeFacetedUniqueValues<TValue = unknown>(\n  columnFacetedUniqueValues: Map<TValue, number>,\n): {\n  value: TValue\n  count?: number\n}[] {\n  if (columnFacetedUniqueValues) {\n    // @tanstack/table currently has no API to define a unique set of values for a column without count statistics\n    // In each instance, we manually defined a set of unique values and set the count to 0\n    const hasFacetCounts = Array.from(columnFacetedUniqueValues.values()).some(\n      v => v != 0,\n    )\n    return Array.from(columnFacetedUniqueValues.entries()).map(\n      (entry: [TValue, number]) => ({\n        value: entry[0],\n        count: hasFacetCounts ? entry[1] : undefined,\n      }),\n    )\n  }\n  return []\n}\n\n/**\n * Used to create {@link EnumFacetFilterUIProps} that can be used to create a control to filter column values based on\n * the provided @tanstack/react-table {@link Column}. The custom properties used to configure the filter should be set\n * in the column's `meta` field.\n * @param props\n * @constructor\n */\nexport function ColumnHeaderEnumFilter<TData = unknown, TValue = unknown>(\n  props: ColumnHeaderEnumFilterProps<TData, TValue>,\n) {\n  type EnumFilterValue = TValue[]\n  const { column, title } = props\n\n  const canMultiSelect = column.columnDef.meta?.enableMultipleSelect || false\n\n  const _uncheckedFilterValues = column.getFilterValue() as EnumFilterValue\n  const filterValues = useMemo(\n    () => _uncheckedFilterValues || [],\n    [_uncheckedFilterValues],\n  )\n\n  // Use the column's enumValues and filterValues to create the facet value objects used by EnumFacetFilterUI\n  const facetedUniqueValues = column.getFacetedUniqueValues() as Map<\n    TValue,\n    number\n  >\n  const transformedFilterValues: RenderedFacetValue<TValue>[] = useMemo(\n    () =>\n      getMaybeFacetedUniqueValues(facetedUniqueValues).map(\n        (facetValue): RenderedFacetValue<TValue> => {\n          let displayText: string = facetValue.value as unknown as string\n          if (column.columnDef?.meta?.getDisplayText) {\n            displayText = column.columnDef.meta.getDisplayText(facetValue.value)\n          }\n          const currentFilterValue = filterValues || []\n          const isSelected = Boolean(\n            currentFilterValue.find(\n              filterValue => filterValue === facetValue.value,\n            ),\n          )\n          return { ...facetValue, displayText, isSelected }\n        },\n      ),\n    [column, filterValues, facetedUniqueValues],\n  )\n  return (\n    <EnumFacetFilterUI\n      facetTitle={title}\n      facetValues={transformedFilterValues}\n      filterIsActive={column.getIsFiltered()}\n      containerAs={'Dropdown'}\n      dropdownType={'Icon'}\n      defaultShowAllValues={true}\n      onAddValueToSelection={newFilterValue => {\n        setEnumFilterValue(column, newFilterValue)\n      }}\n      onRemoveValueFromSelection={valueToRemove => {\n        removeEnumFilterValue(column, valueToRemove)\n      }}\n      onRemoveAllFacetSelections={() => {\n        column.setFilterValue(null)\n      }}\n      onHoverOverValue={noop}\n      canMultiSelect={canMultiSelect}\n    />\n  )\n}\n"],"mappings":";;;;;AAQA,SAAS,EACP,GACA,GACA;CACA,AAAI,EAAO,UAAU,MAAM,uBAEzB,EAAO,gBAAgB,MACjB,IACK,CAAC,GAAG,GAAM,CAAQ,IAEpB,CAAC,CAAQ,CACjB,IAGD,EAAO,eAAe,CAAC,CAAQ,CAAC;AAEpC;AAEA,SAAS,EACP,GACA,GACA;CACA,EAAO,gBAAgB,MAA2C;EAChE,IAAI,GAAM;GACR,IAAM,IAAW,EAAK,QACpB,MAAa,CAAC,EAAQ,GAAW,CAAa,CAChD;GACA,IAAI,CAAC,EAAQ,CAAQ,GACnB,OAAO;EAEX;EACA,OAAO;CACT,CAAC;AACH;AAOA,SAAS,EACP,GAIE;CACF,IAAI,GAA2B;EAG7B,IAAM,IAAiB,MAAM,KAAK,EAA0B,OAAO,CAAC,EAAE,MACpE,MAAK,KAAK,CACZ;EACA,OAAO,MAAM,KAAK,EAA0B,QAAQ,CAAC,EAAE,KACpD,OAA6B;GAC5B,OAAO,EAAM;GACb,OAAO,IAAiB,EAAM,KAAK,KAAA;EACrC,EACF;CACF;CACA,OAAO,CAAC;AACV;AASA,SAAgB,EACd,GACA;CAEA,IAAM,EAAE,WAAQ,aAAU,GAEpB,IAAiB,EAAO,UAAU,MAAM,wBAAwB,IAEhE,IAAyB,EAAO,eAAe,GAC/C,IAAe,QACb,KAA0B,CAAC,GACjC,CAAC,CAAsB,CACzB,GAGM,IAAsB,EAAO,uBAAuB;CAuB1D,OACE,kBAAC,GAAD;EACE,YAAY;EACZ,aAtB0D,QAE1D,EAA4B,CAAmB,EAAE,KAC9C,MAA2C;GAC1C,IAAI,IAAsB,EAAW;GACrC,AAAI,EAAO,WAAW,MAAM,mBAC1B,IAAc,EAAO,UAAU,KAAK,eAAe,EAAW,KAAK;GAGrE,IAAM,IAAa,GADQ,KAAgB,CAAC,GAEvB,MACjB,MAAe,MAAgB,EAAW,KAC5C;GAEF,OAAO;IAAE,GAAG;IAAY;IAAa;GAAW;EAClD,CACF,GACF;GAAC;GAAQ;GAAc;EAAmB,CAK3B;EACb,gBAAgB,EAAO,cAAc;EACrC,aAAa;EACb,cAAc;EACd,sBAAsB;EACtB,wBAAuB,MAAkB;GACvC,EAAmB,GAAQ,CAAc;EAC3C;EACA,6BAA4B,MAAiB;GAC3C,EAAsB,GAAQ,CAAa;EAC7C;EACA,kCAAkC;GAChC,EAAO,eAAe,IAAI;EAC5B;EACA,kBAAkB;EACF;CACjB,CAAA;AAEL"}

package/dist/components/TanStackTable/StyledTanStackTable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StyledTanStackTable.d.ts","sourceRoot":"","sources":["../../../src/components/TanStackTable/StyledTanStackTable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,yBAAyB,EAC1B,MAAM,0CAA0C,CAAA;AAGjD,OAAO,EAGL,GAAG,EACH,KAAK,EACN,MAAM,uBAAuB,CAAA;AAE9B,OAAO,EAAgC,cAAc,EAAE,MAAM,aAAa,CAAA;AAM1E,OAAO,EAAE,4BAA4B,EAAE,wBAAwB,EAAE,MAAM,SAAS,CAAA;AAGhF,MAAM,MAAM,wBAAwB,CAAC,KAAK,GAAG,OAAO,EAAE,QAAQ,GAAG,GAAG,CAAC,KAAK,CAAC,IAAI;IAC7E,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CAAA;IACnB,yBAAyB,CAAC,EAAE,yBAAyB,CAAA;IACrD,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,KAAK,CAAC,EAAE,wBAAwB,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAA;IACjD,SAAS,CAAC,EAAE,4BAA4B,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAA;CAC1D,GAAG,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,cAAc,CAAC,CAAA;AAElE;;;GAGG;AACH,MAAM,CAAC,OAAO,UAAU,mBAAmB,CACzC,KAAK,GAAG,OAAO,EACf,QAAQ,GAAG,GAAG,CAAC,KAAK,CAAC,EACrB,KAAK,EAAE,wBAAwB,CAAC,KAAK,EAAE,QAAQ,CAAC,2CAkOjD"}
+{"version":3,"file":"StyledTanStackTable.d.ts","sourceRoot":"","sources":["../../../src/components/TanStackTable/StyledTanStackTable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,yBAAyB,EAC1B,MAAM,0CAA0C,CAAA;AAGjD,OAAO,EAGL,GAAG,EACH,KAAK,EACN,MAAM,uBAAuB,CAAA;AAE9B,OAAO,EAAgC,cAAc,EAAE,MAAM,aAAa,CAAA;AAM1E,OAAO,EAAE,4BAA4B,EAAE,wBAAwB,EAAE,MAAM,SAAS,CAAA;AAGhF,MAAM,MAAM,wBAAwB,CAAC,KAAK,GAAG,OAAO,EAAE,QAAQ,GAAG,GAAG,CAAC,KAAK,CAAC,IAAI;IAC7E,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CAAA;IACnB,yBAAyB,CAAC,EAAE,yBAAyB,CAAA;IACrD,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,KAAK,CAAC,EAAE,wBAAwB,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAA;IACjD,SAAS,CAAC,EAAE,4BAA4B,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAA;CAC1D,GAAG,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,cAAc,CAAC,CAAA;AAElE;;;GAGG;AACH,MAAM,CAAC,OAAO,UAAU,mBAAmB,CACzC,KAAK,GAAG,OAAO,EACf,QAAQ,GAAG,GAAG,CAAC,KAAK,CAAC,EACrB,KAAK,EAAE,wBAAwB,CAAC,KAAK,EAAE,QAAQ,CAAC,2CAiOjD"}

package/dist/components/TanStackTable/StyledTanStackTable.js

@@ -34,10 +34,7 @@ function _(_) {
 	]);
 	let J = c(() => {
 		let e = v.getFlatHeaders(), n = {};
-		for (let i = 0; i < e.length; i++) {
-			let a = e[i];
-			n[r(a.id)] = a.getSize(), n[t(a.column.id)] = a.column.getSize();
-		}
+		for (let i of e) n[r(i.id)] = i.getSize(), n[t(i.column.id)] = i.column.getSize();
 		return n;
 	}, [
 		v.getState().columnSizingInfo,

package/dist/components/TanStackTable/StyledTanStackTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"StyledTanStackTable.js","names":[],"sources":["../../../src/components/TanStackTable/StyledTanStackTable.tsx"],"sourcesContent":["import {\n  StyledTableContainer,\n  StyledTableContainerProps,\n} from '@/components/styled/StyledTableContainer'\nimport { Box } from '@mui/material'\nimport { useForkRef } from '@mui/material/utils'\nimport {\n  ColumnSizingState,\n  flexRender,\n  Row,\n  Table,\n} from '@tanstack/react-table'\nimport { UIEvent, useLayoutEffect, useMemo, useRef, useState } from 'react'\nimport { MemoizedTableBody, TableBody, TableBodyProps } from './TableBody'\nimport {\n  getColumnSizeCssVariable,\n  getCommonPinningStyles,\n  getHeaderSizeCssVariable,\n} from './TanStackTableUtils'\nimport { StyledTanStackTableSlotProps, StyledTanStackTableSlots } from './types'\nimport { useSyncedTopScrollbar } from './useSyncedTopScrollbar'\n\nexport type StyledTanStackTableProps<TData = unknown, TRowType = Row<TData>> = {\n  table: Table<TData>\n  styledTableContainerProps?: StyledTableContainerProps\n  fullWidth?: boolean\n  /**\n   * When true, uses `table-layout: auto` so the browser sizes columns to fit their content.\n   * Column sizes from TanStack act as minimum widths, and columns expand to fit wider content.\n   * Resizing still works — dragging a column sets a new minimum width.\n   * Defaults to false (fixed layout).\n   */\n  autoColumnSizing?: boolean\n  /**\n   * When true, renders an additional horizontal scrollbar above the table (in addition to the\n   * browser's native scrollbar below it), synced to the same scroll position. Useful for wide\n   * tables where the bottom scrollbar may be far from the viewport's visible area.\n   * @default false\n   */\n  showTopScrollbar?: boolean\n  slots?: StyledTanStackTableSlots<TData, TRowType>\n  slotProps?: StyledTanStackTableSlotProps<TData, TRowType>\n} & Pick<TableBodyProps<TData, TRowType>, 'rows' | 'rowTransform'>\n\n/**\n * Component that renders a styled table using @tanstack/react-table. Pass your table instance into the component and\n * it will render the table with the appropriate headers and rows.\n */\nexport default function StyledTanStackTable<\n  TData = unknown,\n  TRowType = Row<TData>,\n>(props: StyledTanStackTableProps<TData, TRowType>) {\n  const {\n    table,\n    styledTableContainerProps,\n    fullWidth = true,\n    autoColumnSizing = false,\n    showTopScrollbar = false,\n    slots = {},\n    slotProps = {},\n  } = props\n  const {\n    Thead = 'thead',\n    Th = 'th',\n    Table = 'table',\n    ...tableBodySlots\n  } = slots\n  const {\n    Table: tableSlotProps = {},\n    Thead: theadSlotProps = {},\n    Th: thSlotProps = {},\n    ...tableBodySlotProps\n  } = slotProps\n\n  const tableBodyProps: TableBodyProps<TData, TRowType> = {\n    table,\n    slots: tableBodySlots,\n    slotProps: tableBodySlotProps,\n    rows: props.rows!,\n    rowTransform: props.rowTransform!,\n  }\n\n  /**\n   * When autoColumnSizing is true we do a two-phase render:\n   *  1. Render with table-layout: auto and no width constraints so the browser\n   *     natively sizes each column to its content.\n   *  2. After the first paint, measure each <th> and write the real pixel widths\n   *     into TanStack's columnSizing state, then switch to table-layout: fixed.\n   *\n   * This gives content-based initial sizes while still allowing the user to drag\n   * a column narrower than its content.\n   */\n  const tableRef = useRef<HTMLTableElement>(null)\n\n  const {\n    containerRef,\n    topScrollRef,\n    targetWidth: tableRenderedWidth,\n    handleTopScroll,\n    handleBottomScroll,\n  } = useSyncedTopScrollbar(tableRef, showTopScrollbar)\n\n  // Merge our own container ref/onScroll with any that the caller passed via\n  // styledTableContainerProps, rather than one clobbering the other.\n  const {\n    ref: callerContainerRef,\n    onScroll: callerOnScroll,\n    ...restContainerProps\n  } = styledTableContainerProps ?? {}\n  const mergedContainerRef = useForkRef(containerRef, callerContainerRef)\n\n  // Track what columns+visibility combination was last measured so we know when\n  // a re-measurement is needed (e.g. columns change or visibility is toggled).\n  const columnVisibility = table.getState().columnVisibility\n  const [lastMeasuredState, setLastMeasuredState] = useState<{\n    columns: typeof table.options.columns\n    columnVisibility: typeof columnVisibility\n  } | null>(null)\n\n  // hasMeasured is true when auto-sizing is disabled (nothing to do) OR when the\n  // current columns+visibility matches the last measured snapshot.\n  const hasMeasured =\n    !autoColumnSizing ||\n    (lastMeasuredState?.columns === table.options.columns &&\n      lastMeasuredState?.columnVisibility === columnVisibility)\n\n  // After the browser has laid out the auto-sized table, capture the widths and\n  // switch to fixed layout so that the user can resize below the content width.\n  // useLayoutEffect runs synchronously after DOM mutations, before the browser\n  // paints, which is required for accurate DOM measurements.\n  useLayoutEffect(() => {\n    if (!autoColumnSizing || hasMeasured || !tableRef.current) return\n\n    const ths = tableRef.current.querySelectorAll(\n      ':scope > thead > tr:first-child > th',\n    )\n    const headers = table.getFlatHeaders()\n    const newSizes: ColumnSizingState = {}\n    headers.forEach((header, i) => {\n      const th = ths[i] as HTMLElement | undefined\n      if (th) {\n        newSizes[header.column.id] = Math.ceil(th.getBoundingClientRect().width)\n      }\n    })\n    if (Object.keys(newSizes).length > 0) {\n      table.setColumnSizing(newSizes)\n      setLastMeasuredState({\n        columns: table.options.columns,\n        columnVisibility,\n      })\n    }\n  }, [autoColumnSizing, columnVisibility, hasMeasured, table])\n\n  /**\n   * Instead of calling `column.getSize()` on every render for every header\n   * and especially every data cell (very expensive),\n   * we will calculate all column sizes at once at the root table level in a useMemo\n   * and pass the column sizes down as CSS variables to the <table> element.\n   *\n   * See https://tanstack.com/table/v8/docs/guide/column-sizing#advanced-column-resizing-performance\n   */\n  const columnSizeVars = useMemo(() => {\n    const headers = table.getFlatHeaders()\n    const colSizes: { [key: string]: number } = {}\n    for (let i = 0; i < headers.length; i++) {\n      const header = headers[i]\n      colSizes[getHeaderSizeCssVariable(header.id)] = header.getSize()\n      colSizes[getColumnSizeCssVariable(header.column.id)] =\n        header.column.getSize()\n    }\n    return colSizes\n    // Intentionally limit the dependencies to only recompute when the column sizes change\n    // oxlint-disable-next-line react-hooks/exhaustive-deps\n  }, [\n    table.getState().columnSizingInfo,\n    table.getState().columnSizing,\n    table.getState().columnVisibility, // If a column is added, its width should be recalculated\n  ])\n\n  // Before measurement: let the browser shrink the table to content width so we\n  // can read accurate sizes. After measurement: use the exact measured total.\n  let tableWidth: string\n  if (fullWidth) {\n    tableWidth = '100%'\n  } else if (!hasMeasured) {\n    tableWidth = 'max-content'\n  } else {\n    tableWidth = `${table.getTotalSize()}px`\n  }\n\n  /* When resizing any column we will render this special memoized version of our table body */\n  const TableBodyElement = table.getState().columnSizingInfo.isResizingColumn\n    ? MemoizedTableBody\n    : TableBody\n\n  function handleContainerScroll(e: UIEvent<HTMLDivElement>) {\n    callerOnScroll?.(e)\n    if (showTopScrollbar) {\n      handleBottomScroll(e)\n    }\n  }\n\n  return (\n    <>\n      {showTopScrollbar && (\n        <Box\n          ref={topScrollRef}\n          onScroll={handleTopScroll}\n          sx={{ overflowX: 'auto', overflowY: 'hidden', height: '16px' }}\n        >\n          <Box sx={{ width: tableRenderedWidth, height: '1px' }} />\n        </Box>\n      )}\n      <StyledTableContainer\n        {...restContainerProps}\n        ref={mergedContainerRef}\n        onScroll={handleContainerScroll}\n      >\n        <Table\n          {...tableSlotProps}\n          ref={tableRef}\n          style={{\n            ...columnSizeVars,\n            // Pre-measurement: auto layout so the browser can size columns to content.\n            // Post-measurement: fixed layout so the user can resize below content width.\n            tableLayout: hasMeasured ? 'fixed' : 'auto',\n            width: tableWidth,\n            ...tableSlotProps['style'],\n          }}\n        >\n          <Thead {...theadSlotProps}>\n            {table.getHeaderGroups().map(headerGroup => {\n              return (\n                <tr key={headerGroup.id}>\n                  {headerGroup.headers.map(header => (\n                    <Th\n                      key={header.id}\n                      colSpan={header.colSpan}\n                      {...thSlotProps}\n                      style={{\n                        // Pre-measurement: no width hint — let the browser size freely.\n                        // Post-measurement: exact width from the measured/resized value.\n                        ...(hasMeasured && {\n                          width: `calc(var(${getHeaderSizeCssVariable(\n                            header.id,\n                          )}) * 1px)`,\n                        }),\n                        ...getCommonPinningStyles(header.column),\n                        ...thSlotProps['style'],\n                      }}\n                    >\n                      {header.isPlaceholder\n                        ? null\n                        : flexRender(\n                            header.column.columnDef.header,\n                            header.getContext(),\n                          )}\n                      {header.column.getCanResize() && (\n                        <div\n                          className={`resizer ${\n                            header.column.getIsResizing() ? 'isResizing' : ''\n                          }`}\n                          onMouseDown={header.getResizeHandler()}\n                          onTouchStart={header.getResizeHandler()}\n                        />\n                      )}\n                    </Th>\n                  ))}\n                </tr>\n              )\n            })}\n          </Thead>\n          <TableBodyElement<TData, TRowType> {...tableBodyProps} />\n        </Table>\n      </StyledTableContainer>\n    </>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"StyledTanStackTable.js","names":[],"sources":["../../../src/components/TanStackTable/StyledTanStackTable.tsx"],"sourcesContent":["import {\n  StyledTableContainer,\n  StyledTableContainerProps,\n} from '@/components/styled/StyledTableContainer'\nimport { Box } from '@mui/material'\nimport { useForkRef } from '@mui/material/utils'\nimport {\n  ColumnSizingState,\n  flexRender,\n  Row,\n  Table,\n} from '@tanstack/react-table'\nimport { UIEvent, useLayoutEffect, useMemo, useRef, useState } from 'react'\nimport { MemoizedTableBody, TableBody, TableBodyProps } from './TableBody'\nimport {\n  getColumnSizeCssVariable,\n  getCommonPinningStyles,\n  getHeaderSizeCssVariable,\n} from './TanStackTableUtils'\nimport { StyledTanStackTableSlotProps, StyledTanStackTableSlots } from './types'\nimport { useSyncedTopScrollbar } from './useSyncedTopScrollbar'\n\nexport type StyledTanStackTableProps<TData = unknown, TRowType = Row<TData>> = {\n  table: Table<TData>\n  styledTableContainerProps?: StyledTableContainerProps\n  fullWidth?: boolean\n  /**\n   * When true, uses `table-layout: auto` so the browser sizes columns to fit their content.\n   * Column sizes from TanStack act as minimum widths, and columns expand to fit wider content.\n   * Resizing still works — dragging a column sets a new minimum width.\n   * Defaults to false (fixed layout).\n   */\n  autoColumnSizing?: boolean\n  /**\n   * When true, renders an additional horizontal scrollbar above the table (in addition to the\n   * browser's native scrollbar below it), synced to the same scroll position. Useful for wide\n   * tables where the bottom scrollbar may be far from the viewport's visible area.\n   * @default false\n   */\n  showTopScrollbar?: boolean\n  slots?: StyledTanStackTableSlots<TData, TRowType>\n  slotProps?: StyledTanStackTableSlotProps<TData, TRowType>\n} & Pick<TableBodyProps<TData, TRowType>, 'rows' | 'rowTransform'>\n\n/**\n * Component that renders a styled table using @tanstack/react-table. Pass your table instance into the component and\n * it will render the table with the appropriate headers and rows.\n */\nexport default function StyledTanStackTable<\n  TData = unknown,\n  TRowType = Row<TData>,\n>(props: StyledTanStackTableProps<TData, TRowType>) {\n  const {\n    table,\n    styledTableContainerProps,\n    fullWidth = true,\n    autoColumnSizing = false,\n    showTopScrollbar = false,\n    slots = {},\n    slotProps = {},\n  } = props\n  const {\n    Thead = 'thead',\n    Th = 'th',\n    Table = 'table',\n    ...tableBodySlots\n  } = slots\n  const {\n    Table: tableSlotProps = {},\n    Thead: theadSlotProps = {},\n    Th: thSlotProps = {},\n    ...tableBodySlotProps\n  } = slotProps\n\n  const tableBodyProps: TableBodyProps<TData, TRowType> = {\n    table,\n    slots: tableBodySlots,\n    slotProps: tableBodySlotProps,\n    rows: props.rows!,\n    rowTransform: props.rowTransform!,\n  }\n\n  /**\n   * When autoColumnSizing is true we do a two-phase render:\n   *  1. Render with table-layout: auto and no width constraints so the browser\n   *     natively sizes each column to its content.\n   *  2. After the first paint, measure each <th> and write the real pixel widths\n   *     into TanStack's columnSizing state, then switch to table-layout: fixed.\n   *\n   * This gives content-based initial sizes while still allowing the user to drag\n   * a column narrower than its content.\n   */\n  const tableRef = useRef<HTMLTableElement>(null)\n\n  const {\n    containerRef,\n    topScrollRef,\n    targetWidth: tableRenderedWidth,\n    handleTopScroll,\n    handleBottomScroll,\n  } = useSyncedTopScrollbar(tableRef, showTopScrollbar)\n\n  // Merge our own container ref/onScroll with any that the caller passed via\n  // styledTableContainerProps, rather than one clobbering the other.\n  const {\n    ref: callerContainerRef,\n    onScroll: callerOnScroll,\n    ...restContainerProps\n  } = styledTableContainerProps ?? {}\n  const mergedContainerRef = useForkRef(containerRef, callerContainerRef)\n\n  // Track what columns+visibility combination was last measured so we know when\n  // a re-measurement is needed (e.g. columns change or visibility is toggled).\n  const columnVisibility = table.getState().columnVisibility\n  const [lastMeasuredState, setLastMeasuredState] = useState<{\n    columns: typeof table.options.columns\n    columnVisibility: typeof columnVisibility\n  } | null>(null)\n\n  // hasMeasured is true when auto-sizing is disabled (nothing to do) OR when the\n  // current columns+visibility matches the last measured snapshot.\n  const hasMeasured =\n    !autoColumnSizing ||\n    (lastMeasuredState?.columns === table.options.columns &&\n      lastMeasuredState?.columnVisibility === columnVisibility)\n\n  // After the browser has laid out the auto-sized table, capture the widths and\n  // switch to fixed layout so that the user can resize below the content width.\n  // useLayoutEffect runs synchronously after DOM mutations, before the browser\n  // paints, which is required for accurate DOM measurements.\n  useLayoutEffect(() => {\n    if (!autoColumnSizing || hasMeasured || !tableRef.current) return\n\n    const ths = tableRef.current.querySelectorAll(\n      ':scope > thead > tr:first-child > th',\n    )\n    const headers = table.getFlatHeaders()\n    const newSizes: ColumnSizingState = {}\n    headers.forEach((header, i) => {\n      const th = ths[i] as HTMLElement | undefined\n      if (th) {\n        newSizes[header.column.id] = Math.ceil(th.getBoundingClientRect().width)\n      }\n    })\n    if (Object.keys(newSizes).length > 0) {\n      table.setColumnSizing(newSizes)\n      setLastMeasuredState({\n        columns: table.options.columns,\n        columnVisibility,\n      })\n    }\n  }, [autoColumnSizing, columnVisibility, hasMeasured, table])\n\n  /**\n   * Instead of calling `column.getSize()` on every render for every header\n   * and especially every data cell (very expensive),\n   * we will calculate all column sizes at once at the root table level in a useMemo\n   * and pass the column sizes down as CSS variables to the <table> element.\n   *\n   * See https://tanstack.com/table/v8/docs/guide/column-sizing#advanced-column-resizing-performance\n   */\n  const columnSizeVars = useMemo(() => {\n    const headers = table.getFlatHeaders()\n    const colSizes: { [key: string]: number } = {}\n    for (const header of headers) {\n      colSizes[getHeaderSizeCssVariable(header.id)] = header.getSize()\n      colSizes[getColumnSizeCssVariable(header.column.id)] =\n        header.column.getSize()\n    }\n    return colSizes\n    // Intentionally limit the dependencies to only recompute when the column sizes change\n    // oxlint-disable-next-line react-hooks/exhaustive-deps\n  }, [\n    table.getState().columnSizingInfo,\n    table.getState().columnSizing,\n    table.getState().columnVisibility, // If a column is added, its width should be recalculated\n  ])\n\n  // Before measurement: let the browser shrink the table to content width so we\n  // can read accurate sizes. After measurement: use the exact measured total.\n  let tableWidth: string\n  if (fullWidth) {\n    tableWidth = '100%'\n  } else if (!hasMeasured) {\n    tableWidth = 'max-content'\n  } else {\n    tableWidth = `${table.getTotalSize()}px`\n  }\n\n  /* When resizing any column we will render this special memoized version of our table body */\n  const TableBodyElement = table.getState().columnSizingInfo.isResizingColumn\n    ? MemoizedTableBody\n    : TableBody\n\n  function handleContainerScroll(e: UIEvent<HTMLDivElement>) {\n    callerOnScroll?.(e)\n    if (showTopScrollbar) {\n      handleBottomScroll(e)\n    }\n  }\n\n  return (\n    <>\n      {showTopScrollbar && (\n        <Box\n          ref={topScrollRef}\n          onScroll={handleTopScroll}\n          sx={{ overflowX: 'auto', overflowY: 'hidden', height: '16px' }}\n        >\n          <Box sx={{ width: tableRenderedWidth, height: '1px' }} />\n        </Box>\n      )}\n      <StyledTableContainer\n        {...restContainerProps}\n        ref={mergedContainerRef}\n        onScroll={handleContainerScroll}\n      >\n        <Table\n          {...tableSlotProps}\n          ref={tableRef}\n          style={{\n            ...columnSizeVars,\n            // Pre-measurement: auto layout so the browser can size columns to content.\n            // Post-measurement: fixed layout so the user can resize below content width.\n            tableLayout: hasMeasured ? 'fixed' : 'auto',\n            width: tableWidth,\n            ...tableSlotProps['style'],\n          }}\n        >\n          <Thead {...theadSlotProps}>\n            {table.getHeaderGroups().map(headerGroup => {\n              return (\n                <tr key={headerGroup.id}>\n                  {headerGroup.headers.map(header => (\n                    <Th\n                      key={header.id}\n                      colSpan={header.colSpan}\n                      {...thSlotProps}\n                      style={{\n                        // Pre-measurement: no width hint — let the browser size freely.\n                        // Post-measurement: exact width from the measured/resized value.\n                        ...(hasMeasured && {\n                          width: `calc(var(${getHeaderSizeCssVariable(\n                            header.id,\n                          )}) * 1px)`,\n                        }),\n                        ...getCommonPinningStyles(header.column),\n                        ...thSlotProps['style'],\n                      }}\n                    >\n                      {header.isPlaceholder\n                        ? null\n                        : flexRender(\n                            header.column.columnDef.header,\n                            header.getContext(),\n                          )}\n                      {header.column.getCanResize() && (\n                        <div\n                          className={`resizer ${\n                            header.column.getIsResizing() ? 'isResizing' : ''\n                          }`}\n                          onMouseDown={header.getResizeHandler()}\n                          onTouchStart={header.getResizeHandler()}\n                        />\n                      )}\n                    </Th>\n                  ))}\n                </tr>\n              )\n            })}\n          </Thead>\n          <TableBodyElement<TData, TRowType> {...tableBodyProps} />\n        </Table>\n      </StyledTableContainer>\n    </>\n  )\n}\n"],"mappings":"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"}

package/dist/components/TermsAndConditions/TermsAndConditions.js.map

@@ -1 +1 @@
-{"version":3,"file":"TermsAndConditions.js","names":[],"sources":["../../../src/components/TermsAndConditions/TermsAndConditions.tsx"],"sourcesContent":["import { useGetFullTableQueryResults } from '@/synapse-queries'\nimport {\n  BUNDLE_MASK_QUERY_RESULTS,\n  URL_TERMS_CONDITIONS_AGREEMENT,\n} from '@/utils/SynapseConstants'\nimport { Alert, AlertTitle, Button, Link, Typography } from '@mui/material'\nimport { useEffect, useState } from 'react'\nimport TermsAndConditionsItem, {\n  LoadingItem,\n  tcItem,\n} from './TermsAndConditionsItem'\n\nexport type TermsAndConditionsProps = {\n  onFormChange: (formComplete: boolean) => void\n  termsAndConditionsTableID: string\n  termsAndConditionsTableVersion: string\n  hideLinkToFullTC?: boolean\n}\n\nfunction TermsAndConditions({\n  termsAndConditionsTableID,\n  termsAndConditionsTableVersion,\n  onFormChange,\n  hideLinkToFullTC = false,\n}: TermsAndConditionsProps) {\n  const [tcList, setTcList] = useState<tcItem[]>([])\n  // Fetch the table data\n  const { data, isLoading, error, isError } = useGetFullTableQueryResults(\n    {\n      entityId: termsAndConditionsTableID,\n      query: {\n        sql: `SELECT * FROM ${termsAndConditionsTableID}.${termsAndConditionsTableVersion} ORDER BY order asc`,\n      },\n      partMask: BUNDLE_MASK_QUERY_RESULTS,\n      concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n    },\n    { staleTime: Infinity },\n    true, // force this query to be run as the anonymous user (without an access token)\n  )\n\n  const isTermsAndConditionsTableNotFound = isError && error.status == 404\n\n  if (isTermsAndConditionsTableNotFound) {\n    // \"Pledge\" Synapse table is unavailable on this stack.  Allow agreement to the terms, but we will show a warning below\n    onFormChange(true)\n  }\n\n  // update tcList when data changes (transform)\n  useEffect(() => {\n    if (data?.queryResult?.queryResults) {\n      const { rows, headers } = data.queryResult.queryResults\n      const iconColIndex = headers.findIndex(col => col.name === 'icon')\n      const labelColIndex = headers.findIndex(col => col.name === 'label')\n      const descriptionColIndex = headers.findIndex(\n        col => col.name === 'description',\n      )\n      const newTcList: tcItem[] = []\n      rows.forEach(row => {\n        const { values } = row\n        const item: tcItem = {\n          iconFileHandleId: values[iconColIndex] ?? '',\n          label: values[labelColIndex] ?? '',\n          description: values[descriptionColIndex] ?? '',\n        }\n        newTcList.push(item)\n      })\n      setTcList(newTcList)\n      const checkboxCount = newTcList.length\n      setCheckboxChecked(getInitialCheckboxState(checkboxCount))\n      // disabled all checkbox except the first one\n      setCheckboxEnabled(\n        getInitialCheckboxState(checkboxCount).fill(true, 0, 1),\n      )\n    }\n  }, [data])\n\n  const sageTermsOfService =\n    'https://www.synapse.org/TrustCenter:TermsOfService'\n  const trustCenter = 'https://sagebionetworks.org/trust-center'\n  const getInitialCheckboxState = (checkboxCount: number) =>\n    Array.from(Array(checkboxCount).fill(false))\n  let mounted = true\n\n  // State variables\n  const [checkboxChecked, setCheckboxChecked] = useState<boolean[]>([])\n  const [checkboxEnabled, setCheckboxEnabled] = useState<boolean[]>([])\n\n  useEffect(() => {\n    if (mounted) {\n      checkFormCompleted()\n    }\n    return () => {\n      mounted = false\n    }\n  }, [checkboxEnabled, checkboxChecked])\n\n  // Placeholder function to check if all checkboxes are checked and agreement is signed\n  const checkFormCompleted = () => {\n    const allCheckboxChecked =\n      checkboxChecked.length > 0 && !checkboxChecked.includes(false)\n    onFormChange(allCheckboxChecked)\n  }\n\n  const updateCheckboxState = (id: number) => {\n    const newState = !checkboxChecked[id]\n    const checkboxCount = checkboxChecked.length\n    if (newState) {\n      // if the checkbox is checked (i.e. newState is true)\n      setCheckboxChecked(\n        getInitialCheckboxState(checkboxCount).fill(true, 0, id + 1),\n      )\n      if (id + 2 <= tcList.length) {\n        setCheckboxEnabled(\n          getInitialCheckboxState(checkboxCount).fill(true, 0, id + 2),\n        )\n      }\n    } else {\n      setCheckboxChecked(\n        getInitialCheckboxState(checkboxCount).fill(true, 0, id),\n      )\n      setCheckboxEnabled(\n        getInitialCheckboxState(checkboxCount).fill(true, 0, id + 1),\n      )\n    }\n  }\n\n  return (\n    <section className=\"terms-conditions\">\n      <h3 className=\"page-header\">Pledge</h3>\n      <form>\n        <label>\n          I affirm my commitment to Sage&apos;s{' '}\n          <Link target=\"_blank\" href={sageTermsOfService}>\n            Terms of Service\n          </Link>{' '}\n          and policies for responsible research and data handling (\n          <Link target=\"_blank\" href={trustCenter}>\n            Trust Center\n          </Link>\n          ), including:\n        </label>\n        {isTermsAndConditionsTableNotFound && (\n          <Alert severity=\"warning\">\n            <AlertTitle>Source data unavailable</AlertTitle>\n            <Typography variant=\"body1\">\n              We are unable to display the source table content for the Synapse\n              Pledge at this time. Please review the full{' '}\n              <Link target=\"_blank\" href={sageTermsOfService}>\n                {' '}\n                Terms of Service{' '}\n              </Link>{' '}\n              carefully before proceeding. By clicking \"Agree And Continue,\" you\n              confirm that you have read and understood the Terms and Conditions\n              for use.\n            </Typography>\n          </Alert>\n        )}\n        <ul className=\"term-list\">\n          {isLoading && <LoadingItem numLoadingItems={6} />}\n          {tcList.length > 0 &&\n            tcList.map((item, i) => {\n              return (\n                <TermsAndConditionsItem\n                  key={`tc-item-${i}`}\n                  item={item}\n                  id={i}\n                  checked={checkboxChecked[i]}\n                  enabled={checkboxEnabled[i]}\n                  termsAndConditionsTableID={termsAndConditionsTableID}\n                  onChange={updateCheckboxState}\n                />\n              )\n            })}\n        </ul>\n        {!hideLinkToFullTC && (\n          <div className=\"view-terms\">\n            <Button\n              variant={'contained'}\n              href={URL_TERMS_CONDITIONS_AGREEMENT}\n              target=\"_blank\"\n            >\n              View Complete Terms and Conditions for Use\n            </Button>\n          </div>\n        )}\n      </form>\n    </section>\n  )\n}\n\nexport default TermsAndConditions\n"],"mappings":"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"}
+{"version":3,"file":"TermsAndConditions.js","names":[],"sources":["../../../src/components/TermsAndConditions/TermsAndConditions.tsx"],"sourcesContent":["import { useGetFullTableQueryResults } from '@/synapse-queries'\nimport {\n  BUNDLE_MASK_QUERY_RESULTS,\n  URL_TERMS_CONDITIONS_AGREEMENT,\n} from '@/utils/SynapseConstants'\nimport { Alert, AlertTitle, Button, Link, Typography } from '@mui/material'\nimport { useEffect, useState } from 'react'\nimport TermsAndConditionsItem, {\n  LoadingItem,\n  tcItem,\n} from './TermsAndConditionsItem'\n\nexport type TermsAndConditionsProps = {\n  onFormChange: (formComplete: boolean) => void\n  termsAndConditionsTableID: string\n  termsAndConditionsTableVersion: string\n  hideLinkToFullTC?: boolean\n}\n\nfunction TermsAndConditions({\n  termsAndConditionsTableID,\n  termsAndConditionsTableVersion,\n  onFormChange,\n  hideLinkToFullTC = false,\n}: TermsAndConditionsProps) {\n  const [tcList, setTcList] = useState<tcItem[]>([])\n  // Fetch the table data\n  const { data, isLoading, error, isError } = useGetFullTableQueryResults(\n    {\n      entityId: termsAndConditionsTableID,\n      query: {\n        sql: `SELECT * FROM ${termsAndConditionsTableID}.${termsAndConditionsTableVersion} ORDER BY order asc`,\n      },\n      partMask: BUNDLE_MASK_QUERY_RESULTS,\n      concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n    },\n    { staleTime: Infinity },\n    true, // force this query to be run as the anonymous user (without an access token)\n  )\n\n  const isTermsAndConditionsTableNotFound = isError && error.status == 404\n\n  if (isTermsAndConditionsTableNotFound) {\n    // \"Pledge\" Synapse table is unavailable on this stack.  Allow agreement to the terms, but we will show a warning below\n    onFormChange(true)\n  }\n\n  // update tcList when data changes (transform)\n  useEffect(() => {\n    if (data?.queryResult?.queryResults) {\n      const { rows, headers } = data.queryResult.queryResults\n      const iconColIndex = headers.findIndex(col => col.name === 'icon')\n      const labelColIndex = headers.findIndex(col => col.name === 'label')\n      const descriptionColIndex = headers.findIndex(\n        col => col.name === 'description',\n      )\n      const newTcList: tcItem[] = []\n      rows.forEach(row => {\n        const { values } = row\n        const item: tcItem = {\n          iconFileHandleId: values[iconColIndex] ?? '',\n          label: values[labelColIndex] ?? '',\n          description: values[descriptionColIndex] ?? '',\n        }\n        newTcList.push(item)\n      })\n      setTcList(newTcList)\n      const checkboxCount = newTcList.length\n      setCheckboxChecked(getInitialCheckboxState(checkboxCount))\n      // disabled all checkbox except the first one\n      setCheckboxEnabled(\n        getInitialCheckboxState(checkboxCount).fill(true, 0, 1),\n      )\n    }\n  }, [data])\n\n  const sageTermsOfService =\n    'https://www.synapse.org/TrustCenter:TermsOfService'\n  const trustCenter = 'https://sagebionetworks.org/trust-center'\n  const getInitialCheckboxState = (checkboxCount: number) =>\n    Array.from(new Array(checkboxCount).fill(false))\n  let mounted = true\n\n  // State variables\n  const [checkboxChecked, setCheckboxChecked] = useState<boolean[]>([])\n  const [checkboxEnabled, setCheckboxEnabled] = useState<boolean[]>([])\n\n  useEffect(() => {\n    if (mounted) {\n      checkFormCompleted()\n    }\n    return () => {\n      mounted = false\n    }\n  }, [checkboxEnabled, checkboxChecked])\n\n  // Placeholder function to check if all checkboxes are checked and agreement is signed\n  const checkFormCompleted = () => {\n    const allCheckboxChecked =\n      checkboxChecked.length > 0 && !checkboxChecked.includes(false)\n    onFormChange(allCheckboxChecked)\n  }\n\n  const updateCheckboxState = (id: number) => {\n    const newState = !checkboxChecked[id]\n    const checkboxCount = checkboxChecked.length\n    if (newState) {\n      // if the checkbox is checked (i.e. newState is true)\n      setCheckboxChecked(\n        getInitialCheckboxState(checkboxCount).fill(true, 0, id + 1),\n      )\n      if (id + 2 <= tcList.length) {\n        setCheckboxEnabled(\n          getInitialCheckboxState(checkboxCount).fill(true, 0, id + 2),\n        )\n      }\n    } else {\n      setCheckboxChecked(\n        getInitialCheckboxState(checkboxCount).fill(true, 0, id),\n      )\n      setCheckboxEnabled(\n        getInitialCheckboxState(checkboxCount).fill(true, 0, id + 1),\n      )\n    }\n  }\n\n  return (\n    <section className=\"terms-conditions\">\n      <h3 className=\"page-header\">Pledge</h3>\n      <form>\n        <label>\n          I affirm my commitment to Sage&apos;s{' '}\n          <Link target=\"_blank\" href={sageTermsOfService}>\n            Terms of Service\n          </Link>{' '}\n          and policies for responsible research and data handling (\n          <Link target=\"_blank\" href={trustCenter}>\n            Trust Center\n          </Link>\n          ), including:\n        </label>\n        {isTermsAndConditionsTableNotFound && (\n          <Alert severity=\"warning\">\n            <AlertTitle>Source data unavailable</AlertTitle>\n            <Typography variant=\"body1\">\n              We are unable to display the source table content for the Synapse\n              Pledge at this time. Please review the full{' '}\n              <Link target=\"_blank\" href={sageTermsOfService}>\n                {' '}\n                Terms of Service{' '}\n              </Link>{' '}\n              carefully before proceeding. By clicking \"Agree And Continue,\" you\n              confirm that you have read and understood the Terms and Conditions\n              for use.\n            </Typography>\n          </Alert>\n        )}\n        <ul className=\"term-list\">\n          {isLoading && <LoadingItem numLoadingItems={6} />}\n          {tcList.length > 0 &&\n            tcList.map((item, i) => {\n              return (\n                <TermsAndConditionsItem\n                  key={`tc-item-${i}`}\n                  item={item}\n                  id={i}\n                  checked={checkboxChecked[i]}\n                  enabled={checkboxEnabled[i]}\n                  termsAndConditionsTableID={termsAndConditionsTableID}\n                  onChange={updateCheckboxState}\n                />\n              )\n            })}\n        </ul>\n        {!hideLinkToFullTC && (\n          <div className=\"view-terms\">\n            <Button\n              variant={'contained'}\n              href={URL_TERMS_CONDITIONS_AGREEMENT}\n              target=\"_blank\"\n            >\n              View Complete Terms and Conditions for Use\n            </Button>\n          </div>\n        )}\n      </form>\n    </section>\n  )\n}\n\nexport default TermsAndConditions\n"],"mappings":"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"}