@payloadcms/plugin-import-export 4.0.0-internal.f11981a → 4.0.0-internal.f15737c

package/dist/components/CollectionField/index.d.ts

@@ -1,3 +1,4 @@
-import type { TextFieldClientComponent } from 'payload';
-export declare const CollectionField: TextFieldClientComponent;
+import type { TextFieldClientProps } from 'payload';
+import type React from 'react';
+export declare const CollectionField: React.FC<TextFieldClientProps>;
 //# sourceMappingURL=index.d.ts.map

package/dist/components/CollectionField/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/CollectionField/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,SAAS,CAAA;AAIvD,eAAO,MAAM,eAAe,EAAE,wBAE7B,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/CollectionField/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AACnD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAE1D,CAAA"}

package/dist/components/CollectionField/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/CollectionField/index.tsx"],"sourcesContent":["'use client'\nimport type { TextFieldClientComponent } from 'payload'\n\nimport { CollectionSelectField } from '../CollectionSelectField/index.js'\n\nexport const CollectionField: TextFieldClientComponent = (props) => {\n  return <CollectionSelectField textFieldProps={props} />\n}\n"],"names":["CollectionSelectField","CollectionField","props","textFieldProps"],"mappings":"AAAA;;AAGA,SAASA,qBAAqB,QAAQ,oCAAmC;AAEzE,OAAO,MAAMC,kBAA4C,CAACC;IACxD,qBAAO,KAACF;QAAsBG,gBAAgBD;;AAChD,EAAC"}
+{"version":3,"sources":["../../../src/components/CollectionField/index.tsx"],"sourcesContent":["'use client'\nimport type { TextFieldClientProps } from 'payload'\nimport type React from 'react'\n\nimport { CollectionSelectField } from '../CollectionSelectField/index.js'\n\nexport const CollectionField: React.FC<TextFieldClientProps> = (props) => {\n  return <CollectionSelectField textFieldProps={props} />\n}\n"],"names":["CollectionSelectField","CollectionField","props","textFieldProps"],"mappings":"AAAA;;AAIA,SAASA,qBAAqB,QAAQ,oCAAmC;AAEzE,OAAO,MAAMC,kBAAkD,CAACC;IAC9D,qBAAO,KAACF;QAAsBG,gBAAgBD;;AAChD,EAAC"}

package/dist/components/ExportListMenuItem/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ExportListMenuItem/index.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAoB,MAAM,OAAO,CAAA;AAWxC,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC;IACxC,cAAc,EAAE,MAAM,CAAA;IACtB,oBAAoB,EAAE,MAAM,CAAA;CAC7B,CAoCA,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ExportListMenuItem/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAoB,MAAM,OAAO,CAAA;AAWxC,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC;IACxC,cAAc,EAAE,MAAM,CAAA;IACtB,oBAAoB,EAAE,MAAM,CAAA;CAC7B,CAqCA,CAAA"}

package/dist/components/ExportListMenuItem/index.js

@@ -1,7 +1,7 @@
 'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { getTranslation } from '@payloadcms/translations';
-import { PopupList, Translation, useConfig, useDocumentDrawer, useTranslation } from '@payloadcms/ui';
+import { useConfig, useDocumentDrawer, useTranslation } from '@payloadcms/ui';
 import React, { useEffect } from 'react';
 import { useImportExport } from '../ImportExportProvider/index.js';
 const baseClass = 'export-list-menu-item';
@@ -11,6 +11,10 @@ export const ExportListMenuItem = ({ collectionSlug, exportCollectionSlug })=>{
     const currentCollectionConfig = getEntityConfig({
         collectionSlug
     });
+    const collectionLabel = getTranslation(currentCollectionConfig.labels.plural, i18n);
+    const actionLabel = t('plugin-import-export:exportDocumentLabel', {
+        label: collectionLabel
+    });
     const [DocumentDrawer, DocumentDrawerToggler] = useDocumentDrawer({
         collectionSlug: exportCollectionSlug
     });
@@ -22,18 +26,16 @@ export const ExportListMenuItem = ({ collectionSlug, exportCollectionSlug })=>{
         currentCollectionConfig,
         setCollection
     ]);
