@payloadcms/ui 3.68.0-internal-debug.e9b66ee → 3.68.0-internal-debug.654e4ad

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/fields/Slug/index.tsx"],"sourcesContent":["'use client'\n\nimport type { SlugFieldClientProps } from 'payload'\n\nimport React, { useCallback, useState } from 'react'\n\nimport { Button } from '../../elements/Button/index.js'\nimport { useForm } from '../../forms/Form/index.js'\nimport { useField } from '../../forms/useField/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useServerFunctions } from '../../providers/ServerFunctions/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { FieldLabel } from '../FieldLabel/index.js'\nimport { TextInput } from '../Text/index.js'\nimport './index.scss'\n\n/**\n * @experimental This component is experimental and may change or be removed in the future. Use at your own risk.\n */\nexport const SlugField: React.FC<SlugFieldClientProps> = ({\n  field,\n  path,\n  readOnly: readOnlyFromProps,\n  useAsSlug,\n}) => {\n  const { label } = field\n\n  const { t } = useTranslation()\n\n  const { collectionSlug, globalSlug } = useDocumentInfo()\n\n  const { slugify } = useServerFunctions()\n\n  const { setValue, value } = useField<string>({ path: path || field.name })\n\n  const { getData, getDataByPath } = useForm()\n\n  const [isLocked, setIsLocked] = useState(true)\n\n  /**\n   * This method allows the user to generate their slug on demand, e.g. when they click the \"generate\" button.\n   * It uses the `slugify` server function to gain access to their custom slugify function defined in their field config.\n   */\n  const handleGenerate = useCallback(\n    async (e: React.MouseEvent<Element>) => {\n      e.preventDefault()\n\n      const valueToSlugify = getDataByPath(useAsSlug)\n\n      const formattedSlug = await slugify({\n        collectionSlug,\n        data: getData(),\n        globalSlug,\n        path,\n        valueToSlugify,\n      })\n\n      if (formattedSlug === null || formattedSlug === undefined) {\n        setValue('')\n        return\n      }\n\n      /**\n       * The result may be the same as the current value, and if so, we don't want to trigger a re-render.\n       */\n      if (value !== formattedSlug) {\n        setValue(formattedSlug)\n      }\n    },\n    [setValue, value, useAsSlug, getData, slugify, getDataByPath, collectionSlug, globalSlug, path],\n  )\n\n  const toggleLock = useCallback((e: React.MouseEvent<Element>) => {\n    e.preventDefault()\n    setIsLocked((prev) => !prev)\n  }, [])\n\n  return (\n    <div className=\"field-type slug-field-component\">\n      <div className=\"label-wrapper\">\n        <FieldLabel htmlFor={`field-${path}`} label={label} />\n        {!isLocked && (\n          <Button buttonStyle=\"none\" className=\"lock-button\" onClick={handleGenerate}>\n            {t('authentication:generate')}\n          </Button>\n        )}\n        <Button buttonStyle=\"none\" className=\"lock-button\" onClick={toggleLock}>\n          {isLocked ? t('general:unlock') : t('general:lock')}\n        </Button>\n      </div>\n      <TextInput\n        onChange={setValue}\n        path={path || field.name}\n        readOnly={Boolean(readOnlyFromProps || isLocked)}\n        value={value}\n      />\n    </div>\n  )\n}\n"],"names":["useCallback","useState","Button","useForm","useField","useDocumentInfo","useServerFunctions","useTranslation","FieldLabel","TextInput","SlugField","field","path","readOnly","readOnlyFromProps","useAsSlug","label","t","collectionSlug","globalSlug","slugify","setValue","value","name","getData","getDataByPath","isLocked","setIsLocked","handleGenerate","e","preventDefault","valueToSlugify","formattedSlug","data","undefined","toggleLock","prev","div","className","htmlFor","buttonStyle","onClick","onChange","Boolean"],"mappings":"AAAA;AAIA,SAAgBA,WAAW,EAAEC,QAAQ,QAAQ,QAAO;AAEpD,SAASC,MAAM,QAAQ,iCAAgC;AACvD,SAASC,OAAO,QAAQ,4BAA2B;AACnD,SAASC,QAAQ,QAAQ,gCAA+B;AACxD,SAASC,eAAe,QAAQ,wCAAuC;AACvE,SAASC,kBAAkB,QAAQ,2CAA0C;AAC7E,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,UAAU,QAAQ,yBAAwB;AACnD,SAASC,SAAS,QAAQ,mBAAkB;AAC5C,OAAO,eAAc;AAErB;;CAEC,GACD,OAAO,MAAMC,YAA4C,CAAC,EACxDC,KAAK,EACLC,IAAI,EACJC,UAAUC,iBAAiB,EAC3BC,SAAS,EACV;IACC,MAAM,EAAEC,KAAK,EAAE,GAAGL;IAElB,MAAM,EAAEM,CAAC,EAAE,GAAGV;IAEd,MAAM,EAAEW,cAAc,EAAEC,UAAU,EAAE,GAAGd;IAEvC,MAAM,EAAEe,OAAO,EAAE,GAAGd;IAEpB,MAAM,EAAEe,QAAQ,EAAEC,KAAK,EAAE,GAAGlB,SAAiB;QAAEQ,MAAMA,QAAQD,MAAMY,IAAI;IAAC;IAExE,MAAM,EAAEC,OAAO,EAAEC,aAAa,EAAE,GAAGtB;IAEnC,MAAM,CAACuB,UAAUC,YAAY,GAAG1B,SAAS;IAEzC;;;GAGC,GACD,MAAM2B,iBAAiB5B,YACrB,OAAO6B;QACLA,EAAEC,cAAc;QAEhB,MAAMC,iBAAiBN,cAAcV;QAErC,MAAMiB,gBAAgB,MAAMZ,QAAQ;YAClCF;YACAe,MAAMT;YACNL;YACAP;YACAmB;QACF;QAEA,IAAIC,kBAAkB,QAAQA,kBAAkBE,WAAW;YACzDb,SAAS;YACT;QACF;QAEA;;OAEC,GACD,IAAIC,UAAUU,eAAe;YAC3BX,SAASW;QACX;IACF,GACA;QAACX;QAAUC;QAAOP;QAAWS;QAASJ;QAASK;QAAeP;QAAgBC;QAAYP;KAAK;IAGjG,MAAMuB,aAAanC,YAAY,CAAC6B;QAC9BA,EAAEC,cAAc;QAChBH,YAAY,CAACS,OAAS,CAACA;IACzB,GAAG,EAAE;IAEL,QACGC,IAAIC,UAAU,kCAAkC;MAC/C,CAACD,IAAIC,UAAU,gBAAgB;QAC7B,CAAC9B,WAAW+B,SAAS,CAAC,MAAM,EAAE3B,MAAM,EAAEI,OAAOA,QAAS;QACtD,CAAC,CAACU,aACCxB,OAAOsC,YAAY,OAAOF,UAAU,cAAcG,SAASb,gBAAgB;YAC1E,CAACX,EAAE,2BAA2B;UAChC,EAAEf,QACF;QACF,CAACA,OAAOsC,YAAY,OAAOF,UAAU,cAAcG,SAASN,YAAY;UACtE,CAACT,WAAWT,EAAE,oBAAoBA,EAAE,gBAAgB;QACtD,EAAEf,OAAO;MACX,EAAEmC,IAAI;MACN,CAAC5B,UACCiC,UAAUrB,UACVT,MAAMA,QAAQD,MAAMY,IAAI,EACxBV,UAAU8B,QAAQ7B,qBAAqBY,WACvCJ,OAAOA,QACP;IACJ,EAAEe;AAEN,EAAC"}
+{"version":3,"sources":["../../../src/fields/Slug/index.tsx"],"sourcesContent":["'use client'\n\nimport type { SlugFieldClientProps } from 'payload'\n\nimport React, { useCallback, useState } from 'react'\n\nimport { Button } from '../../elements/Button/index.js'\nimport { useForm } from '../../forms/Form/index.js'\nimport { useField } from '../../forms/useField/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useServerFunctions } from '../../providers/ServerFunctions/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { FieldLabel } from '../FieldLabel/index.js'\nimport { TextInput } from '../Text/index.js'\nimport './index.scss'\n\n/**\n * @experimental This component is experimental and may change or be removed in the future. Use at your own risk.\n */\nexport const SlugField: React.FC<SlugFieldClientProps> = ({\n  field,\n  path,\n  readOnly: readOnlyFromProps,\n  useAsSlug,\n}) => {\n  const { label } = field\n\n  const { t } = useTranslation()\n\n  const { collectionSlug, globalSlug } = useDocumentInfo()\n\n  const { slugify } = useServerFunctions()\n\n  const { setValue, value } = useField<string>({ path: path || field.name })\n\n  const { getData, getDataByPath } = useForm()\n\n  const [isLocked, setIsLocked] = useState(true)\n\n  /**\n   * This method allows the user to generate their slug on demand, e.g. when they click the \"generate\" button.\n   * It uses the `slugify` server function to gain access to their custom slugify function defined in their field config.\n   */\n  const handleGenerate = useCallback(\n    async (e: React.MouseEvent<Element>) => {\n      e.preventDefault()\n\n      const valueToSlugify = getDataByPath(useAsSlug)\n\n      const formattedSlug = await slugify({\n        collectionSlug,\n        data: getData(),\n        globalSlug,\n        path,\n        valueToSlugify,\n      })\n\n      if (formattedSlug === null || formattedSlug === undefined) {\n        setValue('')\n        return\n      }\n\n      /**\n       * The result may be the same as the current value, and if so, we don't want to trigger a re-render.\n       */\n      if (value !== formattedSlug) {\n        setValue(formattedSlug)\n      }\n    },\n    [setValue, value, useAsSlug, getData, slugify, getDataByPath, collectionSlug, globalSlug, path],\n  )\n\n  const toggleLock = useCallback((e: React.MouseEvent<Element>) => {\n    e.preventDefault()\n    setIsLocked((prev) => !prev)\n  }, [])\n\n  return (\n    <div className=\"field-type slug-field-component\">\n      <div className=\"label-wrapper\">\n        <FieldLabel htmlFor={`field-${path}`} label={label} />\n        {!isLocked && (\n          <Button buttonStyle=\"none\" className=\"lock-button\" onClick={handleGenerate}>\n            {t('authentication:generate')}\n          </Button>\n        )}\n        <Button buttonStyle=\"none\" className=\"lock-button\" onClick={toggleLock}>\n          {isLocked ? t('general:unlock') : t('general:lock')}\n        </Button>\n      </div>\n      <TextInput\n        onChange={setValue}\n        path={path || field.name}\n        readOnly={Boolean(readOnlyFromProps || isLocked)}\n        value={value}\n      />\n    </div>\n  )\n}\n"],"names":["React","useCallback","useState","Button","useForm","useField","useDocumentInfo","useServerFunctions","useTranslation","FieldLabel","TextInput","SlugField","field","path","readOnly","readOnlyFromProps","useAsSlug","label","t","collectionSlug","globalSlug","slugify","setValue","value","name","getData","getDataByPath","isLocked","setIsLocked","handleGenerate","e","preventDefault","valueToSlugify","formattedSlug","data","undefined","toggleLock","prev","div","className","htmlFor","buttonStyle","onClick","onChange","Boolean"],"mappings":"AAAA;;AAIA,OAAOA,SAASC,WAAW,EAAEC,QAAQ,QAAQ,QAAO;AAEpD,SAASC,MAAM,QAAQ,iCAAgC;AACvD,SAASC,OAAO,QAAQ,4BAA2B;AACnD,SAASC,QAAQ,QAAQ,gCAA+B;AACxD,SAASC,eAAe,QAAQ,wCAAuC;AACvE,SAASC,kBAAkB,QAAQ,2CAA0C;AAC7E,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,UAAU,QAAQ,yBAAwB;AACnD,SAASC,SAAS,QAAQ,mBAAkB;AAC5C,OAAO,eAAc;AAErB;;CAEC,GACD,OAAO,MAAMC,YAA4C,CAAC,EACxDC,KAAK,EACLC,IAAI,EACJC,UAAUC,iBAAiB,EAC3BC,SAAS,EACV;IACC,MAAM,EAAEC,KAAK,EAAE,GAAGL;IAElB,MAAM,EAAEM,CAAC,EAAE,GAAGV;IAEd,MAAM,EAAEW,cAAc,EAAEC,UAAU,EAAE,GAAGd;IAEvC,MAAM,EAAEe,OAAO,EAAE,GAAGd;IAEpB,MAAM,EAAEe,QAAQ,EAAEC,KAAK,EAAE,GAAGlB,SAAiB;QAAEQ,MAAMA,QAAQD,MAAMY,IAAI;IAAC;IAExE,MAAM,EAAEC,OAAO,EAAEC,aAAa,EAAE,GAAGtB;IAEnC,MAAM,CAACuB,UAAUC,YAAY,GAAG1B,SAAS;IAEzC;;;GAGC,GACD,MAAM2B,iBAAiB5B,YACrB,OAAO6B;QACLA,EAAEC,cAAc;QAEhB,MAAMC,iBAAiBN,cAAcV;QAErC,MAAMiB,gBAAgB,MAAMZ,QAAQ;YAClCF;YACAe,MAAMT;YACNL;YACAP;YACAmB;QACF;QAEA,IAAIC,kBAAkB,QAAQA,kBAAkBE,WAAW;YACzDb,SAAS;YACT;QACF;QAEA;;OAEC,GACD,IAAIC,UAAUU,eAAe;YAC3BX,SAASW;QACX;IACF,GACA;QAACX;QAAUC;QAAOP;QAAWS;QAASJ;QAASK;QAAeP;QAAgBC;QAAYP;KAAK;IAGjG,MAAMuB,aAAanC,YAAY,CAAC6B;QAC9BA,EAAEC,cAAc;QAChBH,YAAY,CAACS,OAAS,CAACA;IACzB,GAAG,EAAE;IAEL,qBACE,QAACC;QAAIC,WAAU;;0BACb,QAACD;gBAAIC,WAAU;;kCACb,QAAC9B;wBAAW+B,SAAS,CAAC,MAAM,EAAE3B,MAAM;wBAAEI,OAAOA;;;;;;oBAC5C,CAACU,0BACA,QAACxB;wBAAOsC,aAAY;wBAAOF,WAAU;wBAAcG,SAASb;kCACzDX,EAAE;;;;;;kCAGP,QAACf;wBAAOsC,aAAY;wBAAOF,WAAU;wBAAcG,SAASN;kCACzDT,WAAWT,EAAE,oBAAoBA,EAAE;;;;;;;;;;;;0BAGxC,QAACR;gBACCiC,UAAUrB;gBACVT,MAAMA,QAAQD,MAAMY,IAAI;gBACxBV,UAAU8B,QAAQ7B,qBAAqBY;gBACvCJ,OAAOA;;;;;;;;;;;;AAIf,EAAC"}

