@strapi/content-manager 0.0.0-next.5007ea441db2bdbc04f35e1169b3798c068f5d46 → 0.0.0-next.51dcef446efe662f00da6d85d6bea2218c4c538e

package/dist/_chunks/ListConfigurationPage-JPWZz7Kg.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"ListConfigurationPage-JPWZz7Kg.mjs","sources":["../../admin/src/pages/ListConfiguration/components/Header.tsx","../../admin/src/pages/ListConfiguration/components/Settings.tsx","../../admin/src/pages/ListConfiguration/components/EditFieldForm.tsx","../../admin/src/pages/ListConfiguration/components/DraggableCard.tsx","../../admin/src/pages/ListConfiguration/components/SortDisplayedFields.tsx","../../admin/src/pages/ListConfiguration/ListConfigurationPage.tsx"],"sourcesContent":["import { useForm, BackButton, Layouts } from '@strapi/admin/strapi-admin';\nimport { Button } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\n\nimport { capitalise } from '../../../utils/strings';\nimport { getTranslation } from '../../../utils/translations';\n\ninterface HeaderProps {\n  collectionType: string;\n  name: string;\n  model: string;\n}\n\nconst Header = ({ name }: HeaderProps) => {\n  const { formatMessage } = useIntl();\n\n  const modified = useForm('Header', (state) => state.modified);\n  const isSubmitting = useForm('Header', (state) => state.isSubmitting);\n\n  return (\n    <Layouts.Header\n      navigationAction={<BackButton />}\n      primaryAction={\n        <Button size=\"S\" disabled={!modified} type=\"submit\" loading={isSubmitting}>\n          {formatMessage({ id: 'global.save', defaultMessage: 'Save' })}\n        </Button>\n      }\n      subtitle={formatMessage({\n        id: getTranslation('components.SettingsViewWrapper.pluginHeader.description.list-settings'),\n        defaultMessage: 'Define the settings of the list view.',\n      })}\n      title={formatMessage(\n        {\n          id: getTranslation('components.SettingsViewWrapper.pluginHeader.title'),\n          defaultMessage: 'Configure the view - {name}',\n        },\n        { name: capitalise(name) }\n      )}\n    />\n  );\n};\n\nexport { Header };\nexport type { HeaderProps };\n","import * as React from 'react';\n\nimport { useForm, InputRenderer, type InputProps } from '@strapi/admin/strapi-admin';\nimport { Flex, Grid, Typography, useCollator } from '@strapi/design-system';\nimport { type MessageDescriptor, useIntl } from 'react-intl';\n\nimport { useDoc } from '../../../hooks/useDocument';\nimport { type EditFieldLayout } from '../../../hooks/useDocumentLayout';\nimport { getTranslation } from '../../../utils/translations';\nimport { type FormData } from '../ListConfigurationPage';\n\nimport type { DistributiveOmit } from 'react-redux';\n\nexport type InputPropsWithMessageDescriptors = DistributiveOmit<\n  InputProps,\n  'hint' | 'label' | 'placeholder'\n> & {\n  hint?: MessageDescriptor;\n  label: MessageDescriptor;\n  placeholder?: MessageDescriptor;\n};\n\n/**\n * @internal\n * @description Form inputs are always displayed in a grid, so we need\n * to use the size property to determine how many columns the input should\n * take up.\n */\nexport type FormLayoutInputProps = InputPropsWithMessageDescriptors & { size: number };\n\nconst EXCLUDED_SORT_ATTRIBUTE_TYPES = [\n  'media',\n  'richtext',\n  'dynamiczone',\n  'relation',\n  'component',\n  'json',\n  'blocks',\n];\n\ninterface SortOption {\n  value: string;\n  label: string;\n}\n\nconst Settings = () => {\n  const { formatMessage, locale } = useIntl();\n  const formatter = useCollator(locale, {\n    sensitivity: 'base',\n  });\n  const { schema } = useDoc();\n\n  const layout = useForm<FormData['layout']>('Settings', (state) => state.values.layout ?? []);\n  const currentSortBy = useForm<FormData['settings']['defaultSortBy']>(\n    'Settings',\n    (state) => state.values.settings.defaultSortBy\n  );\n  const onChange = useForm('Settings', (state) => state.onChange);\n\n  const sortOptions = React.useMemo(\n    () =>\n      Object.values(layout).reduce<SortOption[]>((acc, field) => {\n        if (schema && !EXCLUDED_SORT_ATTRIBUTE_TYPES.includes(schema.attributes[field.name].type)) {\n          acc.push({\n            value: field.name,\n            label: typeof field.label !== 'string' ? formatMessage(field.label) : field.label,\n          });\n        }\n\n        return acc;\n      }, []),\n    [formatMessage, layout, schema]\n  );\n\n  const sortOptionsSorted = sortOptions.sort((a, b) => formatter.compare(a.label, b.label));\n\n  React.useEffect(() => {\n    if (sortOptionsSorted.findIndex((opt) => opt.value === currentSortBy) === -1) {\n      onChange('settings.defaultSortBy', sortOptionsSorted[0]?.value);\n    }\n  }, [currentSortBy, onChange, sortOptionsSorted]);\n\n  const formLayout = React.useMemo(\n    () =>\n      SETTINGS_FORM_LAYOUT.map((row) =>\n        row.map((field) => {\n          if (field.type === 'enumeration') {\n            return {\n              ...field,\n              hint: field.hint ? formatMessage(field.hint) : undefined,\n              label: formatMessage(field.label),\n              options: field.name === 'settings.defaultSortBy' ? sortOptionsSorted : field.options,\n            };\n          } else {\n            return {\n              ...field,\n              hint: field.hint ? formatMessage(field.hint) : undefined,\n              label: formatMessage(field.label),\n            };\n          }\n        })\n      ) as [top: EditFieldLayout[], bottom: EditFieldLayout[]],\n    [formatMessage, sortOptionsSorted]\n  );\n\n  return (\n    <Flex direction=\"column\" alignItems=\"stretch\" gap={4}>\n      <Typography variant=\"delta\" tag=\"h2\">\n        {formatMessage({\n          id: getTranslation('containers.SettingPage.settings'),\n          defaultMessage: 'Settings',\n        })}\n      </Typography>\n      <Grid.Root key=\"bottom\" gap={4}>\n        {formLayout.map((row) =>\n          row.map(({ size, ...field }) => (\n            <Grid.Item key={field.name} s={12} col={size} direction=\"column\" alignItems=\"stretch\">\n              {/* @ts-expect-error – issue with EnumerationProps conflicting with InputProps */}\n              <InputRenderer {...field} />\n            </Grid.Item>\n          ))\n        )}\n      </Grid.Root>\n    </Flex>\n  );\n};\n\nconst SETTINGS_FORM_LAYOUT: FormLayoutInputProps[][] = [\n  [\n    {\n      label: {\n        id: getTranslation('form.Input.search'),\n        defaultMessage: 'Enable search',\n      },\n      name: 'settings.searchable',\n      size: 4,\n      type: 'boolean' as const,\n    },\n    {\n      label: {\n        id: getTranslation('form.Input.filters'),\n        defaultMessage: 'Enable filters',\n      },\n      name: 'settings.filterable',\n      size: 4,\n      type: 'boolean' as const,\n    },\n    {\n      label: {\n        id: getTranslation('form.Input.bulkActions'),\n        defaultMessage: 'Enable bulk actions',\n      },\n      name: 'settings.bulkable',\n      size: 4,\n      type: 'boolean' as const,\n    },\n  ],\n  [\n    {\n      hint: {\n        id: getTranslation('form.Input.pageEntries.inputDescription'),\n        defaultMessage: 'Note: You can override this value in the Collection Type settings page.',\n      },\n      label: {\n        id: getTranslation('form.Input.pageEntries'),\n        defaultMessage: 'Entries per page',\n      },\n      name: 'settings.pageSize',\n      options: ['10', '20', '50', '100'].map((value) => ({ value, label: value })),\n      size: 6,\n      type: 'enumeration' as const,\n    },\n    {\n      label: {\n        id: getTranslation('form.Input.defaultSort'),\n        defaultMessage: 'Default sort attribute',\n      },\n      name: 'settings.defaultSortBy',\n      options: [],\n      size: 3,\n      type: 'enumeration' as const,\n    },\n    {\n      label: {\n        id: getTranslation('form.Input.sort.order'),\n        defaultMessage: 'Default sort order',\n      },\n      name: 'settings.defaultSortOrder',\n      options: ['ASC', 'DESC'].map((value) => ({ value, label: value })),\n      size: 3,\n      type: 'enumeration' as const,\n    },\n  ],\n];\n\nexport { Settings };\n","import { Form, useField, InputRenderer, useNotification } from '@strapi/admin/strapi-admin';\nimport { Button, Flex, FlexComponent, Grid, Modal } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\nimport * as yup from 'yup';\n\nimport { FieldTypeIcon } from '../../../components/FieldTypeIcon';\nimport { capitalise } from '../../../utils/strings';\nimport { getTranslation } from '../../../utils/translations';\n\nimport type { ListFieldLayout } from '../../../hooks/useDocumentLayout';\nimport type { FormData } from '../ListConfigurationPage';\n\ninterface EditFieldFormProps extends Pick<ListFieldLayout, 'attribute'> {\n  name: string;\n  onClose: () => void;\n}\n\nconst FIELD_SCHEMA = yup.object().shape({\n  label: yup.string().required(),\n  sortable: yup.boolean(),\n});\n\nconst EditFieldForm = ({ attribute, name, onClose }: EditFieldFormProps) => {\n  const { formatMessage } = useIntl();\n  const { toggleNotification } = useNotification();\n\n  const { value, onChange } = useField<FormData['layout'][number]>(name);\n\n  if (!value) {\n    // This is very unlikely to happen, but it ensures the form is not opened without a value.\n    console.error(\n      \"You've opened a field to edit without it being part of the form, this is likely a bug with Strapi. Please open an issue.\"\n    );\n\n    toggleNotification({\n      message: formatMessage({\n        id: 'content-manager.containers.list-settings.modal-form.error',\n        defaultMessage: 'An error occurred while trying to open the form.',\n      }),\n      type: 'danger',\n    });\n\n    return null;\n  }\n\n  let shouldDisplaySortToggle = !['media', 'relation'].includes(attribute.type);\n\n  if ('relation' in attribute && ['oneWay', 'oneToOne', 'manyToOne'].includes(attribute.relation)) {\n    shouldDisplaySortToggle = true;\n  }\n\n  return (\n    <Modal.Content>\n      <Form\n        method=\"PUT\"\n        initialValues={value}\n        validationSchema={FIELD_SCHEMA}\n        onSubmit={(data) => {\n          onChange(name, data);\n          onClose();\n        }}\n      >\n        <Modal.Header>\n          <HeaderContainer>\n            {/* @ts-expect-error attribute.type === custom does not work here */}\n            <FieldTypeIcon type={attribute.type} />\n            <Modal.Title>\n              {formatMessage(\n                {\n                  id: getTranslation('containers.list-settings.modal-form.label'),\n                  defaultMessage: 'Edit {fieldName}',\n                },\n                { fieldName: capitalise(value.label) }\n              )}\n            </Modal.Title>\n          </HeaderContainer>\n        </Modal.Header>\n        <Modal.Body>\n          <Grid.Root gap={4}>\n            {[\n              {\n                name: 'label',\n                label: formatMessage({\n                  id: getTranslation('form.Input.label'),\n                  defaultMessage: 'Label',\n                }),\n                hint: formatMessage({\n                  id: getTranslation('form.Input.label.inputDescription'),\n                  defaultMessage: \"This value overrides the label displayed in the table's head\",\n                }),\n                size: 6,\n                type: 'string' as const,\n              },\n              {\n                label: formatMessage({\n                  id: getTranslation('form.Input.sort.field'),\n                  defaultMessage: 'Enable sort on this field',\n                }),\n                name: 'sortable',\n                size: 6,\n                type: 'boolean' as const,\n              },\n            ]\n              .filter(\n                (field) =>\n                  field.name !== 'sortable' ||\n                  (field.name === 'sortable' && shouldDisplaySortToggle)\n              )\n              .map(({ size, ...field }) => (\n                <Grid.Item\n                  key={field.name}\n                  s={12}\n                  col={size}\n                  direction=\"column\"\n                  alignItems=\"stretch\"\n                >\n                  <InputRenderer {...field} />\n                </Grid.Item>\n              ))}\n          </Grid.Root>\n        </Modal.Body>\n        <Modal.Footer>\n          <Button onClick={onClose} variant=\"tertiary\">\n            {formatMessage({ id: 'app.components.Button.cancel', defaultMessage: 'Cancel' })}\n          </Button>\n          <Button type=\"submit\">\n            {formatMessage({ id: 'global.finish', defaultMessage: 'Finish' })}\n          </Button>\n        </Modal.Footer>\n      </Form>\n    </Modal.Content>\n  );\n};\n\nconst HeaderContainer = styled<FlexComponent>(Flex)`\n  svg {\n    width: 3.2rem;\n    margin-right: ${({ theme }) => theme.spaces[3]};\n  }\n`;\n\nexport { EditFieldForm };\nexport type { EditFieldFormProps };\n","import * as React from 'react';\n\nimport {\n  Box,\n  BoxComponent,\n  Flex,\n  FlexComponent,\n  Modal,\n  Typography,\n  useComposedRefs,\n} from '@strapi/design-system';\nimport { Cross, Drag, Pencil } from '@strapi/icons';\nimport { getEmptyImage } from 'react-dnd-html5-backend';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { CardDragPreview } from '../../../components/DragPreviews/CardDragPreview';\nimport { ItemTypes } from '../../../constants/dragAndDrop';\nimport { useDragAndDrop } from '../../../hooks/useDragAndDrop';\nimport { getTranslation } from '../../../utils/translations';\n\nimport { EditFieldForm } from './EditFieldForm';\n\nimport type { ListFieldLayout } from '../../../hooks/useDocumentLayout';\n\ntype DraggableCardProps = Omit<ListFieldLayout, 'label'> & {\n  label: string;\n  index: number;\n  isDraggingSibling: boolean;\n  onMoveField: (dragIndex: number, hoverIndex: number) => void;\n  onRemoveField: () => void;\n  setIsDraggingSibling: (isDragging: boolean) => void;\n};\n\nconst DraggableCard = ({\n  attribute,\n  index,\n  isDraggingSibling,\n  label,\n  name,\n  onMoveField,\n  onRemoveField,\n  setIsDraggingSibling,\n}: DraggableCardProps) => {\n  const [isModalOpen, setIsModalOpen] = React.useState(false);\n  const { formatMessage } = useIntl();\n  const [, forceRerenderAfterDnd] = React.useState(false);\n\n  const [{ isDragging }, objectRef, dropRef, dragRef, dragPreviewRef] = useDragAndDrop(true, {\n    type: ItemTypes.FIELD,\n    item: { index, label, name },\n    index,\n    onMoveItem: onMoveField,\n    onEnd: () => setIsDraggingSibling(false),\n  });\n\n  React.useEffect(() => {\n    dragPreviewRef(getEmptyImage(), { captureDraggingState: false });\n  }, [dragPreviewRef]);\n\n  React.useEffect(() => {\n    if (isDragging) {\n      setIsDraggingSibling(true);\n    }\n  }, [isDragging, setIsDraggingSibling]);\n\n  // Effect in order to force a rerender after reordering the components\n  // Since we are removing the Accordion when doing the DnD  we are losing the dragRef, therefore the replaced element cannot be dragged\n  // anymore, this hack forces a rerender in order to apply the dragRef\n  React.useEffect(() => {\n    if (!isDraggingSibling) {\n      forceRerenderAfterDnd((prev) => !prev);\n    }\n  }, [isDraggingSibling]);\n\n  const composedRefs = useComposedRefs<HTMLButtonElement>(\n    dropRef,\n    objectRef as React.RefObject<HTMLButtonElement>\n  );\n\n  return (\n    <FieldWrapper ref={composedRefs}>\n      {isDragging && <CardDragPreview label={label} />}\n      {!isDragging && isDraggingSibling && <CardDragPreview isSibling label={label} />}\n\n      {!isDragging && !isDraggingSibling && (\n        <FieldContainer\n          borderColor=\"neutral150\"\n          background=\"neutral100\"\n          hasRadius\n          justifyContent=\"space-between\"\n          onClick={() => setIsModalOpen(true)}\n        >\n          <Flex gap={3}>\n            <DragButton\n              ref={dragRef}\n              aria-label={formatMessage(\n                {\n                  id: getTranslation('components.DraggableCard.move.field'),\n                  defaultMessage: 'Move {item}',\n                },\n                { item: label }\n              )}\n              onClick={(e) => e.stopPropagation()}\n            >\n              <Drag />\n            </DragButton>\n            <Typography fontWeight=\"bold\">{label}</Typography>\n          </Flex>\n          <Flex paddingLeft={3} onClick={(e) => e.stopPropagation()}>\n            <Modal.Root open={isModalOpen} onOpenChange={setIsModalOpen}>\n              <Modal.Trigger>\n                <ActionButton\n                  onClick={(e) => {\n                    e.stopPropagation();\n                  }}\n                  aria-label={formatMessage(\n                    {\n                      id: getTranslation('components.DraggableCard.edit.field'),\n                      defaultMessage: 'Edit {item}',\n                    },\n                    { item: label }\n                  )}\n                  type=\"button\"\n                >\n                  <Pencil width=\"1.2rem\" height=\"1.2rem\" />\n                </ActionButton>\n              </Modal.Trigger>\n              <EditFieldForm\n                attribute={attribute}\n                name={`layout.${index}`}\n                onClose={() => {\n                  setIsModalOpen(false);\n                }}\n              />\n            </Modal.Root>\n            <ActionButton\n              onClick={onRemoveField}\n              data-testid={`delete-${name}`}\n              aria-label={formatMessage(\n                {\n                  id: getTranslation('components.DraggableCard.delete.field'),\n                  defaultMessage: 'Delete {item}',\n                },\n                { item: label }\n              )}\n              type=\"button\"\n            >\n              <Cross width=\"1.2rem\" height=\"1.2rem\" />\n            </ActionButton>\n          </Flex>\n        </FieldContainer>\n      )}\n    </FieldWrapper>\n  );\n};\n\nconst ActionButton = styled.button`\n  display: flex;\n  align-items: center;\n  height: ${({ theme }) => theme.spaces[7]};\n  color: ${({ theme }) => theme.colors.neutral600};\n\n  &:hover {\n    color: ${({ theme }) => theme.colors.neutral700};\n  }\n\n  &:last-child {\n    padding: 0 ${({ theme }) => theme.spaces[3]};\n  }\n`;\n\nconst DragButton = styled(ActionButton)`\n  padding: 0 ${({ theme }) => theme.spaces[3]};\n  border-right: 1px solid ${({ theme }) => theme.colors.neutral150};\n  cursor: all-scroll;\n`;\n\nconst FieldContainer = styled<FlexComponent>(Flex)`\n  max-height: 3.2rem;\n  cursor: pointer;\n`;\n\nconst FieldWrapper = styled<BoxComponent>(Box)`\n  &:last-child {\n    padding-right: ${({ theme }) => theme.spaces[3]};\n  }\n`;\n\nexport { DraggableCard };\nexport type { DraggableCardProps };\n","import * as React from 'react';\n\nimport { useForm } from '@strapi/admin/strapi-admin';\nimport { Box, Flex, VisuallyHidden, Typography, Menu } from '@strapi/design-system';\nimport { Plus } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\n\nimport { useDoc } from '../../../hooks/useDocument';\nimport { useGetContentTypeConfigurationQuery } from '../../../services/contentTypes';\nimport { checkIfAttributeIsDisplayable } from '../../../utils/attributes';\nimport { getTranslation } from '../../../utils/translations';\n\nimport { DraggableCard, DraggableCardProps } from './DraggableCard';\n\nimport type { ListLayout } from '../../../hooks/useDocumentLayout';\nimport type { FormData } from '../ListConfigurationPage';\n\ninterface SortDisplayedFieldsProps extends Pick<ListLayout, 'layout'> {}\n\nconst SortDisplayedFields = () => {\n  const { formatMessage } = useIntl();\n  const { model, schema } = useDoc();\n  const [isDraggingSibling, setIsDraggingSibling] = React.useState(false);\n  const [lastAction, setLastAction] = React.useState<string | null>(null);\n  const scrollableContainerRef = React.useRef<HTMLDivElement>(null);\n\n  const values = useForm<FormData['layout']>(\n    'SortDisplayedFields',\n    (state) => state.values.layout ?? []\n  );\n  const addFieldRow = useForm('SortDisplayedFields', (state) => state.addFieldRow);\n  const removeFieldRow = useForm('SortDisplayedFields', (state) => state.removeFieldRow);\n  const moveFieldRow = useForm('SortDisplayedFields', (state) => state.moveFieldRow);\n\n  const { metadata: allMetadata } = useGetContentTypeConfigurationQuery(model, {\n    selectFromResult: ({ data }) => ({ metadata: data?.contentType.metadatas ?? {} }),\n  });\n\n  /**\n   * This is our list of fields that are not displayed in the current layout\n   * so we create their default state to be added to the layout.\n   */\n  const nonDisplayedFields = React.useMemo(() => {\n    if (!schema) {\n      return [];\n    }\n\n    const displayedFieldNames = values.map((field) => field.name);\n\n    return Object.entries(schema.attributes).reduce<Array<FormData['layout'][number]>>(\n      (acc, [name, attribute]) => {\n        if (!displayedFieldNames.includes(name) && checkIfAttributeIsDisplayable(attribute)) {\n          const { list: metadata } = allMetadata[name];\n\n          acc.push({\n            name,\n            label: metadata.label || name,\n            sortable: metadata.sortable,\n          });\n        }\n\n        return acc;\n      },\n      []\n    );\n  }, [allMetadata, values, schema]);\n\n  const handleAddField = (field: FormData['layout'][number]) => {\n    setLastAction('add');\n    addFieldRow('layout', field);\n  };\n\n  const handleRemoveField = (index: number) => {\n    setLastAction('remove');\n    removeFieldRow('layout', index);\n  };\n\n  const handleMoveField: DraggableCardProps['onMoveField'] = (dragIndex, hoverIndex) => {\n    moveFieldRow('layout', dragIndex, hoverIndex);\n  };\n\n  React.useEffect(() => {\n    if (lastAction === 'add' && scrollableContainerRef?.current) {\n      scrollableContainerRef.current.scrollLeft = scrollableContainerRef.current.scrollWidth;\n    }\n  }, [lastAction]);\n\n  return (\n    <Flex alignItems=\"stretch\" direction=\"column\" gap={4}>\n      <Typography variant=\"delta\" tag=\"h2\">\n        {formatMessage({\n          id: getTranslation('containers.SettingPage.view'),\n          defaultMessage: 'View',\n        })}\n      </Typography>\n\n      <Flex padding={4} borderColor=\"neutral300\" borderStyle=\"dashed\" borderWidth=\"1px\" hasRadius>\n        <Box flex=\"1\" overflow=\"auto hidden\" ref={scrollableContainerRef}>\n          <Flex gap={3}>\n            {values.map((field, index) => (\n              <DraggableCard\n                key={field.name}\n                index={index}\n                isDraggingSibling={isDraggingSibling}\n                onMoveField={handleMoveField}\n                onRemoveField={() => handleRemoveField(index)}\n                setIsDraggingSibling={setIsDraggingSibling}\n                {...field}\n                attribute={schema!.attributes[field.name]}\n                label={typeof field.label === 'object' ? formatMessage(field.label) : field.label}\n              />\n            ))}\n          </Flex>\n        </Box>\n\n        <Menu.Root>\n          <Menu.Trigger\n            paddingLeft={2}\n            paddingRight={2}\n            justifyContent=\"center\"\n            endIcon={null}\n            disabled={nonDisplayedFields.length === 0}\n            variant=\"tertiary\"\n          >\n            <VisuallyHidden tag=\"span\">\n              {formatMessage({\n                id: getTranslation('components.FieldSelect.label'),\n                defaultMessage: 'Add a field',\n              })}\n            </VisuallyHidden>\n            <Plus aria-hidden focusable={false} style={{ position: 'relative', top: 2 }} />\n          </Menu.Trigger>\n          <Menu.Content>\n            {nonDisplayedFields.map((field) => (\n              <Menu.Item key={field.name} onSelect={() => handleAddField(field)}>\n                {typeof field.label === 'object' ? formatMessage(field.label) : field.label}\n              </Menu.Item>\n            ))}\n          </Menu.Content>\n        </Menu.Root>\n      </Flex>\n    </Flex>\n  );\n};\n\nexport { SortDisplayedFields };\nexport type { SortDisplayedFieldsProps };\n","import * as React from 'react';\n\nimport {\n  Form,\n  type FormProps,\n  useNotification,\n  useTracking,\n  useAPIErrorHandler,\n  Page,\n  Layouts,\n} from '@strapi/admin/strapi-admin';\nimport { Divider, Flex, Main } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\nimport { Navigate } from 'react-router-dom';\n\nimport { SINGLE_TYPES } from '../../constants/collections';\nimport { useDoc } from '../../hooks/useDocument';\nimport { ListFieldLayout, ListLayout, useDocLayout } from '../../hooks/useDocumentLayout';\nimport { useTypedSelector } from '../../modules/hooks';\nimport { useUpdateContentTypeConfigurationMutation } from '../../services/contentTypes';\nimport { setIn } from '../../utils/objects';\n\nimport { Header } from './components/Header';\nimport { Settings } from './components/Settings';\nimport { SortDisplayedFields } from './components/SortDisplayedFields';\n\nimport type { Metadatas } from '../../../../shared/contracts/content-types';\n\ninterface FormData extends Pick<ListLayout, 'settings'> {\n  layout: Array<Pick<ListFieldLayout, 'sortable' | 'name'> & { label: string }>;\n}\n\nconst ListConfiguration = () => {\n  const { formatMessage } = useIntl();\n  const { trackUsage } = useTracking();\n  const { toggleNotification } = useNotification();\n  const { _unstableFormatAPIError: formatAPIError } = useAPIErrorHandler();\n\n  const { model, collectionType } = useDoc();\n\n  const { isLoading: isLoadingLayout, list, edit } = useDocLayout();\n\n  const [updateContentTypeConfiguration] = useUpdateContentTypeConfigurationMutation();\n  const handleSubmit: FormProps<FormData>['onSubmit'] = async (data) => {\n    try {\n      trackUsage('willSaveContentTypeLayout');\n      const layoutData = data.layout ?? [];\n      /**\n       * We reconstruct the metadatas object by taking the existing edit metadatas\n       * and re-merging that by attribute name with the current list metadatas, whilst overwriting\n       * the data from the form we've built.\n       */\n      const meta = Object.entries(edit.metadatas).reduce<Metadatas>((acc, [name, editMeta]) => {\n        const { mainField: _mainField, ...listMeta } = list.metadatas[name];\n\n        const { label, sortable } = layoutData.find((field) => field.name === name) ?? {};\n\n        acc[name] = {\n          edit: editMeta,\n          list: {\n            ...listMeta,\n            label: label || listMeta.label,\n            sortable: sortable || listMeta.sortable,\n          },\n        };\n\n        return acc;\n      }, {});\n\n      const res = await updateContentTypeConfiguration({\n        layouts: {\n          edit: edit.layout.flatMap((panel) =>\n            panel.map((row) => row.map(({ name, size }) => ({ name, size })))\n          ),\n          list: layoutData.map((field) => field.name),\n        },\n        settings: setIn(data.settings, 'displayName', undefined),\n        metadatas: meta,\n        uid: model,\n      });\n\n      if ('data' in res) {\n        trackUsage('didEditListSettings');\n        toggleNotification({\n          type: 'success',\n          message: formatMessage({ id: 'notification.success.saved', defaultMessage: 'Saved' }),\n        });\n      } else {\n        toggleNotification({\n          type: 'danger',\n          message: formatAPIError(res.error),\n        });\n      }\n    } catch (err) {\n      console.error(err);\n      toggleNotification({\n        type: 'danger',\n        message: formatMessage({ id: 'notification.error', defaultMessage: 'An error occurred' }),\n      });\n    }\n  };\n\n  const initialValues = React.useMemo(() => {\n    return {\n      layout: list.layout.map(({ label, sortable, name }) => ({\n        label: typeof label === 'string' ? label : formatMessage(label),\n        sortable,\n        name,\n      })),\n      settings: list.settings,\n    } satisfies FormData;\n  }, [formatMessage, list.layout, list.settings]);\n\n  if (collectionType === SINGLE_TYPES) {\n    return <Navigate to={`/single-types/${model}`} />;\n  }\n\n  if (isLoadingLayout) {\n    return <Page.Loading />;\n  }\n\n  return (\n    <Layouts.Root>\n      <Page.Title>{`Configure ${list.settings.displayName} List View`}</Page.Title>\n      <Main>\n        <Form initialValues={initialValues} onSubmit={handleSubmit} method=\"PUT\">\n          <Header\n            collectionType={collectionType}\n            model={model}\n            name={list.settings.displayName ?? ''}\n          />\n          <Layouts.Content>\n            <Flex\n              alignItems=\"stretch\"\n              background=\"neutral0\"\n              direction=\"column\"\n              gap={6}\n              hasRadius\n              shadow=\"tableShadow\"\n              paddingTop={6}\n              paddingBottom={6}\n              paddingLeft={7}\n              paddingRight={7}\n            >\n              <Settings />\n              <Divider />\n              <SortDisplayedFields />\n            </Flex>\n          </Layouts.Content>\n        </Form>\n      </Main>\n    </Layouts.Root>\n  );\n};\n\nconst ProtectedListConfiguration = () => {\n  const permissions = useTypedSelector(\n    (state) => state.admin_app.permissions.contentManager?.collectionTypesConfigurations\n  );\n\n  return (\n    <Page.Protect permissions={permissions}>\n      <ListConfiguration />\n    </Page.Protect>\n  );\n};\n\nexport { ProtectedListConfiguration, ListConfiguration };\nexport type { FormData };\n"],"names":[],"mappings":"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"}