-    return /*#__PURE__*/ _jsxs(PopupList.Button, {
-        className: baseClass,
+    return /*#__PURE__*/ _jsxs(_Fragment, {
         children: [
             /*#__PURE__*/ _jsx(DocumentDrawerToggler, {
-                children: /*#__PURE__*/ _jsx(Translation, {
-                    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-                    // @ts-expect-error
-                    i18nKey: "plugin-import-export:exportDocumentLabel",
-                    t: t,
-                    variables: {
-                        label: getTranslation(currentCollectionConfig.labels.plural, i18n)
-                    }
+                "aria-label": actionLabel,
+                className: `popup-button-list__button ${baseClass}`,
+                role: "menuitem",
+                tabIndex: -1,
+                children: /*#__PURE__*/ _jsx("span", {
+                    className: "popup-button-list__label",
+                    children: actionLabel
                 })
             }),
             /*#__PURE__*/ _jsx(DocumentDrawer, {

package/dist/components/ExportListMenuItem/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ExportListMenuItem/index.tsx"],"sourcesContent":["'use client'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport {\n  PopupList,\n  Translation,\n  useConfig,\n  useDocumentDrawer,\n  useTranslation,\n} from '@payloadcms/ui'\nimport React, { useEffect } from 'react'\n\nimport type {\n  PluginImportExportTranslationKeys,\n  PluginImportExportTranslations,\n} from '../../translations/index.js'\n\nimport { useImportExport } from '../ImportExportProvider/index.js'\n\nconst baseClass = 'export-list-menu-item'\n\nexport const ExportListMenuItem: React.FC<{\n  collectionSlug: string\n  exportCollectionSlug: string\n}> = ({ collectionSlug, exportCollectionSlug }) => {\n  const { getEntityConfig } = useConfig()\n\n  const { i18n, t } = useTranslation<\n    PluginImportExportTranslations,\n    PluginImportExportTranslationKeys\n  >()\n\n  const currentCollectionConfig = getEntityConfig({ collectionSlug })\n\n  const [DocumentDrawer, DocumentDrawerToggler] = useDocumentDrawer({\n    collectionSlug: exportCollectionSlug,\n  })\n  const { setCollection } = useImportExport()\n\n  // Set collection and selected items on mount or when selection changes\n  useEffect(() => {\n    setCollection(currentCollectionConfig.slug ?? '')\n  }, [currentCollectionConfig, setCollection])\n\n  return (\n    <PopupList.Button className={baseClass}>\n      <DocumentDrawerToggler>\n        <Translation\n          // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n          // @ts-expect-error\n          i18nKey=\"plugin-import-export:exportDocumentLabel\"\n          t={t}\n          variables={{\n            label: getTranslation(currentCollectionConfig.labels.plural, i18n),\n          }}\n        />\n      </DocumentDrawerToggler>\n      <DocumentDrawer initialData={{ collectionSlug }} />\n    </PopupList.Button>\n  )\n}\n"],"names":["getTranslation","PopupList","Translation","useConfig","useDocumentDrawer","useTranslation","React","useEffect","useImportExport","baseClass","ExportListMenuItem","collectionSlug","exportCollectionSlug","getEntityConfig","i18n","t","currentCollectionConfig","DocumentDrawer","DocumentDrawerToggler","setCollection","slug","Button","className","i18nKey","variables","label","labels","plural","initialData"],"mappings":"AAAA;;AAEA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,SACEC,SAAS,EACTC,WAAW,EACXC,SAAS,EACTC,iBAAiB,EACjBC,cAAc,QACT,iBAAgB;AACvB,OAAOC,SAASC,SAAS,QAAQ,QAAO;AAOxC,SAASC,eAAe,QAAQ,mCAAkC;AAElE,MAAMC,YAAY;AAElB,OAAO,MAAMC,qBAGR,CAAC,EAAEC,cAAc,EAAEC,oBAAoB,EAAE;IAC5C,MAAM,EAAEC,eAAe,EAAE,GAAGV;IAE5B,MAAM,EAAEW,IAAI,EAAEC,CAAC,EAAE,GAAGV;IAKpB,MAAMW,0BAA0BH,gBAAgB;QAAEF;IAAe;IAEjE,MAAM,CAACM,gBAAgBC,sBAAsB,GAAGd,kBAAkB;QAChEO,gBAAgBC;IAClB;IACA,MAAM,EAAEO,aAAa,EAAE,GAAGX;IAE1B,uEAAuE;IACvED,UAAU;QACRY,cAAcH,wBAAwBI,IAAI,IAAI;IAChD,GAAG;QAACJ;QAAyBG;KAAc;IAE3C,qBACE,MAAClB,UAAUoB,MAAM;QAACC,WAAWb;;0BAC3B,KAACS;0BACC,cAAA,KAAChB;oBACC,6DAA6D;oBAC7D,mBAAmB;oBACnBqB,SAAQ;oBACRR,GAAGA;oBACHS,WAAW;wBACTC,OAAOzB,eAAegB,wBAAwBU,MAAM,CAACC,MAAM,EAAEb;oBAC/D;;;0BAGJ,KAACG;gBAAeW,aAAa;oBAAEjB;gBAAe;;;;AAGpD,EAAC"}
+{"version":3,"sources":["../../../src/components/ExportListMenuItem/index.tsx"],"sourcesContent":["'use client'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { useConfig, useDocumentDrawer, useTranslation } from '@payloadcms/ui'\nimport React, { useEffect } from 'react'\n\nimport type {\n  PluginImportExportTranslationKeys,\n  PluginImportExportTranslations,\n} from '../../translations/index.js'\n\nimport { useImportExport } from '../ImportExportProvider/index.js'\n\nconst baseClass = 'export-list-menu-item'\n\nexport const ExportListMenuItem: React.FC<{\n  collectionSlug: string\n  exportCollectionSlug: string\n}> = ({ collectionSlug, exportCollectionSlug }) => {\n  const { getEntityConfig } = useConfig()\n\n  const { i18n, t } = useTranslation<\n    PluginImportExportTranslations,\n    PluginImportExportTranslationKeys\n  >()\n\n  const currentCollectionConfig = getEntityConfig({ collectionSlug })\n  const collectionLabel = getTranslation(currentCollectionConfig.labels.plural, i18n)\n  const actionLabel = t('plugin-import-export:exportDocumentLabel', {\n    label: collectionLabel,\n  })\n\n  const [DocumentDrawer, DocumentDrawerToggler] = useDocumentDrawer({\n    collectionSlug: exportCollectionSlug,\n  })\n  const { setCollection } = useImportExport()\n\n  // Set collection and selected items on mount or when selection changes\n  useEffect(() => {\n    setCollection(currentCollectionConfig.slug ?? '')\n  }, [currentCollectionConfig, setCollection])\n\n  return (\n    <>\n      <DocumentDrawerToggler\n        aria-label={actionLabel}\n        className={`popup-button-list__button ${baseClass}`}\n        role=\"menuitem\"\n        tabIndex={-1}\n      >\n        <span className=\"popup-button-list__label\">{actionLabel}</span>\n      </DocumentDrawerToggler>\n      <DocumentDrawer initialData={{ collectionSlug }} />\n    </>\n  )\n}\n"],"names":["getTranslation","useConfig","useDocumentDrawer","useTranslation","React","useEffect","useImportExport","baseClass","ExportListMenuItem","collectionSlug","exportCollectionSlug","getEntityConfig","i18n","t","currentCollectionConfig","collectionLabel","labels","plural","actionLabel","label","DocumentDrawer","DocumentDrawerToggler","setCollection","slug","aria-label","className","role","tabIndex","span","initialData"],"mappings":"AAAA;;AAEA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,SAASC,SAAS,EAAEC,iBAAiB,EAAEC,cAAc,QAAQ,iBAAgB;AAC7E,OAAOC,SAASC,SAAS,QAAQ,QAAO;AAOxC,SAASC,eAAe,QAAQ,mCAAkC;AAElE,MAAMC,YAAY;AAElB,OAAO,MAAMC,qBAGR,CAAC,EAAEC,cAAc,EAAEC,oBAAoB,EAAE;IAC5C,MAAM,EAAEC,eAAe,EAAE,GAAGV;IAE5B,MAAM,EAAEW,IAAI,EAAEC,CAAC,EAAE,GAAGV;IAKpB,MAAMW,0BAA0BH,gBAAgB;QAAEF;IAAe;IACjE,MAAMM,kBAAkBf,eAAec,wBAAwBE,MAAM,CAACC,MAAM,EAAEL;IAC9E,MAAMM,cAAcL,EAAE,4CAA4C;QAChEM,OAAOJ;IACT;IAEA,MAAM,CAACK,gBAAgBC,sBAAsB,GAAGnB,kBAAkB;QAChEO,gBAAgBC;IAClB;IACA,MAAM,EAAEY,aAAa,EAAE,GAAGhB;IAE1B,uEAAuE;IACvED,UAAU;QACRiB,cAAcR,wBAAwBS,IAAI,IAAI;IAChD,GAAG;QAACT;QAAyBQ;KAAc;IAE3C,qBACE;;0BACE,KAACD;gBACCG,cAAYN;gBACZO,WAAW,CAAC,0BAA0B,EAAElB,WAAW;gBACnDmB,MAAK;gBACLC,UAAU,CAAC;0BAEX,cAAA,KAACC;oBAAKH,WAAU;8BAA4BP;;;0BAE9C,KAACE;gBAAeS,aAAa;oBAAEpB;gBAAe;;;;AAGpD,EAAC"}

package/dist/components/ExportPreview/index.css

@@ -15,7 +15,6 @@
 
   .export-preview__export-count {
     color: var(--color-text-secondary);
-    font-family: var(--text-body-medium-font-family);
     font-size: var(--text-body-medium-font-size);
     font-weight: var(--text-body-medium-font-weight);
     line-height: var(--text-body-medium-line-height);
@@ -23,7 +22,6 @@
 
   .export-preview__limit-capped {
     color: var(--color-text-warning);
-    font-family: var(--text-body-medium-font-family);
     font-size: var(--text-body-medium-font-size);
     font-weight: var(--text-body-medium-font-weight);
     line-height: var(--text-body-medium-line-height);
@@ -46,7 +44,6 @@
 
   .export-preview__page-info {
     color: var(--color-text-secondary);
-    font-family: var(--text-body-medium-font-family);
     font-size: var(--text-body-medium-font-size);
     font-weight: var(--text-body-medium-font-weight);
     line-height: var(--text-body-medium-line-height);

package/dist/components/ExportPreview/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ExportPreview/index.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAqD,MAAM,OAAO,CAAA;AAUzE,OAAO,aAAa,CAAA;AAIpB,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAkRjC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ExportPreview/index.tsx"],"names":[],"mappings":"AAiBA,OAAO,KAAqD,MAAM,OAAO,CAAA;AAczE,OAAO,aAAa,CAAA;AAIpB,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAuRjC,CAAA"}

package/dist/components/ExportPreview/index.js

@@ -1,9 +1,10 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { getTranslation } from '@payloadcms/translations';
-import { CodeEditorLazy, Pagination, PerPage, Table, Translation, useConfig, useDebouncedEffect, useDocumentInfo, useFormFields, useTranslation } from '@payloadcms/ui';
+import { CodeEditorLazy, Pagination, PerPage, Table, Translation, useConfig, useDebouncedEffect, useDocumentInfo, useForm, useFormFields, useTranslation } from '@payloadcms/ui';
 import React, { useEffect, useRef, useState, useTransition } from 'react';
 import { DEFAULT_PREVIEW_LIMIT, PREVIEW_LIMIT_OPTIONS } from '../../constants.js';
+import { getFormStateSignature, getSubmittedFormValues } from '../../utilities/getSubmittedFormValues.js';
 import { useImportExport } from '../ImportExportProvider/index.js';
 import './index.css';
 const baseClass = 'export-preview';
@@ -23,6 +24,10 @@ export const ExportPreview = ()=>{
             where: fields['where']?.value
         };
     });
+    const { getData } = useForm();
+    const formStateSignature = useFormFields(([fields])=>getFormStateSignature({
+            fields
+        }));
     const [dataToRender, setDataToRender] = useState([]);
     const [exportTotalDocs, setExportTotalDocs] = useState(0);
     const [maxLimit, setMaxLimit] = useState(undefined);
@@ -82,6 +87,9 @@ export const ExportPreview = ()=>{
                         draft,
                         fields,
                         format,
+                        formData: getSubmittedFormValues({
+                            formData: getData()
+                        }),
                         limit,
                         locale,
                         previewLimit,
@@ -156,6 +164,8 @@ export const ExportPreview = ()=>{
         draft,
         fields,
         format,
+        formStateSignature,
+        getData,
         i18n,
         limit,
         locale,

package/dist/components/ExportPreview/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ExportPreview/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientField, Column, PaginatedDocs, Where } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport {\n  CodeEditorLazy,\n  Pagination,\n  PerPage,\n  Table,\n  Translation,\n  useConfig,\n  useDebouncedEffect,\n  useDocumentInfo,\n  useFormFields,\n  useTranslation,\n} from '@payloadcms/ui'\nimport React, { useEffect, useRef, useState, useTransition } from 'react'\n\nimport type {\n  PluginImportExportTranslationKeys,\n  PluginImportExportTranslations,\n} from '../../translations/index.js'\nimport type { ExportPreviewResponse } from '../../types.js'\n\nimport { DEFAULT_PREVIEW_LIMIT, PREVIEW_LIMIT_OPTIONS } from '../../constants.js'\nimport { useImportExport } from '../ImportExportProvider/index.js'\nimport './index.css'\n\nconst baseClass = 'export-preview'\n\nexport const ExportPreview: React.FC = () => {\n  const [isPending, startTransition] = useTransition()\n  const { collection } = useImportExport()\n  const {\n    config,\n    config: { routes },\n  } = useConfig()\n  const { collectionSlug } = useDocumentInfo()\n  const { draft, fields, format, limit, locale, sort, where } = useFormFields(([fields]) => {\n    return {\n      draft: fields['drafts']?.value,\n      fields: fields['fields']?.value,\n      format: fields['format']?.value,\n      limit: fields['limit']?.value as number,\n      locale: fields['locale']?.value as string,\n      sort: fields['sort']?.value as string,\n      where: fields['where']?.value as Where,\n    }\n  })\n  const [dataToRender, setDataToRender] = useState<any[]>([])\n  const [exportTotalDocs, setExportTotalDocs] = useState<number>(0)\n  const [maxLimit, setMaxLimit] = useState<number | undefined>(undefined)\n  const [columns, setColumns] = useState<Column[]>([])\n  const { i18n, t } = useTranslation<\n    PluginImportExportTranslations,\n    PluginImportExportTranslationKeys\n  >()\n\n  // Preview pagination state (separate from export config)\n  const [previewPage, setPreviewPage] = useState(1)\n  const [previewLimit, setPreviewLimit] = useState(DEFAULT_PREVIEW_LIMIT)\n  const [paginationData, setPaginationData] = useState<null | Pick<\n    PaginatedDocs,\n    'hasNextPage' | 'hasPrevPage' | 'limit' | 'nextPage' | 'page' | 'prevPage' | 'totalPages'\n  >>(null)\n\n  // Track previous export config to reset preview page when it changes\n  const prevExportConfigRef = useRef({ draft, fields, format, limit, locale, sort, where })\n\n  // Reset preview page when export config changes\n  useEffect(() => {\n    const prevConfig = prevExportConfigRef.current\n    const configChanged =\n      prevConfig.draft !== draft ||\n      prevConfig.limit !== limit ||\n      prevConfig.locale !== locale ||\n      prevConfig.sort !== sort ||\n      JSON.stringify(prevConfig.fields) !== JSON.stringify(fields) ||\n      JSON.stringify(prevConfig.where) !== JSON.stringify(where)\n\n    if (configChanged) {\n      setPreviewPage(1)\n      prevExportConfigRef.current = { draft, fields, format, limit, locale, sort, where }\n    }\n  }, [draft, fields, format, limit, locale, sort, where])\n\n  const targetCollectionSlug = typeof collection === 'string' && collection\n\n  const isCSV = format === 'csv'\n\n  useDebouncedEffect(\n    () => {\n      if (!collectionSlug || !targetCollectionSlug) {\n        return\n      }\n\n      const abortController = new AbortController()\n\n      const fetchData = async () => {\n        try {\n          const res = await fetch(`${routes.api}/${collectionSlug}/export-preview`, {\n            body: JSON.stringify({\n              collectionSlug: targetCollectionSlug,\n              draft,\n              fields,\n              format,\n              limit,\n              locale,\n              previewLimit,\n              previewPage,\n              sort,\n              where,\n            }),\n            credentials: 'include',\n            headers: { 'Content-Type': 'application/json' },\n            method: 'POST',\n            signal: abortController.signal,\n          })\n\n          if (!res.ok) {\n            return\n          }\n\n          const {\n            columns: serverColumns,\n            docs,\n            exportTotalDocs: serverExportTotalDocs,\n            hasNextPage,\n            hasPrevPage,\n            limit: responseLimit,\n            maxLimit: serverMaxLimit,\n            page: responsePage,\n            totalPages,\n          }: ExportPreviewResponse = await res.json()\n\n          // For CSV: use server-provided columns (from getSchemaColumns) for consistent ordering\n          // For JSON: derive keys from docs\n          const allKeys = Array.from(new Set(docs.flatMap((doc) => Object.keys(doc))))\n\n          // Use server columns if available (CSV format), otherwise fall back to data-derived keys\n          const fieldKeys = serverColumns && serverColumns.length > 0 ? serverColumns : allKeys\n\n          // Build columns based on field keys\n          const newColumns: Column[] = fieldKeys.map((key) => ({\n            accessor: key,\n            active: true,\n            field: { name: key } as ClientField,\n            Heading: getTranslation(key, i18n),\n            renderedCells: docs.map((doc: Record<string, unknown>) => {\n              const val = doc[key]\n\n              if (val === undefined || val === null) {\n                return null\n              }\n\n              // Avoid ESLint warning by type-checking before calling String()\n              if (typeof val === 'string' || typeof val === 'number' || typeof val === 'boolean') {\n                return String(val)\n              }\n\n              if (Array.isArray(val)) {\n                return val.map(String).join(', ')\n              }\n\n              return JSON.stringify(val)\n            }),\n          }))\n\n          setExportTotalDocs(serverExportTotalDocs)\n          setMaxLimit(serverMaxLimit)\n          setPaginationData({\n            hasNextPage,\n            hasPrevPage,\n            limit: responseLimit,\n            nextPage: responsePage + 1,\n            page: responsePage,\n            prevPage: responsePage - 1,\n            totalPages,\n          })\n          setColumns(newColumns)\n          setDataToRender(docs)\n        } catch (error) {\n          console.error('Error fetching preview data:', error)\n        }\n      }\n\n      startTransition(async () => await fetchData())\n\n      return () => {\n        if (!abortController.signal.aborted) {\n          abortController.abort('Component unmounted')\n        }\n      }\n    },\n    [\n      collectionSlug,\n      draft,\n      fields,\n      format,\n      i18n,\n      limit,\n      locale,\n      previewLimit,\n      previewPage,\n      sort,\n      where,\n      routes.api,\n      targetCollectionSlug,\n    ],\n    500,\n  )\n\n  const handlePageChange = (page: number) => {\n    setPreviewPage(page)\n  }\n\n  const handlePerPageChange = (newLimit: number) => {\n    setPreviewLimit(newLimit)\n    setPreviewPage(1)\n  }\n\n  return (\n    <div className={baseClass}>\n      <div className={`${baseClass}__header`}>\n        <h3>\n          <Translation i18nKey=\"version:preview\" t={t} />\n        </h3>\n        {exportTotalDocs > 0 && !isPending && (\n          <div className={`${baseClass}__export-info`}>\n            <span className={`${baseClass}__export-count`}>\n              <Translation\n                // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n                // @ts-expect-error\n                i18nKey=\"plugin-import-export:documentsToExport\"\n                t={t}\n                variables={{\n                  count: exportTotalDocs,\n                }}\n              />\n            </span>\n            {typeof maxLimit === 'number' &&\n              maxLimit > 0 &&\n              typeof limit === 'number' &&\n              limit > maxLimit && (\n                <span className={`${baseClass}__limit-capped`}>\n                  <Translation\n                    // @ts-expect-error - plugin translations not typed\n                    i18nKey=\"plugin-import-export:limitCapped\"\n                    t={t}\n                    variables={{\n                      limit: maxLimit,\n                    }}\n                  />\n                </span>\n              )}\n          </div>\n        )}\n      </div>\n      {isPending && !dataToRender && (\n        <div className={`${baseClass}__loading`}>\n          <Translation i18nKey=\"general:loading\" t={t} />\n        </div>\n      )}\n      {dataToRender &&\n        (isCSV ? (\n          <Table columns={columns} data={dataToRender} />\n        ) : (\n          <CodeEditorLazy language=\"json\" readOnly value={JSON.stringify(dataToRender, null, 2)} />\n        ))}\n      {paginationData && exportTotalDocs > 0 && (\n        <div className={`${baseClass}__pagination`}>\n          {paginationData.totalPages > 1 && (\n            <Pagination\n              hasNextPage={paginationData.hasNextPage}\n              hasPrevPage={paginationData.hasPrevPage}\n              nextPage={paginationData.nextPage ?? undefined}\n              numberOfNeighbors={1}\n              onChange={handlePageChange}\n              page={paginationData.page}\n              prevPage={paginationData.prevPage ?? undefined}\n              totalPages={paginationData.totalPages}\n            />\n          )}\n          <span className={`${baseClass}__page-info`}>\n            <Translation\n              // @ts-expect-error - plugin translations not typed\n              i18nKey=\"plugin-import-export:previewPageInfo\"\n              t={t}\n              variables={{\n                end: Math.min((paginationData.page ?? 1) * previewLimit, exportTotalDocs),\n                start: ((paginationData.page ?? 1) - 1) * previewLimit + 1,\n                total: exportTotalDocs,\n              }}\n            />\n          </span>\n          <PerPage\n            handleChange={handlePerPageChange}\n            limit={previewLimit}\n            limits={PREVIEW_LIMIT_OPTIONS}\n          />\n        </div>\n      )}\n    </div>\n  )\n}\n"],"names":["getTranslation","CodeEditorLazy","Pagination","PerPage","Table","Translation","useConfig","useDebouncedEffect","useDocumentInfo","useFormFields","useTranslation","React","useEffect","useRef","useState","useTransition","DEFAULT_PREVIEW_LIMIT","PREVIEW_LIMIT_OPTIONS","useImportExport","baseClass","ExportPreview","isPending","startTransition","collection","config","routes","collectionSlug","draft","fields","format","limit","locale","sort","where","value","dataToRender","setDataToRender","exportTotalDocs","setExportTotalDocs","maxLimit","setMaxLimit","undefined","columns","setColumns","i18n","t","previewPage","setPreviewPage","previewLimit","setPreviewLimit","paginationData","setPaginationData","prevExportConfigRef","prevConfig","current","configChanged","JSON","stringify","targetCollectionSlug","isCSV","abortController","AbortController","fetchData","res","fetch","api","body","credentials","headers","method","signal","ok","serverColumns","docs","serverExportTotalDocs","hasNextPage","hasPrevPage","responseLimit","serverMaxLimit","page","responsePage","totalPages","json","allKeys","Array","from","Set","flatMap","doc","Object","keys","fieldKeys","length","newColumns","map","key","accessor","active","field","name","Heading","renderedCells","val","String","isArray","join","nextPage","prevPage","error","console","aborted","abort","handlePageChange","handlePerPageChange","newLimit","div","className","h3","i18nKey","span","variables","count","data","language","readOnly","numberOfNeighbors","onChange","end","Math","min","start","total","handleChange","limits"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/ExportPreview/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientField, Column, PaginatedDocs, Where } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport {\n  CodeEditorLazy,\n  Pagination,\n  PerPage,\n  Table,\n  Translation,\n  useConfig,\n  useDebouncedEffect,\n  useDocumentInfo,\n  useForm,\n  useFormFields,\n  useTranslation,\n} from '@payloadcms/ui'\nimport React, { useEffect, useRef, useState, useTransition } from 'react'\n\nimport type {\n  PluginImportExportTranslationKeys,\n  PluginImportExportTranslations,\n} from '../../translations/index.js'\nimport type { ExportPreviewResponse } from '../../types.js'\n\nimport { DEFAULT_PREVIEW_LIMIT, PREVIEW_LIMIT_OPTIONS } from '../../constants.js'\nimport {\n  getFormStateSignature,\n  getSubmittedFormValues,\n} from '../../utilities/getSubmittedFormValues.js'\nimport { useImportExport } from '../ImportExportProvider/index.js'\nimport './index.css'\n\nconst baseClass = 'export-preview'\n\nexport const ExportPreview: React.FC = () => {\n  const [isPending, startTransition] = useTransition()\n  const { collection } = useImportExport()\n  const {\n    config,\n    config: { routes },\n  } = useConfig()\n  const { collectionSlug } = useDocumentInfo()\n  const { draft, fields, format, limit, locale, sort, where } = useFormFields(([fields]) => {\n    return {\n      draft: fields['drafts']?.value,\n      fields: fields['fields']?.value,\n      format: fields['format']?.value,\n      limit: fields['limit']?.value as number,\n      locale: fields['locale']?.value as string,\n      sort: fields['sort']?.value as string,\n      where: fields['where']?.value as Where,\n    }\n  })\n  const { getData } = useForm()\n  const formStateSignature = useFormFields(([fields]) => getFormStateSignature({ fields }))\n  const [dataToRender, setDataToRender] = useState<any[]>([])\n  const [exportTotalDocs, setExportTotalDocs] = useState<number>(0)\n  const [maxLimit, setMaxLimit] = useState<number | undefined>(undefined)\n  const [columns, setColumns] = useState<Column[]>([])\n  const { i18n, t } = useTranslation<\n    PluginImportExportTranslations,\n    PluginImportExportTranslationKeys\n  >()\n\n  // Preview pagination state (separate from export config)\n  const [previewPage, setPreviewPage] = useState(1)\n  const [previewLimit, setPreviewLimit] = useState(DEFAULT_PREVIEW_LIMIT)\n  const [paginationData, setPaginationData] = useState<null | Pick<\n    PaginatedDocs,\n    'hasNextPage' | 'hasPrevPage' | 'limit' | 'nextPage' | 'page' | 'prevPage' | 'totalPages'\n  >>(null)\n\n  // Track previous export config to reset preview page when it changes\n  const prevExportConfigRef = useRef({ draft, fields, format, limit, locale, sort, where })\n\n  // Reset preview page when export config changes\n  useEffect(() => {\n    const prevConfig = prevExportConfigRef.current\n    const configChanged =\n      prevConfig.draft !== draft ||\n      prevConfig.limit !== limit ||\n      prevConfig.locale !== locale ||\n      prevConfig.sort !== sort ||\n      JSON.stringify(prevConfig.fields) !== JSON.stringify(fields) ||\n      JSON.stringify(prevConfig.where) !== JSON.stringify(where)\n\n    if (configChanged) {\n      setPreviewPage(1)\n      prevExportConfigRef.current = { draft, fields, format, limit, locale, sort, where }\n    }\n  }, [draft, fields, format, limit, locale, sort, where])\n\n  const targetCollectionSlug = typeof collection === 'string' && collection\n\n  const isCSV = format === 'csv'\n\n  useDebouncedEffect(\n    () => {\n      if (!collectionSlug || !targetCollectionSlug) {\n        return\n      }\n\n      const abortController = new AbortController()\n\n      const fetchData = async () => {\n        try {\n          const res = await fetch(`${routes.api}/${collectionSlug}/export-preview`, {\n            body: JSON.stringify({\n              collectionSlug: targetCollectionSlug,\n              draft,\n              fields,\n              format,\n              formData: getSubmittedFormValues({ formData: getData() }),\n              limit,\n              locale,\n              previewLimit,\n              previewPage,\n              sort,\n              where,\n            }),\n            credentials: 'include',\n            headers: { 'Content-Type': 'application/json' },\n            method: 'POST',\n            signal: abortController.signal,\n          })\n\n          if (!res.ok) {\n            return\n          }\n\n          const {\n            columns: serverColumns,\n            docs,\n            exportTotalDocs: serverExportTotalDocs,\n            hasNextPage,\n            hasPrevPage,\n            limit: responseLimit,\n            maxLimit: serverMaxLimit,\n            page: responsePage,\n            totalPages,\n          }: ExportPreviewResponse = await res.json()\n\n          // For CSV: use server-provided columns (from getSchemaColumns) for consistent ordering\n          // For JSON: derive keys from docs\n          const allKeys = Array.from(new Set(docs.flatMap((doc) => Object.keys(doc))))\n\n          // Use server columns if available (CSV format), otherwise fall back to data-derived keys\n          const fieldKeys = serverColumns && serverColumns.length > 0 ? serverColumns : allKeys\n\n          // Build columns based on field keys\n          const newColumns: Column[] = fieldKeys.map((key) => ({\n            accessor: key,\n            active: true,\n            field: { name: key } as ClientField,\n            Heading: getTranslation(key, i18n),\n            renderedCells: docs.map((doc: Record<string, unknown>) => {\n              const val = doc[key]\n\n              if (val === undefined || val === null) {\n                return null\n              }\n\n              // Avoid ESLint warning by type-checking before calling String()\n              if (typeof val === 'string' || typeof val === 'number' || typeof val === 'boolean') {\n                return String(val)\n              }\n\n              if (Array.isArray(val)) {\n                return val.map(String).join(', ')\n              }\n\n              return JSON.stringify(val)\n            }),\n          }))\n\n          setExportTotalDocs(serverExportTotalDocs)\n          setMaxLimit(serverMaxLimit)\n          setPaginationData({\n            hasNextPage,\n            hasPrevPage,\n            limit: responseLimit,\n            nextPage: responsePage + 1,\n            page: responsePage,\n            prevPage: responsePage - 1,\n            totalPages,\n          })\n          setColumns(newColumns)\n          setDataToRender(docs)\n        } catch (error) {\n          console.error('Error fetching preview data:', error)\n        }\n      }\n\n      startTransition(async () => await fetchData())\n\n      return () => {\n        if (!abortController.signal.aborted) {\n          abortController.abort('Component unmounted')\n        }\n      }\n    },\n    [\n      collectionSlug,\n      draft,\n      fields,\n      format,\n      formStateSignature,\n      getData,\n      i18n,\n      limit,\n      locale,\n      previewLimit,\n      previewPage,\n      sort,\n      where,\n      routes.api,\n      targetCollectionSlug,\n    ],\n    500,\n  )\n\n  const handlePageChange = (page: number) => {\n    setPreviewPage(page)\n  }\n\n  const handlePerPageChange = (newLimit: number) => {\n    setPreviewLimit(newLimit)\n    setPreviewPage(1)\n  }\n\n  return (\n    <div className={baseClass}>\n      <div className={`${baseClass}__header`}>\n        <h3>\n          <Translation i18nKey=\"version:preview\" t={t} />\n        </h3>\n        {exportTotalDocs > 0 && !isPending && (\n          <div className={`${baseClass}__export-info`}>\n            <span className={`${baseClass}__export-count`}>\n              <Translation\n                // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n                // @ts-expect-error\n                i18nKey=\"plugin-import-export:documentsToExport\"\n                t={t}\n                variables={{\n                  count: exportTotalDocs,\n                }}\n              />\n            </span>\n            {typeof maxLimit === 'number' &&\n              maxLimit > 0 &&\n              typeof limit === 'number' &&\n              limit > maxLimit && (\n                <span className={`${baseClass}__limit-capped`}>\n                  <Translation\n                    // @ts-expect-error - plugin translations not typed\n                    i18nKey=\"plugin-import-export:limitCapped\"\n                    t={t}\n                    variables={{\n                      limit: maxLimit,\n                    }}\n                  />\n                </span>\n              )}\n          </div>\n        )}\n      </div>\n      {isPending && !dataToRender && (\n        <div className={`${baseClass}__loading`}>\n          <Translation i18nKey=\"general:loading\" t={t} />\n        </div>\n      )}\n      {dataToRender &&\n        (isCSV ? (\n          <Table columns={columns} data={dataToRender} />\n        ) : (\n          <CodeEditorLazy language=\"json\" readOnly value={JSON.stringify(dataToRender, null, 2)} />\n        ))}\n      {paginationData && exportTotalDocs > 0 && (\n        <div className={`${baseClass}__pagination`}>\n          {paginationData.totalPages > 1 && (\n            <Pagination\n              hasNextPage={paginationData.hasNextPage}\n              hasPrevPage={paginationData.hasPrevPage}\n              nextPage={paginationData.nextPage ?? undefined}\n              numberOfNeighbors={1}\n              onChange={handlePageChange}\n              page={paginationData.page}\n              prevPage={paginationData.prevPage ?? undefined}\n              totalPages={paginationData.totalPages}\n            />\n          )}\n          <span className={`${baseClass}__page-info`}>\n            <Translation\n              // @ts-expect-error - plugin translations not typed\n              i18nKey=\"plugin-import-export:previewPageInfo\"\n              t={t}\n              variables={{\n                end: Math.min((paginationData.page ?? 1) * previewLimit, exportTotalDocs),\n                start: ((paginationData.page ?? 1) - 1) * previewLimit + 1,\n                total: exportTotalDocs,\n              }}\n            />\n          </span>\n          <PerPage\n            handleChange={handlePerPageChange}\n            limit={previewLimit}\n            limits={PREVIEW_LIMIT_OPTIONS}\n          />\n        </div>\n      )}\n    </div>\n  )\n}\n"],"names":["getTranslation","CodeEditorLazy","Pagination","PerPage","Table","Translation","useConfig","useDebouncedEffect","useDocumentInfo","useForm","useFormFields","useTranslation","React","useEffect","useRef","useState","useTransition","DEFAULT_PREVIEW_LIMIT","PREVIEW_LIMIT_OPTIONS","getFormStateSignature","getSubmittedFormValues","useImportExport","baseClass","ExportPreview","isPending","startTransition","collection","config","routes","collectionSlug","draft","fields","format","limit","locale","sort","where","value","getData","formStateSignature","dataToRender","setDataToRender","exportTotalDocs","setExportTotalDocs","maxLimit","setMaxLimit","undefined","columns","setColumns","i18n","t","previewPage","setPreviewPage","previewLimit","setPreviewLimit","paginationData","setPaginationData","prevExportConfigRef","prevConfig","current","configChanged","JSON","stringify","targetCollectionSlug","isCSV","abortController","AbortController","fetchData","res","fetch","api","body","formData","credentials","headers","method","signal","ok","serverColumns","docs","serverExportTotalDocs","hasNextPage","hasPrevPage","responseLimit","serverMaxLimit","page","responsePage","totalPages","json","allKeys","Array","from","Set","flatMap","doc","Object","keys","fieldKeys","length","newColumns","map","key","accessor","active","field","name","Heading","renderedCells","val","String","isArray","join","nextPage","prevPage","error","console","aborted","abort","handlePageChange","handlePerPageChange","newLimit","div","className","h3","i18nKey","span","variables","count","data","language","readOnly","numberOfNeighbors","onChange","end","Math","min","start","total","handleChange","limits"],"mappings":"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"}

package/dist/components/FieldsToExport/index.d.ts

@@ -1,3 +1,4 @@
-import type { SelectFieldClientComponent } from 'payload';
-export declare const FieldsToExport: SelectFieldClientComponent;
+import type { SelectFieldClientProps } from 'payload';
+import React from 'react';
+export declare const FieldsToExport: React.FC<SelectFieldClientProps>;
 //# sourceMappingURL=index.d.ts.map

package/dist/components/FieldsToExport/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FieldsToExport/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,SAAS,CAAA;AAkBzD,eAAO,MAAM,cAAc,EAAE,0BA2E5B,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FieldsToExport/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAA;AAWrD,OAAO,KAA6B,MAAM,OAAO,CAAA;AAOjD,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CA+E3D,CAAA"}

package/dist/components/FieldsToExport/index.js

@@ -1,9 +1,9 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { FieldLabel, ReactSelect, useConfig, useDocumentInfo, useField, useListQuery } from '@payloadcms/ui';
-import React, { useEffect } from 'react';
+import React, { useEffect, useMemo } from 'react';
 import { useImportExport } from '../ImportExportProvider/index.js';
-import { reduceFields } from './reduceFields.js';
+import { filterSelectableFieldValues, reduceFields } from './reduceFields.js';
 const baseClass = 'field-type fields-to-export';
 export const FieldsToExport = (props)=>{
     const { id } = useDocumentInfo();
@@ -17,29 +17,32 @@ export const FieldsToExport = (props)=>{
     const collectionConfig = getEntityConfig({
         collectionSlug: collectionSlug ?? collection
     });
-    const disabledFields = collectionConfig?.admin?.custom?.['plugin-import-export']?.disabledFields ?? [];
-    const fieldOptions = reduceFields({
-        disabledFields,
-        fields: collectionConfig?.fields
-    });
+    const fieldOptions = useMemo(()=>{
+        const disabledFields = collectionConfig?.admin?.custom?.['plugin-import-export']?.disabledFields ?? [];
+        return reduceFields({
+            disabledFields,
+            fields: collectionConfig?.fields
+        });
+    }, [
+        collectionConfig?.admin?.custom,
+        collectionConfig?.fields
+    ]);
     useEffect(()=>{
         if (id || !collectionSlug) {
             return;
         }
         const queryColumns = query?.columns;
-        if (Array.isArray(queryColumns)) {
-            const cleanColumns = queryColumns.filter((col)=>typeof col === 'string' && !col.startsWith('-'));
-            // If columns are specified in the query, use them
-            setValue(cleanColumns);
-        } else {
-            // Fallback if no columns in query
-            setValue(collectionConfig?.admin?.defaultColumns ?? []);
-        }
+        const initialColumns = Array.isArray(queryColumns) ? queryColumns.filter((column)=>typeof column === 'string' && !column.startsWith('-')) : collectionConfig?.admin?.defaultColumns ?? [];
+        setValue(filterSelectableFieldValues({
+            fieldOptions,
+            values: initialColumns
+        }));
     }, [
         id,
         collectionSlug,
         query?.columns,
         collectionConfig?.admin?.defaultColumns,
+        fieldOptions,
         setValue
     ]);
     const onChange = (options)=>{

package/dist/components/FieldsToExport/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/FieldsToExport/index.tsx"],"sourcesContent":["'use client'\n\nimport type { SelectFieldClientComponent } from 'payload'\nimport type { ReactNode } from 'react'\n\nimport {\n  FieldLabel,\n  ReactSelect,\n  useConfig,\n  useDocumentInfo,\n  useField,\n  useListQuery,\n} from '@payloadcms/ui'\nimport React, { useEffect } from 'react'\n\nimport { useImportExport } from '../ImportExportProvider/index.js'\nimport { reduceFields } from './reduceFields.js'\n\nconst baseClass = 'field-type fields-to-export'\n\nexport const FieldsToExport: SelectFieldClientComponent = (props) => {\n  const { id } = useDocumentInfo()\n  const { setValue, value } = useField<string[]>()\n  const { value: collectionSlug } = useField<string>({ path: 'collectionSlug' })\n  const { getEntityConfig } = useConfig()\n  const { collection } = useImportExport()\n  const { query } = useListQuery()\n\n  const collectionConfig = getEntityConfig({ collectionSlug: collectionSlug ?? collection })\n\n  const disabledFields =\n    collectionConfig?.admin?.custom?.['plugin-import-export']?.disabledFields ?? []\n\n  const fieldOptions = reduceFields({\n    disabledFields,\n    fields: collectionConfig?.fields,\n  })\n\n  useEffect(() => {\n    if (id || !collectionSlug) {\n      return\n    }\n\n    const queryColumns = query?.columns\n\n    if (Array.isArray(queryColumns)) {\n      const cleanColumns = queryColumns.filter(\n        (col): col is string => typeof col === 'string' && !col.startsWith('-'),\n      )\n      // If columns are specified in the query, use them\n      setValue(cleanColumns)\n    } else {\n      // Fallback if no columns in query\n      setValue(collectionConfig?.admin?.defaultColumns ?? [])\n    }\n  }, [id, collectionSlug, query?.columns, collectionConfig?.admin?.defaultColumns, setValue])\n\n  const onChange = (options: { id: string; label: ReactNode; value: string }[]) => {\n    if (!options) {\n      setValue([])\n      return\n    }\n\n    const updatedValue = options.map((option) =>\n      typeof option === 'object' ? option.value : option,\n    )\n\n    setValue(updatedValue)\n  }\n\n  return (\n    <div className={baseClass}>\n      <FieldLabel label={props.field.label} path={props.path} />\n      <ReactSelect\n        className={baseClass}\n        disabled={props.readOnly}\n        getOptionValue={(option) => String(option.value)}\n        inputId={`field-${props.path.replace(/\\./g, '__')}`}\n        isClearable={true}\n        isMulti={true}\n        isSortable={true}\n        // @ts-expect-error react select option\n        onChange={onChange}\n        options={fieldOptions}\n        value={\n          Array.isArray(value)\n            ? value.map((val) => {\n                const match = fieldOptions.find((opt) => opt.value === val)\n                return match ? { ...match, id: val } : { id: val, label: val, value: val }\n              })\n            : []\n        }\n      />\n    </div>\n  )\n}\n"],"names":["FieldLabel","ReactSelect","useConfig","useDocumentInfo","useField","useListQuery","React","useEffect","useImportExport","reduceFields","baseClass","FieldsToExport","props","id","setValue","value","collectionSlug","path","getEntityConfig","collection","query","collectionConfig","disabledFields","admin","custom","fieldOptions","fields","queryColumns","columns","Array","isArray","cleanColumns","filter","col","startsWith","defaultColumns","onChange","options","updatedValue","map","option","div","className","label","field","disabled","readOnly","getOptionValue","String","inputId","replace","isClearable","isMulti","isSortable","val","match","find","opt"],"mappings":"AAAA;;AAKA,SACEA,UAAU,EACVC,WAAW,EACXC,SAAS,EACTC,eAAe,EACfC,QAAQ,EACRC,YAAY,QACP,iBAAgB;AACvB,OAAOC,SAASC,SAAS,QAAQ,QAAO;AAExC,SAASC,eAAe,QAAQ,mCAAkC;AAClE,SAASC,YAAY,QAAQ,oBAAmB;AAEhD,MAAMC,YAAY;AAElB,OAAO,MAAMC,iBAA6C,CAACC;IACzD,MAAM,EAAEC,EAAE,EAAE,GAAGV;IACf,MAAM,EAAEW,QAAQ,EAAEC,KAAK,EAAE,GAAGX;IAC5B,MAAM,EAAEW,OAAOC,cAAc,EAAE,GAAGZ,SAAiB;QAAEa,MAAM;IAAiB;IAC5E,MAAM,EAAEC,eAAe,EAAE,GAAGhB;IAC5B,MAAM,EAAEiB,UAAU,EAAE,GAAGX;IACvB,MAAM,EAAEY,KAAK,EAAE,GAAGf;IAElB,MAAMgB,mBAAmBH,gBAAgB;QAAEF,gBAAgBA,kBAAkBG;IAAW;IAExF,MAAMG,iBACJD,kBAAkBE,OAAOC,QAAQ,CAAC,uBAAuB,EAAEF,kBAAkB,EAAE;IAEjF,MAAMG,eAAehB,aAAa;QAChCa;QACAI,QAAQL,kBAAkBK;IAC5B;IAEAnB,UAAU;QACR,IAAIM,MAAM,CAACG,gBAAgB;YACzB;QACF;QAEA,MAAMW,eAAeP,OAAOQ;QAE5B,IAAIC,MAAMC,OAAO,CAACH,eAAe;YAC/B,MAAMI,eAAeJ,aAAaK,MAAM,CACtC,CAACC,MAAuB,OAAOA,QAAQ,YAAY,CAACA,IAAIC,UAAU,CAAC;YAErE,kDAAkD;YAClDpB,SAASiB;QACX,OAAO;YACL,kCAAkC;YAClCjB,SAASO,kBAAkBE,OAAOY,kBAAkB,EAAE;QACxD;IACF,GAAG;QAACtB;QAAIG;QAAgBI,OAAOQ;QAASP,kBAAkBE,OAAOY;QAAgBrB;KAAS;IAE1F,MAAMsB,WAAW,CAACC;QAChB,IAAI,CAACA,SAAS;YACZvB,SAAS,EAAE;YACX;QACF;QAEA,MAAMwB,eAAeD,QAAQE,GAAG,CAAC,CAACC,SAChC,OAAOA,WAAW,WAAWA,OAAOzB,KAAK,GAAGyB;QAG9C1B,SAASwB;IACX;IAEA,qBACE,MAACG;QAAIC,WAAWhC;;0BACd,KAACV;gBAAW2C,OAAO/B,MAAMgC,KAAK,CAACD,KAAK;gBAAE1B,MAAML,MAAMK,IAAI;;0BACtD,KAAChB;gBACCyC,WAAWhC;gBACXmC,UAAUjC,MAAMkC,QAAQ;gBACxBC,gBAAgB,CAACP,SAAWQ,OAAOR,OAAOzB,KAAK;gBAC/CkC,SAAS,CAAC,MAAM,EAAErC,MAAMK,IAAI,CAACiC,OAAO,CAAC,OAAO,OAAO;gBACnDC,aAAa;gBACbC,SAAS;gBACTC,YAAY;gBACZ,uCAAuC;gBACvCjB,UAAUA;gBACVC,SAASZ;gBACTV,OACEc,MAAMC,OAAO,CAACf,SACVA,MAAMwB,GAAG,CAAC,CAACe;oBACT,MAAMC,QAAQ9B,aAAa+B,IAAI,CAAC,CAACC,MAAQA,IAAI1C,KAAK,KAAKuC;oBACvD,OAAOC,QAAQ;wBAAE,GAAGA,KAAK;wBAAE1C,IAAIyC;oBAAI,IAAI;wBAAEzC,IAAIyC;wBAAKX,OAAOW;wBAAKvC,OAAOuC;oBAAI;gBAC3E,KACA,EAAE;;;;AAKhB,EAAC"}
+{"version":3,"sources":["../../../src/components/FieldsToExport/index.tsx"],"sourcesContent":["'use client'\n\nimport type { SelectFieldClientProps } from 'payload'\nimport type { ReactNode } from 'react'\n\nimport {\n  FieldLabel,\n  ReactSelect,\n  useConfig,\n  useDocumentInfo,\n  useField,\n  useListQuery,\n} from '@payloadcms/ui'\nimport React, { useEffect, useMemo } from 'react'\n\nimport { useImportExport } from '../ImportExportProvider/index.js'\nimport { filterSelectableFieldValues, reduceFields } from './reduceFields.js'\n\nconst baseClass = 'field-type fields-to-export'\n\nexport const FieldsToExport: React.FC<SelectFieldClientProps> = (props) => {\n  const { id } = useDocumentInfo()\n  const { setValue, value } = useField<string[]>()\n  const { value: collectionSlug } = useField<string>({ path: 'collectionSlug' })\n  const { getEntityConfig } = useConfig()\n  const { collection } = useImportExport()\n  const { query } = useListQuery()\n\n  const collectionConfig = getEntityConfig({ collectionSlug: collectionSlug ?? collection })\n\n  const fieldOptions = useMemo(() => {\n    const disabledFields =\n      collectionConfig?.admin?.custom?.['plugin-import-export']?.disabledFields ?? []\n\n    return reduceFields({\n      disabledFields,\n      fields: collectionConfig?.fields,\n    })\n  }, [collectionConfig?.admin?.custom, collectionConfig?.fields])\n  useEffect(() => {\n    if (id || !collectionSlug) {\n      return\n    }\n\n    const queryColumns = query?.columns\n    const initialColumns = Array.isArray(queryColumns)\n      ? queryColumns.filter(\n          (column): column is string => typeof column === 'string' && !column.startsWith('-'),\n        )\n      : (collectionConfig?.admin?.defaultColumns ?? [])\n\n    setValue(filterSelectableFieldValues({ fieldOptions, values: initialColumns }))\n  }, [\n    id,\n    collectionSlug,\n    query?.columns,\n    collectionConfig?.admin?.defaultColumns,\n    fieldOptions,\n    setValue,\n  ])\n\n  const onChange = (options: { id: string; label: ReactNode; value: string }[]) => {\n    if (!options) {\n      setValue([])\n      return\n    }\n\n    const updatedValue = options.map((option) =>\n      typeof option === 'object' ? option.value : option,\n    )\n\n    setValue(updatedValue)\n  }\n\n  return (\n    <div className={baseClass}>\n      <FieldLabel label={props.field.label} path={props.path} />\n      <ReactSelect\n        className={baseClass}\n        disabled={props.readOnly}\n        getOptionValue={(option) => String(option.value)}\n        inputId={`field-${props.path.replace(/\\./g, '__')}`}\n        isClearable={true}\n        isMulti={true}\n        isSortable={true}\n        // @ts-expect-error react select option\n        onChange={onChange}\n        options={fieldOptions}\n        value={\n          Array.isArray(value)\n            ? value.map((val) => {\n                const match = fieldOptions.find((opt) => opt.value === val)\n                return match ? { ...match, id: val } : { id: val, label: val, value: val }\n              })\n            : []\n        }\n      />\n    </div>\n  )\n}\n"],"names":["FieldLabel","ReactSelect","useConfig","useDocumentInfo","useField","useListQuery","React","useEffect","useMemo","useImportExport","filterSelectableFieldValues","reduceFields","baseClass","FieldsToExport","props","id","setValue","value","collectionSlug","path","getEntityConfig","collection","query","collectionConfig","fieldOptions","disabledFields","admin","custom","fields","queryColumns","columns","initialColumns","Array","isArray","filter","column","startsWith","defaultColumns","values","onChange","options","updatedValue","map","option","div","className","label","field","disabled","readOnly","getOptionValue","String","inputId","replace","isClearable","isMulti","isSortable","val","match","find","opt"],"mappings":"AAAA;;AAKA,SACEA,UAAU,EACVC,WAAW,EACXC,SAAS,EACTC,eAAe,EACfC,QAAQ,EACRC,YAAY,QACP,iBAAgB;AACvB,OAAOC,SAASC,SAAS,EAAEC,OAAO,QAAQ,QAAO;AAEjD,SAASC,eAAe,QAAQ,mCAAkC;AAClE,SAASC,2BAA2B,EAAEC,YAAY,QAAQ,oBAAmB;AAE7E,MAAMC,YAAY;AAElB,OAAO,MAAMC,iBAAmD,CAACC;IAC/D,MAAM,EAAEC,EAAE,EAAE,GAAGZ;IACf,MAAM,EAAEa,QAAQ,EAAEC,KAAK,EAAE,GAAGb;IAC5B,MAAM,EAAEa,OAAOC,cAAc,EAAE,GAAGd,SAAiB;QAAEe,MAAM;IAAiB;IAC5E,MAAM,EAAEC,eAAe,EAAE,GAAGlB;IAC5B,MAAM,EAAEmB,UAAU,EAAE,GAAGZ;IACvB,MAAM,EAAEa,KAAK,EAAE,GAAGjB;IAElB,MAAMkB,mBAAmBH,gBAAgB;QAAEF,gBAAgBA,kBAAkBG;IAAW;IAExF,MAAMG,eAAehB,QAAQ;QAC3B,MAAMiB,iBACJF,kBAAkBG,OAAOC,QAAQ,CAAC,uBAAuB,EAAEF,kBAAkB,EAAE;QAEjF,OAAOd,aAAa;YAClBc;YACAG,QAAQL,kBAAkBK;QAC5B;IACF,GAAG;QAACL,kBAAkBG,OAAOC;QAAQJ,kBAAkBK;KAAO;IAC9DrB,UAAU;QACR,IAAIQ,MAAM,CAACG,gBAAgB;YACzB;QACF;QAEA,MAAMW,eAAeP,OAAOQ;QAC5B,MAAMC,iBAAiBC,MAAMC,OAAO,CAACJ,gBACjCA,aAAaK,MAAM,CACjB,CAACC,SAA6B,OAAOA,WAAW,YAAY,CAACA,OAAOC,UAAU,CAAC,QAEhFb,kBAAkBG,OAAOW,kBAAkB,EAAE;QAElDrB,SAASN,4BAA4B;YAAEc;YAAcc,QAAQP;QAAe;IAC9E,GAAG;QACDhB;QACAG;QACAI,OAAOQ;QACPP,kBAAkBG,OAAOW;QACzBb;QACAR;KACD;IAED,MAAMuB,WAAW,CAACC;QAChB,IAAI,CAACA,SAAS;YACZxB,SAAS,EAAE;YACX;QACF;QAEA,MAAMyB,eAAeD,QAAQE,GAAG,CAAC,CAACC,SAChC,OAAOA,WAAW,WAAWA,OAAO1B,KAAK,GAAG0B;QAG9C3B,SAASyB;IACX;IAEA,qBACE,MAACG;QAAIC,WAAWjC;;0BACd,KAACZ;gBAAW8C,OAAOhC,MAAMiC,KAAK,CAACD,KAAK;gBAAE3B,MAAML,MAAMK,IAAI;;0BACtD,KAAClB;gBACC4C,WAAWjC;gBACXoC,UAAUlC,MAAMmC,QAAQ;gBACxBC,gBAAgB,CAACP,SAAWQ,OAAOR,OAAO1B,KAAK;gBAC/CmC,SAAS,CAAC,MAAM,EAAEtC,MAAMK,IAAI,CAACkC,OAAO,CAAC,OAAO,OAAO;gBACnDC,aAAa;gBACbC,SAAS;gBACTC,YAAY;gBACZ,uCAAuC;gBACvCjB,UAAUA;gBACVC,SAAShB;gBACTP,OACEe,MAAMC,OAAO,CAAChB,SACVA,MAAMyB,GAAG,CAAC,CAACe;oBACT,MAAMC,QAAQlC,aAAamC,IAAI,CAAC,CAACC,MAAQA,IAAI3C,KAAK,KAAKwC;oBACvD,OAAOC,QAAQ;wBAAE,GAAGA,KAAK;wBAAE3C,IAAI0C;oBAAI,IAAI;wBAAE1C,IAAI0C;wBAAKX,OAAOW;wBAAKxC,OAAOwC;oBAAI;gBAC3E,KACA,EAAE;;;;AAKhB,EAAC"}

package/dist/components/FieldsToExport/reduceFields.d.ts

@@ -1,5 +1,11 @@
 import type { ClientField } from 'payload';
 import React from 'react';
+export declare const filterSelectableFieldValues: ({ fieldOptions, values, }: {
+    fieldOptions: {
+        value: string;
+    }[];
+    values: string[];
+}) => string[];
 export declare const reduceFields: ({ disabledFields, excludeUnsortable, fields, labelPrefix, path, }: {
     disabledFields?: string[];
     excludeUnsortable?: boolean;

package/dist/components/FieldsToExport/reduceFields.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"reduceFields.d.ts","sourceRoot":"","sources":["../../../src/components/FieldsToExport/reduceFields.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAG1C,OAAO,KAAmB,MAAM,OAAO,CAAA;AAyCvC,eAAO,MAAM,YAAY,sEAMtB;IACD,cAAc,CAAC,EAAE,MAAM,EAAE,CAAA;IACzB,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,MAAM,EAAE,WAAW,EAAE,CAAA;IACrB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,KAAG;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,EAoFxD,CAAA"}
+{"version":3,"file":"reduceFields.d.ts","sourceRoot":"","sources":["../../../src/components/FieldsToExport/reduceFields.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAG1C,OAAO,KAAmB,MAAM,OAAO,CAAA;AAEvC,eAAO,MAAM,2BAA2B,8BAGrC;IACD,YAAY,EAAE;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAA;IACjC,MAAM,EAAE,MAAM,EAAE,CAAA;CACjB,KAAG,MAAM,EAIT,CAAA;AAyCD,eAAO,MAAM,YAAY,sEAMtB;IACD,cAAc,CAAC,EAAE,MAAM,EAAE,CAAA;IACzB,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,MAAM,EAAE,WAAW,EAAE,CAAA;IACrB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,KAAG;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,EAoFxD,CAAA"}

package/dist/components/FieldsToExport/reduceFields.js

@@ -1,6 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { fieldAffectsData, fieldHasSubFields } from 'payload/shared';
 import React, { Fragment } from 'react';
+export const filterSelectableFieldValues = ({ fieldOptions, values })=>{
+    const selectableValues = new Set(fieldOptions.map((field)=>field.value));
+    return values.filter((value)=>selectableValues.has(value));
+};
 const createNestedClientFieldPath = (parentPath, field)=>{
     if (parentPath) {
         if (fieldAffectsData(field)) {

package/dist/components/FieldsToExport/reduceFields.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/FieldsToExport/reduceFields.tsx"],"sourcesContent":["import type { ClientField } from 'payload'\n\nimport { fieldAffectsData, fieldHasSubFields } from 'payload/shared'\nimport React, { Fragment } from 'react'\n\nconst createNestedClientFieldPath = (parentPath: string, field: ClientField): string => {\n  if (parentPath) {\n    if (fieldAffectsData(field)) {\n      return `${parentPath}.${field.name}`\n    }\n    return parentPath\n  }\n\n  if (fieldAffectsData(field)) {\n    return field.name\n  }\n\n  return ''\n}\n\nconst combineLabel = ({\n  field,\n  prefix,\n}: {\n  field: ClientField\n  prefix?: React.ReactNode\n}): React.ReactNode => {\n  return (\n    <Fragment>\n      {prefix ? (\n        <Fragment>\n          <span style={{ display: 'inline-block' }}>{prefix}</span>\n          {' > '}\n        </Fragment>\n      ) : null}\n      <span style={{ display: 'inline-block' }}>\n        {'label' in field && typeof field.label === 'string'\n          ? field.label\n          : (('name' in field && field.name) ?? 'unnamed field')}\n      </span>\n    </Fragment>\n  )\n}\n\nexport const reduceFields = ({\n  disabledFields = [],\n  excludeUnsortable = false,\n  fields,\n  labelPrefix = null,\n  path = '',\n}: {\n  disabledFields?: string[]\n  excludeUnsortable?: boolean\n  fields: ClientField[]\n  labelPrefix?: React.ReactNode\n  path?: string\n}): { id: string; label: React.ReactNode; value: string }[] => {\n  if (!fields) {\n    return []\n  }\n\n  return fields.reduce<{ id: string; label: React.ReactNode; value: string }[]>(\n    (fieldsToUse, field) => {\n      const isArrayOrBlocks = field.type === 'array' || field.type === 'blocks'\n\n      // escape for a variety of reasons, include ui fields as they have `name`.\n      if (field.type === 'ui' || (excludeUnsortable && isArrayOrBlocks)) {\n        return fieldsToUse\n      }\n\n      if (!isArrayOrBlocks && fieldHasSubFields(field)) {\n        return [\n          ...fieldsToUse,\n          ...reduceFields({\n            disabledFields,\n            excludeUnsortable,\n            fields: field.fields,\n            labelPrefix: combineLabel({ field, prefix: labelPrefix }),\n            path: createNestedClientFieldPath(path, field),\n          }),\n        ]\n      }\n\n      if (field.type === 'tabs' && 'tabs' in field) {\n        return [\n          ...fieldsToUse,\n          ...field.tabs.reduce<{ id: string; label: React.ReactNode; value: string }[]>(\n            (tabFields, tab) => {\n              if ('fields' in tab) {\n                const isNamedTab = 'name' in tab && tab.name\n\n                const newPath = isNamedTab ? `${path}${path ? '.' : ''}${tab.name}` : path\n\n                return [\n                  ...tabFields,\n                  ...reduceFields({\n                    disabledFields,\n                    excludeUnsortable,\n                    fields: tab.fields,\n                    labelPrefix: isNamedTab\n                      ? combineLabel({\n                          field: {\n                            name: tab.name,\n                            label: tab.label ?? tab.name,\n                          } as any,\n                          prefix: labelPrefix,\n                        })\n                      : labelPrefix,\n                    path: newPath,\n                  }),\n                ]\n              }\n              return tabFields\n            },\n            [],\n          ),\n        ]\n      }\n\n      const val = createNestedClientFieldPath(path, field)\n\n      // If the field is disabled, skip it\n      if (\n        disabledFields.some(\n          (disabledField) => val === disabledField || val.startsWith(`${disabledField}.`),\n        )\n      ) {\n        return fieldsToUse\n      }\n\n      const formattedField = {\n        id: val,\n        label: combineLabel({ field, prefix: labelPrefix }),\n        value: val,\n      }\n\n      return [...fieldsToUse, formattedField]\n    },\n    [],\n  )\n}\n"],"names":["fieldAffectsData","fieldHasSubFields","React","Fragment","createNestedClientFieldPath","parentPath","field","name","combineLabel","prefix","span","style","display","label","reduceFields","disabledFields","excludeUnsortable","fields","labelPrefix","path","reduce","fieldsToUse","isArrayOrBlocks","type","tabs","tabFields","tab","isNamedTab","newPath","val","some","disabledField","startsWith","formattedField","id","value"],"mappings":";AAEA,SAASA,gBAAgB,EAAEC,iBAAiB,QAAQ,iBAAgB;AACpE,OAAOC,SAASC,QAAQ,QAAQ,QAAO;AAEvC,MAAMC,8BAA8B,CAACC,YAAoBC;IACvD,IAAID,YAAY;QACd,IAAIL,iBAAiBM,QAAQ;YAC3B,OAAO,GAAGD,WAAW,CAAC,EAAEC,MAAMC,IAAI,EAAE;QACtC;QACA,OAAOF;IACT;IAEA,IAAIL,iBAAiBM,QAAQ;QAC3B,OAAOA,MAAMC,IAAI;IACnB;IAEA,OAAO;AACT;AAEA,MAAMC,eAAe,CAAC,EACpBF,KAAK,EACLG,MAAM,EAIP;IACC,qBACE,MAACN;;YACEM,uBACC,MAACN;;kCACC,KAACO;wBAAKC,OAAO;4BAAEC,SAAS;wBAAe;kCAAIH;;oBAC1C;;iBAED;0BACJ,KAACC;gBAAKC,OAAO;oBAAEC,SAAS;gBAAe;0BACpC,WAAWN,SAAS,OAAOA,MAAMO,KAAK,KAAK,WACxCP,MAAMO,KAAK,GACV,AAAC,CAAA,UAAUP,SAASA,MAAMC,IAAI,AAAD,KAAM;;;;AAIhD;AAEA,OAAO,MAAMO,eAAe,CAAC,EAC3BC,iBAAiB,EAAE,EACnBC,oBAAoB,KAAK,EACzBC,MAAM,EACNC,cAAc,IAAI,EAClBC,OAAO,EAAE,EAOV;IACC,IAAI,CAACF,QAAQ;QACX,OAAO,EAAE;IACX;IAEA,OAAOA,OAAOG,MAAM,CAClB,CAACC,aAAaf;QACZ,MAAMgB,kBAAkBhB,MAAMiB,IAAI,KAAK,WAAWjB,MAAMiB,IAAI,KAAK;QAEjE,0EAA0E;QAC1E,IAAIjB,MAAMiB,IAAI,KAAK,QAASP,qBAAqBM,iBAAkB;YACjE,OAAOD;QACT;QAEA,IAAI,CAACC,mBAAmBrB,kBAAkBK,QAAQ;YAChD,OAAO;mBACFe;mBACAP,aAAa;oBACdC;oBACAC;oBACAC,QAAQX,MAAMW,MAAM;oBACpBC,aAAaV,aAAa;wBAAEF;wBAAOG,QAAQS;oBAAY;oBACvDC,MAAMf,4BAA4Be,MAAMb;gBAC1C;aACD;QACH;QAEA,IAAIA,MAAMiB,IAAI,KAAK,UAAU,UAAUjB,OAAO;YAC5C,OAAO;mBACFe;mBACAf,MAAMkB,IAAI,CAACJ,MAAM,CAClB,CAACK,WAAWC;oBACV,IAAI,YAAYA,KAAK;wBACnB,MAAMC,aAAa,UAAUD,OAAOA,IAAInB,IAAI;wBAE5C,MAAMqB,UAAUD,aAAa,GAAGR,OAAOA,OAAO,MAAM,KAAKO,IAAInB,IAAI,EAAE,GAAGY;wBAEtE,OAAO;+BACFM;+BACAX,aAAa;gCACdC;gCACAC;gCACAC,QAAQS,IAAIT,MAAM;gCAClBC,aAAaS,aACTnB,aAAa;oCACXF,OAAO;wCACLC,MAAMmB,IAAInB,IAAI;wCACdM,OAAOa,IAAIb,KAAK,IAAIa,IAAInB,IAAI;oCAC9B;oCACAE,QAAQS;gCACV,KACAA;gCACJC,MAAMS;4BACR;yBACD;oBACH;oBACA,OAAOH;gBACT,GACA,EAAE;aAEL;QACH;QAEA,MAAMI,MAAMzB,4BAA4Be,MAAMb;QAE9C,oCAAoC;QACpC,IACES,eAAee,IAAI,CACjB,CAACC,gBAAkBF,QAAQE,iBAAiBF,IAAIG,UAAU,CAAC,GAAGD,cAAc,CAAC,CAAC,IAEhF;YACA,OAAOV;QACT;QAEA,MAAMY,iBAAiB;YACrBC,IAAIL;YACJhB,OAAOL,aAAa;gBAAEF;gBAAOG,QAAQS;YAAY;YACjDiB,OAAON;QACT;QAEA,OAAO;eAAIR;YAAaY;SAAe;IACzC,GACA,EAAE;AAEN,EAAC"}
+{"version":3,"sources":["../../../src/components/FieldsToExport/reduceFields.tsx"],"sourcesContent":["import type { ClientField } from 'payload'\n\nimport { fieldAffectsData, fieldHasSubFields } from 'payload/shared'\nimport React, { Fragment } from 'react'\n\nexport const filterSelectableFieldValues = ({\n  fieldOptions,\n  values,\n}: {\n  fieldOptions: { value: string }[]\n  values: string[]\n}): string[] => {\n  const selectableValues = new Set(fieldOptions.map((field) => field.value))\n\n  return values.filter((value) => selectableValues.has(value))\n}\n\nconst createNestedClientFieldPath = (parentPath: string, field: ClientField): string => {\n  if (parentPath) {\n    if (fieldAffectsData(field)) {\n      return `${parentPath}.${field.name}`\n    }\n    return parentPath\n  }\n\n  if (fieldAffectsData(field)) {\n    return field.name\n  }\n\n  return ''\n}\n\nconst combineLabel = ({\n  field,\n  prefix,\n}: {\n  field: ClientField\n  prefix?: React.ReactNode\n}): React.ReactNode => {\n  return (\n    <Fragment>\n      {prefix ? (\n        <Fragment>\n          <span style={{ display: 'inline-block' }}>{prefix}</span>\n          {' > '}\n        </Fragment>\n      ) : null}\n      <span style={{ display: 'inline-block' }}>\n        {'label' in field && typeof field.label === 'string'\n          ? field.label\n          : (('name' in field && field.name) ?? 'unnamed field')}\n      </span>\n    </Fragment>\n  )\n}\n\nexport const reduceFields = ({\n  disabledFields = [],\n  excludeUnsortable = false,\n  fields,\n  labelPrefix = null,\n  path = '',\n}: {\n  disabledFields?: string[]\n  excludeUnsortable?: boolean\n  fields: ClientField[]\n  labelPrefix?: React.ReactNode\n  path?: string\n}): { id: string; label: React.ReactNode; value: string }[] => {\n  if (!fields) {\n    return []\n  }\n\n  return fields.reduce<{ id: string; label: React.ReactNode; value: string }[]>(\n    (fieldsToUse, field) => {\n      const isArrayOrBlocks = field.type === 'array' || field.type === 'blocks'\n\n      // escape for a variety of reasons, include ui fields as they have `name`.\n      if (field.type === 'ui' || (excludeUnsortable && isArrayOrBlocks)) {\n        return fieldsToUse\n      }\n\n      if (!isArrayOrBlocks && fieldHasSubFields(field)) {\n        return [\n          ...fieldsToUse,\n          ...reduceFields({\n            disabledFields,\n            excludeUnsortable,\n            fields: field.fields,\n            labelPrefix: combineLabel({ field, prefix: labelPrefix }),\n            path: createNestedClientFieldPath(path, field),\n          }),\n        ]\n      }\n\n      if (field.type === 'tabs' && 'tabs' in field) {\n        return [\n          ...fieldsToUse,\n          ...field.tabs.reduce<{ id: string; label: React.ReactNode; value: string }[]>(\n            (tabFields, tab) => {\n              if ('fields' in tab) {\n                const isNamedTab = 'name' in tab && tab.name\n\n                const newPath = isNamedTab ? `${path}${path ? '.' : ''}${tab.name}` : path\n\n                return [\n                  ...tabFields,\n                  ...reduceFields({\n                    disabledFields,\n                    excludeUnsortable,\n                    fields: tab.fields,\n                    labelPrefix: isNamedTab\n                      ? combineLabel({\n                          field: {\n                            name: tab.name,\n                            label: tab.label ?? tab.name,\n                          } as any,\n                          prefix: labelPrefix,\n                        })\n                      : labelPrefix,\n                    path: newPath,\n                  }),\n                ]\n              }\n              return tabFields\n            },\n            [],\n          ),\n        ]\n      }\n\n      const val = createNestedClientFieldPath(path, field)\n\n      // If the field is disabled, skip it\n      if (\n        disabledFields.some(\n          (disabledField) => val === disabledField || val.startsWith(`${disabledField}.`),\n        )\n      ) {\n        return fieldsToUse\n      }\n\n      const formattedField = {\n        id: val,\n        label: combineLabel({ field, prefix: labelPrefix }),\n        value: val,\n      }\n\n      return [...fieldsToUse, formattedField]\n    },\n    [],\n  )\n}\n"],"names":["fieldAffectsData","fieldHasSubFields","React","Fragment","filterSelectableFieldValues","fieldOptions","values","selectableValues","Set","map","field","value","filter","has","createNestedClientFieldPath","parentPath","name","combineLabel","prefix","span","style","display","label","reduceFields","disabledFields","excludeUnsortable","fields","labelPrefix","path","reduce","fieldsToUse","isArrayOrBlocks","type","tabs","tabFields","tab","isNamedTab","newPath","val","some","disabledField","startsWith","formattedField","id"],"mappings":"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"}

package/dist/components/FormatField/index.d.ts

@@ -1,3 +1,4 @@
-import type { SelectFieldClientComponent } from 'payload';
-export declare const FormatField: SelectFieldClientComponent;
+import type { SelectFieldClientProps } from 'payload';
+import React from 'react';
+export declare const FormatField: React.FC<SelectFieldClientProps>;
 //# sourceMappingURL=index.d.ts.map

package/dist/components/FormatField/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FormatField/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,SAAS,CAAA;AAczD,eAAO,MAAM,WAAW,EAAE,0BAiEzB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FormatField/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAA;AAGrD,OAAO,KAA0C,MAAM,OAAO,CAAA;AAW9D,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAiExD,CAAA"}

package/dist/components/FormatField/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/FormatField/index.tsx"],"sourcesContent":["'use client'\n\nimport type { ReactSelectOption } from '@payloadcms/ui'\nimport type { SelectFieldClientComponent } from 'payload'\n\nimport { FieldLabel, ReactSelect, useConfig, useField } from '@payloadcms/ui'\nimport React, { useCallback, useEffect, useMemo } from 'react'\n\nconst baseClass = 'field-type select'\n\ntype Format = 'csv' | 'json'\n\nconst allOptions: ReactSelectOption[] = [\n  { label: 'CSV', value: 'csv' },\n  { label: 'JSON', value: 'json' },\n]\n\nexport const FormatField: SelectFieldClientComponent = (props) => {\n  const { getEntityConfig } = useConfig()\n  const width = props.field.admin?.width\n\n  const styles = useMemo<React.CSSProperties>(\n    () => ({ '--field-width': width }) as React.CSSProperties,\n    [width],\n  )\n\n  const { setValue, value: formatValue } = useField<Format>()\n  const { value: targetCollectionSlug } = useField<string>({ path: 'collectionSlug' })\n\n  const targetCollectionConfig = getEntityConfig({ collectionSlug: targetCollectionSlug })\n  const forcedFormat = targetCollectionConfig?.admin?.custom?.['plugin-import-export']\n    ?.exportFormat as Format | undefined\n\n  const options = useMemo<ReactSelectOption[]>(() => {\n    if (forcedFormat) {\n      return [{ label: forcedFormat.toUpperCase(), value: forcedFormat }]\n    }\n    return allOptions\n  }, [forcedFormat])\n\n  const selectedOption = useMemo<ReactSelectOption | undefined>(() => {\n    const effectiveValue = forcedFormat || formatValue || 'csv'\n    return options.find((o) => o.value === effectiveValue) ?? options[0]\n  }, [forcedFormat, formatValue, options])\n\n  useEffect(() => {\n    if (forcedFormat && formatValue !== forcedFormat) {\n      setValue(forcedFormat)\n    }\n  }, [forcedFormat, formatValue, setValue])\n\n  const handleChange = useCallback(\n    (selected: ReactSelectOption | ReactSelectOption[]) => {\n      if (forcedFormat) {\n        return\n      }\n      if (Array.isArray(selected)) {\n        setValue((selected[0]?.value as Format) ?? 'csv')\n      } else {\n        setValue((selected?.value as Format) ?? 'csv')\n      }\n    },\n    [forcedFormat, setValue],\n  )\n\n  const isReadOnly = Boolean(forcedFormat) || props.readOnly\n\n  return (\n    <div className={baseClass} style={styles}>\n      <FieldLabel label={props.field.label} path={props.path} />\n      <ReactSelect\n        className={'format-field'}\n        disabled={isReadOnly}\n        inputId={`field-${props.path.replace(/\\./g, '__')}`}\n        isClearable={false}\n        isSearchable={false}\n        onChange={handleChange}\n        options={options}\n        value={selectedOption}\n      />\n    </div>\n  )\n}\n"],"names":["FieldLabel","ReactSelect","useConfig","useField","React","useCallback","useEffect","useMemo","baseClass","allOptions","label","value","FormatField","props","getEntityConfig","width","field","admin","styles","setValue","formatValue","targetCollectionSlug","path","targetCollectionConfig","collectionSlug","forcedFormat","custom","exportFormat","options","toUpperCase","selectedOption","effectiveValue","find","o","handleChange","selected","Array","isArray","isReadOnly","Boolean","readOnly","div","className","style","disabled","inputId","replace","isClearable","isSearchable","onChange"],"mappings":"AAAA;;AAKA,SAASA,UAAU,EAAEC,WAAW,EAAEC,SAAS,EAAEC,QAAQ,QAAQ,iBAAgB;AAC7E,OAAOC,SAASC,WAAW,EAAEC,SAAS,EAAEC,OAAO,QAAQ,QAAO;AAE9D,MAAMC,YAAY;AAIlB,MAAMC,aAAkC;IACtC;QAAEC,OAAO;QAAOC,OAAO;IAAM;IAC7B;QAAED,OAAO;QAAQC,OAAO;IAAO;CAChC;AAED,OAAO,MAAMC,cAA0C,CAACC;IACtD,MAAM,EAAEC,eAAe,EAAE,GAAGZ;IAC5B,MAAMa,QAAQF,MAAMG,KAAK,CAACC,KAAK,EAAEF;IAEjC,MAAMG,SAASX,QACb,IAAO,CAAA;YAAE,iBAAiBQ;QAAM,CAAA,GAChC;QAACA;KAAM;IAGT,MAAM,EAAEI,QAAQ,EAAER,OAAOS,WAAW,EAAE,GAAGjB;IACzC,MAAM,EAAEQ,OAAOU,oBAAoB,EAAE,GAAGlB,SAAiB;QAAEmB,MAAM;IAAiB;IAElF,MAAMC,yBAAyBT,gBAAgB;QAAEU,gBAAgBH;IAAqB;IACtF,MAAMI,eAAeF,wBAAwBN,OAAOS,QAAQ,CAAC,uBAAuB,EAChFC;IAEJ,MAAMC,UAAUrB,QAA6B;QAC3C,IAAIkB,cAAc;YAChB,OAAO;gBAAC;oBAAEf,OAAOe,aAAaI,WAAW;oBAAIlB,OAAOc;gBAAa;aAAE;QACrE;QACA,OAAOhB;IACT,GAAG;QAACgB;KAAa;IAEjB,MAAMK,iBAAiBvB,QAAuC;QAC5D,MAAMwB,iBAAiBN,gBAAgBL,eAAe;QACtD,OAAOQ,QAAQI,IAAI,CAAC,CAACC,IAAMA,EAAEtB,KAAK,KAAKoB,mBAAmBH,OAAO,CAAC,EAAE;IACtE,GAAG;QAACH;QAAcL;QAAaQ;KAAQ;IAEvCtB,UAAU;QACR,IAAImB,gBAAgBL,gBAAgBK,cAAc;YAChDN,SAASM;QACX;IACF,GAAG;QAACA;QAAcL;QAAaD;KAAS;IAExC,MAAMe,eAAe7B,YACnB,CAAC8B;QACC,IAAIV,cAAc;YAChB;QACF;QACA,IAAIW,MAAMC,OAAO,CAACF,WAAW;YAC3BhB,SAAS,AAACgB,QAAQ,CAAC,EAAE,EAAExB,SAAoB;QAC7C,OAAO;YACLQ,SAAS,AAACgB,UAAUxB,SAAoB;QAC1C;IACF,GACA;QAACc;QAAcN;KAAS;IAG1B,MAAMmB,aAAaC,QAAQd,iBAAiBZ,MAAM2B,QAAQ;IAE1D,qBACE,MAACC;QAAIC,WAAWlC;QAAWmC,OAAOzB;;0BAChC,KAAClB;gBAAWU,OAAOG,MAAMG,KAAK,CAACN,KAAK;gBAAEY,MAAMT,MAAMS,IAAI;;0BACtD,KAACrB;gBACCyC,WAAW;gBACXE,UAAUN;gBACVO,SAAS,CAAC,MAAM,EAAEhC,MAAMS,IAAI,CAACwB,OAAO,CAAC,OAAO,OAAO;gBACnDC,aAAa;gBACbC,cAAc;gBACdC,UAAUf;gBACVN,SAASA;gBACTjB,OAAOmB;;;;AAIf,EAAC"}
+{"version":3,"sources":["../../../src/components/FormatField/index.tsx"],"sourcesContent":["'use client'\n\nimport type { ReactSelectOption } from '@payloadcms/ui'\nimport type { SelectFieldClientProps } from 'payload'\n\nimport { FieldLabel, ReactSelect, useConfig, useField } from '@payloadcms/ui'\nimport React, { useCallback, useEffect, useMemo } from 'react'\n\nconst baseClass = 'field-type select'\n\ntype Format = 'csv' | 'json'\n\nconst allOptions: ReactSelectOption[] = [\n  { label: 'CSV', value: 'csv' },\n  { label: 'JSON', value: 'json' },\n]\n\nexport const FormatField: React.FC<SelectFieldClientProps> = (props) => {\n  const { getEntityConfig } = useConfig()\n  const width = props.field.admin?.width\n\n  const styles = useMemo<React.CSSProperties>(\n    () => ({ '--field-width': width }) as React.CSSProperties,\n    [width],\n  )\n\n  const { setValue, value: formatValue } = useField<Format>()\n  const { value: targetCollectionSlug } = useField<string>({ path: 'collectionSlug' })\n\n  const targetCollectionConfig = getEntityConfig({ collectionSlug: targetCollectionSlug })\n  const forcedFormat = targetCollectionConfig?.admin?.custom?.['plugin-import-export']\n    ?.exportFormat as Format | undefined\n\n  const options = useMemo<ReactSelectOption[]>(() => {\n    if (forcedFormat) {\n      return [{ label: forcedFormat.toUpperCase(), value: forcedFormat }]\n    }\n    return allOptions\n  }, [forcedFormat])\n\n  const selectedOption = useMemo<ReactSelectOption | undefined>(() => {\n    const effectiveValue = forcedFormat || formatValue || 'csv'\n    return options.find((o) => o.value === effectiveValue) ?? options[0]\n  }, [forcedFormat, formatValue, options])\n\n  useEffect(() => {\n    if (forcedFormat && formatValue !== forcedFormat) {\n      setValue(forcedFormat)\n    }\n  }, [forcedFormat, formatValue, setValue])\n\n  const handleChange = useCallback(\n    (selected: ReactSelectOption | ReactSelectOption[]) => {\n      if (forcedFormat) {\n        return\n      }\n      if (Array.isArray(selected)) {\n        setValue((selected[0]?.value as Format) ?? 'csv')\n      } else {\n        setValue((selected?.value as Format) ?? 'csv')\n      }\n    },\n    [forcedFormat, setValue],\n  )\n\n  const isReadOnly = Boolean(forcedFormat) || props.readOnly\n\n  return (\n    <div className={baseClass} style={styles}>\n      <FieldLabel label={props.field.label} path={props.path} />\n      <ReactSelect\n        className={'format-field'}\n        disabled={isReadOnly}\n        inputId={`field-${props.path.replace(/\\./g, '__')}`}\n        isClearable={false}\n        isSearchable={false}\n        onChange={handleChange}\n        options={options}\n        value={selectedOption}\n      />\n    </div>\n  )\n}\n"],"names":["FieldLabel","ReactSelect","useConfig","useField","React","useCallback","useEffect","useMemo","baseClass","allOptions","label","value","FormatField","props","getEntityConfig","width","field","admin","styles","setValue","formatValue","targetCollectionSlug","path","targetCollectionConfig","collectionSlug","forcedFormat","custom","exportFormat","options","toUpperCase","selectedOption","effectiveValue","find","o","handleChange","selected","Array","isArray","isReadOnly","Boolean","readOnly","div","className","style","disabled","inputId","replace","isClearable","isSearchable","onChange"],"mappings":"AAAA;;AAKA,SAASA,UAAU,EAAEC,WAAW,EAAEC,SAAS,EAAEC,QAAQ,QAAQ,iBAAgB;AAC7E,OAAOC,SAASC,WAAW,EAAEC,SAAS,EAAEC,OAAO,QAAQ,QAAO;AAE9D,MAAMC,YAAY;AAIlB,MAAMC,aAAkC;IACtC;QAAEC,OAAO;QAAOC,OAAO;IAAM;IAC7B;QAAED,OAAO;QAAQC,OAAO;IAAO;CAChC;AAED,OAAO,MAAMC,cAAgD,CAACC;IAC5D,MAAM,EAAEC,eAAe,EAAE,GAAGZ;IAC5B,MAAMa,QAAQF,MAAMG,KAAK,CAACC,KAAK,EAAEF;IAEjC,MAAMG,SAASX,QACb,IAAO,CAAA;YAAE,iBAAiBQ;QAAM,CAAA,GAChC;QAACA;KAAM;IAGT,MAAM,EAAEI,QAAQ,EAAER,OAAOS,WAAW,EAAE,GAAGjB;IACzC,MAAM,EAAEQ,OAAOU,oBAAoB,EAAE,GAAGlB,SAAiB;QAAEmB,MAAM;IAAiB;IAElF,MAAMC,yBAAyBT,gBAAgB;QAAEU,gBAAgBH;IAAqB;IACtF,MAAMI,eAAeF,wBAAwBN,OAAOS,QAAQ,CAAC,uBAAuB,EAChFC;IAEJ,MAAMC,UAAUrB,QAA6B;QAC3C,IAAIkB,cAAc;YAChB,OAAO;gBAAC;oBAAEf,OAAOe,aAAaI,WAAW;oBAAIlB,OAAOc;gBAAa;aAAE;QACrE;QACA,OAAOhB;IACT,GAAG;QAACgB;KAAa;IAEjB,MAAMK,iBAAiBvB,QAAuC;QAC5D,MAAMwB,iBAAiBN,gBAAgBL,eAAe;QACtD,OAAOQ,QAAQI,IAAI,CAAC,CAACC,IAAMA,EAAEtB,KAAK,KAAKoB,mBAAmBH,OAAO,CAAC,EAAE;IACtE,GAAG;QAACH;QAAcL;QAAaQ;KAAQ;IAEvCtB,UAAU;QACR,IAAImB,gBAAgBL,gBAAgBK,cAAc;YAChDN,SAASM;QACX;IACF,GAAG;QAACA;QAAcL;QAAaD;KAAS;IAExC,MAAMe,eAAe7B,YACnB,CAAC8B;QACC,IAAIV,cAAc;YAChB;QACF;QACA,IAAIW,MAAMC,OAAO,CAACF,WAAW;YAC3BhB,SAAS,AAACgB,QAAQ,CAAC,EAAE,EAAExB,SAAoB;QAC7C,OAAO;YACLQ,SAAS,AAACgB,UAAUxB,SAAoB;QAC1C;IACF,GACA;QAACc;QAAcN;KAAS;IAG1B,MAAMmB,aAAaC,QAAQd,iBAAiBZ,MAAM2B,QAAQ;IAE1D,qBACE,MAACC;QAAIC,WAAWlC;QAAWmC,OAAOzB;;0BAChC,KAAClB;gBAAWU,OAAOG,MAAMG,KAAK,CAACN,KAAK;gBAAEY,MAAMT,MAAMS,IAAI;;0BACtD,KAACrB;gBACCyC,WAAW;gBACXE,UAAUN;gBACVO,SAAS,CAAC,MAAM,EAAEhC,MAAMS,IAAI,CAACwB,OAAO,CAAC,OAAO,OAAO;gBACnDC,aAAa;gBACbC,cAAc;gBACdC,UAAUf;gBACVN,SAASA;gBACTjB,OAAOmB;;;;AAIf,EAAC"}

package/dist/components/ImportListMenuItem/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ImportListMenuItem/index.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAoB,MAAM,OAAO,CAAA;AAWxC,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC;IACxC,cAAc,EAAE,MAAM,CAAA;IACtB,oBAAoB,EAAE,MAAM,CAAA;CAC7B,CAoCA,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ImportListMenuItem/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAoB,MAAM,OAAO,CAAA;AAWxC,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC;IACxC,cAAc,EAAE,MAAM,CAAA;IACtB,oBAAoB,EAAE,MAAM,CAAA;CAC7B,CAqCA,CAAA"}

package/dist/components/ImportListMenuItem/index.js

@@ -1,7 +1,7 @@
 'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { getTranslation } from '@payloadcms/translations';
-import { PopupList, Translation, useConfig, useDocumentDrawer, useTranslation } from '@payloadcms/ui';
+import { useConfig, useDocumentDrawer, useTranslation } from '@payloadcms/ui';
 import React, { useEffect } from 'react';
 import { useImportExport } from '../ImportExportProvider/index.js';
 const baseClass = 'import-list-menu-item';
@@ -11,6 +11,10 @@ export const ImportListMenuItem = ({ collectionSlug, importCollectionSlug })=>{
     const currentCollectionConfig = getEntityConfig({
         collectionSlug
     });
+    const collectionLabel = getTranslation(currentCollectionConfig.labels.plural, i18n);
+    const actionLabel = t('plugin-import-export:importDocumentLabel', {
+        label: collectionLabel
+    });
     const [DocumentDrawer, DocumentDrawerToggler] = useDocumentDrawer({
         collectionSlug: importCollectionSlug
     });
@@ -22,18 +26,16 @@ export const ImportListMenuItem = ({ collectionSlug, importCollectionSlug })=>{
         currentCollectionConfig,
         setCollection
     ]);
-    return /*#__PURE__*/ _jsxs(PopupList.Button, {
-        className: baseClass,
+    return /*#__PURE__*/ _jsxs(_Fragment, {
         children: [
             /*#__PURE__*/ _jsx(DocumentDrawerToggler, {
-                children: /*#__PURE__*/ _jsx(Translation, {
-                    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-                    // @ts-expect-error
-                    i18nKey: "plugin-import-export:importDocumentLabel",
-                    t: t,
-                    variables: {
-                        label: getTranslation(currentCollectionConfig.labels.plural, i18n)
-                    }
+                "aria-label": actionLabel,
+                className: `popup-button-list__button ${baseClass}`,
+                role: "menuitem",
+                tabIndex: -1,
+                children: /*#__PURE__*/ _jsx("span", {
+                    className: "popup-button-list__label",
+                    children: actionLabel
                 })
             }),
             /*#__PURE__*/ _jsx(DocumentDrawer, {

package/dist/components/ImportListMenuItem/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ImportListMenuItem/index.tsx"],"sourcesContent":["'use client'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport {\n  PopupList,\n  Translation,\n  useConfig,\n  useDocumentDrawer,\n  useTranslation,\n} from '@payloadcms/ui'\nimport React, { useEffect } from 'react'\n\nimport type {\n  PluginImportExportTranslationKeys,\n  PluginImportExportTranslations,\n} from '../../translations/index.js'\n\nimport { useImportExport } from '../ImportExportProvider/index.js'\n\nconst baseClass = 'import-list-menu-item'\n\nexport const ImportListMenuItem: React.FC<{\n  collectionSlug: string\n  importCollectionSlug: string\n}> = ({ collectionSlug, importCollectionSlug }) => {\n  const { getEntityConfig } = useConfig()\n\n  const { i18n, t } = useTranslation<\n    PluginImportExportTranslations,\n    PluginImportExportTranslationKeys\n  >()\n\n  const currentCollectionConfig = getEntityConfig({ collectionSlug })\n\n  const [DocumentDrawer, DocumentDrawerToggler] = useDocumentDrawer({\n    collectionSlug: importCollectionSlug,\n  })\n  const { setCollection } = useImportExport()\n\n  // Set collection and selected items on mount or when selection changes\n  useEffect(() => {\n    setCollection(currentCollectionConfig.slug ?? '')\n  }, [currentCollectionConfig, setCollection])\n\n  return (\n    <PopupList.Button className={baseClass}>\n      <DocumentDrawerToggler>\n        <Translation\n          // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n          // @ts-expect-error\n          i18nKey=\"plugin-import-export:importDocumentLabel\"\n          t={t}\n          variables={{\n            label: getTranslation(currentCollectionConfig.labels.plural, i18n),\n          }}\n        />\n      </DocumentDrawerToggler>\n      <DocumentDrawer initialData={{ collectionSlug }} />\n    </PopupList.Button>\n  )\n}\n"],"names":["getTranslation","PopupList","Translation","useConfig","useDocumentDrawer","useTranslation","React","useEffect","useImportExport","baseClass","ImportListMenuItem","collectionSlug","importCollectionSlug","getEntityConfig","i18n","t","currentCollectionConfig","DocumentDrawer","DocumentDrawerToggler","setCollection","slug","Button","className","i18nKey","variables","label","labels","plural","initialData"],"mappings":"AAAA;;AAEA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,SACEC,SAAS,EACTC,WAAW,EACXC,SAAS,EACTC,iBAAiB,EACjBC,cAAc,QACT,iBAAgB;AACvB,OAAOC,SAASC,SAAS,QAAQ,QAAO;AAOxC,SAASC,eAAe,QAAQ,mCAAkC;AAElE,MAAMC,YAAY;AAElB,OAAO,MAAMC,qBAGR,CAAC,EAAEC,cAAc,EAAEC,oBAAoB,EAAE;IAC5C,MAAM,EAAEC,eAAe,EAAE,GAAGV;IAE5B,MAAM,EAAEW,IAAI,EAAEC,CAAC,EAAE,GAAGV;IAKpB,MAAMW,0BAA0BH,gBAAgB;QAAEF;IAAe;IAEjE,MAAM,CAACM,gBAAgBC,sBAAsB,GAAGd,kBAAkB;QAChEO,gBAAgBC;IAClB;IACA,MAAM,EAAEO,aAAa,EAAE,GAAGX;IAE1B,uEAAuE;IACvED,UAAU;QACRY,cAAcH,wBAAwBI,IAAI,IAAI;IAChD,GAAG;QAACJ;QAAyBG;KAAc;IAE3C,qBACE,MAAClB,UAAUoB,MAAM;QAACC,WAAWb;;0BAC3B,KAACS;0BACC,cAAA,KAAChB;oBACC,6DAA6D;oBAC7D,mBAAmB;oBACnBqB,SAAQ;oBACRR,GAAGA;oBACHS,WAAW;wBACTC,OAAOzB,eAAegB,wBAAwBU,MAAM,CAACC,MAAM,EAAEb;oBAC/D;;;0BAGJ,KAACG;gBAAeW,aAAa;oBAAEjB;gBAAe;;;;AAGpD,EAAC"}
+{"version":3,"sources":["../../../src/components/ImportListMenuItem/index.tsx"],"sourcesContent":["'use client'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { useConfig, useDocumentDrawer, useTranslation } from '@payloadcms/ui'\nimport React, { useEffect } from 'react'\n\nimport type {\n  PluginImportExportTranslationKeys,\n  PluginImportExportTranslations,\n} from '../../translations/index.js'\n\nimport { useImportExport } from '../ImportExportProvider/index.js'\n\nconst baseClass = 'import-list-menu-item'\n\nexport const ImportListMenuItem: React.FC<{\n  collectionSlug: string\n  importCollectionSlug: string\n}> = ({ collectionSlug, importCollectionSlug }) => {\n  const { getEntityConfig } = useConfig()\n\n  const { i18n, t } = useTranslation<\n    PluginImportExportTranslations,\n    PluginImportExportTranslationKeys\n  >()\n\n  const currentCollectionConfig = getEntityConfig({ collectionSlug })\n  const collectionLabel = getTranslation(currentCollectionConfig.labels.plural, i18n)\n  const actionLabel = t('plugin-import-export:importDocumentLabel', {\n    label: collectionLabel,\n  })\n\n  const [DocumentDrawer, DocumentDrawerToggler] = useDocumentDrawer({\n    collectionSlug: importCollectionSlug,\n  })\n  const { setCollection } = useImportExport()\n\n  // Set collection and selected items on mount or when selection changes\n  useEffect(() => {\n    setCollection(currentCollectionConfig.slug ?? '')\n  }, [currentCollectionConfig, setCollection])\n\n  return (\n    <>\n      <DocumentDrawerToggler\n        aria-label={actionLabel}\n        className={`popup-button-list__button ${baseClass}`}\n        role=\"menuitem\"\n        tabIndex={-1}\n      >\n        <span className=\"popup-button-list__label\">{actionLabel}</span>\n      </DocumentDrawerToggler>\n      <DocumentDrawer initialData={{ collectionSlug }} />\n    </>\n  )\n}\n"],"names":["getTranslation","useConfig","useDocumentDrawer","useTranslation","React","useEffect","useImportExport","baseClass","ImportListMenuItem","collectionSlug","importCollectionSlug","getEntityConfig","i18n","t","currentCollectionConfig","collectionLabel","labels","plural","actionLabel","label","DocumentDrawer","DocumentDrawerToggler","setCollection","slug","aria-label","className","role","tabIndex","span","initialData"],"mappings":"AAAA;;AAEA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,SAASC,SAAS,EAAEC,iBAAiB,EAAEC,cAAc,QAAQ,iBAAgB;AAC7E,OAAOC,SAASC,SAAS,QAAQ,QAAO;AAOxC,SAASC,eAAe,QAAQ,mCAAkC;AAElE,MAAMC,YAAY;AAElB,OAAO,MAAMC,qBAGR,CAAC,EAAEC,cAAc,EAAEC,oBAAoB,EAAE;IAC5C,MAAM,EAAEC,eAAe,EAAE,GAAGV;IAE5B,MAAM,EAAEW,IAAI,EAAEC,CAAC,EAAE,GAAGV;IAKpB,MAAMW,0BAA0BH,gBAAgB;QAAEF;IAAe;IACjE,MAAMM,kBAAkBf,eAAec,wBAAwBE,MAAM,CAACC,MAAM,EAAEL;IAC9E,MAAMM,cAAcL,EAAE,4CAA4C;QAChEM,OAAOJ;IACT;IAEA,MAAM,CAACK,gBAAgBC,sBAAsB,GAAGnB,kBAAkB;QAChEO,gBAAgBC;IAClB;IACA,MAAM,EAAEY,aAAa,EAAE,GAAGhB;IAE1B,uEAAuE;IACvED,UAAU;QACRiB,cAAcR,wBAAwBS,IAAI,IAAI;IAChD,GAAG;QAACT;QAAyBQ;KAAc;IAE3C,qBACE;;0BACE,KAACD;gBACCG,cAAYN;gBACZO,WAAW,CAAC,0BAA0B,EAAElB,WAAW;gBACnDmB,MAAK;gBACLC,UAAU,CAAC;0BAEX,cAAA,KAACC;oBAAKH,WAAU;8BAA4BP;;;0BAE9C,KAACE;gBAAeS,aAAa;oBAAEpB;gBAAe;;;;AAGpD,EAAC"}

package/dist/components/ImportPreview/index.css

@@ -8,7 +8,6 @@
 
   .import-preview__info {
     color: var(--color-text-secondary);
-    font-family: var(--text-body-medium-font-family);
     font-size: var(--text-body-medium-font-size);
     font-weight: var(--text-body-medium-font-weight);
     line-height: var(--text-body-medium-line-height);
@@ -16,7 +15,6 @@
 
   .import-preview__import-count {
     color: var(--color-text-secondary);
-    font-family: var(--text-body-medium-font-family);
     font-size: var(--text-body-medium-font-size);
     font-weight: var(--text-body-medium-font-weight);
     line-height: var(--text-body-medium-line-height);
@@ -39,7 +37,6 @@
 
   .import-preview__page-info {
     color: var(--color-text-secondary);
-    font-family: var(--text-body-medium-font-family);
     font-size: var(--text-body-medium-font-size);
     font-weight: var(--text-body-medium-font-weight);
     line-height: var(--text-body-medium-line-height);

package/dist/components/ImportPreview/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ImportPreview/index.tsx"],"names":[],"mappings":"AAkBA,OAAO,KAAkC,MAAM,OAAO,CAAA;AAStD,OAAO,aAAa,CAAA;AAoBpB,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EA2mBjC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ImportPreview/index.tsx"],"names":[],"mappings":"AAmBA,OAAO,KAAkC,MAAM,OAAO,CAAA;AActD,OAAO,aAAa,CAAA;AAuBpB,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EA+nBjC,CAAA"}