synapse-react-client 4.0.46 → 4.0.47

package/dist/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilter.js

@@ -1,56 +1,58 @@
 import { VALUE_NOT_SET as e } from "../../../../utils/SynapseConstants.js";
 import { isFacetColumnValuesRequest as t } from "../../../../utils/types/IsType.js";
-import n from "../../../../utils/hooks/useGetInfoFromIds.js";
+import { useQueryVisualizationContext as n } from "../../../QueryVisualizationWrapper/QueryVisualizationContext.js";
+import r from "../../../../utils/hooks/useGetInfoFromIds.js";
 import "../../../../utils/index.js";
-import { getCorrespondingColumnForFacet as r, getCorrespondingSelectedFacet as i } from "../../../../utils/functions/queryUtils.js";
-import { useQueryContext as a } from "../../../QueryContext/QueryContext.js";
+import { getCorrespondingColumnForFacet as i, getCorrespondingSelectedFacet as a } from "../../../../utils/functions/queryUtils.js";
+import { useQueryContext as o } from "../../../QueryContext/QueryContext.js";
 import "../../../QueryContext/index.js";
-import { useSuspenseGetQueryMetadata as o } from "../../../QueryWrapper/useGetQueryMetadata.js";
-import s from "../../facet-nav/FacetValueChip.js";
-import { useQueryVisualizationContext as c } from "../../../QueryVisualizationWrapper/QueryVisualizationContext.js";
+import { useSuspenseGetQueryMetadata as s } from "../../../QueryWrapper/useGetQueryMetadata.js";
+import c from "../../facet-nav/FacetValueChip.js";
 import "../../../QueryVisualizationWrapper/index.js";
 import l from "./EnumFacetFilterUI.js";
-import { EnumFacetFilterSkeleton as u } from "./EnumFacetFilterSkeleton.js";
-import { getAllIsSelected as d, valueToLabel as f } from "./EnumFacetFilterUtils.js";
-import { Suspense as p, useMemo as m } from "react";
-import { cloneDeep as h, partition as g, pick as _, sortBy as v } from "lodash-es";
-import { Fragment as y, jsx as b } from "react/jsx-runtime";
-import { ColumnTypeEnum as x } from "@sage-bionetworks/synapse-types";
+import { formatFacetValueCount as u } from "../../../../utils/functions/facetCountUtils.js";
+import { EnumFacetFilterSkeleton as d } from "./EnumFacetFilterSkeleton.js";
+import { getAllIsSelected as f, valueToLabel as p } from "./EnumFacetFilterUtils.js";
+import { Suspense as m, useMemo as h } from "react";
+import { cloneDeep as g, partition as _, pick as v, sortBy as y } from "lodash-es";
+import { Fragment as b, jsx as x } from "react/jsx-runtime";
+import { ColumnTypeEnum as S } from "@sage-bionetworks/synapse-types";
 //#region src/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilter.tsx