package/dist/_chunks/Relations-BBmhcWFV.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"Relations-BBmhcWFV.mjs","sources":["../../admin/src/pages/EditView/components/FormInputs/ComponentContext.tsx","../../admin/src/pages/EditView/components/FormInputs/Relations.tsx"],"sourcesContent":["import { createContext } from '@strapi/admin/strapi-admin';\n\ninterface ComponentContextValue {\n  /**\n   * The id of the component. It will be undefined if the component\n   * has not been created in the database yet. This could be on a new\n   * or existing entry.\n   */\n  id?: number;\n  /**\n   * The level of the component. This is used to determine the nesting\n   * of the component. The default is set to -1 so that the base level is 0\n   * for the top level component, and increases by 1 for each level of nesting.\n   */\n  level: number;\n  /**\n   * The uid of the component. This is used to determine the type of the\n   * component. Within an attribute, it is normally the `component` value.\n   * It will be undefined if the hook is not called within the confines\n   * of a provider.\n   */\n  uid?: string;\n  /**\n   * The type of component parent. It will be undefined if the hook\n   * is not called within the confines of a provider.\n   */\n  type?: 'dynamiczone' | 'repeatable' | 'component';\n}\n\n/**\n * We use this component to wrap any individual component field in the Edit View,\n * this could be a component field in a dynamic zone, a component within a repeatable space,\n * or even nested components.\n *\n * We primarily need this to provide the component id to the components so that they can\n * correctly fetch their relations.\n */\nconst [ComponentProvider, useComponent] = createContext<ComponentContextValue>('ComponentContext', {\n  id: undefined,\n  level: -1,\n  uid: undefined,\n  type: undefined,\n});\n\nexport { ComponentProvider, useComponent };\n","import * as React from 'react';\n\nimport {\n  type InputProps,\n  useField,\n  useForm,\n  useNotification,\n  useFocusInputField,\n  useQueryParams,\n} from '@strapi/admin/strapi-admin';\nimport {\n  Box,\n  Combobox,\n  ComboboxOption,\n  Flex,\n  IconButton,\n  TextButton,\n  Tooltip,\n  Typography,\n  VisuallyHidden,\n  useComposedRefs,\n  Link,\n  Field,\n  FlexComponent,\n  BoxComponent,\n} from '@strapi/design-system';\nimport { Cross, Drag, ArrowClockwise } from '@strapi/icons';\nimport { generateNKeysBetween } from 'fractional-indexing';\nimport pipe from 'lodash/fp/pipe';\nimport { getEmptyImage } from 'react-dnd-html5-backend';\nimport { useIntl } from 'react-intl';\nimport { NavLink } from 'react-router-dom';\nimport { FixedSizeList, ListChildComponentProps } from 'react-window';\nimport { styled } from 'styled-components';\n\nimport { RelationDragPreviewProps } from '../../../../components/DragPreviews/RelationDragPreview';\nimport { COLLECTION_TYPES } from '../../../../constants/collections';\nimport { ItemTypes } from '../../../../constants/dragAndDrop';\nimport { useDoc } from '../../../../hooks/useDocument';\nimport { type EditFieldLayout } from '../../../../hooks/useDocumentLayout';\nimport {\n  DROP_SENSITIVITY,\n  UseDragAndDropOptions,\n  useDragAndDrop,\n} from '../../../../hooks/useDragAndDrop';\nimport {\n  useGetRelationsQuery,\n  useLazySearchRelationsQuery,\n  RelationResult,\n} from '../../../../services/relations';\nimport { buildValidParams } from '../../../../utils/api';\nimport { getRelationLabel } from '../../../../utils/relations';\nimport { getTranslation } from '../../../../utils/translations';\nimport { DocumentStatus } from '../DocumentStatus';\n\nimport { useComponent } from './ComponentContext';\n\nimport type { Schema } from '@strapi/types';\n\n/**\n * Remove a relation, whether it's been already saved or not.\n * It's used both in RelationsList, where the \"remove relation\" button is, and in the input,\n * because we sometimes need to remove a previous relation when selecting a new one.\n */\nfunction useHandleDisconnect(fieldName: string, consumerName: string) {\n  const field = useField(fieldName);\n  const removeFieldRow = useForm(consumerName, (state) => state.removeFieldRow);\n  const addFieldRow = useForm(consumerName, (state) => state.addFieldRow);\n\n  const handleDisconnect: ListItemProps['data']['handleDisconnect'] = (relation) => {\n    if (field.value && field.value.connect) {\n      /**\n       * A relation will exist in the `connect` array _if_ it has\n       * been added without saving. In this case, we just remove it\n       * from the connect array\n       */\n      const indexOfRelationInConnectArray = field.value.connect.findIndex(\n        (rel: NonNullable<RelationsFormValue['connect']>[number]) => rel.id === relation.id\n      );\n\n      if (indexOfRelationInConnectArray >= 0) {\n        removeFieldRow(`${fieldName}.connect`, indexOfRelationInConnectArray);\n        return;\n      }\n    }\n\n    addFieldRow(`${fieldName}.disconnect`, {\n      id: relation.id,\n      apiData: {\n        documentId: relation.documentId,\n        locale: relation.locale,\n      },\n    });\n  };\n\n  return handleDisconnect;\n}\n\n/* -------------------------------------------------------------------------------------------------\n * RelationsField\n * -----------------------------------------------------------------------------------------------*/\nconst RELATIONS_TO_DISPLAY = 5;\nconst ONE_WAY_RELATIONS = ['oneWay', 'oneToOne', 'manyToOne', 'oneToManyMorph', 'oneToOneMorph'];\n\ntype RelationPosition =\n  | (Pick<RelationResult, 'status' | 'locale'> & {\n      before: string;\n      end?: never;\n    })\n  | { end: boolean; before?: never; status?: never; locale?: never };\n\ninterface Relation extends Pick<RelationResult, 'documentId' | 'id' | 'locale' | 'status'> {\n  href: string;\n  label: string;\n  position?: RelationPosition;\n  __temp_key__: string;\n}\n\ninterface RelationsFieldProps\n  extends Omit<Extract<EditFieldLayout, { type: 'relation' }>, 'size' | 'hint'>,\n    Pick<InputProps, 'hint'> {}\n\nexport interface RelationsFormValue {\n  connect?: Relation[];\n  disconnect?: Pick<Relation, 'id'>[];\n}\n\n/**\n * TODO: we get a rather ugly flash when we remove a single relation from the list leaving\n * no other relations when we press save. The initial relation re-renders, probably because\n * of the lag in the Form cleaning it's \"disconnect\" array, whilst our data has not been invalidated.\n *\n * Could we invalidate relation data on the document actions? Should we?\n */\n\n/**\n * @internal\n * @description The relations field holds a lot of domain logic for handling relations which is rather complicated\n * At present we do not expose this to plugin developers, however, they are able to overwrite it themselves should\n * they wish to do so.\n */\nconst RelationsField = React.forwardRef<HTMLDivElement, RelationsFieldProps>(\n  ({ disabled, label, ...props }, ref) => {\n    const [currentPage, setCurrentPage] = React.useState(1);\n    const { document, model: documentModel } = useDoc();\n    const documentId = document?.documentId;\n    const { formatMessage } = useIntl();\n    const [{ query }] = useQueryParams();\n    const params = buildValidParams(query);\n\n    const isMorph = props.attribute.relation.toLowerCase().includes('morph');\n    const isDisabled = isMorph || disabled;\n\n    const { componentId, componentUID } = useComponent('RelationsField', ({ uid, id }) => ({\n      componentId: id,\n      componentUID: uid,\n    }));\n\n    const isSubmitting = useForm('RelationsList', (state) => state.isSubmitting);\n\n    React.useEffect(() => {\n      setCurrentPage(1);\n    }, [isSubmitting]);\n\n    /**\n     * We'll always have a documentId in a created entry, so we look for a componentId first.\n     * Same with `uid` and `documentModel`.\n     */\n    const id = componentId ? componentId.toString() : documentId;\n    const model = componentUID ?? documentModel;\n\n    /**\n     * The `name` prop is a complete path to the field, e.g. `field1.field2.field3`.\n     * Where the above example would a nested field within two components, however\n     * we only require the field on the component not the complete path since we query\n     * individual components. Therefore we split the string and take the last item.\n     */\n    const [targetField] = props.name.split('.').slice(-1);\n\n    const { data, isLoading, isFetching } = useGetRelationsQuery(\n      {\n        model,\n        targetField,\n        // below we don't run the query if there is no id.\n        id: id!,\n        params: {\n          ...params,\n          pageSize: RELATIONS_TO_DISPLAY,\n          page: currentPage,\n        },\n      },\n      {\n        refetchOnMountOrArgChange: true,\n        skip: !id,\n        selectFromResult: (result) => {\n          return {\n            ...result,\n            data: {\n              ...result.data,\n              results: result.data?.results ? result.data.results : [],\n            },\n          };\n        },\n      }\n    );\n\n    const handleLoadMore = () => {\n      setCurrentPage((prev) => prev + 1);\n    };\n\n    const field = useField(props.name);\n\n    const isFetchingMoreRelations = isLoading || isFetching;\n\n    const realServerRelationsCount =\n      'pagination' in data && data.pagination ? data.pagination.total : 0;\n\n    /**\n     * Items that are already connected, but reordered would be in\n     * this list, so to get an accurate figure, we remove them.\n     */\n    const relationsConnected =\n      (field.value?.connect ?? []).filter(\n        (rel: Relation) => data.results.findIndex((relation) => relation.id === rel.id) === -1\n      ).length ?? 0;\n    const relationsDisconnected = field.value?.disconnect?.length ?? 0;\n\n    const relationsCount = realServerRelationsCount + relationsConnected - relationsDisconnected;\n\n    /**\n     * This is it, the source of truth for reordering in conjunction with partial loading & updating\n     * of relations. Relations on load are given __temp_key__ when fetched, because we don't want to\n     * create brand new keys everytime the data updates, just keep adding them onto the newly loaded ones.\n     */\n    const relations = React.useMemo(() => {\n      const ctx = {\n        field: field.value,\n        // @ts-expect-error – targetModel does exist on the attribute. But it's not typed.\n        href: `../${COLLECTION_TYPES}/${props.attribute.targetModel}`,\n        mainField: props.mainField,\n      };\n\n      /**\n       * Tidy up our data.\n       */\n      const transformations = pipe(\n        removeConnected(ctx),\n        removeDisconnected(ctx),\n        addLabelAndHref(ctx)\n      );\n\n      const transformedRels = transformations([...data.results]);\n\n      /**\n       * THIS IS CRUCIAL. If you don't sort by the __temp_key__ which comes from fractional indexing\n       * then the list will be in the wrong order.\n       */\n      return [...transformedRels, ...(field.value?.connect ?? [])].sort((a, b) => {\n        if (a.__temp_key__ < b.__temp_key__) return -1;\n        if (a.__temp_key__ > b.__temp_key__) return 1;\n        return 0;\n      });\n    }, [\n      data.results,\n      field.value,\n      // @ts-expect-error – targetModel does exist on the attribute. But it's not typed.\n      props.attribute.targetModel,\n      props.mainField,\n    ]);\n\n    const handleDisconnect = useHandleDisconnect(props.name, 'RelationsField');\n\n    const handleConnect: RelationsInputProps['onChange'] = (relation) => {\n      const [lastItemInList] = relations.slice(-1);\n\n      const item = {\n        id: relation.id,\n        apiData: {\n          documentId: relation.documentId,\n          locale: relation.locale,\n        },\n        status: relation.status,\n        /**\n         * If there's a last item, that's the first key we use to generate out next one.\n         */\n        __temp_key__: generateNKeysBetween(lastItemInList?.__temp_key__ ?? null, null, 1)[0],\n        // Fallback to `id` if there is no `mainField` value, which will overwrite the above `id` property with the exact same data.\n        [props.mainField?.name ?? 'documentId']: relation[props.mainField?.name ?? 'documentId'],\n        label: getRelationLabel(relation, props.mainField),\n        // @ts-expect-error – targetModel does exist on the attribute, but it's not typed.\n        href: `../${COLLECTION_TYPES}/${props.attribute.targetModel}/${relation.documentId}?${relation.locale ? `plugins[i18n][locale]=${relation.locale}` : ''}`,\n      };\n\n      if (ONE_WAY_RELATIONS.includes(props.attribute.relation)) {\n        // Remove any existing relation so they can be replaced with the new one\n        field.value?.connect?.forEach(handleDisconnect);\n        relations.forEach(handleDisconnect);\n\n        field.onChange(`${props.name}.connect`, [item]);\n      } else {\n        field.onChange(`${props.name}.connect`, [...(field.value?.connect ?? []), item]);\n      }\n    };\n\n    return (\n      <Flex\n        ref={ref}\n        direction=\"column\"\n        gap={3}\n        justifyContent=\"space-between\"\n        alignItems=\"stretch\"\n        wrap=\"wrap\"\n      >\n        <StyledFlex direction=\"column\" alignItems=\"start\" gap={2} width=\"100%\">\n          <RelationsInput\n            disabled={isDisabled}\n            // NOTE: we should not default to using the documentId if the component is being created (componentUID is undefined)\n            id={componentUID ? (componentId ? `${componentId}` : '') : documentId}\n            label={`${label} ${relationsCount > 0 ? `(${relationsCount})` : ''}`}\n            model={model}\n            onChange={handleConnect}\n            {...props}\n          />\n          {'pagination' in data &&\n          data.pagination &&\n          data.pagination.pageCount > data.pagination.page ? (\n            <TextButton\n              disabled={isFetchingMoreRelations}\n              onClick={handleLoadMore}\n              loading={isFetchingMoreRelations}\n              startIcon={<ArrowClockwise />}\n              // prevent the label from line-wrapping\n              shrink={0}\n            >\n              {formatMessage({\n                id: getTranslation('relation.loadMore'),\n                defaultMessage: 'Load More',\n              })}\n            </TextButton>\n          ) : null}\n        </StyledFlex>\n        <RelationsList\n          data={relations}\n          serverData={data.results}\n          disabled={isDisabled}\n          name={props.name}\n          isLoading={isFetchingMoreRelations}\n          relationType={props.attribute.relation}\n        />\n      </Flex>\n    );\n  }\n);\n\n/**\n * TODO: this can be removed once we stop shipping Inputs with\n * labels wrapped round in DS@2.\n */\nconst StyledFlex = styled<FlexComponent>(Flex)`\n  & > div {\n    width: 100%;\n  }\n`;\n\n/* -------------------------------------------------------------------------------------------------\n * Relation Transformations\n * -----------------------------------------------------------------------------------------------*/\n\ninterface TransformationContext extends Pick<RelationsFieldProps, 'mainField'> {\n  field?: RelationsFormValue;\n  href: string;\n}\n\n/**\n * If it's in the connected array, it can get out of our data array,\n * we'll be putting it back in later and sorting it anyway.\n */\nconst removeConnected =\n  ({ field }: TransformationContext) =>\n  (relations: RelationResult[]) => {\n    return relations.filter((relation) => {\n      const connectedRelations = field?.connect ?? [];\n\n      return connectedRelations.findIndex((rel) => rel.id === relation.id) === -1;\n    });\n  };\n\n/**\n * @description Removes relations that are in the `disconnect` array of the field\n */\nconst removeDisconnected =\n  ({ field }: TransformationContext) =>\n  (relations: RelationResult[]): RelationResult[] =>\n    relations.filter((relation) => {\n      const disconnectedRelations = field?.disconnect ?? [];\n\n      return disconnectedRelations.findIndex((rel) => rel.id === relation.id) === -1;\n    });\n\n/**\n * @description Adds a label and href to the relation object we use this to render\n * a better UI where we can link to the relation and display a human-readable label.\n */\nconst addLabelAndHref =\n  ({ mainField, href }: TransformationContext) =>\n  (relations: RelationResult[]): Relation[] =>\n    relations.map((relation) => {\n      return {\n        ...relation,\n        // Fallback to `id` if there is no `mainField` value, which will overwrite the above `documentId` property with the exact same data.\n        [mainField?.name ?? 'documentId']: relation[mainField?.name ?? 'documentId'],\n        label: getRelationLabel(relation, mainField),\n        href: `${href}/${relation.documentId}?${relation.locale ? `plugins[i18n][locale]=${relation.locale}` : ''}`,\n      };\n    });\n\n/* -------------------------------------------------------------------------------------------------\n * RelationsInput\n * -----------------------------------------------------------------------------------------------*/\n\ninterface RelationsInputProps extends Omit<RelationsFieldProps, 'type'> {\n  id?: string;\n  model: string;\n  onChange: (\n    relation: Pick<RelationResult, 'documentId' | 'id' | 'locale' | 'status'> & {\n      [key: string]: any;\n    }\n  ) => void;\n}\n\n/**\n * @description Contains all the logic for the combobox that can search\n * for relations and then add them to the field's connect array.\n */\nconst RelationsInput = ({\n  hint,\n  id,\n  model,\n  label,\n  labelAction,\n  name,\n  mainField,\n  placeholder,\n  required,\n  unique: _unique,\n  'aria-label': _ariaLabel,\n  onChange,\n  ...props\n}: RelationsInputProps) => {\n  const [textValue, setTextValue] = React.useState<string | undefined>('');\n  const [searchParams, setSearchParams] = React.useState({\n    _q: '',\n    page: 1,\n  });\n  const { toggleNotification } = useNotification();\n  const [{ query }] = useQueryParams();\n\n  const { formatMessage } = useIntl();\n  const fieldRef = useFocusInputField<HTMLInputElement>(name);\n  const field = useField<RelationsFormValue>(name);\n\n  const [searchForTrigger, { data, isLoading }] = useLazySearchRelationsQuery();\n\n  /**\n   * Because we're using a lazy query, we need to trigger the search\n   * when the component mounts and when the search params change.\n   * We also need to trigger the search when the field value changes\n   * so that we can filter out the relations that are already connected.\n   */\n  React.useEffect(() => {\n    /**\n     * The `name` prop is a complete path to the field, e.g. `field1.field2.field3`.\n     * Where the above example would a nested field within two components, however\n     * we only require the field on the component not the complete path since we query\n     * individual components. Therefore we split the string and take the last item.\n     */\n    const [targetField] = name.split('.').slice(-1);\n\n    searchForTrigger({\n      model,\n      targetField,\n      params: {\n        ...buildValidParams(query),\n        id: id ?? '',\n        pageSize: 10,\n        idsToInclude: field.value?.disconnect?.map((rel) => rel.id.toString()) ?? [],\n        idsToOmit: field.value?.connect?.map((rel) => rel.id.toString()) ?? [],\n        ...searchParams,\n      },\n    });\n  }, [\n    field.value?.connect,\n    field.value?.disconnect,\n    id,\n    model,\n    name,\n    query,\n    searchForTrigger,\n    searchParams,\n  ]);\n\n  const handleSearch = async (search: string) => {\n    setSearchParams((s) => ({ ...s, _q: search, page: 1 }));\n  };\n\n  const hasNextPage = data?.pagination ? data.pagination.page < data.pagination.pageCount : false;\n\n  const options = data?.results ?? [];\n\n  const handleChange = (relationId?: string) => {\n    if (!relationId) {\n      return;\n    }\n\n    const relation = options.find((opt) => opt.id.toString() === relationId);\n\n    if (!relation) {\n      // This is very unlikely to happen, but it ensures we don't have any data for.\n      console.error(\n        \"You've tried to add a relation with an id that does not exist in the options you can see, this is likely a bug with Strapi. Please open an issue.\"\n      );\n\n      toggleNotification({\n        message: formatMessage({\n          id: getTranslation('relation.error-adding-relation'),\n          defaultMessage: 'An error occurred while trying to add the relation.',\n        }),\n        type: 'danger',\n      });\n\n      return;\n    }\n\n    /**\n     * You need to give this relation a correct _temp_key_ but\n     * this component doesn't know about those ones, you can't rely\n     * on the connect array because that doesn't hold items that haven't\n     * moved. So use a callback to fill in the gaps when connecting.\n     *\n     */\n    onChange(relation);\n  };\n\n  const handleLoadMore = () => {\n    if (!data || !data.pagination) {\n      return;\n    } else if (data.pagination.page < data.pagination.pageCount) {\n      setSearchParams((s) => ({ ...s, page: s.page + 1 }));\n    }\n  };\n\n  React.useLayoutEffect(() => {\n    setTextValue('');\n  }, [field.value]);\n\n  return (\n    <Field.Root error={field.error} hint={hint} name={name} required={required}>\n      <Field.Label action={labelAction}>{label}</Field.Label>\n      <Combobox\n        ref={fieldRef}\n        name={name}\n        autocomplete=\"list\"\n        placeholder={\n          placeholder ||\n          formatMessage({\n            id: getTranslation('relation.add'),\n            defaultMessage: 'Add relation',\n          })\n        }\n        hasMoreItems={hasNextPage}\n        loading={isLoading}\n        onOpenChange={() => {\n          handleSearch(textValue ?? '');\n        }}\n        noOptionsMessage={() =>\n          formatMessage({\n            id: getTranslation('relation.notAvailable'),\n            defaultMessage: 'No relations available',\n          })\n        }\n        loadingMessage={formatMessage({\n          id: getTranslation('relation.isLoading'),\n          defaultMessage: 'Relations are loading',\n        })}\n        onLoadMore={handleLoadMore}\n        textValue={textValue}\n        onChange={handleChange}\n        onTextValueChange={(text) => {\n          setTextValue(text);\n        }}\n        onInputChange={(event) => {\n          handleSearch(event.currentTarget.value);\n        }}\n        {...props}\n      >\n        {options.map((opt) => {\n          const textValue = getRelationLabel(opt, mainField);\n\n          return (\n            <ComboboxOption key={opt.id} value={opt.id.toString()} textValue={textValue}>\n              <Flex gap={2} justifyContent=\"space-between\">\n                <Typography ellipsis>{textValue}</Typography>\n                {opt.status ? <DocumentStatus status={opt.status} /> : null}\n              </Flex>\n            </ComboboxOption>\n          );\n        })}\n      </Combobox>\n      <Field.Error />\n      <Field.Hint />\n    </Field.Root>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * RelationsList\n * -----------------------------------------------------------------------------------------------*/\nconst RELATION_ITEM_HEIGHT = 50;\nconst RELATION_GUTTER = 4;\n\ninterface RelationsListProps extends Pick<RelationsFieldProps, 'disabled' | 'name'> {\n  data: Relation[];\n  isLoading?: boolean;\n  relationType: Schema.Attribute.RelationKind.Any;\n  /**\n   * The existing relations connected on the server. We need these to diff against.\n   */\n  serverData: RelationResult[];\n}\n\nconst RelationsList = ({\n  data,\n  serverData,\n  disabled,\n  name,\n  isLoading,\n  relationType,\n}: RelationsListProps) => {\n  const ariaDescriptionId = React.useId();\n  const { formatMessage } = useIntl();\n  const listRef = React.useRef<FixedSizeList>(null);\n  const outerListRef = React.useRef<HTMLUListElement>(null);\n  const [overflow, setOverflow] = React.useState<'top' | 'bottom' | 'top-bottom'>();\n  const [liveText, setLiveText] = React.useState('');\n  const field = useField(name);\n\n  React.useEffect(() => {\n    if (data.length <= RELATIONS_TO_DISPLAY) {\n      return setOverflow(undefined);\n    }\n\n    const handleNativeScroll = (e: Event) => {\n      const el = e.target as HTMLUListElement;\n      const parentScrollContainerHeight = (el.parentNode as HTMLDivElement).scrollHeight;\n      const maxScrollBottom = el.scrollHeight - el.scrollTop;\n\n      if (el.scrollTop === 0) {\n        return setOverflow('bottom');\n      }\n\n      if (maxScrollBottom === parentScrollContainerHeight) {\n        return setOverflow('top');\n      }\n\n      return setOverflow('top-bottom');\n    };\n\n    const outerListRefCurrent = outerListRef?.current;\n\n    if (!isLoading && data.length > 0 && outerListRefCurrent) {\n      outerListRef.current.addEventListener('scroll', handleNativeScroll);\n    }\n\n    return () => {\n      if (outerListRefCurrent) {\n        outerListRefCurrent.removeEventListener('scroll', handleNativeScroll);\n      }\n    };\n  }, [isLoading, data.length]);\n\n  const getItemPos = (index: number) => `${index + 1} of ${data.length}`;\n\n  const handleMoveItem: UseDragAndDropOptions['onMoveItem'] = (newIndex, oldIndex) => {\n    const item = data[oldIndex];\n\n    setLiveText(\n      formatMessage(\n        {\n          id: getTranslation('dnd.reorder'),\n          defaultMessage: '{item}, moved. New position in list: {position}.',\n        },\n        {\n          item: item.label ?? item.documentId,\n          position: getItemPos(newIndex),\n        }\n      )\n    );\n\n    /**\n     * Splicing mutates the array, so we need to create a new array\n     */\n    const newData = [...data];\n    const currentRow = data[oldIndex];\n\n    const startKey =\n      oldIndex > newIndex ? newData[newIndex - 1]?.__temp_key__ : newData[newIndex]?.__temp_key__;\n    const endKey =\n      oldIndex > newIndex ? newData[newIndex]?.__temp_key__ : newData[newIndex + 1]?.__temp_key__;\n\n    /**\n     * We're moving the relation between two other relations, so\n     * we need to generate a new key that keeps the order\n     */\n    const [newKey] = generateNKeysBetween(startKey, endKey, 1);\n\n    newData.splice(oldIndex, 1);\n    newData.splice(newIndex, 0, { ...currentRow, __temp_key__: newKey });\n\n    /**\n     * Now we diff against the server to understand what's different so we\n     * can keep the connect array nice and tidy. It also needs reversing because\n     * we reverse the relations from the server in the first place.\n     */\n    const connectedRelations = newData\n      .reduce<Relation[]>((acc, relation, currentIndex, array) => {\n        const relationOnServer = serverData.find((oldRelation) => oldRelation.id === relation.id);\n\n        const relationInFront = array[currentIndex + 1];\n\n        if (!relationOnServer || relationOnServer.__temp_key__ !== relation.__temp_key__) {\n          const position = relationInFront\n            ? {\n                before: relationInFront.documentId,\n                locale: relationInFront.locale,\n                status:\n                  'publishedAt' in relationInFront && relationInFront.publishedAt\n                    ? 'published'\n                    : 'draft',\n              }\n            : { end: true };\n\n          const relationWithPosition: Relation = {\n            ...relation,\n            ...{\n              apiData: {\n                documentId: relation.documentId,\n                locale: relation.locale,\n                position,\n              },\n            },\n          };\n\n          return [...acc, relationWithPosition];\n        }\n\n        return acc;\n      }, [])\n      .toReversed();\n\n    field.onChange(`${name}.connect`, connectedRelations);\n  };\n\n  const handleGrabItem: UseDragAndDropOptions['onGrabItem'] = (index) => {\n    const item = data[index];\n\n    setLiveText(\n      formatMessage(\n        {\n          id: getTranslation('dnd.grab-item'),\n          defaultMessage: `{item}, grabbed. Current position in list: {position}. Press up and down arrow to change position, Spacebar to drop, Escape to cancel.`,\n        },\n        {\n          item: item.label ?? item.documentId,\n          position: getItemPos(index),\n        }\n      )\n    );\n  };\n\n  const handleDropItem: UseDragAndDropOptions['onDropItem'] = (index) => {\n    const { href: _href, label, ...item } = data[index];\n\n    setLiveText(\n      formatMessage(\n        {\n          id: getTranslation('dnd.drop-item'),\n          defaultMessage: `{item}, dropped. Final position in list: {position}.`,\n        },\n        {\n          item: label ?? item.documentId,\n          position: getItemPos(index),\n        }\n      )\n    );\n  };\n\n  const handleCancel: UseDragAndDropOptions['onCancel'] = (index) => {\n    const item = data[index];\n\n    setLiveText(\n      formatMessage(\n        {\n          id: getTranslation('dnd.cancel-item'),\n          defaultMessage: '{item}, dropped. Re-order cancelled.',\n        },\n        {\n          item: item.label ?? item.documentId,\n        }\n      )\n    );\n  };\n\n  const handleDisconnect = useHandleDisconnect(name, 'RelationsList');\n\n  /**\n   * These relation types will only ever have one item\n   * in their list, so you can't reorder a single item!\n   */\n  const canReorder = !ONE_WAY_RELATIONS.includes(relationType);\n\n  const dynamicListHeight =\n    data.length > RELATIONS_TO_DISPLAY\n      ? Math.min(data.length, RELATIONS_TO_DISPLAY) * (RELATION_ITEM_HEIGHT + RELATION_GUTTER) +\n        RELATION_ITEM_HEIGHT / 2\n      : Math.min(data.length, RELATIONS_TO_DISPLAY) * (RELATION_ITEM_HEIGHT + RELATION_GUTTER);\n\n  return (\n    <ShadowBox $overflowDirection={overflow}>\n      <VisuallyHidden id={ariaDescriptionId}>\n        {formatMessage({\n          id: getTranslation('dnd.instructions'),\n          defaultMessage: `Press spacebar to grab and re-order`,\n        })}\n      </VisuallyHidden>\n      <VisuallyHidden aria-live=\"assertive\">{liveText}</VisuallyHidden>\n      {/* @ts-expect-error – width is expected, but we've not needed to pass it before. */}\n      <FixedSizeList\n        height={dynamicListHeight}\n        ref={listRef}\n        outerRef={outerListRef}\n        itemCount={data.length}\n        itemSize={RELATION_ITEM_HEIGHT + RELATION_GUTTER}\n        itemData={{\n          ariaDescribedBy: ariaDescriptionId,\n          canDrag: canReorder,\n          disabled,\n          handleCancel,\n          handleDropItem,\n          handleGrabItem,\n          handleMoveItem,\n          name,\n          handleDisconnect,\n          relations: data,\n        }}\n        itemKey={(index) => data[index].id}\n        innerElementType=\"ol\"\n      >\n        {ListItem}\n      </FixedSizeList>\n    </ShadowBox>\n  );\n};\n\nconst ShadowBox = styled<BoxComponent>(Box)<{\n  $overflowDirection?: 'top-bottom' | 'top' | 'bottom';\n}>`\n  position: relative;\n  overflow: hidden;\n  flex: 1;\n\n  &:before,\n  &:after {\n    position: absolute;\n    width: 100%;\n    height: 4px;\n    z-index: 1;\n  }\n\n  &:before {\n    /* TODO: as for DS Table component we would need this to be handled by the DS theme */\n    content: '';\n    background: linear-gradient(rgba(3, 3, 5, 0.2) 0%, rgba(0, 0, 0, 0) 100%);\n    top: 0;\n    opacity: ${({ $overflowDirection }) =>\n      $overflowDirection === 'top-bottom' || $overflowDirection === 'top' ? 1 : 0};\n    transition: opacity 0.2s ease-in-out;\n  }\n\n  &:after {\n    /* TODO: as for DS Table component we would need this to be handled by the DS theme */\n    content: '';\n    background: linear-gradient(0deg, rgba(3, 3, 5, 0.2) 0%, rgba(0, 0, 0, 0) 100%);\n    bottom: 0;\n    opacity: ${({ $overflowDirection }) =>\n      $overflowDirection === 'top-bottom' || $overflowDirection === 'bottom' ? 1 : 0};\n    transition: opacity 0.2s ease-in-out;\n  }\n`;\n\n/* -------------------------------------------------------------------------------------------------\n * ListItem\n * -----------------------------------------------------------------------------------------------*/\n\ninterface ListItemProps extends Pick<ListChildComponentProps, 'style' | 'index'> {\n  data: {\n    ariaDescribedBy: string;\n    canDrag?: boolean;\n    disabled?: boolean;\n    handleCancel: UseDragAndDropOptions['onCancel'];\n    handleDropItem: UseDragAndDropOptions['onDropItem'];\n    handleGrabItem: UseDragAndDropOptions['onGrabItem'];\n    handleMoveItem: UseDragAndDropOptions['onMoveItem'];\n    handleDisconnect: (relation: Relation) => void;\n    name: string;\n    relations: Relation[];\n  };\n}\n\nconst ListItem = ({ data, index, style }: ListItemProps) => {\n  const {\n    ariaDescribedBy,\n    canDrag = false,\n    disabled = false,\n    handleCancel,\n    handleDisconnect,\n    handleDropItem,\n    handleGrabItem,\n    handleMoveItem,\n    name,\n    relations,\n  } = data;\n  const { formatMessage } = useIntl();\n\n  const { href, id, label, status } = relations[index];\n\n  const [{ handlerId, isDragging, handleKeyDown }, relationRef, dropRef, dragRef, dragPreviewRef] =\n    useDragAndDrop<number, Omit<RelationDragPreviewProps, 'width'>, HTMLDivElement>(\n      canDrag && !disabled,\n      {\n        type: `${ItemTypes.RELATION}_${name}`,\n        index,\n        item: {\n          displayedValue: label,\n          status,\n          id: id,\n          index,\n        },\n        onMoveItem: handleMoveItem,\n        onDropItem: handleDropItem,\n        onGrabItem: handleGrabItem,\n        onCancel: handleCancel,\n        dropSensitivity: DROP_SENSITIVITY.REGULAR,\n      }\n    );\n\n  const composedRefs = useComposedRefs<HTMLDivElement>(relationRef, dragRef);\n\n  React.useEffect(() => {\n    dragPreviewRef(getEmptyImage());\n  }, [dragPreviewRef]);\n\n  return (\n    <Box\n      style={style}\n      tag=\"li\"\n      ref={dropRef}\n      aria-describedby={ariaDescribedBy}\n      cursor={canDrag ? 'all-scroll' : 'default'}\n    >\n      {isDragging ? (\n        <RelationItemPlaceholder />\n      ) : (\n        <Flex\n          paddingTop={2}\n          paddingBottom={2}\n          paddingLeft={canDrag ? 2 : 4}\n          paddingRight={4}\n          hasRadius\n          borderColor=\"neutral200\"\n          background={disabled ? 'neutral150' : 'neutral0'}\n          justifyContent=\"space-between\"\n          ref={composedRefs}\n          data-handler-id={handlerId}\n        >\n          <FlexWrapper gap={1}>\n            {canDrag ? (\n              <IconButton\n                tag=\"div\"\n                role=\"button\"\n                tabIndex={0}\n                withTooltip={false}\n                label={formatMessage({\n                  id: getTranslation('components.RelationInput.icon-button-aria-label'),\n                  defaultMessage: 'Drag',\n                })}\n                variant=\"ghost\"\n                onKeyDown={handleKeyDown}\n                disabled={disabled}\n              >\n                <Drag />\n              </IconButton>\n            ) : null}\n            <Flex width=\"100%\" minWidth={0} justifyContent=\"space-between\">\n              <Box minWidth={0} paddingTop={1} paddingBottom={1} paddingRight={4}>\n                <Tooltip description={label}>\n                  {href ? (\n                    <LinkEllipsis tag={NavLink} to={href} isExternal={false}>\n                      {label}\n                    </LinkEllipsis>\n                  ) : (\n                    <Typography textColor={disabled ? 'neutral600' : 'primary600'} ellipsis>\n                      {label}\n                    </Typography>\n                  )}\n                </Tooltip>\n              </Box>\n              {status ? <DocumentStatus status={status} /> : null}\n            </Flex>\n          </FlexWrapper>\n          <Box paddingLeft={4}>\n            <IconButton\n              onClick={() => handleDisconnect(relations[index])}\n              disabled={disabled}\n              label={formatMessage({\n                id: getTranslation('relation.disconnect'),\n                defaultMessage: 'Remove',\n              })}\n              variant=\"ghost\"\n              size=\"S\"\n            >\n              <Cross />\n            </IconButton>\n          </Box>\n        </Flex>\n      )}\n    </Box>\n  );\n};\n\nconst FlexWrapper = styled<FlexComponent>(Flex)`\n  width: 100%;\n  /* Used to prevent endAction to be pushed out of container */\n  min-width: 0;\n\n  & > div[role='button'] {\n    cursor: all-scroll;\n  }\n`;\n\nconst DisconnectButton = styled.button`\n  svg path {\n    fill: ${({ theme, disabled }) =>\n      disabled ? theme.colors.neutral600 : theme.colors.neutral500};\n  }\n\n  &:hover svg path,\n  &:focus svg path {\n    fill: ${({ theme, disabled }) => !disabled && theme.colors.neutral600};\n  }\n`;\n\nconst LinkEllipsis = styled(Link)`\n  display: block;\n\n  & > span {\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    display: block;\n  }\n`;\n\nconst RelationItemPlaceholder = () => (\n  <Box\n    paddingTop={2}\n    paddingBottom={2}\n    paddingLeft={4}\n    paddingRight={4}\n    hasRadius\n    borderStyle=\"dashed\"\n    borderColor=\"primary600\"\n    borderWidth=\"1px\"\n    background=\"primary100\"\n    height={`calc(100% - ${RELATION_GUTTER}px)`}\n  />\n);\n\nconst MemoizedRelationsField = React.memo(RelationsField);\n\nexport { MemoizedRelationsField as RelationsInput, FlexWrapper, DisconnectButton, LinkEllipsis };\nexport type { RelationsFieldProps };\n"],"names":["id","textValue"],"mappings":"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"}

