synapse-react-client 4.0.18 → 4.0.20

package/dist/components/EntityFinder/EntityFinder.js

@@ -2,83 +2,81 @@ import e from "../../synapse-client/index.js";
 import { getEntityTypeFromHeader as t } from "../../utils/functions/EntityTypeUtils.js";
 import { parseSynId as n } from "../../utils/functions/RegularExpressions.js";
 import { SynapseErrorBoundary as r } from "../error/ErrorBanner.js";
-import { useSynapseContext as ee } from "../../utils/context/SynapseContext.js";
-import { VersionSelectionType as te } from "./VersionSelectionType.js";
-import { useEntitySelection as ne } from "./useEntitySelection.js";
-import { Breadcrumbs as re } from "./Breadcrumbs.js";
-import { EntityDetailsList as i, EntityDetailsListDataConfigurationType as a } from "./details/EntityDetailsList.js";
-import { EntityTreeNodeType as o } from "./tree/VirtualizedTree.js";
-import { EntityTree as s } from "./tree/EntityTree.js";
-import ie, { useCallback as c, useEffect as l, useMemo as u, useState as d } from "react";
-import { Box as ae, Chip as oe, IconButton as f, InputAdornment as p, Stack as se, Tab as m, Tabs as ce, TextField as le } from "@mui/material";
-import { jsx as h, jsxs as g } from "react/jsx-runtime";
-import { EntityType as _ } from "@sage-bionetworks/synapse-client";
-import { useErrorHandler as ue } from "react-error-boundary";
-import de from "@mui/icons-material/Search";
-import { Map as fe } from "immutable";
-import pe from "@mui/icons-material/Clear";
-import { ReflexContainer as me, ReflexElement as v, ReflexSplitter as he } from "react-reflex";
+import { useSynapseContext as i } from "../../utils/context/SynapseContext.js";
+import { VersionSelectionType as ee } from "./VersionSelectionType.js";
+import { useEntitySelection as te } from "./useEntitySelection.js";
+import { Breadcrumbs as ne } from "./Breadcrumbs.js";
+import { EntityDetailsList as a, EntityDetailsListDataConfigurationType as o } from "./details/EntityDetailsList.js";
+import { EntityTreeNodeType as s } from "./tree/VirtualizedTree.js";
+import { EntityTree as c } from "./tree/EntityTree.js";
+import re, { useCallback as l, useEffect as u, useMemo as d, useState as f } from "react";
+import { Box as ie, Chip as p, IconButton as ae, InputAdornment as m, Stack as oe, Tab as h, Tabs as se, TextField as ce } from "@mui/material";
+import { jsx as g, jsxs as _ } from "react/jsx-runtime";
+import { EntityType as v } from "@sage-bionetworks/synapse-client";
+import { useErrorHandler as le } from "react-error-boundary";
+import ue from "@mui/icons-material/Search";
+import { Map as de } from "immutable";
+import fe from "@mui/icons-material/Clear";
+import { ReflexContainer as pe, ReflexElement as y, ReflexSplitter as me } from "react-reflex";
 import "react-reflex/styles.css";
 //#region src/components/EntityFinder/EntityFinder.tsx