-function S(u) {
-	let { facet: p, containerAs: S = "Collapsible", dropdownType: C = "Icon", hideCollapsible: w = !1, defaultShowAllValues: T = !1, labelId: E } = u, { nextQueryRequest: D, addValueToSelectedFacet: O, removeSelectedFacet: k, removeValueFromSelectedFacet: A, resetDebounceTimer: j } = a(), { data: M } = o(), { getColumnDisplayName: N, renderFacetValue: P } = c(), F = m(() => {
-		let e = i(p, h(D.query.selectedFacets));
+function C(d) {
+	let { facet: m, containerAs: C = "Collapsible", dropdownType: w = "Icon", hideCollapsible: T = !1, defaultShowAllValues: E = !1, labelId: D } = d, { nextQueryRequest: O, addValueToSelectedFacet: k, removeSelectedFacet: A, removeValueFromSelectedFacet: j, resetDebounceTimer: M } = o(), { data: N } = s(), { getColumnDisplayName: P, renderFacetValue: F } = n(), I = h(() => {
+		let e = a(m, g(O.query.selectedFacets));
 		if (e && !t(e)) {
-			console.error("The facet rendered in EnumFacetFilter is not a FacetColumnValuesRequest", p);
+			console.error("The facet rendered in EnumFacetFilter is not a FacetColumnValuesRequest", m);
 			return;
 		}
 		return e;
-	}, [p, D.query.selectedFacets]), I = d(h(D), p), L = M.columnModels ? r(p, M.columnModels) : void 0, R = m(() => {
-		switch (L?.columnType) {
-			case x.DOUBLE:
-			case x.DATE:
-			case x.INTEGER: return !0;
+	}, [m, O.query.selectedFacets]), L = f(g(O), m), R = N.columnModels ? i(m, N.columnModels) : void 0, z = h(() => {
+		switch (R?.columnType) {
+			case S.DOUBLE:
+			case S.DATE:
+			case S.INTEGER: return !0;
 			default: return !1;
 		}
-	}, [L]), z = n({
-		ids: L?.columnType === x.USERID || L?.columnType === x.USERID_LIST ? p.facetValues.map((e) => e.value) : [],
+	}, [R]), B = r({
+		ids: R?.columnType === S.USERID || R?.columnType === S.USERID_LIST ? m.facetValues.map((e) => e.value) : [],
 		type: "USER_PROFILE"
-	}), B = n({
-		ids: L?.columnType === x.ENTITYID || L?.columnType === x.ENTITYID_LIST ? p.facetValues.map((e) => e.value) : [],
+	}), V = r({
+		ids: R?.columnType === S.ENTITYID || R?.columnType === S.ENTITYID_LIST ? m.facetValues.map((e) => e.value) : [],
 		type: "ENTITY_HEADER"
-	}), V = n({
-		ids: L?.columnType === x.EVALUATIONID ? p.facetValues.map((e) => e.value) : [],
+	}), H = r({
+		ids: R?.columnType === S.EVALUATIONID ? m.facetValues.map((e) => e.value) : [],
 		type: "EVALUATION_QUEUE"
-	}), H = m(() => {
-		let t = g(p.facetValues.map((e) => {
-			let t = f(e, z, B, V);
+	}), U = h(() => {
+		let t = _(m.facetValues.map((e) => {
+			let t = p(e, B, V, H);
 			return {
 				...e,
-				isSelected: F?.facetValues.includes(e.value) ?? !1,
+				isSelected: I?.facetValues.includes(e.value) ?? !1,
 				displayText: t,
+				countText: u(e.count, m, N.facetPostProcessingApplied),
 				renderedLabel: (() => {
-					let t = P?.(p.columnName, e.value);
-					return t ? /* @__PURE__ */ b(s, {
+					let t = F?.(m.columnName, e.value);
+					return t ? /* @__PURE__ */ x(c, {
 						label: t.label,
 						icon: t.icon,
 						tooltipTitle: t.tooltipTitle,
@@ -60,51 +62,51 @@ function S(u) {
 				})()
 			};
 		}), (t) => t.value === e), n = t[0], r = t[1], i = r;
-		return L?.facetSortConfig ?? (i = R ? v(r, (e) => Number(e.value)) : v(r, (e) => e.displayText.toLowerCase())), [...i, ...n];
+		return R?.facetSortConfig ?? (i = z ? y(r, (e) => Number(e.value)) : y(r, (e) => e.displayText.toLowerCase())), [...i, ...n];
 	}, [
-		p.facetValues,
-		p.columnName,
-		L,
-		F?.facetValues,
-		z,
+		m,
+		N.facetPostProcessingApplied,
+		R,
+		I?.facetValues,
 		B,
 		V,
-		R,
-		P
+		H,
+		z,
+		F
 	]);
-	return L ? /* @__PURE__ */ b(l, {
-		labelId: E,
-		facetTitle: N(p.columnName, p.jsonPath),
-		filterIsActive: !I,
-		facetValues: H,
-		containerAs: S,
-		dropdownType: C,
-		hideCollapsible: w,
-		defaultShowAllValues: T,
+	return R ? /* @__PURE__ */ x(l, {
+		labelId: D,
+		facetTitle: P(m.columnName, m.jsonPath),
+		filterIsActive: !L,
+		facetValues: U,
+		containerAs: C,
+		dropdownType: w,
+		hideCollapsible: T,
+		defaultShowAllValues: E,
 		onHoverOverValue: () => {
-			j();
+			M();
 		},
 		onAddValueToSelection: (e) => {
-			O(_(p, ["columnName", "jsonPath"]), e, { debounce: !0 });
+			k(v(m, ["columnName", "jsonPath"]), e, { debounce: !0 });
 		},
 		onRemoveValueFromSelection: (e) => {
-			A(_(p, ["columnName", "jsonPath"]), e, { debounce: !0 });
+			j(v(m, ["columnName", "jsonPath"]), e, { debounce: !0 });
 		},
-		onRemoveAllFacetSelections: () => k(_(p, ["columnName", "jsonPath"])),
+		onRemoveAllFacetSelections: () => A(v(m, ["columnName", "jsonPath"])),
 		canMultiSelect: !0
-	}) : /* @__PURE__ */ b(y, {});
+	}) : /* @__PURE__ */ x(b, {});
 }
-function C(e) {
+function w(e) {
 	let { containerAs: t = "Collapsible", dropdownType: n = "Icon" } = e;
-	return /* @__PURE__ */ b(p, {
-		fallback: /* @__PURE__ */ b(u, {
+	return /* @__PURE__ */ x(m, {
+		fallback: /* @__PURE__ */ x(d, {
 			containerAs: t,
 			dropdownType: n
 		}),
-		children: /* @__PURE__ */ b(S, { ...e })
+		children: /* @__PURE__ */ x(C, { ...e })
 	});
 }
 //#endregion
-export { C as EnumFacetFilter };
+export { w as EnumFacetFilter };
 
 //# sourceMappingURL=EnumFacetFilter.js.map

package/dist/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilter.js.map

@@ -1 +1 @@
-{"version":3,"file":"EnumFacetFilter.js","names":[],"sources":["../../../../../src/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilter.tsx"],"sourcesContent":["import { isFacetColumnValuesRequest, SynapseConstants } from '@/utils'\nimport {\n  getCorrespondingColumnForFacet,\n  getCorrespondingSelectedFacet,\n} from '@/utils/functions/queryUtils'\nimport useGetInfoFromIds from '@/utils/hooks/useGetInfoFromIds'\nimport {\n  ColumnTypeEnum,\n  EntityHeader,\n  Evaluation,\n  FacetColumnRequest,\n  FacetColumnResultValueCount,\n  FacetColumnResultValues,\n  FacetColumnValuesRequest,\n  QueryBundleRequest,\n  UserGroupHeader,\n} from '@sage-bionetworks/synapse-types'\nimport { cloneDeep, partition, pick, sortBy } from 'lodash-es'\nimport { Suspense, useMemo } from 'react'\nimport { useQueryContext } from '../../../QueryContext'\nimport { useQueryVisualizationContext } from '../../../QueryVisualizationWrapper'\nimport { useSuspenseGetQueryMetadata } from '../../../QueryWrapper/useGetQueryMetadata'\nimport { EnumFacetFilterSkeleton } from './EnumFacetFilterSkeleton'\nimport EnumFacetFilterUI, { RenderedFacetValue } from './EnumFacetFilterUI'\nimport { getAllIsSelected, valueToLabel } from './EnumFacetFilterUtils'\nimport FacetValueChip from '../../facet-nav/FacetValueChip'\n\nexport type EnumFacetFilterProps = {\n  labelId?: string\n  facet: FacetColumnResultValues\n  containerAs?: 'Collapsible' | 'Dropdown'\n  dropdownType?: 'Icon' | 'SelectBox'\n  hideCollapsible?: boolean\n  defaultShowAllValues?: boolean\n}\n\nfunction EnumFacetFilterInternal(props: EnumFacetFilterProps) {\n  const {\n    facet,\n    containerAs = 'Collapsible',\n    dropdownType = 'Icon',\n    hideCollapsible = false,\n    defaultShowAllValues = false,\n    labelId,\n  } = props\n  const {\n    nextQueryRequest,\n    addValueToSelectedFacet,\n    removeSelectedFacet,\n    removeValueFromSelectedFacet,\n    resetDebounceTimer,\n  } = useQueryContext()\n\n  const { data: queryMetadata } = useSuspenseGetQueryMetadata()\n  const { getColumnDisplayName, renderFacetValue } =\n    useQueryVisualizationContext()\n\n  const currentSelectedFacet: FacetColumnValuesRequest | undefined =\n    useMemo(() => {\n      const facetColumnRequest = getCorrespondingSelectedFacet(\n        facet,\n        cloneDeep(nextQueryRequest.query.selectedFacets) as\n          | FacetColumnRequest[]\n          | undefined,\n      )\n\n      if (\n        facetColumnRequest &&\n        !isFacetColumnValuesRequest(facetColumnRequest)\n      ) {\n        console.error(\n          `The facet rendered in EnumFacetFilter is not a FacetColumnValuesRequest`,\n          facet,\n        )\n        return undefined\n      }\n      return facetColumnRequest\n    }, [facet, nextQueryRequest.query.selectedFacets])\n\n  // Must compare the known facet values to the \"uncommitted\" current query\n  const allIsSelected = getAllIsSelected(\n    cloneDeep(nextQueryRequest) as QueryBundleRequest,\n    facet,\n  )\n\n  const columnModel = queryMetadata.columnModels\n    ? getCorrespondingColumnForFacet(facet, queryMetadata.columnModels)\n    : undefined\n\n  const isNumberColumnType = useMemo(() => {\n    switch (columnModel?.columnType) {\n      case ColumnTypeEnum.DOUBLE:\n      case ColumnTypeEnum.DATE:\n      case ColumnTypeEnum.INTEGER:\n        return true\n      default:\n        return false\n    }\n  }, [columnModel])\n\n  const userIds =\n    columnModel?.columnType === ColumnTypeEnum.USERID ||\n    columnModel?.columnType === ColumnTypeEnum.USERID_LIST\n      ? facet.facetValues.map(facet => facet.value)\n      : []\n  const userGroupHeaders = useGetInfoFromIds<UserGroupHeader>({\n    ids: userIds,\n    type: 'USER_PROFILE',\n  })\n\n  const entityIds =\n    columnModel?.columnType === ColumnTypeEnum.ENTITYID ||\n    columnModel?.columnType === ColumnTypeEnum.ENTITYID_LIST\n      ? facet.facetValues.map(facet => facet.value)\n      : []\n  const entityHeaders = useGetInfoFromIds<EntityHeader>({\n    ids: entityIds,\n    type: 'ENTITY_HEADER',\n  })\n\n  const evaluationIds =\n    columnModel?.columnType === ColumnTypeEnum.EVALUATIONID\n      ? facet.facetValues.map(facet => facet.value)\n      : []\n  const evaluations = useGetInfoFromIds<Evaluation>({\n    ids: evaluationIds,\n    type: 'EVALUATION_QUEUE',\n  })\n\n  const displayedFacetValues: RenderedFacetValue[] = useMemo(() => {\n    const renderedFacetValues = facet.facetValues.map(\n      (facetValue: FacetColumnResultValueCount): RenderedFacetValue => {\n        const displayText = valueToLabel(\n          facetValue,\n          userGroupHeaders,\n          entityHeaders,\n          evaluations,\n        )\n        return {\n          ...facetValue,\n          // Selected status should be based on the 'nextQuery', not the result data\n          // This ensures the checkboxes respond instantly to user interaction, like while waiting for multiple changes to debounce\n          isSelected:\n            currentSelectedFacet?.facetValues.includes(facetValue.value) ??\n            false,\n          displayText,\n          renderedLabel: (() => {\n            const rendered = renderFacetValue?.(\n              facet.columnName,\n              facetValue.value,\n            )\n            return rendered ? (\n              <FacetValueChip\n                label={rendered.label}\n                icon={rendered.icon}\n                tooltipTitle={rendered.tooltipTitle}\n                placement=\"right\"\n                truncate\n              />\n            ) : undefined\n          })(),\n        }\n      },\n    )\n    //Abby V's suggestion, always show the VALUE_NOT_SET facet value on the bottom of this sorted list\n    const partitions = partition(\n      renderedFacetValues,\n      facet => facet.value === SynapseConstants.VALUE_NOT_SET,\n    )\n    const valueNotSetFacetArray = partitions[0]\n    const restOfFacetValuesArray = partitions[1]\n\n    // Apply client-side sorting if no server-side sort is specified\n    let sortedValues: RenderedFacetValue[] = restOfFacetValuesArray\n    const isClientSideSort = columnModel?.facetSortConfig == undefined\n    if (isClientSideSort) {\n      if (isNumberColumnType) {\n        sortedValues = sortBy(restOfFacetValuesArray, fv => Number(fv.value))\n      } else {\n        sortedValues = sortBy(restOfFacetValuesArray, fv =>\n          fv.displayText.toLowerCase(),\n        )\n      }\n    }\n\n    return [...sortedValues, ...valueNotSetFacetArray]\n  }, [\n    facet.facetValues,\n    facet.columnName,\n    columnModel,\n    currentSelectedFacet?.facetValues,\n    userGroupHeaders,\n    entityHeaders,\n    evaluations,\n    isNumberColumnType,\n    renderFacetValue,\n  ])\n\n  if (!columnModel) {\n    return <></>\n  }\n\n  return (\n    <EnumFacetFilterUI\n      labelId={labelId}\n      facetTitle={getColumnDisplayName(facet.columnName, facet.jsonPath)}\n      filterIsActive={!allIsSelected}\n      facetValues={displayedFacetValues}\n      containerAs={containerAs}\n      dropdownType={dropdownType}\n      hideCollapsible={hideCollapsible}\n      defaultShowAllValues={defaultShowAllValues}\n      onHoverOverValue={() => {\n        // SWC-6698: delay the query execution (via the debounce) when an item is hovered over\n        resetDebounceTimer()\n      }}\n      onAddValueToSelection={value => {\n        addValueToSelectedFacet(\n          pick(facet, ['columnName', 'jsonPath']),\n          value,\n          { debounce: true },\n        )\n      }}\n      onRemoveValueFromSelection={value => {\n        removeValueFromSelectedFacet(\n          pick(facet, ['columnName', 'jsonPath']),\n          value,\n          { debounce: true },\n        )\n      }}\n      onRemoveAllFacetSelections={() =>\n        removeSelectedFacet(pick(facet, ['columnName', 'jsonPath']))\n      }\n      canMultiSelect={true}\n    />\n  )\n}\n\nexport function EnumFacetFilter(props: EnumFacetFilterProps) {\n  const { containerAs = 'Collapsible', dropdownType = 'Icon' } = props\n  return (\n    <Suspense\n      fallback={\n        <EnumFacetFilterSkeleton\n          containerAs={containerAs}\n          dropdownType={dropdownType}\n        />\n      }\n    >\n      <EnumFacetFilterInternal {...props} />\n    </Suspense>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAoCA,SAAS,EAAwB,GAA6B;CAC5D,IAAM,EACJ,UACA,iBAAc,eACd,kBAAe,QACf,qBAAkB,IAClB,0BAAuB,IACvB,eACE,GACE,EACJ,qBACA,4BACA,wBACA,iCACA,0BACE,EAAgB,GAEd,EAAE,MAAM,MAAkB,EAA4B,GACtD,EAAE,yBAAsB,wBAC5B,EAA6B,GAEzB,IACJ,QAAc;EACZ,IAAM,IAAqB,EACzB,GACA,EAAU,EAAiB,MAAM,cAAc,CAGjD;EAEA,IACE,KACA,CAAC,EAA2B,CAAkB,GAC9C;GACA,QAAQ,MACN,2EACA,CACF;GACA;EACF;EACA,OAAO;CACT,GAAG,CAAC,GAAO,EAAiB,MAAM,cAAc,CAAC,GAG7C,IAAgB,EACpB,EAAU,CAAgB,GAC1B,CACF,GAEM,IAAc,EAAc,eAC9B,EAA+B,GAAO,EAAc,YAAY,IAChE,KAAA,GAEE,IAAqB,QAAc;EACvC,QAAQ,GAAa,YAArB;GACE,KAAK,EAAe;GACpB,KAAK,EAAe;GACpB,KAAK,EAAe,SAClB,OAAO;GACT,SACE,OAAO;EACX;CACF,GAAG,CAAC,CAAW,CAAC,GAOV,IAAmB,EAAmC;EAC1D,KALA,GAAa,eAAe,EAAe,UAC3C,GAAa,eAAe,EAAe,cACvC,EAAM,YAAY,KAAI,MAAS,EAAM,KAAK,IAC1C,CAAC;EAGL,MAAM;CACR,CAAC,GAOK,IAAgB,EAAgC;EACpD,KALA,GAAa,eAAe,EAAe,YAC3C,GAAa,eAAe,EAAe,gBACvC,EAAM,YAAY,KAAI,MAAS,EAAM,KAAK,IAC1C,CAAC;EAGL,MAAM;CACR,CAAC,GAMK,IAAc,EAA8B;EAChD,KAJA,GAAa,eAAe,EAAe,eACvC,EAAM,YAAY,KAAI,MAAS,EAAM,KAAK,IAC1C,CAAC;EAGL,MAAM;CACR,CAAC,GAEK,IAA6C,QAAc;EAoC/D,IAAM,IAAa,EAnCS,EAAM,YAAY,KAC3C,MAAgE;GAC/D,IAAM,IAAc,EAClB,GACA,GACA,GACA,CACF;GACA,OAAO;IACL,GAAG;IAGH,YACE,GAAsB,YAAY,SAAS,EAAW,KAAK,KAC3D;IACF;IACA,sBAAsB;KACpB,IAAM,IAAW,IACf,EAAM,YACN,EAAW,KACb;KACA,OAAO,IACL,kBAAC,GAAD;MACE,OAAO,EAAS;MAChB,MAAM,EAAS;MACf,cAAc,EAAS;MACvB,WAAU;MACV,UAAA;KACD,CAAA,IACC,KAAA;IACN,GAAG;GACL;EACF,CAIA,IACA,MAAS,EAAM,UAAU,CAC3B,GACM,IAAwB,EAAW,IACnC,IAAyB,EAAW,IAGtC,IAAqC;EAYzC,OAXyB,GAAa,oBAEpC,AAGE,IAHE,IACa,EAAO,IAAwB,MAAM,OAAO,EAAG,KAAK,CAAC,IAErD,EAAO,IAAwB,MAC5C,EAAG,YAAY,YAAY,CAC7B,IAIG,CAAC,GAAG,GAAc,GAAG,CAAqB;CACnD,GAAG;EACD,EAAM;EACN,EAAM;EACN;EACA,GAAsB;EACtB;EACA;EACA;EACA;EACA;CACF,CAAC;CAMD,OAJK,IAKH,kBAAC,GAAD;EACW;EACT,YAAY,EAAqB,EAAM,YAAY,EAAM,QAAQ;EACjE,gBAAgB,CAAC;EACjB,aAAa;EACA;EACC;EACG;EACK;EACtB,wBAAwB;GAEtB,EAAmB;EACrB;EACA,wBAAuB,MAAS;GAC9B,EACE,EAAK,GAAO,CAAC,cAAc,UAAU,CAAC,GACtC,GACA,EAAE,UAAU,GAAK,CACnB;EACF;EACA,6BAA4B,MAAS;GACnC,EACE,EAAK,GAAO,CAAC,cAAc,UAAU,CAAC,GACtC,GACA,EAAE,UAAU,GAAK,CACnB;EACF;EACA,kCACE,EAAoB,EAAK,GAAO,CAAC,cAAc,UAAU,CAAC,CAAC;EAE7D,gBAAgB;CACjB,CAAA,IAnCM,kBAAA,GAAA,CAAI,CAAA;AAqCf;AAEA,SAAgB,EAAgB,GAA6B;CAC3D,IAAM,EAAE,iBAAc,eAAe,kBAAe,WAAW;CAC/D,OACE,kBAAC,GAAD;EACE,UACE,kBAAC,GAAD;GACe;GACC;EACf,CAAA;YAGH,kBAAC,GAAD,EAAyB,GAAI,EAAQ,CAAA;CAC7B,CAAA;AAEd"}
+{"version":3,"file":"EnumFacetFilter.js","names":[],"sources":["../../../../../src/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilter.tsx"],"sourcesContent":["import { isFacetColumnValuesRequest, SynapseConstants } from '@/utils'\nimport { formatFacetValueCount } from '@/utils/functions/facetCountUtils'\nimport {\n  getCorrespondingColumnForFacet,\n  getCorrespondingSelectedFacet,\n} from '@/utils/functions/queryUtils'\nimport useGetInfoFromIds from '@/utils/hooks/useGetInfoFromIds'\nimport { EnumerationFacet } from '@/utils/functions/enumerationFacet'\nimport {\n  ColumnTypeEnum,\n  EntityHeader,\n  Evaluation,\n  FacetColumnRequest,\n  FacetColumnResultValueCount,\n  FacetColumnValuesRequest,\n  QueryBundleRequest,\n  UserGroupHeader,\n} from '@sage-bionetworks/synapse-types'\nimport { cloneDeep, partition, pick, sortBy } from 'lodash-es'\nimport { Suspense, useMemo } from 'react'\nimport { useQueryContext } from '../../../QueryContext'\nimport { useQueryVisualizationContext } from '../../../QueryVisualizationWrapper'\nimport { useSuspenseGetQueryMetadata } from '../../../QueryWrapper/useGetQueryMetadata'\nimport { EnumFacetFilterSkeleton } from './EnumFacetFilterSkeleton'\nimport EnumFacetFilterUI, { RenderedFacetValue } from './EnumFacetFilterUI'\nimport { getAllIsSelected, valueToLabel } from './EnumFacetFilterUtils'\nimport FacetValueChip from '../../facet-nav/FacetValueChip'\n\nexport type EnumFacetFilterProps = {\n  labelId?: string\n  facet: EnumerationFacet\n  containerAs?: 'Collapsible' | 'Dropdown'\n  dropdownType?: 'Icon' | 'SelectBox'\n  hideCollapsible?: boolean\n  defaultShowAllValues?: boolean\n}\n\nfunction EnumFacetFilterInternal(props: EnumFacetFilterProps) {\n  const {\n    facet,\n    containerAs = 'Collapsible',\n    dropdownType = 'Icon',\n    hideCollapsible = false,\n    defaultShowAllValues = false,\n    labelId,\n  } = props\n  const {\n    nextQueryRequest,\n    addValueToSelectedFacet,\n    removeSelectedFacet,\n    removeValueFromSelectedFacet,\n    resetDebounceTimer,\n  } = useQueryContext()\n\n  const { data: queryMetadata } = useSuspenseGetQueryMetadata()\n  const { getColumnDisplayName, renderFacetValue } =\n    useQueryVisualizationContext()\n\n  const currentSelectedFacet: FacetColumnValuesRequest | undefined =\n    useMemo(() => {\n      const facetColumnRequest = getCorrespondingSelectedFacet(\n        facet,\n        cloneDeep(nextQueryRequest.query.selectedFacets) as\n          | FacetColumnRequest[]\n          | undefined,\n      )\n\n      if (\n        facetColumnRequest &&\n        !isFacetColumnValuesRequest(facetColumnRequest)\n      ) {\n        console.error(\n          `The facet rendered in EnumFacetFilter is not a FacetColumnValuesRequest`,\n          facet,\n        )\n        return undefined\n      }\n      return facetColumnRequest\n    }, [facet, nextQueryRequest.query.selectedFacets])\n\n  // Must compare the known facet values to the \"uncommitted\" current query\n  const allIsSelected = getAllIsSelected(\n    cloneDeep(nextQueryRequest) as QueryBundleRequest,\n    facet,\n  )\n\n  const columnModel = queryMetadata.columnModels\n    ? getCorrespondingColumnForFacet(facet, queryMetadata.columnModels)\n    : undefined\n\n  const isNumberColumnType = useMemo(() => {\n    switch (columnModel?.columnType) {\n      case ColumnTypeEnum.DOUBLE:\n      case ColumnTypeEnum.DATE:\n      case ColumnTypeEnum.INTEGER:\n        return true\n      default:\n        return false\n    }\n  }, [columnModel])\n\n  const userIds =\n    columnModel?.columnType === ColumnTypeEnum.USERID ||\n    columnModel?.columnType === ColumnTypeEnum.USERID_LIST\n      ? facet.facetValues.map(facet => facet.value)\n      : []\n  const userGroupHeaders = useGetInfoFromIds<UserGroupHeader>({\n    ids: userIds,\n    type: 'USER_PROFILE',\n  })\n\n  const entityIds =\n    columnModel?.columnType === ColumnTypeEnum.ENTITYID ||\n    columnModel?.columnType === ColumnTypeEnum.ENTITYID_LIST\n      ? facet.facetValues.map(facet => facet.value)\n      : []\n  const entityHeaders = useGetInfoFromIds<EntityHeader>({\n    ids: entityIds,\n    type: 'ENTITY_HEADER',\n  })\n\n  const evaluationIds =\n    columnModel?.columnType === ColumnTypeEnum.EVALUATIONID\n      ? facet.facetValues.map(facet => facet.value)\n      : []\n  const evaluations = useGetInfoFromIds<Evaluation>({\n    ids: evaluationIds,\n    type: 'EVALUATION_QUEUE',\n  })\n\n  const displayedFacetValues: RenderedFacetValue[] = useMemo(() => {\n    const renderedFacetValues = facet.facetValues.map(\n      (facetValue: FacetColumnResultValueCount): RenderedFacetValue => {\n        const displayText = valueToLabel(\n          facetValue,\n          userGroupHeaders,\n          entityHeaders,\n          evaluations,\n        )\n        return {\n          ...facetValue,\n          // Selected status should be based on the 'nextQuery', not the result data\n          // This ensures the checkboxes respond instantly to user interaction, like while waiting for multiple changes to debounce\n          isSelected:\n            currentSelectedFacet?.facetValues.includes(facetValue.value) ??\n            false,\n          displayText,\n          countText: formatFacetValueCount(\n            facetValue.count,\n            facet,\n            queryMetadata.facetPostProcessingApplied,\n          ),\n          renderedLabel: (() => {\n            const rendered = renderFacetValue?.(\n              facet.columnName,\n              facetValue.value,\n            )\n            return rendered ? (\n              <FacetValueChip\n                label={rendered.label}\n                icon={rendered.icon}\n                tooltipTitle={rendered.tooltipTitle}\n                placement=\"right\"\n                truncate\n              />\n            ) : undefined\n          })(),\n        }\n      },\n    )\n    //Abby V's suggestion, always show the VALUE_NOT_SET facet value on the bottom of this sorted list\n    const partitions = partition(\n      renderedFacetValues,\n      facet => facet.value === SynapseConstants.VALUE_NOT_SET,\n    )\n    const valueNotSetFacetArray = partitions[0]\n    const restOfFacetValuesArray = partitions[1]\n\n    // Apply client-side sorting if no server-side sort is specified\n    let sortedValues: RenderedFacetValue[] = restOfFacetValuesArray\n    const isClientSideSort = columnModel?.facetSortConfig == undefined\n    if (isClientSideSort) {\n      if (isNumberColumnType) {\n        sortedValues = sortBy(restOfFacetValuesArray, fv => Number(fv.value))\n      } else {\n        sortedValues = sortBy(restOfFacetValuesArray, fv =>\n          fv.displayText.toLowerCase(),\n        )\n      }\n    }\n\n    return [...sortedValues, ...valueNotSetFacetArray]\n  }, [\n    facet,\n    queryMetadata.facetPostProcessingApplied,\n    columnModel,\n    currentSelectedFacet?.facetValues,\n    userGroupHeaders,\n    entityHeaders,\n    evaluations,\n    isNumberColumnType,\n    renderFacetValue,\n  ])\n\n  if (!columnModel) {\n    return <></>\n  }\n\n  return (\n    <EnumFacetFilterUI\n      labelId={labelId}\n      facetTitle={getColumnDisplayName(facet.columnName, facet.jsonPath)}\n      filterIsActive={!allIsSelected}\n      facetValues={displayedFacetValues}\n      containerAs={containerAs}\n      dropdownType={dropdownType}\n      hideCollapsible={hideCollapsible}\n      defaultShowAllValues={defaultShowAllValues}\n      onHoverOverValue={() => {\n        // SWC-6698: delay the query execution (via the debounce) when an item is hovered over\n        resetDebounceTimer()\n      }}\n      onAddValueToSelection={value => {\n        addValueToSelectedFacet(\n          pick(facet, ['columnName', 'jsonPath']),\n          value,\n          { debounce: true },\n        )\n      }}\n      onRemoveValueFromSelection={value => {\n        removeValueFromSelectedFacet(\n          pick(facet, ['columnName', 'jsonPath']),\n          value,\n          { debounce: true },\n        )\n      }}\n      onRemoveAllFacetSelections={() =>\n        removeSelectedFacet(pick(facet, ['columnName', 'jsonPath']))\n      }\n      canMultiSelect={true}\n    />\n  )\n}\n\nexport function EnumFacetFilter(props: EnumFacetFilterProps) {\n  const { containerAs = 'Collapsible', dropdownType = 'Icon' } = props\n  return (\n    <Suspense\n      fallback={\n        <EnumFacetFilterSkeleton\n          containerAs={containerAs}\n          dropdownType={dropdownType}\n        />\n      }\n    >\n      <EnumFacetFilterInternal {...props} />\n    </Suspense>\n  )\n}\n"],"mappings":"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"}

package/dist/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterOption.d.ts

@@ -3,6 +3,8 @@ type EnumFacetFilterOptionProps = {
     readonly id: string;
     readonly label: ReactNode;
     readonly count?: number;
+    /** Display text for the count (e.g. a range or an approximation); defaults to the localized count. */
+    readonly countText?: string;
     readonly isDropdown: boolean;
     readonly checked: boolean;
     readonly onChange: (selected: boolean) => void;

package/dist/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterOption.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EnumFacetFilterOption.d.ts","sourceRoot":"","sources":["../../../../../src/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterOption.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,KAAK,0BAA0B,GAAG;IAChC,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,KAAK,EAAE,SAAS,CAAA;IACzB,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;IACvB,QAAQ,CAAC,UAAU,EAAE,OAAO,CAAA;IAC5B,QAAQ,CAAC,OAAO,EAAE,OAAO,CAAA;IACzB,QAAQ,CAAC,QAAQ,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAA;IAC9C,QAAQ,CAAC,OAAO,EAAE,MAAM,IAAI,CAAA;IAC5B,QAAQ,CAAC,SAAS,EAAE,UAAU,GAAG,OAAO,CAAA;CACzC,CAAA;AAED,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,0BAA0B,2CAwEtE"}
+{"version":3,"file":"EnumFacetFilterOption.d.ts","sourceRoot":"","sources":["../../../../../src/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterOption.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,KAAK,0BAA0B,GAAG;IAChC,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,KAAK,EAAE,SAAS,CAAA;IACzB,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;IACvB,sGAAsG;IACtG,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,UAAU,EAAE,OAAO,CAAA;IAC5B,QAAQ,CAAC,OAAO,EAAE,OAAO,CAAA;IACzB,QAAQ,CAAC,QAAQ,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAA;IAC9C,QAAQ,CAAC,OAAO,EAAE,MAAM,IAAI,CAAA;IAC5B,QAAQ,CAAC,SAAS,EAAE,UAAU,GAAG,OAAO,CAAA;CACzC,CAAA;AAED,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,0BAA0B,2CA0EtE"}

package/dist/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterOption.js

@@ -2,20 +2,20 @@ import { Box as e, Checkbox as t, FormControlLabel as n, Radio as r } from "@mui
 import { Fragment as i, jsx as a, jsxs as o } from "react/jsx-runtime";
 //#region src/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterOption.tsx
 function s(s) {
-	let { id: c, label: l, count: u, isDropdown: d, checked: f, onChange: p, onHover: m, inputType: h } = s;
+	let { id: c, label: l, count: u, countText: d, isDropdown: f, checked: p, onChange: m, onHover: h, inputType: g } = s, _ = a(g === "checkbox" ? t : r, {}), v = d ?? u?.toLocaleString();
 	return /* @__PURE__ */ o(e, {
 		className: "EnumFacetFilter__checkboxContainer",
 		onClick: () => {
-			d && p(!f);
+			f && m(!p);
 		},
-		onMouseEnter: m,
+		onMouseEnter: h,
 		sx: {
 			display: "flex",
 			justifyContent: "space-between",
 			alignItems: "center"
 		},
 		children: [/* @__PURE__ */ a(n, {
-			control: a(h === "checkbox" ? t : r, {}),
+			control: _,
 			className: "EnumFacetFilter__checkbox",
 			sx: {
 				overflowWrap: "anywhere",
@@ -28,11 +28,11 @@ function s(s) {
 			},
 			onClick: (e) => e.stopPropagation(),
 			onChange: (e, t) => {
-				p(t);
+				m(t);
 			},
-			checked: f,
+			checked: p,
 			label: l
-		}, `${c}`), u != null && /* @__PURE__ */ o(i, { children: [d && /* @__PURE__ */ o("span", {
+		}, `${c}`), v != null && /* @__PURE__ */ o(i, { children: [f && /* @__PURE__ */ o("span", {
 			className: "EnumFacetFilter__count",
 			style: {
 				flexShrink: 0,
@@ -40,16 +40,16 @@ function s(s) {
 			},
 			children: [
 				"(",
-				u.toLocaleString(),
+				v,
 				")"
 			]
-		}), !d && /* @__PURE__ */ a("div", {
+		}), !f && /* @__PURE__ */ a("div", {
 			className: "EnumFacetFilter__count",
 			style: {
 				flexShrink: 0,
 				marginLeft: 8
 			},
-			children: u.toLocaleString()
+			children: v
 		})] })]
 	});
 }

package/dist/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterOption.js.map

@@ -1 +1 @@
-{"version":3,"file":"EnumFacetFilterOption.js","names":[],"sources":["../../../../../src/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterOption.tsx"],"sourcesContent":["import { Box, Checkbox, FormControlLabel, Radio } from '@mui/material'\nimport { ReactNode } from 'react'\n\ntype EnumFacetFilterOptionProps = {\n  readonly id: string\n  readonly label: ReactNode\n  readonly count?: number\n  readonly isDropdown: boolean\n  readonly checked: boolean\n  readonly onChange: (selected: boolean) => void\n  readonly onHover: () => void\n  readonly inputType: 'checkbox' | 'radio'\n}\n\nexport function EnumFacetFilterOption(props: EnumFacetFilterOptionProps) {\n  const {\n    id,\n    label,\n    count,\n    isDropdown,\n    checked,\n    onChange,\n    onHover,\n    inputType,\n  } = props\n\n  const control = inputType === 'checkbox' ? <Checkbox /> : <Radio />\n\n  return (\n    <Box\n      className=\"EnumFacetFilter__checkboxContainer\"\n      onClick={() => {\n        // If this is a dropdown option, clicking anywhere in the field should toggle selection\n        if (isDropdown) {\n          onChange(!checked)\n        }\n      }}\n      onMouseEnter={onHover}\n      sx={{\n        display: 'flex',\n        justifyContent: 'space-between',\n        alignItems: 'center',\n      }}\n    >\n      <FormControlLabel\n        control={control}\n        className=\"EnumFacetFilter__checkbox\"\n        sx={{\n          overflowWrap: 'anywhere',\n          // Let the label shrink so the count stays in a consistent column\n          // (and custom node labels can truncate rather than overflow the row).\n          flex: 1,\n          minWidth: 0,\n          '& .MuiFormControlLabel-label': { minWidth: 0, overflow: 'hidden' },\n        }}\n        onClick={event => event.stopPropagation()}\n        onChange={(_event, newValue) => {\n          onChange(newValue)\n        }}\n        key={`${id}`}\n        checked={checked}\n        label={label}\n      />\n\n      {count != null && (\n        <>\n          {isDropdown && (\n            <span\n              className=\"EnumFacetFilter__count\"\n              style={{ flexShrink: 0, marginLeft: 8 }}\n            >\n              ({count.toLocaleString()})\n            </span>\n          )}\n          {!isDropdown && (\n            <div\n              className=\"EnumFacetFilter__count\"\n              style={{ flexShrink: 0, marginLeft: 8 }}\n            >\n              {count.toLocaleString()}\n            </div>\n          )}\n        </>\n      )}\n    </Box>\n  )\n}\n"],"mappings":";;;AAcA,SAAgB,EAAsB,GAAmC;CACvE,IAAM,EACJ,OACA,UACA,UACA,eACA,YACA,aACA,YACA,iBACE;CAIJ,OACE,kBAAC,GAAD;EACE,WAAU;EACV,eAAe;GAEb,AAAI,KACF,EAAS,CAAC,CAAO;EAErB;EACA,cAAc;EACd,IAAI;GACF,SAAS;GACT,gBAAgB;GAChB,YAAY;EACd;YAbF,CAeE,kBAAC,GAAD;GACW,SAnB4B,EAA3B,MAAc,aAAc,IAAe,GAAhB,CAAW,CAAY;GAoB5D,WAAU;GACV,IAAI;IACF,cAAc;IAGd,MAAM;IACN,UAAU;IACV,gCAAgC;KAAE,UAAU;KAAG,UAAU;IAAS;GACpE;GACA,UAAS,MAAS,EAAM,gBAAgB;GACxC,WAAW,GAAQ,MAAa;IAC9B,EAAS,CAAQ;GACnB;GAES;GACF;EACR,GAHM,GAAG,GAGT,GAEA,KAAS,QACR,kBAAA,GAAA,EAAA,UAAA,CACG,KACC,kBAAC,QAAD;GACE,WAAU;GACV,OAAO;IAAE,YAAY;IAAG,YAAY;GAAE;aAFxC;IAGC;IACG,EAAM,eAAe;IAAE;GACrB;MAEP,CAAC,KACA,kBAAC,OAAD;GACE,WAAU;GACV,OAAO;IAAE,YAAY;IAAG,YAAY;GAAE;aAErC,EAAM,eAAe;EACnB,CAAA,CAEP,EAAA,CAAA,CAED;;AAET"}
+{"version":3,"file":"EnumFacetFilterOption.js","names":[],"sources":["../../../../../src/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterOption.tsx"],"sourcesContent":["import { Box, Checkbox, FormControlLabel, Radio } from '@mui/material'\nimport { ReactNode } from 'react'\n\ntype EnumFacetFilterOptionProps = {\n  readonly id: string\n  readonly label: ReactNode\n  readonly count?: number\n  /** Display text for the count (e.g. a range or an approximation); defaults to the localized count. */\n  readonly countText?: string\n  readonly isDropdown: boolean\n  readonly checked: boolean\n  readonly onChange: (selected: boolean) => void\n  readonly onHover: () => void\n  readonly inputType: 'checkbox' | 'radio'\n}\n\nexport function EnumFacetFilterOption(props: EnumFacetFilterOptionProps) {\n  const {\n    id,\n    label,\n    count,\n    countText,\n    isDropdown,\n    checked,\n    onChange,\n    onHover,\n    inputType,\n  } = props\n\n  const control = inputType === 'checkbox' ? <Checkbox /> : <Radio />\n  const displayedCount = countText ?? count?.toLocaleString()\n\n  return (\n    <Box\n      className=\"EnumFacetFilter__checkboxContainer\"\n      onClick={() => {\n        // If this is a dropdown option, clicking anywhere in the field should toggle selection\n        if (isDropdown) {\n          onChange(!checked)\n        }\n      }}\n      onMouseEnter={onHover}\n      sx={{\n        display: 'flex',\n        justifyContent: 'space-between',\n        alignItems: 'center',\n      }}\n    >\n      <FormControlLabel\n        control={control}\n        className=\"EnumFacetFilter__checkbox\"\n        sx={{\n          overflowWrap: 'anywhere',\n          // Let the label shrink so the count stays in a consistent column\n          // (and custom node labels can truncate rather than overflow the row).\n          flex: 1,\n          minWidth: 0,\n          '& .MuiFormControlLabel-label': { minWidth: 0, overflow: 'hidden' },\n        }}\n        onClick={event => event.stopPropagation()}\n        onChange={(_event, newValue) => {\n          onChange(newValue)\n        }}\n        key={`${id}`}\n        checked={checked}\n        label={label}\n      />\n\n      {displayedCount != null && (\n        <>\n          {isDropdown && (\n            <span\n              className=\"EnumFacetFilter__count\"\n              style={{ flexShrink: 0, marginLeft: 8 }}\n            >\n              ({displayedCount})\n            </span>\n          )}\n          {!isDropdown && (\n            <div\n              className=\"EnumFacetFilter__count\"\n              style={{ flexShrink: 0, marginLeft: 8 }}\n            >\n              {displayedCount}\n            </div>\n          )}\n        </>\n      )}\n    </Box>\n  )\n}\n"],"mappings":";;;AAgBA,SAAgB,EAAsB,GAAmC;CACvE,IAAM,EACJ,OACA,UACA,UACA,cACA,eACA,YACA,aACA,YACA,iBACE,GAEE,IAAqC,EAA3B,MAAc,aAAc,IAAe,GAAhB,CAAW,CAAY,GAC5D,IAAiB,KAAa,GAAO,eAAe;CAE1D,OACE,kBAAC,GAAD;EACE,WAAU;EACV,eAAe;GAEb,AAAI,KACF,EAAS,CAAC,CAAO;EAErB;EACA,cAAc;EACd,IAAI;GACF,SAAS;GACT,gBAAgB;GAChB,YAAY;EACd;YAbF,CAeE,kBAAC,GAAD;GACW;GACT,WAAU;GACV,IAAI;IACF,cAAc;IAGd,MAAM;IACN,UAAU;IACV,gCAAgC;KAAE,UAAU;KAAG,UAAU;IAAS;GACpE;GACA,UAAS,MAAS,EAAM,gBAAgB;GACxC,WAAW,GAAQ,MAAa;IAC9B,EAAS,CAAQ;GACnB;GAES;GACF;EACR,GAHM,GAAG,GAGT,GAEA,KAAkB,QACjB,kBAAA,GAAA,EAAA,UAAA,CACG,KACC,kBAAC,QAAD;GACE,WAAU;GACV,OAAO;IAAE,YAAY;IAAG,YAAY;GAAE;aAFxC;IAGC;IACG;IAAe;GACb;MAEP,CAAC,KACA,kBAAC,OAAD;GACE,WAAU;GACV,OAAO;IAAE,YAAY;IAAG,YAAY;GAAE;aAErC;EACE,CAAA,CAEP,EAAA,CAAA,CAED;;AAET"}

package/dist/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterUI.d.ts

@@ -5,6 +5,7 @@ export type RenderedFacetValue<TValue = string> = Omit<SetOptional<FacetColumnRe
     value: TValue;
     displayText: string;
     renderedLabel?: ReactNode;
+    countText?: string;
 };
 export type EnumFacetFilterUIProps<TValue = string> = {
     labelId?: string;

package/dist/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterUI.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EnumFacetFilterUI.d.ts","sourceRoot":"","sources":["../../../../../src/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterUI.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,SAAS,EAA6B,MAAM,OAAO,CAAA;AAC5D,OAAO,EAAE,2BAA2B,EAAE,MAAM,iCAAiC,CAAA;AAK7E,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AAIvC,MAAM,MAAM,kBAAkB,CAAC,MAAM,GAAG,MAAM,IAAI,IAAI,CACpD,WAAW,CAAC,2BAA2B,EAAE,OAAO,CAAC,EACjD,OAAO,CACR,GAAG;IACF,KAAK,EAAE,MAAM,CAAA;IAEb,WAAW,EAAE,MAAM,CAAA;IAEnB,aAAa,CAAC,EAAE,SAAS,CAAA;CAC1B,CAAA;AAED,MAAM,MAAM,sBAAsB,CAAC,MAAM,GAAG,MAAM,IAAI;IAEpD,OAAO,CAAC,EAAE,MAAM,CAAA;IAEhB,UAAU,EAAE,MAAM,CAAA;IAElB,WAAW,EAAE,kBAAkB,CAAC,MAAM,CAAC,EAAE,CAAA;IAEzC,cAAc,EAAE,OAAO,CAAA;IAEvB,WAAW,CAAC,EAAE,aAAa,GAAG,UAAU,CAAA;IAExC,YAAY,CAAC,EAAE,MAAM,GAAG,WAAW,CAAA;IAEnC,eAAe,CAAC,EAAE,OAAO,CAAA;IAEzB,qBAAqB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAE9C,0BAA0B,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAEnD,0BAA0B,EAAE,MAAM,IAAI,CAAA;IAEtC,gBAAgB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAEzC,cAAc,EAAE,OAAO,CAAA;IAEvB,oBAAoB,CAAC,EAAE,OAAO,CAAA;CAC/B,CAAA;AAMD,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,MAAM,GAAG,MAAM,EACvD,KAAK,EAAE,sBAAsB,CAAC,MAAM,CAAC,2CAiQtC"}
+{"version":3,"file":"EnumFacetFilterUI.d.ts","sourceRoot":"","sources":["../../../../../src/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterUI.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,SAAS,EAA6B,MAAM,OAAO,CAAA;AAC5D,OAAO,EAAE,2BAA2B,EAAE,MAAM,iCAAiC,CAAA;AAK7E,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AAIvC,MAAM,MAAM,kBAAkB,CAAC,MAAM,GAAG,MAAM,IAAI,IAAI,CACpD,WAAW,CAAC,2BAA2B,EAAE,OAAO,CAAC,EACjD,OAAO,CACR,GAAG;IACF,KAAK,EAAE,MAAM,CAAA;IAEb,WAAW,EAAE,MAAM,CAAA;IAEnB,aAAa,CAAC,EAAE,SAAS,CAAA;IAEzB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAED,MAAM,MAAM,sBAAsB,CAAC,MAAM,GAAG,MAAM,IAAI;IAEpD,OAAO,CAAC,EAAE,MAAM,CAAA;IAEhB,UAAU,EAAE,MAAM,CAAA;IAElB,WAAW,EAAE,kBAAkB,CAAC,MAAM,CAAC,EAAE,CAAA;IAEzC,cAAc,EAAE,OAAO,CAAA;IAEvB,WAAW,CAAC,EAAE,aAAa,GAAG,UAAU,CAAA;IAExC,YAAY,CAAC,EAAE,MAAM,GAAG,WAAW,CAAA;IAEnC,eAAe,CAAC,EAAE,OAAO,CAAA;IAEzB,qBAAqB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAE9C,0BAA0B,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAEnD,0BAA0B,EAAE,MAAM,IAAI,CAAA;IAEtC,gBAAgB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAEzC,cAAc,EAAE,OAAO,CAAA;IAEvB,oBAAoB,CAAC,EAAE,OAAO,CAAA;CAC/B,CAAA;AAMD,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,MAAM,GAAG,MAAM,EACvD,KAAK,EAAE,sBAAsB,CAAC,MAAM,CAAC,2CAwQtC"}

package/dist/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterUI.js

@@ -89,7 +89,7 @@ function v(v) {
 			})]
 		}), /* @__PURE__ */ h("div", { children: [
 			H.map((e, t) => {
-				let { isSelected: r, displayText: i, renderedLabel: a, value: o, count: s } = e;
+				let { isSelected: r, displayText: i, renderedLabel: a, value: o, count: s, countText: c } = e;
 				return /* @__PURE__ */ m(n, {
 					id: [
 						_(D),
@@ -98,6 +98,7 @@ function v(v) {
 					].join("-"),
 					label: a ?? i,
 					count: s,
+					countText: c,
 					isDropdown: W,
 					checked: r,
 					onHover: () => {

package/dist/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterUI.js.map

@@ -1 +1 @@
-{"version":3,"file":"EnumFacetFilterUI.js","names":[],"sources":["../../../../../src/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterUI.tsx"],"sourcesContent":["import {\n  Checkbox,\n  Collapse,\n  FormControlLabel,\n  IconButton,\n  TextField,\n  Tooltip,\n} from '@mui/material'\nimport { ReactNode, useMemo, useRef, useState } from 'react'\nimport { FacetColumnResultValueCount } from '@sage-bionetworks/synapse-types'\nimport IconSvg from '../../../IconSvg/IconSvg'\nimport { FacetFilterHeader } from '../FacetFilterHeader'\nimport { EnumFacetFilterOption } from './EnumFacetFilterOption'\nimport EnumFacetFilterDropdown from './EnumFacetFilterDropdown'\nimport { SetOptional } from 'type-fest'\n\nconst MAX_ENUMERATION_VALUES_TO_SHOW = 5\n\nexport type RenderedFacetValue<TValue = string> = Omit<\n  SetOptional<FacetColumnResultValueCount, 'count'>,\n  'value'\n> & {\n  value: TValue\n  /* Text displayed for the option, and also used to filter in search */\n  displayText: string\n  /* Optional custom node to render in place of the plain-text label. */\n  renderedLabel?: ReactNode\n}\n\nexport type EnumFacetFilterUIProps<TValue = string> = {\n  /* The ID of the corresponding label, for testing and accessibility */\n  labelId?: string\n  /* The title of the faceted column to be displayed */\n  facetTitle: string\n  /* List of all facet values and information associated with each value */\n  facetValues: RenderedFacetValue<TValue>[]\n  /* Determines how the component is styled and whether the 'All' checkbox should be selected. */\n  filterIsActive: boolean // filterIsActive cannot be derived from facetValues[*].isSelected. See PORTALS-2680\n  /* The EnumFacetFilter can be rendered as a collapsible panel or a dropdown. Default is `'Collapsible'` */\n  containerAs?: 'Collapsible' | 'Dropdown'\n  /* If `containerAs` is a dropdown, the dropdown can be either an IconButton or a SelectBox. Default is `'Icon'` */\n  dropdownType?: 'Icon' | 'SelectBox'\n  /* If true, hides the button to collapse the panel (only shown if `containerAs` is 'Collapsible'). Default is false.*/\n  hideCollapsible?: boolean\n  /* Called when an unselected value is selected */\n  onAddValueToSelection: (value: TValue) => void\n  /* Called when a selected value is unselected */\n  onRemoveValueFromSelection: (value: TValue) => void\n  /* Called when all values should be unselected (e.g. 'All' is clicked) */\n  onRemoveAllFacetSelections: () => void\n  /* Called when an value is hovered over */\n  onHoverOverValue: (value: TValue) => void\n  /* Set to true if multiple values can be selected for the filter */\n  canMultiSelect: boolean\n  /* By default, all values are not shown (defaultShowAllValues = false) */\n  defaultShowAllValues?: boolean\n}\n\nfunction removeWhitespace(value: string): string {\n  return value.replace(/\\s/g, '').toLowerCase()\n}\n\nexport default function EnumFacetFilterUI<TValue = string>(\n  props: EnumFacetFilterUIProps<TValue>,\n) {\n  const {\n    labelId,\n    filterIsActive,\n    containerAs = 'Collapsible',\n    dropdownType = 'Icon',\n    hideCollapsible = false,\n    facetValues,\n    onAddValueToSelection,\n    onRemoveValueFromSelection,\n    facetTitle,\n    onRemoveAllFacetSelections,\n    onHoverOverValue,\n    canMultiSelect = true,\n    defaultShowAllValues = false,\n  } = props\n  const [toggleShowAll, setToggleShowAll] =\n    useState<boolean>(defaultShowAllValues)\n  const [isCollapsed, setIsCollapsed] = useState<boolean>(false)\n  const [showSearch, setShowSearch] = useState<boolean>(false)\n  const [searchTerm, setSearchText] = useState<string>('')\n\n  // e.g. we show a subset of facet values before hiding the rest behind \"Show More\"\n  // If the user has selected a value that would normally be hidden, always show all of the values\n  const valueIndexedGreaterThanMaxToShowIsSelected =\n    facetValues.length > MAX_ENUMERATION_VALUES_TO_SHOW &&\n    facetValues\n      .slice(MAX_ENUMERATION_VALUES_TO_SHOW)\n      .some(({ isSelected }) => isSelected)\n  const showAll =\n    containerAs === 'Dropdown' ||\n    toggleShowAll ||\n    showSearch ||\n    valueIndexedGreaterThanMaxToShowIsSelected\n\n  const facetValuesToShow = useMemo(() => {\n    if (showSearch && searchTerm.length > 0) {\n      return facetValues.filter(({ displayText }) => {\n        return (\n          displayText.toLowerCase().indexOf(searchTerm.trim().toLowerCase()) >\n          -1\n        )\n      })\n    }\n    if (showAll) {\n      return facetValues\n    }\n    return facetValues.slice(0, MAX_ENUMERATION_VALUES_TO_SHOW)\n  }, [facetValues, searchTerm, showSearch, showAll])\n\n  const textInput = useRef<HTMLInputElement>(null)\n\n  const isDropdown = containerAs === 'Dropdown'\n  const showMoreButtonIsVisible =\n    !showAll && facetValues.length > MAX_ENUMERATION_VALUES_TO_SHOW\n  const showLessButtonIsVisible =\n    showAll &&\n    !searchTerm &&\n    !valueIndexedGreaterThanMaxToShowIsSelected &&\n    facetValues.length > MAX_ENUMERATION_VALUES_TO_SHOW\n\n  const content = (\n    <div className={isDropdown ? 'EnumFacetFilter__dropdown_menu' : ''}>\n      <div className=\"EnumFacetFilter__checkboxContainer--forAll\">\n        <TextField // Search Filter Text\n          sx={{\n            display: showSearch ? undefined : 'none',\n          }}\n          size={'small'}\n          fullWidth={true}\n          slotProps={{\n            input: {\n              startAdornment: (\n                <Tooltip title={'Close search'}>\n                  <IconButton\n                    size={'small'}\n                    onClick={() => {\n                      setShowSearch(false)\n                      setToggleShowAll(defaultShowAllValues)\n                    }}\n                  >\n                    <IconSvg\n                      sx={{ fontSize: 'inherit' }}\n                      wrap={false}\n                      icon=\"arrowBack\"\n                    />\n                  </IconButton>\n                </Tooltip>\n              ),\n              endAdornment: searchTerm.length > 0 && (\n                <Tooltip title={'Clear'}>\n                  <IconButton\n                    size={'small'}\n                    onClick={() => {\n                      setSearchText('')\n                      textInput.current?.focus()\n                    }}\n                  >\n                    <IconSvg\n                      sx={{ fontSize: 'inherit' }}\n                      wrap={false}\n                      icon=\"close\"\n                    />\n                  </IconButton>\n                </Tooltip>\n              ),\n            },\n          }}\n          type=\"text\"\n          placeholder=\"Find values\"\n          value={searchTerm}\n          ref={textInput}\n          onChange={e => {\n            setSearchText(e.target.value)\n          }}\n        />\n        {!showSearch && (\n          <div className=\"EnumFacetFilter__checkAll\">\n            <FormControlLabel\n              control={<Checkbox />}\n              className=\"EnumFacetFilter__checkbox\"\n              onChange={() => {\n                if (filterIsActive) {\n                  onRemoveAllFacetSelections()\n                }\n              }}\n              key=\"select_all\"\n              checked={!filterIsActive}\n              label=\"All\"\n            />\n            <Tooltip title={'Search'}>\n              <IconButton\n                size={'small'}\n                sx={{ aspectRatio: '1 / 1' }}\n                onClick={() => {\n                  setSearchText('')\n                  setShowSearch(true)\n                  textInput.current?.focus()\n                }}\n              >\n                <IconSvg\n                  sx={{ fontSize: 'inherit' }}\n                  wrap={false}\n                  icon=\"search\"\n                />\n              </IconButton>\n            </Tooltip>\n          </div>\n        )}\n      </div>\n      <div>\n        {facetValuesToShow.map((facetValueAndCount, index: number) => {\n          const { isSelected, displayText, renderedLabel, value, count } =\n            facetValueAndCount\n\n          return (\n            <EnumFacetFilterOption\n              key={String(value)}\n              id={[\n                removeWhitespace(facetTitle),\n                removeWhitespace(String(value)),\n                index,\n              ].join('-')}\n              label={renderedLabel ?? displayText}\n              count={count}\n              isDropdown={isDropdown}\n              checked={isSelected}\n              onHover={() => {\n                onHoverOverValue(value)\n              }}\n              onChange={(newIsSelected: boolean) => {\n                if (newIsSelected) {\n                  onAddValueToSelection(value)\n                } else {\n                  onRemoveValueFromSelection(value)\n                }\n              }}\n              inputType={canMultiSelect ? 'checkbox' : 'radio'}\n            />\n          )\n        })}\n        {!isDropdown && (\n          <>\n            {showMoreButtonIsVisible && (\n              <button\n                className=\"EnumFacetFilter__showMoreFacetsBtn\"\n                onClick={() => setToggleShowAll(true)}\n              >\n                <div className=\"EnumFacetFilter__checkboxContainer\">\n                  <div className=\"EnumFacetFilter__showMoreFacetsLabel\">\n                    Show all ({facetValues.length})\n                  </div>\n                </div>\n              </button>\n            )}\n            {showLessButtonIsVisible && (\n              <button\n                className=\"EnumFacetFilter__showMoreFacetsBtn\"\n                onClick={() => setToggleShowAll(false)}\n              >\n                <div className=\"EnumFacetFilter__checkboxContainer\">\n                  <div className=\"EnumFacetFilter__showMoreFacetsLabel\">\n                    Show less\n                  </div>\n                </div>\n              </button>\n            )}\n          </>\n        )}\n        {facetValuesToShow.length <= 0 && (\n          <div className=\"EnumFacetFilter__noMatch\">No match found</div>\n        )}\n      </div>\n    </div>\n  )\n\n  const menuText = useMemo(() => {\n    if (!filterIsActive) {\n      return 'All'\n    } else if (\n      filterIsActive &&\n      facetValuesToShow.filter(item => item.isSelected).length === 1\n    ) {\n      return facetValuesToShow.filter(item => item.isSelected)[0].displayText\n    } else {\n      return 'Multiple Values Selected'\n    }\n  }, [filterIsActive, facetValuesToShow])\n\n  if (isDropdown) {\n    return (\n      <EnumFacetFilterDropdown\n        facetTitle={facetTitle}\n        dropdownType={dropdownType}\n        menuText={menuText}\n        filterIsActive={filterIsActive}\n        labelId={labelId}\n      >\n        {content}\n      </EnumFacetFilterDropdown>\n    )\n  } else {\n    return (\n      <>\n        <FacetFilterHeader\n          hideCollapsible={hideCollapsible}\n          isCollapsed={isCollapsed}\n          label={facetTitle}\n          onClick={(isCollapsed: boolean) => setIsCollapsed(isCollapsed)}\n        />\n        <Collapse className=\"EnumFacetFilter\" in={!isCollapsed}>\n          {content}\n        </Collapse>\n      </>\n    )\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"EnumFacetFilterUI.js","names":[],"sources":["../../../../../src/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterUI.tsx"],"sourcesContent":["import {\n  Checkbox,\n  Collapse,\n  FormControlLabel,\n  IconButton,\n  TextField,\n  Tooltip,\n} from '@mui/material'\nimport { ReactNode, useMemo, useRef, useState } from 'react'\nimport { FacetColumnResultValueCount } from '@sage-bionetworks/synapse-types'\nimport IconSvg from '../../../IconSvg/IconSvg'\nimport { FacetFilterHeader } from '../FacetFilterHeader'\nimport { EnumFacetFilterOption } from './EnumFacetFilterOption'\nimport EnumFacetFilterDropdown from './EnumFacetFilterDropdown'\nimport { SetOptional } from 'type-fest'\n\nconst MAX_ENUMERATION_VALUES_TO_SHOW = 5\n\nexport type RenderedFacetValue<TValue = string> = Omit<\n  SetOptional<FacetColumnResultValueCount, 'count'>,\n  'value'\n> & {\n  value: TValue\n  /* Text displayed for the option, and also used to filter in search */\n  displayText: string\n  /* Optional custom node to render in place of the plain-text label. */\n  renderedLabel?: ReactNode\n  /* Optional display text for the count (e.g. a range or an approximation); defaults to the localized count. */\n  countText?: string\n}\n\nexport type EnumFacetFilterUIProps<TValue = string> = {\n  /* The ID of the corresponding label, for testing and accessibility */\n  labelId?: string\n  /* The title of the faceted column to be displayed */\n  facetTitle: string\n  /* List of all facet values and information associated with each value */\n  facetValues: RenderedFacetValue<TValue>[]\n  /* Determines how the component is styled and whether the 'All' checkbox should be selected. */\n  filterIsActive: boolean // filterIsActive cannot be derived from facetValues[*].isSelected. See PORTALS-2680\n  /* The EnumFacetFilter can be rendered as a collapsible panel or a dropdown. Default is `'Collapsible'` */\n  containerAs?: 'Collapsible' | 'Dropdown'\n  /* If `containerAs` is a dropdown, the dropdown can be either an IconButton or a SelectBox. Default is `'Icon'` */\n  dropdownType?: 'Icon' | 'SelectBox'\n  /* If true, hides the button to collapse the panel (only shown if `containerAs` is 'Collapsible'). Default is false.*/\n  hideCollapsible?: boolean\n  /* Called when an unselected value is selected */\n  onAddValueToSelection: (value: TValue) => void\n  /* Called when a selected value is unselected */\n  onRemoveValueFromSelection: (value: TValue) => void\n  /* Called when all values should be unselected (e.g. 'All' is clicked) */\n  onRemoveAllFacetSelections: () => void\n  /* Called when an value is hovered over */\n  onHoverOverValue: (value: TValue) => void\n  /* Set to true if multiple values can be selected for the filter */\n  canMultiSelect: boolean\n  /* By default, all values are not shown (defaultShowAllValues = false) */\n  defaultShowAllValues?: boolean\n}\n\nfunction removeWhitespace(value: string): string {\n  return value.replace(/\\s/g, '').toLowerCase()\n}\n\nexport default function EnumFacetFilterUI<TValue = string>(\n  props: EnumFacetFilterUIProps<TValue>,\n) {\n  const {\n    labelId,\n    filterIsActive,\n    containerAs = 'Collapsible',\n    dropdownType = 'Icon',\n    hideCollapsible = false,\n    facetValues,\n    onAddValueToSelection,\n    onRemoveValueFromSelection,\n    facetTitle,\n    onRemoveAllFacetSelections,\n    onHoverOverValue,\n    canMultiSelect = true,\n    defaultShowAllValues = false,\n  } = props\n  const [toggleShowAll, setToggleShowAll] =\n    useState<boolean>(defaultShowAllValues)\n  const [isCollapsed, setIsCollapsed] = useState<boolean>(false)\n  const [showSearch, setShowSearch] = useState<boolean>(false)\n  const [searchTerm, setSearchText] = useState<string>('')\n\n  // e.g. we show a subset of facet values before hiding the rest behind \"Show More\"\n  // If the user has selected a value that would normally be hidden, always show all of the values\n  const valueIndexedGreaterThanMaxToShowIsSelected =\n    facetValues.length > MAX_ENUMERATION_VALUES_TO_SHOW &&\n    facetValues\n      .slice(MAX_ENUMERATION_VALUES_TO_SHOW)\n      .some(({ isSelected }) => isSelected)\n  const showAll =\n    containerAs === 'Dropdown' ||\n    toggleShowAll ||\n    showSearch ||\n    valueIndexedGreaterThanMaxToShowIsSelected\n\n  const facetValuesToShow = useMemo(() => {\n    if (showSearch && searchTerm.length > 0) {\n      return facetValues.filter(({ displayText }) => {\n        return (\n          displayText.toLowerCase().indexOf(searchTerm.trim().toLowerCase()) >\n          -1\n        )\n      })\n    }\n    if (showAll) {\n      return facetValues\n    }\n    return facetValues.slice(0, MAX_ENUMERATION_VALUES_TO_SHOW)\n  }, [facetValues, searchTerm, showSearch, showAll])\n\n  const textInput = useRef<HTMLInputElement>(null)\n\n  const isDropdown = containerAs === 'Dropdown'\n  const showMoreButtonIsVisible =\n    !showAll && facetValues.length > MAX_ENUMERATION_VALUES_TO_SHOW\n  const showLessButtonIsVisible =\n    showAll &&\n    !searchTerm &&\n    !valueIndexedGreaterThanMaxToShowIsSelected &&\n    facetValues.length > MAX_ENUMERATION_VALUES_TO_SHOW\n\n  const content = (\n    <div className={isDropdown ? 'EnumFacetFilter__dropdown_menu' : ''}>\n      <div className=\"EnumFacetFilter__checkboxContainer--forAll\">\n        <TextField // Search Filter Text\n          sx={{\n            display: showSearch ? undefined : 'none',\n          }}\n          size={'small'}\n          fullWidth={true}\n          slotProps={{\n            input: {\n              startAdornment: (\n                <Tooltip title={'Close search'}>\n                  <IconButton\n                    size={'small'}\n                    onClick={() => {\n                      setShowSearch(false)\n                      setToggleShowAll(defaultShowAllValues)\n                    }}\n                  >\n                    <IconSvg\n                      sx={{ fontSize: 'inherit' }}\n                      wrap={false}\n                      icon=\"arrowBack\"\n                    />\n                  </IconButton>\n                </Tooltip>\n              ),\n              endAdornment: searchTerm.length > 0 && (\n                <Tooltip title={'Clear'}>\n                  <IconButton\n                    size={'small'}\n                    onClick={() => {\n                      setSearchText('')\n                      textInput.current?.focus()\n                    }}\n                  >\n                    <IconSvg\n                      sx={{ fontSize: 'inherit' }}\n                      wrap={false}\n                      icon=\"close\"\n                    />\n                  </IconButton>\n                </Tooltip>\n              ),\n            },\n          }}\n          type=\"text\"\n          placeholder=\"Find values\"\n          value={searchTerm}\n          ref={textInput}\n          onChange={e => {\n            setSearchText(e.target.value)\n          }}\n        />\n        {!showSearch && (\n          <div className=\"EnumFacetFilter__checkAll\">\n            <FormControlLabel\n              control={<Checkbox />}\n              className=\"EnumFacetFilter__checkbox\"\n              onChange={() => {\n                if (filterIsActive) {\n                  onRemoveAllFacetSelections()\n                }\n              }}\n              key=\"select_all\"\n              checked={!filterIsActive}\n              label=\"All\"\n            />\n            <Tooltip title={'Search'}>\n              <IconButton\n                size={'small'}\n                sx={{ aspectRatio: '1 / 1' }}\n                onClick={() => {\n                  setSearchText('')\n                  setShowSearch(true)\n                  textInput.current?.focus()\n                }}\n              >\n                <IconSvg\n                  sx={{ fontSize: 'inherit' }}\n                  wrap={false}\n                  icon=\"search\"\n                />\n              </IconButton>\n            </Tooltip>\n          </div>\n        )}\n      </div>\n      <div>\n        {facetValuesToShow.map((facetValueAndCount, index: number) => {\n          const {\n            isSelected,\n            displayText,\n            renderedLabel,\n            value,\n            count,\n            countText,\n          } = facetValueAndCount\n\n          return (\n            <EnumFacetFilterOption\n              key={String(value)}\n              id={[\n                removeWhitespace(facetTitle),\n                removeWhitespace(String(value)),\n                index,\n              ].join('-')}\n              label={renderedLabel ?? displayText}\n              count={count}\n              countText={countText}\n              isDropdown={isDropdown}\n              checked={isSelected}\n              onHover={() => {\n                onHoverOverValue(value)\n              }}\n              onChange={(newIsSelected: boolean) => {\n                if (newIsSelected) {\n                  onAddValueToSelection(value)\n                } else {\n                  onRemoveValueFromSelection(value)\n                }\n              }}\n              inputType={canMultiSelect ? 'checkbox' : 'radio'}\n            />\n          )\n        })}\n        {!isDropdown && (\n          <>\n            {showMoreButtonIsVisible && (\n              <button\n                className=\"EnumFacetFilter__showMoreFacetsBtn\"\n                onClick={() => setToggleShowAll(true)}\n              >\n                <div className=\"EnumFacetFilter__checkboxContainer\">\n                  <div className=\"EnumFacetFilter__showMoreFacetsLabel\">\n                    Show all ({facetValues.length})\n                  </div>\n                </div>\n              </button>\n            )}\n            {showLessButtonIsVisible && (\n              <button\n                className=\"EnumFacetFilter__showMoreFacetsBtn\"\n                onClick={() => setToggleShowAll(false)}\n              >\n                <div className=\"EnumFacetFilter__checkboxContainer\">\n                  <div className=\"EnumFacetFilter__showMoreFacetsLabel\">\n                    Show less\n                  </div>\n                </div>\n              </button>\n            )}\n          </>\n        )}\n        {facetValuesToShow.length <= 0 && (\n          <div className=\"EnumFacetFilter__noMatch\">No match found</div>\n        )}\n      </div>\n    </div>\n  )\n\n  const menuText = useMemo(() => {\n    if (!filterIsActive) {\n      return 'All'\n    } else if (\n      filterIsActive &&\n      facetValuesToShow.filter(item => item.isSelected).length === 1\n    ) {\n      return facetValuesToShow.filter(item => item.isSelected)[0].displayText\n    } else {\n      return 'Multiple Values Selected'\n    }\n  }, [filterIsActive, facetValuesToShow])\n\n  if (isDropdown) {\n    return (\n      <EnumFacetFilterDropdown\n        facetTitle={facetTitle}\n        dropdownType={dropdownType}\n        menuText={menuText}\n        filterIsActive={filterIsActive}\n        labelId={labelId}\n      >\n        {content}\n      </EnumFacetFilterDropdown>\n    )\n  } else {\n    return (\n      <>\n        <FacetFilterHeader\n          hideCollapsible={hideCollapsible}\n          isCollapsed={isCollapsed}\n          label={facetTitle}\n          onClick={(isCollapsed: boolean) => setIsCollapsed(isCollapsed)}\n        />\n        <Collapse className=\"EnumFacetFilter\" in={!isCollapsed}>\n          {content}\n        </Collapse>\n      </>\n    )\n  }\n}\n"],"mappings":"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"}

package/dist/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterUtils.d.ts

@@ -1,4 +1,5 @@
-import { EntityHeader, Evaluation, FacetColumnResultValueCount, FacetColumnResultValues, QueryBundleRequest, UserGroupHeader } from '@sage-bionetworks/synapse-types';
+import { EnumerationFacet } from '@/utils/functions/enumerationFacet';
+import { EntityHeader, Evaluation, FacetColumnResultValueCount, QueryBundleRequest, UserGroupHeader } from '@sage-bionetworks/synapse-types';
 export declare function valueToLabel(facet: FacetColumnResultValueCount, profiles?: UserGroupHeader[], entityHeaders?: EntityHeader[], evaluations?: Evaluation[]): string;
 /**
  * Based on the uncommitted query, should the "All" checkbox be selected?
@@ -9,5 +10,5 @@ export declare function valueToLabel(facet: FacetColumnResultValueCount, profile
  * @param nextQueryRequest
  * @param facet
  */
-export declare function getAllIsSelected(nextQueryRequest: QueryBundleRequest, facet: FacetColumnResultValues): boolean;
+export declare function getAllIsSelected(nextQueryRequest: QueryBundleRequest, facet: EnumerationFacet): boolean;
 //# sourceMappingURL=EnumFacetFilterUtils.d.ts.map

package/dist/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterUtils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EnumFacetFilterUtils.d.ts","sourceRoot":"","sources":["../../../../../src/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterUtils.ts"],"names":[],"mappings":"AAGA,OAAO,EACL,YAAY,EACZ,UAAU,EAEV,2BAA2B,EAC3B,uBAAuB,EACvB,kBAAkB,EAClB,eAAe,EAChB,MAAM,iCAAiC,CAAA;AAExC,wBAAgB,YAAY,CAC1B,KAAK,EAAE,2BAA2B,EAClC,QAAQ,GAAE,eAAe,EAAO,EAChC,aAAa,GAAE,YAAY,EAAO,EAClC,WAAW,GAAE,UAAU,EAAO,GAC7B,MAAM,CAsBR;AAED;;;;;;;;GAQG;AACH,wBAAgB,gBAAgB,CAC9B,gBAAgB,EAAE,kBAAkB,EACpC,KAAK,EAAE,uBAAuB,WAiB/B"}
+{"version":3,"file":"EnumFacetFilterUtils.d.ts","sourceRoot":"","sources":["../../../../../src/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterUtils.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,gBAAgB,EAAE,MAAM,oCAAoC,CAAA;AACrE,OAAO,EACL,YAAY,EACZ,UAAU,EAEV,2BAA2B,EAC3B,kBAAkB,EAClB,eAAe,EAChB,MAAM,iCAAiC,CAAA;AAExC,wBAAgB,YAAY,CAC1B,KAAK,EAAE,2BAA2B,EAClC,QAAQ,GAAE,eAAe,EAAO,EAChC,aAAa,GAAE,YAAY,EAAO,EAClC,WAAW,GAAE,UAAU,EAAO,GAC7B,MAAM,CAsBR;AAED;;;;;;;;GAQG;AACH,wBAAgB,gBAAgB,CAC9B,gBAAgB,EAAE,kBAAkB,EACpC,KAAK,EAAE,gBAAgB,WAiBxB"}

package/dist/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterUtils.js.map

@@ -1 +1 @@
-{"version":3,"file":"EnumFacetFilterUtils.js","names":[],"sources":["../../../../../src/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterUtils.ts"],"sourcesContent":["import { SynapseConstants } from '@/utils'\nimport { getCorrespondingSelectedFacet } from '@/utils/functions/queryUtils'\nimport { isFacetColumnValuesRequest } from '@/utils/types/IsType'\nimport {\n  EntityHeader,\n  Evaluation,\n  FacetColumnRequest,\n  FacetColumnResultValueCount,\n  FacetColumnResultValues,\n  QueryBundleRequest,\n  UserGroupHeader,\n} from '@sage-bionetworks/synapse-types'\n\nexport function valueToLabel(\n  facet: FacetColumnResultValueCount,\n  profiles: UserGroupHeader[] = [],\n  entityHeaders: EntityHeader[] = [],\n  evaluations: Evaluation[] = [],\n): string {\n  const { value } = facet\n  let displayValue = value\n  if (value === SynapseConstants.VALUE_NOT_SET) {\n    return SynapseConstants.FRIENDLY_VALUE_NOT_SET\n  }\n  const profile = profiles.find(profile => profile.ownerId === value)\n  if (profiles.length) {\n    displayValue = profile ? profile.userName : `unknown (${value})`\n  }\n\n  const eh = entityHeaders.find(eh => eh.id === value)\n  if (entityHeaders.length) {\n    displayValue = eh ? eh.name : `unknown (${value})`\n  }\n\n  const evaluation = evaluations.find(evaluation => evaluation.id === value)\n  if (evaluation?.name) {\n    displayValue = evaluation.name\n  }\n\n  return displayValue\n}\n\n/**\n * Based on the uncommitted query, should the \"All\" checkbox be selected?\n * This only considers filters applied via selectedFacets. Filters applied via\n * sql or additionalFilters will be ignored.\n *\n * @returns true iff no values have been selected for this facet filter\n * @param nextQueryRequest\n * @param facet\n */\nexport function getAllIsSelected(\n  nextQueryRequest: QueryBundleRequest,\n  facet: FacetColumnResultValues,\n) {\n  const matchingSelectedFacet: FacetColumnRequest | undefined =\n    getCorrespondingSelectedFacet(facet, nextQueryRequest.query.selectedFacets)\n  if (!matchingSelectedFacet) {\n    return true\n  }\n\n  if (!isFacetColumnValuesRequest(matchingSelectedFacet)) {\n    console.error(\n      'getAllIsSelected: matchingSelectedFacet is not a FacetColumnValuesRequest',\n      matchingSelectedFacet,\n    )\n    return true\n  }\n\n  return matchingSelectedFacet.facetValues.length === 0\n}\n"],"mappings":";;;;;AAaA,SAAgB,EACd,GACA,IAA8B,CAAC,GAC/B,IAAgC,CAAC,GACjC,IAA4B,CAAC,GACrB;CACR,IAAM,EAAE,aAAU,GACd,IAAe;CACnB,IAAI,MAAU,6CACZ,OAAO;CAET,IAAM,IAAU,EAAS,MAAK,MAAW,EAAQ,YAAY,CAAK;CAClE,AAAI,EAAS,WACX,IAAe,IAAU,EAAQ,WAAW,YAAY,EAAM;CAGhE,IAAM,IAAK,EAAc,MAAK,MAAM,EAAG,OAAO,CAAK;CACnD,AAAI,EAAc,WAChB,IAAe,IAAK,EAAG,OAAO,YAAY,EAAM;CAGlD,IAAM,IAAa,EAAY,MAAK,MAAc,EAAW,OAAO,CAAK;CAKzE,OAJI,GAAY,SACd,IAAe,EAAW,OAGrB;AACT;AAWA,SAAgB,EACd,GACA,GACA;CACA,IAAM,IACJ,EAA8B,GAAO,EAAiB,MAAM,cAAc;CAa5E,OAZK,IAIA,EAA2B,CAAqB,IAQ9C,EAAsB,YAAY,WAAW,KAPlD,QAAQ,MACN,6EACA,CACF,GACO,MARA;AAYX"}
+{"version":3,"file":"EnumFacetFilterUtils.js","names":[],"sources":["../../../../../src/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterUtils.ts"],"sourcesContent":["import { SynapseConstants } from '@/utils'\nimport { getCorrespondingSelectedFacet } from '@/utils/functions/queryUtils'\nimport { isFacetColumnValuesRequest } from '@/utils/types/IsType'\nimport { EnumerationFacet } from '@/utils/functions/enumerationFacet'\nimport {\n  EntityHeader,\n  Evaluation,\n  FacetColumnRequest,\n  FacetColumnResultValueCount,\n  QueryBundleRequest,\n  UserGroupHeader,\n} from '@sage-bionetworks/synapse-types'\n\nexport function valueToLabel(\n  facet: FacetColumnResultValueCount,\n  profiles: UserGroupHeader[] = [],\n  entityHeaders: EntityHeader[] = [],\n  evaluations: Evaluation[] = [],\n): string {\n  const { value } = facet\n  let displayValue = value\n  if (value === SynapseConstants.VALUE_NOT_SET) {\n    return SynapseConstants.FRIENDLY_VALUE_NOT_SET\n  }\n  const profile = profiles.find(profile => profile.ownerId === value)\n  if (profiles.length) {\n    displayValue = profile ? profile.userName : `unknown (${value})`\n  }\n\n  const eh = entityHeaders.find(eh => eh.id === value)\n  if (entityHeaders.length) {\n    displayValue = eh ? eh.name : `unknown (${value})`\n  }\n\n  const evaluation = evaluations.find(evaluation => evaluation.id === value)\n  if (evaluation?.name) {\n    displayValue = evaluation.name\n  }\n\n  return displayValue\n}\n\n/**\n * Based on the uncommitted query, should the \"All\" checkbox be selected?\n * This only considers filters applied via selectedFacets. Filters applied via\n * sql or additionalFilters will be ignored.\n *\n * @returns true iff no values have been selected for this facet filter\n * @param nextQueryRequest\n * @param facet\n */\nexport function getAllIsSelected(\n  nextQueryRequest: QueryBundleRequest,\n  facet: EnumerationFacet,\n) {\n  const matchingSelectedFacet: FacetColumnRequest | undefined =\n    getCorrespondingSelectedFacet(facet, nextQueryRequest.query.selectedFacets)\n  if (!matchingSelectedFacet) {\n    return true\n  }\n\n  if (!isFacetColumnValuesRequest(matchingSelectedFacet)) {\n    console.error(\n      'getAllIsSelected: matchingSelectedFacet is not a FacetColumnValuesRequest',\n      matchingSelectedFacet,\n    )\n    return true\n  }\n\n  return matchingSelectedFacet.facetValues.length === 0\n}\n"],"mappings":";;;;;AAaA,SAAgB,EACd,GACA,IAA8B,CAAC,GAC/B,IAAgC,CAAC,GACjC,IAA4B,CAAC,GACrB;CACR,IAAM,EAAE,aAAU,GACd,IAAe;CACnB,IAAI,MAAU,6CACZ,OAAO;CAET,IAAM,IAAU,EAAS,MAAK,MAAW,EAAQ,YAAY,CAAK;CAClE,AAAI,EAAS,WACX,IAAe,IAAU,EAAQ,WAAW,YAAY,EAAM;CAGhE,IAAM,IAAK,EAAc,MAAK,MAAM,EAAG,OAAO,CAAK;CACnD,AAAI,EAAc,WAChB,IAAe,IAAK,EAAG,OAAO,YAAY,EAAM;CAGlD,IAAM,IAAa,EAAY,MAAK,MAAc,EAAW,OAAO,CAAK;CAKzE,OAJI,GAAY,SACd,IAAe,EAAW,OAGrB;AACT;AAWA,SAAgB,EACd,GACA,GACA;CACA,IAAM,IACJ,EAA8B,GAAO,EAAiB,MAAM,cAAc;CAa5E,OAZK,IAIA,EAA2B,CAAqB,IAQ9C,EAAsB,YAAY,WAAW,KAPlD,QAAQ,MACN,6EACA,CACF,GACO,MARA;AAYX"}

package/dist/components/widgets/query-filter/FacetFilterControls.d.ts

@@ -1,8 +1,9 @@
-import { FacetColumnRequest, FacetColumnResultValues, QueryBundleRequest } from '@sage-bionetworks/synapse-types';
+import { EnumerationFacet } from '@/utils/functions/enumerationFacet';
+import { FacetColumnRequest, QueryBundleRequest } from '@sage-bionetworks/synapse-types';
 export type FacetFilterControlsProps = {
     availableFacets?: string[];
     initialExpandedFacetControls?: string[];
 };
-export declare function applyChangesToValuesColumn(lastRequest: QueryBundleRequest | undefined, facet: FacetColumnResultValues, onChangeFn: (result: FacetColumnRequest[]) => void, facetName?: string, checked?: boolean): void;
+export declare function applyChangesToValuesColumn(lastRequest: QueryBundleRequest | undefined, facet: EnumerationFacet, onChangeFn: (result: FacetColumnRequest[]) => void, facetName?: string, checked?: boolean): void;
 export default function FacetFilterControlsWithSuspense(props: FacetFilterControlsProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=FacetFilterControls.d.ts.map

package/dist/components/widgets/query-filter/FacetFilterControls.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FacetFilterControls.d.ts","sourceRoot":"","sources":["../../../../src/components/widgets/query-filter/FacetFilterControls.tsx"],"names":[],"mappings":"AAKA,OAAO,EACL,kBAAkB,EAElB,uBAAuB,EAEvB,kBAAkB,EACnB,MAAM,iCAAiC,CAAA;AAgBxC,MAAM,MAAM,wBAAwB,GAAG;IAGrC,eAAe,CAAC,EAAE,MAAM,EAAE,CAAA;IAC1B,4BAA4B,CAAC,EAAE,MAAM,EAAE,CAAA;CACxC,CAAA;AAwCD,wBAAgB,0BAA0B,CACxC,WAAW,EAAE,kBAAkB,GAAG,SAAS,EAC3C,KAAK,EAAE,uBAAuB,EAC9B,UAAU,EAAE,CAAC,MAAM,EAAE,kBAAkB,EAAE,KAAK,IAAI,EAClD,SAAS,CAAC,EAAE,MAAM,EAClB,OAAO,GAAE,OAAe,QAqBzB;AAwLD,MAAM,CAAC,OAAO,UAAU,+BAA+B,CACrD,KAAK,EAAE,wBAAwB,2CAOhC"}
+{"version":3,"file":"FacetFilterControls.d.ts","sourceRoot":"","sources":["../../../../src/components/widgets/query-filter/FacetFilterControls.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,gBAAgB,EAEjB,MAAM,oCAAoC,CAAA;AAM3C,OAAO,EACL,kBAAkB,EAGlB,kBAAkB,EACnB,MAAM,iCAAiC,CAAA;AAgBxC,MAAM,MAAM,wBAAwB,GAAG;IAGrC,eAAe,CAAC,EAAE,MAAM,EAAE,CAAA;IAC1B,4BAA4B,CAAC,EAAE,MAAM,EAAE,CAAA;CACxC,CAAA;AAwCD,wBAAgB,0BAA0B,CACxC,WAAW,EAAE,kBAAkB,GAAG,SAAS,EAC3C,KAAK,EAAE,gBAAgB,EACvB,UAAU,EAAE,CAAC,MAAM,EAAE,kBAAkB,EAAE,KAAK,IAAI,EAClD,SAAS,CAAC,EAAE,MAAM,EAClB,OAAO,GAAE,OAAe,QAqBzB;AA4LD,MAAM,CAAC,OAAO,UAAU,+BAA+B,CACrD,KAAK,EAAE,wBAAwB,2CAOhC"}