synapse-react-client 4.0.18 → 4.0.20

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'\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 } = 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        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: valueToLabel(\n            facetValue,\n            userGroupHeaders,\n            entityHeaders,\n            evaluations,\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 =\n      columnModel == undefined || 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    columnModel,\n    currentSelectedFacet?.facetValues,\n    userGroupHeaders,\n    entityHeaders,\n    evaluations,\n    isNumberColumnType,\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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"}
+{"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'\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 } = 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        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: valueToLabel(\n            facetValue,\n            userGroupHeaders,\n            entityHeaders,\n            evaluations,\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 =\n      columnModel == undefined || 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    columnModel,\n    currentSelectedFacet?.facetValues,\n    userGroupHeaders,\n    entityHeaders,\n    evaluations,\n    isNumberColumnType,\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/EnumFacetFilterDropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"EnumFacetFilterDropdown.js","names":[],"sources":["../../../../../src/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterDropdown.tsx"],"sourcesContent":["import {\n  Box,\n  Fade,\n  IconButton,\n  Menu,\n  MenuItem,\n  Select,\n  Tooltip,\n} from '@mui/material'\nimport { MouseEvent, PropsWithChildren, useState } from 'react'\nimport IconSvg from '../../../IconSvg'\n\nexport type EnumFacetFilterDropdownProps = PropsWithChildren<{\n  facetTitle: string\n  menuText: string\n  filterIsActive: boolean\n  dropdownType?: 'Icon' | 'SelectBox'\n  labelId?: string\n}>\n\nfunction EnumFacetFilterSelectBox(\n  props: Omit<EnumFacetFilterDropdownProps, 'dropdownType'>,\n) {\n  const { menuText, children, labelId } = props\n\n  return (\n    <Select\n      labelId={labelId}\n      className={'EnumFacetFilter EnumFacetFilterSelect'}\n      value={menuText}\n      renderValue={() => menuText}\n      onChange={() => {\n        // noop - the children will handle change events\n      }}\n    >\n      {/* Hack to prevent Select warnings - add a hidden MenuItem */}\n      <MenuItem value={menuText} sx={{ display: 'none' }} />\n      <Box\n        sx={{\n          // expand the dropdown menu width for this component only\n          '& .EnumFacetFilter__dropdown_menu': {\n            maxWidth: '100%',\n          },\n        }}\n      >\n        {children}\n      </Box>\n    </Select>\n  )\n}\n\nfunction EnumFacetFilterIconDropdown(\n  props: Omit<EnumFacetFilterDropdownProps, 'dropdownType'>,\n) {\n  const { children, filterIsActive, facetTitle } = props\n\n  const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null)\n  const handleClickDropdownIcon = (event: MouseEvent<HTMLElement>) => {\n    setAnchorEl(event.currentTarget)\n  }\n  const handleClose = () => {\n    setAnchorEl(null)\n  }\n\n  const open = Boolean(anchorEl)\n\n  return (\n    <div className=\"EnumFacetFilter\">\n      <Tooltip title={`Filter by ${facetTitle}`}>\n        <IconButton onClick={handleClickDropdownIcon} size={'small'}>\n          <IconSvg\n            icon={'filter'}\n            wrap={false}\n            sx={{\n              color: filterIsActive ? 'primary.main' : 'grey.700',\n              fontSize: '20px',\n            }}\n          />\n        </IconButton>\n      </Tooltip>\n      <Menu\n        anchorEl={anchorEl}\n        open={open}\n        onClose={handleClose}\n        anchorOrigin={{ vertical: 'bottom', horizontal: 'left' }}\n        transformOrigin={{ vertical: 'top', horizontal: 'left' }}\n        slots={{\n          transition: Fade,\n        }}\n      >\n        {children}\n      </Menu>\n    </div>\n  )\n}\n\nexport default function EnumFacetFilterDropdown(\n  props: EnumFacetFilterDropdownProps,\n) {\n  const { dropdownType } = props\n  if (dropdownType === 'SelectBox') {\n    return <EnumFacetFilterSelectBox {...props} />\n  } else {\n    return <EnumFacetFilterIconDropdown {...props} />\n  }\n}\n"],"mappings":";;;;;AAoBA,SAAS,EACP,GACA;CACA,IAAM,EAAE,aAAU,aAAU,eAAY;AAExC,QACE,kBAAC,GAAD;EACW;EACT,WAAW;EACX,OAAO;EACP,mBAAmB;EACnB,gBAAgB;YALlB,CAUE,kBAAC,GAAD;GAAU,OAAO;GAAU,IAAI,EAAE,SAAS,QAAQ;GAAI,CAAA,EACtD,kBAAC,GAAD;GACE,IAAI,EAEF,qCAAqC,EACnC,UAAU,QACX,EACF;GAEA;GACG,CAAA,CACC;;;AAIb,SAAS,EACP,GACA;CACA,IAAM,EAAE,aAAU,mBAAgB,kBAAe,GAE3C,CAAC,GAAU,KAAe,EAA6B,KAAK,EAC5D,KAA2B,MAAmC;AAClE,IAAY,EAAM,cAAc;IAE5B,UAAoB;AACxB,IAAY,KAAK;IAGb,IAAO,EAAQ;AAErB,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,GAAD;GAAS,OAAO,aAAa;aAC3B,kBAAC,GAAD;IAAY,SAAS;IAAyB,MAAM;cAClD,kBAAC,GAAD;KACE,MAAM;KACN,MAAM;KACN,IAAI;MACF,OAAO,IAAiB,iBAAiB;MACzC,UAAU;MACX;KACD,CAAA;IACS,CAAA;GACL,CAAA,EACV,kBAAC,GAAD;GACY;GACJ;GACN,SAAS;GACT,cAAc;IAAE,UAAU;IAAU,YAAY;IAAQ;GACxD,iBAAiB;IAAE,UAAU;IAAO,YAAY;IAAQ;GACxD,OAAO,EACL,YAAY,GACb;GAEA;GACI,CAAA,CACH;;;AAIV,SAAwB,EACtB,GACA;CACA,IAAM,EAAE,oBAAiB;AAIvB,QAFO,EADL,MAAiB,cACX,IAEA,GAFD,EAA0B,GAAI,GAAS,CAEG"}
+{"version":3,"file":"EnumFacetFilterDropdown.js","names":[],"sources":["../../../../../src/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterDropdown.tsx"],"sourcesContent":["import {\n  Box,\n  Fade,\n  IconButton,\n  Menu,\n  MenuItem,\n  Select,\n  Tooltip,\n} from '@mui/material'\nimport { MouseEvent, PropsWithChildren, useState } from 'react'\nimport IconSvg from '../../../IconSvg'\n\nexport type EnumFacetFilterDropdownProps = PropsWithChildren<{\n  facetTitle: string\n  menuText: string\n  filterIsActive: boolean\n  dropdownType?: 'Icon' | 'SelectBox'\n  labelId?: string\n}>\n\nfunction EnumFacetFilterSelectBox(\n  props: Omit<EnumFacetFilterDropdownProps, 'dropdownType'>,\n) {\n  const { menuText, children, labelId } = props\n\n  return (\n    <Select\n      labelId={labelId}\n      className={'EnumFacetFilter EnumFacetFilterSelect'}\n      value={menuText}\n      renderValue={() => menuText}\n      onChange={() => {\n        // noop - the children will handle change events\n      }}\n    >\n      {/* Hack to prevent Select warnings - add a hidden MenuItem */}\n      <MenuItem value={menuText} sx={{ display: 'none' }} />\n      <Box\n        sx={{\n          // expand the dropdown menu width for this component only\n          '& .EnumFacetFilter__dropdown_menu': {\n            maxWidth: '100%',\n          },\n        }}\n      >\n        {children}\n      </Box>\n    </Select>\n  )\n}\n\nfunction EnumFacetFilterIconDropdown(\n  props: Omit<EnumFacetFilterDropdownProps, 'dropdownType'>,\n) {\n  const { children, filterIsActive, facetTitle } = props\n\n  const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null)\n  const handleClickDropdownIcon = (event: MouseEvent<HTMLElement>) => {\n    setAnchorEl(event.currentTarget)\n  }\n  const handleClose = () => {\n    setAnchorEl(null)\n  }\n\n  const open = Boolean(anchorEl)\n\n  return (\n    <div className=\"EnumFacetFilter\">\n      <Tooltip title={`Filter by ${facetTitle}`}>\n        <IconButton onClick={handleClickDropdownIcon} size={'small'}>\n          <IconSvg\n            icon={'filter'}\n            wrap={false}\n            sx={{\n              color: filterIsActive ? 'primary.main' : 'grey.700',\n              fontSize: '20px',\n            }}\n          />\n        </IconButton>\n      </Tooltip>\n      <Menu\n        anchorEl={anchorEl}\n        open={open}\n        onClose={handleClose}\n        anchorOrigin={{ vertical: 'bottom', horizontal: 'left' }}\n        transformOrigin={{ vertical: 'top', horizontal: 'left' }}\n        slots={{\n          transition: Fade,\n        }}\n      >\n        {children}\n      </Menu>\n    </div>\n  )\n}\n\nexport default function EnumFacetFilterDropdown(\n  props: EnumFacetFilterDropdownProps,\n) {\n  const { dropdownType } = props\n  if (dropdownType === 'SelectBox') {\n    return <EnumFacetFilterSelectBox {...props} />\n  } else {\n    return <EnumFacetFilterIconDropdown {...props} />\n  }\n}\n"],"mappings":";;;;;AAoBA,SAAS,EACP,GACA;CACA,IAAM,EAAE,aAAU,aAAU,eAAY;CAExC,OACE,kBAAC,GAAD;EACW;EACT,WAAW;EACX,OAAO;EACP,mBAAmB;EACnB,gBAAgB,CAEhB;YAPF,CAUE,kBAAC,GAAD;GAAU,OAAO;GAAU,IAAI,EAAE,SAAS,OAAO;EAAI,CAAA,GACrD,kBAAC,GAAD;GACE,IAAI,EAEF,qCAAqC,EACnC,UAAU,OACZ,EACF;GAEC;EACE,CAAA,CACC;;AAEZ;AAEA,SAAS,EACP,GACA;CACA,IAAM,EAAE,aAAU,mBAAgB,kBAAe,GAE3C,CAAC,GAAU,KAAe,EAA6B,IAAI,GAC3D,KAA2B,MAAmC;EAClE,EAAY,EAAM,aAAa;CACjC,GACM,UAAoB;EACxB,EAAY,IAAI;CAClB,GAEM,IAAO,EAAQ;CAErB,OACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,GAAD;GAAS,OAAO,aAAa;aAC3B,kBAAC,GAAD;IAAY,SAAS;IAAyB,MAAM;cAClD,kBAAC,GAAD;KACE,MAAM;KACN,MAAM;KACN,IAAI;MACF,OAAO,IAAiB,iBAAiB;MACzC,UAAU;KACZ;IACD,CAAA;GACS,CAAA;EACL,CAAA,GACT,kBAAC,GAAD;GACY;GACJ;GACN,SAAS;GACT,cAAc;IAAE,UAAU;IAAU,YAAY;GAAO;GACvD,iBAAiB;IAAE,UAAU;IAAO,YAAY;GAAO;GACvD,OAAO,EACL,YAAY,EACd;GAEC;EACG,CAAA,CACH;;AAET;AAEA,SAAwB,EACtB,GACA;CACA,IAAM,EAAE,oBAAiB;CAIvB,OAFO,EADL,MAAiB,cACX,IAEA,GAFD,EAA0B,GAAI,EAAQ,CAEG;AAEpD"}

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'\n\ntype EnumFacetFilterOptionProps = {\n  readonly id: string\n  readonly label: string\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        }}\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 className=\"EnumFacetFilter__count\">\n              ({count.toLocaleString()})\n            </span>\n          )}\n          {!isDropdown && (\n            <div className=\"EnumFacetFilter__count\">\n              {count.toLocaleString()}\n            </div>\n          )}\n        </>\n      )}\n    </Box>\n  )\n}\n"],"mappings":";;;AAaA,SAAgB,EAAsB,GAAmC;CACvE,IAAM,EACJ,OACA,UACA,UACA,eACA,YACA,aACA,YACA,iBACE;AAIJ,QACE,kBAAC,GAAD;EACE,WAAU;EACV,eAAe;AAEb,GAAI,KACF,EAAS,CAAC,EAAQ;;EAGtB,cAAc;EACd,IAAI;GACF,SAAS;GACT,gBAAgB;GAChB,YAAY;GACb;YAbH,CAeE,kBAAC,GAAD;GACW,SAnB4B,EAA3B,MAAc,aAAc,IAAe,GAAhB,EAAY,CAAY;GAoB7D,WAAU;GACV,IAAI,EACF,cAAc,YACf;GACD,UAAS,MAAS,EAAM,iBAAiB;GACzC,WAAW,GAAQ,MAAa;AAC9B,MAAS,EAAS;;GAGX;GACF;GACP,EAHK,GAAG,IAGR,EAED,KAAS,QACR,kBAAA,GAAA,EAAA,UAAA,CACG,KACC,kBAAC,QAAD;GAAM,WAAU;aAAhB;IAAyC;IACrC,EAAM,gBAAgB;IAAC;IACpB;MAER,CAAC,KACA,kBAAC,OAAD;GAAK,WAAU;aACZ,EAAM,gBAAgB;GACnB,CAAA,CAEP,EAAA,CAAA,CAED"}
+{"version":3,"file":"EnumFacetFilterOption.js","names":[],"sources":["../../../../../src/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterOption.tsx"],"sourcesContent":["import { Box, Checkbox, FormControlLabel, Radio } from '@mui/material'\n\ntype EnumFacetFilterOptionProps = {\n  readonly id: string\n  readonly label: string\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        }}\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 className=\"EnumFacetFilter__count\">\n              ({count.toLocaleString()})\n            </span>\n          )}\n          {!isDropdown && (\n            <div className=\"EnumFacetFilter__count\">\n              {count.toLocaleString()}\n            </div>\n          )}\n        </>\n      )}\n    </Box>\n  )\n}\n"],"mappings":";;;AAaA,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,EACF,cAAc,WAChB;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;GAAM,WAAU;aAAhB;IAAyC;IACrC,EAAM,eAAe;IAAE;GACrB;MAEP,CAAC,KACA,kBAAC,OAAD;GAAK,WAAU;aACZ,EAAM,eAAe;EACnB,CAAA,CAEP,EAAA,CAAA,CAED;;AAET"}

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

@@ -1 +1 @@
-{"version":3,"file":"EnumFacetFilterSkeleton.js","names":[],"sources":["../../../../../src/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterSkeleton.tsx"],"sourcesContent":["import { FacetFilterSkeleton } from '../FacetFilterSkeleton'\nimport { Skeleton } from '@mui/material'\nimport { EnumFacetFilterUIProps } from './EnumFacetFilterUI'\n\nexport function EnumFacetFilterSkeleton(\n  props: Pick<EnumFacetFilterUIProps, 'containerAs' | 'dropdownType'>,\n) {\n  const { containerAs = 'Collapsible', dropdownType = 'Icon' } = props\n  if (containerAs === 'Collapsible') {\n    return <FacetFilterSkeleton />\n  } else {\n    // containerAs is 'Dropdown'\n    if (dropdownType === 'Icon') {\n      return <Skeleton variant={'rectangular'} width={25} height={25} />\n    } else {\n      return <Skeleton variant={'rectangular'} width={100} height={25} />\n    }\n  }\n}\n"],"mappings":";;;;AAIA,SAAgB,EACd,GACA;CACA,IAAM,EAAE,iBAAc,eAAe,kBAAe,WAAW;AAQ3D,QAPA,MAAgB,gBACX,kBAAC,GAAD,EAAuB,CAAA,GAG1B,MAAiB,SACZ,kBAAC,GAAD;EAAU,SAAS;EAAe,OAAO;EAAI,QAAQ;EAAM,CAAA,GAE3D,kBAAC,GAAD;EAAU,SAAS;EAAe,OAAO;EAAK,QAAQ;EAAM,CAAA"}
+{"version":3,"file":"EnumFacetFilterSkeleton.js","names":[],"sources":["../../../../../src/components/widgets/query-filter/EnumFacetFilter/EnumFacetFilterSkeleton.tsx"],"sourcesContent":["import { FacetFilterSkeleton } from '../FacetFilterSkeleton'\nimport { Skeleton } from '@mui/material'\nimport { EnumFacetFilterUIProps } from './EnumFacetFilterUI'\n\nexport function EnumFacetFilterSkeleton(\n  props: Pick<EnumFacetFilterUIProps, 'containerAs' | 'dropdownType'>,\n) {\n  const { containerAs = 'Collapsible', dropdownType = 'Icon' } = props\n  if (containerAs === 'Collapsible') {\n    return <FacetFilterSkeleton />\n  } else {\n    // containerAs is 'Dropdown'\n    if (dropdownType === 'Icon') {\n      return <Skeleton variant={'rectangular'} width={25} height={25} />\n    } else {\n      return <Skeleton variant={'rectangular'} width={100} height={25} />\n    }\n  }\n}\n"],"mappings":";;;;AAIA,SAAgB,EACd,GACA;CACA,IAAM,EAAE,iBAAc,eAAe,kBAAe,WAAW;CAQ3D,OAPA,MAAgB,gBACX,kBAAC,GAAD,CAAsB,CAAA,IAGzB,MAAiB,SACZ,kBAAC,GAAD;EAAU,SAAS;EAAe,OAAO;EAAI,QAAQ;CAAK,CAAA,IAE1D,kBAAC,GAAD;EAAU,SAAS;EAAe,OAAO;EAAK,QAAQ;CAAK,CAAA;AAGxE"}

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 { 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}\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, value, count } = 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={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 { 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}\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, value, count } = 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={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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"}

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,EAAE,EAChC,IAAgC,EAAE,EAClC,IAA4B,EAAE,EACtB;CACR,IAAM,EAAE,aAAU,GACd,IAAe;AACnB,KAAI,MAAU,4CACZ,QAAO;CAET,IAAM,IAAU,EAAS,MAAK,MAAW,EAAQ,YAAY,EAAM;AACnE,CAAI,EAAS,WACX,IAAe,IAAU,EAAQ,WAAW,YAAY,EAAM;CAGhE,IAAM,IAAK,EAAc,MAAK,MAAM,EAAG,OAAO,EAAM;AACpD,CAAI,EAAc,WAChB,IAAe,IAAK,EAAG,OAAO,YAAY,EAAM;CAGlD,IAAM,IAAa,EAAY,MAAK,MAAc,EAAW,OAAO,EAAM;AAK1E,QAJI,GAAY,SACd,IAAe,EAAW,OAGrB;;AAYT,SAAgB,EACd,GACA,GACA;CACA,IAAM,IACJ,EAA8B,GAAO,EAAiB,MAAM,eAAe;AAa7E,QAZK,IAIA,EAA2B,EAAsB,GAQ/C,EAAsB,YAAY,WAAW,KAPlD,QAAQ,MACN,6EACA,EACD,EACM,MARA"}
+{"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"FacetChip.js","names":[],"sources":["../../../../src/components/widgets/query-filter/FacetChip.tsx"],"sourcesContent":["import { PropsWithChildren } from 'react'\nimport IconSvg from '../../IconSvg/IconSvg'\n\nexport type FacetChipProps = PropsWithChildren<{\n  isChecked: boolean\n  onClick: () => void\n}>\n\nexport function FacetChip(props: FacetChipProps) {\n  const { isChecked, onClick, children } = props\n  return (\n    <button className={`Chip ${isChecked ? 'Checked' : ''}`} onClick={onClick}>\n      {children}\n      <IconSvg\n        icon={isChecked ? 'check' : 'add'}\n        sx={{\n          width: '14px',\n          paddingLeft: '0.2rem',\n        }}\n      ></IconSvg>\n    </button>\n  )\n}\n"],"mappings":";;;AAQA,SAAgB,EAAU,GAAuB;CAC/C,IAAM,EAAE,cAAW,YAAS,gBAAa;AACzC,QACE,kBAAC,UAAD;EAAQ,WAAW,QAAQ,IAAY,YAAY;EAAe;YAAlE,CACG,GACD,kBAAC,GAAD;GACE,MAAM,IAAY,UAAU;GAC5B,IAAI;IACF,OAAO;IACP,aAAa;IACd;GACQ,CAAA,CACJ"}
+{"version":3,"file":"FacetChip.js","names":[],"sources":["../../../../src/components/widgets/query-filter/FacetChip.tsx"],"sourcesContent":["import { PropsWithChildren } from 'react'\nimport IconSvg from '../../IconSvg/IconSvg'\n\nexport type FacetChipProps = PropsWithChildren<{\n  isChecked: boolean\n  onClick: () => void\n}>\n\nexport function FacetChip(props: FacetChipProps) {\n  const { isChecked, onClick, children } = props\n  return (\n    <button className={`Chip ${isChecked ? 'Checked' : ''}`} onClick={onClick}>\n      {children}\n      <IconSvg\n        icon={isChecked ? 'check' : 'add'}\n        sx={{\n          width: '14px',\n          paddingLeft: '0.2rem',\n        }}\n      ></IconSvg>\n    </button>\n  )\n}\n"],"mappings":";;;AAQA,SAAgB,EAAU,GAAuB;CAC/C,IAAM,EAAE,cAAW,YAAS,gBAAa;CACzC,OACE,kBAAC,UAAD;EAAQ,WAAW,QAAQ,IAAY,YAAY;EAAe;YAAlE,CACG,GACD,kBAAC,GAAD;GACE,MAAM,IAAY,UAAU;GAC5B,IAAI;IACF,OAAO;IACP,aAAa;GACf;EACQ,CAAA,CACJ;;AAEZ"}

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

@@ -1 +1 @@
-{"version":3,"file":"FacetFilterControls.js","names":[],"sources":["../../../../src/components/widgets/query-filter/FacetFilterControls.tsx"],"sourcesContent":["import {\n  facetObjectMatchesDefinition,\n  getCorrespondingColumnForFacet,\n  isSingleNotSetValue,\n} from '@/utils/functions/queryUtils'\nimport {\n  FacetColumnRequest,\n  FacetColumnResultRange,\n  FacetColumnResultValues,\n  FacetColumnValuesRequest,\n  QueryBundleRequest,\n} from '@sage-bionetworks/synapse-types'\nimport { groupBy, noop, sortBy, union } from 'lodash-es'\nimport { Suspense, useCallback, useMemo, useState } from 'react'\nimport { useDeepCompareEffectNoCheck } from 'use-deep-compare-effect'\nimport { useQueryContext } from '../../QueryContext'\nimport { useQueryVisualizationContext } from '../../QueryVisualizationWrapper'\nimport { useSuspenseGetQueryMetadata } from '../../QueryWrapper/useGetQueryMetadata'\nimport { CombinedRangeFacetFilter } from './CombinedRangeFacetFilter'\nimport { EnumFacetFilter } from './EnumFacetFilter/EnumFacetFilter'\nimport { FacetChip } from './FacetChip'\nimport { FacetFilterHeader } from './FacetFilterHeader'\nimport { FacetFilterControlsSkeleton } from './FacetFilterSkeleton'\nimport { getDefaultShownFacetFilters } from './FacetFilterUtils'\nimport JsonColumnFacetFilters from './JsonColumnFacetFilters'\nimport { RangeFacetFilter } from './RangeFacetFilter'\n\nexport type FacetFilterControlsProps = {\n  /* The set of faceted column names that should be shown in the Facet controls. If undefined, all faceted columns with\n    at least one non-null value will be shown. */\n  availableFacets?: string[]\n  initialExpandedFacetControls?: string[]\n}\n\nconst convertFacetToFacetColumnValuesRequest = (\n  facet: FacetColumnResultValues,\n): FacetColumnValuesRequest => ({\n  concreteType: 'org.sagebionetworks.repo.model.table.FacetColumnValuesRequest',\n  columnName: facet.columnName,\n  facetValues: facet.facetValues\n    .filter(facet => facet.isSelected)\n    .map(facet => facet.value),\n})\n\nconst patchRequestFacets = (\n  changedFacet: FacetColumnRequest,\n  selections: FacetColumnRequest[] = [],\n): FacetColumnRequest[] => {\n  const changedFacetIndex = selections.findIndex(facet =>\n    facetObjectMatchesDefinition(facet, changedFacet),\n  )\n  const isEmptyValuesFacet =\n    changedFacet.concreteType ===\n      'org.sagebionetworks.repo.model.table.FacetColumnValuesRequest' &&\n    (!changedFacet.facetValues || !changedFacet.facetValues.length)\n  const isEmptyRangesFacet =\n    changedFacet.concreteType ===\n      'org.sagebionetworks.repo.model.table.FacetColumnRangeRequest' &&\n    (!changedFacet.min || !changedFacet.max)\n\n  if (changedFacetIndex > -1) {\n    if (isEmptyValuesFacet || isEmptyRangesFacet) {\n      selections.splice(changedFacetIndex, 1)\n    } else {\n      selections[changedFacetIndex] = changedFacet\n    }\n  } else {\n    selections.push(changedFacet)\n  }\n  return selections\n}\n\nexport function applyChangesToValuesColumn(\n  lastRequest: QueryBundleRequest | undefined,\n  facet: FacetColumnResultValues,\n  onChangeFn: (result: FacetColumnRequest[]) => void,\n  facetName?: string,\n  checked: boolean = false,\n) {\n  if (facetName) {\n    facet.facetValues.forEach(facetValue => {\n      if (facetValue.value === facetName) {\n        facetValue.isSelected = checked\n      }\n    })\n  } else {\n    // else clear all\n    facet.facetValues.forEach(facet => {\n      facet.isSelected = false\n    })\n  }\n\n  const changedFacet = convertFacetToFacetColumnValuesRequest(facet)\n  const result = patchRequestFacets(\n    changedFacet,\n    lastRequest?.query?.selectedFacets,\n  )\n  onChangeFn(result)\n}\n\nfunction FacetFilterControls(props: FacetFilterControlsProps) {\n  const { availableFacets, initialExpandedFacetControls } = props\n  const { getCurrentQueryRequest, combineRangeFacetConfig } = useQueryContext()\n  const { getColumnDisplayName } = useQueryVisualizationContext()\n  const lastRequest = useMemo(\n    () => getCurrentQueryRequest(),\n    [getCurrentQueryRequest],\n  )\n  const { data: queryMetadata } = useSuspenseGetQueryMetadata()\n\n  const facets = queryMetadata\n    .facets!.filter(\n      facet =>\n        // If availableFacets is configured, remove those that don't match.\n        availableFacets == null || availableFacets.includes(facet.columnName),\n    )\n    // Don't include json subcolumn facets, those will be handled separately\n    .filter(facet => facet.jsonPath == null)\n    .filter(\n      facet =>\n        // Don't show facets if included in the combine range facet config, handled separately\n        combineRangeFacetConfig == null ||\n        (combineRangeFacetConfig.maxFacetColumn !== facet.columnName &&\n          combineRangeFacetConfig.minFacetColumn !== facet.columnName),\n    )\n    .filter(\n      facet =>\n        // Don't show facets where there are no values\n        !isSingleNotSetValue(facet),\n    )\n\n  const combinedRangeFacets = combineRangeFacetConfig\n    ? queryMetadata.facets!.filter(\n        facet =>\n          combineRangeFacetConfig.maxFacetColumn === facet.columnName ||\n          combineRangeFacetConfig.minFacetColumn === facet.columnName,\n      )\n    : []\n\n  // Group JSON facets by column name, so they can be grouped in the UI under their parent column name\n  const jsonFacetsGroupedByColumn = groupBy(\n    queryMetadata.facets!.filter(f => !!f.jsonPath),\n    'columnName',\n  )\n\n  const allFacetColumns: string[] = useMemo(() => {\n    const allFacetColumns: string[] = []\n    facets.forEach(facet => allFacetColumns.push(facet.columnName))\n    if (combineRangeFacetConfig) {\n      allFacetColumns.push(combineRangeFacetConfig.label)\n    }\n    if (jsonFacetsGroupedByColumn) {\n      Object.keys(jsonFacetsGroupedByColumn).forEach(jsonColumn =>\n        allFacetColumns.push(jsonColumn),\n      )\n    }\n    return allFacetColumns\n  }, [combineRangeFacetConfig, facets, jsonFacetsGroupedByColumn])\n\n  // Controls which facet columns are shown/hidden by clicking on chips. NOTE: One column may have multiple facets (e.g. JSON subcolumn facets)\n  const [facetColumnsShown, setFacetColumnsShown] = useState<Set<string>>(\n    getDefaultShownFacetFilters(\n      allFacetColumns,\n      lastRequest.query.selectedFacets,\n    ),\n  )\n\n  /**\n   * When the data facets change, reset the initially-selected chips\n   */\n  useDeepCompareEffectNoCheck(() => {\n    // Select the first three facet columns, plus any columns where a facet is already filtered,\n    // (PORTALS-3513) plus the initially expanded filters and any filters that the user explicitly expanded\n    const expandedFacets = union(\n      initialExpandedFacetControls ?? [],\n      Array.from(facetColumnsShown),\n    )\n    setFacetColumnsShown(\n      getDefaultShownFacetFilters(\n        allFacetColumns,\n        lastRequest.query.selectedFacets,\n        expandedFacets,\n      ),\n    )\n  }, [facets])\n\n  const columnModels = queryMetadata.columnModels\n\n  const toggleShowFacetFilter = useCallback(\n    (facetColumnName: string) => {\n      const newFacetColumnsShown = new Set(facetColumnsShown)\n      if (newFacetColumnsShown.has(facetColumnName)) {\n        newFacetColumnsShown.delete(facetColumnName)\n      } else {\n        newFacetColumnsShown.add(facetColumnName)\n      }\n      setFacetColumnsShown(newFacetColumnsShown)\n    },\n    [facetColumnsShown],\n  )\n  const combinedRangeFacetsColumnModelType = combineRangeFacetConfig\n    ? columnModels?.find(\n        model => model.name === combineRangeFacetConfig.minFacetColumn,\n      )?.columnType\n    : undefined\n\n  const shownTopLevelFacets = useMemo(\n    () =>\n      (facets ?? []).filter(facet => facetColumnsShown.has(facet.columnName)),\n    [facetColumnsShown, facets],\n  )\n\n  const shownJsonFacetGroups = useMemo(\n    () =>\n      Object.entries(jsonFacetsGroupedByColumn).filter(([columnName]) =>\n        facetColumnsShown.has(columnName),\n      ),\n    [facetColumnsShown, jsonFacetsGroupedByColumn],\n  )\n\n  return (\n    <div className={`FacetFilterControls`}>\n      <div>\n        <FacetFilterHeader\n          label={'Available Filters'}\n          hideCollapsible\n          isCollapsed={false}\n          onClick={noop}\n        />\n        {sortBy(allFacetColumns).map(columnName => {\n          return (\n            <FacetChip\n              key={columnName}\n              onClick={() => toggleShowFacetFilter(columnName)}\n              isChecked={facetColumnsShown.has(columnName)}\n            >\n              {getColumnDisplayName(columnName)}\n            </FacetChip>\n          )\n        })}\n      </div>\n      {combineRangeFacetConfig && combinedRangeFacets.length >= 2 && (\n        <CombinedRangeFacetFilter\n          facetResults={combinedRangeFacets as FacetColumnResultRange[]}\n          label={combineRangeFacetConfig.label}\n          columnType={combinedRangeFacetsColumnModelType!}\n        />\n      )}\n      {shownTopLevelFacets.map(facet => {\n        const columnModel = getCorrespondingColumnForFacet(\n          facet,\n          columnModels ?? [],\n        )\n        return (\n          <div className=\"FacetFilterControls__facet\" key={facet.columnName}>\n            {facet.facetType === 'enumeration' && columnModel && (\n              <EnumFacetFilter containerAs=\"Collapsible\" facet={facet} />\n            )}\n            {facet.facetType === 'range' && columnModel && (\n              <RangeFacetFilter facetResult={facet} />\n            )}\n          </div>\n        )\n      })}\n      {shownJsonFacetGroups.map(([columnName, facets]) => {\n        const columnModel = queryMetadata?.columnModels?.find(\n          cm => cm.name === columnName,\n        )\n        return (\n          columnModel && (\n            <JsonColumnFacetFilters\n              key={columnName}\n              columnModel={columnModel}\n              facets={facets}\n            />\n          )\n        )\n      })}\n    </div>\n  )\n}\n\nexport default function FacetFilterControlsWithSuspense(\n  props: FacetFilterControlsProps,\n) {\n  return (\n    <Suspense fallback={<FacetFilterControlsSkeleton />}>\n      <FacetFilterControls {...props} />\n    </Suspense>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"FacetFilterControls.js","names":[],"sources":["../../../../src/components/widgets/query-filter/FacetFilterControls.tsx"],"sourcesContent":["import {\n  facetObjectMatchesDefinition,\n  getCorrespondingColumnForFacet,\n  isSingleNotSetValue,\n} from '@/utils/functions/queryUtils'\nimport {\n  FacetColumnRequest,\n  FacetColumnResultRange,\n  FacetColumnResultValues,\n  FacetColumnValuesRequest,\n  QueryBundleRequest,\n} from '@sage-bionetworks/synapse-types'\nimport { groupBy, noop, sortBy, union } from 'lodash-es'\nimport { Suspense, useCallback, useMemo, useState } from 'react'\nimport { useDeepCompareEffectNoCheck } from 'use-deep-compare-effect'\nimport { useQueryContext } from '../../QueryContext'\nimport { useQueryVisualizationContext } from '../../QueryVisualizationWrapper'\nimport { useSuspenseGetQueryMetadata } from '../../QueryWrapper/useGetQueryMetadata'\nimport { CombinedRangeFacetFilter } from './CombinedRangeFacetFilter'\nimport { EnumFacetFilter } from './EnumFacetFilter/EnumFacetFilter'\nimport { FacetChip } from './FacetChip'\nimport { FacetFilterHeader } from './FacetFilterHeader'\nimport { FacetFilterControlsSkeleton } from './FacetFilterSkeleton'\nimport { getDefaultShownFacetFilters } from './FacetFilterUtils'\nimport JsonColumnFacetFilters from './JsonColumnFacetFilters'\nimport { RangeFacetFilter } from './RangeFacetFilter'\n\nexport type FacetFilterControlsProps = {\n  /* The set of faceted column names that should be shown in the Facet controls. If undefined, all faceted columns with\n    at least one non-null value will be shown. */\n  availableFacets?: string[]\n  initialExpandedFacetControls?: string[]\n}\n\nconst convertFacetToFacetColumnValuesRequest = (\n  facet: FacetColumnResultValues,\n): FacetColumnValuesRequest => ({\n  concreteType: 'org.sagebionetworks.repo.model.table.FacetColumnValuesRequest',\n  columnName: facet.columnName,\n  facetValues: facet.facetValues\n    .filter(facet => facet.isSelected)\n    .map(facet => facet.value),\n})\n\nconst patchRequestFacets = (\n  changedFacet: FacetColumnRequest,\n  selections: FacetColumnRequest[] = [],\n): FacetColumnRequest[] => {\n  const changedFacetIndex = selections.findIndex(facet =>\n    facetObjectMatchesDefinition(facet, changedFacet),\n  )\n  const isEmptyValuesFacet =\n    changedFacet.concreteType ===\n      'org.sagebionetworks.repo.model.table.FacetColumnValuesRequest' &&\n    (!changedFacet.facetValues || !changedFacet.facetValues.length)\n  const isEmptyRangesFacet =\n    changedFacet.concreteType ===\n      'org.sagebionetworks.repo.model.table.FacetColumnRangeRequest' &&\n    (!changedFacet.min || !changedFacet.max)\n\n  if (changedFacetIndex > -1) {\n    if (isEmptyValuesFacet || isEmptyRangesFacet) {\n      selections.splice(changedFacetIndex, 1)\n    } else {\n      selections[changedFacetIndex] = changedFacet\n    }\n  } else {\n    selections.push(changedFacet)\n  }\n  return selections\n}\n\nexport function applyChangesToValuesColumn(\n  lastRequest: QueryBundleRequest | undefined,\n  facet: FacetColumnResultValues,\n  onChangeFn: (result: FacetColumnRequest[]) => void,\n  facetName?: string,\n  checked: boolean = false,\n) {\n  if (facetName) {\n    facet.facetValues.forEach(facetValue => {\n      if (facetValue.value === facetName) {\n        facetValue.isSelected = checked\n      }\n    })\n  } else {\n    // else clear all\n    facet.facetValues.forEach(facet => {\n      facet.isSelected = false\n    })\n  }\n\n  const changedFacet = convertFacetToFacetColumnValuesRequest(facet)\n  const result = patchRequestFacets(\n    changedFacet,\n    lastRequest?.query?.selectedFacets,\n  )\n  onChangeFn(result)\n}\n\nfunction FacetFilterControls(props: FacetFilterControlsProps) {\n  const { availableFacets, initialExpandedFacetControls } = props\n  const { getCurrentQueryRequest, combineRangeFacetConfig } = useQueryContext()\n  const { getColumnDisplayName } = useQueryVisualizationContext()\n  const lastRequest = useMemo(\n    () => getCurrentQueryRequest(),\n    [getCurrentQueryRequest],\n  )\n  const { data: queryMetadata } = useSuspenseGetQueryMetadata()\n\n  const facets = queryMetadata\n    .facets!.filter(\n      facet =>\n        // If availableFacets is configured, remove those that don't match.\n        availableFacets == null || availableFacets.includes(facet.columnName),\n    )\n    // Don't include json subcolumn facets, those will be handled separately\n    .filter(facet => facet.jsonPath == null)\n    .filter(\n      facet =>\n        // Don't show facets if included in the combine range facet config, handled separately\n        combineRangeFacetConfig == null ||\n        (combineRangeFacetConfig.maxFacetColumn !== facet.columnName &&\n          combineRangeFacetConfig.minFacetColumn !== facet.columnName),\n    )\n    .filter(\n      facet =>\n        // Don't show facets where there are no values\n        !isSingleNotSetValue(facet),\n    )\n\n  const combinedRangeFacets = combineRangeFacetConfig\n    ? queryMetadata.facets!.filter(\n        facet =>\n          combineRangeFacetConfig.maxFacetColumn === facet.columnName ||\n          combineRangeFacetConfig.minFacetColumn === facet.columnName,\n      )\n    : []\n\n  // Group JSON facets by column name, so they can be grouped in the UI under their parent column name\n  const jsonFacetsGroupedByColumn = groupBy(\n    queryMetadata.facets!.filter(f => !!f.jsonPath),\n    'columnName',\n  )\n\n  const allFacetColumns: string[] = useMemo(() => {\n    const allFacetColumns: string[] = []\n    facets.forEach(facet => allFacetColumns.push(facet.columnName))\n    if (combineRangeFacetConfig) {\n      allFacetColumns.push(combineRangeFacetConfig.label)\n    }\n    if (jsonFacetsGroupedByColumn) {\n      Object.keys(jsonFacetsGroupedByColumn).forEach(jsonColumn =>\n        allFacetColumns.push(jsonColumn),\n      )\n    }\n    return allFacetColumns\n  }, [combineRangeFacetConfig, facets, jsonFacetsGroupedByColumn])\n\n  // Controls which facet columns are shown/hidden by clicking on chips. NOTE: One column may have multiple facets (e.g. JSON subcolumn facets)\n  const [facetColumnsShown, setFacetColumnsShown] = useState<Set<string>>(\n    getDefaultShownFacetFilters(\n      allFacetColumns,\n      lastRequest.query.selectedFacets,\n    ),\n  )\n\n  /**\n   * When the data facets change, reset the initially-selected chips\n   */\n  useDeepCompareEffectNoCheck(() => {\n    // Select the first three facet columns, plus any columns where a facet is already filtered,\n    // (PORTALS-3513) plus the initially expanded filters and any filters that the user explicitly expanded\n    const expandedFacets = union(\n      initialExpandedFacetControls ?? [],\n      Array.from(facetColumnsShown),\n    )\n    setFacetColumnsShown(\n      getDefaultShownFacetFilters(\n        allFacetColumns,\n        lastRequest.query.selectedFacets,\n        expandedFacets,\n      ),\n    )\n  }, [facets])\n\n  const columnModels = queryMetadata.columnModels\n\n  const toggleShowFacetFilter = useCallback(\n    (facetColumnName: string) => {\n      const newFacetColumnsShown = new Set(facetColumnsShown)\n      if (newFacetColumnsShown.has(facetColumnName)) {\n        newFacetColumnsShown.delete(facetColumnName)\n      } else {\n        newFacetColumnsShown.add(facetColumnName)\n      }\n      setFacetColumnsShown(newFacetColumnsShown)\n    },\n    [facetColumnsShown],\n  )\n  const combinedRangeFacetsColumnModelType = combineRangeFacetConfig\n    ? columnModels?.find(\n        model => model.name === combineRangeFacetConfig.minFacetColumn,\n      )?.columnType\n    : undefined\n\n  const shownTopLevelFacets = useMemo(\n    () =>\n      (facets ?? []).filter(facet => facetColumnsShown.has(facet.columnName)),\n    [facetColumnsShown, facets],\n  )\n\n  const shownJsonFacetGroups = useMemo(\n    () =>\n      Object.entries(jsonFacetsGroupedByColumn).filter(([columnName]) =>\n        facetColumnsShown.has(columnName),\n      ),\n    [facetColumnsShown, jsonFacetsGroupedByColumn],\n  )\n\n  return (\n    <div className={`FacetFilterControls`}>\n      <div>\n        <FacetFilterHeader\n          label={'Available Filters'}\n          hideCollapsible\n          isCollapsed={false}\n          onClick={noop}\n        />\n        {sortBy(allFacetColumns).map(columnName => {\n          return (\n            <FacetChip\n              key={columnName}\n              onClick={() => toggleShowFacetFilter(columnName)}\n              isChecked={facetColumnsShown.has(columnName)}\n            >\n              {getColumnDisplayName(columnName)}\n            </FacetChip>\n          )\n        })}\n      </div>\n      {combineRangeFacetConfig && combinedRangeFacets.length >= 2 && (\n        <CombinedRangeFacetFilter\n          facetResults={combinedRangeFacets as FacetColumnResultRange[]}\n          label={combineRangeFacetConfig.label}\n          columnType={combinedRangeFacetsColumnModelType!}\n        />\n      )}\n      {shownTopLevelFacets.map(facet => {\n        const columnModel = getCorrespondingColumnForFacet(\n          facet,\n          columnModels ?? [],\n        )\n        return (\n          <div className=\"FacetFilterControls__facet\" key={facet.columnName}>\n            {facet.facetType === 'enumeration' && columnModel && (\n              <EnumFacetFilter containerAs=\"Collapsible\" facet={facet} />\n            )}\n            {facet.facetType === 'range' && columnModel && (\n              <RangeFacetFilter facetResult={facet} />\n            )}\n          </div>\n        )\n      })}\n      {shownJsonFacetGroups.map(([columnName, facets]) => {\n        const columnModel = queryMetadata?.columnModels?.find(\n          cm => cm.name === columnName,\n        )\n        return (\n          columnModel && (\n            <JsonColumnFacetFilters\n              key={columnName}\n              columnModel={columnModel}\n              facets={facets}\n            />\n          )\n        )\n      })}\n    </div>\n  )\n}\n\nexport default function FacetFilterControlsWithSuspense(\n  props: FacetFilterControlsProps,\n) {\n  return (\n    <Suspense fallback={<FacetFilterControlsSkeleton />}>\n      <FacetFilterControls {...props} />\n    </Suspense>\n  )\n}\n"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"FacetFilterHeader.js","names":[],"sources":["../../../../src/components/widgets/query-filter/FacetFilterHeader.tsx"],"sourcesContent":["import IconMinus from '@/assets/icons/IconMinus'\nimport IconPlus from '@/assets/icons/IconPlus'\nimport { IconButton } from '@mui/material'\n\nexport type FacetFilterHeaderProps = {\n  label: string\n  hideCollapsible?: boolean\n  isCollapsed: boolean\n  onClick: (newValue: boolean) => void\n}\n\nexport function FacetFilterHeader(props: FacetFilterHeaderProps) {\n  const { label, isCollapsed, onClick, hideCollapsible = false } = props\n  return (\n    <div className=\"FacetFilterHeader\">\n      <label className=\"FacetFilterHeader__label\">{label}</label>\n      {!hideCollapsible && (\n        <IconButton\n          size={'small'}\n          className=\"FacetFilterHeader__collapseToggleBtn\"\n          onClick={() => onClick(!isCollapsed)}\n        >\n          {isCollapsed ? (\n            <IconPlus className=\"icon-plus\" title=\"Expand Menu\" />\n          ) : (\n            <IconMinus className=\"icon-minus\" title=\"Collapse Menu\" />\n          )}\n        </IconButton>\n      )}\n    </div>\n  )\n}\n"],"mappings":";;;;;AAWA,SAAgB,EAAkB,GAA+B;CAC/D,IAAM,EAAE,UAAO,gBAAa,YAAS,qBAAkB,OAAU;AACjE,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,SAAD;GAAO,WAAU;aAA4B;GAAc,CAAA,EAC1D,CAAC,KACA,kBAAC,GAAD;GACE,MAAM;GACN,WAAU;GACV,eAAe,EAAQ,CAAC,EAAY;aAEnC,IACC,kBAAC,GAAD;IAAU,WAAU;IAAY,OAAM;IAAgB,CAAA,GAEtD,kBAAC,GAAD;IAAW,WAAU;IAAa,OAAM;IAAkB,CAAA;GAEjD,CAAA,CAEX"}
+{"version":3,"file":"FacetFilterHeader.js","names":[],"sources":["../../../../src/components/widgets/query-filter/FacetFilterHeader.tsx"],"sourcesContent":["import IconMinus from '@/assets/icons/IconMinus'\nimport IconPlus from '@/assets/icons/IconPlus'\nimport { IconButton } from '@mui/material'\n\nexport type FacetFilterHeaderProps = {\n  label: string\n  hideCollapsible?: boolean\n  isCollapsed: boolean\n  onClick: (newValue: boolean) => void\n}\n\nexport function FacetFilterHeader(props: FacetFilterHeaderProps) {\n  const { label, isCollapsed, onClick, hideCollapsible = false } = props\n  return (\n    <div className=\"FacetFilterHeader\">\n      <label className=\"FacetFilterHeader__label\">{label}</label>\n      {!hideCollapsible && (\n        <IconButton\n          size={'small'}\n          className=\"FacetFilterHeader__collapseToggleBtn\"\n          onClick={() => onClick(!isCollapsed)}\n        >\n          {isCollapsed ? (\n            <IconPlus className=\"icon-plus\" title=\"Expand Menu\" />\n          ) : (\n            <IconMinus className=\"icon-minus\" title=\"Collapse Menu\" />\n          )}\n        </IconButton>\n      )}\n    </div>\n  )\n}\n"],"mappings":";;;;;AAWA,SAAgB,EAAkB,GAA+B;CAC/D,IAAM,EAAE,UAAO,gBAAa,YAAS,qBAAkB,OAAU;CACjE,OACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,SAAD;GAAO,WAAU;aAA4B;EAAa,CAAA,GACzD,CAAC,KACA,kBAAC,GAAD;GACE,MAAM;GACN,WAAU;GACV,eAAe,EAAQ,CAAC,CAAW;aAElC,IACC,kBAAC,GAAD;IAAU,WAAU;IAAY,OAAM;GAAe,CAAA,IAErD,kBAAC,GAAD;IAAW,WAAU;IAAa,OAAM;GAAiB,CAAA;EAEjD,CAAA,CAEX;;AAET"}

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

@@ -1 +1 @@
-{"version":3,"file":"FacetFilterSkeleton.js","names":[],"sources":["../../../../src/components/widgets/query-filter/FacetFilterSkeleton.tsx"],"sourcesContent":["import { Box, Skeleton, Stack } from '@mui/material'\n\nexport function FacetFilterSkeleton() {\n  const facetFilterFormRow = (\n    <Stack\n      direction={'row'}\n      sx={{\n        gap: '10px',\n        my: 1,\n      }}\n    >\n      <Skeleton width={'15px'} />\n      <Skeleton width={'40%'} />\n    </Stack>\n  )\n  return (\n    <Box className={'FacetFilterControls__facet'}>\n      <Box className={'FacetFilterHeader'}>\n        <Skeleton width={'100%'} />\n      </Box>\n      <Box>\n        {facetFilterFormRow}\n        {facetFilterFormRow}\n        {facetFilterFormRow}\n      </Box>\n    </Box>\n  )\n}\n\nexport function FacetFilterControlsSkeleton() {\n  return (\n    <div className={`FacetFilterControls`}>\n      <FacetFilterSkeleton />\n      <FacetFilterSkeleton />\n      <FacetFilterSkeleton />\n      <FacetFilterSkeleton />\n    </div>\n  )\n}\n"],"mappings":";;;AAEA,SAAgB,IAAsB;CACpC,IAAM,IACJ,kBAAC,GAAD;EACE,WAAW;EACX,IAAI;GACF,KAAK;GACL,IAAI;GACL;YALH,CAOE,kBAAC,GAAD,EAAU,OAAO,QAAU,CAAA,EAC3B,kBAAC,GAAD,EAAU,OAAO,OAAS,CAAA,CACpB;;AAEV,QACE,kBAAC,GAAD;EAAK,WAAW;YAAhB,CACE,kBAAC,GAAD;GAAK,WAAW;aACd,kBAAC,GAAD,EAAU,OAAO,QAAU,CAAA;GACvB,CAAA,EACN,kBAAC,GAAD,EAAA,UAAA;GACG;GACA;GACA;GACG,EAAA,CAAA,CACF;;;AAIV,SAAgB,IAA8B;AAC5C,QACE,kBAAC,OAAD;EAAK,WAAW;YAAhB;GACE,kBAAC,GAAD,EAAuB,CAAA;GACvB,kBAAC,GAAD,EAAuB,CAAA;GACvB,kBAAC,GAAD,EAAuB,CAAA;GACvB,kBAAC,GAAD,EAAuB,CAAA;GACnB"}
+{"version":3,"file":"FacetFilterSkeleton.js","names":[],"sources":["../../../../src/components/widgets/query-filter/FacetFilterSkeleton.tsx"],"sourcesContent":["import { Box, Skeleton, Stack } from '@mui/material'\n\nexport function FacetFilterSkeleton() {\n  const facetFilterFormRow = (\n    <Stack\n      direction={'row'}\n      sx={{\n        gap: '10px',\n        my: 1,\n      }}\n    >\n      <Skeleton width={'15px'} />\n      <Skeleton width={'40%'} />\n    </Stack>\n  )\n  return (\n    <Box className={'FacetFilterControls__facet'}>\n      <Box className={'FacetFilterHeader'}>\n        <Skeleton width={'100%'} />\n      </Box>\n      <Box>\n        {facetFilterFormRow}\n        {facetFilterFormRow}\n        {facetFilterFormRow}\n      </Box>\n    </Box>\n  )\n}\n\nexport function FacetFilterControlsSkeleton() {\n  return (\n    <div className={`FacetFilterControls`}>\n      <FacetFilterSkeleton />\n      <FacetFilterSkeleton />\n      <FacetFilterSkeleton />\n      <FacetFilterSkeleton />\n    </div>\n  )\n}\n"],"mappings":";;;AAEA,SAAgB,IAAsB;CACpC,IAAM,IACJ,kBAAC,GAAD;EACE,WAAW;EACX,IAAI;GACF,KAAK;GACL,IAAI;EACN;YALF,CAOE,kBAAC,GAAD,EAAU,OAAO,OAAS,CAAA,GAC1B,kBAAC,GAAD,EAAU,OAAO,MAAQ,CAAA,CACpB;;CAET,OACE,kBAAC,GAAD;EAAK,WAAW;YAAhB,CACE,kBAAC,GAAD;GAAK,WAAW;aACd,kBAAC,GAAD,EAAU,OAAO,OAAS,CAAA;EACvB,CAAA,GACL,kBAAC,GAAD,EAAA,UAAA;GACG;GACA;GACA;EACE,EAAA,CAAA,CACF;;AAET;AAEA,SAAgB,IAA8B;CAC5C,OACE,kBAAC,OAAD;EAAK,WAAW;YAAhB;GACE,kBAAC,GAAD,CAAsB,CAAA;GACtB,kBAAC,GAAD,CAAsB,CAAA;GACtB,kBAAC,GAAD,CAAsB,CAAA;GACtB,kBAAC,GAAD,CAAsB,CAAA;EACnB;;AAET"}

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

@@ -1 +1 @@
-{"version":3,"file":"FacetFilterUtils.js","names":[],"sources":["../../../../src/components/widgets/query-filter/FacetFilterUtils.ts"],"sourcesContent":["import { FacetColumnRequest } from '@sage-bionetworks/synapse-types'\n\n/**\n * Determines which facet filters should be shown after loading a new bundle. The shown facets will be the first\n * three available facets, plus any other facets that have a filter applied.\n * @param facetColumns\n * @param selectedFacets\n * @returns the columnNames of the facets that should be shown.\n */\nexport function getDefaultShownFacetFilters(\n  facetColumns: string[],\n  selectedFacets?: FacetColumnRequest[],\n  initialExpandedFacetControls?: string[],\n): Set<string> {\n  const columnsWithExistingFilters = (selectedFacets ?? []).map(\n    fcr => fcr.columnName,\n  )\n  if (initialExpandedFacetControls == undefined) {\n    return new Set([...facetColumns.slice(0, 3), ...columnsWithExistingFilters])\n  } else {\n    //  initialExpandedFacetControls is set, use it\n    const initialExpandedFacetControlsSet = new Set(\n      initialExpandedFacetControls,\n    )\n    const availableInitialExpandedFacetControls = facetColumns.filter(\n      columnName => initialExpandedFacetControlsSet.has(columnName),\n    )\n    const fillerExpandedFacetControls =\n      availableInitialExpandedFacetControls.length < 3\n        ? facetColumns.slice(0, 3)\n        : []\n    return new Set([\n      ...fillerExpandedFacetControls,\n      ...availableInitialExpandedFacetControls,\n      ...columnsWithExistingFilters,\n    ])\n  }\n}\n"],"mappings":";AASA,SAAgB,EACd,GACA,GACA,GACa;CACb,IAAM,KAA8B,KAAkB,EAAE,EAAE,KACxD,MAAO,EAAI,WACZ;AACD,KAAI,KAAgC,KAClC,QAAO,IAAI,IAAI,CAAC,GAAG,EAAa,MAAM,GAAG,EAAE,EAAE,GAAG,EAA2B,CAAC;CACvE;EAEL,IAAM,IAAkC,IAAI,IAC1C,EACD,EACK,IAAwC,EAAa,QACzD,MAAc,EAAgC,IAAI,EAAW,CAC9D,EACK,IACJ,EAAsC,SAAS,IAC3C,EAAa,MAAM,GAAG,EAAE,GACxB,EAAE;AACR,SAAO,IAAI,IAAI;GACb,GAAG;GACH,GAAG;GACH,GAAG;GACJ,CAAC"}
+{"version":3,"file":"FacetFilterUtils.js","names":[],"sources":["../../../../src/components/widgets/query-filter/FacetFilterUtils.ts"],"sourcesContent":["import { FacetColumnRequest } from '@sage-bionetworks/synapse-types'\n\n/**\n * Determines which facet filters should be shown after loading a new bundle. The shown facets will be the first\n * three available facets, plus any other facets that have a filter applied.\n * @param facetColumns\n * @param selectedFacets\n * @returns the columnNames of the facets that should be shown.\n */\nexport function getDefaultShownFacetFilters(\n  facetColumns: string[],\n  selectedFacets?: FacetColumnRequest[],\n  initialExpandedFacetControls?: string[],\n): Set<string> {\n  const columnsWithExistingFilters = (selectedFacets ?? []).map(\n    fcr => fcr.columnName,\n  )\n  if (initialExpandedFacetControls == undefined) {\n    return new Set([...facetColumns.slice(0, 3), ...columnsWithExistingFilters])\n  } else {\n    //  initialExpandedFacetControls is set, use it\n    const initialExpandedFacetControlsSet = new Set(\n      initialExpandedFacetControls,\n    )\n    const availableInitialExpandedFacetControls = facetColumns.filter(\n      columnName => initialExpandedFacetControlsSet.has(columnName),\n    )\n    const fillerExpandedFacetControls =\n      availableInitialExpandedFacetControls.length < 3\n        ? facetColumns.slice(0, 3)\n        : []\n    return new Set([\n      ...fillerExpandedFacetControls,\n      ...availableInitialExpandedFacetControls,\n      ...columnsWithExistingFilters,\n    ])\n  }\n}\n"],"mappings":";AASA,SAAgB,EACd,GACA,GACA,GACa;CACb,IAAM,KAA8B,KAAkB,CAAC,GAAG,KACxD,MAAO,EAAI,UACb;CACA,IAAI,KAAgC,MAClC,OAAO,IAAI,IAAI,CAAC,GAAG,EAAa,MAAM,GAAG,CAAC,GAAG,GAAG,CAA0B,CAAC;CACtE;EAEL,IAAM,IAAkC,IAAI,IAC1C,CACF,GACM,IAAwC,EAAa,QACzD,MAAc,EAAgC,IAAI,CAAU,CAC9D,GACM,IACJ,EAAsC,SAAS,IAC3C,EAAa,MAAM,GAAG,CAAC,IACvB,CAAC;EACP,OAAO,IAAI,IAAI;GACb,GAAG;GACH,GAAG;GACH,GAAG;EACL,CAAC;CACH;AACF"}

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

@@ -1 +1 @@
-{"version":3,"file":"JsonColumnFacetFilters.js","names":[],"sources":["../../../../src/components/widgets/query-filter/JsonColumnFacetFilters.tsx"],"sourcesContent":["import { getCorrespondingColumnForFacet } from '@/utils/functions/queryUtils'\nimport { Box, Collapse } from '@mui/material'\nimport { ColumnModel, FacetColumnResult } from '@sage-bionetworks/synapse-types'\nimport { useState } from 'react'\nimport { useQueryVisualizationContext } from '../../QueryVisualizationWrapper'\nimport { useSuspenseGetQueryMetadata } from '../../QueryWrapper/useGetQueryMetadata'\nimport { EnumFacetFilter } from './EnumFacetFilter/EnumFacetFilter'\nimport { FacetFilterHeader } from './FacetFilterHeader'\nimport { RangeFacetFilter } from './RangeFacetFilter'\n\nexport type JsonColumnFacetFiltersProps = {\n  /* The parent ColumnModel that contains the JSON Subcolumns to show in this panel */\n  columnModel: ColumnModel\n  /* The set of JSON Subcolumn FacetColumnResults that will be shown in this panel */\n  facets: FacetColumnResult[]\n}\n\n/**\n * Renders a set of facet filters that are all derived from the same JSON Column.\n * @param props\n * @constructor\n */\nexport default function JsonColumnFacetFilters(\n  props: JsonColumnFacetFiltersProps,\n) {\n  const { columnModel, facets } = props\n  const { getColumnDisplayName } = useQueryVisualizationContext()\n\n  const { data: queryMetadata } = useSuspenseGetQueryMetadata()\n\n  const [isCollapsed, setIsCollapsed] = useState<boolean>(false)\n\n  if (queryMetadata.columnModels == undefined) {\n    return <></>\n  }\n  if (!columnModel.jsonSubColumns) {\n    console.warn('Supplied column model has no jsonSubColumns')\n    return <></>\n  }\n  return (\n    <Box className={'FacetFilterControls__facet'}>\n      <FacetFilterHeader\n        label={getColumnDisplayName(columnModel.name)}\n        isCollapsed={isCollapsed}\n        onClick={(isCollapsed: boolean) => setIsCollapsed(isCollapsed)}\n      />\n      <Collapse className=\"JsonColumnFacetFilters\" in={!isCollapsed}>\n        <Box sx={{ my: 2 }}>\n          {facets.map(jsonSubcolumnFacet => {\n            const jsonSubColumnModel = getCorrespondingColumnForFacet(\n              jsonSubcolumnFacet,\n              queryMetadata.columnModels!,\n            )\n            return (\n              <Box\n                className=\"FacetFilterControls__facet\"\n                key={jsonSubcolumnFacet.jsonPath}\n                sx={{\n                  my: 1.5,\n                  backgroundColor: 'grey.100',\n                  p: 2.5,\n                  '.FacetFilterHeader': {\n                    borderBottom: 'none',\n                  },\n                }}\n              >\n                {jsonSubcolumnFacet.facetType === 'enumeration' &&\n                  jsonSubColumnModel && (\n                    <EnumFacetFilter\n                      containerAs=\"Collapsible\"\n                      facet={jsonSubcolumnFacet}\n                      hideCollapsible={true}\n                    />\n                  )}\n                {jsonSubcolumnFacet.facetType === 'range' &&\n                  jsonSubColumnModel && (\n                    <RangeFacetFilter\n                      facetResult={jsonSubcolumnFacet}\n                      hideCollapsible={true}\n                    />\n                  )}\n              </Box>\n            )\n          })}\n        </Box>\n      </Collapse>\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;;;;;AAsBA,SAAwB,EACtB,GACA;CACA,IAAM,EAAE,gBAAa,cAAW,GAC1B,EAAE,4BAAyB,GAA8B,EAEzD,EAAE,MAAM,MAAkB,GAA6B,EAEvD,CAAC,GAAa,KAAkB,EAAkB,GAAM;AAS9D,QAPI,EAAc,gBAAgB,OACzB,kBAAA,GAAA,EAAK,CAAA,GAET,EAAY,iBAKf,kBAAC,GAAD;EAAK,WAAW;YAAhB,CACE,kBAAC,GAAD;GACE,OAAO,EAAqB,EAAY,KAAK;GAChC;GACb,UAAU,MAAyB,EAAe,EAAY;GAC9D,CAAA,EACF,kBAAC,GAAD;GAAU,WAAU;GAAyB,IAAI,CAAC;aAChD,kBAAC,GAAD;IAAK,IAAI,EAAE,IAAI,GAAG;cACf,EAAO,KAAI,MAAsB;KAChC,IAAM,IAAqB,EACzB,GACA,EAAc,aACf;AACD,YACE,kBAAC,GAAD;MACE,WAAU;MAEV,IAAI;OACF,IAAI;OACJ,iBAAiB;OACjB,GAAG;OACH,sBAAsB,EACpB,cAAc,QACf;OACF;gBAVH,CAYG,EAAmB,cAAc,iBAChC,KACE,kBAAC,GAAD;OACE,aAAY;OACZ,OAAO;OACP,iBAAiB;OACjB,CAAA,EAEL,EAAmB,cAAc,WAChC,KACE,kBAAC,GAAD;OACE,aAAa;OACb,iBAAiB;OACjB,CAAA,CAEF;QAzBC,EAAmB,SAyBpB;MAER;IACE,CAAA;GACG,CAAA,CACP;OAlDN,QAAQ,KAAK,8CAA8C,EACpD,kBAAA,GAAA,EAAK,CAAA"}
+{"version":3,"file":"JsonColumnFacetFilters.js","names":[],"sources":["../../../../src/components/widgets/query-filter/JsonColumnFacetFilters.tsx"],"sourcesContent":["import { getCorrespondingColumnForFacet } from '@/utils/functions/queryUtils'\nimport { Box, Collapse } from '@mui/material'\nimport { ColumnModel, FacetColumnResult } from '@sage-bionetworks/synapse-types'\nimport { useState } from 'react'\nimport { useQueryVisualizationContext } from '../../QueryVisualizationWrapper'\nimport { useSuspenseGetQueryMetadata } from '../../QueryWrapper/useGetQueryMetadata'\nimport { EnumFacetFilter } from './EnumFacetFilter/EnumFacetFilter'\nimport { FacetFilterHeader } from './FacetFilterHeader'\nimport { RangeFacetFilter } from './RangeFacetFilter'\n\nexport type JsonColumnFacetFiltersProps = {\n  /* The parent ColumnModel that contains the JSON Subcolumns to show in this panel */\n  columnModel: ColumnModel\n  /* The set of JSON Subcolumn FacetColumnResults that will be shown in this panel */\n  facets: FacetColumnResult[]\n}\n\n/**\n * Renders a set of facet filters that are all derived from the same JSON Column.\n * @param props\n * @constructor\n */\nexport default function JsonColumnFacetFilters(\n  props: JsonColumnFacetFiltersProps,\n) {\n  const { columnModel, facets } = props\n  const { getColumnDisplayName } = useQueryVisualizationContext()\n\n  const { data: queryMetadata } = useSuspenseGetQueryMetadata()\n\n  const [isCollapsed, setIsCollapsed] = useState<boolean>(false)\n\n  if (queryMetadata.columnModels == undefined) {\n    return <></>\n  }\n  if (!columnModel.jsonSubColumns) {\n    console.warn('Supplied column model has no jsonSubColumns')\n    return <></>\n  }\n  return (\n    <Box className={'FacetFilterControls__facet'}>\n      <FacetFilterHeader\n        label={getColumnDisplayName(columnModel.name)}\n        isCollapsed={isCollapsed}\n        onClick={(isCollapsed: boolean) => setIsCollapsed(isCollapsed)}\n      />\n      <Collapse className=\"JsonColumnFacetFilters\" in={!isCollapsed}>\n        <Box sx={{ my: 2 }}>\n          {facets.map(jsonSubcolumnFacet => {\n            const jsonSubColumnModel = getCorrespondingColumnForFacet(\n              jsonSubcolumnFacet,\n              queryMetadata.columnModels!,\n            )\n            return (\n              <Box\n                className=\"FacetFilterControls__facet\"\n                key={jsonSubcolumnFacet.jsonPath}\n                sx={{\n                  my: 1.5,\n                  backgroundColor: 'grey.100',\n                  p: 2.5,\n                  '.FacetFilterHeader': {\n                    borderBottom: 'none',\n                  },\n                }}\n              >\n                {jsonSubcolumnFacet.facetType === 'enumeration' &&\n                  jsonSubColumnModel && (\n                    <EnumFacetFilter\n                      containerAs=\"Collapsible\"\n                      facet={jsonSubcolumnFacet}\n                      hideCollapsible={true}\n                    />\n                  )}\n                {jsonSubcolumnFacet.facetType === 'range' &&\n                  jsonSubColumnModel && (\n                    <RangeFacetFilter\n                      facetResult={jsonSubcolumnFacet}\n                      hideCollapsible={true}\n                    />\n                  )}\n              </Box>\n            )\n          })}\n        </Box>\n      </Collapse>\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;;;;;AAsBA,SAAwB,EACtB,GACA;CACA,IAAM,EAAE,gBAAa,cAAW,GAC1B,EAAE,4BAAyB,EAA6B,GAExD,EAAE,MAAM,MAAkB,EAA4B,GAEtD,CAAC,GAAa,KAAkB,EAAkB,EAAK;CAS7D,OAPI,EAAc,gBAAgB,OACzB,kBAAA,GAAA,CAAI,CAAA,IAER,EAAY,iBAKf,kBAAC,GAAD;EAAK,WAAW;YAAhB,CACE,kBAAC,GAAD;GACE,OAAO,EAAqB,EAAY,IAAI;GAC/B;GACb,UAAU,MAAyB,EAAe,CAAW;EAC9D,CAAA,GACD,kBAAC,GAAD;GAAU,WAAU;GAAyB,IAAI,CAAC;aAChD,kBAAC,GAAD;IAAK,IAAI,EAAE,IAAI,EAAE;cACd,EAAO,KAAI,MAAsB;KAChC,IAAM,IAAqB,EACzB,GACA,EAAc,YAChB;KACA,OACE,kBAAC,GAAD;MACE,WAAU;MAEV,IAAI;OACF,IAAI;OACJ,iBAAiB;OACjB,GAAG;OACH,sBAAsB,EACpB,cAAc,OAChB;MACF;gBAVF,CAYG,EAAmB,cAAc,iBAChC,KACE,kBAAC,GAAD;OACE,aAAY;OACZ,OAAO;OACP,iBAAiB;MAClB,CAAA,GAEJ,EAAmB,cAAc,WAChC,KACE,kBAAC,GAAD;OACE,aAAa;OACb,iBAAiB;MAClB,CAAA,CAEF;QAzBE,EAAmB,QAyBrB;IAET,CAAC;GACE,CAAA;EACG,CAAA,CACP;OAlDL,QAAQ,KAAK,6CAA6C,GACnD,kBAAA,GAAA,CAAI,CAAA;AAmDf"}

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

@@ -15,15 +15,15 @@ var d = /* @__PURE__ */ function(e) {
 }({}), f = [
 	{
 		label: e,
-		value: d.NOT_SET
+		value: "org.sagebionetworks.UNDEFINED_NULL_NOTSET"
 	},
 	{
 		label: "Any",
-		value: d.ANY
+		value: ""
 	},
 	{
 		label: "Range",
-		value: d.RANGE
+		value: "RANGE"
 	}
 ];
 function p(e) {

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

@@ -1 +1 @@
-{"version":3,"file":"RangeFacetFilter.js","names":[],"sources":["../../../../src/components/widgets/query-filter/RangeFacetFilter.tsx"],"sourcesContent":["import { getCorrespondingColumnForFacet } from '@/utils/functions/queryUtils'\nimport { FRIENDLY_VALUE_NOT_SET, VALUE_NOT_SET } from '@/utils/SynapseConstants'\nimport { FacetColumnResultRange } from '@sage-bionetworks/synapse-types'\nimport { isNumber } from 'lodash-es'\nimport { useMemo } from 'react'\nimport { useQueryContext } from '../../QueryContext'\nimport { useQueryVisualizationContext } from '../../QueryVisualizationWrapper'\nimport { useSuspenseGetQueryMetadata } from '../../QueryWrapper/useGetQueryMetadata'\nimport { RangeValues } from '../Range'\nimport { RangeFacetFilterUI } from './RangeFacetFilterUI'\n\nexport enum RadioValuesEnum {\n  NOT_SET = 'org.sagebionetworks.UNDEFINED_NULL_NOTSET',\n  RANGE = 'RANGE',\n  ANY = '',\n}\nexport const options = [\n  { label: FRIENDLY_VALUE_NOT_SET, value: RadioValuesEnum.NOT_SET },\n  { label: 'Any', value: RadioValuesEnum.ANY },\n  { label: 'Range', value: RadioValuesEnum.RANGE },\n]\nexport type RangeFacetFilterProps = {\n  facetResult: FacetColumnResultRange\n  hideCollapsible?: boolean\n}\n\nexport function RangeFacetFilter(props: RangeFacetFilterProps) {\n  const { facetResult, hideCollapsible = false } = props\n  const { setRangeFacetValue, removeSelectedFacet, getCurrentQueryRequest } =\n    useQueryContext()\n\n  const { data: queryMetadata } = useSuspenseGetQueryMetadata()\n\n  const columnModel = queryMetadata.columnModels\n    ? getCorrespondingColumnForFacet(facetResult, queryMetadata.columnModels)\n    : undefined\n\n  const { getColumnDisplayName } = useQueryVisualizationContext()\n\n  const lastQueryRequest = useMemo(\n    () => getCurrentQueryRequest(),\n    [getCurrentQueryRequest],\n  )\n\n  if (!columnModel) {\n    return <></>\n  }\n\n  return (\n    <RangeFacetFilterUI\n      label={getColumnDisplayName(facetResult.columnName, facetResult.jsonPath)}\n      facetResult={facetResult}\n      columnType={columnModel.columnType}\n      hideCollapsible={hideCollapsible}\n      onRangeValueSelected={(values: RangeValues) => {\n        setRangeFacetValue(\n          facetResult,\n          isNumber(values.min) ? String(values.min) : values.min,\n          isNumber(values.max) ? String(values.max) : values.max,\n        )\n      }}\n      onNotSetSelected={() => {\n        setRangeFacetValue(facetResult, VALUE_NOT_SET, VALUE_NOT_SET)\n      }}\n      onAnySelected={() => {\n        const selectedFacet = lastQueryRequest.query.selectedFacets?.find(\n          selectedFacet =>\n            selectedFacet.columnName === facetResult.columnName &&\n            selectedFacet.jsonPath === facetResult.jsonPath,\n        )\n        if (selectedFacet) {\n          removeSelectedFacet(selectedFacet)\n        }\n      }}\n    />\n  )\n}\n"],"mappings":";;;;;;;;;;;;AAWA,IAAY,IAAL,yBAAA,GAAA;QACL,EAAA,UAAU,6CACV,EAAA,QAAQ,SACR,EAAA,MAAM;KACP,EACY,IAAU;CACrB;EAAE,OAAO;EAAwB,OAAO,EAAgB;EAAS;CACjE;EAAE,OAAO;EAAO,OAAO,EAAgB;EAAK;CAC5C;EAAE,OAAO;EAAS,OAAO,EAAgB;EAAO;CACjD;AAMD,SAAgB,EAAiB,GAA8B;CAC7D,IAAM,EAAE,gBAAa,qBAAkB,OAAU,GAC3C,EAAE,uBAAoB,wBAAqB,8BAC/C,GAAiB,EAEb,EAAE,MAAM,MAAkB,GAA6B,EAEvD,IAAc,EAAc,eAC9B,EAA+B,GAAa,EAAc,aAAa,GACvE,KAAA,GAEE,EAAE,4BAAyB,GAA8B,EAEzD,IAAmB,QACjB,GAAwB,EAC9B,CAAC,EAAuB,CACzB;AAMD,QAJK,IAKH,kBAAC,GAAD;EACE,OAAO,EAAqB,EAAY,YAAY,EAAY,SAAS;EAC5D;EACb,YAAY,EAAY;EACP;EACjB,uBAAuB,MAAwB;AAC7C,KACE,GACA,EAAS,EAAO,IAAI,GAAG,OAAO,EAAO,IAAI,GAAG,EAAO,KACnD,EAAS,EAAO,IAAI,GAAG,OAAO,EAAO,IAAI,GAAG,EAAO,IACpD;;EAEH,wBAAwB;AACtB,KAAmB,GAAa,GAAe,EAAc;;EAE/D,qBAAqB;GACnB,IAAM,IAAgB,EAAiB,MAAM,gBAAgB,MAC3D,MACE,EAAc,eAAe,EAAY,cACzC,EAAc,aAAa,EAAY,SAC1C;AACD,GAAI,KACF,EAAoB,EAAc;;EAGtC,CAAA,GA7BK,kBAAA,GAAA,EAAK,CAAA"}
+{"version":3,"file":"RangeFacetFilter.js","names":[],"sources":["../../../../src/components/widgets/query-filter/RangeFacetFilter.tsx"],"sourcesContent":["import { getCorrespondingColumnForFacet } from '@/utils/functions/queryUtils'\nimport { FRIENDLY_VALUE_NOT_SET, VALUE_NOT_SET } from '@/utils/SynapseConstants'\nimport { FacetColumnResultRange } from '@sage-bionetworks/synapse-types'\nimport { isNumber } from 'lodash-es'\nimport { useMemo } from 'react'\nimport { useQueryContext } from '../../QueryContext'\nimport { useQueryVisualizationContext } from '../../QueryVisualizationWrapper'\nimport { useSuspenseGetQueryMetadata } from '../../QueryWrapper/useGetQueryMetadata'\nimport { RangeValues } from '../Range'\nimport { RangeFacetFilterUI } from './RangeFacetFilterUI'\n\nexport enum RadioValuesEnum {\n  NOT_SET = 'org.sagebionetworks.UNDEFINED_NULL_NOTSET',\n  RANGE = 'RANGE',\n  ANY = '',\n}\nexport const options = [\n  { label: FRIENDLY_VALUE_NOT_SET, value: RadioValuesEnum.NOT_SET },\n  { label: 'Any', value: RadioValuesEnum.ANY },\n  { label: 'Range', value: RadioValuesEnum.RANGE },\n]\nexport type RangeFacetFilterProps = {\n  facetResult: FacetColumnResultRange\n  hideCollapsible?: boolean\n}\n\nexport function RangeFacetFilter(props: RangeFacetFilterProps) {\n  const { facetResult, hideCollapsible = false } = props\n  const { setRangeFacetValue, removeSelectedFacet, getCurrentQueryRequest } =\n    useQueryContext()\n\n  const { data: queryMetadata } = useSuspenseGetQueryMetadata()\n\n  const columnModel = queryMetadata.columnModels\n    ? getCorrespondingColumnForFacet(facetResult, queryMetadata.columnModels)\n    : undefined\n\n  const { getColumnDisplayName } = useQueryVisualizationContext()\n\n  const lastQueryRequest = useMemo(\n    () => getCurrentQueryRequest(),\n    [getCurrentQueryRequest],\n  )\n\n  if (!columnModel) {\n    return <></>\n  }\n\n  return (\n    <RangeFacetFilterUI\n      label={getColumnDisplayName(facetResult.columnName, facetResult.jsonPath)}\n      facetResult={facetResult}\n      columnType={columnModel.columnType}\n      hideCollapsible={hideCollapsible}\n      onRangeValueSelected={(values: RangeValues) => {\n        setRangeFacetValue(\n          facetResult,\n          isNumber(values.min) ? String(values.min) : values.min,\n          isNumber(values.max) ? String(values.max) : values.max,\n        )\n      }}\n      onNotSetSelected={() => {\n        setRangeFacetValue(facetResult, VALUE_NOT_SET, VALUE_NOT_SET)\n      }}\n      onAnySelected={() => {\n        const selectedFacet = lastQueryRequest.query.selectedFacets?.find(\n          selectedFacet =>\n            selectedFacet.columnName === facetResult.columnName &&\n            selectedFacet.jsonPath === facetResult.jsonPath,\n        )\n        if (selectedFacet) {\n          removeSelectedFacet(selectedFacet)\n        }\n      }}\n    />\n  )\n}\n"],"mappings":";;;;;;;;;;;;AAWA,IAAY,IAAL,yBAAA,GAAA;QACL,EAAA,UAAA,6CACA,EAAA,QAAA,SACA,EAAA,MAAA;AACF,EAAA,CAAA,CAAA,GACa,IAAU;CACrB;EAAE,OAAO;EAAwB,OAAA;CAA+B;CAChE;EAAE,OAAO;EAAO,OAAA;CAA2B;CAC3C;EAAE,OAAO;EAAS,OAAA;CAA6B;AACjD;AAMA,SAAgB,EAAiB,GAA8B;CAC7D,IAAM,EAAE,gBAAa,qBAAkB,OAAU,GAC3C,EAAE,uBAAoB,wBAAqB,8BAC/C,EAAgB,GAEZ,EAAE,MAAM,MAAkB,EAA4B,GAEtD,IAAc,EAAc,eAC9B,EAA+B,GAAa,EAAc,YAAY,IACtE,KAAA,GAEE,EAAE,4BAAyB,EAA6B,GAExD,IAAmB,QACjB,EAAuB,GAC7B,CAAC,CAAsB,CACzB;CAMA,OAJK,IAKH,kBAAC,GAAD;EACE,OAAO,EAAqB,EAAY,YAAY,EAAY,QAAQ;EAC3D;EACb,YAAY,EAAY;EACP;EACjB,uBAAuB,MAAwB;GAC7C,EACE,GACA,EAAS,EAAO,GAAG,IAAI,OAAO,EAAO,GAAG,IAAI,EAAO,KACnD,EAAS,EAAO,GAAG,IAAI,OAAO,EAAO,GAAG,IAAI,EAAO,GACrD;EACF;EACA,wBAAwB;GACtB,EAAmB,GAAa,GAAe,CAAa;EAC9D;EACA,qBAAqB;GACnB,IAAM,IAAgB,EAAiB,MAAM,gBAAgB,MAC3D,MACE,EAAc,eAAe,EAAY,cACzC,EAAc,aAAa,EAAY,QAC3C;GACA,AAAI,KACF,EAAoB,CAAa;EAErC;CACD,CAAA,IA7BM,kBAAA,GAAA,CAAI,CAAA;AA+Bf"}

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

@@ -12,77 +12,77 @@ var p = /* @__PURE__ */ function(e) {
 }({}), m = [
 	{
 		label: e,
-		value: p.NOT_SET
+		value: "org.sagebionetworks.UNDEFINED_NULL_NOTSET"
 	},
 	{
 		label: "Any",
-		value: p.ANY
+		value: ""
 	},
 	{
 		label: "Range",
-		value: p.RANGE
+		value: "RANGE"
 	}
-], h = (e, t) => t ? p.ANY : e === "org.sagebionetworks.UNDEFINED_NULL_NOTSET" ? p.NOT_SET : p.RANGE;
+], h = (e, t) => t ? "" : e === "org.sagebionetworks.UNDEFINED_NULL_NOTSET" ? "org.sagebionetworks.UNDEFINED_NULL_NOTSET" : "RANGE";
 function g(e) {
-	let { label: g, facetResult: _, hideCollapsible: v = !1, columnType: y, onAnySelected: b, onNotSetSelected: x, onRangeValueSelected: S } = e, [C, w] = i(!1), { columnMin: T, columnMax: E, selectedMin: D, selectedMax: O } = _, k = !D && !O, A = D || T, j = O || E, M = y === "DOUBLE" ? "number" : "date", N = (e) => {
-		switch (F(e), e) {
-			case p.RANGE: break;
-			case p.NOT_SET:
-				x();
-				break;
-			case p.ANY:
+	let { label: p, facetResult: g, hideCollapsible: _ = !1, columnType: v, onAnySelected: y, onNotSetSelected: b, onRangeValueSelected: x } = e, [S, C] = i(!1), { columnMin: w, columnMax: T, selectedMin: E, selectedMax: D } = g, O = !E && !D, k = E || w, A = D || T, j = v === "DOUBLE" ? "number" : "date", M = (e) => {
+		switch (P(e), e) {
+			case "RANGE": break;
+			case "org.sagebionetworks.UNDEFINED_NULL_NOTSET":
 				b();
 				break;
+			case "":
+				y();
+				break;
 		}
-	}, [P, F] = i(h(A ?? "", k));
+	}, [N, P] = i(h(k ?? "", O));
 	return /* @__PURE__ */ d("div", { children: [/* @__PURE__ */ u(t, {
-		isCollapsed: C,
-		label: g,
-		onClick: (e) => w(e),
-		hideCollapsible: v
+		isCollapsed: S,
+		label: p,
+		onClick: (e) => C(e),
+		hideCollapsible: _
 	}), /* @__PURE__ */ d(a, {
-		in: !C,
+		in: !S,
 		children: [/* @__PURE__ */ u(c, {
-			value: P,
-			onChange: (e, t) => N(t),
+			value: N,
+			onChange: (e, t) => M(t),
 			children: m.map(({ value: e, label: t }) => /* @__PURE__ */ u(o, {
 				control: /* @__PURE__ */ u(s, {}),
 				label: t,
 				value: e
 			}, e))
-		}), P === p.RANGE && (T && E && T === E ? /* @__PURE__ */ u("label", { children: E }) : /* @__PURE__ */ d(l, { children: [
-			y === "INTEGER" && (T && E ? /* @__PURE__ */ u(r, {
-				domain: [T, E],
+		}), N === "RANGE" && (w && T && w === T ? /* @__PURE__ */ u("label", { children: T }) : /* @__PURE__ */ d(l, { children: [
+			v === "INTEGER" && (w && T ? /* @__PURE__ */ u(r, {
+				domain: [w, T],
 				initialValues: {
-					min: parseInt(A ?? T),
-					max: parseInt(j ?? E)
+					min: parseInt(k ?? w),
+					max: parseInt(A ?? T)
 				},
 				step: 1,
-				onApplyClicked: S,
+				onApplyClicked: x,
 				children: ">"
 			}, "RangeSlider") : /* @__PURE__ */ u(n, {
 				type: "number",
-				initialValues: A || j ? {
-					min: A ? parseInt(A) : void 0,
-					max: j ? parseInt(j) : void 0
+				initialValues: k || A ? {
+					min: k ? parseInt(k) : void 0,
+					max: A ? parseInt(A) : void 0
 				} : void 0,
-				onApplyClicked: S
+				onApplyClicked: x
 			}, "Range")),
-			y === "DATE" && /* @__PURE__ */ u(n, {
-				initialValues: D || O || T || E ? {
-					min: D ?? (T ? f(parseInt(T)).toString() : void 0),
-					max: O ?? (E ? f(parseInt(E)).toString() : void 0)
+			v === "DATE" && /* @__PURE__ */ u(n, {
+				initialValues: E || D || w || T ? {
+					min: E ?? (w ? f(parseInt(w)).toString() : void 0),
+					max: D ?? (T ? f(parseInt(T)).toString() : void 0)
 				} : void 0,
-				type: M,
-				onApplyClicked: S
+				type: j,
+				onApplyClicked: x
 			}, "Range"),
-			y === "DOUBLE" && /* @__PURE__ */ u(n, {
-				initialValues: A || j ? {
-					min: A ? parseFloat(A) : void 0,
-					max: j ? parseFloat(j) : void 0
+			v === "DOUBLE" && /* @__PURE__ */ u(n, {
+				initialValues: k || A ? {
+					min: k ? parseFloat(k) : void 0,
+					max: A ? parseFloat(A) : void 0
 				} : void 0,
-				type: M,
-				onApplyClicked: S
+				type: j,
+				onApplyClicked: x
 			}, "Range")
 		] }))]
 	})] });

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

@@ -1 +1 @@
-{"version":3,"file":"RangeFacetFilterUI.js","names":[],"sources":["../../../../src/components/widgets/query-filter/RangeFacetFilterUI.tsx"],"sourcesContent":["import { FRIENDLY_VALUE_NOT_SET, VALUE_NOT_SET } from '@/utils/SynapseConstants'\nimport { Collapse, FormControlLabel, Radio, RadioGroup } from '@mui/material'\nimport { ColumnType } from '@sage-bionetworks/synapse-types'\nimport dayjs from 'dayjs'\nimport { useState } from 'react'\nimport { Range, RangeValues } from '../Range'\nimport RangeSlider from '../RangeSlider/RangeSlider'\nimport { FacetFilterHeader } from './FacetFilterHeader'\n\nexport enum RadioValuesEnum {\n  NOT_SET = 'org.sagebionetworks.UNDEFINED_NULL_NOTSET',\n  RANGE = 'RANGE',\n  ANY = '',\n}\nexport const options = [\n  { label: FRIENDLY_VALUE_NOT_SET, value: RadioValuesEnum.NOT_SET },\n  { label: 'Any', value: RadioValuesEnum.ANY },\n  { label: 'Range', value: RadioValuesEnum.RANGE },\n]\nexport type RangeFacetFilterProps = {\n  label: string\n  facetResult: {\n    /** The smallest value in the column. May be absent when the server cannot supply stats (e.g. Search API). */\n    columnMin?: string\n    /** The largest value in the column. May be absent when the server cannot supply stats (e.g. Search API). */\n    columnMax?: string\n    selectedMin?: string\n    selectedMax?: string\n  }\n  columnType: ColumnType\n  hideCollapsible?: boolean\n  onRangeValueSelected: (values: RangeValues) => void\n  onNotSetSelected: () => void\n  onAnySelected: () => void\n}\n\nexport const getRadioValue = (min: string, isAnyValue: boolean) => {\n  if (isAnyValue) {\n    return RadioValuesEnum.ANY\n  } else if (min === VALUE_NOT_SET) {\n    return RadioValuesEnum.NOT_SET\n  }\n  return RadioValuesEnum.RANGE\n}\n\nexport function RangeFacetFilterUI(props: RangeFacetFilterProps) {\n  const {\n    label,\n    facetResult,\n    hideCollapsible = false,\n    columnType,\n    onAnySelected,\n    onNotSetSelected,\n    onRangeValueSelected,\n  } = props\n\n  const [isCollapsed, setIsCollapsed] = useState<boolean>(false)\n\n  const { columnMin, columnMax, selectedMin, selectedMax } = facetResult // the upper bound of the selected range\n\n  const hasAnyValue = !selectedMin && !selectedMax\n\n  const currentMin = selectedMin || columnMin\n  const currentMax = selectedMax || columnMax\n\n  const rangeType = columnType === 'DOUBLE' ? 'number' : 'date'\n\n  const handleRadioGroupChange = (radioValue: RadioValuesEnum) => {\n    setRadioValue(radioValue)\n\n    switch (radioValue) {\n      case RadioValuesEnum.RANGE:\n        // The range facet value will update when the user clicks the apply button\n        break\n      case RadioValuesEnum.NOT_SET:\n        onNotSetSelected()\n        break\n      case RadioValuesEnum.ANY: {\n        onAnySelected()\n        break\n      }\n    }\n  }\n\n  const [radioValue, setRadioValue] = useState(\n    getRadioValue(currentMin ?? '', hasAnyValue),\n  )\n\n  return (\n    <div>\n      <FacetFilterHeader\n        isCollapsed={isCollapsed}\n        label={label}\n        onClick={(isCollapsed: boolean) => setIsCollapsed(isCollapsed)}\n        hideCollapsible={hideCollapsible}\n      />\n      <Collapse in={!isCollapsed}>\n        <RadioGroup\n          value={radioValue}\n          onChange={(_event, value) =>\n            handleRadioGroupChange(value as RadioValuesEnum)\n          }\n        >\n          {options.map(({ value, label }) => (\n            <FormControlLabel\n              key={value}\n              control={<Radio />}\n              label={label}\n              value={value}\n            />\n          ))}\n        </RadioGroup>\n        {radioValue === RadioValuesEnum.RANGE &&\n          (columnMin && columnMax && columnMin === columnMax ? (\n            <label>{columnMax}</label>\n          ) : (\n            <>\n              {columnType === 'INTEGER' &&\n                (columnMin && columnMax ? (\n                  <RangeSlider\n                    key=\"RangeSlider\"\n                    domain={[columnMin, columnMax]}\n                    initialValues={{\n                      min: parseInt(currentMin ?? columnMin),\n                      max: parseInt(currentMax ?? columnMax),\n                    }}\n                    step={1}\n                    onApplyClicked={onRangeValueSelected}\n                  >\n                    {'>'}\n                  </RangeSlider>\n                ) : (\n                  <Range\n                    key=\"Range\"\n                    type=\"number\"\n                    initialValues={\n                      currentMin || currentMax\n                        ? {\n                            min: currentMin ? parseInt(currentMin) : undefined,\n                            max: currentMax ? parseInt(currentMax) : undefined,\n                          }\n                        : undefined\n                    }\n                    onApplyClicked={onRangeValueSelected}\n                  />\n                ))}\n\n              {columnType === 'DATE' && (\n                <Range\n                  key=\"Range\"\n                  initialValues={\n                    selectedMin || selectedMax || columnMin || columnMax\n                      ? {\n                          // From the backend, selectedMin is a formatted date (like \"2021-06-15\"), but columnMin is a unix timestamp in millis (like \"1624651794856\")\n                          min:\n                            selectedMin ??\n                            (columnMin\n                              ? dayjs(parseInt(columnMin)).toString()\n                              : undefined),\n                          max:\n                            selectedMax ??\n                            (columnMax\n                              ? dayjs(parseInt(columnMax)).toString()\n                              : undefined),\n                        }\n                      : undefined\n                  }\n                  type={rangeType}\n                  onApplyClicked={onRangeValueSelected}\n                />\n              )}\n              {columnType === 'DOUBLE' && (\n                <Range\n                  key=\"Range\"\n                  initialValues={\n                    currentMin || currentMax\n                      ? {\n                          min: currentMin ? parseFloat(currentMin) : undefined,\n                          max: currentMax ? parseFloat(currentMax) : undefined,\n                        }\n                      : undefined\n                  }\n                  type={rangeType}\n                  onApplyClicked={onRangeValueSelected}\n                />\n              )}\n            </>\n          ))}\n      </Collapse>\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;;AASA,IAAY,IAAL,yBAAA,GAAA;QACL,EAAA,UAAU,6CACV,EAAA,QAAQ,SACR,EAAA,MAAM;KACP,EACY,IAAU;CACrB;EAAE,OAAO;EAAwB,OAAO,EAAgB;EAAS;CACjE;EAAE,OAAO;EAAO,OAAO,EAAgB;EAAK;CAC5C;EAAE,OAAO;EAAS,OAAO,EAAgB;EAAO;CACjD,EAkBY,KAAiB,GAAa,MACrC,IACK,EAAgB,MACd,MAAA,8CACF,EAAgB,UAElB,EAAgB;AAGzB,SAAgB,EAAmB,GAA8B;CAC/D,IAAM,EACJ,UACA,gBACA,qBAAkB,IAClB,eACA,kBACA,qBACA,4BACE,GAEE,CAAC,GAAa,KAAkB,EAAkB,GAAM,EAExD,EAAE,cAAW,cAAW,gBAAa,mBAAgB,GAErD,IAAc,CAAC,KAAe,CAAC,GAE/B,IAAa,KAAe,GAC5B,IAAa,KAAe,GAE5B,IAAY,MAAe,WAAW,WAAW,QAEjD,KAA0B,MAAgC;AAG9D,UAFA,EAAc,EAAW,EAEjB,GAAR;GACE,KAAK,EAAgB,MAEnB;GACF,KAAK,EAAgB;AACnB,OAAkB;AAClB;GACF,KAAK,EAAgB;AACnB,OAAe;AACf;;IAKA,CAAC,GAAY,KAAiB,EAClC,EAAc,KAAc,IAAI,EAAY,CAC7C;AAED,QACE,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,GAAD;EACe;EACN;EACP,UAAU,MAAyB,EAAe,EAAY;EAC7C;EACjB,CAAA,EACF,kBAAC,GAAD;EAAU,IAAI,CAAC;YAAf,CACE,kBAAC,GAAD;GACE,OAAO;GACP,WAAW,GAAQ,MACjB,EAAuB,EAAyB;aAGjD,EAAQ,KAAK,EAAE,UAAO,eACrB,kBAAC,GAAD;IAEE,SAAS,kBAAC,GAAD,EAAS,CAAA;IACX;IACA;IACP,EAJK,EAIL,CACF;GACS,CAAA,EACZ,MAAe,EAAgB,UAC7B,KAAa,KAAa,MAAc,IACvC,kBAAC,SAAD,EAAA,UAAQ,GAAkB,CAAA,GAE1B,kBAAA,GAAA,EAAA,UAAA;GACG,MAAe,cACb,KAAa,IACZ,kBAAC,GAAD;IAEE,QAAQ,CAAC,GAAW,EAAU;IAC9B,eAAe;KACb,KAAK,SAAS,KAAc,EAAU;KACtC,KAAK,SAAS,KAAc,EAAU;KACvC;IACD,MAAM;IACN,gBAAgB;cAEf;IACW,EAVR,cAUQ,GAEd,kBAAC,GAAD;IAEE,MAAK;IACL,eACE,KAAc,IACV;KACE,KAAK,IAAa,SAAS,EAAW,GAAG,KAAA;KACzC,KAAK,IAAa,SAAS,EAAW,GAAG,KAAA;KAC1C,GACD,KAAA;IAEN,gBAAgB;IAChB,EAXI,QAWJ;GAGL,MAAe,UACd,kBAAC,GAAD;IAEE,eACE,KAAe,KAAe,KAAa,IACvC;KAEE,KACE,MACC,IACG,EAAM,SAAS,EAAU,CAAC,CAAC,UAAU,GACrC,KAAA;KACN,KACE,MACC,IACG,EAAM,SAAS,EAAU,CAAC,CAAC,UAAU,GACrC,KAAA;KACP,GACD,KAAA;IAEN,MAAM;IACN,gBAAgB;IAChB,EApBI,QAoBJ;GAEH,MAAe,YACd,kBAAC,GAAD;IAEE,eACE,KAAc,IACV;KACE,KAAK,IAAa,WAAW,EAAW,GAAG,KAAA;KAC3C,KAAK,IAAa,WAAW,EAAW,GAAG,KAAA;KAC5C,GACD,KAAA;IAEN,MAAM;IACN,gBAAgB;IAChB,EAXI,QAWJ;GAEH,EAAA,CAAA,EAEE;IACP,EAAA,CAAA"}
+{"version":3,"file":"RangeFacetFilterUI.js","names":[],"sources":["../../../../src/components/widgets/query-filter/RangeFacetFilterUI.tsx"],"sourcesContent":["import { FRIENDLY_VALUE_NOT_SET, VALUE_NOT_SET } from '@/utils/SynapseConstants'\nimport { Collapse, FormControlLabel, Radio, RadioGroup } from '@mui/material'\nimport { ColumnType } from '@sage-bionetworks/synapse-types'\nimport dayjs from 'dayjs'\nimport { useState } from 'react'\nimport { Range, RangeValues } from '../Range'\nimport RangeSlider from '../RangeSlider/RangeSlider'\nimport { FacetFilterHeader } from './FacetFilterHeader'\n\nexport enum RadioValuesEnum {\n  NOT_SET = 'org.sagebionetworks.UNDEFINED_NULL_NOTSET',\n  RANGE = 'RANGE',\n  ANY = '',\n}\nexport const options = [\n  { label: FRIENDLY_VALUE_NOT_SET, value: RadioValuesEnum.NOT_SET },\n  { label: 'Any', value: RadioValuesEnum.ANY },\n  { label: 'Range', value: RadioValuesEnum.RANGE },\n]\nexport type RangeFacetFilterProps = {\n  label: string\n  facetResult: {\n    /** The smallest value in the column. May be absent when the server cannot supply stats (e.g. Search API). */\n    columnMin?: string\n    /** The largest value in the column. May be absent when the server cannot supply stats (e.g. Search API). */\n    columnMax?: string\n    selectedMin?: string\n    selectedMax?: string\n  }\n  columnType: ColumnType\n  hideCollapsible?: boolean\n  onRangeValueSelected: (values: RangeValues) => void\n  onNotSetSelected: () => void\n  onAnySelected: () => void\n}\n\nexport const getRadioValue = (min: string, isAnyValue: boolean) => {\n  if (isAnyValue) {\n    return RadioValuesEnum.ANY\n  } else if (min === VALUE_NOT_SET) {\n    return RadioValuesEnum.NOT_SET\n  }\n  return RadioValuesEnum.RANGE\n}\n\nexport function RangeFacetFilterUI(props: RangeFacetFilterProps) {\n  const {\n    label,\n    facetResult,\n    hideCollapsible = false,\n    columnType,\n    onAnySelected,\n    onNotSetSelected,\n    onRangeValueSelected,\n  } = props\n\n  const [isCollapsed, setIsCollapsed] = useState<boolean>(false)\n\n  const { columnMin, columnMax, selectedMin, selectedMax } = facetResult // the upper bound of the selected range\n\n  const hasAnyValue = !selectedMin && !selectedMax\n\n  const currentMin = selectedMin || columnMin\n  const currentMax = selectedMax || columnMax\n\n  const rangeType = columnType === 'DOUBLE' ? 'number' : 'date'\n\n  const handleRadioGroupChange = (radioValue: RadioValuesEnum) => {\n    setRadioValue(radioValue)\n\n    switch (radioValue) {\n      case RadioValuesEnum.RANGE:\n        // The range facet value will update when the user clicks the apply button\n        break\n      case RadioValuesEnum.NOT_SET:\n        onNotSetSelected()\n        break\n      case RadioValuesEnum.ANY: {\n        onAnySelected()\n        break\n      }\n    }\n  }\n\n  const [radioValue, setRadioValue] = useState(\n    getRadioValue(currentMin ?? '', hasAnyValue),\n  )\n\n  return (\n    <div>\n      <FacetFilterHeader\n        isCollapsed={isCollapsed}\n        label={label}\n        onClick={(isCollapsed: boolean) => setIsCollapsed(isCollapsed)}\n        hideCollapsible={hideCollapsible}\n      />\n      <Collapse in={!isCollapsed}>\n        <RadioGroup\n          value={radioValue}\n          onChange={(_event, value) =>\n            handleRadioGroupChange(value as RadioValuesEnum)\n          }\n        >\n          {options.map(({ value, label }) => (\n            <FormControlLabel\n              key={value}\n              control={<Radio />}\n              label={label}\n              value={value}\n            />\n          ))}\n        </RadioGroup>\n        {radioValue === RadioValuesEnum.RANGE &&\n          (columnMin && columnMax && columnMin === columnMax ? (\n            <label>{columnMax}</label>\n          ) : (\n            <>\n              {columnType === 'INTEGER' &&\n                (columnMin && columnMax ? (\n                  <RangeSlider\n                    key=\"RangeSlider\"\n                    domain={[columnMin, columnMax]}\n                    initialValues={{\n                      min: parseInt(currentMin ?? columnMin),\n                      max: parseInt(currentMax ?? columnMax),\n                    }}\n                    step={1}\n                    onApplyClicked={onRangeValueSelected}\n                  >\n                    {'>'}\n                  </RangeSlider>\n                ) : (\n                  <Range\n                    key=\"Range\"\n                    type=\"number\"\n                    initialValues={\n                      currentMin || currentMax\n                        ? {\n                            min: currentMin ? parseInt(currentMin) : undefined,\n                            max: currentMax ? parseInt(currentMax) : undefined,\n                          }\n                        : undefined\n                    }\n                    onApplyClicked={onRangeValueSelected}\n                  />\n                ))}\n\n              {columnType === 'DATE' && (\n                <Range\n                  key=\"Range\"\n                  initialValues={\n                    selectedMin || selectedMax || columnMin || columnMax\n                      ? {\n                          // From the backend, selectedMin is a formatted date (like \"2021-06-15\"), but columnMin is a unix timestamp in millis (like \"1624651794856\")\n                          min:\n                            selectedMin ??\n                            (columnMin\n                              ? dayjs(parseInt(columnMin)).toString()\n                              : undefined),\n                          max:\n                            selectedMax ??\n                            (columnMax\n                              ? dayjs(parseInt(columnMax)).toString()\n                              : undefined),\n                        }\n                      : undefined\n                  }\n                  type={rangeType}\n                  onApplyClicked={onRangeValueSelected}\n                />\n              )}\n              {columnType === 'DOUBLE' && (\n                <Range\n                  key=\"Range\"\n                  initialValues={\n                    currentMin || currentMax\n                      ? {\n                          min: currentMin ? parseFloat(currentMin) : undefined,\n                          max: currentMax ? parseFloat(currentMax) : undefined,\n                        }\n                      : undefined\n                  }\n                  type={rangeType}\n                  onApplyClicked={onRangeValueSelected}\n                />\n              )}\n            </>\n          ))}\n      </Collapse>\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;;AASA,IAAY,IAAL,yBAAA,GAAA;QACL,EAAA,UAAA,6CACA,EAAA,QAAA,SACA,EAAA,MAAA;AACF,EAAA,CAAA,CAAA,GACa,IAAU;CACrB;EAAE,OAAO;EAAwB,OAAA;CAA+B;CAChE;EAAE,OAAO;EAAO,OAAA;CAA2B;CAC3C;EAAE,OAAO;EAAS,OAAA;CAA6B;AACjD,GAkBa,KAAiB,GAAa,MACrC,IACF,KACS,MAAA,8CACT,8CAEF;AAGF,SAAgB,EAAmB,GAA8B;CAC/D,IAAM,EACJ,UACA,gBACA,qBAAkB,IAClB,eACA,kBACA,qBACA,4BACE,GAEE,CAAC,GAAa,KAAkB,EAAkB,EAAK,GAEvD,EAAE,cAAW,cAAW,gBAAa,mBAAgB,GAErD,IAAc,CAAC,KAAe,CAAC,GAE/B,IAAa,KAAe,GAC5B,IAAa,KAAe,GAE5B,IAAY,MAAe,WAAW,WAAW,QAEjD,KAA0B,MAAgC;EAG9D,QAFA,EAAc,CAAU,GAEhB,GAAR;GACE,KAAA,SAEE;GACF,KAAA;IACE,EAAiB;IACjB;GACF,KAAA;IACE,EAAc;IACd;EAEJ;CACF,GAEM,CAAC,GAAY,KAAiB,EAClC,EAAc,KAAc,IAAI,CAAW,CAC7C;CAEA,OACE,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,GAAD;EACe;EACN;EACP,UAAU,MAAyB,EAAe,CAAW;EAC5C;CAClB,CAAA,GACD,kBAAC,GAAD;EAAU,IAAI,CAAC;YAAf,CACE,kBAAC,GAAD;GACE,OAAO;GACP,WAAW,GAAQ,MACjB,EAAuB,CAAwB;aAGhD,EAAQ,KAAK,EAAE,UAAO,eACrB,kBAAC,GAAD;IAEE,SAAS,kBAAC,GAAD,CAAQ,CAAA;IACV;IACA;GACR,GAJM,CAIN,CACF;EACS,CAAA,GACX,MAAA,YACE,KAAa,KAAa,MAAc,IACvC,kBAAC,SAAD,EAAA,UAAQ,EAAiB,CAAA,IAEzB,kBAAA,GAAA,EAAA,UAAA;GACG,MAAe,cACb,KAAa,IACZ,kBAAC,GAAD;IAEE,QAAQ,CAAC,GAAW,CAAS;IAC7B,eAAe;KACb,KAAK,SAAS,KAAc,CAAS;KACrC,KAAK,SAAS,KAAc,CAAS;IACvC;IACA,MAAM;IACN,gBAAgB;cAEf;GACU,GAVP,aAUO,IAEb,kBAAC,GAAD;IAEE,MAAK;IACL,eACE,KAAc,IACV;KACE,KAAK,IAAa,SAAS,CAAU,IAAI,KAAA;KACzC,KAAK,IAAa,SAAS,CAAU,IAAI,KAAA;IAC3C,IACA,KAAA;IAEN,gBAAgB;GACjB,GAXK,OAWL;GAGJ,MAAe,UACd,kBAAC,GAAD;IAEE,eACE,KAAe,KAAe,KAAa,IACvC;KAEE,KACE,MACC,IACG,EAAM,SAAS,CAAS,CAAC,EAAE,SAAS,IACpC,KAAA;KACN,KACE,MACC,IACG,EAAM,SAAS,CAAS,CAAC,EAAE,SAAS,IACpC,KAAA;IACR,IACA,KAAA;IAEN,MAAM;IACN,gBAAgB;GACjB,GApBK,OAoBL;GAEF,MAAe,YACd,kBAAC,GAAD;IAEE,eACE,KAAc,IACV;KACE,KAAK,IAAa,WAAW,CAAU,IAAI,KAAA;KAC3C,KAAK,IAAa,WAAW,CAAU,IAAI,KAAA;IAC7C,IACA,KAAA;IAEN,MAAM;IACN,gBAAgB;GACjB,GAXK,OAWL;EAEH,EAAA,CAAA,EAEE;GACP,EAAA,CAAA;AAET"}

package/dist/features/curator/GridPage/GridPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"GridPage.js","names":[],"sources":["../../../../src/features/curator/GridPage/GridPage.tsx"],"sourcesContent":["import SynapseGrid from '@/components/DataGrid/index'\nimport { ErrorBanner } from '@/components/index'\nimport GridPageRouter, {\n  GridPageRouterProps,\n} from '@/features/curator/GridPage/components/GridPageRouter'\nimport GridPageTitle from '@/features/curator/GridPage/components/GridPageTitle'\nimport {\n  GRID_PAGE_SESSION_ID_QUERY_PARAM,\n  GRID_PAGE_AGENT_REGISTRATION_ID_QUERY_PARAM,\n  GRID_PAGE_TASK_ID_QUERY_PARAM,\n} from '@/utils/SynapseConstants'\nimport { useSearchParams } from 'react-router'\n\nfunction GridPageInternal() {\n  const [searchParams] = useSearchParams()\n\n  const sessionId = decodeURIComponent(\n    searchParams.get(GRID_PAGE_SESSION_ID_QUERY_PARAM) ?? '',\n  )\n  const rawTaskId = searchParams.get(GRID_PAGE_TASK_ID_QUERY_PARAM)\n  const taskId = rawTaskId ? parseInt(rawTaskId) : undefined\n  const agentRegistrationId = searchParams.get(\n    GRID_PAGE_AGENT_REGISTRATION_ID_QUERY_PARAM,\n  )\n\n  // If no session id, error\n  if (!sessionId) {\n    return <ErrorBanner error={'Missing sessionId'} />\n  }\n\n  return (\n    <>\n      <GridPageTitle sessionId={sessionId} taskId={taskId} />\n      <div className={'pageContent'}>\n        <SynapseGrid\n          agentRegistrationId={agentRegistrationId ?? undefined}\n          ref={handle => {\n            if (handle) {\n              handle.loadExistingSession(sessionId)\n            }\n          }}\n        />\n      </div>\n    </>\n  )\n}\n\nexport type GridPageProps = Omit<GridPageRouterProps, 'children'>\n\n/**\n * A page that displays the Curator grid, with included routing logic\n */\nexport default function GridPage(props: GridPageProps) {\n  return (\n    <GridPageRouter {...props}>\n      <GridPageInternal />\n    </GridPageRouter>\n  )\n}\n"],"mappings":";;;;;;;;;AAaA,SAAS,IAAmB;CAC1B,IAAM,CAAC,KAAgB,GAAiB,EAElC,IAAY,mBAChB,EAAa,IAAA,YAAqC,IAAI,GACvD,EACK,IAAY,EAAa,IAAI,EAA8B,EAC3D,IAAS,IAAY,SAAS,EAAU,GAAG,KAAA,GAC3C,IAAsB,EAAa,IACvC,EACD;AAOD,QAJK,IAKH,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;EAA0B;EAAmB;EAAU,CAAA,EACvD,kBAAC,OAAD;EAAK,WAAW;YACd,kBAAC,GAAD;GACE,qBAAqB,KAAuB,KAAA;GAC5C,MAAK,MAAU;AACb,IAAI,KACF,EAAO,oBAAoB,EAAU;;GAGzC,CAAA;EACE,CAAA,CACL,EAAA,CAAA,GAhBI,kBAAC,GAAD,EAAa,OAAO,qBAAuB,CAAA;;AAyBtD,SAAwB,EAAS,GAAsB;AACrD,QACE,kBAAC,GAAD;EAAgB,GAAI;YAClB,kBAAC,GAAD,EAAoB,CAAA;EACL,CAAA"}
+{"version":3,"file":"GridPage.js","names":[],"sources":["../../../../src/features/curator/GridPage/GridPage.tsx"],"sourcesContent":["import SynapseGrid from '@/components/DataGrid/index'\nimport { ErrorBanner } from '@/components/index'\nimport GridPageRouter, {\n  GridPageRouterProps,\n} from '@/features/curator/GridPage/components/GridPageRouter'\nimport GridPageTitle from '@/features/curator/GridPage/components/GridPageTitle'\nimport {\n  GRID_PAGE_SESSION_ID_QUERY_PARAM,\n  GRID_PAGE_AGENT_REGISTRATION_ID_QUERY_PARAM,\n  GRID_PAGE_TASK_ID_QUERY_PARAM,\n} from '@/utils/SynapseConstants'\nimport { useSearchParams } from 'react-router'\n\nfunction GridPageInternal() {\n  const [searchParams] = useSearchParams()\n\n  const sessionId = decodeURIComponent(\n    searchParams.get(GRID_PAGE_SESSION_ID_QUERY_PARAM) ?? '',\n  )\n  const rawTaskId = searchParams.get(GRID_PAGE_TASK_ID_QUERY_PARAM)\n  const taskId = rawTaskId ? parseInt(rawTaskId) : undefined\n  const agentRegistrationId = searchParams.get(\n    GRID_PAGE_AGENT_REGISTRATION_ID_QUERY_PARAM,\n  )\n\n  // If no session id, error\n  if (!sessionId) {\n    return <ErrorBanner error={'Missing sessionId'} />\n  }\n\n  return (\n    <>\n      <GridPageTitle sessionId={sessionId} taskId={taskId} />\n      <div className={'pageContent'}>\n        <SynapseGrid\n          agentRegistrationId={agentRegistrationId ?? undefined}\n          ref={handle => {\n            if (handle) {\n              handle.loadExistingSession(sessionId)\n            }\n          }}\n        />\n      </div>\n    </>\n  )\n}\n\nexport type GridPageProps = Omit<GridPageRouterProps, 'children'>\n\n/**\n * A page that displays the Curator grid, with included routing logic\n */\nexport default function GridPage(props: GridPageProps) {\n  return (\n    <GridPageRouter {...props}>\n      <GridPageInternal />\n    </GridPageRouter>\n  )\n}\n"],"mappings":";;;;;;;;;AAaA,SAAS,IAAmB;CAC1B,IAAM,CAAC,KAAgB,EAAgB,GAEjC,IAAY,mBAChB,EAAa,IAAA,WAAoC,KAAK,EACxD,GACM,IAAY,EAAa,IAAI,CAA6B,GAC1D,IAAS,IAAY,SAAS,CAAS,IAAI,KAAA,GAC3C,IAAsB,EAAa,IACvC,CACF;CAOA,OAJK,IAKH,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;EAA0B;EAAmB;CAAS,CAAA,GACtD,kBAAC,OAAD;EAAK,WAAW;YACd,kBAAC,GAAD;GACE,qBAAqB,KAAuB,KAAA;GAC5C,MAAK,MAAU;IACb,AAAI,KACF,EAAO,oBAAoB,CAAS;GAExC;EACD,CAAA;CACE,CAAA,CACL,EAAA,CAAA,IAhBK,kBAAC,GAAD,EAAa,OAAO,oBAAsB,CAAA;AAkBrD;AAOA,SAAwB,EAAS,GAAsB;CACrD,OACE,kBAAC,GAAD;EAAgB,GAAI;YAClB,kBAAC,GAAD,CAAmB,CAAA;CACL,CAAA;AAEpB"}