package/dist/fields/Tabs/Tab/index.js

@@ -1,4 +1,5 @@
 'use client';
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import { getTranslation } from '@payloadcms/translations';
 import { tabHasName } from 'payload/shared';
 import React, { useState } from 'react';
@@ -18,18 +19,48 @@ export const TabComponent = ({ hidden, isActive, parentPath, setIsActive, tab })
         ] : []
     ];
     const fieldHasErrors = errorCount > 0;
-    return <React.Fragment>
-      <WatchChildErrors fields={tab.fields} path={path} setErrorCount={setErrorCount}/>
-      <button className={[
-        baseClass,
-        fieldHasErrors && `${baseClass}--has-error`,
-        isActive && `${baseClass}--active`,
-        hidden && `${baseClass}--hidden`
-    ].filter(Boolean).join(' ')} onClick={setIsActive} type="button">
-        {tab.label ? getTranslation(tab.label, i18n) : tabHasName(tab) ? tab.name : ''}
-        {fieldHasErrors && <ErrorPill count={errorCount} i18n={i18n}/>}
-      </button>
-    </React.Fragment>;
+    return /*#__PURE__*/ _jsxDEV(React.Fragment, {
+        children: [
+            /*#__PURE__*/ _jsxDEV(WatchChildErrors, {
+                fields: tab.fields,
+                path: path,
+                setErrorCount: setErrorCount
+            }, void 0, false, {
+                fileName: "src/fields/Tabs/Tab/index.tsx",
+                lineNumber: 44,
+                columnNumber: 7
+            }, this),
+            /*#__PURE__*/ _jsxDEV("button", {
+                className: [
+                    baseClass,
+                    fieldHasErrors && `${baseClass}--has-error`,
+                    isActive && `${baseClass}--active`,
+                    hidden && `${baseClass}--hidden`
+                ].filter(Boolean).join(' '),
+                onClick: setIsActive,
+                type: "button",
+                children: [
+                    tab.label ? getTranslation(tab.label, i18n) : tabHasName(tab) ? tab.name : '',
+                    fieldHasErrors && /*#__PURE__*/ _jsxDEV(ErrorPill, {
+                        count: errorCount,
+                        i18n: i18n
+                    }, void 0, false, {
+                        fileName: "src/fields/Tabs/Tab/index.tsx",
+                        lineNumber: 58,
+                        columnNumber: 28
+                    }, this)
+                ]
+            }, void 0, true, {
+                fileName: "src/fields/Tabs/Tab/index.tsx",
+                lineNumber: 45,
+                columnNumber: 7
+            }, this)
+        ]
+    }, void 0, true, {
+        fileName: "src/fields/Tabs/Tab/index.tsx",
+        lineNumber: 43,
+        columnNumber: 5
+    }, this);
 };
 
 //# sourceMappingURL=index.js.map

