@payloadcms/next 3.0.0-canary.fb81f02 → 3.0.0

package/dist/views/Version/RenderFieldsToDiff/fields/Relationship/index.js

@@ -1,4 +1,6 @@
 'use client';
+
+import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { getTranslation } from '@payloadcms/translations';
 import { useConfig } from '@payloadcms/ui';
@@ -9,97 +11,125 @@ import Label from '../../Label/index.js';
 import { diffStyles } from '../styles.js';
 const ReactDiffViewer = ReactDiffViewerImport.default || ReactDiffViewerImport;
 const baseClass = 'relationship-diff';
-const generateLabelFromValue = (collections, field, locale, value)=>{
-    if (Array.isArray(value)) {
-        return value.map((v)=>generateLabelFromValue(collections, field, locale, v)).filter(Boolean) // Filters out any undefined or empty values
-        .join(', ');
-    }
-    let relatedDoc;
-    let valueToReturn = '';
-    const relationTo = 'relationTo' in field.fieldComponentProps ? field.fieldComponentProps.relationTo : undefined;
-    if (value === null || typeof value === 'undefined') {
-        return String(value);
+const generateLabelFromValue = (collections, field, locale, value) => {
+  if (Array.isArray(value)) {
+    return value.map(v => generateLabelFromValue(collections, field, locale, v)).filter(Boolean) // Filters out any undefined or empty values
+    .join(', ');
+  }
+  let relatedDoc;
+  let valueToReturn = '';
+  const relationTo = 'relationTo' in field ? field.relationTo : undefined;
+  if (value === null || typeof value === 'undefined') {
+    return String(value);
+  }
+  if (typeof value === 'object' && 'relationTo' in value) {
+    relatedDoc = value.value;
+  } else {
+    // Non-polymorphic relationship
+    relatedDoc = value;
+  }
+  const relatedCollection = relationTo ? collections.find(c => c.slug === (typeof value === 'object' && 'relationTo' in value ? value.relationTo : relationTo)) : null;
+  if (relatedCollection) {
+    const useAsTitle = relatedCollection?.admin?.useAsTitle;
+    const useAsTitleField = relatedCollection.fields.find(f => fieldAffectsData(f) && !fieldIsPresentationalOnly(f) && f.name === useAsTitle);
+    let titleFieldIsLocalized = false;
+    if (useAsTitleField && fieldAffectsData(useAsTitleField)) {
+      titleFieldIsLocalized = useAsTitleField.localized;
     }
-    if (typeof value === 'object' && 'relationTo' in value) {
-        relatedDoc = value.value;
+    if (typeof relatedDoc?.[useAsTitle] !== 'undefined') {
+      valueToReturn = relatedDoc[useAsTitle];
+    } else if (typeof relatedDoc?.id !== 'undefined') {
+      valueToReturn = relatedDoc.id;
     } else {
-        // Non-polymorphic relationship
-        relatedDoc = value;
+      valueToReturn = relatedDoc;
     }
-    const relatedCollection = relationTo ? collections.find((c)=>c.slug === (typeof value === 'object' && 'relationTo' in value ? value.relationTo : relationTo)) : null;
-    if (relatedCollection) {
-        const useAsTitle = relatedCollection?.admin?.useAsTitle;
-        const useAsTitleField = relatedCollection.fields.find((f)=>fieldAffectsData(f) && !fieldIsPresentationalOnly(f) && f.name === useAsTitle);
-        let titleFieldIsLocalized = false;
-        if (useAsTitleField && fieldAffectsData(useAsTitleField)) {
-            titleFieldIsLocalized = useAsTitleField.localized;
-        }
-        if (typeof relatedDoc?.[useAsTitle] !== 'undefined') {
-            valueToReturn = relatedDoc[useAsTitle];
-        } else if (typeof relatedDoc?.id !== 'undefined') {
-            valueToReturn = relatedDoc.id;
-        } else {
-            valueToReturn = relatedDoc;
-        }
-        if (typeof valueToReturn === 'object' && titleFieldIsLocalized) {
-            valueToReturn = valueToReturn[locale];
-        }
-    } else if (relatedDoc) {
-        // Handle non-polymorphic `hasMany` relationships or fallback
-        if (typeof relatedDoc?.id !== 'undefined') {
-            valueToReturn = relatedDoc.id;
-        } else {
-            valueToReturn = relatedDoc;
-        }
+    if (typeof valueToReturn === 'object' && titleFieldIsLocalized) {
+      valueToReturn = valueToReturn[locale];
     }
-    if (typeof valueToReturn === 'object' && valueToReturn !== null) {
-        valueToReturn = JSON.stringify(valueToReturn);
+  } else if (relatedDoc) {
+    // Handle non-polymorphic `hasMany` relationships or fallback
+    if (typeof relatedDoc?.id !== 'undefined') {
+      valueToReturn = relatedDoc.id;
+    } else {
+      valueToReturn = relatedDoc;
     }
-    return valueToReturn;
+  }
+  if (typeof valueToReturn === 'object' && valueToReturn !== null) {
+    valueToReturn = JSON.stringify(valueToReturn);
+  }
+  return valueToReturn;
 };
-const Relationship = ({ comparison, field, i18n, locale, version })=>{
-    const placeholder = `[${i18n.t('general:noValue')}]`;
-    const { collections } = useConfig();
+const Relationship = t0 => {
+  const $ = _c(10);
+  const {
+    comparison,
+    field,
+    i18n,
+    locale,
+    version
+  } = t0;
+  const placeholder = `[${i18n.t("general:noValue")}]`;
+  const {
+    config: t1
+  } = useConfig();
+  const {
+    collections
+  } = t1;
+  let t2;
+  if ($[0] !== placeholder || $[1] !== version || $[2] !== field || $[3] !== collections || $[4] !== locale || $[5] !== comparison || $[6] !== i18n) {
     let versionToRender = placeholder;
     let comparisonToRender = placeholder;
     if (version) {
-        if ('hasMany' in field && field.hasMany && Array.isArray(version)) {
-            versionToRender = version.map((val)=>generateLabelFromValue(collections, field, locale, val)).join(', ') || placeholder;
-        } else {
-            versionToRender = generateLabelFromValue(collections, field, locale, version) || placeholder;
-        }
+      if ("hasMany" in field && field.hasMany && Array.isArray(version)) {
+        versionToRender = version.map(val => generateLabelFromValue(collections, field, locale, val)).join(", ") || placeholder;
+      } else {
+        versionToRender = generateLabelFromValue(collections, field, locale, version) || placeholder;
+      }
     }
     if (comparison) {
-        if ('hasMany' in field && field.hasMany && Array.isArray(comparison)) {
-            comparisonToRender = comparison.map((val)=>generateLabelFromValue(collections, field, locale, val)).join(', ') || placeholder;
-        } else {
-            comparisonToRender = generateLabelFromValue(collections, field, locale, comparison) || placeholder;
-        }
+      if ("hasMany" in field && field.hasMany && Array.isArray(comparison)) {
+        comparisonToRender = comparison.map(val_0 => generateLabelFromValue(collections, field, locale, val_0)).join(", ") || placeholder;
+      } else {
+        comparisonToRender = generateLabelFromValue(collections, field, locale, comparison) || placeholder;
+      }
     }
-    const label = 'label' in field.fieldComponentProps && typeof field.fieldComponentProps.label !== 'boolean' && typeof field.fieldComponentProps.label !== 'function' ? field.fieldComponentProps.label : '';
-    return /*#__PURE__*/ _jsxs("div", {
-        className: baseClass,
-        children: [
-            /*#__PURE__*/ _jsxs(Label, {
-                children: [
-                    locale && /*#__PURE__*/ _jsx("span", {
-                        className: `${baseClass}__locale-label`,
-                        children: locale
-                    }),
-                    getTranslation(label, i18n)
-                ]
-            }),
-            /*#__PURE__*/ _jsx(ReactDiffViewer, {
-                hideLineNumbers: true,
-                newValue: versionToRender,
-                oldValue: comparisonToRender,
-                showDiffOnly: false,
-                splitView: true,
-                styles: diffStyles
-            })
-        ]
+    const label = "label" in field && typeof field.label !== "boolean" && typeof field.label !== "function" ? field.label : "";
+    let t3;
+    if ($[8] !== locale) {
+      t3 = locale && _jsx("span", {
+        className: `${baseClass}__locale-label`,
+        children: locale
+      });
+      $[8] = locale;
+      $[9] = t3;
+    } else {
+      t3 = $[9];
+    }
+    t2 = _jsxs("div", {
+      className: baseClass,
+      children: [_jsxs(Label, {
+        children: [t3, getTranslation(label, i18n)]
+      }), _jsx(ReactDiffViewer, {
+        hideLineNumbers: true,
+        newValue: versionToRender,
+        oldValue: comparisonToRender,
+        showDiffOnly: false,
+        splitView: true,
+        styles: diffStyles
+      })]
     });
+    $[0] = placeholder;
+    $[1] = version;
+    $[2] = field;
+    $[3] = collections;
+    $[4] = locale;
+    $[5] = comparison;
+    $[6] = i18n;
+    $[7] = t2;
+  } else {
+    t2 = $[7];
+  }
+  return t2;
 };
 export default Relationship;
-
 //# sourceMappingURL=index.js.map

package/dist/views/Version/RenderFieldsToDiff/fields/Relationship/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../src/views/Version/RenderFieldsToDiff/fields/Relationship/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientCollectionConfig, MappedField } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { useConfig } from '@payloadcms/ui'\nimport { fieldAffectsData, fieldIsPresentationalOnly } from 'payload/shared'\nimport React from 'react'\nimport ReactDiffViewerImport from 'react-diff-viewer-continued'\n\nimport type { Props } from '../types.js'\n\nimport Label from '../../Label/index.js'\nimport { diffStyles } from '../styles.js'\nimport './index.scss'\n\nconst ReactDiffViewer = (ReactDiffViewerImport.default ||\n  ReactDiffViewerImport) as unknown as typeof ReactDiffViewerImport.default\n\nconst baseClass = 'relationship-diff'\n\ntype RelationshipValue = Record<string, any>\n\nconst generateLabelFromValue = (\n  collections: ClientCollectionConfig[],\n  field: MappedField,\n  locale: string,\n  value: { relationTo: string; value: RelationshipValue } | RelationshipValue,\n): string => {\n  if (Array.isArray(value)) {\n    return value\n      .map((v) => generateLabelFromValue(collections, field, locale, v))\n      .filter(Boolean) // Filters out any undefined or empty values\n      .join(', ')\n  }\n\n  let relatedDoc: RelationshipValue\n  let valueToReturn = '' as any\n\n  const relationTo =\n    'relationTo' in field.fieldComponentProps ? field.fieldComponentProps.relationTo : undefined\n\n  if (value === null || typeof value === 'undefined') {\n    return String(value)\n  }\n\n  if (typeof value === 'object' && 'relationTo' in value) {\n    relatedDoc = value.value\n  } else {\n    // Non-polymorphic relationship\n    relatedDoc = value\n  }\n\n  const relatedCollection = relationTo\n    ? collections.find(\n        (c) =>\n          c.slug ===\n          (typeof value === 'object' && 'relationTo' in value ? value.relationTo : relationTo),\n      )\n    : null\n\n  if (relatedCollection) {\n    const useAsTitle = relatedCollection?.admin?.useAsTitle\n    const useAsTitleField = relatedCollection.fields.find(\n      (f) => fieldAffectsData(f) && !fieldIsPresentationalOnly(f) && f.name === useAsTitle,\n    )\n    let titleFieldIsLocalized = false\n\n    if (useAsTitleField && fieldAffectsData(useAsTitleField)) {\n      titleFieldIsLocalized = useAsTitleField.localized\n    }\n\n    if (typeof relatedDoc?.[useAsTitle] !== 'undefined') {\n      valueToReturn = relatedDoc[useAsTitle]\n    } else if (typeof relatedDoc?.id !== 'undefined') {\n      valueToReturn = relatedDoc.id\n    } else {\n      valueToReturn = relatedDoc\n    }\n\n    if (typeof valueToReturn === 'object' && titleFieldIsLocalized) {\n      valueToReturn = valueToReturn[locale]\n    }\n  } else if (relatedDoc) {\n    // Handle non-polymorphic `hasMany` relationships or fallback\n    if (typeof relatedDoc?.id !== 'undefined') {\n      valueToReturn = relatedDoc.id\n    } else {\n      valueToReturn = relatedDoc\n    }\n  }\n\n  if (typeof valueToReturn === 'object' && valueToReturn !== null) {\n    valueToReturn = JSON.stringify(valueToReturn)\n  }\n\n  return valueToReturn\n}\n\nconst Relationship: React.FC<Props> = ({ comparison, field, i18n, locale, version }) => {\n  const placeholder = `[${i18n.t('general:noValue')}]`\n\n  const { collections } = useConfig()\n\n  let versionToRender: string | undefined = placeholder\n  let comparisonToRender: string | undefined = placeholder\n\n  if (version) {\n    if ('hasMany' in field && field.hasMany && Array.isArray(version)) {\n      versionToRender =\n        version.map((val) => generateLabelFromValue(collections, field, locale, val)).join(', ') ||\n        placeholder\n    } else {\n      versionToRender = generateLabelFromValue(collections, field, locale, version) || placeholder\n    }\n  }\n\n  if (comparison) {\n    if ('hasMany' in field && field.hasMany && Array.isArray(comparison)) {\n      comparisonToRender =\n        comparison\n          .map((val) => generateLabelFromValue(collections, field, locale, val))\n          .join(', ') || placeholder\n    } else {\n      comparisonToRender =\n        generateLabelFromValue(collections, field, locale, comparison) || placeholder\n    }\n  }\n\n  const label =\n    'label' in field.fieldComponentProps &&\n    typeof field.fieldComponentProps.label !== 'boolean' &&\n    typeof field.fieldComponentProps.label !== 'function'\n      ? field.fieldComponentProps.label\n      : ''\n\n  return (\n    <div className={baseClass}>\n      <Label>\n        {locale && <span className={`${baseClass}__locale-label`}>{locale}</span>}\n        {getTranslation(label, i18n)}\n      </Label>\n      <ReactDiffViewer\n        hideLineNumbers\n        newValue={versionToRender}\n        oldValue={comparisonToRender}\n        showDiffOnly={false}\n        splitView\n        styles={diffStyles}\n      />\n    </div>\n  )\n}\n\nexport default Relationship\n"],"names":["getTranslation","useConfig","fieldAffectsData","fieldIsPresentationalOnly","React","ReactDiffViewerImport","Label","diffStyles","ReactDiffViewer","default","baseClass","generateLabelFromValue","collections","field","locale","value","Array","isArray","map","v","filter","Boolean","join","relatedDoc","valueToReturn","relationTo","fieldComponentProps","undefined","String","relatedCollection","find","c","slug","useAsTitle","admin","useAsTitleField","fields","f","name","titleFieldIsLocalized","localized","id","JSON","stringify","Relationship","comparison","i18n","version","placeholder","t","versionToRender","comparisonToRender","hasMany","val","label","div","className","span","hideLineNumbers","newValue","oldValue","showDiffOnly","splitView","styles"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["c","_c","getTranslation","useConfig","fieldAffectsData","fieldIsPresentationalOnly","React","ReactDiffViewerImport","Label","diffStyles","ReactDiffViewer","default","baseClass","generateLabelFromValue","collections","field","locale","value","Array","isArray","map","v","filter","Boolean","join","relatedDoc","valueToReturn","relationTo","undefined","String","relatedCollection","find","slug","useAsTitle","admin","useAsTitleField","fields","f","name","titleFieldIsLocalized","localized","id","JSON","stringify","Relationship","t0","$","comparison","i18n","version","placeholder","t","config","t1","t2","versionToRender","comparisonToRender","hasMany","val","val_0","label","t3","_jsx","className","children","_jsxs","hideLineNumbers","newValue","oldValue","showDiffOnly","splitView","styles"],"sources":["../../../../../../src/views/Version/RenderFieldsToDiff/fields/Relationship/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientCollectionConfig, ClientField, RelationshipFieldClient } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { useConfig } from '@payloadcms/ui'\nimport { fieldAffectsData, fieldIsPresentationalOnly } from 'payload/shared'\nimport React from 'react'\nimport ReactDiffViewerImport from 'react-diff-viewer-continued'\n\nimport type { DiffComponentProps } from '../types.js'\n\nimport Label from '../../Label/index.js'\nimport { diffStyles } from '../styles.js'\nimport './index.scss'\n\nconst ReactDiffViewer = (ReactDiffViewerImport.default ||\n  ReactDiffViewerImport) as unknown as typeof ReactDiffViewerImport.default\n\nconst baseClass = 'relationship-diff'\n\ntype RelationshipValue = Record<string, any>\n\nconst generateLabelFromValue = (\n  collections: ClientCollectionConfig[],\n  field: ClientField,\n  locale: string,\n  value: { relationTo: string; value: RelationshipValue } | RelationshipValue,\n): string => {\n  if (Array.isArray(value)) {\n    return value\n      .map((v) => generateLabelFromValue(collections, field, locale, v))\n      .filter(Boolean) // Filters out any undefined or empty values\n      .join(', ')\n  }\n\n  let relatedDoc: RelationshipValue\n  let valueToReturn = '' as any\n\n  const relationTo = 'relationTo' in field ? field.relationTo : undefined\n\n  if (value === null || typeof value === 'undefined') {\n    return String(value)\n  }\n\n  if (typeof value === 'object' && 'relationTo' in value) {\n    relatedDoc = value.value\n  } else {\n    // Non-polymorphic relationship\n    relatedDoc = value\n  }\n\n  const relatedCollection = relationTo\n    ? collections.find(\n        (c) =>\n          c.slug ===\n          (typeof value === 'object' && 'relationTo' in value ? value.relationTo : relationTo),\n      )\n    : null\n\n  if (relatedCollection) {\n    const useAsTitle = relatedCollection?.admin?.useAsTitle\n    const useAsTitleField = relatedCollection.fields.find(\n      (f) => fieldAffectsData(f) && !fieldIsPresentationalOnly(f) && f.name === useAsTitle,\n    )\n    let titleFieldIsLocalized = false\n\n    if (useAsTitleField && fieldAffectsData(useAsTitleField)) {\n      titleFieldIsLocalized = useAsTitleField.localized\n    }\n\n    if (typeof relatedDoc?.[useAsTitle] !== 'undefined') {\n      valueToReturn = relatedDoc[useAsTitle]\n    } else if (typeof relatedDoc?.id !== 'undefined') {\n      valueToReturn = relatedDoc.id\n    } else {\n      valueToReturn = relatedDoc\n    }\n\n    if (typeof valueToReturn === 'object' && titleFieldIsLocalized) {\n      valueToReturn = valueToReturn[locale]\n    }\n  } else if (relatedDoc) {\n    // Handle non-polymorphic `hasMany` relationships or fallback\n    if (typeof relatedDoc?.id !== 'undefined') {\n      valueToReturn = relatedDoc.id\n    } else {\n      valueToReturn = relatedDoc\n    }\n  }\n\n  if (typeof valueToReturn === 'object' && valueToReturn !== null) {\n    valueToReturn = JSON.stringify(valueToReturn)\n  }\n\n  return valueToReturn\n}\n\nconst Relationship: React.FC<DiffComponentProps<RelationshipFieldClient>> = ({\n  comparison,\n  field,\n  i18n,\n  locale,\n  version,\n}) => {\n  const placeholder = `[${i18n.t('general:noValue')}]`\n\n  const {\n    config: { collections },\n  } = useConfig()\n\n  let versionToRender: string | undefined = placeholder\n  let comparisonToRender: string | undefined = placeholder\n\n  if (version) {\n    if ('hasMany' in field && field.hasMany && Array.isArray(version)) {\n      versionToRender =\n        version.map((val) => generateLabelFromValue(collections, field, locale, val)).join(', ') ||\n        placeholder\n    } else {\n      versionToRender = generateLabelFromValue(collections, field, locale, version) || placeholder\n    }\n  }\n\n  if (comparison) {\n    if ('hasMany' in field && field.hasMany && Array.isArray(comparison)) {\n      comparisonToRender =\n        comparison\n          .map((val) => generateLabelFromValue(collections, field, locale, val))\n          .join(', ') || placeholder\n    } else {\n      comparisonToRender =\n        generateLabelFromValue(collections, field, locale, comparison) || placeholder\n    }\n  }\n\n  const label =\n    'label' in field && typeof field.label !== 'boolean' && typeof field.label !== 'function'\n      ? field.label\n      : ''\n\n  return (\n    <div className={baseClass}>\n      <Label>\n        {locale && <span className={`${baseClass}__locale-label`}>{locale}</span>}\n        {getTranslation(label, i18n)}\n      </Label>\n      <ReactDiffViewer\n        hideLineNumbers\n        newValue={versionToRender}\n        oldValue={comparisonToRender}\n        showDiffOnly={false}\n        splitView\n        styles={diffStyles}\n      />\n    </div>\n  )\n}\n\nexport default Relationship\n"],"mappings":"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","ignoreList":[]}

package/dist/views/Version/RenderFieldsToDiff/fields/Relationship/index.scss

@@ -1,13 +1,15 @@
-.relationship-diff {
-  &__locale-label {
-    [dir='ltr'] & {
-      margin-right: calc(var(--base) * 0.25);
+@layer payload-default {
+  .relationship-diff {
+    &__locale-label {
+      [dir='ltr'] & {
+        margin-right: calc(var(--base) * 0.25);
+      }
+      [dir='rtl'] & {
+        margin-left: calc(var(--base) * 0.25);
+      }
+      background: var(--theme-elevation-100);
+      padding: calc(var(--base) * 0.25);
+      // border-radius: $style-radius-m;
     }
-    [dir='rtl'] & {
-      margin-left: calc(var(--base) * 0.25);
-    }
-    background: var(--theme-elevation-100);
-    padding: calc(var(--base) * 0.25);
-    // border-radius: $style-radius-m;
   }
 }

package/dist/views/Version/RenderFieldsToDiff/fields/Select/DiffViewer/index.js

@@ -1,18 +1,24 @@
 'use client';
+
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 import ReactDiffViewerImport, { DiffMethod } from 'react-diff-viewer-continued';
 const ReactDiffViewer = ReactDiffViewerImport.default || ReactDiffViewerImport;
-export const DiffViewer = ({ comparisonToRender, diffMethod, diffStyles, placeholder, versionToRender })=>{
-    return /*#__PURE__*/ _jsx(ReactDiffViewer, {
-        compareMethod: DiffMethod[diffMethod],
-        hideLineNumbers: true,
-        newValue: typeof versionToRender !== 'undefined' ? versionToRender : placeholder,
-        oldValue: comparisonToRender,
-        showDiffOnly: false,
-        splitView: true,
-        styles: diffStyles
-    });
+export const DiffViewer = ({
+  comparisonToRender,
+  diffMethod,
+  diffStyles,
+  placeholder,
+  versionToRender
+}) => {
+  return /*#__PURE__*/_jsx(ReactDiffViewer, {
+    compareMethod: DiffMethod[diffMethod],
+    hideLineNumbers: true,
+    newValue: typeof versionToRender !== 'undefined' ? versionToRender : placeholder,
+    oldValue: comparisonToRender,
+    showDiffOnly: false,
+    splitView: true,
+    styles: diffStyles
+  });
 };
-
 //# sourceMappingURL=index.js.map

package/dist/views/Version/RenderFieldsToDiff/fields/Select/DiffViewer/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../../src/views/Version/RenderFieldsToDiff/fields/Select/DiffViewer/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\nimport ReactDiffViewerImport, { DiffMethod } from 'react-diff-viewer-continued'\n\nconst ReactDiffViewer = (ReactDiffViewerImport.default ||\n  ReactDiffViewerImport) as unknown as typeof ReactDiffViewerImport.default\n\nexport const DiffViewer: React.FC<{\n  comparisonToRender: string\n  diffMethod: string\n  diffStyles: any\n  placeholder: string\n  versionToRender: string\n}> = ({ comparisonToRender, diffMethod, diffStyles, placeholder, versionToRender }) => {\n  return (\n    <ReactDiffViewer\n      compareMethod={DiffMethod[diffMethod]}\n      hideLineNumbers\n      newValue={typeof versionToRender !== 'undefined' ? versionToRender : placeholder}\n      oldValue={comparisonToRender}\n      showDiffOnly={false}\n      splitView\n      styles={diffStyles}\n    />\n  )\n}\n"],"names":["React","ReactDiffViewerImport","DiffMethod","ReactDiffViewer","default","DiffViewer","comparisonToRender","diffMethod","diffStyles","placeholder","versionToRender","compareMethod","hideLineNumbers","newValue","oldValue","showDiffOnly","splitView","styles"],"mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AACzB,OAAOC,yBAAyBC,UAAU,QAAQ,8BAA6B;AAE/E,MAAMC,kBAAmBF,sBAAsBG,OAAO,IACpDH;AAEF,OAAO,MAAMI,aAMR,CAAC,EAAEC,kBAAkB,EAAEC,UAAU,EAAEC,UAAU,EAAEC,WAAW,EAAEC,eAAe,EAAE;IAChF,qBACE,KAACP;QACCQ,eAAeT,UAAU,CAACK,WAAW;QACrCK,eAAe;QACfC,UAAU,OAAOH,oBAAoB,cAAcA,kBAAkBD;QACrEK,UAAUR;QACVS,cAAc;QACdC,SAAS;QACTC,QAAQT;;AAGd,EAAC"}
+{"version":3,"file":"index.js","names":["React","ReactDiffViewerImport","DiffMethod","ReactDiffViewer","default","DiffViewer","comparisonToRender","diffMethod","diffStyles","placeholder","versionToRender","_jsx","compareMethod","hideLineNumbers","newValue","oldValue","showDiffOnly","splitView","styles"],"sources":["../../../../../../../src/views/Version/RenderFieldsToDiff/fields/Select/DiffViewer/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\nimport ReactDiffViewerImport, { DiffMethod } from 'react-diff-viewer-continued'\n\nconst ReactDiffViewer = (ReactDiffViewerImport.default ||\n  ReactDiffViewerImport) as unknown as typeof ReactDiffViewerImport.default\n\nexport const DiffViewer: React.FC<{\n  comparisonToRender: string\n  diffMethod: string\n  diffStyles: any\n  placeholder: string\n  versionToRender: string\n}> = ({ comparisonToRender, diffMethod, diffStyles, placeholder, versionToRender }) => {\n  return (\n    <ReactDiffViewer\n      compareMethod={DiffMethod[diffMethod]}\n      hideLineNumbers\n      newValue={typeof versionToRender !== 'undefined' ? versionToRender : placeholder}\n      oldValue={comparisonToRender}\n      showDiffOnly={false}\n      splitView\n      styles={diffStyles}\n    />\n  )\n}\n"],"mappings":"AAAA;;;AACA,OAAOA,KAAA,MAAW;AAClB,OAAOC,qBAAA,IAAyBC,UAAU,QAAQ;AAElD,MAAMC,eAAA,GAAmBF,qBAAA,CAAsBG,OAAO,IACpDH,qBAAA;AAEF,OAAO,MAAMI,UAAA,GAMRA,CAAC;EAAEC,kBAAkB;EAAEC,UAAU;EAAEC,UAAU;EAAEC,WAAW;EAAEC;AAAe,CAAE;EAChF,oBACEC,IAAA,CAACR,eAAA;IACCS,aAAA,EAAeV,UAAU,CAACK,UAAA,CAAW;IACrCM,eAAe;IACfC,QAAA,EAAU,OAAOJ,eAAA,KAAoB,cAAcA,eAAA,GAAkBD,WAAA;IACrEM,QAAA,EAAUT,kBAAA;IACVU,YAAA,EAAc;IACdC,SAAS;IACTC,MAAA,EAAQV;;AAGd","ignoreList":[]}

package/dist/views/Version/RenderFieldsToDiff/fields/Select/index.d.ts

@@ -1,9 +1,7 @@
-import type { MappedField, SelectFieldProps } from 'payload';
+import type { SelectFieldClient } from 'payload';
 import React from 'react';
-import type { Props } from '../types.js';
+import type { DiffComponentProps } from '../types.js';
 import './index.scss';
-declare const Select: React.FC<{
-    field: MappedField & SelectFieldProps;
-} & Omit<Props, 'field'>>;
+declare const Select: React.FC<DiffComponentProps<SelectFieldClient>>;
 export default Select;
 //# sourceMappingURL=index.d.ts.map

package/dist/views/Version/RenderFieldsToDiff/fields/Select/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/views/Version/RenderFieldsToDiff/fields/Select/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAA6B,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAGvF,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,aAAa,CAAA;AAKxC,OAAO,cAAc,CAAA;AAmCrB,QAAA,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CACpB;IACE,KAAK,EAAE,WAAW,GAAG,gBAAgB,CAAA;CACtC,GAAG,IAAI,CAAC,KAAK,EAAE,OAAO,CAAC,CAiCzB,CAAA;AAED,eAAe,MAAM,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/views/Version/RenderFieldsToDiff/fields/Select/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAA6B,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAG3E,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAA;AAKrD,OAAO,cAAc,CAAA;AAmCrB,QAAA,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAAC,iBAAiB,CAAC,CAyC3D,CAAA;AAED,eAAe,MAAM,CAAA"}

package/dist/views/Version/RenderFieldsToDiff/fields/Select/index.js

@@ -1,3 +1,5 @@
+'use client';
+
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { getTranslation } from '@payloadcms/translations';
 import React from 'react';
@@ -5,46 +7,48 @@ import Label from '../../Label/index.js';
 import { diffStyles } from '../styles.js';
 import { DiffViewer } from './DiffViewer/index.js';
 const baseClass = 'select-diff';
-const getOptionsToRender = (value, options, hasMany)=>{
-    if (hasMany && Array.isArray(value)) {
-        return value.map((val)=>options.find((option)=>(typeof option === 'string' ? option : option.value) === val) || String(val));
-    }
-    return options.find((option)=>(typeof option === 'string' ? option : option.value) === value) || String(value);
+const getOptionsToRender = (value, options, hasMany) => {
+  if (hasMany && Array.isArray(value)) {
+    return value.map(val => options.find(option => (typeof option === 'string' ? option : option.value) === val) || String(val));
+  }
+  return options.find(option => (typeof option === 'string' ? option : option.value) === value) || String(value);
 };
-const getTranslatedOptions = (options, i18n)=>{
-    if (Array.isArray(options)) {
-        return options.map((option)=>typeof option === 'string' ? option : getTranslation(option.label, i18n)).join(', ');
-    }
-    return typeof options === 'string' ? options : getTranslation(options.label, i18n);
+const getTranslatedOptions = (options, i18n) => {
+  if (Array.isArray(options)) {
+    return options.map(option => typeof option === 'string' ? option : getTranslation(option.label, i18n)).join(', ');
+  }
+  return typeof options === 'string' ? options : getTranslation(options.label, i18n);
 };
-const Select = ({ comparison, diffMethod, field, i18n, locale, version })=>{
-    let placeholder = '';
-    if (version === comparison) placeholder = `[${i18n.t('general:noValue')}]`;
-    const options = 'options' in field.fieldComponentProps && field.fieldComponentProps.options;
-    const comparisonToRender = typeof comparison !== 'undefined' ? getTranslatedOptions(getOptionsToRender(comparison, options, field.hasMany), i18n) : placeholder;
-    const versionToRender = typeof version !== 'undefined' ? getTranslatedOptions(getOptionsToRender(version, options, field.hasMany), i18n) : placeholder;
-    return /*#__PURE__*/ _jsxs("div", {
-        className: baseClass,
-        children: [
-            /*#__PURE__*/ _jsxs(Label, {
-                children: [
-                    locale && /*#__PURE__*/ _jsx("span", {
-                        className: `${baseClass}__locale-label`,
-                        children: locale
-                    }),
-                    'label' in field && getTranslation(field.label || '', i18n)
-                ]
-            }),
-            /*#__PURE__*/ _jsx(DiffViewer, {
-                comparisonToRender: comparisonToRender,
-                diffMethod: diffMethod,
-                diffStyles: diffStyles,
-                placeholder: placeholder,
-                versionToRender: versionToRender
-            })
-        ]
-    });
+const Select = ({
+  comparison,
+  diffMethod,
+  field,
+  i18n,
+  locale,
+  version
+}) => {
+  let placeholder = '';
+  if (version === comparison) {
+    placeholder = `[${i18n.t('general:noValue')}]`;
+  }
+  const options = 'options' in field && field.options;
+  const comparisonToRender = typeof comparison !== 'undefined' ? getTranslatedOptions(getOptionsToRender(comparison, options, field.hasMany), i18n) : placeholder;
+  const versionToRender = typeof version !== 'undefined' ? getTranslatedOptions(getOptionsToRender(version, options, field.hasMany), i18n) : placeholder;
+  return /*#__PURE__*/_jsxs("div", {
+    className: baseClass,
+    children: [/*#__PURE__*/_jsxs(Label, {
+      children: [locale && /*#__PURE__*/_jsx("span", {
+        className: `${baseClass}__locale-label`,
+        children: locale
+      }), 'label' in field && getTranslation(field.label || '', i18n)]
+    }), /*#__PURE__*/_jsx(DiffViewer, {
+      comparisonToRender: comparisonToRender,
+      diffMethod: diffMethod,
+      diffStyles: diffStyles,
+      placeholder: placeholder,
+      versionToRender: versionToRender
+    })]
+  });
 };
 export default Select;
-
 //# sourceMappingURL=index.js.map

package/dist/views/Version/RenderFieldsToDiff/fields/Select/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../src/views/Version/RenderFieldsToDiff/fields/Select/index.tsx"],"sourcesContent":["import type { I18nClient } from '@payloadcms/translations'\nimport type { MappedField, OptionObject, SelectField, SelectFieldProps } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport type { Props } from '../types.js'\n\nimport Label from '../../Label/index.js'\nimport { diffStyles } from '../styles.js'\nimport { DiffViewer } from './DiffViewer/index.js'\nimport './index.scss'\n\nconst baseClass = 'select-diff'\n\nconst getOptionsToRender = (\n  value: string,\n  options: SelectField['options'],\n  hasMany: boolean,\n): (OptionObject | string)[] | OptionObject | string => {\n  if (hasMany && Array.isArray(value)) {\n    return value.map(\n      (val) =>\n        options.find((option) => (typeof option === 'string' ? option : option.value) === val) ||\n        String(val),\n    )\n  }\n  return (\n    options.find((option) => (typeof option === 'string' ? option : option.value) === value) ||\n    String(value)\n  )\n}\n\nconst getTranslatedOptions = (\n  options: (OptionObject | string)[] | OptionObject | string,\n  i18n: I18nClient,\n): string => {\n  if (Array.isArray(options)) {\n    return options\n      .map((option) => (typeof option === 'string' ? option : getTranslation(option.label, i18n)))\n      .join(', ')\n  }\n\n  return typeof options === 'string' ? options : getTranslation(options.label, i18n)\n}\n\nconst Select: React.FC<\n  {\n    field: MappedField & SelectFieldProps\n  } & Omit<Props, 'field'>\n> = ({ comparison, diffMethod, field, i18n, locale, version }) => {\n  let placeholder = ''\n\n  if (version === comparison) placeholder = `[${i18n.t('general:noValue')}]`\n\n  const options = 'options' in field.fieldComponentProps && field.fieldComponentProps.options\n\n  const comparisonToRender =\n    typeof comparison !== 'undefined'\n      ? getTranslatedOptions(getOptionsToRender(comparison, options, field.hasMany), i18n)\n      : placeholder\n\n  const versionToRender =\n    typeof version !== 'undefined'\n      ? getTranslatedOptions(getOptionsToRender(version, options, field.hasMany), i18n)\n      : placeholder\n\n  return (\n    <div className={baseClass}>\n      <Label>\n        {locale && <span className={`${baseClass}__locale-label`}>{locale}</span>}\n        {'label' in field && getTranslation(field.label || '', i18n)}\n      </Label>\n      <DiffViewer\n        comparisonToRender={comparisonToRender}\n        diffMethod={diffMethod}\n        diffStyles={diffStyles}\n        placeholder={placeholder}\n        versionToRender={versionToRender}\n      />\n    </div>\n  )\n}\n\nexport default Select\n"],"names":["getTranslation","React","Label","diffStyles","DiffViewer","baseClass","getOptionsToRender","value","options","hasMany","Array","isArray","map","val","find","option","String","getTranslatedOptions","i18n","label","join","Select","comparison","diffMethod","field","locale","version","placeholder","t","fieldComponentProps","comparisonToRender","versionToRender","div","className","span"],"mappings":";AAGA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,OAAOC,WAAW,QAAO;AAIzB,OAAOC,WAAW,uBAAsB;AACxC,SAASC,UAAU,QAAQ,eAAc;AACzC,SAASC,UAAU,QAAQ,wBAAuB;AAGlD,MAAMC,YAAY;AAElB,MAAMC,qBAAqB,CACzBC,OACAC,SACAC;IAEA,IAAIA,WAAWC,MAAMC,OAAO,CAACJ,QAAQ;QACnC,OAAOA,MAAMK,GAAG,CACd,CAACC,MACCL,QAAQM,IAAI,CAAC,CAACC,SAAW,AAAC,CAAA,OAAOA,WAAW,WAAWA,SAASA,OAAOR,KAAK,AAAD,MAAOM,QAClFG,OAAOH;IAEb;IACA,OACEL,QAAQM,IAAI,CAAC,CAACC,SAAW,AAAC,CAAA,OAAOA,WAAW,WAAWA,SAASA,OAAOR,KAAK,AAAD,MAAOA,UAClFS,OAAOT;AAEX;AAEA,MAAMU,uBAAuB,CAC3BT,SACAU;IAEA,IAAIR,MAAMC,OAAO,CAACH,UAAU;QAC1B,OAAOA,QACJI,GAAG,CAAC,CAACG,SAAY,OAAOA,WAAW,WAAWA,SAASf,eAAee,OAAOI,KAAK,EAAED,OACpFE,IAAI,CAAC;IACV;IAEA,OAAO,OAAOZ,YAAY,WAAWA,UAAUR,eAAeQ,QAAQW,KAAK,EAAED;AAC/E;AAEA,MAAMG,SAIF,CAAC,EAAEC,UAAU,EAAEC,UAAU,EAAEC,KAAK,EAAEN,IAAI,EAAEO,MAAM,EAAEC,OAAO,EAAE;IAC3D,IAAIC,cAAc;IAElB,IAAID,YAAYJ,YAAYK,cAAc,CAAC,CAAC,EAAET,KAAKU,CAAC,CAAC,mBAAmB,CAAC,CAAC;IAE1E,MAAMpB,UAAU,aAAagB,MAAMK,mBAAmB,IAAIL,MAAMK,mBAAmB,CAACrB,OAAO;IAE3F,MAAMsB,qBACJ,OAAOR,eAAe,cAClBL,qBAAqBX,mBAAmBgB,YAAYd,SAASgB,MAAMf,OAAO,GAAGS,QAC7ES;IAEN,MAAMI,kBACJ,OAAOL,YAAY,cACfT,qBAAqBX,mBAAmBoB,SAASlB,SAASgB,MAAMf,OAAO,GAAGS,QAC1ES;IAEN,qBACE,MAACK;QAAIC,WAAW5B;;0BACd,MAACH;;oBACEuB,wBAAU,KAACS;wBAAKD,WAAW,CAAC,EAAE5B,UAAU,cAAc,CAAC;kCAAGoB;;oBAC1D,WAAWD,SAASxB,eAAewB,MAAML,KAAK,IAAI,IAAID;;;0BAEzD,KAACd;gBACC0B,oBAAoBA;gBACpBP,YAAYA;gBACZpB,YAAYA;gBACZwB,aAAaA;gBACbI,iBAAiBA;;;;AAIzB;AAEA,eAAeV,OAAM"}
+{"version":3,"file":"index.js","names":["getTranslation","React","Label","diffStyles","DiffViewer","baseClass","getOptionsToRender","value","options","hasMany","Array","isArray","map","val","find","option","String","getTranslatedOptions","i18n","label","join","Select","comparison","diffMethod","field","locale","version","placeholder","t","comparisonToRender","versionToRender","_jsxs","className","_jsx"],"sources":["../../../../../../src/views/Version/RenderFieldsToDiff/fields/Select/index.tsx"],"sourcesContent":["'use client'\nimport type { I18nClient } from '@payloadcms/translations'\nimport type { OptionObject, SelectField, SelectFieldClient } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport type { DiffComponentProps } from '../types.js'\n\nimport Label from '../../Label/index.js'\nimport { diffStyles } from '../styles.js'\nimport { DiffViewer } from './DiffViewer/index.js'\nimport './index.scss'\n\nconst baseClass = 'select-diff'\n\nconst getOptionsToRender = (\n  value: string,\n  options: SelectField['options'],\n  hasMany: boolean,\n): (OptionObject | string)[] | OptionObject | string => {\n  if (hasMany && Array.isArray(value)) {\n    return value.map(\n      (val) =>\n        options.find((option) => (typeof option === 'string' ? option : option.value) === val) ||\n        String(val),\n    )\n  }\n  return (\n    options.find((option) => (typeof option === 'string' ? option : option.value) === value) ||\n    String(value)\n  )\n}\n\nconst getTranslatedOptions = (\n  options: (OptionObject | string)[] | OptionObject | string,\n  i18n: I18nClient,\n): string => {\n  if (Array.isArray(options)) {\n    return options\n      .map((option) => (typeof option === 'string' ? option : getTranslation(option.label, i18n)))\n      .join(', ')\n  }\n\n  return typeof options === 'string' ? options : getTranslation(options.label, i18n)\n}\n\nconst Select: React.FC<DiffComponentProps<SelectFieldClient>> = ({\n  comparison,\n  diffMethod,\n  field,\n  i18n,\n  locale,\n  version,\n}) => {\n  let placeholder = ''\n\n  if (version === comparison) {\n    placeholder = `[${i18n.t('general:noValue')}]`\n  }\n\n  const options = 'options' in field && field.options\n\n  const comparisonToRender =\n    typeof comparison !== 'undefined'\n      ? getTranslatedOptions(getOptionsToRender(comparison, options, field.hasMany), i18n)\n      : placeholder\n\n  const versionToRender =\n    typeof version !== 'undefined'\n      ? getTranslatedOptions(getOptionsToRender(version, options, field.hasMany), i18n)\n      : placeholder\n\n  return (\n    <div className={baseClass}>\n      <Label>\n        {locale && <span className={`${baseClass}__locale-label`}>{locale}</span>}\n        {'label' in field && getTranslation(field.label || '', i18n)}\n      </Label>\n      <DiffViewer\n        comparisonToRender={comparisonToRender}\n        diffMethod={diffMethod}\n        diffStyles={diffStyles}\n        placeholder={placeholder}\n        versionToRender={versionToRender}\n      />\n    </div>\n  )\n}\n\nexport default Select\n"],"mappings":"AAAA;;;AAIA,SAASA,cAAc,QAAQ;AAC/B,OAAOC,KAAA,MAAW;AAIlB,OAAOC,KAAA,MAAW;AAClB,SAASC,UAAU,QAAQ;AAC3B,SAASC,UAAU,QAAQ;AAG3B,MAAMC,SAAA,GAAY;AAElB,MAAMC,kBAAA,GAAqBA,CACzBC,KAAA,EACAC,OAAA,EACAC,OAAA;EAEA,IAAIA,OAAA,IAAWC,KAAA,CAAMC,OAAO,CAACJ,KAAA,GAAQ;IACnC,OAAOA,KAAA,CAAMK,GAAG,CACbC,GAAA,IACCL,OAAA,CAAQM,IAAI,CAAEC,MAAA,IAAW,CAAC,OAAOA,MAAA,KAAW,WAAWA,MAAA,GAASA,MAAA,CAAOR,KAAK,MAAMM,GAAA,KAClFG,MAAA,CAAOH,GAAA;EAEb;EACA,OACEL,OAAA,CAAQM,IAAI,CAAEC,MAAA,IAAW,CAAC,OAAOA,MAAA,KAAW,WAAWA,MAAA,GAASA,MAAA,CAAOR,KAAK,MAAMA,KAAA,KAClFS,MAAA,CAAOT,KAAA;AAEX;AAEA,MAAMU,oBAAA,GAAuBA,CAC3BT,OAAA,EACAU,IAAA;EAEA,IAAIR,KAAA,CAAMC,OAAO,CAACH,OAAA,GAAU;IAC1B,OAAOA,OAAA,CACJI,GAAG,CAAEG,MAAA,IAAY,OAAOA,MAAA,KAAW,WAAWA,MAAA,GAASf,cAAA,CAAee,MAAA,CAAOI,KAAK,EAAED,IAAA,GACpFE,IAAI,CAAC;EACV;EAEA,OAAO,OAAOZ,OAAA,KAAY,WAAWA,OAAA,GAAUR,cAAA,CAAeQ,OAAA,CAAQW,KAAK,EAAED,IAAA;AAC/E;AAEA,MAAMG,MAAA,GAA0DA,CAAC;EAC/DC,UAAU;EACVC,UAAU;EACVC,KAAK;EACLN,IAAI;EACJO,MAAM;EACNC;AAAO,CACR;EACC,IAAIC,WAAA,GAAc;EAElB,IAAID,OAAA,KAAYJ,UAAA,EAAY;IAC1BK,WAAA,GAAc,IAAIT,IAAA,CAAKU,CAAC,CAAC,qBAAqB;EAChD;EAEA,MAAMpB,OAAA,GAAU,aAAagB,KAAA,IAASA,KAAA,CAAMhB,OAAO;EAEnD,MAAMqB,kBAAA,GACJ,OAAOP,UAAA,KAAe,cAClBL,oBAAA,CAAqBX,kBAAA,CAAmBgB,UAAA,EAAYd,OAAA,EAASgB,KAAA,CAAMf,OAAO,GAAGS,IAAA,IAC7ES,WAAA;EAEN,MAAMG,eAAA,GACJ,OAAOJ,OAAA,KAAY,cACfT,oBAAA,CAAqBX,kBAAA,CAAmBoB,OAAA,EAASlB,OAAA,EAASgB,KAAA,CAAMf,OAAO,GAAGS,IAAA,IAC1ES,WAAA;EAEN,oBACEI,KAAA,CAAC;IAAIC,SAAA,EAAW3B,SAAA;4BACd0B,KAAA,CAAC7B,KAAA;iBACEuB,MAAA,iBAAUQ,IAAA,CAAC;QAAKD,SAAA,EAAW,GAAG3B,SAAA,gBAAyB;kBAAGoB;UAC1D,WAAWD,KAAA,IAASxB,cAAA,CAAewB,KAAA,CAAML,KAAK,IAAI,IAAID,IAAA;qBAEzDe,IAAA,CAAC7B,UAAA;MACCyB,kBAAA,EAAoBA,kBAAA;MACpBN,UAAA,EAAYA,UAAA;MACZpB,UAAA,EAAYA,UAAA;MACZwB,WAAA,EAAaA,WAAA;MACbG,eAAA,EAAiBA;;;AAIzB;AAEA,eAAeT,MAAA","ignoreList":[]}

package/dist/views/Version/RenderFieldsToDiff/fields/Select/index.scss

@@ -1,13 +1,15 @@
-.select-diff {
-  &__locale-label {
-    [dir='ltr'] & {
-      margin-right: calc(var(--base) * 0.25);
+@layer payload-default {
+  .select-diff {
+    &__locale-label {
+      [dir='ltr'] & {
+        margin-right: calc(var(--base) * 0.25);
+      }
+      [dir='rtl'] & {
+        margin-left: calc(var(--base) * 0.25);
+      }
+      background: var(--theme-elevation-100);
+      padding: calc(var(--base) * 0.25);
+      // border-radius: $style-radius-m;
     }
-    [dir='rtl'] & {
-      margin-left: calc(var(--base) * 0.25);
-    }
-    background: var(--theme-elevation-100);
-    padding: calc(var(--base) * 0.25);
-    // border-radius: $style-radius-m;
   }
 }

package/dist/views/Version/RenderFieldsToDiff/fields/Tabs/index.d.ts

@@ -1,8 +1,6 @@
-import type { MappedField, TabsFieldProps } from 'payload';
+import type { TabsFieldClient } from 'payload';
 import React from 'react';
-import type { Props } from '../types.js';
-declare const Tabs: React.FC<{
-    field: MappedField & TabsFieldProps;
-} & Omit<Props, 'field'>>;
+import type { DiffComponentProps } from '../types.js';
+declare const Tabs: React.FC<DiffComponentProps<TabsFieldClient>>;
 export default Tabs;
 //# sourceMappingURL=index.d.ts.map

package/dist/views/Version/RenderFieldsToDiff/fields/Tabs/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/views/Version/RenderFieldsToDiff/fields/Tabs/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAE1D,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,aAAa,CAAA;AAOxC,QAAA,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAClB;IACE,KAAK,EAAE,WAAW,GAAG,cAAc,CAAA;CACpC,GAAG,IAAI,CAAC,KAAK,EAAE,OAAO,CAAC,CAuCzB,CAAA;AAED,eAAe,IAAI,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/views/Version/RenderFieldsToDiff/fields/Tabs/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAE9C,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAA;AAOrD,QAAA,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAAC,eAAe,CAAC,CA+CvD,CAAA;AAED,eAAe,IAAI,CAAA"}