@strapi/content-manager 0.0.0-next.64bd4f3d1efcc9420d27c4f4d2013677ded62360 → 0.0.0-next.6d1431fe2a53b80b47ad9f00187cd7bae9d5f46b

package/dist/_chunks/Preview-DpB7tlma.js

@@ -0,0 +1,141 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const strapiAdmin = require("@strapi/admin/strapi-admin");
+const designSystem = require("@strapi/design-system");
+const reactIntl = require("react-intl");
+const reactRouterDom = require("react-router-dom");
+const index = require("./index-KzSpgsQa.js");
+function _interopNamespace(e) {
+  if (e && e.__esModule)
+    return e;
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespace(React);
+const [PreviewProvider, usePreviewContext] = strapiAdmin.createContext("PreviewPage");
+const PreviewPage = () => {
+  const { formatMessage } = reactIntl.useIntl();
+  const {
+    slug: model,
+    id: documentId,
+    collectionType
+  } = reactRouterDom.useParams();
+  const [{ query }] = strapiAdmin.useQueryParams();
+  const params = React__namespace.useMemo(() => index.buildValidParams(query), [query]);
+  if (!collectionType) {
+    throw new Error("Could not find collectionType in url params");
+  }
+  if (!model) {
+    throw new Error("Could not find model in url params");
+  }
+  if (collectionType === index.COLLECTION_TYPES && !documentId) {
+    throw new Error("Could not find documentId in url params");
+  }
+  const previewUrlResponse = index.useGetPreviewUrlQuery({
+    params: {
+      contentType: model
+    },
+    query: {
+      documentId,
+      locale: params.locale,
+      status: params.status
+    }
+  });
+  const documentResponse = index.useDocument({
+    model,
+    collectionType,
+    documentId,
+    params
+  });
+  const documentLayoutResponse = index.useDocumentLayout(model);
+  if (documentResponse.isLoading || previewUrlResponse.isLoading || documentLayoutResponse.isLoading) {
+    return /* @__PURE__ */ jsxRuntime.jsx(strapiAdmin.Page.Loading, {});
+  }
+  if (previewUrlResponse.error || documentLayoutResponse.error || !documentResponse.document || !documentResponse.meta || !documentResponse.schema) {
+    return /* @__PURE__ */ jsxRuntime.jsx(strapiAdmin.Page.Error, {});
+  }
+  if (!previewUrlResponse.data?.data?.url) {
+    return /* @__PURE__ */ jsxRuntime.jsx(strapiAdmin.Page.NoData, {});
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(strapiAdmin.Page.Title, { children: formatMessage(
+      {
+        id: "content-manager.preview.page-title",
+        defaultMessage: "{contentType} preview"
+      },
+      {
+        contentType: documentLayoutResponse.edit.settings.displayName
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      PreviewProvider,
+      {
+        url: previewUrlResponse.data.data.url,
+        mainField: documentLayoutResponse.edit.settings.mainField,
+        document: documentResponse.document,
+        meta: documentResponse.meta,
+        schema: documentResponse.schema,
+        children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { children: "Preview will go here!" })
+      }
+    )
+  ] });
+};
+const ProtectedPreviewPageImpl = () => {
+  const { slug: model } = reactRouterDom.useParams();
+  const {
+    permissions = [],
+    isLoading,
+    error
+  } = strapiAdmin.useRBAC([{ action: "plugin::content-manager.explorer.read", subject: model }]);
+  if (isLoading) {
+    return /* @__PURE__ */ jsxRuntime.jsx(strapiAdmin.Page.Loading, {});
+  }
+  if (error || !model) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      designSystem.Box,
+      {
+        height: "100vh",
+        width: "100vw",
+        position: "fixed",
+        top: 0,
+        left: 0,
+        zIndex: 2,
+        background: "neutral0",
+        children: /* @__PURE__ */ jsxRuntime.jsx(strapiAdmin.Page.Error, {})
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    designSystem.Box,
+    {
+      height: "100vh",
+      width: "100vw",
+      position: "fixed",
+      top: 0,
+      left: 0,
+      zIndex: 2,
+      background: "neutral0",
+      children: /* @__PURE__ */ jsxRuntime.jsx(strapiAdmin.Page.Protect, { permissions, children: ({ permissions: permissions2 }) => /* @__PURE__ */ jsxRuntime.jsx(index.DocumentRBAC, { permissions: permissions2, children: /* @__PURE__ */ jsxRuntime.jsx(PreviewPage, {}) }) })
+    }
+  );
+};
+const ProtectedPreviewPage = () => {
+  return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.FocusTrap, { children: /* @__PURE__ */ jsxRuntime.jsx(ProtectedPreviewPageImpl, {}) }) });
+};
+exports.ProtectedPreviewPage = ProtectedPreviewPage;
+exports.usePreviewContext = usePreviewContext;
+//# sourceMappingURL=Preview-DpB7tlma.js.map

