{"version":3,"file":"Select.mjs","sources":["../../../../../../../../../web/src/adminPortal/shared/components/Select.tsx"],"sourcesContent":["import CheckIcon from '@mui/icons-material/CheckRounded';\nimport DoneAllIcon from '@mui/icons-material/DoneAll';\nimport ExpandMore from '@mui/icons-material/ExpandMore';\nimport RemoveIcon from '@mui/icons-material/RemoveRounded';\nimport { Select as MuiSelect, SelectChangeEvent, styled, SxProps, Theme } from '@mui/material';\nimport React, { MouseEventHandler, ReactNode } from 'react';\n\nimport { useUniqueId } from '../../../utils/uniqueId';\nimport { InjectedComponents } from './componentInjection';\nimport { DEFAULT_GRID_COLUMN_WIDTH } from './constants';\nimport { OptionItem } from './types';\n\nconst MULTISELECT_VALUE = 'all_values';\n\nexport const SelectContainer = styled('div')<{ fullWidth?: boolean; readOnly?: boolean }>(\n  ({ theme, fullWidth, readOnly }) => [\n    {\n      [theme.breakpoints.down('md')]: {\n        width: '100%',\n        minWidth: 'unset',\n        flex: 1,\n      },\n      width: fullWidth ? '100%' : DEFAULT_GRID_COLUMN_WIDTH,\n      minWidth: DEFAULT_GRID_COLUMN_WIDTH,\n      display: 'flex',\n      flexDirection: 'column',\n      gap: theme.spacing(0.5),\n    },\n    readOnly && {\n      // Need this to wrap text and ellipsis after two lines\n      display: '-webkit-box',\n      '-webkit-line-clamp': 2,\n      '-webkit-box-orient': 'vertical',\n      overflow: 'hidden',\n    },\n  ],\n);\n\ntype SelectItem = OptionItem & {\n  Icon?: ReactNode;\n  selected?: boolean;\n  onClick?: MouseEventHandler<HTMLLIElement>;\n\n  // This props is only used for the MUI Select component since the Select handles the onClick and selected props.\n  // For other cases use the 'selected' prop instead.\n  forceSelected?: boolean;\n};\n\nexport type SelectCoreProps<U extends string | number | string[] | number[], TSelectItem> = {\n  caption?: string;\n  disabled?: boolean;\n  fullWidth?: boolean;\n  id?: string;\n  label?: ReactNode;\n  menuAnchorHorizontal?: 'left' | 'right' | 'center';\n  selectItems: TSelectItem[];\n  multiple?: boolean;\n  onChange?: (value: U) => void;\n  placeholder?: string;\n  readOnly?: boolean;\n  required?: boolean;\n  value?: U | null;\n  checkIconSx?: SxProps<Theme>;\n  selectSx?: SxProps<Theme>;\n};\n\nexport const SelectCore = <U extends string | number | string[] | number[], TSelectItem extends SelectItem>({\n  caption,\n  disabled,\n  fullWidth,\n  id,\n  label,\n  menuAnchorHorizontal,\n  selectItems,\n  multiple,\n  onChange,\n  placeholder,\n  readOnly,\n  required,\n  value,\n  checkIconSx,\n  selectSx,\n  LabelComponent: Label,\n  MenuItemComponent: MenuItem,\n  TypographyComponent: Typography,\n}: SelectCoreProps<U, TSelectItem> &\n  InjectedComponents<'Label' | 'Typography'> & {\n    MenuItemComponent: React.ComponentType<SelectItem | TSelectItem>;\n  }): JSX.Element => {\n  const selectId = useUniqueId(id);\n\n  const totalOptions = selectItems.filter((item) => !item.disabled).length;\n\n  // If multiple = true, MUI will error if value is not an array.\n  const isMultiSelect = multiple && Array.isArray(value);\n  const hasMoreThanOneChild = totalOptions > 1;\n  let MultiSelectIcon;\n  let canSelectAll;\n  if (isMultiSelect && hasMoreThanOneChild) {\n    if (value.length > 0) {\n      // At least 1 item has been selected\n      MultiSelectIcon = RemoveIcon;\n      canSelectAll = false;\n    } else {\n      MultiSelectIcon = DoneAllIcon;\n      canSelectAll = true;\n    }\n  }\n\n  const handleChange = <T,>(event: SelectChangeEvent<T>) => {\n    // Don't call onChange when the 'All' multiselect value is selected.\n    if (Array.isArray(event.target.value) && event.target.value.includes(MULTISELECT_VALUE)) {\n      return;\n    }\n    onChange?.(event.target.value as U);\n  };\n\n  // Select all function called for multiselect.\n  const selectAll = () => {\n    if (!isMultiSelect || !hasMoreThanOneChild || !onChange) {\n      return;\n    }\n    // Set event.target.value to be an array that includes all menu item values.\n    const newValue = selectItems.filter((item) => !item.disabled).map((item) => item.value);\n    onChange(newValue as U);\n  };\n\n  // Deselect all function called for multiselect.\n  const deselectAll = () => {\n    if (!isMultiSelect || !hasMoreThanOneChild || !onChange) {\n      return;\n    }\n    // Set event.target.value to be empty array.\n    const newValue = [] as string[] | number[];\n    onChange(newValue as U);\n  };\n\n  const getRenderValue = (value: unknown): ReactNode => {\n    if (value === undefined || value === null || (Array.isArray(value) && value.length === 0)) {\n      return null;\n    }\n\n    // If multiselect, render the labels of the items selected.\n    if (Array.isArray(value)) {\n      const valueSet = new Set(value);\n      return selectItems\n        .filter((item) => valueSet.has(item.value))\n        .map((item) => item.label)\n        .join(', ');\n    }\n\n    // Otherwise render the selected item label.\n    return selectItems.find((item) => item.value === value)?.label;\n  };\n\n  // Value that will be rendered in Select input.\n  const renderValue = (val: unknown): ReactNode => {\n    const renderText = getRenderValue(val);\n    if (!renderText) {\n      // If no value, render a placeholder.\n      return placeholder || 'Select option...';\n    } else if (Array.isArray(val) && val.length === totalOptions && hasMoreThanOneChild) {\n      // Else if all selected, render 'All'.\n      return 'All';\n    }\n\n    return renderText;\n  };\n\n  const shouldDisable = disabled && !readOnly;\n\n  return (\n    <SelectContainer fullWidth={fullWidth} readOnly={readOnly}>\n      {label && (\n        <Label variant=\"caption\" disabled={shouldDisable} htmlFor={selectId} required={required}>\n          {label}\n        </Label>\n      )}\n      {readOnly && <Typography>{getRenderValue(value) ?? 'None selected'}</Typography>}\n      {!readOnly && (\n        <>\n          <MuiSelect\n            sx={selectSx}\n            IconComponent={ExpandMore}\n            MenuProps={{\n              anchorOrigin: {\n                horizontal: menuAnchorHorizontal ?? 'center',\n                vertical: 'bottom',\n              },\n              transformOrigin: {\n                horizontal: 'center',\n                vertical: 'top',\n              },\n            }}\n            disableUnderline\n            disabled={shouldDisable}\n            displayEmpty\n            fullWidth\n            id={selectId}\n            multiple={multiple}\n            onChange={handleChange}\n            renderValue={(value) => <Typography variant=\"body2\">{renderValue(value)}</Typography>}\n            value={value ?? ''}\n          >\n            {isMultiSelect && hasMoreThanOneChild && (\n              <MenuItem\n                Icon={MultiSelectIcon ? <MultiSelectIcon fontSize=\"small\" /> : <div />}\n                forceSelected={!!MultiSelectIcon}\n                label={canSelectAll ? 'Select all' : 'Unselect'}\n                onClick={canSelectAll ? selectAll : deselectAll}\n                value={MULTISELECT_VALUE}\n              />\n            )}\n            {selectItems.map((menuItem) => (\n              <MenuItem Icon={<CheckIcon sx={checkIconSx} fontSize=\"small\" />} key={menuItem.value} {...menuItem} />\n            ))}\n          </MuiSelect>\n          {caption && (\n            <Typography variant=\"caption\" disabled={shouldDisable}>\n              {caption}\n            </Typography>\n          )}\n        </>\n      )}\n    </SelectContainer>\n  );\n};\n"],"names":["MULTISELECT_VALUE","SelectContainer","styled","theme","fullWidth","readOnly","breakpoints","down","width","minWidth","flex","DEFAULT_GRID_COLUMN_WIDTH","display","flexDirection","gap","spacing","overflow","SelectCore","caption","disabled","id","label","menuAnchorHorizontal","selectItems","multiple","onChange","placeholder","required","value","checkIconSx","selectSx","LabelComponent","Label","MenuItemComponent","MenuItem","TypographyComponent","Typography","selectId","useUniqueId","totalOptions","filter","item","length","isMultiSelect","Array","isArray","hasMoreThanOneChild","MultiSelectIcon","canSelectAll","RemoveIcon","DoneAllIcon","handleChange","event","target","includes","selectAll","newValue","map","deselectAll","getRenderValue","undefined","valueSet","Set","has","join","find","renderValue","val","renderText","shouldDisable","React","variant","htmlFor","MuiSelect","sx","IconComponent","ExpandMore","MenuProps","anchorOrigin","horizontal","vertical","transformOrigin","disableUnderline","displayEmpty","Icon","fontSize","div","forceSelected","onClick","menuItem","CheckIcon","key"],"mappings":"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"}