package/dist/_chunks/Relations-eG-9p_qS.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Relations-eG-9p_qS.js","sources":["../../admin/src/pages/EditView/components/FormInputs/ComponentContext.tsx","../../admin/src/pages/EditView/components/FormInputs/Relations.tsx"],"sourcesContent":["import { createContext } from '@strapi/admin/strapi-admin';\n\ninterface ComponentContextValue {\n  /**\n   * The id of the component. It will be undefined if the component\n   * has not been created in the database yet. This could be on a new\n   * or existing entry.\n   */\n  id?: number;\n  /**\n   * The level of the component. This is used to determine the nesting\n   * of the component. The default is set to -1 so that the base level is 0\n   * for the top level component, and increases by 1 for each level of nesting.\n   */\n  level: number;\n  /**\n   * The uid of the component. This is used to determine the type of the\n   * component. Within an attribute, it is normally the `component` value.\n   * It will be undefined if the hook is not called within the confines\n   * of a provider.\n   */\n  uid?: string;\n  /**\n   * The type of component parent. It will be undefined if the hook\n   * is not called within the confines of a provider.\n   */\n  type?: 'dynamiczone' | 'repeatable' | 'component';\n}\n\n/**\n * We use this component to wrap any individual component field in the Edit View,\n * this could be a component field in a dynamic zone, a component within a repeatable space,\n * or even nested components.\n *\n * We primarily need this to provide the component id to the components so that they can\n * correctly fetch their relations.\n */\nconst [ComponentProvider, useComponent] = createContext<ComponentContextValue>('ComponentContext', {\n  id: undefined,\n  level: -1,\n  uid: undefined,\n  type: undefined,\n});\n\nexport { ComponentProvider, useComponent };\n","import * as React from 'react';\n\nimport {\n  type InputProps,\n  useField,\n  useForm,\n  useNotification,\n  useFocusInputField,\n  useQueryParams,\n} from '@strapi/admin/strapi-admin';\nimport {\n  Box,\n  Combobox,\n  ComboboxOption,\n  Flex,\n  IconButton,\n  TextButton,\n  Tooltip,\n  Typography,\n  VisuallyHidden,\n  useComposedRefs,\n  Link,\n  Field,\n  FlexComponent,\n  BoxComponent,\n} from '@strapi/design-system';\nimport { Cross, Drag, ArrowClockwise } from '@strapi/icons';\nimport { generateNKeysBetween } from 'fractional-indexing';\nimport pipe from 'lodash/fp/pipe';\nimport { getEmptyImage } from 'react-dnd-html5-backend';\nimport { useIntl } from 'react-intl';\nimport { NavLink } from 'react-router-dom';\nimport { FixedSizeList, ListChildComponentProps } from 'react-window';\nimport { styled } from 'styled-components';\n\nimport { RelationDragPreviewProps } from '../../../../components/DragPreviews/RelationDragPreview';\nimport { COLLECTION_TYPES } from '../../../../constants/collections';\nimport { ItemTypes } from '../../../../constants/dragAndDrop';\nimport { useDoc } from '../../../../hooks/useDocument';\nimport { type EditFieldLayout } from '../../../../hooks/useDocumentLayout';\nimport {\n  DROP_SENSITIVITY,\n  UseDragAndDropOptions,\n  useDragAndDrop,\n} from '../../../../hooks/useDragAndDrop';\nimport {\n  useGetRelationsQuery,\n  useLazySearchRelationsQuery,\n  RelationResult,\n} from '../../../../services/relations';\nimport { buildValidParams } from '../../../../utils/api';\nimport { getRelationLabel } from '../../../../utils/relations';\nimport { getTranslation } from '../../../../utils/translations';\nimport { DocumentStatus } from '../DocumentStatus';\n\nimport { useComponent } from './ComponentContext';\n\nimport type { Schema } from '@strapi/types';\n\n/**\n * Remove a relation, whether it's been already saved or not.\n * It's used both in RelationsList, where the \"remove relation\" button is, and in the input,\n * because we sometimes need to remove a previous relation when selecting a new one.\n */\nfunction useHandleDisconnect(fieldName: string, consumerName: string) {\n  const field = useField(fieldName);\n  const removeFieldRow = useForm(consumerName, (state) => state.removeFieldRow);\n  const addFieldRow = useForm(consumerName, (state) => state.addFieldRow);\n\n  const handleDisconnect: ListItemProps['data']['handleDisconnect'] = (relation) => {\n    if (field.value && field.value.connect) {\n      /**\n       * A relation will exist in the `connect` array _if_ it has\n       * been added without saving. In this case, we just remove it\n       * from the connect array\n       */\n      const indexOfRelationInConnectArray = field.value.connect.findIndex(\n        (rel: NonNullable<RelationsFormValue['connect']>[number]) => rel.id === relation.id\n      );\n\n      if (indexOfRelationInConnectArray >= 0) {\n        removeFieldRow(`${fieldName}.connect`, indexOfRelationInConnectArray);\n        return;\n      }\n    }\n\n    addFieldRow(`${fieldName}.disconnect`, {\n      id: relation.id,\n      apiData: {\n        documentId: relation.documentId,\n        locale: relation.locale,\n      },\n    });\n  };\n\n  return handleDisconnect;\n}\n\n/* -------------------------------------------------------------------------------------------------\n * RelationsField\n * -----------------------------------------------------------------------------------------------*/\nconst RELATIONS_TO_DISPLAY = 5;\nconst ONE_WAY_RELATIONS = ['oneWay', 'oneToOne', 'manyToOne', 'oneToManyMorph', 'oneToOneMorph'];\n\ntype RelationPosition =\n  | (Pick<RelationResult, 'status' | 'locale'> & {\n      before: string;\n      end?: never;\n    })\n  | { end: boolean; before?: never; status?: never; locale?: never };\n\ninterface Relation extends Pick<RelationResult, 'documentId' | 'id' | 'locale' | 'status'> {\n  href: string;\n  label: string;\n  position?: RelationPosition;\n  __temp_key__: string;\n}\n\ninterface RelationsFieldProps\n  extends Omit<Extract<EditFieldLayout, { type: 'relation' }>, 'size' | 'hint'>,\n    Pick<InputProps, 'hint'> {}\n\nexport interface RelationsFormValue {\n  connect?: Relation[];\n  disconnect?: Pick<Relation, 'id'>[];\n}\n\n/**\n * TODO: we get a rather ugly flash when we remove a single relation from the list leaving\n * no other relations when we press save. The initial relation re-renders, probably because\n * of the lag in the Form cleaning it's \"disconnect\" array, whilst our data has not been invalidated.\n *\n * Could we invalidate relation data on the document actions? Should we?\n */\n\n/**\n * @internal\n * @description The relations field holds a lot of domain logic for handling relations which is rather complicated\n * At present we do not expose this to plugin developers, however, they are able to overwrite it themselves should\n * they wish to do so.\n */\nconst RelationsField = React.forwardRef<HTMLDivElement, RelationsFieldProps>(\n  ({ disabled, label, ...props }, ref) => {\n    const [currentPage, setCurrentPage] = React.useState(1);\n    const { document, model: documentModel } = useDoc();\n    const documentId = document?.documentId;\n    const { formatMessage } = useIntl();\n    const [{ query }] = useQueryParams();\n    const params = buildValidParams(query);\n\n    const isMorph = props.attribute.relation.toLowerCase().includes('morph');\n    const isDisabled = isMorph || disabled;\n\n    const { componentId, componentUID } = useComponent('RelationsField', ({ uid, id }) => ({\n      componentId: id,\n      componentUID: uid,\n    }));\n\n    const isSubmitting = useForm('RelationsList', (state) => state.isSubmitting);\n\n    React.useEffect(() => {\n      setCurrentPage(1);\n    }, [isSubmitting]);\n\n    /**\n     * We'll always have a documentId in a created entry, so we look for a componentId first.\n     * Same with `uid` and `documentModel`.\n     */\n    const id = componentId ? componentId.toString() : documentId;\n    const model = componentUID ?? documentModel;\n\n    /**\n     * The `name` prop is a complete path to the field, e.g. `field1.field2.field3`.\n     * Where the above example would a nested field within two components, however\n     * we only require the field on the component not the complete path since we query\n     * individual components. Therefore we split the string and take the last item.\n     */\n    const [targetField] = props.name.split('.').slice(-1);\n\n    const { data, isLoading, isFetching } = useGetRelationsQuery(\n      {\n        model,\n        targetField,\n        // below we don't run the query if there is no id.\n        id: id!,\n        params: {\n          ...params,\n          pageSize: RELATIONS_TO_DISPLAY,\n          page: currentPage,\n        },\n      },\n      {\n        refetchOnMountOrArgChange: true,\n        skip: !id,\n        selectFromResult: (result) => {\n          return {\n            ...result,\n            data: {\n              ...result.data,\n              results: result.data?.results ? result.data.results : [],\n            },\n          };\n        },\n      }\n    );\n\n    const handleLoadMore = () => {\n      setCurrentPage((prev) => prev + 1);\n    };\n\n    const field = useField(props.name);\n\n    const isFetchingMoreRelations = isLoading || isFetching;\n\n    const realServerRelationsCount =\n      'pagination' in data && data.pagination ? data.pagination.total : 0;\n\n    /**\n     * Items that are already connected, but reordered would be in\n     * this list, so to get an accurate figure, we remove them.\n     */\n    const relationsConnected =\n      (field.value?.connect ?? []).filter(\n        (rel: Relation) => data.results.findIndex((relation) => relation.id === rel.id) === -1\n      ).length ?? 0;\n    const relationsDisconnected = field.value?.disconnect?.length ?? 0;\n\n    const relationsCount = realServerRelationsCount + relationsConnected - relationsDisconnected;\n\n    /**\n     * This is it, the source of truth for reordering in conjunction with partial loading & updating\n     * of relations. Relations on load are given __temp_key__ when fetched, because we don't want to\n     * create brand new keys everytime the data updates, just keep adding them onto the newly loaded ones.\n     */\n    const relations = React.useMemo(() => {\n      const ctx = {\n        field: field.value,\n        // @ts-expect-error – targetModel does exist on the attribute. But it's not typed.\n        href: `../${COLLECTION_TYPES}/${props.attribute.targetModel}`,\n        mainField: props.mainField,\n      };\n\n      /**\n       * Tidy up our data.\n       */\n      const transformations = pipe(\n        removeConnected(ctx),\n        removeDisconnected(ctx),\n        addLabelAndHref(ctx)\n      );\n\n      const transformedRels = transformations([...data.results]);\n\n      /**\n       * THIS IS CRUCIAL. If you don't sort by the __temp_key__ which comes from fractional indexing\n       * then the list will be in the wrong order.\n       */\n      return [...transformedRels, ...(field.value?.connect ?? [])].sort((a, b) => {\n        if (a.__temp_key__ < b.__temp_key__) return -1;\n        if (a.__temp_key__ > b.__temp_key__) return 1;\n        return 0;\n      });\n    }, [\n      data.results,\n      field.value,\n      // @ts-expect-error – targetModel does exist on the attribute. But it's not typed.\n      props.attribute.targetModel,\n      props.mainField,\n    ]);\n\n    const handleDisconnect = useHandleDisconnect(props.name, 'RelationsField');\n\n    const handleConnect: RelationsInputProps['onChange'] = (relation) => {\n      const [lastItemInList] = relations.slice(-1);\n\n      const item = {\n        id: relation.id,\n        apiData: {\n          documentId: relation.documentId,\n          locale: relation.locale,\n        },\n        status: relation.status,\n        /**\n         * If there's a last item, that's the first key we use to generate out next one.\n         */\n        __temp_key__: generateNKeysBetween(lastItemInList?.__temp_key__ ?? null, null, 1)[0],\n        // Fallback to `id` if there is no `mainField` value, which will overwrite the above `id` property with the exact same data.\n        [props.mainField?.name ?? 'documentId']: relation[props.mainField?.name ?? 'documentId'],\n        label: getRelationLabel(relation, props.mainField),\n        // @ts-expect-error – targetModel does exist on the attribute, but it's not typed.\n        href: `../${COLLECTION_TYPES}/${props.attribute.targetModel}/${relation.documentId}?${relation.locale ? `plugins[i18n][locale]=${relation.locale}` : ''}`,\n      };\n\n      if (ONE_WAY_RELATIONS.includes(props.attribute.relation)) {\n        // Remove any existing relation so they can be replaced with the new one\n        field.value?.connect?.forEach(handleDisconnect);\n        relations.forEach(handleDisconnect);\n\n        field.onChange(`${props.name}.connect`, [item]);\n      } else {\n        field.onChange(`${props.name}.connect`, [...(field.value?.connect ?? []), item]);\n      }\n    };\n\n    return (\n      <Flex\n        ref={ref}\n        direction=\"column\"\n        gap={3}\n        justifyContent=\"space-between\"\n        alignItems=\"stretch\"\n        wrap=\"wrap\"\n      >\n        <StyledFlex direction=\"column\" alignItems=\"start\" gap={2} width=\"100%\">\n          <RelationsInput\n            disabled={isDisabled}\n            // NOTE: we should not default to using the documentId if the component is being created (componentUID is undefined)\n            id={componentUID ? (componentId ? `${componentId}` : '') : documentId}\n            label={`${label} ${relationsCount > 0 ? `(${relationsCount})` : ''}`}\n            model={model}\n            onChange={handleConnect}\n            {...props}\n          />\n          {'pagination' in data &&\n          data.pagination &&\n          data.pagination.pageCount > data.pagination.page ? (\n            <TextButton\n              disabled={isFetchingMoreRelations}\n              onClick={handleLoadMore}\n              loading={isFetchingMoreRelations}\n              startIcon={<ArrowClockwise />}\n              // prevent the label from line-wrapping\n              shrink={0}\n            >\n              {formatMessage({\n                id: getTranslation('relation.loadMore'),\n                defaultMessage: 'Load More',\n              })}\n            </TextButton>\n          ) : null}\n        </StyledFlex>\n        <RelationsList\n          data={relations}\n          serverData={data.results}\n          disabled={isDisabled}\n          name={props.name}\n          isLoading={isFetchingMoreRelations}\n          relationType={props.attribute.relation}\n        />\n      </Flex>\n    );\n  }\n);\n\n/**\n * TODO: this can be removed once we stop shipping Inputs with\n * labels wrapped round in DS@2.\n */\nconst StyledFlex = styled<FlexComponent>(Flex)`\n  & > div {\n    width: 100%;\n  }\n`;\n\n/* -------------------------------------------------------------------------------------------------\n * Relation Transformations\n * -----------------------------------------------------------------------------------------------*/\n\ninterface TransformationContext extends Pick<RelationsFieldProps, 'mainField'> {\n  field?: RelationsFormValue;\n  href: string;\n}\n\n/**\n * If it's in the connected array, it can get out of our data array,\n * we'll be putting it back in later and sorting it anyway.\n */\nconst removeConnected =\n  ({ field }: TransformationContext) =>\n  (relations: RelationResult[]) => {\n    return relations.filter((relation) => {\n      const connectedRelations = field?.connect ?? [];\n\n      return connectedRelations.findIndex((rel) => rel.id === relation.id) === -1;\n    });\n  };\n\n/**\n * @description Removes relations that are in the `disconnect` array of the field\n */\nconst removeDisconnected =\n  ({ field }: TransformationContext) =>\n  (relations: RelationResult[]): RelationResult[] =>\n    relations.filter((relation) => {\n      const disconnectedRelations = field?.disconnect ?? [];\n\n      return disconnectedRelations.findIndex((rel) => rel.id === relation.id) === -1;\n    });\n\n/**\n * @description Adds a label and href to the relation object we use this to render\n * a better UI where we can link to the relation and display a human-readable label.\n */\nconst addLabelAndHref =\n  ({ mainField, href }: TransformationContext) =>\n  (relations: RelationResult[]): Relation[] =>\n    relations.map((relation) => {\n      return {\n        ...relation,\n        // Fallback to `id` if there is no `mainField` value, which will overwrite the above `documentId` property with the exact same data.\n        [mainField?.name ?? 'documentId']: relation[mainField?.name ?? 'documentId'],\n        label: getRelationLabel(relation, mainField),\n        href: `${href}/${relation.documentId}?${relation.locale ? `plugins[i18n][locale]=${relation.locale}` : ''}`,\n      };\n    });\n\n/* -------------------------------------------------------------------------------------------------\n * RelationsInput\n * -----------------------------------------------------------------------------------------------*/\n\ninterface RelationsInputProps extends Omit<RelationsFieldProps, 'type'> {\n  id?: string;\n  model: string;\n  onChange: (\n    relation: Pick<RelationResult, 'documentId' | 'id' | 'locale' | 'status'> & {\n      [key: string]: any;\n    }\n  ) => void;\n}\n\n/**\n * @description Contains all the logic for the combobox that can search\n * for relations and then add them to the field's connect array.\n */\nconst RelationsInput = ({\n  hint,\n  id,\n  model,\n  label,\n  labelAction,\n  name,\n  mainField,\n  placeholder,\n  required,\n  unique: _unique,\n  'aria-label': _ariaLabel,\n  onChange,\n  ...props\n}: RelationsInputProps) => {\n  const [textValue, setTextValue] = React.useState<string | undefined>('');\n  const [searchParams, setSearchParams] = React.useState({\n    _q: '',\n    page: 1,\n  });\n  const { toggleNotification } = useNotification();\n  const [{ query }] = useQueryParams();\n\n  const { formatMessage } = useIntl();\n  const fieldRef = useFocusInputField<HTMLInputElement>(name);\n  const field = useField<RelationsFormValue>(name);\n\n  const [searchForTrigger, { data, isLoading }] = useLazySearchRelationsQuery();\n\n  /**\n   * Because we're using a lazy query, we need to trigger the search\n   * when the component mounts and when the search params change.\n   * We also need to trigger the search when the field value changes\n   * so that we can filter out the relations that are already connected.\n   */\n  React.useEffect(() => {\n    /**\n     * The `name` prop is a complete path to the field, e.g. `field1.field2.field3`.\n     * Where the above example would a nested field within two components, however\n     * we only require the field on the component not the complete path since we query\n     * individual components. Therefore we split the string and take the last item.\n     */\n    const [targetField] = name.split('.').slice(-1);\n\n    searchForTrigger({\n      model,\n      targetField,\n      params: {\n        ...buildValidParams(query),\n        id: id ?? '',\n        pageSize: 10,\n        idsToInclude: field.value?.disconnect?.map((rel) => rel.id.toString()) ?? [],\n        idsToOmit: field.value?.connect?.map((rel) => rel.id.toString()) ?? [],\n        ...searchParams,\n      },\n    });\n  }, [\n    field.value?.connect,\n    field.value?.disconnect,\n    id,\n    model,\n    name,\n    query,\n    searchForTrigger,\n    searchParams,\n  ]);\n\n  const handleSearch = async (search: string) => {\n    setSearchParams((s) => ({ ...s, _q: search, page: 1 }));\n  };\n\n  const hasNextPage = data?.pagination ? data.pagination.page < data.pagination.pageCount : false;\n\n  const options = data?.results ?? [];\n\n  const handleChange = (relationId?: string) => {\n    if (!relationId) {\n      return;\n    }\n\n    const relation = options.find((opt) => opt.id.toString() === relationId);\n\n    if (!relation) {\n      // This is very unlikely to happen, but it ensures we don't have any data for.\n      console.error(\n        \"You've tried to add a relation with an id that does not exist in the options you can see, this is likely a bug with Strapi. Please open an issue.\"\n      );\n\n      toggleNotification({\n        message: formatMessage({\n          id: getTranslation('relation.error-adding-relation'),\n          defaultMessage: 'An error occurred while trying to add the relation.',\n        }),\n        type: 'danger',\n      });\n\n      return;\n    }\n\n    /**\n     * You need to give this relation a correct _temp_key_ but\n     * this component doesn't know about those ones, you can't rely\n     * on the connect array because that doesn't hold items that haven't\n     * moved. So use a callback to fill in the gaps when connecting.\n     *\n     */\n    onChange(relation);\n  };\n\n  const handleLoadMore = () => {\n    if (!data || !data.pagination) {\n      return;\n    } else if (data.pagination.page < data.pagination.pageCount) {\n      setSearchParams((s) => ({ ...s, page: s.page + 1 }));\n    }\n  };\n\n  React.useLayoutEffect(() => {\n    setTextValue('');\n  }, [field.value]);\n\n  return (\n    <Field.Root error={field.error} hint={hint} name={name} required={required}>\n      <Field.Label action={labelAction}>{label}</Field.Label>\n      <Combobox\n        ref={fieldRef}\n        name={name}\n        autocomplete=\"list\"\n        placeholder={\n          placeholder ||\n          formatMessage({\n            id: getTranslation('relation.add'),\n            defaultMessage: 'Add relation',\n          })\n        }\n        hasMoreItems={hasNextPage}\n        loading={isLoading}\n        onOpenChange={() => {\n          handleSearch(textValue ?? '');\n        }}\n        noOptionsMessage={() =>\n          formatMessage({\n            id: getTranslation('relation.notAvailable'),\n            defaultMessage: 'No relations available',\n          })\n        }\n        loadingMessage={formatMessage({\n          id: getTranslation('relation.isLoading'),\n          defaultMessage: 'Relations are loading',\n        })}\n        onLoadMore={handleLoadMore}\n        textValue={textValue}\n        onChange={handleChange}\n        onTextValueChange={(text) => {\n          setTextValue(text);\n        }}\n        onInputChange={(event) => {\n          handleSearch(event.currentTarget.value);\n        }}\n        {...props}\n      >\n        {options.map((opt) => {\n          const textValue = getRelationLabel(opt, mainField);\n\n          return (\n            <ComboboxOption key={opt.id} value={opt.id.toString()} textValue={textValue}>\n              <Flex gap={2} justifyContent=\"space-between\">\n                <Typography ellipsis>{textValue}</Typography>\n                {opt.status ? <DocumentStatus status={opt.status} /> : null}\n              </Flex>\n            </ComboboxOption>\n          );\n        })}\n      </Combobox>\n      <Field.Error />\n      <Field.Hint />\n    </Field.Root>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * RelationsList\n * -----------------------------------------------------------------------------------------------*/\nconst RELATION_ITEM_HEIGHT = 50;\nconst RELATION_GUTTER = 4;\n\ninterface RelationsListProps extends Pick<RelationsFieldProps, 'disabled' | 'name'> {\n  data: Relation[];\n  isLoading?: boolean;\n  relationType: Schema.Attribute.RelationKind.Any;\n  /**\n   * The existing relations connected on the server. We need these to diff against.\n   */\n  serverData: RelationResult[];\n}\n\nconst RelationsList = ({\n  data,\n  serverData,\n  disabled,\n  name,\n  isLoading,\n  relationType,\n}: RelationsListProps) => {\n  const ariaDescriptionId = React.useId();\n  const { formatMessage } = useIntl();\n  const listRef = React.useRef<FixedSizeList>(null);\n  const outerListRef = React.useRef<HTMLUListElement>(null);\n  const [overflow, setOverflow] = React.useState<'top' | 'bottom' | 'top-bottom'>();\n  const [liveText, setLiveText] = React.useState('');\n  const field = useField(name);\n\n  React.useEffect(() => {\n    if (data.length <= RELATIONS_TO_DISPLAY) {\n      return setOverflow(undefined);\n    }\n\n    const handleNativeScroll = (e: Event) => {\n      const el = e.target as HTMLUListElement;\n      const parentScrollContainerHeight = (el.parentNode as HTMLDivElement).scrollHeight;\n      const maxScrollBottom = el.scrollHeight - el.scrollTop;\n\n      if (el.scrollTop === 0) {\n        return setOverflow('bottom');\n      }\n\n      if (maxScrollBottom === parentScrollContainerHeight) {\n        return setOverflow('top');\n      }\n\n      return setOverflow('top-bottom');\n    };\n\n    const outerListRefCurrent = outerListRef?.current;\n\n    if (!isLoading && data.length > 0 && outerListRefCurrent) {\n      outerListRef.current.addEventListener('scroll', handleNativeScroll);\n    }\n\n    return () => {\n      if (outerListRefCurrent) {\n        outerListRefCurrent.removeEventListener('scroll', handleNativeScroll);\n      }\n    };\n  }, [isLoading, data.length]);\n\n  const getItemPos = (index: number) => `${index + 1} of ${data.length}`;\n\n  const handleMoveItem: UseDragAndDropOptions['onMoveItem'] = (newIndex, oldIndex) => {\n    const item = data[oldIndex];\n\n    setLiveText(\n      formatMessage(\n        {\n          id: getTranslation('dnd.reorder'),\n          defaultMessage: '{item}, moved. New position in list: {position}.',\n        },\n        {\n          item: item.label ?? item.documentId,\n          position: getItemPos(newIndex),\n        }\n      )\n    );\n\n    /**\n     * Splicing mutates the array, so we need to create a new array\n     */\n    const newData = [...data];\n    const currentRow = data[oldIndex];\n\n    const startKey =\n      oldIndex > newIndex ? newData[newIndex - 1]?.__temp_key__ : newData[newIndex]?.__temp_key__;\n    const endKey =\n      oldIndex > newIndex ? newData[newIndex]?.__temp_key__ : newData[newIndex + 1]?.__temp_key__;\n\n    /**\n     * We're moving the relation between two other relations, so\n     * we need to generate a new key that keeps the order\n     */\n    const [newKey] = generateNKeysBetween(startKey, endKey, 1);\n\n    newData.splice(oldIndex, 1);\n    newData.splice(newIndex, 0, { ...currentRow, __temp_key__: newKey });\n\n    /**\n     * Now we diff against the server to understand what's different so we\n     * can keep the connect array nice and tidy. It also needs reversing because\n     * we reverse the relations from the server in the first place.\n     */\n    const connectedRelations = newData\n      .reduce<Relation[]>((acc, relation, currentIndex, array) => {\n        const relationOnServer = serverData.find((oldRelation) => oldRelation.id === relation.id);\n\n        const relationInFront = array[currentIndex + 1];\n\n        if (!relationOnServer || relationOnServer.__temp_key__ !== relation.__temp_key__) {\n          const position = relationInFront\n            ? {\n                before: relationInFront.documentId,\n                locale: relationInFront.locale,\n                status:\n                  'publishedAt' in relationInFront && relationInFront.publishedAt\n                    ? 'published'\n                    : 'draft',\n              }\n            : { end: true };\n\n          const relationWithPosition: Relation = {\n            ...relation,\n            ...{\n              apiData: {\n                documentId: relation.documentId,\n                locale: relation.locale,\n                position,\n              },\n            },\n          };\n\n          return [...acc, relationWithPosition];\n        }\n\n        return acc;\n      }, [])\n      .toReversed();\n\n    field.onChange(`${name}.connect`, connectedRelations);\n  };\n\n  const handleGrabItem: UseDragAndDropOptions['onGrabItem'] = (index) => {\n    const item = data[index];\n\n    setLiveText(\n      formatMessage(\n        {\n          id: getTranslation('dnd.grab-item'),\n          defaultMessage: `{item}, grabbed. Current position in list: {position}. Press up and down arrow to change position, Spacebar to drop, Escape to cancel.`,\n        },\n        {\n          item: item.label ?? item.documentId,\n          position: getItemPos(index),\n        }\n      )\n    );\n  };\n\n  const handleDropItem: UseDragAndDropOptions['onDropItem'] = (index) => {\n    const { href: _href, label, ...item } = data[index];\n\n    setLiveText(\n      formatMessage(\n        {\n          id: getTranslation('dnd.drop-item'),\n          defaultMessage: `{item}, dropped. Final position in list: {position}.`,\n        },\n        {\n          item: label ?? item.documentId,\n          position: getItemPos(index),\n        }\n      )\n    );\n  };\n\n  const handleCancel: UseDragAndDropOptions['onCancel'] = (index) => {\n    const item = data[index];\n\n    setLiveText(\n      formatMessage(\n        {\n          id: getTranslation('dnd.cancel-item'),\n          defaultMessage: '{item}, dropped. Re-order cancelled.',\n        },\n        {\n          item: item.label ?? item.documentId,\n        }\n      )\n    );\n  };\n\n  const handleDisconnect = useHandleDisconnect(name, 'RelationsList');\n\n  /**\n   * These relation types will only ever have one item\n   * in their list, so you can't reorder a single item!\n   */\n  const canReorder = !ONE_WAY_RELATIONS.includes(relationType);\n\n  const dynamicListHeight =\n    data.length > RELATIONS_TO_DISPLAY\n      ? Math.min(data.length, RELATIONS_TO_DISPLAY) * (RELATION_ITEM_HEIGHT + RELATION_GUTTER) +\n        RELATION_ITEM_HEIGHT / 2\n      : Math.min(data.length, RELATIONS_TO_DISPLAY) * (RELATION_ITEM_HEIGHT + RELATION_GUTTER);\n\n  return (\n    <ShadowBox $overflowDirection={overflow}>\n      <VisuallyHidden id={ariaDescriptionId}>\n        {formatMessage({\n          id: getTranslation('dnd.instructions'),\n          defaultMessage: `Press spacebar to grab and re-order`,\n        })}\n      </VisuallyHidden>\n      <VisuallyHidden aria-live=\"assertive\">{liveText}</VisuallyHidden>\n      {/* @ts-expect-error – width is expected, but we've not needed to pass it before. */}\n      <FixedSizeList\n        height={dynamicListHeight}\n        ref={listRef}\n        outerRef={outerListRef}\n        itemCount={data.length}\n        itemSize={RELATION_ITEM_HEIGHT + RELATION_GUTTER}\n        itemData={{\n          ariaDescribedBy: ariaDescriptionId,\n          canDrag: canReorder,\n          disabled,\n          handleCancel,\n          handleDropItem,\n          handleGrabItem,\n          handleMoveItem,\n          name,\n          handleDisconnect,\n          relations: data,\n        }}\n        itemKey={(index) => data[index].id}\n        innerElementType=\"ol\"\n      >\n        {ListItem}\n      </FixedSizeList>\n    </ShadowBox>\n  );\n};\n\nconst ShadowBox = styled<BoxComponent>(Box)<{\n  $overflowDirection?: 'top-bottom' | 'top' | 'bottom';\n}>`\n  position: relative;\n  overflow: hidden;\n  flex: 1;\n\n  &:before,\n  &:after {\n    position: absolute;\n    width: 100%;\n    height: 4px;\n    z-index: 1;\n  }\n\n  &:before {\n    /* TODO: as for DS Table component we would need this to be handled by the DS theme */\n    content: '';\n    background: linear-gradient(rgba(3, 3, 5, 0.2) 0%, rgba(0, 0, 0, 0) 100%);\n    top: 0;\n    opacity: ${({ $overflowDirection }) =>\n      $overflowDirection === 'top-bottom' || $overflowDirection === 'top' ? 1 : 0};\n    transition: opacity 0.2s ease-in-out;\n  }\n\n  &:after {\n    /* TODO: as for DS Table component we would need this to be handled by the DS theme */\n    content: '';\n    background: linear-gradient(0deg, rgba(3, 3, 5, 0.2) 0%, rgba(0, 0, 0, 0) 100%);\n    bottom: 0;\n    opacity: ${({ $overflowDirection }) =>\n      $overflowDirection === 'top-bottom' || $overflowDirection === 'bottom' ? 1 : 0};\n    transition: opacity 0.2s ease-in-out;\n  }\n`;\n\n/* -------------------------------------------------------------------------------------------------\n * ListItem\n * -----------------------------------------------------------------------------------------------*/\n\ninterface ListItemProps extends Pick<ListChildComponentProps, 'style' | 'index'> {\n  data: {\n    ariaDescribedBy: string;\n    canDrag?: boolean;\n    disabled?: boolean;\n    handleCancel: UseDragAndDropOptions['onCancel'];\n    handleDropItem: UseDragAndDropOptions['onDropItem'];\n    handleGrabItem: UseDragAndDropOptions['onGrabItem'];\n    handleMoveItem: UseDragAndDropOptions['onMoveItem'];\n    handleDisconnect: (relation: Relation) => void;\n    name: string;\n    relations: Relation[];\n  };\n}\n\nconst ListItem = ({ data, index, style }: ListItemProps) => {\n  const {\n    ariaDescribedBy,\n    canDrag = false,\n    disabled = false,\n    handleCancel,\n    handleDisconnect,\n    handleDropItem,\n    handleGrabItem,\n    handleMoveItem,\n    name,\n    relations,\n  } = data;\n  const { formatMessage } = useIntl();\n\n  const { href, id, label, status } = relations[index];\n\n  const [{ handlerId, isDragging, handleKeyDown }, relationRef, dropRef, dragRef, dragPreviewRef] =\n    useDragAndDrop<number, Omit<RelationDragPreviewProps, 'width'>, HTMLDivElement>(\n      canDrag && !disabled,\n      {\n        type: `${ItemTypes.RELATION}_${name}`,\n        index,\n        item: {\n          displayedValue: label,\n          status,\n          id: id,\n          index,\n        },\n        onMoveItem: handleMoveItem,\n        onDropItem: handleDropItem,\n        onGrabItem: handleGrabItem,\n        onCancel: handleCancel,\n        dropSensitivity: DROP_SENSITIVITY.REGULAR,\n      }\n    );\n\n  const composedRefs = useComposedRefs<HTMLDivElement>(relationRef, dragRef);\n\n  React.useEffect(() => {\n    dragPreviewRef(getEmptyImage());\n  }, [dragPreviewRef]);\n\n  return (\n    <Box\n      style={style}\n      tag=\"li\"\n      ref={dropRef}\n      aria-describedby={ariaDescribedBy}\n      cursor={canDrag ? 'all-scroll' : 'default'}\n    >\n      {isDragging ? (\n        <RelationItemPlaceholder />\n      ) : (\n        <Flex\n          paddingTop={2}\n          paddingBottom={2}\n          paddingLeft={canDrag ? 2 : 4}\n          paddingRight={4}\n          hasRadius\n          borderColor=\"neutral200\"\n          background={disabled ? 'neutral150' : 'neutral0'}\n          justifyContent=\"space-between\"\n          ref={composedRefs}\n          data-handler-id={handlerId}\n        >\n          <FlexWrapper gap={1}>\n            {canDrag ? (\n              <IconButton\n                tag=\"div\"\n                role=\"button\"\n                tabIndex={0}\n                withTooltip={false}\n                label={formatMessage({\n                  id: getTranslation('components.RelationInput.icon-button-aria-label'),\n                  defaultMessage: 'Drag',\n                })}\n                variant=\"ghost\"\n                onKeyDown={handleKeyDown}\n                disabled={disabled}\n              >\n                <Drag />\n              </IconButton>\n            ) : null}\n            <Flex width=\"100%\" minWidth={0} justifyContent=\"space-between\">\n              <Box minWidth={0} paddingTop={1} paddingBottom={1} paddingRight={4}>\n                <Tooltip description={label}>\n                  {href ? (\n                    <LinkEllipsis tag={NavLink} to={href} isExternal={false}>\n                      {label}\n                    </LinkEllipsis>\n                  ) : (\n                    <Typography textColor={disabled ? 'neutral600' : 'primary600'} ellipsis>\n                      {label}\n                    </Typography>\n                  )}\n                </Tooltip>\n              </Box>\n              {status ? <DocumentStatus status={status} /> : null}\n            </Flex>\n          </FlexWrapper>\n          <Box paddingLeft={4}>\n            <IconButton\n              onClick={() => handleDisconnect(relations[index])}\n              disabled={disabled}\n              label={formatMessage({\n                id: getTranslation('relation.disconnect'),\n                defaultMessage: 'Remove',\n              })}\n              variant=\"ghost\"\n              size=\"S\"\n            >\n              <Cross />\n            </IconButton>\n          </Box>\n        </Flex>\n      )}\n    </Box>\n  );\n};\n\nconst FlexWrapper = styled<FlexComponent>(Flex)`\n  width: 100%;\n  /* Used to prevent endAction to be pushed out of container */\n  min-width: 0;\n\n  & > div[role='button'] {\n    cursor: all-scroll;\n  }\n`;\n\nconst DisconnectButton = styled.button`\n  svg path {\n    fill: ${({ theme, disabled }) =>\n      disabled ? theme.colors.neutral600 : theme.colors.neutral500};\n  }\n\n  &:hover svg path,\n  &:focus svg path {\n    fill: ${({ theme, disabled }) => !disabled && theme.colors.neutral600};\n  }\n`;\n\nconst LinkEllipsis = styled(Link)`\n  display: block;\n\n  & > span {\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    display: block;\n  }\n`;\n\nconst RelationItemPlaceholder = () => (\n  <Box\n    paddingTop={2}\n    paddingBottom={2}\n    paddingLeft={4}\n    paddingRight={4}\n    hasRadius\n    borderStyle=\"dashed\"\n    borderColor=\"primary600\"\n    borderWidth=\"1px\"\n    background=\"primary100\"\n    height={`calc(100% - ${RELATION_GUTTER}px)`}\n  />\n);\n\nconst MemoizedRelationsField = React.memo(RelationsField);\n\nexport { MemoizedRelationsField as RelationsInput, FlexWrapper, DisconnectButton, LinkEllipsis };\nexport type { RelationsFieldProps };\n"],"names":["createContext","useField","useForm","React","useDoc","useIntl","useQueryParams","buildValidParams","id","useGetRelationsQuery","relations","COLLECTION_TYPES","pipe","generateNKeysBetween","getRelationLabel","jsxs","Flex","jsx","TextButton","ArrowClockwise","getTranslation","styled","useNotification","useFocusInputField","useLazySearchRelationsQuery","Field","Combobox","textValue","ComboboxOption","Typography","DocumentStatus","index","VisuallyHidden","FixedSizeList","Box","useDragAndDrop","ItemTypes","DROP_SENSITIVITY","useComposedRefs","getEmptyImage","IconButton","Drag","Tooltip","NavLink","Cross","Link"],"mappings":"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"}