@persona/design-system 0.1.5-pre.4 → 0.1.7

package/dist/TableControls-BkdSeQvt.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableControls-BkdSeQvt.mjs","names":["Input","SmallSearchIcon","Popover","Input","LockedIcon","DragIcon","Card","Popover","Spacer"],"sources":["../components/DataTable/FormControlLabel/FormControlLabel.ts","../components/DataTable/SearchInput/SearchInput.tsx","../components/DataTable/TableControls/CompactBar.tsx","../components/DataTable/TableControls/utils/positioning.ts","../components/DataTable/TableControls/ControlBar.tsx","../components/DataTable/TableControls/TableControls.tsx","../components/DataTable/dnd/StyledIconDrag.tsx","../components/DataTable/dnd/utils.ts","../components/DataTable/TableControls/TableViewConfigurationDropdown.tsx","../components/DataTable/TableControls/TableControlsContext.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { Spacing } from '@persona/design-tokens';\nimport { Label } from 'design-system/components/Text';\nimport { TransitionDuration } from 'design-system/variables/transitions';\n\nconst FormControlLabel = styled(Label).attrs(() => ({ size: 'md', weight: 'bold' }))<{\n  isDisabled?: boolean;\n}>`\n  margin-bottom: ${Spacing[2]};\n  transition: ${TransitionDuration.Fast};\n  display: inline-block;\n\n  ${({ theme, isDisabled }) => css`\n    color: ${isDisabled ? theme.color.text.disabled : theme.color.text.primary};\n  `}\n`;\n\nexport default FormControlLabel;\n","import { noop } from 'lodash';\nimport {\n  type ChangeEvent,\n  type FocusEventHandler,\n  type ReactNode,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { SearchIcon } from '@persona/icons';\nimport { SearchIcon as SmallSearchIcon } from '@persona/icons/12px';\nimport FormControlLabel from 'design-system/components/DataTable/FormControlLabel/FormControlLabel';\nimport Input, { InputGroup } from 'design-system/components/Input';\nimport Tooltip from 'design-system/components/Tooltip';\nimport { isActive, isFocused, isHovered, isNotDisabled } from 'design-system/lib/pseudoClass';\nimport type { InputSizes } from 'design-system/mixins/input';\n\nconst SearchBar = styled.div``;\n\ninterface StyledInputProps {\n  flattenDisplay: boolean;\n}\n\nconst StyledInput = styled(Input)<StyledInputProps>`\n  ${({ theme, flattenDisplay }) =>\n    flattenDisplay &&\n    css`\n      border-width: 0px;\n\n      &${isActive}, &${isFocused}, &${isHovered}&${isNotDisabled}, &${isHovered}&${isFocused} {\n        border-color: ${theme.color.border.input};\n        box-shadow: none;\n      }\n    `}\n`;\n\nexport interface OmniSearchProps {\n  className?: string;\n  title?: ReactNode;\n  handleInput: (value: string) => void;\n  id?: string;\n  value: string;\n  placeholder: string;\n  dataTest?: string;\n  autoFocus?: boolean;\n  useClearIcon?: boolean;\n  leftIcon?: ReactNode;\n  handleOnFocus?: () => void;\n  onBlur?: FocusEventHandler<HTMLInputElement>;\n  disabled?: boolean;\n  disabledTooltip?: string;\n  flattenDisplay?: boolean;\n  size?: InputSizes;\n  maxLength?: number;\n}\n\nconst SearchInput = ({\n  className,\n  title = 'Search',\n  handleInput,\n  handleOnFocus = noop,\n  onBlur = noop,\n  id,\n  value,\n  placeholder,\n  dataTest,\n  autoFocus,\n  useClearIcon = false,\n  disabled = false,\n  disabledTooltip,\n  size = 'md',\n  leftIcon = size === 'sm' ? <SmallSearchIcon /> : <SearchIcon />,\n  flattenDisplay = false,\n  maxLength,\n}: OmniSearchProps) => {\n  // We duplicate state and track it separately here. This allows us to:\n  // 1. immediately update the <input/> value\n  // 2. do a debounced update of the actual state\n  // We expect the callback passed to this input to be a debounced that updates\n  // props.value.\n  const [innerValue, setInnerValue] = useState<string>(value);\n  const handleChange = useCallback(\n    ({ target }: ChangeEvent<HTMLInputElement>): void => {\n      setInnerValue(target.value);\n      handleInput(target.value);\n    },\n    [handleInput, setInnerValue],\n  );\n\n  useEffect(() => {\n    setInnerValue(value);\n  }, [value]);\n\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const handleClear = useCallback(() => {\n    setInnerValue('');\n    handleInput('');\n    handleOnFocus();\n    inputRef.current?.focus();\n  }, [handleInput, handleOnFocus, inputRef, setInnerValue]);\n\n  const canClear = useClearIcon && !!innerValue;\n\n  const searchBar = (\n    <SearchBar className={className} data-test={dataTest}>\n      {title != null && <FormControlLabel htmlFor={id}>{title}</FormControlLabel>}\n      <InputGroup\n        leftIcon={leftIcon}\n        onClear={\n          canClear\n            ? (e) => {\n                e.preventDefault();\n                e.stopPropagation();\n                handleClear();\n              }\n            : undefined\n        }\n        size={size}\n      >\n        <StyledInput\n          id={id}\n          onChange={handleChange}\n          placeholder={placeholder}\n          value={innerValue}\n          autoFocus={autoFocus}\n          ref={inputRef}\n          onFocus={handleOnFocus}\n          onBlur={onBlur}\n          disabled={disabled}\n          maxLength={maxLength}\n          flattenDisplay={flattenDisplay}\n        />\n      </InputGroup>\n    </SearchBar>\n  );\n\n  // The disabled <input> doesn't emit hover events, but the SearchBar wrapper does, so the tooltip\n  // surfaces the reason the search is unavailable without taking up layout room.\n  return disabled && disabledTooltip ? (\n    <Tooltip trigger={searchBar} side='top'>\n      {disabledTooltip}\n    </Tooltip>\n  ) : (\n    searchBar\n  );\n};\n\nexport default SearchInput;\n","import { useState } from 'react';\nimport styled from 'styled-components';\n\nimport { Spacing } from '@persona/design-tokens';\nimport { FilterIcon, SearchIcon } from '@persona/icons';\nimport Button from 'design-system/components/Button';\nimport SearchInput from 'design-system/components/DataTable/SearchInput';\nimport { HStack } from 'design-system/components/Stack';\nimport { Paragraph } from 'design-system/components/Text';\n\nimport type { ControlBarProps } from './ControlBar';\n\nexport const DataTableCompactBar = styled(HStack)`\n  border-bottom: 1px solid ${({ theme }) => theme.color.border.secondary};\n  padding-bottom: ${Spacing[1]};\n`;\n\nconst CompactSearchInput = styled(SearchInput)<{ $autoExpand: boolean }>`\n  width: ${({ $autoExpand }) => ($autoExpand ? '100%' : '240px')};\n  margin-right: ${Spacing[1]};\n`;\n\ntype CompactBarProps = Pick<\n  ControlBarProps,\n  | 'title'\n  | 'searchProps'\n  | 'showFilters'\n  | 'setShowFilters'\n  | 'filtersId'\n  | 'isLoading'\n  | 'propertiesButton'\n  | 'tableActions'\n  | 'data-tour-target'\n  | 'filterPanel'\n>;\n\n/**\n * Compact variant of the ControlBar.\n * Not intended to be used by itself.\n *\n * Tested using the ControlBar specs.\n *\n * @see ControlBar.tsx\n * @see ControlBar.spec.tsx\n */\nconst CompactBar: React.FC<CompactBarProps> = ({\n  title,\n  searchProps,\n  showFilters,\n  setShowFilters,\n  filtersId,\n  isLoading,\n  propertiesButton,\n  tableActions,\n  'data-tour-target': dataTourTarget,\n  filterPanel,\n}) => {\n  const autoExpandSearch = !title;\n  const [showSearch, setShowSearch] = useState<boolean>(autoExpandSearch);\n\n  return (\n    <>\n      <DataTableCompactBar data-tour-target={dataTourTarget} justify='space-between' align='center'>\n        {title && (\n          <Paragraph size='md' weight='bold' color='primary'>\n            {title}\n          </Paragraph>\n        )}\n\n        <HStack\n          spacing={Spacing[1]}\n          align='center'\n          justify='right'\n          style={autoExpandSearch ? { width: '100%' } : { marginLeft: 'auto' }}\n        >\n          <HStack spacing={Spacing[1]} align='center' style={{ width: '100%' }}>\n            {searchProps &&\n              (showSearch ? (\n                <CompactSearchInput\n                  title={null}\n                  size='sm'\n                  $autoExpand={autoExpandSearch}\n                  autoFocus={!autoExpandSearch}\n                  onBlur={\n                    autoExpandSearch\n                      ? undefined\n                      : () => {\n                          if (!searchProps.value) {\n                            setShowSearch(false);\n                          }\n                        }\n                  }\n                  useClearIcon\n                  {...searchProps}\n                />\n              ) : (\n                <Button\n                  id='table-controls__compact-search-toggle'\n                  variant='text'\n                  width='icon'\n                  size='sm'\n                  aria-label='Show search bar'\n                  onClick={() => setShowSearch(true)}\n                >\n                  <SearchIcon />\n                </Button>\n              ))}\n\n            {setShowFilters && (\n              <Button\n                id='table-controls__view-tab-filters'\n                variant='text'\n                onClick={() => setShowFilters?.(!showFilters)}\n                aria-label={showFilters ? 'Hide filters' : 'Show filters'}\n                aria-expanded={showFilters}\n                aria-controls={filtersId}\n                disabled={isLoading}\n                active={showFilters}\n                width='icon'\n                size='sm'\n              >\n                <FilterIcon />\n              </Button>\n            )}\n\n            {propertiesButton}\n          </HStack>\n\n          {tableActions && Array.isArray(tableActions)\n            ? tableActions.map((action) => (\n                <Button\n                  id={`table-controls__compact-action-${action.label.toLowerCase().replace(/\\s+/g, '-')}`}\n                  key={action.label}\n                  variant='basic'\n                  size='sm'\n                  width='auto'\n                  onClick={action.onClick}\n                >\n                  {action.label}\n                </Button>\n              ))\n            : tableActions}\n        </HStack>\n      </DataTableCompactBar>\n      {showFilters && filterPanel}\n    </>\n  );\n};\n\nexport default CompactBar;\n","/**\n * Check if a child rect is contained within a parent rect.\n * @param parent - The parent rect.\n * @param child - The child rect.\n * @returns True if the child rect is contained within the parent rect, false otherwise.\n */\nexport const rectContainsRect = (parent: DOMRect, child: DOMRect) => {\n  return (\n    child.top >= parent.top &&\n    child.bottom <= parent.bottom &&\n    child.left >= parent.left &&\n    child.right <= parent.right\n  );\n};\n","import {\n  type CSSProperties,\n  type FC,\n  forwardRef,\n  useCallback,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport styled, { createGlobalStyle } from 'styled-components';\n\nimport { Spacing } from '@persona/design-tokens';\nimport {\n  CirclePlusIcon,\n  CopyIcon,\n  FilterIcon,\n  MoreIcon,\n  RotateCcwIcon,\n  SaveIcon,\n  TrashIcon,\n} from '@persona/icons';\nimport { LockedIcon } from '@persona/icons/12px';\nimport Button, { IconButton } from 'design-system/components/Button';\nimport SearchInput, { type OmniSearchProps } from 'design-system/components/DataTable/SearchInput';\nimport Input from 'design-system/components/Input';\nimport { MenuItem, MenuList } from 'design-system/components/Menu';\nimport Popover from 'design-system/components/Popover';\nimport Stack, { HStack } from 'design-system/components/Stack';\nimport TabBar, { StyledTab, Tab } from 'design-system/components/TabBar';\n\nimport CompactBar from './CompactBar';\nimport { rectContainsRect } from './utils/positioning';\n\nconst TAB_ID_PREFIX = 'table-controls__view-tab_';\nconst OVERFLOW_TAB_ID_PREFIX = 'table-controls__view-tab-overflow_';\n\nfunction enterProxiesClick(e: React.KeyboardEvent<HTMLDivElement>) {\n  if (e.key === 'Enter') {\n    e.target.dispatchEvent(new Event('click', { bubbles: true }));\n  }\n}\n\ninterface TableViewConfig {\n  id: string;\n  name: string;\n}\n\ninterface EventHandlers {\n  /**\n   * Called when the duplicate view button is clicked. If not provided, the duplicate view button will not be displayed.\n   *\n   * @returns Promise<{ id: string }> - The id of the newly created view\n   */\n  onDuplicateView?: (viewId: string) => Promise<{ id: string } | void>;\n  /**\n   * Called when the delete view button is clicked. If not provided, the delete view button will not be displayed.\n   */\n  onDeleteView?: (viewId: string) => Promise<void>;\n  /**\n   * Called when a view tab is selected\n   */\n  onSelectView?: (viewId: string | null) => void;\n  /**\n   * Called when the reset view button is clicked. If not provided, the reset view button will not be displayed.\n   */\n  onResetCurrentView?: () => void;\n  /**\n   * Called when the save view button is clicked. If not provided, the save view button will not be displayed.\n   */\n  onSaveView?: () => Promise<void>;\n  /**\n   * Called when the add view button is clicked. If not provided, the add view button will not be displayed.\n   *\n   * @returns Promise<{ id: string }> - The id of the newly created view\n   */\n  onAddView?: () => Promise<{ id: string } | void>;\n  /**\n   * Called when the view name is changed. If not provided, the view name will not be editable.\n   */\n  onViewNameChange?: (viewId: string, name: string) => void;\n  /**\n   * Called when the selection is cleared\n   */\n  onClearSelection?: () => void;\n}\n\nexport interface ControlBarProps extends EventHandlers {\n  /**\n   * Preset views that are not editable by the user.\n   */\n  presetViews?: TableViewConfig[];\n  /**\n   * Table view tabs\n   */\n  views?: TableViewConfig[];\n  /**\n   * Current table view id\n   */\n  currentView?: string | null;\n  /**\n   * Whether the filters have been changed and can be saved\n   */\n  isViewDirty?: boolean;\n  /**\n   * Whether the user has permission to edit views\n   */\n  canEditViews?: boolean;\n  /**\n   * Whether to show filters\n   */\n  showFilters?: boolean;\n  /**\n   * Called when the filters are toggled\n   */\n  setShowFilters?: (show: boolean) => void;\n  /**\n   * Search props\n   */\n  searchProps?: Omit<OmniSearchProps, 'size'>;\n  /**\n   * The id of the filters container\n   */\n  filtersId?: string;\n  /**\n   * Properties button\n   */\n  propertiesButton?: React.ReactNode;\n  /**\n   * Table actions\n   */\n  tableActions?:\n    | React.ReactNode\n    | { label: string; onClick: React.MouseEventHandler<HTMLButtonElement> }[];\n  /**\n   * Whether the table is loading\n   */\n  isLoading?: boolean;\n  /**\n   * Whether to show the views bar\n   */\n  showViews?: boolean;\n  /**\n   * The ids of the selected rows\n   */\n  selectedRows?: string[];\n  /**\n   * Bulk actions to display when there are selected rows.\n   */\n  bulkActions?: (\n    | {\n        label: string;\n        icon?: React.ReactNode;\n        disabled?: boolean;\n        onClick: (selectedRows: string[], clearSelection: () => void) => void | Promise<void>;\n      }\n    | {\n        'aria-label': string;\n        icon: React.ReactNode;\n        disabled?: boolean;\n        onClick: (selectedRows: string[], clearSelection: () => void) => void | Promise<void>;\n      }\n  )[];\n  /**\n   * The title of the table\n   */\n  title?: string;\n  /**\n   * The data-tour-target of the table\n   */\n  'data-tour-target'?: string;\n  /**\n   * Whether to use compact spacing and styling.\n   * The compact variant does not support views.\n   */\n  compact?: boolean;\n\n  /** Use this to handle errors that occur in the control bar.\n   * This can be helpful if you want to trigger a toast message.\n   */\n  onError?: (error: Error) => void;\n\n  /**\n   * Content to render in the filter panel area below the controls row.\n   * Rendered when showFilters is true.\n   */\n  filterPanel?: React.ReactNode;\n}\n\nconst AddViewButton = styled(IconButton)`\n  color: ${({ theme }) => theme.color.text.secondary};\n`;\n\nconst LockedTab = styled(Tab)`\n  svg {\n    height: 12px;\n    width: 12px;\n  }\n`;\n\nconst OverflowMenuList = styled(MenuList)`\n  max-height: 300px;\n  overflow: auto;\n`;\n\nconst ExpandedSearchInput = styled(SearchInput)`\n  flex-basis: 440px;\n  flex-grow: 1;\n`;\n\nconst ViewsBar = styled(TabBar)<{ $isAddingView: boolean }>`\n  ${AddViewButton} {\n    /* Shows button when view is in progress of being added */\n    opacity: ${({ $isAddingView }) => ($isAddingView ? 1 : 0)};\n  }\n\n  &:hover,\n  &:hover:focus,\n  &:focus-within {\n    ${AddViewButton} {\n      opacity: 1;\n    }\n  }\n`;\n\nconst TabOverflowContainer = styled.div`\n  display: flex;\n  align-items: center;\n  gap: ${Spacing[2]};\n  position: absolute;\n  height: 32px;\n`;\n\n/**\n * Base props for the SavedViewTab component\n * These are the props that must be passed to TabOverflow so it can render a SavedViewTab\n */\ninterface BaseSavedViewTabProps extends EventHandlers {\n  canEditViews: boolean;\n  isViewDirty: boolean;\n  showTabContextMenu: boolean;\n  setShowTabContextMenu: (show: boolean) => void;\n  handleNameChange: (view: TableViewConfig, newName: string) => void;\n}\n\nconst SavedViewTab = ({\n  view,\n  selected,\n  tabIdPrefix = TAB_ID_PREFIX,\n  canEditViews,\n  handleNameChange,\n  onDuplicateView,\n  onDeleteView,\n  onSelectView,\n  onResetCurrentView,\n  onSaveView,\n  isViewDirty,\n  showTabContextMenu,\n  setShowTabContextMenu,\n  className,\n  ...rest\n}: BaseSavedViewTabProps & {\n  tabIdPrefix?: string;\n  view: TableViewConfig;\n  selected: boolean;\n  className?: string;\n}) => {\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const tab = (\n    <StyledTab\n      id={`${tabIdPrefix}${view.id}`}\n      selected={selected}\n      aria-selected={selected}\n      role='tab'\n      onClick={!selected ? () => onSelectView?.(view.id) : undefined}\n      suffixIcon={selected && canEditViews ? <MoreIcon /> : undefined}\n      className={className}\n      {...rest}\n    >\n      {view.name}\n    </StyledTab>\n  );\n\n  if (canEditViews && selected) {\n    return (\n      <Popover\n        trigger={tab}\n        open={showTabContextMenu}\n        onOpenChange={(open) => {\n          if (selected) {\n            setShowTabContextMenu(open);\n          }\n          if (!open && inputRef.current) {\n            handleNameChange?.(view, inputRef.current.value);\n          }\n        }}\n        contentProps={{ align: 'start', padding: Spacing[2] }}\n      >\n        <Stack spacing={Spacing[3]}>\n          <Input\n            defaultValue={view.name}\n            onBlur={(e) => handleNameChange?.(view, e.currentTarget.value)}\n            onKeyDown={(e) => {\n              if (e.key === 'Enter') {\n                handleNameChange?.(view, e.currentTarget.value);\n              }\n            }}\n            disabled={!handleNameChange}\n            ref={inputRef}\n          />\n          <MenuList padding={Spacing[0]}>\n            {onDuplicateView && (\n              <MenuItem\n                id='table-controls__view__menu-duplicate'\n                prefixIcon={<CopyIcon />}\n                onClick={async () => {\n                  const newTableView = await onDuplicateView(view.id);\n                  if (newTableView) {\n                    const { id } = newTableView;\n                    if (view.id !== id) {\n                      onSelectView?.(id);\n                      setShowTabContextMenu(true);\n                    }\n                  }\n                }}\n                onKeyDown={enterProxiesClick}\n              >\n                Duplicate\n              </MenuItem>\n            )}\n            {canEditViews && onResetCurrentView && (\n              <MenuItem\n                id='table-controls__view__menu-reset'\n                prefixIcon={<RotateCcwIcon />}\n                onClick={onResetCurrentView}\n                onKeyDown={enterProxiesClick}\n              >\n                Reset\n              </MenuItem>\n            )}\n            {canEditViews && onSaveView && (\n              <MenuItem\n                id='table-controls__view__menu-save'\n                prefixIcon={<SaveIcon />}\n                disabled={!isViewDirty}\n                onClick={() => {\n                  void onSaveView();\n                  setShowTabContextMenu(false);\n                }}\n                onKeyDown={enterProxiesClick}\n              >\n                Save\n              </MenuItem>\n            )}\n            {onDeleteView && (\n              <MenuItem\n                id='table-controls__view__menu-delete'\n                prefixIcon={<TrashIcon />}\n                onClick={async () => {\n                  await onDeleteView(view.id);\n                  setShowTabContextMenu(false);\n                }}\n                onKeyDown={enterProxiesClick}\n              >\n                Delete\n              </MenuItem>\n            )}\n          </MenuList>\n        </Stack>\n      </Popover>\n    );\n  }\n\n  return tab;\n};\n\ninterface LockedViewTabProps {\n  id: string;\n  /**\n   * Whether the tab is selected. If true, the tab will not be clickable.\n   */\n  selected?: boolean;\n  /**\n   * Called when the tab is clicked. If the tab is selected, the click will be ignored.\n   */\n  onClick?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;\n  children: React.ReactNode;\n}\n\n/**\n * A tab that is locked and does not support editing or actions.\n */\nconst LockedViewTab = ({ id, selected, onClick, children, ...props }: LockedViewTabProps) => {\n  return (\n    <LockedTab\n      id={id}\n      selected={selected}\n      onClick={selected ? undefined : onClick}\n      suffixIcon={<LockedIcon />}\n      {...props}\n    >\n      {children}\n    </LockedTab>\n  );\n};\n\nconst OverflowSavedViewTab = styled(SavedViewTab)`\n  margin-left: ${Spacing[2]};\n`;\n\nconst TabOverflow = forwardRef<\n  HTMLDivElement,\n  BaseSavedViewTabProps & {\n    hiddenViews: TableViewConfig[];\n    currentView: string | null | undefined;\n    handleAddView: (() => void) | null;\n    lastVisibleViewElement: HTMLElement | null;\n  }\n>(function TabOverflow(\n  {\n    hiddenViews,\n    currentView: currentViewId,\n    handleAddView,\n    onSelectView,\n    canEditViews,\n    lastVisibleViewElement,\n    ...rest\n  },\n  ref,\n) {\n  const [filter, setFilter] = useState('');\n  const [openPopover, setOpenPopover] = useState<boolean>(false);\n\n  const currentView = useMemo(() => {\n    return hiddenViews.find((view) => view.id === currentViewId);\n  }, [currentViewId, hiddenViews]);\n\n  const filteredViews = useMemo(\n    () =>\n      hiddenViews.filter(\n        (view) =>\n          view.name.toLowerCase().includes(filter.toLowerCase()) && view.id !== currentView?.id,\n      ),\n    [hiddenViews, filter, currentView],\n  );\n\n  const overflowContainerStyle = useMemo<CSSProperties | undefined>(() => {\n    if (!lastVisibleViewElement) {\n      return undefined;\n    }\n\n    return { left: lastVisibleViewElement.offsetLeft + lastVisibleViewElement.offsetWidth + 8 };\n  }, [lastVisibleViewElement]);\n\n  return (\n    <TabOverflowContainer ref={ref} style={overflowContainerStyle}>\n      {currentView && (\n        <OverflowSavedViewTab\n          view={currentView}\n          canEditViews={canEditViews}\n          selected={true}\n          tabIdPrefix={OVERFLOW_TAB_ID_PREFIX}\n          {...rest}\n        />\n      )}\n      {/* Edge case when the current view is the first hidden view */}\n      {hiddenViews.length === 1 && currentView && hiddenViews[0].id !== currentView.id ? null : (\n        <Popover\n          trigger={\n            <Button variant='basic' size='sm' width='auto'>\n              {currentView ? hiddenViews.length - 1 : hiddenViews.length} more&hellip;\n            </Button>\n          }\n          contentProps={{ align: 'start', padding: Spacing[2] }}\n          open={openPopover}\n          onOpenChange={(open) => {\n            if (!open) {\n              setFilter('');\n            }\n            setOpenPopover(open);\n          }}\n        >\n          <Input\n            value={filter}\n            onChange={(e) => setFilter(e.target.value)}\n            placeholder='Search for a view...'\n          />\n          <OverflowMenuList padding={Spacing[0]}>\n            {filteredViews.map((view) => {\n              return (\n                <MenuItem\n                  key={view.id}\n                  id={`${OVERFLOW_TAB_ID_PREFIX}${view.id}`}\n                  onClick={() => {\n                    onSelectView?.(view.id);\n                    setOpenPopover(false);\n                  }}\n                  onKeyDown={enterProxiesClick}\n                >\n                  {view.name}\n                </MenuItem>\n              );\n            })}\n          </OverflowMenuList>\n        </Popover>\n      )}\n      {canEditViews && handleAddView && (\n        <AddViewButton\n          id={`${OVERFLOW_TAB_ID_PREFIX}overflow-new`}\n          onClick={handleAddView}\n          size='md'\n          aria-label='Add new view'\n        >\n          <CirclePlusIcon />\n        </AddViewButton>\n      )}\n    </TabOverflowContainer>\n  );\n});\n\n/**\n * Force the add button to be visible when the product tour is active\n */\nconst ProductTourStyles = createGlobalStyle`\n  body:has(#react-joyride-portal) {\n    [data-tour-target='saved-views-add-button'] {\n      opacity: 1;\n    }\n  }\n`;\n\nconst ControlBar: FC<ControlBarProps> = ({\n  presetViews,\n  currentView,\n  onSelectView,\n  views,\n  onAddView,\n  onDuplicateView,\n  onDeleteView,\n  onViewNameChange,\n  onSaveView,\n  isViewDirty,\n  canEditViews,\n  showFilters,\n  setShowFilters,\n  searchProps,\n  filtersId,\n  propertiesButton,\n  tableActions,\n  isLoading,\n  showViews,\n  selectedRows = [],\n  bulkActions,\n  onResetCurrentView,\n  onClearSelection,\n  title,\n  'data-tour-target': dataTourTarget,\n  compact,\n  onError,\n  filterPanel,\n}) => {\n  const tabListRef = useRef<HTMLDivElement>(null);\n  const tabOverflowRef = useRef<HTMLDivElement>(null);\n  // The same could be done to get the visible views to only render them but that causes other jittery problems\n  const [hiddenViews, setHiddenViews] = useState<TableViewConfig[]>([]);\n  const [showTabContextMenu, setShowTabContextMenu] = useState<boolean>(false);\n  const [isAddingView, setIsAddingView] = useState<boolean>(false);\n  const [lastVisibleViewElement, setLastVisibleViewElement] = useState<HTMLElement | null>(null);\n  const [tabOverflowWidth, setTabOverflowWidth] = useState<number | null>(null);\n\n  const onResize = useCallback(() => {\n    if (!tabListRef.current) {\n      return;\n    }\n\n    const containerRect = tabListRef.current.getBoundingClientRect();\n    const tabListContainer = tabListRef.current;\n    const tabElements = Array.from(\n      tabListContainer.querySelectorAll('[data-tab-view]'),\n    ) as HTMLElement[];\n\n    // Skip if the last element is not overflowing\n    if (\n      tabElements.length === 0 ||\n      rectContainsRect(containerRect, tabElements[tabElements.length - 1].getBoundingClientRect())\n    ) {\n      setHiddenViews([]);\n      return;\n    }\n\n    // Find first element that overflows the container\n    const firstHiddenIndex = tabElements.findIndex(\n      (el) => !rectContainsRect(containerRect, el.getBoundingClientRect()),\n    );\n\n    if (firstHiddenIndex === -1) {\n      setLastVisibleViewElement(null);\n    } else {\n      const lastVisibleViewElement = tabElements[firstHiddenIndex - 1];\n      if (lastVisibleViewElement) {\n        setLastVisibleViewElement(lastVisibleViewElement);\n      }\n    }\n\n    const newHiddenViews = firstHiddenIndex === -1 ? [] : views?.slice(firstHiddenIndex);\n    setHiddenViews(newHiddenViews || []);\n\n    const tabOverflowWidth = tabOverflowRef.current?.getBoundingClientRect().width;\n    if (tabOverflowWidth) {\n      setTabOverflowWidth(tabOverflowWidth);\n    }\n  }, [setHiddenViews, views]);\n\n  // Set up ResizeObserver to watch for container size changes\n  useLayoutEffect(() => {\n    if (!showViews || !tabListRef.current) {\n      return;\n    }\n\n    const resizeObserver = new ResizeObserver(() => {\n      onResize();\n    });\n\n    resizeObserver.observe(tabListRef.current);\n\n    return () => {\n      resizeObserver.disconnect();\n    };\n  }, [onResize, showViews]);\n\n  // Update hidden tabs when views change. This needs to fire when we initially load the page, then again when the views load, and also when a view is added or removed\n  useLayoutEffect(() => {\n    if (showViews) {\n      onResize();\n    }\n  }, [onResize, showViews, views]);\n\n  const currentViewHidden = useMemo(() => {\n    if (currentView) {\n      return !!hiddenViews.find((view) => view.id === currentView);\n    }\n    return false;\n  }, [currentView, hiddenViews]);\n\n  const handleAddView = async () => {\n    try {\n      setIsAddingView(true);\n      if (onAddView) {\n        const view = await onAddView();\n\n        // Occurs if there is an error adding the view\n        if (!view || !view.id) {\n          return;\n        }\n\n        if (currentView !== view.id) {\n          onSelectView?.(view.id);\n        }\n\n        setShowTabContextMenu(true);\n      }\n    } catch {\n      onError?.(new Error('Error adding view'));\n    } finally {\n      setIsAddingView(false);\n    }\n  };\n\n  const handleNameChange = (view: TableViewConfig, newName: string) => {\n    if (canEditViews && view.name !== newName) {\n      onViewNameChange?.(view.id, newName);\n    }\n  };\n\n  // Compact variant with simplified layout\n  if (compact) {\n    // todo(joseph): add bulk actions\n    return (\n      <CompactBar\n        data-tour-target={dataTourTarget}\n        title={title}\n        searchProps={searchProps}\n        showFilters={showFilters}\n        setShowFilters={setShowFilters}\n        filtersId={filtersId}\n        isLoading={isLoading}\n        propertiesButton={propertiesButton}\n        tableActions={tableActions}\n        filterPanel={filterPanel}\n      />\n    );\n  }\n\n  // Generate persistent bulk action buttons\n  const bulkActionButtons = bulkActions?.map((action, index) => {\n    const key = 'label' in action ? action.label : `action-${index}`;\n    const isDisabled = selectedRows.length === 0 || action.disabled === true;\n    const selectedCount = selectedRows.length;\n\n    const clearSelection = () => {\n      onClearSelection?.();\n    };\n\n    if ('icon' in action && 'aria-label' in action) {\n      // Icon-only action\n      return (\n        <IconButton\n          key={key}\n          size='sm'\n          aria-label={action['aria-label']}\n          onClick={async () => {\n            await action.onClick(selectedRows, clearSelection);\n          }}\n          disabled={isDisabled}\n        >\n          {action.icon}\n        </IconButton>\n      );\n    }\n\n    // Append count to label if rows are selected\n    const displayLabel =\n      'label' in action && selectedCount > 0\n        ? `${action.label} (${selectedCount})`\n        : 'label' in action\n          ? action.label\n          : '';\n\n    return (\n      <Button\n        id={`table-controls__view-tab-bulk-action-${index}`}\n        variant='basic'\n        size='sm'\n        width='auto'\n        key={key}\n        onClick={async () => {\n          await action.onClick(selectedRows, clearSelection);\n        }}\n        disabled={isDisabled}\n      >\n        {displayLabel}\n      </Button>\n    );\n  });\n\n  const showViewsBar =\n    title || showViews || (canEditViews && onSaveView) || tableActions || bulkActions;\n\n  return (\n    <>\n      <ProductTourStyles />\n      {showViewsBar && (\n        <ViewsBar\n          ref={tabListRef}\n          title={title}\n          maxTabChars={25}\n          $isAddingView={isAddingView}\n          data-tour-target={dataTourTarget}\n          actions={\n            <HStack\n              spacing={Spacing[3]}\n              align='center'\n              style={tabOverflowWidth ? { paddingLeft: `${tabOverflowWidth + 16}px` } : undefined}\n            >\n              {canEditViews && onSaveView && (\n                <Button\n                  id='table-controls__view-tab-save'\n                  onClick={onSaveView}\n                  aria-label='Save current view'\n                  disabled={!isViewDirty || isLoading}\n                  size='sm'\n                  variant='basic'\n                  width='auto'\n                  data-tour-target='saved-views-save-button'\n                >\n                  Save view\n                </Button>\n              )}\n              {bulkActionButtons}\n              {tableActions}\n            </HStack>\n          }\n        >\n          {showViews && (\n            <>\n              <LockedViewTab\n                id={`${TAB_ID_PREFIX}default`}\n                selected={!currentView}\n                onClick={() => onSelectView?.(null)}\n                data-tour-target='saved-views-default-view'\n              >\n                Default view\n              </LockedViewTab>\n              {presetViews?.map((view) => {\n                const selected = view.id === currentView;\n                return (\n                  <LockedViewTab\n                    key={view.id}\n                    id={`${TAB_ID_PREFIX}preset-${view.id}`}\n                    selected={selected}\n                    onClick={() => onSelectView?.(view.id)}\n                  >\n                    {view.name}\n                  </LockedViewTab>\n                );\n              })}\n              {views?.map((view) => {\n                return (\n                  <SavedViewTab\n                    key={view.id}\n                    view={view}\n                    canEditViews={canEditViews ?? false}\n                    handleNameChange={handleNameChange}\n                    onDuplicateView={onDuplicateView}\n                    onDeleteView={onDeleteView}\n                    onSelectView={onSelectView}\n                    onResetCurrentView={onResetCurrentView}\n                    onSaveView={onSaveView}\n                    isViewDirty={isViewDirty ?? false}\n                    selected={view.id === currentView}\n                    showTabContextMenu={showTabContextMenu && !currentViewHidden}\n                    setShowTabContextMenu={setShowTabContextMenu}\n                    data-tab-view\n                  />\n                );\n              })}\n              {canEditViews && onAddView && (\n                <AddViewButton\n                  id='table-controls__view-tab-new'\n                  size='md'\n                  onClick={handleAddView}\n                  aria-label='Add new view'\n                  data-tour-target='saved-views-add-button'\n                >\n                  <CirclePlusIcon />\n                </AddViewButton>\n              )}\n              {hiddenViews.length > 0 && (\n                <TabOverflow\n                  ref={tabOverflowRef}\n                  hiddenViews={hiddenViews}\n                  currentView={currentView}\n                  onSelectView={onSelectView}\n                  canEditViews={canEditViews ?? false}\n                  handleAddView={onAddView ? handleAddView : null}\n                  handleNameChange={handleNameChange}\n                  onDuplicateView={onDuplicateView}\n                  onDeleteView={onDeleteView}\n                  onResetCurrentView={onResetCurrentView}\n                  onSaveView={onSaveView}\n                  isViewDirty={isViewDirty ?? false}\n                  showTabContextMenu={showTabContextMenu && currentViewHidden}\n                  setShowTabContextMenu={setShowTabContextMenu}\n                  lastVisibleViewElement={lastVisibleViewElement}\n                />\n              )}\n            </>\n          )}\n        </ViewsBar>\n      )}\n      <HStack align='center' spacing={Spacing[2]} justify='right'>\n        {searchProps && (\n          <ExpandedSearchInput title={null} useClearIcon {...searchProps} size='md' />\n        )}\n        {setShowFilters && (\n          <Button\n            id='table-controls__view-tab-filters'\n            variant='basic'\n            onClick={() => setShowFilters?.(!showFilters)}\n            aria-label={showFilters ? 'Hide filters' : 'Show filters'}\n            aria-expanded={showFilters}\n            aria-controls={filtersId}\n            disabled={isLoading}\n            active={showFilters}\n            width='icon'\n            size='md'\n            data-tour-target='table-filters-toggle-button'\n          >\n            <FilterIcon />\n          </Button>\n        )}\n        {propertiesButton}\n      </HStack>\n      {showFilters && filterPanel}\n    </>\n  );\n};\n\nexport default ControlBar;\n","import { type ReactNode, useMemo, useState } from 'react';\nimport { useId } from 'react-aria';\nimport styled from 'styled-components';\n\nimport { Spacing } from '@persona/design-tokens';\nimport {\n  ControlBar,\n  TableViewConfigurationDropdown,\n  type ControlBarProps,\n} from 'design-system/components/DataTable/TableControls';\nimport Stack from 'design-system/components/Stack';\n\nimport type { AttributeColumn } from './types';\n\nexport interface TableControlsProps extends ControlBarProps {\n  defaultShowFilters?: boolean;\n  className?: string;\n  tableActions?: ReactNode;\n  propertiesButton?: ReactNode;\n  isLoading?: boolean;\n\n  /**\n   * Whether to show filters always. If true, the filter row toggle button will not be rendered.\n   */\n  showFiltersAlways?: boolean;\n\n  /**\n   * Whether to display table views tab bar\n   */\n  showViews?: boolean;\n\n  /**\n   * Whether to use compact spacing and styling.\n   * The compact variant does not support views.\n   */\n  compact?: boolean;\n\n  /**\n   * Column configuration options for the table.\n   * If provided, displays a settings button to configure visible columns.\n   */\n  columnConfigurationProps?: {\n    columnConfiguration: AttributeColumn[];\n    attributeOptions: AttributeColumn[];\n    updateColumnConfiguration: (newConfiguration: AttributeColumn[]) => void;\n  };\n}\n\nconst TableControls = ({\n  filterPanel,\n  searchProps,\n  defaultShowFilters,\n  showFilters: controlledShowFilters,\n  setShowFilters: controlledSetShowFilters,\n  className,\n  tableActions,\n  propertiesButton,\n  isLoading,\n  showViews,\n  canEditViews,\n  onSelectView,\n  views,\n  currentView,\n  onAddView,\n  onViewNameChange,\n  onDuplicateView,\n  onDeleteView,\n  onSaveView,\n  isViewDirty,\n  selectedRows,\n  bulkActions,\n  onClearSelection,\n  title,\n  presetViews,\n  compact,\n  columnConfigurationProps,\n  showFiltersAlways = false,\n  onError,\n  'data-tour-target': dataTourTarget,\n}: TableControlsProps) => {\n  const filtersId = useId();\n  const [internalShowFilters, internalSetShowFilters] = useState(defaultShowFilters ?? false);\n  const showFilters = controlledShowFilters != null ? controlledShowFilters : internalShowFilters;\n  const setShowFilters =\n    controlledSetShowFilters != null ? controlledSetShowFilters : internalSetShowFilters;\n\n  // Create enhanced properties button that includes column configuration if provided\n  const enhancedPropertiesButton = useMemo(() => {\n    if (!columnConfigurationProps && !propertiesButton) {\n      return undefined;\n    }\n\n    const elements = [];\n\n    // Add original properties button if provided\n    if (propertiesButton) {\n      elements.push(propertiesButton);\n    }\n\n    // Add column configuration dropdown if provided\n    if (columnConfigurationProps) {\n      elements.push(\n        <TableViewConfigurationDropdown\n          key='column-config'\n          disabled={false}\n          {...columnConfigurationProps}\n        />,\n      );\n    }\n\n    // Return single element or fragment with multiple elements\n    if (elements.length === 1) {\n      return elements[0];\n    }\n\n    return <StyledEnhancedPropertiesButton>{elements}</StyledEnhancedPropertiesButton>;\n  }, [columnConfigurationProps, propertiesButton]);\n\n  return (\n    <Container className={className}>\n      <ControlBar\n        showViews={compact ? false : showViews}\n        views={compact ? undefined : views}\n        onSelectView={compact ? undefined : onSelectView}\n        currentView={compact ? undefined : currentView}\n        onAddView={compact ? undefined : onAddView}\n        onDeleteView={compact ? undefined : onDeleteView}\n        onDuplicateView={compact ? undefined : onDuplicateView}\n        onViewNameChange={compact ? undefined : onViewNameChange}\n        onSaveView={compact ? undefined : onSaveView}\n        isViewDirty={isViewDirty}\n        canEditViews={compact ? false : canEditViews}\n        showFilters={showFilters}\n        setShowFilters={filterPanel != null && !showFiltersAlways ? setShowFilters : undefined}\n        filtersId={filtersId}\n        searchProps={searchProps}\n        propertiesButton={enhancedPropertiesButton}\n        tableActions={tableActions}\n        isLoading={isLoading}\n        selectedRows={selectedRows}\n        bulkActions={bulkActions}\n        onClearSelection={onClearSelection}\n        title={title}\n        data-tour-target={dataTourTarget}\n        presetViews={compact ? undefined : presetViews}\n        compact={compact}\n        onError={onError}\n        filterPanel={filterPanel}\n      />\n    </Container>\n  );\n};\n\nexport default TableControls;\n\nconst Container = styled(Stack)`\n  margin-bottom: ${Spacing[2]};\n`;\n\nconst StyledEnhancedPropertiesButton = styled.div`\n  display: flex;\n  gap: ${Spacing[1]};\n`;\n","import styled, { css } from 'styled-components';\n\nimport { Color } from '@persona/design-tokens';\nimport { DragIcon } from '@persona/icons/24px';\n\n// StyledIconDrag is an IconDrag which changes color as you hover over it\nexport const StyledIconDrag = styled(DragIcon)<{\n  $active: boolean;\n  $hover?: boolean;\n  $shouldHide?: boolean;\n  $horizontal?: boolean;\n}>`\n  display: ${({ $shouldHide = false }) => ($shouldHide ? 'none' : 'inline')};\n\n  ${({ $horizontal = false }) =>\n    $horizontal\n      ? css`\n          transform: rotate(90deg);\n        `\n      : ''}\n\n  ${({ $active = false, $hover = false }) =>\n    $active\n      ? css`\n          cursor: grabbing;\n          opacity: 1;\n        `\n      : $hover\n        ? css`\n            cursor: grab;\n            opacity: 1;\n          `\n        : css`\n            cursor: normal;\n            opacity: 0.4;\n          `}\n\n  transition: opacity 0.2s ease-in-out;\n\n  path {\n    stroke: ${Color.CoreSlate1000};\n    stroke-width: 1px;\n  }\n`;\n","/**\n * reorder returns a reordered version of the inputed list by swapping the element\n * at startIndex with the one at endIndex\n */\nexport function reorder<A>(list: A[], startIndex: number, endIndex: number): A[] {\n  const result = Array.from(list);\n  const [removed] = result.splice(startIndex, 1);\n  result.splice(endIndex, 0, removed);\n\n  return result;\n}\n","import {\n  DragDropContext,\n  Draggable,\n  Droppable,\n  type DropResult,\n  type ResponderProvided,\n} from '@hello-pangea/dnd';\nimport Fuse from 'fuse.js';\nimport { union } from 'lodash/fp';\nimport { type ComponentProps, forwardRef, useMemo, useState } from 'react';\nimport styled from 'styled-components';\n\nimport { Spacing } from '@persona/design-tokens';\nimport { SettingsIcon } from '@persona/icons';\nimport Button from 'design-system/components/Button';\nimport Card from 'design-system/components/Card';\nimport { StyledIconDrag } from 'design-system/components/DataTable/dnd/StyledIconDrag';\nimport { reorder } from 'design-system/components/DataTable/dnd/utils';\nimport SearchInput from 'design-system/components/DataTable/SearchInput';\nimport Popover from 'design-system/components/Popover';\nimport Spacer from 'design-system/components/Spacer';\nimport { Label, Paragraph } from 'design-system/components/Text';\nimport Toggle from 'design-system/components/Toggle';\nimport Tooltip from 'design-system/components/Tooltip';\nimport { Z_INDICES } from 'design-system/lib/zindex';\n\nimport type { AttributeColumn } from './types';\n\nconst DndSection = styled('div')`\n  max-height: 400px;\n\n  overflow: scroll;\n  ::-webkit-scrollbar {\n    display: none;\n  }\n`;\n\nconst DndItemWrapper = styled('div')`\n  background: white;\n  width: 100%;\n  border-bottom: 1px solid ${({ theme }) => theme.color.border.secondary};\n  padding: ${Spacing[2]} ${Spacing[2]};\n\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: left;\n`;\n\nconst SuffixContainer = styled('div')`\n  padding-left: ${Spacing[2]};\n  margin-left: auto;\n  align-self: center;\n`;\n\nconst SearchContainer = styled.div`\n  display: flex;\n`;\n\nconst StyledSearchInput = styled(SearchInput)`\n  width: 100%;\n`;\n\nconst PopoverCard = styled(Card)`\n  width: 300px;\n  padding: ${Spacing[4]};\n`;\n\nconst TriggerIconButton = forwardRef<HTMLButtonElement, ComponentProps<typeof Button>>(\n  function TriggerIconButton({ disabled, ...elemProps }, ref) {\n    return (\n      <Button\n        disabled={disabled}\n        width='icon'\n        variant='basic'\n        size='md'\n        {...elemProps}\n        ref={ref}\n        data-tour-target='table-properties-button'\n        aria-label='Table Properties'\n      >\n        <SettingsIcon />\n      </Button>\n    );\n  },\n);\n\nconst TooltipButtonWrapper = styled('div')`\n  display: inline-block;\n`;\n\nexport interface TableViewConfigurationDropdownProps extends TableViewConfigurationProps {\n  disabled: boolean;\n  disabledTooltipMessage?: string;\n  size?: 'sm' | 'md';\n  variant?: 'basic' | 'text';\n}\n\nconst TableViewConfigurationDropdown = ({\n  disabled = false,\n  disabledTooltipMessage = 'Your role does not have permission to configure the view.',\n  size = 'md',\n  variant = 'basic',\n  ...props\n}: TableViewConfigurationDropdownProps) => {\n  return disabled ? (\n    <Tooltip\n      trigger={\n        // NB: this wrapping div is needed to properly display the tooltip. The library we're using, floating-ui\n        // doesn't support displaying tooltips on disabled buttons.\n        <TooltipButtonWrapper>\n          <TriggerIconButton disabled={true} size={size} variant={variant} />\n        </TooltipButtonWrapper>\n      }\n    >\n      {disabledTooltipMessage}\n    </Tooltip>\n  ) : (\n    <Popover>\n      <Popover.Trigger asChild>\n        <TriggerIconButton disabled={false} size={size} variant={variant} />\n      </Popover.Trigger>\n      <Popover.Content\n        style={{ zIndex: Z_INDICES.dropdown }}\n        sideOffset={8}\n        side='bottom'\n        align='end'\n      >\n        <PopoverCard elevated>\n          <TableViewConfiguration {...props} />\n        </PopoverCard>\n      </Popover.Content>\n    </Popover>\n  );\n};\n\nexport interface TableViewConfigurationProps {\n  columnConfiguration: AttributeColumn[];\n  attributeOptions: AttributeColumn[];\n  updateColumnConfiguration: (newConfiguration: AttributeColumn[]) => void;\n  getColumnDisabled?: (columnId: string, shownColumnIds: string[]) => boolean;\n}\n\nexport const TableViewConfiguration = ({\n  columnConfiguration,\n  attributeOptions,\n  updateColumnConfiguration,\n  getColumnDisabled,\n}: TableViewConfigurationProps) => {\n  const [searchTerm, setSearchTerm] = useState<string>('');\n\n  const fuse = useMemo(() => {\n    const fuseOptions = {\n      shouldSort: false,\n      threshold: 0.4,\n      location: 0,\n      distance: 100,\n      minMatchCharLength: 1,\n      keys: [{ name: 'label', weight: 1.0 }],\n    };\n    return new Fuse(attributeOptions, fuseOptions);\n  }, [attributeOptions]);\n\n  // NB: we do this to make sure that attributes that exist in the column configuration but NOT the standardized options still show up in the menu.\n  // Options are deduped.\n  const allOptions = useMemo(\n    () => union(attributeOptions, columnConfiguration),\n    [attributeOptions, columnConfiguration],\n  );\n\n  const filteredSearchOptions =\n    searchTerm === '' ? allOptions : fuse.search(searchTerm).map(({ item }) => item);\n\n  const hiddenAttributes = useMemo(() => {\n    return filteredSearchOptions.filter((attribute) => {\n      const columnConfigurationKeys = columnConfiguration.map((c) => c.key);\n      return !columnConfigurationKeys.includes(attribute.key);\n    });\n  }, [columnConfiguration, filteredSearchOptions]);\n\n  const filteredShownAttributes = useMemo(() => {\n    return columnConfiguration.filter((column) =>\n      filteredSearchOptions.map((o) => o.key).includes(column.key),\n    );\n  }, [columnConfiguration, filteredSearchOptions]);\n\n  const handleDragEnd = (result: DropResult, _provided: ResponderProvided) => {\n    const { destination, source } = result;\n    if (\n      !destination ||\n      (destination.droppableId === source.droppableId && destination.index === source.index)\n    ) {\n      return;\n    }\n\n    const reorderedColumns = reorder(columnConfiguration, source.index, destination.index);\n    updateColumnConfiguration(reorderedColumns);\n  };\n\n  const generateShownAttributesToggle = (column: AttributeColumn) => () => {\n    const updatedAttributes = columnConfiguration.filter((a) => a.key !== column.key);\n    updateColumnConfiguration(updatedAttributes);\n  };\n\n  const generateHiddenAttributesToggle = (column: AttributeColumn) => () => {\n    const updatedAttributes = columnConfiguration.concat(column);\n    updateColumnConfiguration(updatedAttributes);\n  };\n\n  const shownColumnIds = useMemo(() => {\n    return columnConfiguration.map((c) => c.key);\n  }, [columnConfiguration]);\n\n  const shownDndItemProps: AttributeDndProps[] = filteredShownAttributes.map((column, index) => {\n    const isDisabledByDefault = columnConfiguration.length === 1;\n    const isDisabledByCustom = getColumnDisabled?.(column.key, shownColumnIds) ?? false;\n    const shouldDisableDragForColumn =\n      isDisabledByCustom && index === filteredShownAttributes.length - 1;\n    const result: AttributeDndProps = {\n      column: column,\n      index: index,\n      isDisabled: isDisabledByDefault || isDisabledByCustom,\n      isToggled: true,\n      shouldDisableDrag: shouldDisableDragForColumn,\n      handleToggle: generateShownAttributesToggle(column),\n    };\n    return result;\n  });\n\n  const hiddenDndItemProps: AttributeDndProps[] = hiddenAttributes.map((column, index) => {\n    const result: AttributeDndProps = {\n      column: column,\n      index: index,\n      isToggled: false,\n      shouldDisableDrag: true,\n      handleToggle: generateHiddenAttributesToggle(column),\n    };\n    return result;\n  });\n\n  return (\n    <div>\n      <Label size='lg' weight='bold'>\n        Configure columns\n      </Label>\n      <Spacer height={2} />\n      <SearchContainer>\n        <StyledSearchInput\n          title={null}\n          value={searchTerm}\n          handleInput={setSearchTerm}\n          size='md'\n          placeholder='Search by item...'\n          dataTest='checklist-item-panel-item-table__search'\n        />\n      </SearchContainer>\n      <Spacer height={2} />\n      {shownDndItemProps.length > 0 || hiddenDndItemProps.length > 0 ? (\n        <DndSection>\n          {shownDndItemProps.length > 0 && (\n            <div>\n              <Paragraph>Shown attributes</Paragraph>\n              {/* Issue with @hello-pangea/dnd and transformed parent elements: https://github.com/hello-pangea/dnd/blob/main/docs/guides/reparenting.md\n            We have to use the renderClone API to get the dragging working correctly. This has to do with one of the parent elements being a Popover. */}\n              <DragDropContext onDragEnd={handleDragEnd}>\n                <Droppable\n                  droppableId='cases-view__configure-shown-columns'\n                  renderClone={(provided, _snapshot, rubric) => {\n                    return (\n                      <div\n                        {...provided.draggableProps}\n                        {...provided.dragHandleProps}\n                        ref={provided.innerRef}\n                      >\n                        <AttributeDnd {...shownDndItemProps[rubric.source.index]} />\n                      </div>\n                    );\n                  }}\n                >\n                  {(provided) => {\n                    return (\n                      <div ref={provided.innerRef} {...provided.droppableProps}>\n                        {shownDndItemProps.map((props, idx) => {\n                          return (\n                            <Draggable\n                              key={`${props.column.key}`}\n                              draggableId={props.column.key}\n                              index={idx}\n                              isDragDisabled={props.shouldDisableDrag}\n                            >\n                              {(provided) => {\n                                return (\n                                  <div\n                                    ref={provided.innerRef}\n                                    {...provided.draggableProps}\n                                    {...provided.dragHandleProps}\n                                  >\n                                    <AttributeDnd {...props} />\n                                  </div>\n                                );\n                              }}\n                            </Draggable>\n                          );\n                        })}\n                        {provided.placeholder}\n                      </div>\n                    );\n                  }}\n                </Droppable>\n              </DragDropContext>\n            </div>\n          )}\n          <Spacer height={2} />\n          {hiddenDndItemProps.length > 0 && (\n            <div>\n              <Paragraph>Hidden attributes</Paragraph>\n              <DragDropContext onDragEnd={handleDragEnd}>\n                <Droppable\n                  droppableId='cases-view__configure-hidden-columns'\n                  renderClone={(provided, _snapshot, rubric) => {\n                    return (\n                      <div\n                        {...provided.draggableProps}\n                        {...provided.dragHandleProps}\n                        ref={provided.innerRef}\n                      >\n                        <AttributeDnd {...hiddenDndItemProps[rubric.source.index]} />\n                      </div>\n                    );\n                  }}\n                >\n                  {(provided) => {\n                    return (\n                      <div ref={provided.innerRef} {...provided.droppableProps}>\n                        {hiddenDndItemProps.map((props, idx) => {\n                          return (\n                            <Draggable\n                              key={`${props.column.key}`}\n                              draggableId={props.column.key}\n                              index={idx}\n                              isDragDisabled={props.shouldDisableDrag}\n                            >\n                              {(provided) => {\n                                return (\n                                  <div\n                                    ref={provided.innerRef}\n                                    {...provided.draggableProps}\n                                    {...provided.dragHandleProps}\n                                  >\n                                    <AttributeDnd {...props} />\n                                  </div>\n                                );\n                              }}\n                            </Draggable>\n                          );\n                        })}\n                        {provided.placeholder}\n                      </div>\n                    );\n                  }}\n                </Droppable>\n              </DragDropContext>\n            </div>\n          )}\n        </DndSection>\n      ) : (\n        <div>\n          <Paragraph>No matching attributes</Paragraph>\n        </div>\n      )}\n    </div>\n  );\n};\n\nconst OverflowText = styled('div')`\n  max-width: 160px;\n  flex-wrap: wrap;\n  display: flex;\n`;\n\ninterface AttributeDndProps {\n  column: AttributeColumn;\n  index: number;\n  isDisabled?: boolean;\n  isToggled: boolean;\n  shouldDisableDrag: boolean;\n  handleToggle: () => void;\n}\n\nconst AttributeDnd = ({\n  column,\n  index,\n  isDisabled = false,\n  isToggled,\n  shouldDisableDrag,\n  handleToggle,\n}: AttributeDndProps) => {\n  return (\n    <DndItemWrapper key={`${column.key}-${index}`}>\n      <StyledIconDrag $active $shouldHide={shouldDisableDrag} />\n      <OverflowText>\n        <Paragraph color='primary' size='sm'>\n          {column.label}\n        </Paragraph>\n      </OverflowText>\n      <SuffixContainer>\n        <Toggle\n          value={isToggled}\n          disabled={isDisabled}\n          onChange={handleToggle}\n          aria-label={isToggled ? `Hide ${column.label}` : `Show ${column.label}`}\n        />\n      </SuffixContainer>\n    </DndItemWrapper>\n  );\n};\n\nexport default TableViewConfigurationDropdown;\n","import { type ReactNode, createElement, createContext, useContext } from 'react';\n\nimport type { BaseActiveFilter, BaseFilterConfig } from './types';\n\nexport interface TableControlsContextProps<\n  TFilter extends BaseFilterConfig = BaseFilterConfig,\n  TActiveFilter extends BaseActiveFilter<TFilter> = BaseActiveFilter<TFilter>,\n> {\n  filters: TFilter[];\n  activeFilters: TActiveFilter[];\n  setActiveFilters: (filters: TActiveFilter[]) => void;\n}\n\nconst TableControlsContext = createContext<TableControlsContextProps>({\n  filters: [],\n  activeFilters: [],\n  setActiveFilters: () => {},\n});\n\nexport function useTableControls<\n  TFilter extends BaseFilterConfig = BaseFilterConfig,\n  TActiveFilter extends BaseActiveFilter<TFilter> = BaseActiveFilter<TFilter>,\n>(): TableControlsContextProps<TFilter, TActiveFilter> {\n  return useContext(TableControlsContext) as unknown as TableControlsContextProps<\n    TFilter,\n    TActiveFilter\n  >;\n}\n\nexport function TableControlsProvider<\n  TFilter extends BaseFilterConfig = BaseFilterConfig,\n  TActiveFilter extends BaseActiveFilter<TFilter> = BaseActiveFilter<TFilter>,\n>({\n  children,\n  ...value\n}: TableControlsContextProps<TFilter, TActiveFilter> & { children: ReactNode }) {\n  return createElement(\n    TableControlsContext.Provider,\n    { value: value as unknown as TableControlsContextProps },\n    children,\n  );\n}\n\nexport default TableControlsContext;\n"],"mappings":"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"}