package/dist/fields/Tabs/Tab/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/fields/Tabs/Tab/index.tsx"],"sourcesContent":["'use client'\n\nimport type { ClientTab } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { tabHasName } from 'payload/shared'\nimport React, { useState } from 'react'\n\nimport { ErrorPill } from '../../../elements/ErrorPill/index.js'\nimport { WatchChildErrors } from '../../../forms/WatchChildErrors/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport './index.scss'\n\nconst baseClass = 'tabs-field__tab-button'\n\ntype TabProps = {\n  readonly hidden?: boolean\n  readonly isActive?: boolean\n  readonly parentPath: string\n  readonly setIsActive: () => void\n  readonly tab: ClientTab\n}\n\nexport const TabComponent: React.FC<TabProps> = ({\n  hidden,\n  isActive,\n  parentPath,\n  setIsActive,\n  tab,\n}) => {\n  const { i18n } = useTranslation()\n  const [errorCount, setErrorCount] = useState(undefined)\n\n  const path = [\n    // removes parent 'tabs' path segment, i.e. `_index-0`\n    ...(parentPath ? parentPath.split('.').slice(0, -1) : []),\n    ...(tabHasName(tab) ? [tab.name] : []),\n  ]\n\n  const fieldHasErrors = errorCount > 0\n\n  return (\n    <React.Fragment>\n      <WatchChildErrors fields={tab.fields} path={path} setErrorCount={setErrorCount} />\n      <button\n        className={[\n          baseClass,\n          fieldHasErrors && `${baseClass}--has-error`,\n          isActive && `${baseClass}--active`,\n          hidden && `${baseClass}--hidden`,\n        ]\n          .filter(Boolean)\n          .join(' ')}\n        onClick={setIsActive}\n        type=\"button\"\n      >\n        {tab.label ? getTranslation(tab.label, i18n) : tabHasName(tab) ? tab.name : ''}\n        {fieldHasErrors && <ErrorPill count={errorCount} i18n={i18n} />}\n      </button>\n    </React.Fragment>\n  )\n}\n"],"names":["getTranslation","tabHasName","React","useState","ErrorPill","WatchChildErrors","useTranslation","baseClass","TabComponent","hidden","isActive","parentPath","setIsActive","tab","i18n","errorCount","setErrorCount","undefined","path","split","slice","name","fieldHasErrors","Fragment","fields","button","className","filter","Boolean","join","onClick","type","label","count"],"mappings":"AAAA;AAIA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,SAASC,UAAU,QAAQ,iBAAgB;AAC3C,OAAOC,SAASC,QAAQ,QAAQ,QAAO;AAEvC,SAASC,SAAS,QAAQ,uCAAsC;AAChE,SAASC,gBAAgB,QAAQ,2CAA0C;AAC3E,SAASC,cAAc,QAAQ,0CAAyC;AACxE,OAAO,eAAc;AAErB,MAAMC,YAAY;AAUlB,OAAO,MAAMC,eAAmC,CAAC,EAC/CC,MAAM,EACNC,QAAQ,EACRC,UAAU,EACVC,WAAW,EACXC,GAAG,EACJ;IACC,MAAM,EAAEC,IAAI,EAAE,GAAGR;IACjB,MAAM,CAACS,YAAYC,cAAc,GAAGb,SAASc;IAE7C,MAAMC,OAAO;QACX,sDAAsD;WAClDP,aAAaA,WAAWQ,KAAK,CAAC,KAAKC,KAAK,CAAC,GAAG,CAAC,KAAK,EAAE;WACpDnB,WAAWY,OAAO;YAACA,IAAIQ,IAAI;SAAC,GAAG,EAAE;KACtC;IAED,MAAMC,iBAAiBP,aAAa;IAEpC,QACGb,MAAMqB,SAAS;MACd,CAAClB,iBAAiBmB,QAAQX,IAAIW,MAAM,EAAEN,MAAMA,MAAMF,eAAeA,gBAAiB;MAClF,CAACS,OACCC,WAAW;QACTnB;QACAe,kBAAkB,GAAGf,UAAU,WAAW,CAAC;QAC3CG,YAAY,GAAGH,UAAU,QAAQ,CAAC;QAClCE,UAAU,GAAGF,UAAU,QAAQ,CAAC;KACjC,CACEoB,MAAM,CAACC,SACPC,IAAI,CAAC,MACRC,SAASlB,aACTmB,KAAK,SACN;QACC,CAAClB,IAAImB,KAAK,GAAGhC,eAAea,IAAImB,KAAK,EAAElB,QAAQb,WAAWY,OAAOA,IAAIQ,IAAI,GAAG,GAAG;QAC/E,CAACC,mBAAmBlB,UAAU6B,OAAOlB,YAAYD,MAAMA,QAAS;MAClE,EAAEW,OAAO;IACX,EAAEvB,MAAMqB;AAEZ,EAAC"}
+{"version":3,"sources":["../../../../src/fields/Tabs/Tab/index.tsx"],"sourcesContent":["'use client'\n\nimport type { ClientTab } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { tabHasName } from 'payload/shared'\nimport React, { useState } from 'react'\n\nimport { ErrorPill } from '../../../elements/ErrorPill/index.js'\nimport { WatchChildErrors } from '../../../forms/WatchChildErrors/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport './index.scss'\n\nconst baseClass = 'tabs-field__tab-button'\n\ntype TabProps = {\n  readonly hidden?: boolean\n  readonly isActive?: boolean\n  readonly parentPath: string\n  readonly setIsActive: () => void\n  readonly tab: ClientTab\n}\n\nexport const TabComponent: React.FC<TabProps> = ({\n  hidden,\n  isActive,\n  parentPath,\n  setIsActive,\n  tab,\n}) => {\n  const { i18n } = useTranslation()\n  const [errorCount, setErrorCount] = useState(undefined)\n\n  const path = [\n    // removes parent 'tabs' path segment, i.e. `_index-0`\n    ...(parentPath ? parentPath.split('.').slice(0, -1) : []),\n    ...(tabHasName(tab) ? [tab.name] : []),\n  ]\n\n  const fieldHasErrors = errorCount > 0\n\n  return (\n    <React.Fragment>\n      <WatchChildErrors fields={tab.fields} path={path} setErrorCount={setErrorCount} />\n      <button\n        className={[\n          baseClass,\n          fieldHasErrors && `${baseClass}--has-error`,\n          isActive && `${baseClass}--active`,\n          hidden && `${baseClass}--hidden`,\n        ]\n          .filter(Boolean)\n          .join(' ')}\n        onClick={setIsActive}\n        type=\"button\"\n      >\n        {tab.label ? getTranslation(tab.label, i18n) : tabHasName(tab) ? tab.name : ''}\n        {fieldHasErrors && <ErrorPill count={errorCount} i18n={i18n} />}\n      </button>\n    </React.Fragment>\n  )\n}\n"],"names":["getTranslation","tabHasName","React","useState","ErrorPill","WatchChildErrors","useTranslation","baseClass","TabComponent","hidden","isActive","parentPath","setIsActive","tab","i18n","errorCount","setErrorCount","undefined","path","split","slice","name","fieldHasErrors","Fragment","fields","button","className","filter","Boolean","join","onClick","type","label","count"],"mappings":"AAAA;;AAIA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,SAASC,UAAU,QAAQ,iBAAgB;AAC3C,OAAOC,SAASC,QAAQ,QAAQ,QAAO;AAEvC,SAASC,SAAS,QAAQ,uCAAsC;AAChE,SAASC,gBAAgB,QAAQ,2CAA0C;AAC3E,SAASC,cAAc,QAAQ,0CAAyC;AACxE,OAAO,eAAc;AAErB,MAAMC,YAAY;AAUlB,OAAO,MAAMC,eAAmC,CAAC,EAC/CC,MAAM,EACNC,QAAQ,EACRC,UAAU,EACVC,WAAW,EACXC,GAAG,EACJ;IACC,MAAM,EAAEC,IAAI,EAAE,GAAGR;IACjB,MAAM,CAACS,YAAYC,cAAc,GAAGb,SAASc;IAE7C,MAAMC,OAAO;QACX,sDAAsD;WAClDP,aAAaA,WAAWQ,KAAK,CAAC,KAAKC,KAAK,CAAC,GAAG,CAAC,KAAK,EAAE;WACpDnB,WAAWY,OAAO;YAACA,IAAIQ,IAAI;SAAC,GAAG,EAAE;KACtC;IAED,MAAMC,iBAAiBP,aAAa;IAEpC,qBACE,QAACb,MAAMqB,QAAQ;;0BACb,QAAClB;gBAAiBmB,QAAQX,IAAIW,MAAM;gBAAEN,MAAMA;gBAAMF,eAAeA;;;;;;0BACjE,QAACS;gBACCC,WAAW;oBACTnB;oBACAe,kBAAkB,GAAGf,UAAU,WAAW,CAAC;oBAC3CG,YAAY,GAAGH,UAAU,QAAQ,CAAC;oBAClCE,UAAU,GAAGF,UAAU,QAAQ,CAAC;iBACjC,CACEoB,MAAM,CAACC,SACPC,IAAI,CAAC;gBACRC,SAASlB;gBACTmB,MAAK;;oBAEJlB,IAAImB,KAAK,GAAGhC,eAAea,IAAImB,KAAK,EAAElB,QAAQb,WAAWY,OAAOA,IAAIQ,IAAI,GAAG;oBAC3EC,gCAAkB,QAAClB;wBAAU6B,OAAOlB;wBAAYD,MAAMA;;;;;;;;;;;;;;;;;;AAI/D,EAAC"}

