@payloadcms/ui 4.0.0-internal.688c4d0 → 4.0.0-internal.77191e5

package/dist/fields/FieldError/index.js

@@ -4,11 +4,13 @@ import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 import { Tooltip } from '../../elements/Tooltip/index.js';
-import { useFormFields, useFormSubmitted } from '../../forms/Form/context.js';
+import { useForm, useFormFields, useFormSubmitted } from '../../forms/Form/context.js';
+import { useEditDepth } from '../../providers/EditDepth/index.js';
+import { generateFieldID } from '../../utilities/generateFieldID.js';
 import './index.css';
 const baseClass = 'field-error';
 export const FieldError = props => {
-  const $ = _c(8);
+  const $ = _c(11);
   const {
     alignCaret: t0,
     message: messageFromProps,
@@ -17,6 +19,10 @@ export const FieldError = props => {
   } = props;
   const alignCaret = t0 === undefined ? "right" : t0;
   const hasSubmitted = useFormSubmitted();
+  const {
+    uuid
+  } = useForm();
+  const editDepth = useEditDepth();
   let t1;
   if ($[0] !== path) {
     t1 = t2 => {
@@ -30,7 +36,7 @@ export const FieldError = props => {
   }
   const field = useFormFields(t1);
   let t2;
-  if ($[2] !== alignCaret || $[3] !== field || $[4] !== hasSubmitted || $[5] !== messageFromProps || $[6] !== showErrorFromProps) {
+  if ($[2] !== alignCaret || $[3] !== editDepth || $[4] !== field || $[5] !== hasSubmitted || $[6] !== messageFromProps || $[7] !== path || $[8] !== showErrorFromProps || $[9] !== uuid) {
     t2 = Symbol.for("react.early_return_sentinel");
     bb0: {
       const {
@@ -44,6 +50,7 @@ export const FieldError = props => {
           alignCaret,
           className: baseClass,
           delay: 0,
+          id: generateFieldID(path, editDepth, uuid, "field-error"),
           staticPositioning: true,
           children: message
         });
@@ -51,13 +58,16 @@ export const FieldError = props => {
       }
     }
     $[2] = alignCaret;
-    $[3] = field;
-    $[4] = hasSubmitted;
-    $[5] = messageFromProps;
-    $[6] = showErrorFromProps;
-    $[7] = t2;
+    $[3] = editDepth;
+    $[4] = field;
+    $[5] = hasSubmitted;
+    $[6] = messageFromProps;
+    $[7] = path;
+    $[8] = showErrorFromProps;
+    $[9] = uuid;
+    $[10] = t2;
   } else {
-    t2 = $[7];
+    t2 = $[10];
   }
   if (t2 !== Symbol.for("react.early_return_sentinel")) {
     return t2;

package/dist/fields/FieldError/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","Tooltip","useFormFields","useFormSubmitted","baseClass","FieldError","props","$","alignCaret","t0","message","messageFromProps","path","showError","showErrorFromProps","undefined","hasSubmitted","t1","t2","fields","field","Symbol","for","errorMessage","valid","showMessage","length","_jsx","className","delay","staticPositioning","children"],"sources":["../../../src/fields/FieldError/index.tsx"],"sourcesContent":["'use client'\n\nimport type { GenericErrorProps } from 'payload'\n\nimport React from 'react'\n\nimport { Tooltip } from '../../elements/Tooltip/index.js'\nimport { useFormFields, useFormSubmitted } from '../../forms/Form/context.js'\nimport './index.css'\n\nconst baseClass = 'field-error'\n\nexport const FieldError: React.FC<GenericErrorProps> = (props) => {\n  const {\n    alignCaret = 'right',\n    message: messageFromProps,\n    path,\n    showError: showErrorFromProps,\n  } = props\n\n  const hasSubmitted = useFormSubmitted()\n  const field = useFormFields(([fields]) => (fields && fields?.[path]) || null)\n\n  const { errorMessage, valid } = field || {}\n\n  const message = messageFromProps || errorMessage\n  const showMessage = showErrorFromProps || (hasSubmitted && valid === false)\n\n  if (showMessage && message?.length) {\n    return (\n      <Tooltip alignCaret={alignCaret} className={baseClass} delay={0} staticPositioning>\n        {message}\n      </Tooltip>\n    )\n  }\n\n  return null\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAIA,OAAOC,KAAA,MAAW;AAElB,SAASC,OAAO,QAAQ;AACxB,SAASC,aAAa,EAAEC,gBAAgB,QAAQ;AAChD,OAAO;AAEP,MAAMC,SAAA,GAAY;AAElB,OAAO,MAAMC,UAAA,GAA0CC,KAAA;EAAA,MAAAC,CAAA,GAAAR,EAAA;EACrD;IAAAS,UAAA,EAAAC,EAAA;IAAAC,OAAA,EAAAC,gBAAA;IAAAC,IAAA;IAAAC,SAAA,EAAAC;EAAA,IAKIR,KAAA;EAJF,MAAAE,UAAA,GAAAC,EAAoB,KAAAM,SAAA,GAAP,OAAO,GAApBN,EAAoB;EAMtB,MAAAO,YAAA,GAAqBb,gBAAA;EAAA,IAAAc,EAAA;EAAA,IAAAV,CAAA,QAAAK,IAAA;IACOK,EAAA,GAAAC,EAAA;MAAC,OAAAC,MAAA,IAAAD,EAAQ;MAAA,OAAKC,MAAC,IAAUA,MAAA,GAASP,IAAA,CAAK,QAAK;IAAA;IAAAL,CAAA,MAAAK,IAAA;IAAAL,CAAA,MAAAU,EAAA;EAAA;IAAAA,EAAA,GAAAV,CAAA;EAAA;EAAxE,MAAAa,KAAA,GAAclB,aAAA,CAAce,EAA4C;EAAA,IAAAC,EAAA;EAAA,IAAAX,CAAA,QAAAC,UAAA,IAAAD,CAAA,QAAAa,KAAA,IAAAb,CAAA,QAAAS,YAAA,IAAAT,CAAA,QAAAI,gBAAA,IAAAJ,CAAA,QAAAO,kBAAA;IASpEI,EAAA,GAAAG,MAAA,CAAAC,GAAA,8B;;MAPJ;QAAAC,YAAA;QAAAC;MAAA,IAAgCJ,KAAA,MAAU;MAE1C,MAAAV,OAAA,GAAgBC,gBAAA,IAAoBY,YAAA;MACpC,MAAAE,WAAA,GAAoBX,kBAAA,IAAuBE,YAAA,IAAgBQ,KAAA,UAAU;MAAA,IAEjEC,WAAA,IAAef,OAAA,EAAAgB,MAAS;QAExBR,EAAA,GAAAS,IAAA,CAAA1B,OAAA;UAAAO,UAAA;UAAAoB,SAAA,EAAAxB,SAAA;UAAAyB,KAAA;UAAAC,iBAAA;UAAAC,QAAA,EACGrB;QAAA,C;;;;;;;;;;;;;;;;;CAMT","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","React","Tooltip","useForm","useFormFields","useFormSubmitted","useEditDepth","generateFieldID","baseClass","FieldError","props","$","alignCaret","t0","message","messageFromProps","path","showError","showErrorFromProps","undefined","hasSubmitted","uuid","editDepth","t1","t2","fields","field","Symbol","for","errorMessage","valid","showMessage","length","_jsx","className","delay","id","staticPositioning","children"],"sources":["../../../src/fields/FieldError/index.tsx"],"sourcesContent":["'use client'\n\nimport type { GenericErrorProps } from 'payload'\n\nimport React from 'react'\n\nimport { Tooltip } from '../../elements/Tooltip/index.js'\nimport { useForm, useFormFields, useFormSubmitted } from '../../forms/Form/context.js'\nimport { useEditDepth } from '../../providers/EditDepth/index.js'\nimport { generateFieldID } from '../../utilities/generateFieldID.js'\nimport './index.css'\n\nconst baseClass = 'field-error'\n\nexport const FieldError: React.FC<GenericErrorProps> = (props) => {\n  const {\n    alignCaret = 'right',\n    message: messageFromProps,\n    path,\n    showError: showErrorFromProps,\n  } = props\n\n  const hasSubmitted = useFormSubmitted()\n  const { uuid } = useForm()\n  const editDepth = useEditDepth()\n  const field = useFormFields(([fields]) => (fields && fields?.[path]) || null)\n\n  const { errorMessage, valid } = field || {}\n\n  const message = messageFromProps || errorMessage\n  const showMessage = showErrorFromProps || (hasSubmitted && valid === false)\n\n  if (showMessage && message?.length) {\n    return (\n      <Tooltip\n        alignCaret={alignCaret}\n        className={baseClass}\n        delay={0}\n        id={generateFieldID(path, editDepth, uuid, 'field-error')}\n        staticPositioning\n      >\n        {message}\n      </Tooltip>\n    )\n  }\n\n  return null\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAIA,OAAOC,KAAA,MAAW;AAElB,SAASC,OAAO,QAAQ;AACxB,SAASC,OAAO,EAAEC,aAAa,EAAEC,gBAAgB,QAAQ;AACzD,SAASC,YAAY,QAAQ;AAC7B,SAASC,eAAe,QAAQ;AAChC,OAAO;AAEP,MAAMC,SAAA,GAAY;AAElB,OAAO,MAAMC,UAAA,GAA0CC,KAAA;EAAA,MAAAC,CAAA,GAAAX,EAAA;EACrD;IAAAY,UAAA,EAAAC,EAAA;IAAAC,OAAA,EAAAC,gBAAA;IAAAC,IAAA;IAAAC,SAAA,EAAAC;EAAA,IAKIR,KAAA;EAJF,MAAAE,UAAA,GAAAC,EAAoB,KAAAM,SAAA,GAAP,OAAO,GAApBN,EAAoB;EAMtB,MAAAO,YAAA,GAAqBf,gBAAA;EACrB;IAAAgB;EAAA,IAAiBlB,OAAA;EACjB,MAAAmB,SAAA,GAAkBhB,YAAA;EAAA,IAAAiB,EAAA;EAAA,IAAAZ,CAAA,QAAAK,IAAA;IACUO,EAAA,GAAAC,EAAA;MAAC,OAAAC,MAAA,IAAAD,EAAQ;MAAA,OAAKC,MAAC,IAAUA,MAAA,GAAST,IAAA,CAAK,QAAK;IAAA;IAAAL,CAAA,MAAAK,IAAA;IAAAL,CAAA,MAAAY,EAAA;EAAA;IAAAA,EAAA,GAAAZ,CAAA;EAAA;EAAxE,MAAAe,KAAA,GAActB,aAAA,CAAcmB,EAA4C;EAAA,IAAAC,EAAA;EAAA,IAAAb,CAAA,QAAAC,UAAA,IAAAD,CAAA,QAAAW,SAAA,IAAAX,CAAA,QAAAe,KAAA,IAAAf,CAAA,QAAAS,YAAA,IAAAT,CAAA,QAAAI,gBAAA,IAAAJ,CAAA,QAAAK,IAAA,IAAAL,CAAA,QAAAO,kBAAA,IAAAP,CAAA,QAAAU,IAAA;IASpEG,EAAA,GAAAG,MAAA,CAAAC,GAAA,8B;;MAPJ;QAAAC,YAAA;QAAAC;MAAA,IAAgCJ,KAAA,MAAU;MAE1C,MAAAZ,OAAA,GAAgBC,gBAAA,IAAoBc,YAAA;MACpC,MAAAE,WAAA,GAAoBb,kBAAA,IAAuBE,YAAA,IAAgBU,KAAA,UAAU;MAAA,IAEjEC,WAAA,IAAejB,OAAA,EAAAkB,MAAS;QAExBR,EAAA,GAAAS,IAAA,CAAA/B,OAAA;UAAAU,UAAA;UAAAsB,SAAA,EAAA1B,SAAA;UAAA2B,KAAA;UAAAC,EAAA,EAIM7B,eAAA,CAAgBS,IAAA,EAAMM,SAAA,EAAWD,IAAA,EAAM;UAAAgB,iBAAA;UAAAC,QAAA,EAG1CxB;QAAA,C;;;;;;;;;;;;;;;;;;;;CAMT","ignoreList":[]}

package/dist/fields/FieldLabel/index.css

@@ -1,48 +1,29 @@
 @layer payload-default {
   :root {
-    --field-label-letter-spacing: -0.032px;
+    --field-label-letter-spacing: var(--text-body-medium-strong-letter-spacing);
   }
 
-  label.field-label {
+  .field-label {
     display: flex;
     align-items: center;
   }
 
-  label.field-label:not(.unstyled) {
-    display: flex;
+  .field-label:not(.unstyled) {
     color: var(--field-color-label);
     font-family: var(--text-body-medium-strong-font-family);
+    font-size: var(--text-body-medium-strong-font-size);
     font-weight: var(--text-body-medium-strong-font-weight);
+    line-height: var(--text-body-medium-strong-line-height);
     letter-spacing: var(--field-label-letter-spacing);
-
-    html:not([dir='RTL']) & {
-      margin-right: auto;
-    }
-
-    html[dir='RTL'] & {
-      margin-left: auto;
-    }
+    margin-inline-end: auto;
   }
 
   .field-label:not(.unstyled) .required {
     color: var(--field-color-label-required);
-
-    html:not([dir='RTL']) & {
-      margin-left: var(--spacer-1);
-    }
-
-    html[dir='RTL'] & {
-      margin-right: var(--spacer-1);
-    }
+    margin-inline-start: calc(var(--spacer-1) / 2);
   }
 
   .localized {
-    html:not([dir='RTL']) & {
-      margin-left: var(--spacer-1);
-    }
-
-    html[dir='RTL'] & {
-      margin-right: var(--spacer-1);
-    }
+    margin-inline-start: var(--spacer-1);
   }
 }

package/dist/fields/FieldLabel/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/FieldLabel/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAGhD,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB,OAAO,aAAa,CAAA;AAEpB,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAsClD,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/FieldLabel/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAGhD,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB,OAAO,aAAa,CAAA;AAEpB,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAwClD,CAAA"}

package/dist/fields/FieldLabel/index.js

@@ -33,10 +33,9 @@ export const FieldLabel = props => {
   const {
     i18n
   } = useTranslation();
-  const {
-    code,
-    label: localLabel
-  } = useLocale();
+  const locale = useLocale();
+  const code = locale?.code;
+  const localLabel = locale?.label;
   const Element = ElementFromProps === "label" ? htmlFor ? "label" : "span" : ElementFromProps || "span";
   if (label) {
     return _jsxs(Element, {
@@ -45,7 +44,7 @@ export const FieldLabel = props => {
       children: [getTranslation(label, i18n), required && !unstyled && _jsx("span", {
         className: "required",
         children: "*"
-      }), localized && !hideLocale && _jsxs("span", {
+      }), localized && !hideLocale && locale && _jsxs("span", {
         className: "localized",
         children: ["\u2014 ", typeof localLabel === "string" ? localLabel : code]
       })]

package/dist/fields/FieldLabel/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["getTranslation","React","useForm","useEditDepth","useLocale","useTranslation","generateFieldID","FieldLabel","props","as","t0","hideLocale","t1","htmlFor","htmlForFromProps","label","localized","t2","path","required","t3","unstyled","t4","ElementFromProps","undefined","uuid","editDepth","i18n","code","localLabel","Element","_jsxs","className","children","_jsx"],"sources":["../../../src/fields/FieldLabel/index.tsx"],"sourcesContent":["'use client'\n\nimport type { GenericLabelProps } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport { useForm } from '../../forms/Form/context.js'\nimport { useEditDepth } from '../../providers/EditDepth/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { generateFieldID } from '../../utilities/generateFieldID.js'\nimport './index.css'\n\nexport const FieldLabel: React.FC<GenericLabelProps> = (props) => {\n  const {\n    as: ElementFromProps = 'label',\n    hideLocale = false,\n    htmlFor: htmlForFromProps,\n    label,\n    localized = false,\n    path,\n    required = false,\n    unstyled = false,\n  } = props\n\n  const { uuid } = useForm()\n  const editDepth = useEditDepth()\n\n  const htmlFor = htmlForFromProps || generateFieldID(path, editDepth, uuid)\n\n  const { i18n } = useTranslation()\n  const { code, label: localLabel } = useLocale()\n\n  const Element =\n    ElementFromProps === 'label' ? (htmlFor ? 'label' : 'span') : ElementFromProps || 'span'\n\n  if (label) {\n    return (\n      <Element className={`field-label${unstyled ? ' unstyled' : ''}`} htmlFor={htmlFor}>\n        {getTranslation(label, i18n)}\n        {required && !unstyled && <span className=\"required\">*</span>}\n        {localized && !hideLocale && (\n          <span className=\"localized\">\n            &mdash; {typeof localLabel === 'string' ? localLabel : code}\n          </span>\n        )}\n      </Element>\n    )\n  }\n\n  return null\n}\n"],"mappings":"AAAA;;;AAIA,SAASA,cAAc,QAAQ;AAC/B,OAAOC,KAAA,MAAW;AAElB,SAASC,OAAO,QAAQ;AACxB,SAASC,YAAY,QAAQ;AAC7B,SAASC,SAAS,QAAQ;AAC1B,SAASC,cAAc,QAAQ;AAC/B,SAASC,eAAe,QAAQ;AAChC,OAAO;AAEP,OAAO,MAAMC,UAAA,GAA0CC,KAAA;EACrD;IAAAC,EAAA,EAAAC,EAAA;IAAAC,UAAA,EAAAC,EAAA;IAAAC,OAAA,EAAAC,gBAAA;IAAAC,KAAA;IAAAC,SAAA,EAAAC,EAAA;IAAAC,IAAA;IAAAC,QAAA,EAAAC,EAAA;IAAAC,QAAA,EAAAC;EAAA,IASId,KAAA;EARE,MAAAe,gBAAA,GAAAb,EAA0B,KAAAc,SAAA,GAAP,OAAO,GAA1Bd,EAA0B;EAC9B,MAAAC,UAAA,GAAAC,EAAkB,KAAAY,SAAA,WAAlBZ,EAAkB;EAGlB,MAAAI,SAAA,GAAAC,EAAiB,KAAAO,SAAA,WAAjBP,EAAiB;EAEjB,MAAAE,QAAA,GAAAC,EAAgB,KAAAI,SAAA,WAAhBJ,EAAgB;EAChB,MAAAC,QAAA,GAAAC,EAAgB,KAAAE,SAAA,WAAhBF,EAAgB;EAGlB;IAAAG;EAAA,IAAiBvB,OAAA;EACjB,MAAAwB,SAAA,GAAkBvB,YAAA;EAElB,MAAAU,OAAA,GAAgBC,gBAAA,IAAoBR,eAAA,CAAgBY,IAAA,EAAMQ,SAAA,EAAWD,IAAA;EAErE;IAAAE;EAAA,IAAiBtB,cAAA;EACjB;IAAAuB,IAAA;IAAAb,KAAA,EAAAc;EAAA,IAAoCzB,SAAA;EAEpC,MAAA0B,OAAA,GACEP,gBAAA,KAAqB,UAAWV,OAAA,GAAU,UAAU,SAAUU,gBAAA,IAAoB;EAAA,IAEhFR,KAAA;IAAA,OAEAgB,KAAA,CAACD,OAAA;MAAAE,SAAA,EAAmB,cAAcX,QAAA,GAAW,cAAc,IAAI;MAAAR,OAAA;MAAAoB,QAAA,GAC5DjC,cAAA,CAAee,KAAA,EAAOY,IAAA,GACtBR,QAAA,KAAaE,QAAA,IAAYa,IAAA,CAAC;QAAAF,SAAA,EAAe;QAAAC,QAAA,EAAW;MAAA,C,GACpDjB,SAAA,KAAcL,UAAA,IACboB,KAAA,CAAC;QAAAC,SAAA,EAAe;QAAAC,QAAA,GAAY,WACjB,OAAOJ,UAAA,KAAe,WAAWA,UAAA,GAAaD,IAAA;MAAA,C;;;;CAQnE","ignoreList":[]}
+{"version":3,"file":"index.js","names":["getTranslation","React","useForm","useEditDepth","useLocale","useTranslation","generateFieldID","FieldLabel","props","as","t0","hideLocale","t1","htmlFor","htmlForFromProps","label","localized","t2","path","required","t3","unstyled","t4","ElementFromProps","undefined","uuid","editDepth","i18n","locale","code","localLabel","Element","_jsxs","className","children","_jsx"],"sources":["../../../src/fields/FieldLabel/index.tsx"],"sourcesContent":["'use client'\n\nimport type { GenericLabelProps } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport { useForm } from '../../forms/Form/context.js'\nimport { useEditDepth } from '../../providers/EditDepth/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { generateFieldID } from '../../utilities/generateFieldID.js'\nimport './index.css'\n\nexport const FieldLabel: React.FC<GenericLabelProps> = (props) => {\n  const {\n    as: ElementFromProps = 'label',\n    hideLocale = false,\n    htmlFor: htmlForFromProps,\n    label,\n    localized = false,\n    path,\n    required = false,\n    unstyled = false,\n  } = props\n\n  const { uuid } = useForm()\n  const editDepth = useEditDepth()\n\n  const htmlFor = htmlForFromProps || generateFieldID(path, editDepth, uuid)\n\n  const { i18n } = useTranslation()\n  const locale = useLocale()\n  const code = locale?.code\n  const localLabel = locale?.label\n\n  const Element =\n    ElementFromProps === 'label' ? (htmlFor ? 'label' : 'span') : ElementFromProps || 'span'\n\n  if (label) {\n    return (\n      <Element className={`field-label${unstyled ? ' unstyled' : ''}`} htmlFor={htmlFor}>\n        {getTranslation(label, i18n)}\n        {required && !unstyled && <span className=\"required\">*</span>}\n        {localized && !hideLocale && locale && (\n          <span className=\"localized\">\n            &mdash; {typeof localLabel === 'string' ? localLabel : code}\n          </span>\n        )}\n      </Element>\n    )\n  }\n\n  return null\n}\n"],"mappings":"AAAA;;;AAIA,SAASA,cAAc,QAAQ;AAC/B,OAAOC,KAAA,MAAW;AAElB,SAASC,OAAO,QAAQ;AACxB,SAASC,YAAY,QAAQ;AAC7B,SAASC,SAAS,QAAQ;AAC1B,SAASC,cAAc,QAAQ;AAC/B,SAASC,eAAe,QAAQ;AAChC,OAAO;AAEP,OAAO,MAAMC,UAAA,GAA0CC,KAAA;EACrD;IAAAC,EAAA,EAAAC,EAAA;IAAAC,UAAA,EAAAC,EAAA;IAAAC,OAAA,EAAAC,gBAAA;IAAAC,KAAA;IAAAC,SAAA,EAAAC,EAAA;IAAAC,IAAA;IAAAC,QAAA,EAAAC,EAAA;IAAAC,QAAA,EAAAC;EAAA,IASId,KAAA;EARE,MAAAe,gBAAA,GAAAb,EAA0B,KAAAc,SAAA,GAAP,OAAO,GAA1Bd,EAA0B;EAC9B,MAAAC,UAAA,GAAAC,EAAkB,KAAAY,SAAA,WAAlBZ,EAAkB;EAGlB,MAAAI,SAAA,GAAAC,EAAiB,KAAAO,SAAA,WAAjBP,EAAiB;EAEjB,MAAAE,QAAA,GAAAC,EAAgB,KAAAI,SAAA,WAAhBJ,EAAgB;EAChB,MAAAC,QAAA,GAAAC,EAAgB,KAAAE,SAAA,WAAhBF,EAAgB;EAGlB;IAAAG;EAAA,IAAiBvB,OAAA;EACjB,MAAAwB,SAAA,GAAkBvB,YAAA;EAElB,MAAAU,OAAA,GAAgBC,gBAAA,IAAoBR,eAAA,CAAgBY,IAAA,EAAMQ,SAAA,EAAWD,IAAA;EAErE;IAAAE;EAAA,IAAiBtB,cAAA;EACjB,MAAAuB,MAAA,GAAexB,SAAA;EACf,MAAAyB,IAAA,GAAaD,MAAA,EAAAC,IAAA;EACb,MAAAC,UAAA,GAAmBF,MAAA,EAAAb,KAAA;EAEnB,MAAAgB,OAAA,GACER,gBAAA,KAAqB,UAAWV,OAAA,GAAU,UAAU,SAAUU,gBAAA,IAAoB;EAAA,IAEhFR,KAAA;IAAA,OAEAiB,KAAA,CAACD,OAAA;MAAAE,SAAA,EAAmB,cAAcZ,QAAA,GAAW,cAAc,IAAI;MAAAR,OAAA;MAAAqB,QAAA,GAC5DlC,cAAA,CAAee,KAAA,EAAOY,IAAA,GACtBR,QAAA,KAAaE,QAAA,IAAYc,IAAA,CAAC;QAAAF,SAAA,EAAe;QAAAC,QAAA,EAAW;MAAA,C,GACpDlB,SAAA,KAAcL,UAAA,IAAciB,MAAA,IAC3BI,KAAA,CAAC;QAAAC,SAAA,EAAe;QAAAC,QAAA,GAAY,WACjB,OAAOJ,UAAA,KAAe,WAAWA,UAAA,GAAaD,IAAA;MAAA,C;;;;CAQnE","ignoreList":[]}

package/dist/fields/Group/index.css

@@ -7,11 +7,11 @@
     &::before {
       content: '';
       position: absolute;
-      top: calc(var(--spacer-5) / -2);
+      top: calc(var(--gutter-h) * -1);
       left: calc(var(--gutter-h) * -1);
       right: calc(var(--gutter-h) * -1);
       height: 0;
-      border-top: 1px solid var(--color-border);
+      border-top: var(--stroke-width-small) solid var(--color-border);
     }
 
     &:first-child {
@@ -33,7 +33,7 @@
       left: calc(var(--spacer-3) * -1);
       right: calc(var(--spacer-3) * -1);
       height: 0;
-      border-top: 1px solid var(--color-border);
+      border-top: var(--stroke-width-small) solid var(--color-border);
     }
 
     &:first-child {
@@ -79,7 +79,7 @@
   }
 
   .group-field--gutter {
-    border-left: 1px solid var(--color-border);
+    border-left: var(--stroke-width-small) solid var(--color-border);
     padding-left: var(--spacer-3);
   }
 
@@ -123,15 +123,10 @@
     padding-top: 0;
   }
 
+  /* stylelint-disable-next-line plugin/no-max-width-media-query -- TODO: pre-existing; migrate to a mobile-first min-width query */
   @media (max-width: 768px) {
     .group-field--top-level {
       &::before {
-        content: '';
-        position: absolute;
-        top: calc(var(--spacer-5) / -2.5);
-        left: calc(var(--gutter-h) * -1);
-        right: calc(var(--gutter-h) * -1);
-        height: 0;
         border-top: var(--stroke-width-small) solid var(--color-border);
       }
     }

package/dist/fields/Group/index.d.ts

@@ -5,6 +5,6 @@ import { GroupProvider, useGroup } from './provider.js';
 export declare const GroupFieldComponent: GroupFieldClientComponent;
 export { GroupProvider, useGroup };
 export declare const GroupField: React.FC<import("payload").FieldPaths & {
-    readonly field: (Omit<import("payload").UnnamedGroupFieldClient, "type"> & Partial<Pick<import("payload").UnnamedGroupFieldClient, "type">>) | (Omit<import("payload").NamedGroupFieldClient, "type"> & Partial<Pick<import("payload").NamedGroupFieldClient, "type">>);
-} & Omit<import("payload").ClientComponentProps, "field" | "customComponents">>;
+    readonly field: (Omit<import("payload").NamedGroupFieldClient, "type"> & Partial<Pick<import("payload").NamedGroupFieldClient, "type">>) | (Omit<import("payload").UnnamedGroupFieldClient, "type"> & Partial<Pick<import("payload").UnnamedGroupFieldClient, "type">>);
+} & Omit<import("payload").ClientComponentProps, "customComponents" | "field">>;
 //# sourceMappingURL=index.d.ts.map

package/dist/fields/JSON/index.d.ts

@@ -5,5 +5,5 @@ export declare const JSONField: React.FC<{
     readonly validate?: import("payload").JSONFieldValidation;
 } & {
     readonly field: Omit<import("payload").JSONFieldClient, "type"> & Partial<Pick<import("payload").JSONFieldClient, "type">>;
-} & Omit<import("payload").ClientComponentProps, "field" | "customComponents">>;
+} & Omit<import("payload").ClientComponentProps, "customComponents" | "field">>;
 //# sourceMappingURL=index.d.ts.map

package/dist/fields/Join/index.css

@@ -13,6 +13,15 @@
     gap: var(--spacer-2);
   }
 
+  .field-type.join .relationship-table__header {
+    flex-wrap: wrap;
+    row-gap: var(--spacer-1);
+  }
+
+  .field-type.join .join__description {
+    flex-basis: 100%;
+  }
+
   .field-type.join .relationship-table__header h4 {
     margin: 0;
     font-family: var(--text-body-large-strong-font-family);

package/dist/fields/Join/index.d.ts

@@ -5,5 +5,5 @@ export declare const JoinField: React.FC<{
     readonly path: string;
 } & {
     readonly field: Omit<JoinFieldClient, "type"> & Partial<Pick<JoinFieldClient, "type">>;
-} & Omit<import("payload").ClientComponentProps, "field" | "customComponents">>;
+} & Omit<import("payload").ClientComponentProps, "customComponents" | "field">>;
 //# sourceMappingURL=index.d.ts.map

package/dist/fields/Join/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/Join/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAGV,eAAe,EAIhB,MAAM,SAAS,CAAA;AAIhB,OAAO,KAAkB,MAAM,OAAO,CAAA;AAatC,OAAO,aAAa,CAAA;AA0NpB,eAAO,MAAM,SAAS;;;;+EAAoC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/Join/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAGV,eAAe,EAIhB,MAAM,SAAS,CAAA;AAIhB,OAAO,KAAkB,MAAM,OAAO,CAAA;AAatC,OAAO,aAAa,CAAA;AAgOpB,eAAO,MAAM,SAAS;;;;+EAAoC,CAAA"}

package/dist/fields/Join/index.js

@@ -173,13 +173,23 @@ const JoinFieldComponent = props => {
   if (!docConfig) {
     return null;
   }
-  return /*#__PURE__*/_jsxs("div", {
+  return /*#__PURE__*/_jsx("div", {
     className: [fieldBaseClass, fieldHasErrors && 'error', 'join'].filter(Boolean).join(' '),
     id: `field-${path?.replace(/\./g, '__')}`,
-    children: [/*#__PURE__*/_jsx(RelationshipTable, {
+    children: /*#__PURE__*/_jsx(RelationshipTable, {
       AfterInput: AfterInput,
       allowCreate: typeof docID !== 'undefined' && allowCreate,
       BeforeInput: BeforeInput,
+      Description: Description || description ? /*#__PURE__*/_jsx("div", {
+        className: "join__description",
+        children: /*#__PURE__*/_jsx(RenderCustomComponent, {
+          CustomComponent: Description,
+          Fallback: /*#__PURE__*/_jsx(FieldDescription, {
+            description: description,
+            path: path
+          })
+        })
+      }) : undefined,
       disableTable: filterOptions === null,
       field: field,
       fieldPath: path,
@@ -209,13 +219,7 @@ const JoinFieldComponent = props => {
         joinPath: path
       } : undefined,
       relationTo: collection
-    }), /*#__PURE__*/_jsx(RenderCustomComponent, {
-      CustomComponent: Description,
-      Fallback: /*#__PURE__*/_jsx(FieldDescription, {
-        description: description,
-        path: path
-      })
-    })]
+    })
   });
 };
 export const JoinField = withCondition(JoinFieldComponent);

package/dist/fields/Join/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ObjectIdImport","fieldAffectsData","flattenTopLevelFields","React","useMemo","ErrorPill","RelationshipTable","RenderCustomComponent","useField","withCondition","useConfig","useDocumentInfo","useTranslation","FieldDescription","FieldLabel","fieldBaseClass","ObjectId","default","getInitialDrawerData","collectionSlug","config","docID","fields","segments","flattenedFields","keepPresentationalFields","path","field","find","name","type","value","Array","isArray","relationTo","hasMany","nextSegments","slice","length","initialData","id","toHexString","_block","blocks","block","blocksMap","blockInitialData","blockType","slug","JoinFieldComponent","props","admin","allowCreate","description","collection","label","localized","on","required","pathFromProps","docConfig","getEntityConfig","i18n","customComponents","AfterInput","BeforeInput","Description","Label","errorPaths","showError","potentiallyStalePath","fieldErrorCount","fieldHasErrors","filterOptions","targetField","where","equals","and","initialDrawerData","relatedCollection","split","_jsxs","className","filter","Boolean","join","replace","_jsx","disableTable","fieldPath","docs","count","withMessage","parent","joinPath","undefined","CustomComponent","Fallback","JoinField"],"sources":["../../../src/fields/Join/index.tsx"],"sourcesContent":["'use client'\n\nimport type {\n  ClientConfig,\n  ClientField,\n  JoinFieldClient,\n  JoinFieldClientComponent,\n  PaginatedDocs,\n  Where,\n} from 'payload'\n\nimport ObjectIdImport from 'bson-objectid'\nimport { fieldAffectsData, flattenTopLevelFields } from 'payload/shared'\nimport React, { useMemo } from 'react'\n\nimport { ErrorPill } from '../../elements/ErrorPill/index.js'\nimport { RelationshipTable } from '../../elements/RelationshipTable/index.js'\nimport { RenderCustomComponent } from '../../elements/RenderCustomComponent/index.js'\nimport { useField } from '../../forms/useField/index.js'\nimport { withCondition } from '../../forms/withCondition/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { FieldDescription } from '../FieldDescription/index.js'\nimport { FieldLabel } from '../FieldLabel/index.js'\nimport { fieldBaseClass } from '../index.js'\nimport './index.css'\n\nconst ObjectId = 'default' in ObjectIdImport ? ObjectIdImport.default : ObjectIdImport\n\n/**\n * Recursively builds the default data for joined collection\n */\nconst getInitialDrawerData = ({\n  collectionSlug,\n  config,\n  docID,\n  fields,\n  segments,\n}: {\n  collectionSlug: string\n  config: ClientConfig\n  docID: number | string\n  fields: ClientField[]\n  segments: string[]\n}) => {\n  const flattenedFields = flattenTopLevelFields(fields, {\n    keepPresentationalFields: true,\n  })\n\n  const path = segments[0]\n\n  const field = flattenedFields.find((field) => field.name === path)\n\n  if (!field) {\n    return null\n  }\n\n  if (field.type === 'relationship' || field.type === 'upload') {\n    let value: { relationTo: string; value: number | string } | number | string = docID\n    if (Array.isArray(field.relationTo)) {\n      value = {\n        relationTo: collectionSlug,\n        value: docID,\n      }\n    }\n    return {\n      [field.name]: field.hasMany ? [value] : value,\n    }\n  }\n\n  const nextSegments = segments.slice(1, segments.length)\n\n  if (field.type === 'tab' || (field.type === 'group' && fieldAffectsData(field))) {\n    return {\n      [field.name]: getInitialDrawerData({\n        collectionSlug,\n        config,\n        docID,\n        fields: field.fields,\n        segments: nextSegments,\n      }),\n    }\n  }\n\n  if (field.type === 'array') {\n    const initialData = getInitialDrawerData({\n      collectionSlug,\n      config,\n      docID,\n      fields: field.fields,\n      segments: nextSegments,\n    })\n\n    initialData.id = ObjectId().toHexString()\n\n    return {\n      [field.name]: [initialData],\n    }\n  }\n\n  if (field.type === 'blocks') {\n    for (const _block of field.blocks) {\n      const block = typeof _block === 'string' ? config.blocksMap[_block] : _block\n\n      const blockInitialData = getInitialDrawerData({\n        collectionSlug,\n        config,\n        docID,\n        fields: block.fields,\n        segments: nextSegments,\n      })\n\n      if (blockInitialData) {\n        blockInitialData.id = ObjectId().toHexString()\n        blockInitialData.blockType = block.slug\n\n        return {\n          [field.name]: [blockInitialData],\n        }\n      }\n    }\n  }\n}\n\nconst JoinFieldComponent: JoinFieldClientComponent = (props) => {\n  const {\n    field,\n    field: { admin: { allowCreate, description } = {}, collection, label, localized, on, required },\n    path: pathFromProps,\n  } = props\n\n  const { id: docID, docConfig } = useDocumentInfo()\n\n  const { config, getEntityConfig } = useConfig()\n\n  const { i18n } = useTranslation()\n\n  const {\n    customComponents: { AfterInput, BeforeInput, Description, Label } = {},\n    errorPaths,\n    path,\n    showError,\n    value,\n  } = useField<PaginatedDocs>({\n    potentiallyStalePath: pathFromProps,\n  })\n\n  const fieldErrorCount = errorPaths?.length || (showError ? 1 : 0)\n  const fieldHasErrors = fieldErrorCount > 0\n\n  const filterOptions: null | Where = useMemo(() => {\n    if (!docID) {\n      return null\n    }\n\n    let value: { relationTo: string; value: number | string } | number | string = docID\n\n    if (Array.isArray(field.targetField.relationTo)) {\n      value = {\n        relationTo: docConfig.slug,\n        value,\n      }\n    }\n\n    const where = Array.isArray(collection)\n      ? {}\n      : {\n          [on]: {\n            equals: value,\n          },\n        }\n\n    if (field.where) {\n      return {\n        and: [where, field.where],\n      }\n    }\n\n    return where\n  }, [docID, collection, field.targetField.relationTo, field.where, on, docConfig?.slug])\n\n  const initialDrawerData = useMemo(() => {\n    const relatedCollection = getEntityConfig({\n      collectionSlug: Array.isArray(field.collection) ? field.collection[0] : field.collection,\n    })\n\n    return getInitialDrawerData({\n      collectionSlug: docConfig?.slug,\n      config,\n      docID,\n      fields: relatedCollection?.fields,\n      segments: field.on.split('.'),\n    })\n  }, [getEntityConfig, field.collection, field.on, docConfig?.slug, docID, config])\n\n  if (!docConfig) {\n    return null\n  }\n\n  return (\n    <div\n      className={[fieldBaseClass, fieldHasErrors && 'error', 'join'].filter(Boolean).join(' ')}\n      id={`field-${path?.replace(/\\./g, '__')}`}\n    >\n      <RelationshipTable\n        AfterInput={AfterInput}\n        allowCreate={typeof docID !== 'undefined' && allowCreate}\n        BeforeInput={BeforeInput}\n        disableTable={filterOptions === null}\n        field={field as JoinFieldClient}\n        fieldPath={path}\n        filterOptions={filterOptions}\n        initialData={docID && value ? value : ({ docs: [] } as PaginatedDocs)}\n        initialDrawerData={initialDrawerData}\n        Label={\n          <div className=\"join__header-wrapper\">\n            <h4>\n              {Label || (\n                <FieldLabel label={label} localized={localized} path={path} required={required} />\n              )}\n            </h4>\n            {fieldHasErrors && <ErrorPill count={fieldErrorCount} i18n={i18n} withMessage />}\n          </div>\n        }\n        parent={\n          typeof docID !== 'undefined'\n            ? {\n                id: docID,\n                collectionSlug: docConfig.slug,\n                joinPath: path,\n              }\n            : undefined\n        }\n        relationTo={collection}\n      />\n      <RenderCustomComponent\n        CustomComponent={Description}\n        Fallback={<FieldDescription description={description} path={path} />}\n      />\n    </div>\n  )\n}\n\nexport const JoinField = withCondition(JoinFieldComponent)\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["ObjectIdImport","fieldAffectsData","flattenTopLevelFields","React","useMemo","ErrorPill","RelationshipTable","RenderCustomComponent","useField","withCondition","useConfig","useDocumentInfo","useTranslation","FieldDescription","FieldLabel","fieldBaseClass","ObjectId","default","getInitialDrawerData","collectionSlug","config","docID","fields","segments","flattenedFields","keepPresentationalFields","path","field","find","name","type","value","Array","isArray","relationTo","hasMany","nextSegments","slice","length","initialData","id","toHexString","_block","blocks","block","blocksMap","blockInitialData","blockType","slug","JoinFieldComponent","props","admin","allowCreate","description","collection","label","localized","on","required","pathFromProps","docConfig","getEntityConfig","i18n","customComponents","AfterInput","BeforeInput","Description","Label","errorPaths","showError","potentiallyStalePath","fieldErrorCount","fieldHasErrors","filterOptions","targetField","where","equals","and","initialDrawerData","relatedCollection","split","_jsx","className","filter","Boolean","join","replace","CustomComponent","Fallback","undefined","disableTable","fieldPath","docs","_jsxs","count","withMessage","parent","joinPath","JoinField"],"sources":["../../../src/fields/Join/index.tsx"],"sourcesContent":["'use client'\n\nimport type {\n  ClientConfig,\n  ClientField,\n  JoinFieldClient,\n  JoinFieldClientComponent,\n  PaginatedDocs,\n  Where,\n} from 'payload'\n\nimport ObjectIdImport from 'bson-objectid'\nimport { fieldAffectsData, flattenTopLevelFields } from 'payload/shared'\nimport React, { useMemo } from 'react'\n\nimport { ErrorPill } from '../../elements/ErrorPill/index.js'\nimport { RelationshipTable } from '../../elements/RelationshipTable/index.js'\nimport { RenderCustomComponent } from '../../elements/RenderCustomComponent/index.js'\nimport { useField } from '../../forms/useField/index.js'\nimport { withCondition } from '../../forms/withCondition/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { FieldDescription } from '../FieldDescription/index.js'\nimport { FieldLabel } from '../FieldLabel/index.js'\nimport { fieldBaseClass } from '../index.js'\nimport './index.css'\n\nconst ObjectId = 'default' in ObjectIdImport ? ObjectIdImport.default : ObjectIdImport\n\n/**\n * Recursively builds the default data for joined collection\n */\nconst getInitialDrawerData = ({\n  collectionSlug,\n  config,\n  docID,\n  fields,\n  segments,\n}: {\n  collectionSlug: string\n  config: ClientConfig\n  docID: number | string\n  fields: ClientField[]\n  segments: string[]\n}) => {\n  const flattenedFields = flattenTopLevelFields(fields, {\n    keepPresentationalFields: true,\n  })\n\n  const path = segments[0]\n\n  const field = flattenedFields.find((field) => field.name === path)\n\n  if (!field) {\n    return null\n  }\n\n  if (field.type === 'relationship' || field.type === 'upload') {\n    let value: { relationTo: string; value: number | string } | number | string = docID\n    if (Array.isArray(field.relationTo)) {\n      value = {\n        relationTo: collectionSlug,\n        value: docID,\n      }\n    }\n    return {\n      [field.name]: field.hasMany ? [value] : value,\n    }\n  }\n\n  const nextSegments = segments.slice(1, segments.length)\n\n  if (field.type === 'tab' || (field.type === 'group' && fieldAffectsData(field))) {\n    return {\n      [field.name]: getInitialDrawerData({\n        collectionSlug,\n        config,\n        docID,\n        fields: field.fields,\n        segments: nextSegments,\n      }),\n    }\n  }\n\n  if (field.type === 'array') {\n    const initialData = getInitialDrawerData({\n      collectionSlug,\n      config,\n      docID,\n      fields: field.fields,\n      segments: nextSegments,\n    })\n\n    initialData.id = ObjectId().toHexString()\n\n    return {\n      [field.name]: [initialData],\n    }\n  }\n\n  if (field.type === 'blocks') {\n    for (const _block of field.blocks) {\n      const block = typeof _block === 'string' ? config.blocksMap[_block] : _block\n\n      const blockInitialData = getInitialDrawerData({\n        collectionSlug,\n        config,\n        docID,\n        fields: block.fields,\n        segments: nextSegments,\n      })\n\n      if (blockInitialData) {\n        blockInitialData.id = ObjectId().toHexString()\n        blockInitialData.blockType = block.slug\n\n        return {\n          [field.name]: [blockInitialData],\n        }\n      }\n    }\n  }\n}\n\nconst JoinFieldComponent: JoinFieldClientComponent = (props) => {\n  const {\n    field,\n    field: { admin: { allowCreate, description } = {}, collection, label, localized, on, required },\n    path: pathFromProps,\n  } = props\n\n  const { id: docID, docConfig } = useDocumentInfo()\n\n  const { config, getEntityConfig } = useConfig()\n\n  const { i18n } = useTranslation()\n\n  const {\n    customComponents: { AfterInput, BeforeInput, Description, Label } = {},\n    errorPaths,\n    path,\n    showError,\n    value,\n  } = useField<PaginatedDocs>({\n    potentiallyStalePath: pathFromProps,\n  })\n\n  const fieldErrorCount = errorPaths?.length || (showError ? 1 : 0)\n  const fieldHasErrors = fieldErrorCount > 0\n\n  const filterOptions: null | Where = useMemo(() => {\n    if (!docID) {\n      return null\n    }\n\n    let value: { relationTo: string; value: number | string } | number | string = docID\n\n    if (Array.isArray(field.targetField.relationTo)) {\n      value = {\n        relationTo: docConfig.slug,\n        value,\n      }\n    }\n\n    const where = Array.isArray(collection)\n      ? {}\n      : {\n          [on]: {\n            equals: value,\n          },\n        }\n\n    if (field.where) {\n      return {\n        and: [where, field.where],\n      }\n    }\n\n    return where\n  }, [docID, collection, field.targetField.relationTo, field.where, on, docConfig?.slug])\n\n  const initialDrawerData = useMemo(() => {\n    const relatedCollection = getEntityConfig({\n      collectionSlug: Array.isArray(field.collection) ? field.collection[0] : field.collection,\n    })\n\n    return getInitialDrawerData({\n      collectionSlug: docConfig?.slug,\n      config,\n      docID,\n      fields: relatedCollection?.fields,\n      segments: field.on.split('.'),\n    })\n  }, [getEntityConfig, field.collection, field.on, docConfig?.slug, docID, config])\n\n  if (!docConfig) {\n    return null\n  }\n\n  return (\n    <div\n      className={[fieldBaseClass, fieldHasErrors && 'error', 'join'].filter(Boolean).join(' ')}\n      id={`field-${path?.replace(/\\./g, '__')}`}\n    >\n      <RelationshipTable\n        AfterInput={AfterInput}\n        allowCreate={typeof docID !== 'undefined' && allowCreate}\n        BeforeInput={BeforeInput}\n        Description={\n          Description || description ? (\n            <div className=\"join__description\">\n              <RenderCustomComponent\n                CustomComponent={Description}\n                Fallback={<FieldDescription description={description} path={path} />}\n              />\n            </div>\n          ) : undefined\n        }\n        disableTable={filterOptions === null}\n        field={field as JoinFieldClient}\n        fieldPath={path}\n        filterOptions={filterOptions}\n        initialData={docID && value ? value : ({ docs: [] } as PaginatedDocs)}\n        initialDrawerData={initialDrawerData}\n        Label={\n          <div className=\"join__header-wrapper\">\n            <h4>\n              {Label || (\n                <FieldLabel label={label} localized={localized} path={path} required={required} />\n              )}\n            </h4>\n            {fieldHasErrors && <ErrorPill count={fieldErrorCount} i18n={i18n} withMessage />}\n          </div>\n        }\n        parent={\n          typeof docID !== 'undefined'\n            ? {\n                id: docID,\n                collectionSlug: docConfig.slug,\n                joinPath: path,\n              }\n            : undefined\n        }\n        relationTo={collection}\n      />\n    </div>\n  )\n}\n\nexport const JoinField = withCondition(JoinFieldComponent)\n"],"mappings":"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","ignoreList":[]}

package/dist/fields/Number/Input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/fields/Number/Input.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAA;AAUlD,OAAO,aAAa,CAAA;AAIpB,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA6HlD,CAAA"}
+{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/fields/Number/Input.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAA;AAUlD,OAAO,aAAa,CAAA;AAIpB,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAoIlD,CAAA"}

package/dist/fields/Number/Input.js

@@ -16,9 +16,10 @@ import { fieldBaseClass } from '../shared/index.js';
 import './index.css';
 const baseClass = 'number';
 export const NumberInput = props => {
-  const $ = _c(32);
+  const $ = _c(36);
   const {
     AfterInput,
+    ariaLabel,
     BeforeInput,
     className,
     Description,
@@ -35,41 +36,46 @@ export const NumberInput = props => {
     onStep,
     path,
     placeholder: placeholderFromProps,
+    prefix,
     readOnly,
     required,
     showError,
-    step: t3,
+    size: t3,
+    step: t4,
     style,
+    suffix,
     value,
     valueToRender
   } = props;
   const max = t0 === undefined ? Infinity : t0;
   const maxRows = t1 === undefined ? Infinity : t1;
   const min = t2 === undefined ? -Infinity : t2;
-  const step = t3 === undefined ? 1 : t3;
+  const size = t3 === undefined ? "large" : t3;
+  const step = t4 === undefined ? 1 : t4;
   const {
     i18n,
     t
   } = useTranslation();
-  let t4;
-  if ($[0] !== AfterInput || $[1] !== BeforeInput || $[2] !== Description || $[3] !== Error || $[4] !== Label || $[5] !== className || $[6] !== description || $[7] !== hasMany || $[8] !== i18n || $[9] !== label || $[10] !== localized || $[11] !== max || $[12] !== maxRows || $[13] !== min || $[14] !== onChange || $[15] !== onStep || $[16] !== path || $[17] !== placeholderFromProps || $[18] !== readOnly || $[19] !== required || $[20] !== showError || $[21] !== step || $[22] !== style || $[23] !== t || $[24] !== value || $[25] !== valueToRender) {
+  let t5;
+  if ($[0] !== AfterInput || $[1] !== BeforeInput || $[2] !== Description || $[3] !== Error || $[4] !== Label || $[5] !== ariaLabel || $[6] !== className || $[7] !== description || $[8] !== hasMany || $[9] !== i18n || $[10] !== label || $[11] !== localized || $[12] !== max || $[13] !== maxRows || $[14] !== min || $[15] !== onChange || $[16] !== onStep || $[17] !== path || $[18] !== placeholderFromProps || $[19] !== prefix || $[20] !== readOnly || $[21] !== required || $[22] !== showError || $[23] !== size || $[24] !== step || $[25] !== style || $[26] !== suffix || $[27] !== t || $[28] !== value || $[29] !== valueToRender) {
     const placeholder = getTranslation(placeholderFromProps, i18n) || (hasMany ? t("general:enterANumber") : undefined);
-    const t5 = showError && "error";
-    const t6 = readOnly && "read-only";
-    const t7 = hasMany && "has-many";
-    let t8;
-    if ($[27] !== className || $[28] !== t5 || $[29] !== t6 || $[30] !== t7) {
-      t8 = [fieldBaseClass, baseClass, className, t5, t6, t7].filter(Boolean);
-      $[27] = className;
-      $[28] = t5;
-      $[29] = t6;
-      $[30] = t7;
-      $[31] = t8;
+    const t6 = showError && "error";
+    const t7 = readOnly && "read-only";
+    const t8 = hasMany && "has-many";
+    let t9;
+    if ($[31] !== className || $[32] !== t6 || $[33] !== t7 || $[34] !== t8) {
+      t9 = [fieldBaseClass, baseClass, className, t6, t7, t8].filter(Boolean);
+      $[31] = className;
+      $[32] = t6;
+      $[33] = t7;
+      $[34] = t8;
+      $[35] = t9;
     } else {
-      t8 = $[31];
+      t9 = $[35];
     }
-    t4 = _jsxs("div", {
-      className: t8.join(" "),
+    t5 = _jsxs("div", {
+      className: t9.join(" "),
+      "data-size": size,
       style,
       children: [_jsx(RenderCustomComponent, {
         CustomComponent: Label,
@@ -118,8 +124,11 @@ export const NumberInput = props => {
           value: valueToRender
         }) : _jsxs("div", {
           className: "form-input-group",
-          children: [_jsx("input", {
-            "aria-label": getTranslation(label, i18n) || path,
+          children: [prefix ? _jsx("span", {
+            className: `${baseClass}__prefix`,
+            children: prefix
+          }) : null, _jsx("input", {
+            "aria-label": ariaLabel || getTranslation(label, i18n) || path,
             className: "form-input",
             disabled: readOnly,
             id: `field-${path.replace(/\./g, "__")}`,
@@ -132,7 +141,10 @@ export const NumberInput = props => {
             step,
             type: "number",
             value: typeof value === "number" ? value : ""
-          }), onStep && _jsx(InputStepper, {
+          }), suffix ? _jsx("span", {
+            className: `${baseClass}__suffix`,
+            children: suffix
+          }) : null, onStep && _jsx(InputStepper, {
             disabled: readOnly,
             onDecrement: () => onStep("down"),
             onIncrement: () => onStep("up")
@@ -151,32 +163,36 @@ export const NumberInput = props => {
     $[2] = Description;
     $[3] = Error;
     $[4] = Label;
-    $[5] = className;
-    $[6] = description;
-    $[7] = hasMany;
-    $[8] = i18n;
-    $[9] = label;
-    $[10] = localized;
-    $[11] = max;
-    $[12] = maxRows;
-    $[13] = min;
-    $[14] = onChange;
-    $[15] = onStep;
-    $[16] = path;
-    $[17] = placeholderFromProps;
-    $[18] = readOnly;
-    $[19] = required;
-    $[20] = showError;
-    $[21] = step;
-    $[22] = style;
-    $[23] = t;
-    $[24] = value;
-    $[25] = valueToRender;
-    $[26] = t4;
+    $[5] = ariaLabel;
+    $[6] = className;
+    $[7] = description;
+    $[8] = hasMany;
+    $[9] = i18n;
+    $[10] = label;
+    $[11] = localized;
+    $[12] = max;
+    $[13] = maxRows;
+    $[14] = min;
+    $[15] = onChange;
+    $[16] = onStep;
+    $[17] = path;
+    $[18] = placeholderFromProps;
+    $[19] = prefix;
+    $[20] = readOnly;
+    $[21] = required;
+    $[22] = showError;
+    $[23] = size;
+    $[24] = step;
+    $[25] = style;
+    $[26] = suffix;
+    $[27] = t;
+    $[28] = value;
+    $[29] = valueToRender;
+    $[30] = t5;
   } else {
-    t4 = $[26];
+    t5 = $[30];
   }
-  return t4;
+  return t5;
 };
 function _temp(e) {
   e.target.blur();

package/dist/fields/Number/Input.js.map

@@ -1 +1 @@
-{"version":3,"file":"Input.js","names":["c","_c","getTranslation","isNumber","React","InputStepper","ReactSelect","RenderCustomComponent","useTranslation","FieldDescription","FieldError","FieldLabel","fieldBaseClass","baseClass","NumberInput","props","$","AfterInput","BeforeInput","className","Description","description","Error","hasMany","Label","label","localized","max","t0","maxRows","t1","min","t2","onChange","onStep","path","placeholder","placeholderFromProps","readOnly","required","showError","step","t3","style","value","valueToRender","undefined","Infinity","i18n","t","t4","t5","t6","t7","t8","filter","Boolean","_jsxs","join","children","_jsx","CustomComponent","Fallback","replace","components","DropdownIndicator","disabled","filterOption","_","rawInput","isOverHasMany","Array","isArray","length","isClearable","isCreatable","isMulti","isSortable","noOptionsMessage","isOverHasMany_0","options","id","name","onWheel","_temp","type","onDecrement","onIncrement","e","target","blur"],"sources":["../../../src/fields/Number/Input.tsx"],"sourcesContent":["'use client'\nimport type { ChangeEvent } from 'react'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { isNumber } from 'payload/shared'\nimport React from 'react'\n\nimport type { NumberInputProps } from './types.js'\n\nimport { InputStepper } from '../../elements/InputStepper/index.js'\nimport { ReactSelect } from '../../elements/ReactSelect/index.js'\nimport { RenderCustomComponent } from '../../elements/RenderCustomComponent/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { FieldDescription } from '../FieldDescription/index.js'\nimport { FieldError } from '../FieldError/index.js'\nimport { FieldLabel } from '../FieldLabel/index.js'\nimport { fieldBaseClass } from '../shared/index.js'\nimport './index.css'\n\nconst baseClass = 'number'\n\nexport const NumberInput: React.FC<NumberInputProps> = (props) => {\n  const {\n    AfterInput,\n    BeforeInput,\n    className,\n    Description,\n    description,\n    Error,\n    hasMany,\n    Label,\n    label,\n    localized,\n    max = Infinity,\n    maxRows = Infinity,\n    min = -Infinity,\n    onChange,\n    onStep,\n    path,\n    placeholder: placeholderFromProps,\n    readOnly,\n    required,\n    showError,\n    step = 1,\n    style,\n    value,\n    valueToRender,\n  } = props\n\n  const { i18n, t } = useTranslation()\n\n  const placeholder =\n    getTranslation(placeholderFromProps, i18n) || (hasMany ? t('general:enterANumber') : undefined)\n\n  return (\n    <div\n      className={[\n        fieldBaseClass,\n        baseClass,\n        className,\n        showError && 'error',\n        readOnly && 'read-only',\n        hasMany && 'has-many',\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      style={style}\n    >\n      <RenderCustomComponent\n        CustomComponent={Label}\n        Fallback={\n          <FieldLabel label={label} localized={localized} path={path} required={required} />\n        }\n      />\n      <div className={`${fieldBaseClass}__wrap`}>\n        <RenderCustomComponent\n          CustomComponent={Error}\n          Fallback={<FieldError path={path} showError={showError} />}\n        />\n        {BeforeInput}\n        {hasMany ? (\n          <ReactSelect\n            className={`field-${path.replace(/\\./g, '__')}`}\n            components={{ DropdownIndicator: null }}\n            disabled={readOnly}\n            filterOption={(_, rawInput) => {\n              const isOverHasMany = Array.isArray(value) && (value as number[]).length >= maxRows\n              return isNumber(rawInput) && !isOverHasMany\n            }}\n            isClearable\n            isCreatable\n            isMulti\n            isSortable\n            noOptionsMessage={() => {\n              const isOverHasMany = Array.isArray(value) && (value as number[]).length >= maxRows\n              if (isOverHasMany) {\n                return t('validation:limitReached', {\n                  max: maxRows,\n                  value: (value as number[]).length + 1,\n                })\n              }\n              return null\n            }}\n            onChange={onChange}\n            options={[]}\n            placeholder={placeholder}\n            showError={showError}\n            value={valueToRender}\n          />\n        ) : (\n          <div className=\"form-input-group\">\n            <input\n              aria-label={getTranslation(label, i18n) || path}\n              className=\"form-input\"\n              disabled={readOnly}\n              id={`field-${path.replace(/\\./g, '__')}`}\n              max={max}\n              min={min}\n              name={path}\n              onChange={onChange as (e: ChangeEvent<HTMLInputElement>) => void}\n              onWheel={(e) => {\n                // @ts-expect-error - blur() exists on input elements but not typed on EventTarget\n                e.target.blur()\n              }}\n              placeholder={placeholder}\n              step={step}\n              type=\"number\"\n              value={typeof value === 'number' ? value : ''}\n            />\n            {onStep && (\n              <InputStepper\n                disabled={readOnly}\n                onDecrement={() => onStep('down')}\n                onIncrement={() => onStep('up')}\n              />\n            )}\n          </div>\n        )}\n        {AfterInput}\n        <RenderCustomComponent\n          CustomComponent={Description}\n          Fallback={<FieldDescription description={description} path={path} />}\n        />\n      </div>\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Input.js","names":["c","_c","getTranslation","isNumber","React","InputStepper","ReactSelect","RenderCustomComponent","useTranslation","FieldDescription","FieldError","FieldLabel","fieldBaseClass","baseClass","NumberInput","props","$","AfterInput","ariaLabel","BeforeInput","className","Description","description","Error","hasMany","Label","label","localized","max","t0","maxRows","t1","min","t2","onChange","onStep","path","placeholder","placeholderFromProps","prefix","readOnly","required","showError","size","t3","step","t4","style","suffix","value","valueToRender","undefined","Infinity","i18n","t","t5","t6","t7","t8","t9","filter","Boolean","_jsxs","join","children","_jsx","CustomComponent","Fallback","replace","components","DropdownIndicator","disabled","filterOption","_","rawInput","isOverHasMany","Array","isArray","length","isClearable","isCreatable","isMulti","isSortable","noOptionsMessage","isOverHasMany_0","options","id","name","onWheel","_temp","type","onDecrement","onIncrement","e","target","blur"],"sources":["../../../src/fields/Number/Input.tsx"],"sourcesContent":["'use client'\nimport type { ChangeEvent } from 'react'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { isNumber } from 'payload/shared'\nimport React from 'react'\n\nimport type { NumberInputProps } from './types.js'\n\nimport { InputStepper } from '../../elements/InputStepper/index.js'\nimport { ReactSelect } from '../../elements/ReactSelect/index.js'\nimport { RenderCustomComponent } from '../../elements/RenderCustomComponent/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { FieldDescription } from '../FieldDescription/index.js'\nimport { FieldError } from '../FieldError/index.js'\nimport { FieldLabel } from '../FieldLabel/index.js'\nimport { fieldBaseClass } from '../shared/index.js'\nimport './index.css'\n\nconst baseClass = 'number'\n\nexport const NumberInput: React.FC<NumberInputProps> = (props) => {\n  const {\n    AfterInput,\n    ariaLabel,\n    BeforeInput,\n    className,\n    Description,\n    description,\n    Error,\n    hasMany,\n    Label,\n    label,\n    localized,\n    max = Infinity,\n    maxRows = Infinity,\n    min = -Infinity,\n    onChange,\n    onStep,\n    path,\n    placeholder: placeholderFromProps,\n    prefix,\n    readOnly,\n    required,\n    showError,\n    size = 'large',\n    step = 1,\n    style,\n    suffix,\n    value,\n    valueToRender,\n  } = props\n\n  const { i18n, t } = useTranslation()\n\n  const placeholder =\n    getTranslation(placeholderFromProps, i18n) || (hasMany ? t('general:enterANumber') : undefined)\n\n  return (\n    <div\n      className={[\n        fieldBaseClass,\n        baseClass,\n        className,\n        showError && 'error',\n        readOnly && 'read-only',\n        hasMany && 'has-many',\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      data-size={size}\n      style={style}\n    >\n      <RenderCustomComponent\n        CustomComponent={Label}\n        Fallback={\n          <FieldLabel label={label} localized={localized} path={path} required={required} />\n        }\n      />\n      <div className={`${fieldBaseClass}__wrap`}>\n        <RenderCustomComponent\n          CustomComponent={Error}\n          Fallback={<FieldError path={path} showError={showError} />}\n        />\n        {BeforeInput}\n        {hasMany ? (\n          <ReactSelect\n            className={`field-${path.replace(/\\./g, '__')}`}\n            components={{ DropdownIndicator: null }}\n            disabled={readOnly}\n            filterOption={(_, rawInput) => {\n              const isOverHasMany = Array.isArray(value) && (value as number[]).length >= maxRows\n              return isNumber(rawInput) && !isOverHasMany\n            }}\n            isClearable\n            isCreatable\n            isMulti\n            isSortable\n            noOptionsMessage={() => {\n              const isOverHasMany = Array.isArray(value) && (value as number[]).length >= maxRows\n              if (isOverHasMany) {\n                return t('validation:limitReached', {\n                  max: maxRows,\n                  value: (value as number[]).length + 1,\n                })\n              }\n              return null\n            }}\n            onChange={onChange}\n            options={[]}\n            placeholder={placeholder}\n            showError={showError}\n            value={valueToRender}\n          />\n        ) : (\n          <div className=\"form-input-group\">\n            {prefix ? <span className={`${baseClass}__prefix`}>{prefix}</span> : null}\n            <input\n              aria-label={ariaLabel || getTranslation(label, i18n) || path}\n              className=\"form-input\"\n              disabled={readOnly}\n              id={`field-${path.replace(/\\./g, '__')}`}\n              max={max}\n              min={min}\n              name={path}\n              onChange={onChange as (e: ChangeEvent<HTMLInputElement>) => void}\n              onWheel={(e) => {\n                // @ts-expect-error - blur() exists on input elements but not typed on EventTarget\n                e.target.blur()\n              }}\n              placeholder={placeholder}\n              step={step}\n              type=\"number\"\n              value={typeof value === 'number' ? value : ''}\n            />\n            {suffix ? <span className={`${baseClass}__suffix`}>{suffix}</span> : null}\n            {onStep && (\n              <InputStepper\n                disabled={readOnly}\n                onDecrement={() => onStep('down')}\n                onIncrement={() => onStep('up')}\n              />\n            )}\n          </div>\n        )}\n        {AfterInput}\n        <RenderCustomComponent\n          CustomComponent={Description}\n          Fallback={<FieldDescription description={description} path={path} />}\n        />\n      </div>\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}