package/dist/_chunks/Preview-DpB7tlma.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Preview-DpB7tlma.js","sources":["../../admin/src/preview/pages/Preview.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Page, useQueryParams, useRBAC, createContext } from '@strapi/admin/strapi-admin';\nimport { Box, FocusTrap, Portal, Typography } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\nimport { useParams } from 'react-router-dom';\n\nimport { GetPreviewUrl } from '../../../../shared/contracts/preview';\nimport { COLLECTION_TYPES } from '../../constants/collections';\nimport { DocumentRBAC } from '../../features/DocumentRBAC';\nimport { type UseDocument, useDocument } from '../../hooks/useDocument';\nimport { useDocumentLayout } from '../../hooks/useDocumentLayout';\nimport { buildValidParams } from '../../utils/api';\nimport { useGetPreviewUrlQuery } from '../services/preview';\n\nimport type { UID } from '@strapi/types';\n\n/* -------------------------------------------------------------------------------------------------\n * PreviewProvider\n * -----------------------------------------------------------------------------------------------*/\n\ninterface PreviewContextValue {\n  url: string;\n  mainField: string;\n  document: NonNullable<ReturnType<UseDocument>['document']>;\n  meta: NonNullable<ReturnType<UseDocument>['meta']>;\n  schema: NonNullable<ReturnType<UseDocument>['schema']>;\n}\n\nconst [PreviewProvider, usePreviewContext] = createContext<PreviewContextValue>('PreviewPage');\n\n/* -------------------------------------------------------------------------------------------------\n * PreviewPage\n * -----------------------------------------------------------------------------------------------*/\n\nconst PreviewPage = () => {\n  const { formatMessage } = useIntl();\n\n  // Read all the necessary data from the URL to find the right preview URL\n  const {\n    slug: model,\n    id: documentId,\n    collectionType,\n  } = useParams<{\n    slug: UID.ContentType;\n    id: string;\n    collectionType: string;\n  }>();\n  const [{ query }] = useQueryParams<{\n    plugins?: Record<string, unknown>;\n  }>();\n  const params = React.useMemo(() => buildValidParams(query), [query]);\n\n  if (!collectionType) {\n    throw new Error('Could not find collectionType in url params');\n  }\n\n  if (!model) {\n    throw new Error('Could not find model in url params');\n  }\n\n  // Only collection types must have a documentId\n  if (collectionType === COLLECTION_TYPES && !documentId) {\n    throw new Error('Could not find documentId in url params');\n  }\n\n  const previewUrlResponse = useGetPreviewUrlQuery({\n    params: {\n      contentType: model,\n    },\n    query: {\n      documentId,\n      locale: params.locale,\n      status: params.status as GetPreviewUrl.Request['query']['status'],\n    },\n  });\n\n  const documentResponse = useDocument({\n    model,\n    collectionType,\n    documentId,\n    params,\n  });\n\n  const documentLayoutResponse = useDocumentLayout(model);\n\n  if (\n    documentResponse.isLoading ||\n    previewUrlResponse.isLoading ||\n    documentLayoutResponse.isLoading\n  ) {\n    return <Page.Loading />;\n  }\n\n  if (\n    previewUrlResponse.error ||\n    documentLayoutResponse.error ||\n    !documentResponse.document ||\n    !documentResponse.meta ||\n    !documentResponse.schema\n  ) {\n    return <Page.Error />;\n  }\n\n  if (!previewUrlResponse.data?.data?.url) {\n    return <Page.NoData />;\n  }\n\n  return (\n    <>\n      <Page.Title>\n        {formatMessage(\n          {\n            id: 'content-manager.preview.page-title',\n            defaultMessage: '{contentType} preview',\n          },\n          {\n            contentType: documentLayoutResponse.edit.settings.displayName,\n          }\n        )}\n      </Page.Title>\n      <PreviewProvider\n        url={previewUrlResponse.data.data.url}\n        mainField={documentLayoutResponse.edit.settings.mainField}\n        document={documentResponse.document}\n        meta={documentResponse.meta}\n        schema={documentResponse.schema}\n      >\n        <Typography>Preview will go here!</Typography>\n      </PreviewProvider>\n    </>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * ProtectedPreviewPage\n * -----------------------------------------------------------------------------------------------*/\n\nconst ProtectedPreviewPageImpl = () => {\n  const { slug: model } = useParams<{\n    slug: string;\n  }>();\n  const {\n    permissions = [],\n    isLoading,\n    error,\n  } = useRBAC([{ action: 'plugin::content-manager.explorer.read', subject: model }]);\n\n  if (isLoading) {\n    return <Page.Loading />;\n  }\n\n  if (error || !model) {\n    return (\n      <Box\n        height=\"100vh\"\n        width=\"100vw\"\n        position=\"fixed\"\n        top={0}\n        left={0}\n        zIndex={2}\n        background=\"neutral0\"\n      >\n        <Page.Error />\n      </Box>\n    );\n  }\n\n  return (\n    <Box\n      height=\"100vh\"\n      width=\"100vw\"\n      position=\"fixed\"\n      top={0}\n      left={0}\n      zIndex={2}\n      background=\"neutral0\"\n    >\n      <Page.Protect permissions={permissions}>\n        {({ permissions }) => (\n          <DocumentRBAC permissions={permissions}>\n            <PreviewPage />\n          </DocumentRBAC>\n        )}\n      </Page.Protect>\n    </Box>\n  );\n};\n\nconst ProtectedPreviewPage = () => {\n  return (\n    <Portal>\n      <FocusTrap>\n        <ProtectedPreviewPageImpl />\n      </FocusTrap>\n    </Portal>\n  );\n};\n\nexport { ProtectedPreviewPage, usePreviewContext };\n"],"names":["createContext","useIntl","useParams","useQueryParams","React","buildValidParams","COLLECTION_TYPES","useGetPreviewUrlQuery","useDocument","useDocumentLayout","jsx","Page","jsxs","Fragment","Typography","useRBAC","Box","permissions","DocumentRBAC","Portal","FocusTrap"],"mappings":"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"}

package/dist/_chunks/{Relations-Dq52hb_u.mjs → Relations-BK3w1JyT.mjs}

@@ -10,9 +10,9 @@ import { useIntl } from "react-intl";
 import { NavLink } from "react-router-dom";
 import { FixedSizeList } from "react-window";
 import { styled } from "styled-components";
-import { c as useDoc, d as buildValidParams, C as COLLECTION_TYPES, g as getTranslation, D as DocumentStatus } from "./index-1Bdj-6ls.mjs";
+import { c as useDoc, d as buildValidParams, C as COLLECTION_TYPES, g as getTranslation, D as DocumentStatus } from "./index-Bl3BGqcN.mjs";
 import { u as useDragAndDrop, I as ItemTypes, D as DROP_SENSITIVITY } from "./useDragAndDrop-DdHgKsqq.mjs";
-import { u as useGetRelationsQuery, g as getRelationLabel, a as useLazySearchRelationsQuery } from "./relations-DFwbNLZ0.mjs";
+import { u as useGetRelationsQuery, g as getRelationLabel, a as useLazySearchRelationsQuery } from "./relations-KkpGHlgm.mjs";
 const [ComponentProvider, useComponent] = createContext("ComponentContext", {
   id: void 0,
   level: -1,
@@ -36,6 +36,7 @@ function useHandleDisconnect(fieldName, consumerName) {
     addFieldRow(`${fieldName}.disconnect`, {
       id: relation.id,
       apiData: {
+        id: relation.id,
         documentId: relation.documentId,
         locale: relation.locale
       }
@@ -136,6 +137,7 @@ const RelationsField = React.forwardRef(
       const item = {
         id: relation.id,
         apiData: {
+          id: relation.id,
           documentId: relation.documentId,
           locale: relation.locale
         },
@@ -446,6 +448,7 @@ const RelationsList = ({
           ...relation,
           ...{
             apiData: {
+              id: relation.id,
               documentId: relation.documentId,
               locale: relation.locale,
               position
@@ -724,4 +727,4 @@ export {
   MemoizedRelationsField as M,
   useComponent as u
 };
-//# sourceMappingURL=Relations-Dq52hb_u.mjs.map
+//# sourceMappingURL=Relations-BK3w1JyT.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Relations-BK3w1JyT.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        id: relation.id,\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          id: relation.id,\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                id: relation.id,\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-SRwPhmo7.js → Relations-mHVb9pZH.js}

@@ -11,9 +11,9 @@ const reactIntl = require("react-intl");
 const reactRouterDom = require("react-router-dom");
 const reactWindow = require("react-window");
 const styledComponents = require("styled-components");
-const index = require("./index-CsrCnNa3.js");
+const index = require("./index-KzSpgsQa.js");
 const useDragAndDrop = require("./useDragAndDrop-J0TUUbR6.js");
-const relations = require("./relations-BBHlo3qQ.js");
+const relations = require("./relations-CnyTxXmA.js");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 function _interopNamespace(e) {
   if (e && e.__esModule)
@@ -58,6 +58,7 @@ function useHandleDisconnect(fieldName, consumerName) {
     addFieldRow(`${fieldName}.disconnect`, {
       id: relation.id,
       apiData: {
+        id: relation.id,
         documentId: relation.documentId,
         locale: relation.locale
       }
@@ -158,6 +159,7 @@ const RelationsField = React__namespace.forwardRef(
       const item = {
         id: relation.id,
         apiData: {
+          id: relation.id,
           documentId: relation.documentId,
           locale: relation.locale
         },
@@ -468,6 +470,7 @@ const RelationsList = ({
           ...relation,
           ...{
             apiData: {
+              id: relation.id,
               documentId: relation.documentId,
               locale: relation.locale,
               position
@@ -744,4 +747,4 @@ exports.FlexWrapper = FlexWrapper;
 exports.LinkEllipsis = LinkEllipsis;
 exports.MemoizedRelationsField = MemoizedRelationsField;
 exports.useComponent = useComponent;
-//# sourceMappingURL=Relations-SRwPhmo7.js.map
+//# sourceMappingURL=Relations-mHVb9pZH.js.map

package/dist/_chunks/Relations-mHVb9pZH.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Relations-mHVb9pZH.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        id: relation.id,\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          id: relation.id,\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                id: relation.id,\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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"}

package/dist/_chunks/{en-DKV44jRb.mjs → en-pIGSfG2_.mjs}

@@ -74,7 +74,7 @@ const en = {
   "components.TableEmpty.withFilters": "There are no {contentType} with the applied filters...",
   "components.TableEmpty.withSearch": "There are no {contentType} corresponding to the search ({search})...",
   "components.TableEmpty.withoutFilter": "There are no {contentType}...",
-  "components.empty-repeatable": "No entry yet. Click on the button below to add one.",
+  "components.empty-repeatable": "No entry yet. Click to add one.",
   "components.notification.info.maximum-requirement": "You have already reached the maximum number of fields",
   "components.notification.info.minimum-requirement": "A field has been added to match the minimum requirement",
   "components.repeatable.reorder.error": "An error occurred while reordering your component's field, please try again",
@@ -234,6 +234,12 @@ const en = {
   "popUpWarning.warning.unpublish-question": "Are you sure you don't want to publish it?",
   "popUpWarning.warning.updateAllSettings": "This will modify all your settings",
   "popover.display-relations.label": "Display relations",
+  "preview.panel.title": "Preview",
+  "preview.panel.button": "Open preview",
+  "preview.page-title": "{contentType} preview",
+  "preview.header.close": "Close preview",
+  "preview.copy.label": "Copy preview link",
+  "preview.copy.success": "Copied preview link",
   "relation.add": "Add relation",
   "relation.disconnect": "Remove",
   "relation.error-adding-relation": "An error occurred while trying to add the relation.",
@@ -290,4 +296,4 @@ export {
   models,
   pageNotFound
 };
-//# sourceMappingURL=en-DKV44jRb.mjs.map
+//# sourceMappingURL=en-pIGSfG2_.mjs.map

package/dist/_chunks/{en-DKV44jRb.mjs.map → en-pIGSfG2_.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"en-DKV44jRb.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"en-pIGSfG2_.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/_chunks/{en-Bm0D0IWz.js → en-tanszW-q.js}

@@ -76,7 +76,7 @@ const en = {
   "components.TableEmpty.withFilters": "There are no {contentType} with the applied filters...",
   "components.TableEmpty.withSearch": "There are no {contentType} corresponding to the search ({search})...",
   "components.TableEmpty.withoutFilter": "There are no {contentType}...",
-  "components.empty-repeatable": "No entry yet. Click on the button below to add one.",
+  "components.empty-repeatable": "No entry yet. Click to add one.",
   "components.notification.info.maximum-requirement": "You have already reached the maximum number of fields",
   "components.notification.info.minimum-requirement": "A field has been added to match the minimum requirement",
   "components.repeatable.reorder.error": "An error occurred while reordering your component's field, please try again",
@@ -236,6 +236,12 @@ const en = {
   "popUpWarning.warning.unpublish-question": "Are you sure you don't want to publish it?",
   "popUpWarning.warning.updateAllSettings": "This will modify all your settings",
   "popover.display-relations.label": "Display relations",
+  "preview.panel.title": "Preview",
+  "preview.panel.button": "Open preview",
+  "preview.page-title": "{contentType} preview",
+  "preview.header.close": "Close preview",
+  "preview.copy.label": "Copy preview link",
+  "preview.copy.success": "Copied preview link",
   "relation.add": "Add relation",
   "relation.disconnect": "Remove",
   "relation.error-adding-relation": "An error occurred while trying to add the relation.",
@@ -290,4 +296,4 @@ exports.default = en;
 exports.groups = groups;
 exports.models = models;
 exports.pageNotFound = pageNotFound;
-//# sourceMappingURL=en-Bm0D0IWz.js.map
+//# sourceMappingURL=en-tanszW-q.js.map

package/dist/_chunks/{en-Bm0D0IWz.js.map → en-tanszW-q.js.map}

@@ -1 +1 @@
-{"version":3,"file":"en-Bm0D0IWz.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"en-tanszW-q.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/_chunks/{es-EUonQTon.js → es-9K52xZIr.js}

@@ -54,7 +54,7 @@ const es = {
   "components.TableEmpty.withFilters": "No hay {contentType} con los filtros aplicados...",
   "components.TableEmpty.withSearch": "No hay {contentType} que coincida con la búsqueda ({search})...",
   "components.TableEmpty.withoutFilter": "No hay {contentType}...",
-  "components.empty-repeatable": "Aún no hay entrada. Haga clic en el botón de abajo para agregar uno.",
+  "components.empty-repeatable": "Aún no hay entrada. Haga clic para agregar una.",
   "components.notification.info.maximum-requirement": "Ya has alcanzado el número máximo de campos",
   "components.notification.info.minimum-requirement": "Se ha agregado un campo para cumplir con el requisito mínimo",
   "components.repeatable.reorder.error": "Se produjo un error al reordenar el campo de su componente. Vuelva a intentarlo.",
@@ -193,4 +193,4 @@ exports.default = es;
 exports.groups = groups;
 exports.models = models;
 exports.pageNotFound = pageNotFound;
-//# sourceMappingURL=es-EUonQTon.js.map
+//# sourceMappingURL=es-9K52xZIr.js.map

package/dist/_chunks/{ja-CcFe8diO.js.map → es-9K52xZIr.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ja-CcFe8diO.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"es-9K52xZIr.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/_chunks/{es-CeXiYflN.mjs → es-D34tqjMw.mjs}

@@ -52,7 +52,7 @@ const es = {
   "components.TableEmpty.withFilters": "No hay {contentType} con los filtros aplicados...",
   "components.TableEmpty.withSearch": "No hay {contentType} que coincida con la búsqueda ({search})...",
   "components.TableEmpty.withoutFilter": "No hay {contentType}...",
-  "components.empty-repeatable": "Aún no hay entrada. Haga clic en el botón de abajo para agregar uno.",
+  "components.empty-repeatable": "Aún no hay entrada. Haga clic para agregar una.",
   "components.notification.info.maximum-requirement": "Ya has alcanzado el número máximo de campos",
   "components.notification.info.minimum-requirement": "Se ha agregado un campo para cumplir con el requisito mínimo",
   "components.repeatable.reorder.error": "Se produjo un error al reordenar el campo de su componente. Vuelva a intentarlo.",
@@ -193,4 +193,4 @@ export {
   models,
   pageNotFound
 };
-//# sourceMappingURL=es-CeXiYflN.mjs.map
+//# sourceMappingURL=es-D34tqjMw.mjs.map