-var ge = Object.values(_), y = Object.values(_), _e = [_.project, _.folder], ve = (e) => Object.values(_).filter((t) => !e.includes(t)).map((e) => ({
+var he = Object.values(v), b = Object.values(v), x = [v.project, v.folder], ge = (e) => Object.values(v).filter((t) => !e.includes(t)).map((e) => ({
 	key: "node_type",
 	value: e.toString(),
 	not: !0
-})), b = /* @__PURE__ */ function(e) {
-	return e[e.BROWSE = 0] = "BROWSE", e[e.SELECTED = 1] = "SELECTED", e;
-}(b || {});
-function x({ initialScope: _, projectId: x, initialContainer: S = null, selectMultiple: C, onSelectedChange: w, versionSelection: T = te.TRACKED, selectableTypes: E = ge, visibleTypesInList: D = y, visibleTypesInTree: O = _e, treeOnly: k = !1, initialSelected: A }) {
-	let { accessToken: j } = ee(), [M, N] = ie.useState(b.BROWSE), [P, F] = d(!1), [I, L] = d(""), [R, z] = d(), [ye, B] = d({ items: [] }), [V, H] = d([]), [be, xe] = d({ type: a.PROMPT }), Se = u(() => [...O, ...E], [O, E]), Ce = u(() => [...D, ...E], [D, E]), [U, W] = d(S), G = ue(), we = c((e) => {
-		B({ items: e });
-	}, [B]), { selectedEntities: K, toggleSelection: q, setSelection: J, setInitialVersion: Y } = ne(C);
-	l(() => {
-		if (A) {
-			let e = fe();
+}));
+function S({ initialScope: v, projectId: S, initialContainer: C = null, selectMultiple: w, onSelectedChange: T, versionSelection: E = ee.TRACKED, selectableTypes: D = he, visibleTypesInList: O = b, visibleTypesInTree: k = x, treeOnly: A = !1, initialSelected: j }) {
+	let { accessToken: M } = i(), [N, P] = re.useState(0), [F, I] = f(!1), [L, R] = f(""), [z, B] = f(), [_e, V] = f({ items: [] }), [H, U] = f([]), [ve, ye] = f({ type: o.PROMPT }), be = d(() => [...k, ...D], [k, D]), xe = d(() => [...O, ...D], [O, D]), [W, G] = f(C), K = le(), Se = l((e) => {
+		V({ items: e });
+	}, [V]), { selectedEntities: q, toggleSelection: J, setSelection: Y, setInitialVersion: X } = te(w);
+	u(() => {
+		if (j) {
+			let e = de();
 			e = e.withMutations((e) => {
-				A.forEach((t) => {
+				j.forEach((t) => {
 					e.set(t.targetId, t);
 				});
-			}), J(e);
+			}), Y(e);
 		}
-	}, [A, J]);
-	let [X, Te] = d(K), Z = c((e) => K.has(e.id), [K]), Q = c((e) => {
+	}, [j, Y]);
+	let [Ce, we] = f(q), Z = l((e) => q.has(e.id), [q]), Q = l((e) => {
 		let n = t(e);
-		return E.includes(n);
-	}, [E]);
-	l(() => {
-		w(Array.from(K.values()));
-	}, [K, w]), l(() => {
-		if (R?.length === 1) {
-			let t = n(R[0]);
-			t && e.getEntityHeaders([t], j).then((e) => {
-				H(e.results);
-			}).catch((e) => G(e));
-		} else H([]);
+		return D.includes(n);
+	}, [D]);
+	u(() => {
+		T(Array.from(q.values()));
+	}, [q, T]), u(() => {
+		if (z?.length === 1) {
+			let t = n(z[0]);
+			t && e.getEntityHeaders([t], M).then((e) => {
+				U(e.results);
+			}).catch((e) => K(e));
+		} else U([]);
 	}, [
-		j,
-		R,
-		G
+		M,
+		z,
+		K
 	]);
-	let Ee = (e, t) => {
-		Te(K), N(t);
-	}, De = P ? "MainPanelSearch" : k ? "MainPanelSinglePane" : "MainPanelDualPane", $ = {
-		configuration: be,
-		versionSelection: T,
-		selected: K,
+	let Te = (e, t) => {
+		we(q), P(t);
+	}, Ee = F ? "MainPanelSearch" : A ? "MainPanelSinglePane" : "MainPanelDualPane", $ = {
+		configuration: ve,
+		versionSelection: E,
+		selected: q,
 		isIdSelected: Z,
 		isSelectable: Q,
-		visibleTypes: Ce,
-		selectableTypes: E,
-		selectColumnType: C ? "checkbox" : "none",
-		toggleSelection: q,
-		setInitialVersion: Y,
-		enableSelectAll: C,
-		setCurrentContainer: W
+		visibleTypes: xe,
+		selectableTypes: D,
+		selectColumnType: w ? "checkbox" : "none",
+		toggleSelection: J,
+		setInitialVersion: X,
+		enableSelectAll: w,
+		setCurrentContainer: G
 	};
-	return /* @__PURE__ */ h(r, { children: /* @__PURE__ */ g("div", {
+	return /* @__PURE__ */ g(r, { children: /* @__PURE__ */ _("div", {
 		className: "EntityFinder",
 		children: [
-			/* @__PURE__ */ g(ae, {
+			/* @__PURE__ */ _(ie, {
 				sx: {
 					display: "flex",
 					justifyContent: "space-between",
@@ -90,24 +88,24 @@ function x({ initialScope: _, projectId: x, initialContainer: S = null, selectMu
 						md: "nowrap"
 					}
 				},
-				children: [/* @__PURE__ */ g(ce, {
-					value: M,
-					onChange: Ee,
+				children: [/* @__PURE__ */ _(se, {
+					value: N,
+					onChange: Te,
 					sx: { flex: "none" },
-					children: [/* @__PURE__ */ h(m, {
-						value: b.BROWSE,
+					children: [/* @__PURE__ */ g(h, {
+						value: 0,
 						label: "Browse"
-					}), /* @__PURE__ */ h(m, {
-						value: b.SELECTED,
-						label: /* @__PURE__ */ g(se, {
+					}), /* @__PURE__ */ g(h, {
+						value: 1,
+						label: /* @__PURE__ */ _(oe, {
 							direction: "row",
 							sx: {
 								gap: .5,
 								alignItems: "center"
 							},
-							children: [/* @__PURE__ */ h("span", { children: "Selected" }), /* @__PURE__ */ h(oe, {
+							children: [/* @__PURE__ */ g("span", { children: "Selected" }), /* @__PURE__ */ g(p, {
 								size: "small",
-								label: K.size.toLocaleString(),
+								label: q.size.toLocaleString(),
 								sx: {
 									backgroundColor: "tertiary.500",
 									color: "grey.900",
@@ -116,17 +114,17 @@ function x({ initialScope: _, projectId: x, initialContainer: S = null, selectMu
 							})]
 						})
 					})]
-				}), /* @__PURE__ */ h(le, {
+				}), /* @__PURE__ */ g(ce, {
 					size: "small",
 					placeholder: "Search by name, wiki content, or SynID",
-					value: I,
+					value: L,
 					onChange: (e) => {
-						L(e.target.value);
+						R(e.target.value);
 					},
 					onKeyDown: (e) => {
 						if (e.key === "Enter") {
 							let t = e.target.value.trim();
-							F(!!t), t && (z(t.split(/\s+/)), N(b.BROWSE));
+							I(!!t), t && (B(t.split(/\s+/)), P(0));
 						}
 					},
 					sx: {
@@ -137,109 +135,109 @@ function x({ initialScope: _, projectId: x, initialContainer: S = null, selectMu
 						flex: "1 1 350px"
 					},
 					slotProps: { input: {
-						startAdornment: /* @__PURE__ */ h(p, {
+						startAdornment: /* @__PURE__ */ g(m, {
 							position: "start",
-							children: /* @__PURE__ */ h(de, {})
+							children: /* @__PURE__ */ g(ue, {})
 						}),
-						endAdornment: R ? /* @__PURE__ */ h(p, {
+						endAdornment: z ? /* @__PURE__ */ g(m, {
 							position: "end",
-							children: /* @__PURE__ */ h(f, {
+							children: /* @__PURE__ */ g(ae, {
 								size: "small",
 								onClick: () => {
-									L(""), z(void 0), F(!1);
+									R(""), B(void 0), I(!1);
 								},
 								"aria-label": "Clear Search",
-								disabled: !I && !P,
-								children: /* @__PURE__ */ h(pe, {})
+								disabled: !L && !F,
+								children: /* @__PURE__ */ g(fe, {})
 							})
 						}) : void 0
 					} }
 				})]
 			}),
-			/* @__PURE__ */ g("div", {
+			/* @__PURE__ */ _("div", {
 				role: "tabpanel",
-				className: `EntityFinder__MainPanel ${De}`,
-				style: { display: M === b.BROWSE ? "block" : "none" },
-				children: [P && /* @__PURE__ */ h(i, {
-					configuration: V && V.length > 0 ? {
-						type: a.HEADER_LIST,
-						headerList: V
+				className: `EntityFinder__MainPanel ${Ee}`,
+				style: { display: N === 0 ? "block" : "none" },
+				children: [F && /* @__PURE__ */ g(a, {
+					configuration: H && H.length > 0 ? {
+						type: o.HEADER_LIST,
+						headerList: H
 					} : {
-						type: a.ENTITY_SEARCH,
+						type: o.ENTITY_SEARCH,
 						query: {
-							queryTerm: R,
-							booleanQuery: ve(E)
+							queryTerm: z,
+							booleanQuery: ge(D)
 						}
 					},
-					versionSelection: T,
-					selectColumnType: C ? "checkbox" : "none",
-					selected: K,
+					versionSelection: E,
+					selectColumnType: w ? "checkbox" : "none",
+					selected: q,
 					isIdSelected: Z,
 					isSelectable: Q,
-					visibleTypes: E,
-					selectableTypes: E,
-					toggleSelection: q,
-					setInitialVersion: Y,
-					enableSelectAll: C,
+					visibleTypes: D,
+					selectableTypes: D,
+					toggleSelection: J,
+					setInitialVersion: X,
+					enableSelectAll: w,
 					setCurrentContainer: void 0
-				}), /* @__PURE__ */ h("div", {
-					style: P ? { display: "none" } : {},
-					children: k ? /* @__PURE__ */ h("div", { children: /* @__PURE__ */ h(r, { children: /* @__PURE__ */ h(s, {
-						toggleSelection: q,
+				}), /* @__PURE__ */ g("div", {
+					style: F ? { display: "none" } : {},
+					children: A ? /* @__PURE__ */ g("div", { children: /* @__PURE__ */ g(r, { children: /* @__PURE__ */ g(c, {
+						toggleSelection: J,
 						showDropdown: !0,
-						visibleTypes: Se,
-						initialScope: _,
-						selectedEntities: K,
-						projectId: x,
-						initialContainer: S,
-						currentContainer: U,
-						setCurrentContainer: W,
+						visibleTypes: be,
+						initialScope: v,
+						selectedEntities: q,
+						projectId: S,
+						initialContainer: C,
+						currentContainer: W,
+						setCurrentContainer: G,
 						showScopeAsRootNode: !1,
-						treeNodeType: o.SINGLE_PANE,
-						selectableTypes: E
-					}) }) }) : /* @__PURE__ */ h("div", {
+						treeNodeType: s.SINGLE_PANE,
+						selectableTypes: D
+					}) }) }) : /* @__PURE__ */ g("div", {
 						className: "EntityFinderReflexContainer",
-						children: /* @__PURE__ */ g(me, {
+						children: /* @__PURE__ */ _(pe, {
 							orientation: "vertical",
 							windowResizeAware: !0,
 							children: [
-								/* @__PURE__ */ h(v, {
+								/* @__PURE__ */ g(y, {
 									className: "TreeViewReflexElement",
 									flex: .24,
-									children: /* @__PURE__ */ h(r, { children: /* @__PURE__ */ h(s, {
-										selectedEntities: K,
-										setDetailsViewConfiguration: xe,
+									children: /* @__PURE__ */ g(r, { children: /* @__PURE__ */ g(c, {
+										selectedEntities: q,
+										setDetailsViewConfiguration: ye,
 										showDropdown: !0,
-										visibleTypes: O,
-										initialScope: _,
-										projectId: x,
-										initialContainer: S,
-										currentContainer: U,
-										setCurrentContainer: W,
-										treeNodeType: o.DUAL_PANE,
-										setBreadcrumbItems: we,
-										selectableTypes: O
+										visibleTypes: k,
+										initialScope: v,
+										projectId: S,
+										initialContainer: C,
+										currentContainer: W,
+										setCurrentContainer: G,
+										treeNodeType: s.DUAL_PANE,
+										setBreadcrumbItems: Se,
+										selectableTypes: k
 									}) })
 								}),
-								/* @__PURE__ */ h(he, {}),
-								/* @__PURE__ */ h(v, {
+								/* @__PURE__ */ g(me, {}),
+								/* @__PURE__ */ g(y, {
 									className: "DetailsViewReflexElement",
-									children: /* @__PURE__ */ g(r, { children: [/* @__PURE__ */ h(i, { ...$ }), /* @__PURE__ */ h(re, { ...ye })] })
+									children: /* @__PURE__ */ _(r, { children: [/* @__PURE__ */ g(a, { ...$ }), /* @__PURE__ */ g(ne, { ..._e })] })
 								})
 							]
 						})
 					})
 				})]
 			}),
-			/* @__PURE__ */ h("div", {
+			/* @__PURE__ */ g("div", {
 				role: "tabpanel",
 				className: "MainPanelSelected",
-				style: { display: M === b.SELECTED ? "block" : "none" },
-				children: /* @__PURE__ */ h(i, {
+				style: { display: N === 1 ? "block" : "none" },
+				children: /* @__PURE__ */ g(a, {
 					...$,
 					configuration: {
-						type: a.REFERENCE_LIST,
-						referenceList: Array.from(X.values())
+						type: o.REFERENCE_LIST,
+						referenceList: Array.from(Ce.values())
 					}
 				})
 			})
@@ -247,6 +245,6 @@ function x({ initialScope: _, projectId: x, initialContainer: S = null, selectMu
 	}) });
 }
 //#endregion
-export { x as EntityFinder, x as default };
+export { S as EntityFinder, S as default };
 
 //# sourceMappingURL=EntityFinder.js.map

package/dist/components/EntityFinder/EntityFinder.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityFinder.js","names":[],"sources":["../../../src/components/EntityFinder/EntityFinder.tsx"],"sourcesContent":["import SynapseClient from '@/synapse-client'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport { getEntityTypeFromHeader } from '@/utils/functions/EntityTypeUtils'\nimport { parseSynId } from '@/utils/functions/RegularExpressions'\nimport ClearIcon from '@mui/icons-material/Clear'\nimport SearchIcon from '@mui/icons-material/Search'\nimport {\n  Box,\n  Chip,\n  IconButton,\n  InputAdornment,\n  Stack,\n  Tab,\n  Tabs,\n  TextField,\n} from '@mui/material'\nimport { EntityType } from '@sage-bionetworks/synapse-client'\nimport { KeyValue, Reference } from '@sage-bionetworks/synapse-types'\nimport { Map } from 'immutable'\nimport React, { useCallback, useEffect, useMemo, useState } from 'react'\nimport { useErrorHandler } from 'react-error-boundary'\nimport { ReflexContainer, ReflexElement, ReflexSplitter } from 'react-reflex'\nimport 'react-reflex/styles.css'\nimport { SynapseErrorBoundary } from '../error/ErrorBanner'\nimport { BreadcrumbItem, Breadcrumbs, BreadcrumbsProps } from './Breadcrumbs'\nimport {\n  EntityDetailsList,\n  EntityDetailsListDataConfiguration,\n  EntityDetailsListDataConfigurationType,\n  EntityDetailsListProps,\n} from './details/EntityDetailsList'\nimport { EntityFinderHeader } from './EntityFinderHeader'\nimport { EntityTree, EntityTreeContainer, FinderScope } from './tree/EntityTree'\nimport { EntityTreeNodeType } from './tree/VirtualizedTree'\nimport { useEntitySelection } from './useEntitySelection'\nimport { VersionSelectionType } from './VersionSelectionType'\n\nconst DEFAULT_SELECTABLE_TYPES = Object.values(EntityType)\nconst TABLE_DEFAULT_VISIBLE_TYPES = Object.values(EntityType)\nconst TREE_DEFAULT_VISIBLE_TYPES = [EntityType.project, EntityType.folder]\n\nconst searchForOnlyTypesBooleanQuery = (\n  entityTypes: EntityType[],\n): KeyValue[] => {\n  // Boolean query terms will be combined with AND, and there's no way to OR.\n  // So we will negate searching for all omitted types.\n  const allTypes = Object.values(EntityType)\n  const typesToOmit = allTypes.filter(type => !entityTypes.includes(type))\n  return typesToOmit.map(type => ({\n    key: 'node_type',\n    value: type.toString(),\n    not: true,\n  }))\n}\n\nexport type EntityFinderProps = {\n  /** Whether it is possible to select multiple entities */\n  selectMultiple: boolean\n  /** Callback invoked when the selection changes */\n  onSelectedChange: (selected: Reference[]) => void\n  /** The initial appearance of the entity finder. Possible values include \"Current Project\", \"All Projects\", \"Projects Created By Me\", \"My Favorites\" */\n  initialScope: FinderScope\n  /** The SynID of the 'Current Project'. If this is not a defined, then the scope cannot be \"Current Project\" */\n  projectId?: string\n  /** The SynID of the entity that should open by default. If this is a Syn ID, then it must be in the project specified in `projectId` */\n  initialContainer: string | 'root' | null\n  /** Determines if versions are selectable, and if so, how they should be shown. Default is \"TRACKED\" */\n  versionSelection?: VersionSelectionType\n  /** The entity types to show in the details view (right pane). Any types specified in `selectableTypes` will automatically be included. */\n  visibleTypesInList?: EntityType[]\n  /** The entity types that may be selected. Types in `visibleTypesInList` that are not in `selectableTypes` will appear as disabled options. Only the types in `selectableTypes` will appear in search */\n  selectableTypes?: EntityType[]\n  /** The types to show in the tree used to navigate. If `treeOnly` is true, any types specified in `selectableTypes` will automatically be included. */\n  visibleTypesInTree?: EntityType[]\n  /** Whether to show only the tree. If `true`, the tree will be used to make selections */\n  treeOnly?: boolean\n  /** If provided, the initial selection will be set to this list of references. The selection will be reset to this value if this object changes, so it should be memoized. */\n  initialSelected?: Reference[]\n}\n\nenum EntityFinderTab {\n  BROWSE,\n  SELECTED,\n}\n\nexport function EntityFinder({\n  initialScope,\n  projectId,\n  initialContainer = null,\n  selectMultiple,\n  onSelectedChange,\n  versionSelection = VersionSelectionType.TRACKED,\n  selectableTypes = DEFAULT_SELECTABLE_TYPES,\n  visibleTypesInList = TABLE_DEFAULT_VISIBLE_TYPES,\n  visibleTypesInTree = TREE_DEFAULT_VISIBLE_TYPES,\n  treeOnly = false,\n  initialSelected,\n}: EntityFinderProps): React.ReactNode {\n  const { accessToken } = useSynapseContext()\n  const [currentTab, setCurrentTab] = React.useState(EntityFinderTab.BROWSE)\n\n  const [searchActive, setSearchActive] = useState(false)\n  // The raw value of the search input box:\n  const [searchInput, setSearchInput] = useState<string>('')\n  // The \"parsed\" search terms, which are only calculated when Enter is pressed:\n  const [searchTerms, setSearchTerms] = useState<string[]>()\n  const [breadcrumbsProps, setBreadcrumbsProps] = useState<BreadcrumbsProps>({\n    items: [],\n  })\n  const [searchByIdResults, setSearchByIdResults] = useState<\n    EntityFinderHeader[]\n  >([])\n  const [configFromTreeView, setConfigFromTreeView] =\n    useState<EntityDetailsListDataConfiguration>({\n      type: EntityDetailsListDataConfigurationType.PROMPT,\n    })\n\n  // If a type is selectable, it should be visible in the tree/list (depending on treeOnly)\n  const selectableAndVisibleTypesInTree = useMemo(\n    () => [...visibleTypesInTree, ...selectableTypes],\n    [visibleTypesInTree, selectableTypes],\n  )\n  const selectableAndVisibleTypesInList = useMemo(\n    () => [...visibleTypesInList, ...selectableTypes],\n    [visibleTypesInList, selectableTypes],\n  )\n\n  // For dual-pane, this state variable indicates which container is selected in the tree view and should be shown in the table view\n  const [currentContainer, setCurrentContainer] =\n    useState<EntityTreeContainer>(initialContainer)\n\n  const handleError = useErrorHandler()\n\n  const setBreadcrumbs = useCallback(\n    (items: BreadcrumbItem[]) => {\n      setBreadcrumbsProps({\n        items,\n      })\n    },\n    [setBreadcrumbsProps],\n  )\n\n  const { selectedEntities, toggleSelection, setSelection, setInitialVersion } =\n    useEntitySelection(selectMultiple)\n\n  useEffect(() => {\n    if (initialSelected) {\n      let map = Map<string, Reference>()\n      map = map.withMutations(mutableMap => {\n        initialSelected.forEach(reference => {\n          mutableMap.set(reference.targetId, reference)\n        })\n      })\n\n      setSelection(map)\n    }\n  }, [initialSelected, setSelection])\n\n  // A snapshot of the selectedEntities used to populate the selection list, allowing deselection of entities without removing them from the list.\n  const [selectedEntitiesSnapshot, setSelectedEntitiesSnapshot] =\n    useState(selectedEntities)\n\n  const isIdSelected = useCallback(\n    (entity: EntityFinderHeader) => {\n      return selectedEntities.has(entity.id)\n    },\n    [selectedEntities],\n  )\n\n  const isSelectable = useCallback(\n    (entity: EntityFinderHeader) => {\n      const type = getEntityTypeFromHeader(entity)\n      return selectableTypes.includes(type)\n    },\n    [selectableTypes],\n  )\n\n  useEffect(() => {\n    // When it changes, convert the map of selected items to a list of references and invoke the callback\n    onSelectedChange(Array.from(selectedEntities.values()))\n  }, [selectedEntities, onSelectedChange])\n\n  useEffect(() => {\n    if (searchTerms?.length === 1) {\n      const searchTermReference = parseSynId(searchTerms[0])\n      if (searchTermReference) {\n        SynapseClient.getEntityHeaders([searchTermReference], accessToken)\n          .then(response => {\n            setSearchByIdResults(response.results)\n          })\n          .catch(e => handleError(e))\n      }\n    } else {\n      setSearchByIdResults([])\n    }\n  }, [accessToken, searchTerms, handleError])\n\n  const handleTabChange = (\n    _event: React.SyntheticEvent,\n    newValue: EntityFinderTab,\n  ) => {\n    setSelectedEntitiesSnapshot(selectedEntities)\n    setCurrentTab(newValue)\n  }\n\n  const mainPanelClass = searchActive\n    ? 'MainPanelSearch'\n    : treeOnly\n      ? 'MainPanelSinglePane'\n      : 'MainPanelDualPane'\n\n  const entityDetailsListProps: EntityDetailsListProps = {\n    configuration: configFromTreeView,\n    versionSelection: versionSelection,\n    selected: selectedEntities,\n    isIdSelected: isIdSelected,\n    isSelectable: isSelectable,\n    visibleTypes: selectableAndVisibleTypesInList,\n    selectableTypes: selectableTypes,\n    selectColumnType: selectMultiple ? 'checkbox' : 'none',\n    toggleSelection: toggleSelection,\n    setInitialVersion: setInitialVersion,\n    enableSelectAll: selectMultiple,\n    setCurrentContainer: setCurrentContainer,\n  }\n\n  return (\n    <SynapseErrorBoundary>\n      <div className=\"EntityFinder\">\n        <Box\n          sx={{\n            display: 'flex',\n            justifyContent: 'space-between',\n            mb: 2.5,\n            rowGap: 2,\n            columnGap: 4,\n            flexWrap: { xs: 'wrap', md: 'nowrap' },\n          }}\n        >\n          <Tabs\n            value={currentTab}\n            onChange={handleTabChange}\n            sx={{ flex: 'none' }}\n          >\n            <Tab value={EntityFinderTab.BROWSE} label={'Browse'}></Tab>\n            <Tab\n              value={EntityFinderTab.SELECTED}\n              label={\n                <Stack\n                  direction={'row'}\n                  sx={{\n                    gap: 0.5,\n                    alignItems: 'center',\n                  }}\n                >\n                  <span>Selected</span>\n                  <Chip\n                    size={'small'}\n                    label={selectedEntities.size.toLocaleString()}\n                    sx={{\n                      backgroundColor: 'tertiary.500',\n                      color: 'grey.900',\n                      height: '21px',\n                    }}\n                  ></Chip>\n                </Stack>\n              }\n            ></Tab>\n          </Tabs>\n          <TextField\n            size={'small'}\n            placeholder=\"Search by name, wiki content, or SynID\"\n            value={searchInput}\n            onChange={event => {\n              setSearchInput(event.target.value)\n            }}\n            onKeyDown={(event: any) => {\n              if (event.key === 'Enter') {\n                const trimmedInput = event.target.value.trim()\n                setSearchActive(!!trimmedInput)\n                if (trimmedInput) {\n                  setSearchTerms(trimmedInput.split(/\\s+/))\n                  setCurrentTab(EntityFinderTab.BROWSE)\n                }\n              }\n            }}\n            sx={{\n              maxWidth: { xs: '100%', md: '350px' },\n              flex: '1 1 350px',\n            }}\n            slotProps={{\n              input: {\n                startAdornment: (\n                  <InputAdornment position=\"start\">\n                    <SearchIcon />\n                  </InputAdornment>\n                ),\n                endAdornment: searchTerms ? (\n                  <InputAdornment position=\"end\">\n                    <IconButton\n                      size={'small'}\n                      onClick={() => {\n                        setSearchInput('')\n                        setSearchTerms(undefined)\n                        setSearchActive(false)\n                      }}\n                      aria-label=\"Clear Search\"\n                      disabled={!searchInput && !searchActive}\n                    >\n                      <ClearIcon />\n                    </IconButton>\n                  </InputAdornment>\n                ) : undefined,\n              },\n            }}\n          />\n        </Box>\n        <div\n          role={'tabpanel'}\n          className={`EntityFinder__MainPanel ${mainPanelClass}`}\n          style={{\n            display: currentTab === EntityFinderTab.BROWSE ? 'block' : 'none',\n          }}\n        >\n          {/* We have a separate Details component for search in order to preserve state in the other component between searches */}\n          {searchActive && (\n            <EntityDetailsList\n              configuration={\n                searchByIdResults && searchByIdResults.length > 0\n                  ? {\n                      type: EntityDetailsListDataConfigurationType.HEADER_LIST,\n                      headerList: searchByIdResults,\n                    }\n                  : {\n                      type: EntityDetailsListDataConfigurationType.ENTITY_SEARCH,\n                      query: {\n                        queryTerm: searchTerms,\n                        booleanQuery:\n                          searchForOnlyTypesBooleanQuery(selectableTypes),\n                      },\n                    }\n              }\n              versionSelection={versionSelection}\n              selectColumnType={selectMultiple ? 'checkbox' : 'none'}\n              selected={selectedEntities}\n              isIdSelected={isIdSelected}\n              isSelectable={isSelectable}\n              visibleTypes={selectableTypes}\n              selectableTypes={selectableTypes}\n              toggleSelection={toggleSelection}\n              setInitialVersion={setInitialVersion}\n              enableSelectAll={selectMultiple}\n              // Intentionally do not pass \"setCurrentContainer\" -- search does not use the tree so it has nothing to update\n              setCurrentContainer={undefined}\n            />\n          )}\n          {\n            <div style={searchActive ? { display: 'none' } : {}}>\n              {treeOnly ? (\n                <div>\n                  <SynapseErrorBoundary>\n                    <EntityTree\n                      toggleSelection={toggleSelection}\n                      showDropdown={true}\n                      visibleTypes={selectableAndVisibleTypesInTree}\n                      initialScope={initialScope}\n                      selectedEntities={selectedEntities}\n                      projectId={projectId}\n                      initialContainer={initialContainer}\n                      currentContainer={currentContainer}\n                      setCurrentContainer={setCurrentContainer}\n                      showScopeAsRootNode={false}\n                      treeNodeType={EntityTreeNodeType.SINGLE_PANE}\n                      selectableTypes={selectableTypes}\n                    />\n                  </SynapseErrorBoundary>\n                </div>\n              ) : (\n                <div className=\"EntityFinderReflexContainer\">\n                  <ReflexContainer orientation=\"vertical\" windowResizeAware>\n                    <ReflexElement\n                      className=\"TreeViewReflexElement\"\n                      flex={0.24}\n                    >\n                      <SynapseErrorBoundary>\n                        <EntityTree\n                          selectedEntities={selectedEntities}\n                          setDetailsViewConfiguration={setConfigFromTreeView}\n                          showDropdown={true}\n                          visibleTypes={visibleTypesInTree}\n                          initialScope={initialScope}\n                          projectId={projectId}\n                          initialContainer={initialContainer}\n                          currentContainer={currentContainer}\n                          setCurrentContainer={setCurrentContainer}\n                          treeNodeType={EntityTreeNodeType.DUAL_PANE}\n                          setBreadcrumbItems={setBreadcrumbs}\n                          selectableTypes={visibleTypesInTree}\n                        />\n                      </SynapseErrorBoundary>\n                    </ReflexElement>\n                    <ReflexSplitter></ReflexSplitter>\n                    <ReflexElement className=\"DetailsViewReflexElement\">\n                      <SynapseErrorBoundary>\n                        <EntityDetailsList {...entityDetailsListProps} />\n                        <Breadcrumbs {...breadcrumbsProps} />\n                      </SynapseErrorBoundary>\n                    </ReflexElement>\n                  </ReflexContainer>\n                </div>\n              )}\n            </div>\n          }\n        </div>\n        <div\n          role={'tabpanel'}\n          className={'MainPanelSelected'}\n          style={{\n            display: currentTab === EntityFinderTab.SELECTED ? 'block' : 'none',\n          }}\n        >\n          <EntityDetailsList\n            {...entityDetailsListProps}\n            configuration={{\n              type: EntityDetailsListDataConfigurationType.REFERENCE_LIST,\n              referenceList: Array.from(selectedEntitiesSnapshot.values()),\n            }}\n          />\n        </div>\n      </div>\n    </SynapseErrorBoundary>\n  )\n}\n\nexport default EntityFinder\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAqCA,IAAM,KAA2B,OAAO,OAAO,EAAW,EACpD,IAA8B,OAAO,OAAO,EAAW,EACvD,KAA6B,CAAC,EAAW,SAAS,EAAW,OAAO,EAEpE,MACJ,MAIiB,OAAO,OAAO,EACX,CAAS,QAAO,MAAQ,CAAC,EAAY,SAAS,EAAK,CAChE,CAAY,KAAI,OAAS;CAC9B,KAAK;CACL,OAAO,EAAK,UAAU;CACtB,KAAK;CACN,EAAE,EA4BA,IAAL,yBAAA,GAAA;QACE,EAAA,EAAA,SAAA,KAAA,UACA,EAAA,EAAA,WAAA,KAAA;EAFG,KAAA,EAAA,CAGJ;AAED,SAAgB,EAAa,EAC3B,iBACA,cACA,sBAAmB,MACnB,mBACA,qBACA,sBAAmB,GAAqB,SACxC,qBAAkB,IAClB,wBAAqB,GACrB,wBAAqB,IACrB,cAAW,IACX,sBACqC;CACrC,IAAM,EAAE,mBAAgB,IAAmB,EACrC,CAAC,GAAY,KAAiB,GAAM,SAAS,EAAgB,OAAO,EAEpE,CAAC,GAAc,KAAmB,EAAS,GAAM,EAEjD,CAAC,GAAa,KAAkB,EAAiB,GAAG,EAEpD,CAAC,GAAa,KAAkB,GAAoB,EACpD,CAAC,IAAkB,KAAuB,EAA2B,EACzE,OAAO,EAAE,EACV,CAAC,EACI,CAAC,GAAmB,KAAwB,EAEhD,EAAE,CAAC,EACC,CAAC,IAAoB,MACzB,EAA6C,EAC3C,MAAM,EAAuC,QAC9C,CAAC,EAGE,KAAkC,QAChC,CAAC,GAAG,GAAoB,GAAG,EAAgB,EACjD,CAAC,GAAoB,EAAgB,CACtC,EACK,KAAkC,QAChC,CAAC,GAAG,GAAoB,GAAG,EAAgB,EACjD,CAAC,GAAoB,EAAgB,CACtC,EAGK,CAAC,GAAkB,KACvB,EAA8B,EAAiB,EAE3C,IAAc,IAAiB,EAE/B,KAAiB,GACpB,MAA4B;AAC3B,IAAoB,EAClB,UACD,CAAC;IAEJ,CAAC,EAAoB,CACtB,EAEK,EAAE,qBAAkB,oBAAiB,iBAAc,yBACvD,GAAmB,EAAe;AAEpC,SAAgB;AACd,MAAI,GAAiB;GACnB,IAAI,IAAM,IAAwB;AAOlC,GANA,IAAM,EAAI,eAAc,MAAc;AACpC,MAAgB,SAAQ,MAAa;AACnC,OAAW,IAAI,EAAU,UAAU,EAAU;MAC7C;KACF,EAEF,EAAa,EAAI;;IAElB,CAAC,GAAiB,EAAa,CAAC;CAGnC,IAAM,CAAC,GAA0B,MAC/B,EAAS,EAAiB,EAEtB,IAAe,GAClB,MACQ,EAAiB,IAAI,EAAO,GAAG,EAExC,CAAC,EAAiB,CACnB,EAEK,IAAe,GAClB,MAA+B;EAC9B,IAAM,IAAO,EAAwB,EAAO;AAC5C,SAAO,EAAgB,SAAS,EAAK;IAEvC,CAAC,EAAgB,CAClB;AAOD,CALA,QAAgB;AAEd,IAAiB,MAAM,KAAK,EAAiB,QAAQ,CAAC,CAAC;IACtD,CAAC,GAAkB,EAAiB,CAAC,EAExC,QAAgB;AACd,MAAI,GAAa,WAAW,GAAG;GAC7B,IAAM,IAAsB,EAAW,EAAY,GAAG;AACtD,GAAI,KACF,EAAc,iBAAiB,CAAC,EAAoB,EAAE,EAAY,CAC/D,MAAK,MAAY;AAChB,MAAqB,EAAS,QAAQ;KACtC,CACD,OAAM,MAAK,EAAY,EAAE,CAAC;QAG/B,GAAqB,EAAE,CAAC;IAEzB;EAAC;EAAa;EAAa;EAAY,CAAC;CAE3C,IAAM,MACJ,GACA,MACG;AAEH,EADA,GAA4B,EAAiB,EAC7C,EAAc,EAAS;IAGnB,KAAiB,IACnB,oBACA,IACE,wBACA,qBAEA,IAAiD;EACrD,eAAe;EACG;EAClB,UAAU;EACI;EACA;EACd,cAAc;EACG;EACjB,kBAAkB,IAAiB,aAAa;EAC/B;EACE;EACnB,iBAAiB;EACI;EACtB;AAED,QACE,kBAAC,GAAD,EAAA,UACE,kBAAC,OAAD;EAAK,WAAU;YAAf;GACE,kBAAC,IAAD;IACE,IAAI;KACF,SAAS;KACT,gBAAgB;KAChB,IAAI;KACJ,QAAQ;KACR,WAAW;KACX,UAAU;MAAE,IAAI;MAAQ,IAAI;MAAU;KACvC;cARH,CAUE,kBAAC,IAAD;KACE,OAAO;KACP,UAAU;KACV,IAAI,EAAE,MAAM,QAAQ;eAHtB,CAKE,kBAAC,GAAD;MAAK,OAAO,EAAgB;MAAQ,OAAO;MAAgB,CAAA,EAC3D,kBAAC,GAAD;MACE,OAAO,EAAgB;MACvB,OACE,kBAAC,IAAD;OACE,WAAW;OACX,IAAI;QACF,KAAK;QACL,YAAY;QACb;iBALH,CAOE,kBAAC,QAAD,EAAA,UAAM,YAAe,CAAA,EACrB,kBAAC,IAAD;QACE,MAAM;QACN,OAAO,EAAiB,KAAK,gBAAgB;QAC7C,IAAI;SACF,iBAAiB;SACjB,OAAO;SACP,QAAQ;SACT;QACK,CAAA,CACF;;MAEL,CAAA,CACF;QACP,kBAAC,IAAD;KACE,MAAM;KACN,aAAY;KACZ,OAAO;KACP,WAAU,MAAS;AACjB,QAAe,EAAM,OAAO,MAAM;;KAEpC,YAAY,MAAe;AACzB,UAAI,EAAM,QAAQ,SAAS;OACzB,IAAM,IAAe,EAAM,OAAO,MAAM,MAAM;AAE9C,OADA,EAAgB,CAAC,CAAC,EAAa,EAC3B,MACF,EAAe,EAAa,MAAM,MAAM,CAAC,EACzC,EAAc,EAAgB,OAAO;;;KAI3C,IAAI;MACF,UAAU;OAAE,IAAI;OAAQ,IAAI;OAAS;MACrC,MAAM;MACP;KACD,WAAW,EACT,OAAO;MACL,gBACE,kBAAC,GAAD;OAAgB,UAAS;iBACvB,kBAAC,IAAD,EAAc,CAAA;OACC,CAAA;MAEnB,cAAc,IACZ,kBAAC,GAAD;OAAgB,UAAS;iBACvB,kBAAC,GAAD;QACE,MAAM;QACN,eAAe;AAGb,SAFA,EAAe,GAAG,EAClB,EAAe,KAAA,EAAU,EACzB,EAAgB,GAAM;;QAExB,cAAW;QACX,UAAU,CAAC,KAAe,CAAC;kBAE3B,kBAAC,IAAD,EAAa,CAAA;QACF,CAAA;OACE,CAAA,GACf,KAAA;MACL,EACF;KACD,CAAA,CACE;;GACN,kBAAC,OAAD;IACE,MAAM;IACN,WAAW,2BAA2B;IACtC,OAAO,EACL,SAAS,MAAe,EAAgB,SAAS,UAAU,QAC5D;cALH,CAQG,KACC,kBAAC,GAAD;KACE,eACE,KAAqB,EAAkB,SAAS,IAC5C;MACE,MAAM,EAAuC;MAC7C,YAAY;MACb,GACD;MACE,MAAM,EAAuC;MAC7C,OAAO;OACL,WAAW;OACX,cACE,GAA+B,EAAgB;OAClD;MACF;KAEW;KAClB,kBAAkB,IAAiB,aAAa;KAChD,UAAU;KACI;KACA;KACd,cAAc;KACG;KACA;KACE;KACnB,iBAAiB;KAEjB,qBAAqB,KAAA;KACrB,CAAA,EAGF,kBAAC,OAAD;KAAK,OAAO,IAAe,EAAE,SAAS,QAAQ,GAAG,EAAE;eAChD,IACC,kBAAC,OAAD,EAAA,UACE,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD;MACmB;MACjB,cAAc;MACd,cAAc;MACA;MACI;MACP;MACO;MACA;MACG;MACrB,qBAAqB;MACrB,cAAc,EAAmB;MAChB;MACjB,CAAA,EACmB,CAAA,EACnB,CAAA,GAEN,kBAAC,OAAD;MAAK,WAAU;gBACb,kBAAC,IAAD;OAAiB,aAAY;OAAW,mBAAA;iBAAxC;QACE,kBAAC,GAAD;SACE,WAAU;SACV,MAAM;mBAEN,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD;UACoB;UAClB,6BAA6B;UAC7B,cAAc;UACd,cAAc;UACA;UACH;UACO;UACA;UACG;UACrB,cAAc,EAAmB;UACjC,oBAAoB;UACpB,iBAAiB;UACjB,CAAA,EACmB,CAAA;SACT,CAAA;QAChB,kBAAC,IAAD,EAAiC,CAAA;QACjC,kBAAC,GAAD;SAAe,WAAU;mBACvB,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD,EAAmB,GAAI,GAA0B,CAAA,EACjD,kBAAC,IAAD,EAAa,GAAI,IAAoB,CAAA,CAChB,EAAA,CAAA;SACT,CAAA;QACA;;MACd,CAAA;KAEJ,CAAA,CAEJ;;GACN,kBAAC,OAAD;IACE,MAAM;IACN,WAAW;IACX,OAAO,EACL,SAAS,MAAe,EAAgB,WAAW,UAAU,QAC9D;cAED,kBAAC,GAAD;KACE,GAAI;KACJ,eAAe;MACb,MAAM,EAAuC;MAC7C,eAAe,MAAM,KAAK,EAAyB,QAAQ,CAAC;MAC7D;KACD,CAAA;IACE,CAAA;GACF;KACe,CAAA"}
+{"version":3,"file":"EntityFinder.js","names":[],"sources":["../../../src/components/EntityFinder/EntityFinder.tsx"],"sourcesContent":["import SynapseClient from '@/synapse-client'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport { getEntityTypeFromHeader } from '@/utils/functions/EntityTypeUtils'\nimport { parseSynId } from '@/utils/functions/RegularExpressions'\nimport ClearIcon from '@mui/icons-material/Clear'\nimport SearchIcon from '@mui/icons-material/Search'\nimport {\n  Box,\n  Chip,\n  IconButton,\n  InputAdornment,\n  Stack,\n  Tab,\n  Tabs,\n  TextField,\n} from '@mui/material'\nimport { EntityType } from '@sage-bionetworks/synapse-client'\nimport { KeyValue, Reference } from '@sage-bionetworks/synapse-types'\nimport { Map } from 'immutable'\nimport React, { useCallback, useEffect, useMemo, useState } from 'react'\nimport { useErrorHandler } from 'react-error-boundary'\nimport { ReflexContainer, ReflexElement, ReflexSplitter } from 'react-reflex'\nimport 'react-reflex/styles.css'\nimport { SynapseErrorBoundary } from '../error/ErrorBanner'\nimport { BreadcrumbItem, Breadcrumbs, BreadcrumbsProps } from './Breadcrumbs'\nimport {\n  EntityDetailsList,\n  EntityDetailsListDataConfiguration,\n  EntityDetailsListDataConfigurationType,\n  EntityDetailsListProps,\n} from './details/EntityDetailsList'\nimport { EntityFinderHeader } from './EntityFinderHeader'\nimport { EntityTree, EntityTreeContainer, FinderScope } from './tree/EntityTree'\nimport { EntityTreeNodeType } from './tree/VirtualizedTree'\nimport { useEntitySelection } from './useEntitySelection'\nimport { VersionSelectionType } from './VersionSelectionType'\n\nconst DEFAULT_SELECTABLE_TYPES = Object.values(EntityType)\nconst TABLE_DEFAULT_VISIBLE_TYPES = Object.values(EntityType)\nconst TREE_DEFAULT_VISIBLE_TYPES = [EntityType.project, EntityType.folder]\n\nconst searchForOnlyTypesBooleanQuery = (\n  entityTypes: EntityType[],\n): KeyValue[] => {\n  // Boolean query terms will be combined with AND, and there's no way to OR.\n  // So we will negate searching for all omitted types.\n  const allTypes = Object.values(EntityType)\n  const typesToOmit = allTypes.filter(type => !entityTypes.includes(type))\n  return typesToOmit.map(type => ({\n    key: 'node_type',\n    value: type.toString(),\n    not: true,\n  }))\n}\n\nexport type EntityFinderProps = {\n  /** Whether it is possible to select multiple entities */\n  selectMultiple: boolean\n  /** Callback invoked when the selection changes */\n  onSelectedChange: (selected: Reference[]) => void\n  /** The initial appearance of the entity finder. Possible values include \"Current Project\", \"All Projects\", \"Projects Created By Me\", \"My Favorites\" */\n  initialScope: FinderScope\n  /** The SynID of the 'Current Project'. If this is not a defined, then the scope cannot be \"Current Project\" */\n  projectId?: string\n  /** The SynID of the entity that should open by default. If this is a Syn ID, then it must be in the project specified in `projectId` */\n  initialContainer: string | 'root' | null\n  /** Determines if versions are selectable, and if so, how they should be shown. Default is \"TRACKED\" */\n  versionSelection?: VersionSelectionType\n  /** The entity types to show in the details view (right pane). Any types specified in `selectableTypes` will automatically be included. */\n  visibleTypesInList?: EntityType[]\n  /** The entity types that may be selected. Types in `visibleTypesInList` that are not in `selectableTypes` will appear as disabled options. Only the types in `selectableTypes` will appear in search */\n  selectableTypes?: EntityType[]\n  /** The types to show in the tree used to navigate. If `treeOnly` is true, any types specified in `selectableTypes` will automatically be included. */\n  visibleTypesInTree?: EntityType[]\n  /** Whether to show only the tree. If `true`, the tree will be used to make selections */\n  treeOnly?: boolean\n  /** If provided, the initial selection will be set to this list of references. The selection will be reset to this value if this object changes, so it should be memoized. */\n  initialSelected?: Reference[]\n}\n\nenum EntityFinderTab {\n  BROWSE,\n  SELECTED,\n}\n\nexport function EntityFinder({\n  initialScope,\n  projectId,\n  initialContainer = null,\n  selectMultiple,\n  onSelectedChange,\n  versionSelection = VersionSelectionType.TRACKED,\n  selectableTypes = DEFAULT_SELECTABLE_TYPES,\n  visibleTypesInList = TABLE_DEFAULT_VISIBLE_TYPES,\n  visibleTypesInTree = TREE_DEFAULT_VISIBLE_TYPES,\n  treeOnly = false,\n  initialSelected,\n}: EntityFinderProps): React.ReactNode {\n  const { accessToken } = useSynapseContext()\n  const [currentTab, setCurrentTab] = React.useState(EntityFinderTab.BROWSE)\n\n  const [searchActive, setSearchActive] = useState(false)\n  // The raw value of the search input box:\n  const [searchInput, setSearchInput] = useState<string>('')\n  // The \"parsed\" search terms, which are only calculated when Enter is pressed:\n  const [searchTerms, setSearchTerms] = useState<string[]>()\n  const [breadcrumbsProps, setBreadcrumbsProps] = useState<BreadcrumbsProps>({\n    items: [],\n  })\n  const [searchByIdResults, setSearchByIdResults] = useState<\n    EntityFinderHeader[]\n  >([])\n  const [configFromTreeView, setConfigFromTreeView] =\n    useState<EntityDetailsListDataConfiguration>({\n      type: EntityDetailsListDataConfigurationType.PROMPT,\n    })\n\n  // If a type is selectable, it should be visible in the tree/list (depending on treeOnly)\n  const selectableAndVisibleTypesInTree = useMemo(\n    () => [...visibleTypesInTree, ...selectableTypes],\n    [visibleTypesInTree, selectableTypes],\n  )\n  const selectableAndVisibleTypesInList = useMemo(\n    () => [...visibleTypesInList, ...selectableTypes],\n    [visibleTypesInList, selectableTypes],\n  )\n\n  // For dual-pane, this state variable indicates which container is selected in the tree view and should be shown in the table view\n  const [currentContainer, setCurrentContainer] =\n    useState<EntityTreeContainer>(initialContainer)\n\n  const handleError = useErrorHandler()\n\n  const setBreadcrumbs = useCallback(\n    (items: BreadcrumbItem[]) => {\n      setBreadcrumbsProps({\n        items,\n      })\n    },\n    [setBreadcrumbsProps],\n  )\n\n  const { selectedEntities, toggleSelection, setSelection, setInitialVersion } =\n    useEntitySelection(selectMultiple)\n\n  useEffect(() => {\n    if (initialSelected) {\n      let map = Map<string, Reference>()\n      map = map.withMutations(mutableMap => {\n        initialSelected.forEach(reference => {\n          mutableMap.set(reference.targetId, reference)\n        })\n      })\n\n      setSelection(map)\n    }\n  }, [initialSelected, setSelection])\n\n  // A snapshot of the selectedEntities used to populate the selection list, allowing deselection of entities without removing them from the list.\n  const [selectedEntitiesSnapshot, setSelectedEntitiesSnapshot] =\n    useState(selectedEntities)\n\n  const isIdSelected = useCallback(\n    (entity: EntityFinderHeader) => {\n      return selectedEntities.has(entity.id)\n    },\n    [selectedEntities],\n  )\n\n  const isSelectable = useCallback(\n    (entity: EntityFinderHeader) => {\n      const type = getEntityTypeFromHeader(entity)\n      return selectableTypes.includes(type)\n    },\n    [selectableTypes],\n  )\n\n  useEffect(() => {\n    // When it changes, convert the map of selected items to a list of references and invoke the callback\n    onSelectedChange(Array.from(selectedEntities.values()))\n  }, [selectedEntities, onSelectedChange])\n\n  useEffect(() => {\n    if (searchTerms?.length === 1) {\n      const searchTermReference = parseSynId(searchTerms[0])\n      if (searchTermReference) {\n        SynapseClient.getEntityHeaders([searchTermReference], accessToken)\n          .then(response => {\n            setSearchByIdResults(response.results)\n          })\n          .catch(e => handleError(e))\n      }\n    } else {\n      setSearchByIdResults([])\n    }\n  }, [accessToken, searchTerms, handleError])\n\n  const handleTabChange = (\n    _event: React.SyntheticEvent,\n    newValue: EntityFinderTab,\n  ) => {\n    setSelectedEntitiesSnapshot(selectedEntities)\n    setCurrentTab(newValue)\n  }\n\n  const mainPanelClass = searchActive\n    ? 'MainPanelSearch'\n    : treeOnly\n      ? 'MainPanelSinglePane'\n      : 'MainPanelDualPane'\n\n  const entityDetailsListProps: EntityDetailsListProps = {\n    configuration: configFromTreeView,\n    versionSelection: versionSelection,\n    selected: selectedEntities,\n    isIdSelected: isIdSelected,\n    isSelectable: isSelectable,\n    visibleTypes: selectableAndVisibleTypesInList,\n    selectableTypes: selectableTypes,\n    selectColumnType: selectMultiple ? 'checkbox' : 'none',\n    toggleSelection: toggleSelection,\n    setInitialVersion: setInitialVersion,\n    enableSelectAll: selectMultiple,\n    setCurrentContainer: setCurrentContainer,\n  }\n\n  return (\n    <SynapseErrorBoundary>\n      <div className=\"EntityFinder\">\n        <Box\n          sx={{\n            display: 'flex',\n            justifyContent: 'space-between',\n            mb: 2.5,\n            rowGap: 2,\n            columnGap: 4,\n            flexWrap: { xs: 'wrap', md: 'nowrap' },\n          }}\n        >\n          <Tabs\n            value={currentTab}\n            onChange={handleTabChange}\n            sx={{ flex: 'none' }}\n          >\n            <Tab value={EntityFinderTab.BROWSE} label={'Browse'}></Tab>\n            <Tab\n              value={EntityFinderTab.SELECTED}\n              label={\n                <Stack\n                  direction={'row'}\n                  sx={{\n                    gap: 0.5,\n                    alignItems: 'center',\n                  }}\n                >\n                  <span>Selected</span>\n                  <Chip\n                    size={'small'}\n                    label={selectedEntities.size.toLocaleString()}\n                    sx={{\n                      backgroundColor: 'tertiary.500',\n                      color: 'grey.900',\n                      height: '21px',\n                    }}\n                  ></Chip>\n                </Stack>\n              }\n            ></Tab>\n          </Tabs>\n          <TextField\n            size={'small'}\n            placeholder=\"Search by name, wiki content, or SynID\"\n            value={searchInput}\n            onChange={event => {\n              setSearchInput(event.target.value)\n            }}\n            onKeyDown={(event: any) => {\n              if (event.key === 'Enter') {\n                const trimmedInput = event.target.value.trim()\n                setSearchActive(!!trimmedInput)\n                if (trimmedInput) {\n                  setSearchTerms(trimmedInput.split(/\\s+/))\n                  setCurrentTab(EntityFinderTab.BROWSE)\n                }\n              }\n            }}\n            sx={{\n              maxWidth: { xs: '100%', md: '350px' },\n              flex: '1 1 350px',\n            }}\n            slotProps={{\n              input: {\n                startAdornment: (\n                  <InputAdornment position=\"start\">\n                    <SearchIcon />\n                  </InputAdornment>\n                ),\n                endAdornment: searchTerms ? (\n                  <InputAdornment position=\"end\">\n                    <IconButton\n                      size={'small'}\n                      onClick={() => {\n                        setSearchInput('')\n                        setSearchTerms(undefined)\n                        setSearchActive(false)\n                      }}\n                      aria-label=\"Clear Search\"\n                      disabled={!searchInput && !searchActive}\n                    >\n                      <ClearIcon />\n                    </IconButton>\n                  </InputAdornment>\n                ) : undefined,\n              },\n            }}\n          />\n        </Box>\n        <div\n          role={'tabpanel'}\n          className={`EntityFinder__MainPanel ${mainPanelClass}`}\n          style={{\n            display: currentTab === EntityFinderTab.BROWSE ? 'block' : 'none',\n          }}\n        >\n          {/* We have a separate Details component for search in order to preserve state in the other component between searches */}\n          {searchActive && (\n            <EntityDetailsList\n              configuration={\n                searchByIdResults && searchByIdResults.length > 0\n                  ? {\n                      type: EntityDetailsListDataConfigurationType.HEADER_LIST,\n                      headerList: searchByIdResults,\n                    }\n                  : {\n                      type: EntityDetailsListDataConfigurationType.ENTITY_SEARCH,\n                      query: {\n                        queryTerm: searchTerms,\n                        booleanQuery:\n                          searchForOnlyTypesBooleanQuery(selectableTypes),\n                      },\n                    }\n              }\n              versionSelection={versionSelection}\n              selectColumnType={selectMultiple ? 'checkbox' : 'none'}\n              selected={selectedEntities}\n              isIdSelected={isIdSelected}\n              isSelectable={isSelectable}\n              visibleTypes={selectableTypes}\n              selectableTypes={selectableTypes}\n              toggleSelection={toggleSelection}\n              setInitialVersion={setInitialVersion}\n              enableSelectAll={selectMultiple}\n              // Intentionally do not pass \"setCurrentContainer\" -- search does not use the tree so it has nothing to update\n              setCurrentContainer={undefined}\n            />\n          )}\n          {\n            <div style={searchActive ? { display: 'none' } : {}}>\n              {treeOnly ? (\n                <div>\n                  <SynapseErrorBoundary>\n                    <EntityTree\n                      toggleSelection={toggleSelection}\n                      showDropdown={true}\n                      visibleTypes={selectableAndVisibleTypesInTree}\n                      initialScope={initialScope}\n                      selectedEntities={selectedEntities}\n                      projectId={projectId}\n                      initialContainer={initialContainer}\n                      currentContainer={currentContainer}\n                      setCurrentContainer={setCurrentContainer}\n                      showScopeAsRootNode={false}\n                      treeNodeType={EntityTreeNodeType.SINGLE_PANE}\n                      selectableTypes={selectableTypes}\n                    />\n                  </SynapseErrorBoundary>\n                </div>\n              ) : (\n                <div className=\"EntityFinderReflexContainer\">\n                  <ReflexContainer orientation=\"vertical\" windowResizeAware>\n                    <ReflexElement\n                      className=\"TreeViewReflexElement\"\n                      flex={0.24}\n                    >\n                      <SynapseErrorBoundary>\n                        <EntityTree\n                          selectedEntities={selectedEntities}\n                          setDetailsViewConfiguration={setConfigFromTreeView}\n                          showDropdown={true}\n                          visibleTypes={visibleTypesInTree}\n                          initialScope={initialScope}\n                          projectId={projectId}\n                          initialContainer={initialContainer}\n                          currentContainer={currentContainer}\n                          setCurrentContainer={setCurrentContainer}\n                          treeNodeType={EntityTreeNodeType.DUAL_PANE}\n                          setBreadcrumbItems={setBreadcrumbs}\n                          selectableTypes={visibleTypesInTree}\n                        />\n                      </SynapseErrorBoundary>\n                    </ReflexElement>\n                    <ReflexSplitter></ReflexSplitter>\n                    <ReflexElement className=\"DetailsViewReflexElement\">\n                      <SynapseErrorBoundary>\n                        <EntityDetailsList {...entityDetailsListProps} />\n                        <Breadcrumbs {...breadcrumbsProps} />\n                      </SynapseErrorBoundary>\n                    </ReflexElement>\n                  </ReflexContainer>\n                </div>\n              )}\n            </div>\n          }\n        </div>\n        <div\n          role={'tabpanel'}\n          className={'MainPanelSelected'}\n          style={{\n            display: currentTab === EntityFinderTab.SELECTED ? 'block' : 'none',\n          }}\n        >\n          <EntityDetailsList\n            {...entityDetailsListProps}\n            configuration={{\n              type: EntityDetailsListDataConfigurationType.REFERENCE_LIST,\n              referenceList: Array.from(selectedEntitiesSnapshot.values()),\n            }}\n          />\n        </div>\n      </div>\n    </SynapseErrorBoundary>\n  )\n}\n\nexport default EntityFinder\n"],"mappings":"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"}

package/dist/components/EntityFinder/EntityFinderModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityFinderModal.js","names":[],"sources":["../../../src/components/EntityFinder/EntityFinderModal.tsx"],"sourcesContent":["import React from 'react'\nimport { hasDifference } from '@/utils/functions/ArrayUtils'\nimport { Box, Typography } from '@mui/material'\nimport { Reference } from '@sage-bionetworks/synapse-types'\nimport { useEffect, useMemo, useState } from 'react'\nimport { ConfirmationDialog } from '../ConfirmationDialog'\nimport { HelpPopoverProps } from '../HelpPopover/HelpPopover'\nimport WarningDialog from '../SynapseForm/WarningDialog'\nimport EntityFinder, { EntityFinderProps } from './EntityFinder'\n\nexport const UNSAVED_CHANGES = 'Unsaved Changes'\n\nexport type EntityFinderModalProps = {\n  configuration: Omit<EntityFinderProps, 'onSelectedChange'>\n  show: boolean\n  title: string\n  titleHelpPopoverProps?: HelpPopoverProps\n  onConfirm: (selected: Reference[]) => void\n  confirmButtonCopy: string\n  onCancel: () => void\n  promptCopy?: string\n  initialSelected?: Reference[]\n}\n\nexport const EntityFinderModal = (\n  props: EntityFinderModalProps,\n): React.ReactNode => {\n  const [selected, setSelected] = useState<Reference[]>([])\n  useEffect(() => {\n    if (props.initialSelected) {\n      setSelected(props.initialSelected)\n    }\n  }, [props.initialSelected])\n\n  const [showUnsavedChangesWarning, setShowUnsavedChangesWarning] =\n    useState(false)\n  const hasUnsavedChanges = useMemo(() => {\n    if (props.initialSelected == null) {\n      return selected.length > 0\n    }\n    return hasDifference(props.initialSelected, selected)\n  }, [props.initialSelected, selected])\n\n  return (\n    <>\n      <WarningDialog\n        title={UNSAVED_CHANGES}\n        content=\"Any unsaved changes will be lost. Are you sure you want to close the finder?\"\n        open={showUnsavedChangesWarning}\n        confirmButtonText=\"Close Finder\"\n        onConfirm={() => {\n          setShowUnsavedChangesWarning(false)\n          props.onCancel()\n        }}\n        onCancel={() => {\n          setShowUnsavedChangesWarning(false)\n        }}\n      />\n      <ConfirmationDialog\n        open={props.show}\n        title={props.title}\n        fullWidth={false}\n        maxWidth=\"xl\"\n        titleHelpPopoverProps={props.titleHelpPopoverProps}\n        confirmButtonProps={{ children: props.confirmButtonCopy }}\n        onConfirm={() => {\n          props.onConfirm(selected)\n        }}\n        onCancel={() => {\n          if (hasUnsavedChanges) {\n            setShowUnsavedChangesWarning(true)\n          } else {\n            props.onCancel()\n          }\n        }}\n        content={\n          <Box>\n            <Typography\n              variant=\"body1\"\n              sx={{\n                mb: '10px',\n                // Do not allow the help text to expand the dialog width\n                minWidth: '100%',\n                width: 0,\n              }}\n            >\n              {props.promptCopy}\n            </Typography>\n            <EntityFinder\n              {...props.configuration}\n              initialSelected={props.initialSelected}\n              onSelectedChange={setSelected}\n            />\n          </Box>\n        }\n      />\n    </>\n  )\n}\n"],"mappings":";;;;;;;;;AAUA,IAAa,IAAkB,mBAclB,KACX,MACoB;CACpB,IAAM,CAAC,GAAU,KAAe,EAAsB,EAAE,CAAC;AACzD,SAAgB;AACd,EAAI,EAAM,mBACR,EAAY,EAAM,gBAAgB;IAEnC,CAAC,EAAM,gBAAgB,CAAC;CAE3B,IAAM,CAAC,GAA2B,KAChC,EAAS,GAAM,EACX,IAAoB,QACpB,EAAM,mBAAmB,OACpB,EAAS,SAAS,IAEpB,EAAc,EAAM,iBAAiB,EAAS,EACpD,CAAC,EAAM,iBAAiB,EAAS,CAAC;AAErC,QACE,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;EACE,OAAO;EACP,SAAQ;EACR,MAAM;EACN,mBAAkB;EAClB,iBAAiB;AAEf,GADA,EAA6B,GAAM,EACnC,EAAM,UAAU;;EAElB,gBAAgB;AACd,KAA6B,GAAM;;EAErC,CAAA,EACF,kBAAC,GAAD;EACE,MAAM,EAAM;EACZ,OAAO,EAAM;EACb,WAAW;EACX,UAAS;EACT,uBAAuB,EAAM;EAC7B,oBAAoB,EAAE,UAAU,EAAM,mBAAmB;EACzD,iBAAiB;AACf,KAAM,UAAU,EAAS;;EAE3B,gBAAgB;AACd,GAAI,IACF,EAA6B,GAAK,GAElC,EAAM,UAAU;;EAGpB,SACE,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD;GACE,SAAQ;GACR,IAAI;IACF,IAAI;IAEJ,UAAU;IACV,OAAO;IACR;aAEA,EAAM;GACI,CAAA,EACb,kBAAC,GAAD;GACE,GAAI,EAAM;GACV,iBAAiB,EAAM;GACvB,kBAAkB;GAClB,CAAA,CACE,EAAA,CAAA;EAER,CAAA,CACD,EAAA,CAAA"}
+{"version":3,"file":"EntityFinderModal.js","names":[],"sources":["../../../src/components/EntityFinder/EntityFinderModal.tsx"],"sourcesContent":["import React from 'react'\nimport { hasDifference } from '@/utils/functions/ArrayUtils'\nimport { Box, Typography } from '@mui/material'\nimport { Reference } from '@sage-bionetworks/synapse-types'\nimport { useEffect, useMemo, useState } from 'react'\nimport { ConfirmationDialog } from '../ConfirmationDialog'\nimport { HelpPopoverProps } from '../HelpPopover/HelpPopover'\nimport WarningDialog from '../SynapseForm/WarningDialog'\nimport EntityFinder, { EntityFinderProps } from './EntityFinder'\n\nexport const UNSAVED_CHANGES = 'Unsaved Changes'\n\nexport type EntityFinderModalProps = {\n  configuration: Omit<EntityFinderProps, 'onSelectedChange'>\n  show: boolean\n  title: string\n  titleHelpPopoverProps?: HelpPopoverProps\n  onConfirm: (selected: Reference[]) => void\n  confirmButtonCopy: string\n  onCancel: () => void\n  promptCopy?: string\n  initialSelected?: Reference[]\n}\n\nexport const EntityFinderModal = (\n  props: EntityFinderModalProps,\n): React.ReactNode => {\n  const [selected, setSelected] = useState<Reference[]>([])\n  useEffect(() => {\n    if (props.initialSelected) {\n      setSelected(props.initialSelected)\n    }\n  }, [props.initialSelected])\n\n  const [showUnsavedChangesWarning, setShowUnsavedChangesWarning] =\n    useState(false)\n  const hasUnsavedChanges = useMemo(() => {\n    if (props.initialSelected == null) {\n      return selected.length > 0\n    }\n    return hasDifference(props.initialSelected, selected)\n  }, [props.initialSelected, selected])\n\n  return (\n    <>\n      <WarningDialog\n        title={UNSAVED_CHANGES}\n        content=\"Any unsaved changes will be lost. Are you sure you want to close the finder?\"\n        open={showUnsavedChangesWarning}\n        confirmButtonText=\"Close Finder\"\n        onConfirm={() => {\n          setShowUnsavedChangesWarning(false)\n          props.onCancel()\n        }}\n        onCancel={() => {\n          setShowUnsavedChangesWarning(false)\n        }}\n      />\n      <ConfirmationDialog\n        open={props.show}\n        title={props.title}\n        fullWidth={false}\n        maxWidth=\"xl\"\n        titleHelpPopoverProps={props.titleHelpPopoverProps}\n        confirmButtonProps={{ children: props.confirmButtonCopy }}\n        onConfirm={() => {\n          props.onConfirm(selected)\n        }}\n        onCancel={() => {\n          if (hasUnsavedChanges) {\n            setShowUnsavedChangesWarning(true)\n          } else {\n            props.onCancel()\n          }\n        }}\n        content={\n          <Box>\n            <Typography\n              variant=\"body1\"\n              sx={{\n                mb: '10px',\n                // Do not allow the help text to expand the dialog width\n                minWidth: '100%',\n                width: 0,\n              }}\n            >\n              {props.promptCopy}\n            </Typography>\n            <EntityFinder\n              {...props.configuration}\n              initialSelected={props.initialSelected}\n              onSelectedChange={setSelected}\n            />\n          </Box>\n        }\n      />\n    </>\n  )\n}\n"],"mappings":";;;;;;;;;AAUA,IAAa,IAAkB,mBAclB,KACX,MACoB;CACpB,IAAM,CAAC,GAAU,KAAe,EAAsB,CAAC,CAAC;CACxD,QAAgB;EACd,AAAI,EAAM,mBACR,EAAY,EAAM,eAAe;CAErC,GAAG,CAAC,EAAM,eAAe,CAAC;CAE1B,IAAM,CAAC,GAA2B,KAChC,EAAS,EAAK,GACV,IAAoB,QACpB,EAAM,mBAAmB,OACpB,EAAS,SAAS,IAEpB,EAAc,EAAM,iBAAiB,CAAQ,GACnD,CAAC,EAAM,iBAAiB,CAAQ,CAAC;CAEpC,OACE,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;EACE,OAAO;EACP,SAAQ;EACR,MAAM;EACN,mBAAkB;EAClB,iBAAiB;GAEf,AADA,EAA6B,EAAK,GAClC,EAAM,SAAS;EACjB;EACA,gBAAgB;GACd,EAA6B,EAAK;EACpC;CACD,CAAA,GACD,kBAAC,GAAD;EACE,MAAM,EAAM;EACZ,OAAO,EAAM;EACb,WAAW;EACX,UAAS;EACT,uBAAuB,EAAM;EAC7B,oBAAoB,EAAE,UAAU,EAAM,kBAAkB;EACxD,iBAAiB;GACf,EAAM,UAAU,CAAQ;EAC1B;EACA,gBAAgB;GACd,AAAI,IACF,EAA6B,EAAI,IAEjC,EAAM,SAAS;EAEnB;EACA,SACE,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD;GACE,SAAQ;GACR,IAAI;IACF,IAAI;IAEJ,UAAU;IACV,OAAO;GACT;aAEC,EAAM;EACG,CAAA,GACZ,kBAAC,GAAD;GACE,GAAI,EAAM;GACV,iBAAiB,EAAM;GACvB,kBAAkB;EACnB,CAAA,CACE,EAAA,CAAA;CAER,CAAA,CACD,EAAA,CAAA;AAEN"}

package/dist/components/EntityFinder/EntityIdTextField.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityIdTextField.js","names":[],"sources":["../../../src/components/EntityFinder/EntityIdTextField.tsx"],"sourcesContent":["import { SearchOutlined } from '@mui/icons-material'\nimport { IconButton } from '@mui/material'\nimport { useState } from 'react'\nimport { TextField } from '../TextField'\nimport { EntityFinderModal, EntityFinderModalProps } from './EntityFinderModal'\n\nexport type EntityIdTextFieldProps = {\n  label: string\n  value: string\n  onChange: (value: string) => void\n  description?: string\n  disabled?: boolean\n  entityFinderModalProps: Omit<\n    EntityFinderModalProps,\n    'show' | 'onConfirm' | 'onCancel'\n  >\n}\n\n/**\n * A text field with an adornment button that opens an EntityFinderModal to select an entity.\n * The selected entity's ID is set as the value of the text field. Users may also type or paste\n * a raw synId.\n */\nfunction EntityIdTextField(props: EntityIdTextFieldProps) {\n  const {\n    label,\n    value,\n    description,\n    onChange,\n    disabled,\n    entityFinderModalProps,\n  } = props\n  const [showEntityFinder, setShowEntityFinder] = useState(false)\n  return (\n    <>\n      <EntityFinderModal\n        show={showEntityFinder}\n        onConfirm={selected => {\n          onChange(selected[0].targetId)\n          setShowEntityFinder(false)\n        }}\n        onCancel={() => setShowEntityFinder(false)}\n        {...entityFinderModalProps}\n      />\n      <TextField\n        label={label}\n        description={description}\n        type=\"text\"\n        fullWidth\n        value={value}\n        disabled={disabled}\n        onChange={e => onChange(e.target.value)}\n        slotProps={{\n          input: {\n            endAdornment: !disabled && (\n              <IconButton onClick={() => setShowEntityFinder(true)}>\n                <SearchOutlined />\n              </IconButton>\n            ),\n          },\n        }}\n      />\n    </>\n  )\n}\n\nexport default EntityIdTextField\n"],"mappings":";;;;;;;;AAuBA,SAAS,EAAkB,GAA+B;CACxD,IAAM,EACJ,UACA,UACA,gBACA,aACA,aACA,8BACE,GACE,CAAC,GAAkB,KAAuB,EAAS,GAAM;AAC/D,QACE,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;EACE,MAAM;EACN,YAAW,MAAY;AAErB,GADA,EAAS,EAAS,GAAG,SAAS,EAC9B,EAAoB,GAAM;;EAE5B,gBAAgB,EAAoB,GAAM;EAC1C,GAAI;EACJ,CAAA,EACF,kBAAC,GAAD;EACS;EACM;EACb,MAAK;EACL,WAAA;EACO;EACG;EACV,WAAU,MAAK,EAAS,EAAE,OAAO,MAAM;EACvC,WAAW,EACT,OAAO,EACL,cAAc,CAAC,KACb,kBAAC,GAAD;GAAY,eAAe,EAAoB,GAAK;aAClD,kBAAC,GAAD,EAAkB,CAAA;GACP,CAAA,EAEhB,EACF;EACD,CAAA,CACD,EAAA,CAAA"}
+{"version":3,"file":"EntityIdTextField.js","names":[],"sources":["../../../src/components/EntityFinder/EntityIdTextField.tsx"],"sourcesContent":["import { SearchOutlined } from '@mui/icons-material'\nimport { IconButton } from '@mui/material'\nimport { useState } from 'react'\nimport { TextField } from '../TextField'\nimport { EntityFinderModal, EntityFinderModalProps } from './EntityFinderModal'\n\nexport type EntityIdTextFieldProps = {\n  label: string\n  value: string\n  onChange: (value: string) => void\n  description?: string\n  disabled?: boolean\n  entityFinderModalProps: Omit<\n    EntityFinderModalProps,\n    'show' | 'onConfirm' | 'onCancel'\n  >\n}\n\n/**\n * A text field with an adornment button that opens an EntityFinderModal to select an entity.\n * The selected entity's ID is set as the value of the text field. Users may also type or paste\n * a raw synId.\n */\nfunction EntityIdTextField(props: EntityIdTextFieldProps) {\n  const {\n    label,\n    value,\n    description,\n    onChange,\n    disabled,\n    entityFinderModalProps,\n  } = props\n  const [showEntityFinder, setShowEntityFinder] = useState(false)\n  return (\n    <>\n      <EntityFinderModal\n        show={showEntityFinder}\n        onConfirm={selected => {\n          onChange(selected[0].targetId)\n          setShowEntityFinder(false)\n        }}\n        onCancel={() => setShowEntityFinder(false)}\n        {...entityFinderModalProps}\n      />\n      <TextField\n        label={label}\n        description={description}\n        type=\"text\"\n        fullWidth\n        value={value}\n        disabled={disabled}\n        onChange={e => onChange(e.target.value)}\n        slotProps={{\n          input: {\n            endAdornment: !disabled && (\n              <IconButton onClick={() => setShowEntityFinder(true)}>\n                <SearchOutlined />\n              </IconButton>\n            ),\n          },\n        }}\n      />\n    </>\n  )\n}\n\nexport default EntityIdTextField\n"],"mappings":";;;;;;;;AAuBA,SAAS,EAAkB,GAA+B;CACxD,IAAM,EACJ,UACA,UACA,gBACA,aACA,aACA,8BACE,GACE,CAAC,GAAkB,KAAuB,EAAS,EAAK;CAC9D,OACE,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;EACE,MAAM;EACN,YAAW,MAAY;GAErB,AADA,EAAS,EAAS,GAAG,QAAQ,GAC7B,EAAoB,EAAK;EAC3B;EACA,gBAAgB,EAAoB,EAAK;EACzC,GAAI;CACL,CAAA,GACD,kBAAC,GAAD;EACS;EACM;EACb,MAAK;EACL,WAAA;EACO;EACG;EACV,WAAU,MAAK,EAAS,EAAE,OAAO,KAAK;EACtC,WAAW,EACT,OAAO,EACL,cAAc,CAAC,KACb,kBAAC,GAAD;GAAY,eAAe,EAAoB,EAAI;aACjD,kBAAC,GAAD,CAAiB,CAAA;EACP,CAAA,EAEhB,EACF;CACD,CAAA,CACD,EAAA,CAAA;AAEN"}

package/dist/components/EntityFinder/VersionSelectionType.js.map

@@ -1 +1 @@
-{"version":3,"file":"VersionSelectionType.js","names":[],"sources":["../../../src/components/EntityFinder/VersionSelectionType.ts"],"sourcesContent":["/**\n * Documents the possible EntityFinder version selection configurations\n */\nexport enum VersionSelectionType {\n  /** Versions cannot be selected. In dual-pane mode, the version column will not be shown. */\n  DISALLOWED = 'DISALLOWED',\n  /** A numbered version must be selected. The current version of tables will not be shown. */\n  REQUIRED = 'REQUIRED',\n  /**\n   * Versions can be selected, including \"Always Latest\" version for any versionable entity type.\n   * This should be selected if updates to the entity will not be \"tracked\" by the use case,\n   * i.e. the widget will update when the entity is updated.\n   */\n  TRACKED = 'TRACKED',\n  /**\n   * Versions can be selected. Tables and views will allow selection of the \"Current\"/\"Draft\" version.\n   * This should be selected if updates to the entity will not be \"tracked\" by the use case.\n   */\n  UNTRACKED = 'UNTRACKED',\n}\n"],"mappings":";AAGA,IAAY,IAAL,yBAAA,GAAA;QAEL,EAAA,aAAa,cAEb,EAAA,WAAW,YAMX,EAAA,UAAU,WAKV,EAAA,YAAY;KACb"}
+{"version":3,"file":"VersionSelectionType.js","names":[],"sources":["../../../src/components/EntityFinder/VersionSelectionType.ts"],"sourcesContent":["/**\n * Documents the possible EntityFinder version selection configurations\n */\nexport enum VersionSelectionType {\n  /** Versions cannot be selected. In dual-pane mode, the version column will not be shown. */\n  DISALLOWED = 'DISALLOWED',\n  /** A numbered version must be selected. The current version of tables will not be shown. */\n  REQUIRED = 'REQUIRED',\n  /**\n   * Versions can be selected, including \"Always Latest\" version for any versionable entity type.\n   * This should be selected if updates to the entity will not be \"tracked\" by the use case,\n   * i.e. the widget will update when the entity is updated.\n   */\n  TRACKED = 'TRACKED',\n  /**\n   * Versions can be selected. Tables and views will allow selection of the \"Current\"/\"Draft\" version.\n   * This should be selected if updates to the entity will not be \"tracked\" by the use case.\n   */\n  UNTRACKED = 'UNTRACKED',\n}\n"],"mappings":";AAGA,IAAY,IAAL,yBAAA,GAAA;QAEL,EAAA,aAAA,cAEA,EAAA,WAAA,YAMA,EAAA,UAAA,WAKA,EAAA,YAAA;AACF,EAAA,CAAA,CAAA"}

package/dist/components/EntityFinder/details/EntityDetailsList.js

@@ -13,47 +13,47 @@ import d from "use-deep-compare-effect";
 var f = /* @__PURE__ */ function(e) {
 	return e[e.REFERENCE_LIST = 0] = "REFERENCE_LIST", e[e.HEADER_LIST = 1] = "HEADER_LIST", e[e.PARENT_CONTAINER = 2] = "PARENT_CONTAINER", e[e.USER_PROJECTS = 3] = "USER_PROJECTS", e[e.USER_FAVORITES = 4] = "USER_FAVORITES", e[e.ENTITY_SEARCH = 5] = "ENTITY_SEARCH", e[e.PROMPT = 6] = "PROMPT", e;
 }({});
-function p({ configuration: p, ...m }) {
-	let [h, g] = c(/* @__PURE__ */ u(l, {}));
+function p({ configuration: f, ...p }) {
+	let [m, h] = c(/* @__PURE__ */ u(l, {}));
 	return d(() => {
-		g(((e) => {
+		h(((e) => {
 			switch (e.type) {
-				case f.PARENT_CONTAINER: return /* @__PURE__ */ u(r, {
+				case 2: return /* @__PURE__ */ u(r, {
 					parentContainerId: e.parentContainerId,
-					...m
+					...p
 				});
-				case f.HEADER_LIST: return /* @__PURE__ */ u(n, {
+				case 1: return /* @__PURE__ */ u(n, {
 					entities: e.headerList,
 					isLoading: !1,
 					hasNextPage: !1,
-					...m,
-					enableSelectAll: m.enableSelectAll,
-					selectAllIsChecked: t(e.headerList ?? [], m.selected.size, m.isIdSelected, m.isSelectable)
+					...p,
+					enableSelectAll: p.enableSelectAll,
+					selectAllIsChecked: t(e.headerList ?? [], p.selected.size, p.isIdSelected, p.isSelectable)
 				});
-				case f.REFERENCE_LIST: return /* @__PURE__ */ u(o, {
-					...m,
+				case 0: return /* @__PURE__ */ u(o, {
+					...p,
 					references: e.referenceList
 				});
-				case f.USER_FAVORITES: return /* @__PURE__ */ u(i, { ...m });
-				case f.ENTITY_SEARCH: return /* @__PURE__ */ u(s, {
+				case 4: return /* @__PURE__ */ u(i, { ...p });
+				case 5: return /* @__PURE__ */ u(s, {
 					searchQuery: e.query,
-					...m
+					...p
 				});
-				case f.USER_PROJECTS: return /* @__PURE__ */ u(a, {
+				case 3: return /* @__PURE__ */ u(a, {
 					projectsParams: e.getProjectParams,
-					...m
+					...p
 				});
-				case f.PROMPT: return /* @__PURE__ */ u(n, {
+				case 6: return /* @__PURE__ */ u(n, {
 					entities: [],
 					isLoading: !1,
 					noResultsPlaceholder: /* @__PURE__ */ u("div", { children: "Use the left panel to browse Synapse, then make a selection in this panel" }),
-					...m,
+					...p,
 					enableSelectAll: !1
 				});
 				default: return console.warn("The configuration type does not map to a known view type. No Details view will be rendered. Invalid configuration: ", e), /* @__PURE__ */ u(l, {});
 			}
-		})(p));
-	}, [p, m]), /* @__PURE__ */ u(e, { children: h });
+		})(f));
+	}, [f, p]), /* @__PURE__ */ u(e, { children: m });
 }
 //#endregion
 export { p as EntityDetailsList, f as EntityDetailsListDataConfigurationType };