package/dist/fields/Tabs/index.js

@@ -1,7 +1,8 @@
 'use client';
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import { getTranslation } from '@payloadcms/translations';
 import { tabHasName, toKebabCase } from 'payload/shared';
-import { useCallback, useEffect, useState } from 'react';
+import React, { useCallback, useEffect, useState } from 'react';
 import { useCollapsible } from '../../elements/Collapsible/provider.js';
 import { RenderCustomComponent } from '../../elements/RenderCustomComponent/index.js';
 import { useFormFields } from '../../forms/Form/index.js';
@@ -147,26 +148,77 @@ const TabsFieldComponent = (props)=>{
         tabStates,
         handleTabChange
     ]);
-    return <div className={[
-        fieldBaseClass,
-        className,
-        baseClass,
-        isWithinCollapsible && `${baseClass}--within-collapsible`,
-        !hasVisibleTabs && `${baseClass}--hidden`
-    ].filter(Boolean).join(' ')}>
-      <TabsProvider>
-        <div className={`${baseClass}__tabs-wrap`}>
-          <div className={`${baseClass}__tabs`}>
-            {tabStates.map(({ index, passesCondition, tab })=><TabComponent hidden={!passesCondition} isActive={activeTabIndex === index} key={index} parentPath={path} setIsActive={()=>{
-            void handleTabChange(index);
-        }} tab={tab}/>)}
-          </div>
-        </div>
-        <div className={`${baseClass}__content-wrap`}>
-          {activeTabConfig && <TabContent description={activeTabStaticDescription} fields={activeTabConfig.fields} forceRender={forceRender} hidden={false} parentIndexPath={tabHasName(activeTabConfig) ? '' : `${indexPath ? indexPath + '-' : ''}` + String(activeTabInfo.index)} parentPath={activePathChildrenPath} parentSchemaPath={activePathSchemaChildrenPath} path={activeTabPath} permissions={permissions && typeof permissions === 'object' && 'name' in activeTabConfig ? permissions[activeTabConfig.name] && typeof permissions[activeTabConfig.name] === 'object' && 'fields' in permissions[activeTabConfig.name] ? permissions[activeTabConfig.name].fields : permissions[activeTabConfig.name] : permissions} readOnly={readOnly}/>}
-        </div>
-      </TabsProvider>
-    </div>;
+    return /*#__PURE__*/ _jsxDEV("div", {
+        className: [
+            fieldBaseClass,
+            className,
+            baseClass,
+            isWithinCollapsible && `${baseClass}--within-collapsible`,
+            !hasVisibleTabs && `${baseClass}--hidden`
+        ].filter(Boolean).join(' '),
+        children: /*#__PURE__*/ _jsxDEV(TabsProvider, {
+            children: [
+                /*#__PURE__*/ _jsxDEV("div", {
+                    className: `${baseClass}__tabs-wrap`,
+                    children: /*#__PURE__*/ _jsxDEV("div", {
+                        className: `${baseClass}__tabs`,
+                        children: tabStates.map(({ index, passesCondition, tab })=>/*#__PURE__*/ _jsxDEV(TabComponent, {
+                                hidden: !passesCondition,
+                                isActive: activeTabIndex === index,
+                                parentPath: path,
+                                setIsActive: ()=>{
+                                    void handleTabChange(index);
+                                },
+                                tab: tab
+                            }, index, false, {
+                                fileName: "src/fields/Tabs/index.tsx",
+                                lineNumber: 202,
+                                columnNumber: 15
+                            }, this))
+                    }, void 0, false, {
+                        fileName: "src/fields/Tabs/index.tsx",
+                        lineNumber: 200,
+                        columnNumber: 11
+                    }, this)
+                }, void 0, false, {
+                    fileName: "src/fields/Tabs/index.tsx",
+                    lineNumber: 199,
+                    columnNumber: 9
+                }, this),
+                /*#__PURE__*/ _jsxDEV("div", {
+                    className: `${baseClass}__content-wrap`,
+                    children: activeTabConfig && /*#__PURE__*/ _jsxDEV(TabContent, {
+                        description: activeTabStaticDescription,
+                        fields: activeTabConfig.fields,
+                        forceRender: forceRender,
+                        hidden: false,
+                        parentIndexPath: tabHasName(activeTabConfig) ? '' : `${indexPath ? indexPath + '-' : ''}` + String(activeTabInfo.index),
+                        parentPath: activePathChildrenPath,
+                        parentSchemaPath: activePathSchemaChildrenPath,
+                        path: activeTabPath,
+                        permissions: permissions && typeof permissions === 'object' && 'name' in activeTabConfig ? permissions[activeTabConfig.name] && typeof permissions[activeTabConfig.name] === 'object' && 'fields' in permissions[activeTabConfig.name] ? permissions[activeTabConfig.name].fields : permissions[activeTabConfig.name] : permissions,
+                        readOnly: readOnly
+                    }, void 0, false, {
+                        fileName: "src/fields/Tabs/index.tsx",
+                        lineNumber: 217,
+                        columnNumber: 13
+                    }, this)
+                }, void 0, false, {
+                    fileName: "src/fields/Tabs/index.tsx",
+                    lineNumber: 215,
+                    columnNumber: 9
+                }, this)
+            ]
+        }, void 0, true, {
+            fileName: "src/fields/Tabs/index.tsx",
+            lineNumber: 198,
+            columnNumber: 7
+        }, this)
+    }, void 0, false, {
+        fileName: "src/fields/Tabs/index.tsx",
+        lineNumber: 187,
+        columnNumber: 5
+    }, this);
 };
 export const TabsField = withCondition(TabsFieldComponent);
 function TabContent({ description, fields, forceRender, hidden, label, parentIndexPath, parentPath, parentSchemaPath, permissions, readOnly }) {
@@ -175,16 +227,50 @@ function TabContent({ description, fields, forceRender, hidden, label, parentInd
     if (Field) {
         return Field;
     }
-    return <div className={[
-        hidden && `${baseClass}__tab--hidden`,
-        `${baseClass}__tab`,
-        label && `${baseClass}__tabConfigLabel-${toKebabCase(getTranslation(label, i18n))}`
-    ].filter(Boolean).join(' ')}>
-      <RenderCustomComponent CustomComponent={Description} Fallback={<FieldDescription description={description} marginPlacement="bottom" path={path}/>}/>
-      {BeforeInput}
-      <RenderFields fields={fields} forceRender={forceRender} parentIndexPath={parentIndexPath} parentPath={parentPath} parentSchemaPath={parentSchemaPath} permissions={permissions} readOnly={readOnly}/>
-      {AfterInput}
-    </div>;
+    return /*#__PURE__*/ _jsxDEV("div", {
+        className: [
+            hidden && `${baseClass}__tab--hidden`,
+            `${baseClass}__tab`,
+            label && `${baseClass}__tabConfigLabel-${toKebabCase(getTranslation(label, i18n))}`
+        ].filter(Boolean).join(' '),
+        children: [
+            /*#__PURE__*/ _jsxDEV(RenderCustomComponent, {
+                CustomComponent: Description,
+                Fallback: /*#__PURE__*/ _jsxDEV(FieldDescription, {
+                    description: description,
+                    marginPlacement: "bottom",
+                    path: path
+                }, void 0, false, {
+                    fileName: "src/fields/Tabs/index.tsx",
+                    lineNumber: 297,
+                    columnNumber: 11
+                }, void 0)
+            }, void 0, false, {
+                fileName: "src/fields/Tabs/index.tsx",
+                lineNumber: 294,
+                columnNumber: 7
+            }, this),
+            BeforeInput,
+            /*#__PURE__*/ _jsxDEV(RenderFields, {
+                fields: fields,
+                forceRender: forceRender,
+                parentIndexPath: parentIndexPath,
+                parentPath: parentPath,
+                parentSchemaPath: parentSchemaPath,
+                permissions: permissions,
+                readOnly: readOnly
+            }, void 0, false, {
+                fileName: "src/fields/Tabs/index.tsx",
+                lineNumber: 301,
+                columnNumber: 7
+            }, this),
+            AfterInput
+        ]
+    }, void 0, true, {
+        fileName: "src/fields/Tabs/index.tsx",
+        lineNumber: 285,
+        columnNumber: 5
+    }, this);
 }
 
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/fields/Tabs/index.tsx"],"sourcesContent":["'use client'\nimport type {\n  ClientComponentProps,\n  ClientField,\n  ClientTab,\n  DocumentPreferences,\n  SanitizedFieldPermissions,\n  StaticDescription,\n  TabsFieldClientComponent,\n} from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { tabHasName, toKebabCase } from 'payload/shared'\nimport React, { useCallback, useEffect, useState } from 'react'\n\nimport { useCollapsible } from '../../elements/Collapsible/provider.js'\nimport { RenderCustomComponent } from '../../elements/RenderCustomComponent/index.js'\nimport { useFormFields } from '../../forms/Form/index.js'\nimport { RenderFields } from '../../forms/RenderFields/index.js'\nimport { useField } from '../../forms/useField/index.js'\nimport { withCondition } from '../../forms/withCondition/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { usePreferences } from '../../providers/Preferences/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { FieldDescription } from '../FieldDescription/index.js'\nimport { fieldBaseClass } from '../shared/index.js'\nimport { TabsProvider } from './provider.js'\nimport { TabComponent } from './Tab/index.js'\nimport './index.scss'\n\nconst baseClass = 'tabs-field'\n\nexport { TabsProvider }\n\nfunction generateTabPath({ activeTabConfig, path }: { activeTabConfig: ClientTab; path: string }) {\n  let tabPath = path\n\n  if (tabHasName(activeTabConfig) && activeTabConfig.name) {\n    if (path) {\n      tabPath = `${path}.${activeTabConfig.name}`\n    } else {\n      tabPath = activeTabConfig.name\n    }\n  }\n\n  return tabPath\n}\n\nconst TabsFieldComponent: TabsFieldClientComponent = (props) => {\n  const {\n    field: { admin: { className } = {}, tabs = [] },\n    forceRender = false,\n    indexPath = '',\n    parentPath = '',\n    parentSchemaPath = '',\n    path = '',\n    permissions,\n    readOnly,\n  } = props\n\n  const { getPreference, setPreference } = usePreferences()\n  const { preferencesKey } = useDocumentInfo()\n  const { i18n } = useTranslation()\n  const { isWithinCollapsible } = useCollapsible()\n\n  const tabStates = useFormFields(([fields]) => {\n    return tabs.map((tab, index) => {\n      const id = tab?.id\n\n      return {\n        index,\n        passesCondition: fields?.[id]?.passesCondition ?? true,\n        tab,\n      }\n    })\n  })\n\n  const [activeTabIndex, setActiveTabIndex] = useState<number>(\n    () => tabStates.filter(({ passesCondition }) => passesCondition)?.[0]?.index ?? 0,\n  )\n\n  const tabsPrefKey = `tabs-${indexPath}`\n  const [activeTabPath, setActiveTabPath] = useState<string>(() =>\n    generateTabPath({ activeTabConfig: tabs[activeTabIndex], path: parentPath }),\n  )\n\n  const [activeTabSchemaPath, setActiveTabSchemaPath] = useState<string>(() =>\n    generateTabPath({ activeTabConfig: tabs[0], path: parentSchemaPath }),\n  )\n\n  const activePathChildrenPath = tabHasName(tabs[activeTabIndex]) ? activeTabPath : parentPath\n  const activeTabInfo = tabStates[activeTabIndex]\n  const activeTabConfig = activeTabInfo?.tab\n  const activePathSchemaChildrenPath = tabHasName(tabs[activeTabIndex])\n    ? activeTabSchemaPath\n    : parentSchemaPath\n\n  const activeTabDescription = activeTabConfig.admin?.description ?? activeTabConfig.description\n\n  const activeTabStaticDescription =\n    typeof activeTabDescription === 'function'\n      ? activeTabDescription({ i18n, t: i18n.t })\n      : activeTabDescription\n\n  const hasVisibleTabs = tabStates.some(({ passesCondition }) => passesCondition)\n\n  const handleTabChange = useCallback(\n    async (incomingTabIndex: number): Promise<void> => {\n      setActiveTabIndex(incomingTabIndex)\n\n      setActiveTabPath(\n        generateTabPath({ activeTabConfig: tabs[incomingTabIndex], path: parentPath }),\n      )\n      setActiveTabSchemaPath(\n        generateTabPath({ activeTabConfig: tabs[incomingTabIndex], path: parentSchemaPath }),\n      )\n\n      const existingPreferences: DocumentPreferences = await getPreference(preferencesKey)\n\n      if (preferencesKey) {\n        void setPreference(preferencesKey, {\n          ...existingPreferences,\n          ...(path\n            ? {\n                fields: {\n                  ...(existingPreferences?.fields || {}),\n                  [path]: {\n                    ...existingPreferences?.fields?.[path],\n                    tabIndex: incomingTabIndex,\n                  },\n                },\n              }\n            : {\n                fields: {\n                  ...existingPreferences?.fields,\n                  [tabsPrefKey]: {\n                    ...existingPreferences?.fields?.[tabsPrefKey],\n                    tabIndex: incomingTabIndex,\n                  },\n                },\n              }),\n        })\n      }\n    },\n    [\n      tabs,\n      parentPath,\n      parentSchemaPath,\n      getPreference,\n      preferencesKey,\n      setPreference,\n      path,\n      tabsPrefKey,\n    ],\n  )\n\n  useEffect(() => {\n    if (preferencesKey) {\n      const getInitialPref = async () => {\n        const existingPreferences: DocumentPreferences = await getPreference(preferencesKey)\n        const initialIndex = path\n          ? existingPreferences?.fields?.[path]?.tabIndex\n          : existingPreferences?.fields?.[tabsPrefKey]?.tabIndex\n\n        const newIndex = initialIndex || 0\n        setActiveTabIndex(newIndex)\n\n        setActiveTabPath(generateTabPath({ activeTabConfig: tabs[newIndex], path: parentPath }))\n        setActiveTabSchemaPath(\n          generateTabPath({ activeTabConfig: tabs[newIndex], path: parentSchemaPath }),\n        )\n      }\n      void getInitialPref()\n    }\n  }, [path, getPreference, preferencesKey, tabsPrefKey, tabs, parentPath, parentSchemaPath])\n\n  useEffect(() => {\n    if (activeTabInfo?.passesCondition === false) {\n      const nextTab = tabStates.find(({ passesCondition }) => passesCondition)\n      if (nextTab) {\n        void handleTabChange(nextTab.index)\n      }\n    }\n  }, [activeTabInfo, tabStates, handleTabChange])\n\n  return (\n    <div\n      className={[\n        fieldBaseClass,\n        className,\n        baseClass,\n        isWithinCollapsible && `${baseClass}--within-collapsible`,\n        !hasVisibleTabs && `${baseClass}--hidden`,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      <TabsProvider>\n        <div className={`${baseClass}__tabs-wrap`}>\n          <div className={`${baseClass}__tabs`}>\n            {tabStates.map(({ index, passesCondition, tab }) => (\n              <TabComponent\n                hidden={!passesCondition}\n                isActive={activeTabIndex === index}\n                key={index}\n                parentPath={path}\n                setIsActive={() => {\n                  void handleTabChange(index)\n                }}\n                tab={tab}\n              />\n            ))}\n          </div>\n        </div>\n        <div className={`${baseClass}__content-wrap`}>\n          {activeTabConfig && (\n            <TabContent\n              description={activeTabStaticDescription}\n              fields={activeTabConfig.fields}\n              forceRender={forceRender}\n              hidden={false}\n              parentIndexPath={\n                tabHasName(activeTabConfig)\n                  ? ''\n                  : `${indexPath ? indexPath + '-' : ''}` + String(activeTabInfo.index)\n              }\n              parentPath={activePathChildrenPath}\n              parentSchemaPath={activePathSchemaChildrenPath}\n              path={activeTabPath}\n              permissions={\n                permissions && typeof permissions === 'object' && 'name' in activeTabConfig\n                  ? permissions[activeTabConfig.name] &&\n                    typeof permissions[activeTabConfig.name] === 'object' &&\n                    'fields' in permissions[activeTabConfig.name]\n                    ? permissions[activeTabConfig.name].fields\n                    : permissions[activeTabConfig.name]\n                  : permissions\n              }\n              readOnly={readOnly}\n            />\n          )}\n        </div>\n      </TabsProvider>\n    </div>\n  )\n}\n\nexport const TabsField = withCondition(TabsFieldComponent)\n\ntype ActiveTabProps = {\n  readonly description: StaticDescription\n  readonly fields: ClientField[]\n  readonly hidden: boolean\n  readonly label?: string\n  readonly parentIndexPath: string\n  readonly parentPath: string\n  readonly parentSchemaPath: string\n  readonly path: string\n  readonly permissions: SanitizedFieldPermissions\n  readonly readOnly: boolean\n} & Pick<ClientComponentProps, 'forceRender'>\n\nfunction TabContent({\n  description,\n  fields,\n  forceRender,\n  hidden,\n  label,\n  parentIndexPath,\n  parentPath,\n  parentSchemaPath,\n  permissions,\n  readOnly,\n}: ActiveTabProps) {\n  const { i18n } = useTranslation()\n\n  const { customComponents: { AfterInput, BeforeInput, Description, Field } = {}, path } =\n    useField()\n\n  if (Field) {\n    return Field\n  }\n\n  return (\n    <div\n      className={[\n        hidden && `${baseClass}__tab--hidden`,\n        `${baseClass}__tab`,\n        label && `${baseClass}__tabConfigLabel-${toKebabCase(getTranslation(label, i18n))}`,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      <RenderCustomComponent\n        CustomComponent={Description}\n        Fallback={\n          <FieldDescription description={description} marginPlacement=\"bottom\" path={path} />\n        }\n      />\n      {BeforeInput}\n      <RenderFields\n        fields={fields}\n        forceRender={forceRender}\n        parentIndexPath={parentIndexPath}\n        parentPath={parentPath}\n        parentSchemaPath={parentSchemaPath}\n        permissions={permissions}\n        readOnly={readOnly}\n      />\n      {AfterInput}\n    </div>\n  )\n}\n"],"names":["getTranslation","tabHasName","toKebabCase","useCallback","useEffect","useState","useCollapsible","RenderCustomComponent","useFormFields","RenderFields","useField","withCondition","useDocumentInfo","usePreferences","useTranslation","FieldDescription","fieldBaseClass","TabsProvider","TabComponent","baseClass","generateTabPath","activeTabConfig","path","tabPath","name","TabsFieldComponent","props","field","admin","className","tabs","forceRender","indexPath","parentPath","parentSchemaPath","permissions","readOnly","getPreference","setPreference","preferencesKey","i18n","isWithinCollapsible","tabStates","fields","map","tab","index","id","passesCondition","activeTabIndex","setActiveTabIndex","filter","tabsPrefKey","activeTabPath","setActiveTabPath","activeTabSchemaPath","setActiveTabSchemaPath","activePathChildrenPath","activeTabInfo","activePathSchemaChildrenPath","activeTabDescription","description","activeTabStaticDescription","t","hasVisibleTabs","some","handleTabChange","incomingTabIndex","existingPreferences","tabIndex","getInitialPref","initialIndex","newIndex","nextTab","find","div","Boolean","join","hidden","isActive","key","setIsActive","TabContent","parentIndexPath","String","TabsField","label","customComponents","AfterInput","BeforeInput","Description","Field","CustomComponent","Fallback","marginPlacement"],"mappings":"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"}
+{"version":3,"sources":["../../../src/fields/Tabs/index.tsx"],"sourcesContent":["'use client'\nimport type {\n  ClientComponentProps,\n  ClientField,\n  ClientTab,\n  DocumentPreferences,\n  SanitizedFieldPermissions,\n  StaticDescription,\n  TabsFieldClientComponent,\n} from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { tabHasName, toKebabCase } from 'payload/shared'\nimport React, { useCallback, useEffect, useState } from 'react'\n\nimport { useCollapsible } from '../../elements/Collapsible/provider.js'\nimport { RenderCustomComponent } from '../../elements/RenderCustomComponent/index.js'\nimport { useFormFields } from '../../forms/Form/index.js'\nimport { RenderFields } from '../../forms/RenderFields/index.js'\nimport { useField } from '../../forms/useField/index.js'\nimport { withCondition } from '../../forms/withCondition/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { usePreferences } from '../../providers/Preferences/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { FieldDescription } from '../FieldDescription/index.js'\nimport { fieldBaseClass } from '../shared/index.js'\nimport { TabsProvider } from './provider.js'\nimport { TabComponent } from './Tab/index.js'\nimport './index.scss'\n\nconst baseClass = 'tabs-field'\n\nexport { TabsProvider }\n\nfunction generateTabPath({ activeTabConfig, path }: { activeTabConfig: ClientTab; path: string }) {\n  let tabPath = path\n\n  if (tabHasName(activeTabConfig) && activeTabConfig.name) {\n    if (path) {\n      tabPath = `${path}.${activeTabConfig.name}`\n    } else {\n      tabPath = activeTabConfig.name\n    }\n  }\n\n  return tabPath\n}\n\nconst TabsFieldComponent: TabsFieldClientComponent = (props) => {\n  const {\n    field: { admin: { className } = {}, tabs = [] },\n    forceRender = false,\n    indexPath = '',\n    parentPath = '',\n    parentSchemaPath = '',\n    path = '',\n    permissions,\n    readOnly,\n  } = props\n\n  const { getPreference, setPreference } = usePreferences()\n  const { preferencesKey } = useDocumentInfo()\n  const { i18n } = useTranslation()\n  const { isWithinCollapsible } = useCollapsible()\n\n  const tabStates = useFormFields(([fields]) => {\n    return tabs.map((tab, index) => {\n      const id = tab?.id\n\n      return {\n        index,\n        passesCondition: fields?.[id]?.passesCondition ?? true,\n        tab,\n      }\n    })\n  })\n\n  const [activeTabIndex, setActiveTabIndex] = useState<number>(\n    () => tabStates.filter(({ passesCondition }) => passesCondition)?.[0]?.index ?? 0,\n  )\n\n  const tabsPrefKey = `tabs-${indexPath}`\n  const [activeTabPath, setActiveTabPath] = useState<string>(() =>\n    generateTabPath({ activeTabConfig: tabs[activeTabIndex], path: parentPath }),\n  )\n\n  const [activeTabSchemaPath, setActiveTabSchemaPath] = useState<string>(() =>\n    generateTabPath({ activeTabConfig: tabs[0], path: parentSchemaPath }),\n  )\n\n  const activePathChildrenPath = tabHasName(tabs[activeTabIndex]) ? activeTabPath : parentPath\n  const activeTabInfo = tabStates[activeTabIndex]\n  const activeTabConfig = activeTabInfo?.tab\n  const activePathSchemaChildrenPath = tabHasName(tabs[activeTabIndex])\n    ? activeTabSchemaPath\n    : parentSchemaPath\n\n  const activeTabDescription = activeTabConfig.admin?.description ?? activeTabConfig.description\n\n  const activeTabStaticDescription =\n    typeof activeTabDescription === 'function'\n      ? activeTabDescription({ i18n, t: i18n.t })\n      : activeTabDescription\n\n  const hasVisibleTabs = tabStates.some(({ passesCondition }) => passesCondition)\n\n  const handleTabChange = useCallback(\n    async (incomingTabIndex: number): Promise<void> => {\n      setActiveTabIndex(incomingTabIndex)\n\n      setActiveTabPath(\n        generateTabPath({ activeTabConfig: tabs[incomingTabIndex], path: parentPath }),\n      )\n      setActiveTabSchemaPath(\n        generateTabPath({ activeTabConfig: tabs[incomingTabIndex], path: parentSchemaPath }),\n      )\n\n      const existingPreferences: DocumentPreferences = await getPreference(preferencesKey)\n\n      if (preferencesKey) {\n        void setPreference(preferencesKey, {\n          ...existingPreferences,\n          ...(path\n            ? {\n                fields: {\n                  ...(existingPreferences?.fields || {}),\n                  [path]: {\n                    ...existingPreferences?.fields?.[path],\n                    tabIndex: incomingTabIndex,\n                  },\n                },\n              }\n            : {\n                fields: {\n                  ...existingPreferences?.fields,\n                  [tabsPrefKey]: {\n                    ...existingPreferences?.fields?.[tabsPrefKey],\n                    tabIndex: incomingTabIndex,\n                  },\n                },\n              }),\n        })\n      }\n    },\n    [\n      tabs,\n      parentPath,\n      parentSchemaPath,\n      getPreference,\n      preferencesKey,\n      setPreference,\n      path,\n      tabsPrefKey,\n    ],\n  )\n\n  useEffect(() => {\n    if (preferencesKey) {\n      const getInitialPref = async () => {\n        const existingPreferences: DocumentPreferences = await getPreference(preferencesKey)\n        const initialIndex = path\n          ? existingPreferences?.fields?.[path]?.tabIndex\n          : existingPreferences?.fields?.[tabsPrefKey]?.tabIndex\n\n        const newIndex = initialIndex || 0\n        setActiveTabIndex(newIndex)\n\n        setActiveTabPath(generateTabPath({ activeTabConfig: tabs[newIndex], path: parentPath }))\n        setActiveTabSchemaPath(\n          generateTabPath({ activeTabConfig: tabs[newIndex], path: parentSchemaPath }),\n        )\n      }\n      void getInitialPref()\n    }\n  }, [path, getPreference, preferencesKey, tabsPrefKey, tabs, parentPath, parentSchemaPath])\n\n  useEffect(() => {\n    if (activeTabInfo?.passesCondition === false) {\n      const nextTab = tabStates.find(({ passesCondition }) => passesCondition)\n      if (nextTab) {\n        void handleTabChange(nextTab.index)\n      }\n    }\n  }, [activeTabInfo, tabStates, handleTabChange])\n\n  return (\n    <div\n      className={[\n        fieldBaseClass,\n        className,\n        baseClass,\n        isWithinCollapsible && `${baseClass}--within-collapsible`,\n        !hasVisibleTabs && `${baseClass}--hidden`,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      <TabsProvider>\n        <div className={`${baseClass}__tabs-wrap`}>\n          <div className={`${baseClass}__tabs`}>\n            {tabStates.map(({ index, passesCondition, tab }) => (\n              <TabComponent\n                hidden={!passesCondition}\n                isActive={activeTabIndex === index}\n                key={index}\n                parentPath={path}\n                setIsActive={() => {\n                  void handleTabChange(index)\n                }}\n                tab={tab}\n              />\n            ))}\n          </div>\n        </div>\n        <div className={`${baseClass}__content-wrap`}>\n          {activeTabConfig && (\n            <TabContent\n              description={activeTabStaticDescription}\n              fields={activeTabConfig.fields}\n              forceRender={forceRender}\n              hidden={false}\n              parentIndexPath={\n                tabHasName(activeTabConfig)\n                  ? ''\n                  : `${indexPath ? indexPath + '-' : ''}` + String(activeTabInfo.index)\n              }\n              parentPath={activePathChildrenPath}\n              parentSchemaPath={activePathSchemaChildrenPath}\n              path={activeTabPath}\n              permissions={\n                permissions && typeof permissions === 'object' && 'name' in activeTabConfig\n                  ? permissions[activeTabConfig.name] &&\n                    typeof permissions[activeTabConfig.name] === 'object' &&\n                    'fields' in permissions[activeTabConfig.name]\n                    ? permissions[activeTabConfig.name].fields\n                    : permissions[activeTabConfig.name]\n                  : permissions\n              }\n              readOnly={readOnly}\n            />\n          )}\n        </div>\n      </TabsProvider>\n    </div>\n  )\n}\n\nexport const TabsField = withCondition(TabsFieldComponent)\n\ntype ActiveTabProps = {\n  readonly description: StaticDescription\n  readonly fields: ClientField[]\n  readonly hidden: boolean\n  readonly label?: string\n  readonly parentIndexPath: string\n  readonly parentPath: string\n  readonly parentSchemaPath: string\n  readonly path: string\n  readonly permissions: SanitizedFieldPermissions\n  readonly readOnly: boolean\n} & Pick<ClientComponentProps, 'forceRender'>\n\nfunction TabContent({\n  description,\n  fields,\n  forceRender,\n  hidden,\n  label,\n  parentIndexPath,\n  parentPath,\n  parentSchemaPath,\n  permissions,\n  readOnly,\n}: ActiveTabProps) {\n  const { i18n } = useTranslation()\n\n  const { customComponents: { AfterInput, BeforeInput, Description, Field } = {}, path } =\n    useField()\n\n  if (Field) {\n    return Field\n  }\n\n  return (\n    <div\n      className={[\n        hidden && `${baseClass}__tab--hidden`,\n        `${baseClass}__tab`,\n        label && `${baseClass}__tabConfigLabel-${toKebabCase(getTranslation(label, i18n))}`,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      <RenderCustomComponent\n        CustomComponent={Description}\n        Fallback={\n          <FieldDescription description={description} marginPlacement=\"bottom\" path={path} />\n        }\n      />\n      {BeforeInput}\n      <RenderFields\n        fields={fields}\n        forceRender={forceRender}\n        parentIndexPath={parentIndexPath}\n        parentPath={parentPath}\n        parentSchemaPath={parentSchemaPath}\n        permissions={permissions}\n        readOnly={readOnly}\n      />\n      {AfterInput}\n    </div>\n  )\n}\n"],"names":["getTranslation","tabHasName","toKebabCase","React","useCallback","useEffect","useState","useCollapsible","RenderCustomComponent","useFormFields","RenderFields","useField","withCondition","useDocumentInfo","usePreferences","useTranslation","FieldDescription","fieldBaseClass","TabsProvider","TabComponent","baseClass","generateTabPath","activeTabConfig","path","tabPath","name","TabsFieldComponent","props","field","admin","className","tabs","forceRender","indexPath","parentPath","parentSchemaPath","permissions","readOnly","getPreference","setPreference","preferencesKey","i18n","isWithinCollapsible","tabStates","fields","map","tab","index","id","passesCondition","activeTabIndex","setActiveTabIndex","filter","tabsPrefKey","activeTabPath","setActiveTabPath","activeTabSchemaPath","setActiveTabSchemaPath","activePathChildrenPath","activeTabInfo","activePathSchemaChildrenPath","activeTabDescription","description","activeTabStaticDescription","t","hasVisibleTabs","some","handleTabChange","incomingTabIndex","existingPreferences","tabIndex","getInitialPref","initialIndex","newIndex","nextTab","find","div","Boolean","join","hidden","isActive","setIsActive","TabContent","parentIndexPath","String","TabsField","label","customComponents","AfterInput","BeforeInput","Description","Field","CustomComponent","Fallback","marginPlacement"],"mappings":"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"}

package/dist/fields/Tabs/provider.js

@@ -1,8 +1,16 @@
 'use client';
-import { createContext, use } from 'react';
-const Context = createContext(false);
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
+import React, { createContext, use } from 'react';
+const Context = /*#__PURE__*/ createContext(false);
 export const TabsProvider = ({ children, withinTab = true })=>{
-    return <Context value={withinTab}>{children}</Context>;
+    return /*#__PURE__*/ _jsxDEV(Context, {
+        value: withinTab,
+        children: children
+    }, void 0, false, {
+        fileName: "src/fields/Tabs/provider.tsx",
+        lineNumber: 10,
+        columnNumber: 10
+    }, this);
 };
 export const useTabs = ()=>use(Context);
 

package/dist/fields/Tabs/provider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/fields/Tabs/provider.tsx"],"sourcesContent":["'use client'\nimport React, { createContext, use } from 'react'\n\nconst Context = createContext(false)\n\nexport const TabsProvider: React.FC<{ children?: React.ReactNode; withinTab?: boolean }> = ({\n  children,\n  withinTab = true,\n}) => {\n  return <Context value={withinTab}>{children}</Context>\n}\n\nexport const useTabs = (): boolean => use(Context)\n"],"names":["createContext","use","Context","TabsProvider","children","withinTab","value","useTabs"],"mappings":"AAAA;AACA,SAAgBA,aAAa,EAAEC,GAAG,QAAQ,QAAO;AAEjD,MAAMC,UAAUF,cAAc;AAE9B,OAAO,MAAMG,eAA8E,CAAC,EAC1FC,QAAQ,EACRC,YAAY,IAAI,EACjB;IACC,QAAQH,QAAQI,OAAOD,YAAYD,WAAWF;AAChD,EAAC;AAED,OAAO,MAAMK,UAAU,IAAeN,IAAIC,SAAQ"}
+{"version":3,"sources":["../../../src/fields/Tabs/provider.tsx"],"sourcesContent":["'use client'\nimport React, { createContext, use } from 'react'\n\nconst Context = createContext(false)\n\nexport const TabsProvider: React.FC<{ children?: React.ReactNode; withinTab?: boolean }> = ({\n  children,\n  withinTab = true,\n}) => {\n  return <Context value={withinTab}>{children}</Context>\n}\n\nexport const useTabs = (): boolean => use(Context)\n"],"names":["React","createContext","use","Context","TabsProvider","children","withinTab","value","useTabs"],"mappings":"AAAA;;AACA,OAAOA,SAASC,aAAa,EAAEC,GAAG,QAAQ,QAAO;AAEjD,MAAMC,wBAAUF,cAAc;AAE9B,OAAO,MAAMG,eAA8E,CAAC,EAC1FC,QAAQ,EACRC,YAAY,IAAI,EACjB;IACC,qBAAO,QAACH;QAAQI,OAAOD;kBAAYD;;;;;;AACrC,EAAC;AAED,OAAO,MAAMG,UAAU,IAAeN,IAAIC,SAAQ"}

package/dist/fields/Text/Input.js

@@ -1,5 +1,7 @@
 'use client';
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import { getTranslation } from '@payloadcms/translations';
+import React from 'react';
 import { ReactSelect } from '../../elements/ReactSelect/index.js';
 import { RenderCustomComponent } from '../../elements/RenderCustomComponent/index.js';
 import { FieldDescription } from '../../fields/FieldDescription/index.js';
@@ -49,37 +51,133 @@ export const TextInput = (props)=>{
         };
     };
     const placeholder = getTranslation(placeholderFromProps, i18n);
-    return <div className={[
-        fieldBaseClass,
-        'text',
-        className,
-        showError && 'error',
-        readOnly && 'read-only',
-        hasMany && 'has-many'
-    ].filter(Boolean).join(' ')} style={style}>
-      <RenderCustomComponent CustomComponent={Label} Fallback={<FieldLabel label={label} localized={localized} path={path} required={required}/>}/>
-      <div className={`${fieldBaseClass}__wrap`}>
-        <RenderCustomComponent CustomComponent={Error} Fallback={<FieldError path={path} showError={showError}/>}/>
-        {BeforeInput}
-        {hasMany ? <ReactSelect className={`field-${path.replace(/\./g, '__')}`} components={{
-        DropdownIndicator: null
-    }} customProps={{
-        editableProps
-    }} disabled={readOnly} // prevent adding additional options if maxRows is reached
-    filterOption={()=>!maxRows ? true : !(Array.isArray(value) && maxRows && value.length >= maxRows)} isClearable={false} isCreatable isMulti isSortable menuIsOpen={false} noOptionsMessage={()=>{
-        const isOverHasMany = Array.isArray(value) && value.length >= maxRows;
-        if (isOverHasMany) {
-            return t('validation:limitReached', {
-                max: maxRows,
-                value: value.length + 1
-            });
-        }
-        return null;
-    }} onChange={onChange} options={[]} placeholder={placeholder} showError={showError} value={valueToRender}/> : <input data-rtl={rtl} disabled={readOnly} id={`field-${path?.replace(/\./g, '__')}`} name={path} onChange={onChange} onKeyDown={onKeyDown} placeholder={placeholder} ref={inputRef} type="text" value={value || ''} {...htmlAttributes ?? {}}/>}
-        {AfterInput}
-        <RenderCustomComponent CustomComponent={Description} Fallback={<FieldDescription description={description} path={path}/>}/>
-      </div>
-    </div>;
+    return /*#__PURE__*/ _jsxDEV("div", {
+        className: [
+            fieldBaseClass,
+            'text',
+            className,
+            showError && 'error',
+            readOnly && 'read-only',
+            hasMany && 'has-many'
+        ].filter(Boolean).join(' '),
+        style: style,
+        children: [
+            /*#__PURE__*/ _jsxDEV(RenderCustomComponent, {
+                CustomComponent: Label,
+                Fallback: /*#__PURE__*/ _jsxDEV(FieldLabel, {
+                    label: label,
+                    localized: localized,
+                    path: path,
+                    required: required
+                }, void 0, false, {
+                    fileName: "src/fields/Text/Input.tsx",
+                    lineNumber: 113,
+                    columnNumber: 11
+                }, void 0)
+            }, void 0, false, {
+                fileName: "src/fields/Text/Input.tsx",
+                lineNumber: 110,
+                columnNumber: 7
+            }, this),
+            /*#__PURE__*/ _jsxDEV("div", {
+                className: `${fieldBaseClass}__wrap`,
+                children: [
+                    /*#__PURE__*/ _jsxDEV(RenderCustomComponent, {
+                        CustomComponent: Error,
+                        Fallback: /*#__PURE__*/ _jsxDEV(FieldError, {
+                            path: path,
+                            showError: showError
+                        }, void 0, false, {
+                            fileName: "src/fields/Text/Input.tsx",
+                            lineNumber: 119,
+                            columnNumber: 21
+                        }, void 0)
+                    }, void 0, false, {
+                        fileName: "src/fields/Text/Input.tsx",
+                        lineNumber: 117,
+                        columnNumber: 9
+                    }, this),
+                    BeforeInput,
+                    hasMany ? /*#__PURE__*/ _jsxDEV(ReactSelect, {
+                        className: `field-${path.replace(/\./g, '__')}`,
+                        components: {
+                            DropdownIndicator: null
+                        },
+                        customProps: {
+                            editableProps
+                        },
+                        disabled: readOnly,
+                        // prevent adding additional options if maxRows is reached
+                        filterOption: ()=>!maxRows ? true : !(Array.isArray(value) && maxRows && value.length >= maxRows),
+                        isClearable: false,
+                        isCreatable: true,
+                        isMulti: true,
+                        isSortable: true,
+                        menuIsOpen: false,
+                        noOptionsMessage: ()=>{
+                            const isOverHasMany = Array.isArray(value) && value.length >= maxRows;
+                            if (isOverHasMany) {
+                                return t('validation:limitReached', {
+                                    max: maxRows,
+                                    value: value.length + 1
+                                });
+                            }
+                            return null;
+                        },
+                        onChange: onChange,
+                        options: [],
+                        placeholder: placeholder,
+                        showError: showError,
+                        value: valueToRender
+                    }, void 0, false, {
+                        fileName: "src/fields/Text/Input.tsx",
+                        lineNumber: 123,
+                        columnNumber: 11
+                    }, this) : /*#__PURE__*/ _jsxDEV("input", {
+                        "data-rtl": rtl,
+                        disabled: readOnly,
+                        id: `field-${path?.replace(/\./g, '__')}`,
+                        name: path,
+                        onChange: onChange,
+                        onKeyDown: onKeyDown,
+                        placeholder: placeholder,
+                        ref: inputRef,
+                        type: "text",
+                        value: value || '',
+                        ...htmlAttributes ?? {}
+                    }, void 0, false, {
+                        fileName: "src/fields/Text/Input.tsx",
+                        lineNumber: 153,
+                        columnNumber: 11
+                    }, this),
+                    AfterInput,
+                    /*#__PURE__*/ _jsxDEV(RenderCustomComponent, {
+                        CustomComponent: Description,
+                        Fallback: /*#__PURE__*/ _jsxDEV(FieldDescription, {
+                            description: description,
+                            path: path
+                        }, void 0, false, {
+                            fileName: "src/fields/Text/Input.tsx",
+                            lineNumber: 170,
+                            columnNumber: 21
+                        }, void 0)
+                    }, void 0, false, {
+                        fileName: "src/fields/Text/Input.tsx",
+                        lineNumber: 168,
+                        columnNumber: 9
+                    }, this)
+                ]
+            }, void 0, true, {
+                fileName: "src/fields/Text/Input.tsx",
+                lineNumber: 116,
+                columnNumber: 7
+            }, this)
+        ]
+    }, void 0, true, {
+        fileName: "src/fields/Text/Input.tsx",
+        lineNumber: 97,
+        columnNumber: 5
+    }, this);
 };
 
 //# sourceMappingURL=Input.js.map