@payloadcms/ui 3.0.0-canary.cee5702 → 3.0.0-canary.cf66341

package/dist/fields/Tabs/Tab/index.d.ts

@@ -1,11 +1,11 @@
+import type { ClientTab } from 'payload';
 import React from 'react';
-import type { MappedTab } from '../../../providers/ComponentMap/buildComponentMap/types.js';
 import './index.scss';
 type TabProps = {
-    isActive?: boolean;
-    parentPath: string;
-    setIsActive: () => void;
-    tab: MappedTab;
+    readonly isActive?: boolean;
+    readonly parentPath: string;
+    readonly setIsActive: () => void;
+    readonly tab: ClientTab;
 };
 export declare const TabComponent: React.FC<TabProps>;
 export {};

package/dist/fields/Tabs/Tab/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/fields/Tabs/Tab/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAEvC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,4DAA4D,CAAA;AAK3F,OAAO,cAAc,CAAA;AAIrB,KAAK,QAAQ,GAAG;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,UAAU,EAAE,MAAM,CAAA;IAClB,WAAW,EAAE,MAAM,IAAI,CAAA;IACvB,GAAG,EAAE,SAAS,CAAA;CACf,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,QAAQ,CA6B3C,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/fields/Tabs/Tab/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAIxC,OAAO,KAAmB,MAAM,OAAO,CAAA;AAKvC,OAAO,cAAc,CAAA;AAIrB,KAAK,QAAQ,GAAG;IACd,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAC3B,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,WAAW,EAAE,MAAM,IAAI,CAAA;IAChC,QAAQ,CAAC,GAAG,EAAE,SAAS,CAAA;CACxB,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,QAAQ,CA0B3C,CAAA"}

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

@@ -1,43 +1,78 @@
 'use client';
+
+import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { getTranslation } from '@payloadcms/translations';
+import { tabHasName } from 'payload/shared';
 import React, { useState } from 'react';
 import { ErrorPill } from '../../../elements/ErrorPill/index.js';
 import { WatchChildErrors } from '../../../forms/WatchChildErrors/index.js';
 import { useTranslation } from '../../../providers/Translation/index.js';
+import './index.scss';
 const baseClass = 'tabs-field__tab-button';
-export const TabComponent = ({ isActive, parentPath, setIsActive, tab })=>{
-    const { name, label } = tab;
-    const { i18n } = useTranslation();
-    const [errorCount, setErrorCount] = useState(undefined);
-    const hasName = 'name' in tab;
-    const path = `${parentPath ? `${parentPath}.` : ''}${'name' in tab ? name : ''}`;
-    const fieldHasErrors = errorCount > 0;
-    return /*#__PURE__*/ _jsxs(React.Fragment, {
-        children: [
-            /*#__PURE__*/ _jsx(WatchChildErrors, {
-                fieldMap: tab.fieldMap,
-                path: path,
-                setErrorCount: setErrorCount
-            }),
-            /*#__PURE__*/ _jsxs("button", {
-                className: [
-                    baseClass,
-                    fieldHasErrors && `${baseClass}--has-error`,
-                    isActive && `${baseClass}--active`
-                ].filter(Boolean).join(' '),
-                onClick: setIsActive,
-                type: "button",
-                children: [
-                    label ? getTranslation(label, i18n) : hasName && name,
-                    fieldHasErrors && /*#__PURE__*/ _jsx(ErrorPill, {
-                        count: errorCount,
-                        i18n: i18n
-                    })
-                ]
-            })
-        ]
+export const TabComponent = t0 => {
+  const $ = _c(14);
+  const {
+    isActive,
+    parentPath,
+    setIsActive,
+    tab
+  } = t0;
+  const {
+    i18n
+  } = useTranslation();
+  const [errorCount, setErrorCount] = useState(undefined);
+  const path = `${parentPath ? `${parentPath}.` : ""}${tabHasName(tab) ? tab.name : ""}`;
+  const fieldHasErrors = errorCount > 0;
+  let t1;
+  if ($[0] !== tab || $[1] !== path || $[2] !== fieldHasErrors || $[3] !== isActive || $[4] !== i18n || $[5] !== errorCount || $[6] !== setIsActive) {
+    const t2 = _jsx(WatchChildErrors, {
+      fields: tab.fields,
+      path,
+      setErrorCount
+    });
+    const t3 = fieldHasErrors && `${baseClass}--has-error`;
+    const t4 = isActive && `${baseClass}--active`;
+    let t5;
+    if ($[8] !== t3 || $[9] !== t4) {
+      t5 = [baseClass, t3, t4].filter(Boolean);
+      $[8] = t3;
+      $[9] = t4;
+      $[10] = t5;
+    } else {
+      t5 = $[10];
+    }
+    let t6;
+    if ($[11] !== tab || $[12] !== i18n) {
+      t6 = tab.label ? getTranslation(tab.label, i18n) : tabHasName(tab) ? tab.name : "";
+      $[11] = tab;
+      $[12] = i18n;
+      $[13] = t6;
+    } else {
+      t6 = $[13];
+    }
+    t1 = _jsxs(React.Fragment, {
+      children: [t2, _jsxs("button", {
+        className: t5.join(" "),
+        onClick: setIsActive,
+        type: "button",
+        children: [t6, fieldHasErrors && _jsx(ErrorPill, {
+          count: errorCount,
+          i18n
+        })]
+      })]
     });
+    $[0] = tab;
+    $[1] = path;
+    $[2] = fieldHasErrors;
+    $[3] = isActive;
+    $[4] = i18n;
+    $[5] = errorCount;
+    $[6] = setIsActive;
+    $[7] = t1;
+  } else {
+    t1 = $[7];
+  }
+  return t1;
 };
-
 //# 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'\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { useState } from 'react'\n\nimport type { MappedTab } from '../../../providers/ComponentMap/buildComponentMap/types.js'\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  isActive?: boolean\n  parentPath: string\n  setIsActive: () => void\n  tab: MappedTab\n}\n\nexport const TabComponent: React.FC<TabProps> = ({ isActive, parentPath, setIsActive, tab }) => {\n  const { name, label } = tab\n\n  const { i18n } = useTranslation()\n  const [errorCount, setErrorCount] = useState(undefined)\n  const hasName = 'name' in tab\n\n  const path = `${parentPath ? `${parentPath}.` : ''}${'name' in tab ? name : ''}`\n  const fieldHasErrors = errorCount > 0\n\n  return (\n    <React.Fragment>\n      <WatchChildErrors fieldMap={tab.fieldMap} path={path} setErrorCount={setErrorCount} />\n      <button\n        className={[\n          baseClass,\n          fieldHasErrors && `${baseClass}--has-error`,\n          isActive && `${baseClass}--active`,\n        ]\n          .filter(Boolean)\n          .join(' ')}\n        onClick={setIsActive}\n        type=\"button\"\n      >\n        {label ? getTranslation(label, i18n) : hasName && name}\n        {fieldHasErrors && <ErrorPill count={errorCount} i18n={i18n} />}\n      </button>\n    </React.Fragment>\n  )\n}\n"],"names":["getTranslation","React","useState","ErrorPill","WatchChildErrors","useTranslation","baseClass","TabComponent","isActive","parentPath","setIsActive","tab","name","label","i18n","errorCount","setErrorCount","undefined","hasName","path","fieldHasErrors","Fragment","fieldMap","button","className","filter","Boolean","join","onClick","type","count"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,OAAOC,SAASC,QAAQ,QAAQ,QAAO;AAIvC,SAASC,SAAS,QAAQ,uCAAsC;AAChE,SAASC,gBAAgB,QAAQ,2CAA0C;AAC3E,SAASC,cAAc,QAAQ,0CAAyC;AAGxE,MAAMC,YAAY;AASlB,OAAO,MAAMC,eAAmC,CAAC,EAAEC,QAAQ,EAAEC,UAAU,EAAEC,WAAW,EAAEC,GAAG,EAAE;IACzF,MAAM,EAAEC,IAAI,EAAEC,KAAK,EAAE,GAAGF;IAExB,MAAM,EAAEG,IAAI,EAAE,GAAGT;IACjB,MAAM,CAACU,YAAYC,cAAc,GAAGd,SAASe;IAC7C,MAAMC,UAAU,UAAUP;IAE1B,MAAMQ,OAAO,CAAC,EAAEV,aAAa,CAAC,EAAEA,WAAW,CAAC,CAAC,GAAG,GAAG,EAAE,UAAUE,MAAMC,OAAO,GAAG,CAAC;IAChF,MAAMQ,iBAAiBL,aAAa;IAEpC,qBACE,MAACd,MAAMoB,QAAQ;;0BACb,KAACjB;gBAAiBkB,UAAUX,IAAIW,QAAQ;gBAAEH,MAAMA;gBAAMH,eAAeA;;0BACrE,MAACO;gBACCC,WAAW;oBACTlB;oBACAc,kBAAkB,CAAC,EAAEd,UAAU,WAAW,CAAC;oBAC3CE,YAAY,CAAC,EAAEF,UAAU,QAAQ,CAAC;iBACnC,CACEmB,MAAM,CAACC,SACPC,IAAI,CAAC;gBACRC,SAASlB;gBACTmB,MAAK;;oBAEJhB,QAAQb,eAAea,OAAOC,QAAQI,WAAWN;oBACjDQ,gCAAkB,KAACjB;wBAAU2B,OAAOf;wBAAYD,MAAMA;;;;;;AAI/D,EAAC"}
+{"version":3,"file":"index.js","names":["c","_c","getTranslation","tabHasName","React","useState","ErrorPill","WatchChildErrors","useTranslation","baseClass","TabComponent","t0","$","isActive","parentPath","setIsActive","tab","i18n","errorCount","setErrorCount","undefined","path","name","fieldHasErrors","t1","t2","_jsx","fields","t3","t4","t5","filter","Boolean","t6","label","_jsxs","Fragment","children","className","join","onClick","type","count"],"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 isActive?: boolean\n  readonly parentPath: string\n  readonly setIsActive: () => void\n  readonly tab: ClientTab\n}\n\nexport const TabComponent: React.FC<TabProps> = ({ isActive, parentPath, setIsActive, tab }) => {\n  const { i18n } = useTranslation()\n  const [errorCount, setErrorCount] = useState(undefined)\n\n  const path = `${parentPath ? `${parentPath}.` : ''}${tabHasName(tab) ? tab.name : ''}`\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        ]\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"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAIA,SAASC,cAAc,QAAQ;AAC/B,SAASC,UAAU,QAAQ;AAC3B,OAAOC,KAAA,IAASC,QAAQ,QAAQ;AAEhC,SAASC,SAAS,QAAQ;AAC1B,SAASC,gBAAgB,QAAQ;AACjC,SAASC,cAAc,QAAQ;AAC/B,OAAO;AAEP,MAAMC,SAAA,GAAY;AASlB,OAAO,MAAMC,YAAA,GAAmCC,EAAA;EAAA,MAAAC,CAAA,GAAAX,EAAA;EAAC;IAAAY,QAAA;IAAAC,UAAA;IAAAC,WAAA;IAAAC;EAAA,IAAAL,EAA0C;EACzF;IAAAM;EAAA,IAAiBT,cAAA;EACjB,OAAAU,UAAA,EAAAC,aAAA,IAAoCd,QAAA,CAAAe,SAAS;EAE7C,MAAAC,IAAA,GAAa,GAAGP,UAAA,GAAa,GAAGA,UAAA,GAAa,GAAG,KAAKX,UAAA,CAAWa,GAAA,IAAOA,GAAA,CAAAM,IAAA,GAAW,IAAI;EACtF,MAAAC,cAAA,GAAuBL,UAAA,IAAa;EAAA,IAAAM,EAAA;EAAA,IAAAZ,CAAA,QAAAI,GAAA,IAAAJ,CAAA,QAAAS,IAAA,IAAAT,CAAA,QAAAW,cAAA,IAAAX,CAAA,QAAAC,QAAA,IAAAD,CAAA,QAAAK,IAAA,IAAAL,CAAA,QAAAM,UAAA,IAAAN,CAAA,QAAAG,WAAA;IAIhC,MAAAU,EAAA,GAAAC,IAAA,CAAAnB,gBAAA;MAAAoB,MAAA,EAA0BX,GAAA,CAAAW,MAAA;MAAAN,IAAA;MAAAF;IAAA,C;IAItB,MAAAS,EAAA,GAAAL,cAAA,IAAkB,GAAAd,SAAA,aAAyB;IAC3C,MAAAoB,EAAA,GAAAhB,QAAA,IAAY,GAAAJ,SAAA,UAAsB;IAAA,IAAAqB,EAAA;IAAA,IAAAlB,CAAA,QAAAgB,EAAA,IAAAhB,CAAA,QAAAiB,EAAA;MAHzBC,EAAA,IAAArB,SAAA,EAETmB,EAA2C,EAC3CC,EAAkC,EAAAE,MAAA,CAAAC,OAE1B;MAAApB,CAAA,MAAAgB,EAAA;MAAAhB,CAAA,MAAAiB,EAAA;MAAAjB,CAAA,OAAAkB,EAAA;IAAA;MAAAA,EAAA,GAAAlB,CAAA;IAAA;IAAA,IAAAqB,EAAA;IAAA,IAAArB,CAAA,SAAAI,GAAA,IAAAJ,CAAA,SAAAK,IAAA;MAKTgB,EAAA,GAAAjB,GAAA,CAAAkB,KAAA,GAAYhC,cAAA,CAAec,GAAA,CAAAkB,KAAA,EAAWjB,IAAA,IAAQd,UAAA,CAAWa,GAAA,IAAOA,GAAA,CAAAM,IAAA,GAAW;MAAAV,CAAA,OAAAI,GAAA;MAAAJ,CAAA,OAAAK,IAAA;MAAAL,CAAA,OAAAqB,EAAA;IAAA;MAAAA,EAAA,GAAArB,CAAA;IAAA;IAbhFY,EAAA,GAAAW,KAAA,CAAA/B,KAAA,CAAAgC,QAAA;MAAAC,QAAA,GACEZ,E,EACAU,KAAA,CAAC;QAAAG,SAAA,EACYR,EAKD,CAAAS,IAAA,CACF;QAAAC,OAAA,EACCzB,WAAA;QAAA0B,IAAA,EACJ;QAAAJ,QAAA,GAEJJ,EAA2E,EAC3EV,cAAA,IAAkBG,IAAA,CAAApB,SAAA;UAAAoC,KAAA,EAAkBxB,UAAA;UAAAD;QAAA,C;;;;;;;;;;;;;;SAdzCO,E;CAkBJ","ignoreList":[]}

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

@@ -1,17 +1,7 @@
-import type { FieldPermissions } from 'payload/auth';
+import type { TabsFieldProps } from 'payload';
 import React from 'react';
-import type { MappedTab } from '../../providers/ComponentMap/buildComponentMap/types.js';
-import type { FormFieldBase } from '../shared/index.js';
 import './index.scss';
 import { TabsProvider } from './provider.js';
 export { TabsProvider };
-export type TabsFieldProps = FormFieldBase & {
-    forceRender?: boolean;
-    name?: string;
-    path?: string;
-    permissions: FieldPermissions;
-    tabs?: MappedTab[];
-    width?: string;
-};
-export declare const Tabs: React.FC<TabsFieldProps>;
+export declare const TabsField: React.FC<TabsFieldProps>;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/Tabs/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAA;AAKpD,OAAO,KAA2C,MAAM,OAAO,CAAA;AAE/D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,yDAAyD,CAAA;AACxF,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAYvD,OAAO,cAAc,CAAA;AACrB,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAA;AAI5C,OAAO,EAAE,YAAY,EAAE,CAAA;AAEvB,MAAM,MAAM,cAAc,GAAG,aAAa,GAAG;IAC3C,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,WAAW,EAAE,gBAAgB,CAAA;IAC7B,IAAI,CAAC,EAAE,SAAS,EAAE,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAyJD,eAAO,MAAM,IAAI,0BAA2B,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/Tabs/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAuB,cAAc,EAAE,MAAM,SAAS,CAAA;AAIlE,OAAO,KAA2C,MAAM,OAAO,CAAA;AAY/D,OAAO,cAAc,CAAA;AACrB,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAA;AAI5C,OAAO,EAAE,YAAY,EAAE,CAAA;AAiKvB,eAAO,MAAM,SAAS,0BAAoC,CAAA"}

package/dist/fields/Tabs/index.js

@@ -1,132 +1,260 @@
 'use client';
+
+import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { getTranslation } from '@payloadcms/translations';
-import { toKebabCase } from 'payload/utilities';
+import { tabHasName, toKebabCase } from 'payload/shared';
 import React, { useCallback, useEffect, useState } from 'react';
 import { useCollapsible } from '../../elements/Collapsible/provider.js';
-import { FieldDescription } from '../../forms/FieldDescription/index.js';
 import { useFieldProps } from '../../forms/FieldPropsProvider/index.js';
 import { RenderFields } from '../../forms/RenderFields/index.js';
 import { withCondition } from '../../forms/withCondition/index.js';
 import { useDocumentInfo } from '../../providers/DocumentInfo/index.js';
 import { usePreferences } from '../../providers/Preferences/index.js';
 import { useTranslation } from '../../providers/Translation/index.js';
+import { FieldDescription } from '../FieldDescription/index.js';
 import { fieldBaseClass } from '../shared/index.js';
 import { TabComponent } from './Tab/index.js';
+import './index.scss';
 import { TabsProvider } from './provider.js';
 const baseClass = 'tabs-field';
 export { TabsProvider };
-const TabsField = (props)=>{
-    const { name, CustomDescription, className, descriptionProps, forceRender = false, path: pathFromProps, readOnly: readOnlyFromProps, tabs = [] } = props;
-    const { indexPath, path: pathFromContext, permissions, readOnly: readOnlyFromContext, schemaPath } = useFieldProps();
-    const readOnly = readOnlyFromProps || readOnlyFromContext;
-    const path = pathFromContext || pathFromProps || name;
-    const { getPreference, setPreference } = usePreferences();
-    const { preferencesKey } = useDocumentInfo();
-    const { i18n } = useTranslation();
-    const { isWithinCollapsible } = useCollapsible();
-    const [activeTabIndex, setActiveTabIndex] = useState(0);
-    const tabsPrefKey = `tabs-${indexPath}`;
-    useEffect(()=>{
-        if (preferencesKey) {
-            const getInitialPref = async ()=>{
-                const existingPreferences = await getPreference(preferencesKey);
-                const initialIndex = path ? existingPreferences?.fields?.[path]?.tabIndex : existingPreferences?.fields?.[tabsPrefKey]?.tabIndex;
-                setActiveTabIndex(initialIndex || 0);
-            };
-            void getInitialPref();
-        }
-    }, [
-        path,
-        getPreference,
-        preferencesKey,
-        tabsPrefKey
-    ]);
-    const handleTabChange = useCallback(async (incomingTabIndex)=>{
-        setActiveTabIndex(incomingTabIndex);
-        const existingPreferences = await getPreference(preferencesKey);
-        if (preferencesKey) {
-            void setPreference(preferencesKey, {
-                ...existingPreferences,
-                ...path ? {
-                    fields: {
-                        ...existingPreferences?.fields || {},
-                        [path]: {
-                            ...existingPreferences?.fields?.[path],
-                            tabIndex: incomingTabIndex
-                        }
-                    }
-                } : {
-                    fields: {
-                        ...existingPreferences?.fields,
-                        [tabsPrefKey]: {
-                            ...existingPreferences?.fields?.[tabsPrefKey],
-                            tabIndex: incomingTabIndex
-                        }
-                    }
-                }
-            });
+const TabsFieldComponent = props => {
+  const $ = _c(49);
+  const {
+    field,
+    field: t0,
+    forceRender: t1,
+    readOnly: readOnlyFromTopLevelProps
+  } = props;
+  const {
+    _path: pathFromProps,
+    admin: t2,
+    tabs: t3
+  } = t0;
+  let t4;
+  if ($[0] !== t2) {
+    t4 = t2 === undefined ? {} : t2;
+    $[0] = t2;
+    $[1] = t4;
+  } else {
+    t4 = $[1];
+  }
+  const {
+    className,
+    readOnly: readOnlyFromAdmin
+  } = t4;
+  let t5;
+  if ($[2] !== t3) {
+    t5 = t3 === undefined ? [] : t3;
+    $[2] = t3;
+    $[3] = t5;
+  } else {
+    t5 = $[3];
+  }
+  const tabs = t5;
+  const forceRender = t1 === undefined ? false : t1;
+  const {
+    indexPath,
+    path: pathFromContext,
+    readOnly: readOnlyFromContext,
+    schemaPath,
+    siblingPermissions
+  } = useFieldProps();
+  const readOnlyFromProps = readOnlyFromTopLevelProps || readOnlyFromAdmin;
+  const readOnly = readOnlyFromProps || readOnlyFromContext;
+  const path = pathFromContext ?? pathFromProps;
+  const {
+    getPreference,
+    setPreference
+  } = usePreferences();
+  const {
+    preferencesKey
+  } = useDocumentInfo();
+  const {
+    i18n
+  } = useTranslation();
+  const {
+    isWithinCollapsible
+  } = useCollapsible();
+  const [activeTabIndex, setActiveTabIndex] = useState(0);
+  const tabsPrefKey = `tabs-${indexPath}`;
+  let t6;
+  let t7;
+  if ($[4] !== preferencesKey || $[5] !== getPreference || $[6] !== path || $[7] !== tabsPrefKey) {
+    t6 = () => {
+      if (preferencesKey) {
+        const getInitialPref = async () => {
+          const existingPreferences = await getPreference(preferencesKey);
+          const initialIndex = path ? existingPreferences?.fields?.[path]?.tabIndex : existingPreferences?.fields?.[tabsPrefKey]?.tabIndex;
+          setActiveTabIndex(initialIndex || 0);
+        };
+        getInitialPref();
+      }
+    };
+    t7 = [path, getPreference, preferencesKey, tabsPrefKey];
+    $[4] = preferencesKey;
+    $[5] = getPreference;
+    $[6] = path;
+    $[7] = tabsPrefKey;
+    $[8] = t6;
+    $[9] = t7;
+  } else {
+    t6 = $[8];
+    t7 = $[9];
+  }
+  useEffect(t6, t7);
+  let t8;
+  if ($[10] !== getPreference || $[11] !== preferencesKey || $[12] !== setPreference || $[13] !== path || $[14] !== tabsPrefKey) {
+    t8 = async incomingTabIndex => {
+      setActiveTabIndex(incomingTabIndex);
+      const existingPreferences_0 = await getPreference(preferencesKey);
+      if (preferencesKey) {
+        setPreference(preferencesKey, {
+          ...existingPreferences_0,
+          ...(path ? {
+            fields: {
+              ...(existingPreferences_0?.fields || {}),
+              [path]: {
+                ...existingPreferences_0?.fields?.[path],
+                tabIndex: incomingTabIndex
+              }
+            }
+          } : {
+            fields: {
+              ...existingPreferences_0?.fields,
+              [tabsPrefKey]: {
+                ...existingPreferences_0?.fields?.[tabsPrefKey],
+                tabIndex: incomingTabIndex
+              }
+            }
+          })
+        });
+      }
+    };
+    $[10] = getPreference;
+    $[11] = preferencesKey;
+    $[12] = setPreference;
+    $[13] = path;
+    $[14] = tabsPrefKey;
+    $[15] = t8;
+  } else {
+    t8 = $[15];
+  }
+  const handleTabChange = t8;
+  const activeTabConfig = tabs[activeTabIndex];
+  let t9;
+  if ($[16] !== path || $[17] !== activeTabConfig) {
+    t9 = function generateTabPath() {
+      let tabPath = path;
+      if (path && tabHasName(activeTabConfig) && activeTabConfig.name) {
+        tabPath = `${path}.${activeTabConfig.name}`;
+      } else {
+        if (!path && tabHasName(activeTabConfig) && activeTabConfig.name) {
+          tabPath = activeTabConfig.name;
         }
-    }, [
-        preferencesKey,
-        getPreference,
-        setPreference,
-        path,
-        tabsPrefKey
-    ]);
-    const activeTabConfig = tabs[activeTabIndex];
-    return /*#__PURE__*/ _jsx("div", {
-        className: [
-            fieldBaseClass,
-            className,
-            baseClass,
-            isWithinCollapsible && `${baseClass}--within-collapsible`
-        ].filter(Boolean).join(' '),
-        children: /*#__PURE__*/ _jsxs(TabsProvider, {
-            children: [
-                /*#__PURE__*/ _jsx("div", {
-                    className: `${baseClass}__tabs-wrap`,
-                    children: /*#__PURE__*/ _jsx("div", {
-                        className: `${baseClass}__tabs`,
-                        children: tabs.map((tab, tabIndex)=>{
-                            return /*#__PURE__*/ _jsx(TabComponent, {
-                                isActive: activeTabIndex === tabIndex,
-                                parentPath: path,
-                                setIsActive: ()=>handleTabChange(tabIndex),
-                                tab: tab
-                            }, tabIndex);
-                        })
-                    })
-                }),
-                /*#__PURE__*/ _jsx("div", {
-                    className: `${baseClass}__content-wrap`,
-                    children: activeTabConfig && /*#__PURE__*/ _jsx(React.Fragment, {
-                        children: /*#__PURE__*/ _jsxs("div", {
-                            className: [
-                                `${baseClass}__tab`,
-                                activeTabConfig.label && `${baseClass}__tabConfigLabel-${toKebabCase(getTranslation(activeTabConfig.label, i18n))}`
-                            ].filter(Boolean).join(' '),
-                            children: [
-                                CustomDescription ? CustomDescription : /*#__PURE__*/ _jsx(FieldDescription, {
-                                    ...descriptionProps || {}
-                                }),
-                                /*#__PURE__*/ _jsx(RenderFields, {
-                                    fieldMap: activeTabConfig.fieldMap,
-                                    forceRender: forceRender,
-                                    margins: "small",
-                                    path: `${path ? `${path}.` : ''}${activeTabConfig.name ? `${activeTabConfig.name}` : ''}`,
-                                    permissions: 'name' in activeTabConfig && permissions?.fields?.[activeTabConfig.name]?.fields ? permissions?.fields?.[activeTabConfig.name]?.fields : permissions?.fields,
-                                    readOnly: readOnly,
-                                    schemaPath: `${schemaPath ? `${schemaPath}` : ''}${activeTabConfig.name ? `.${activeTabConfig.name}` : ''}`
-                                }, activeTabConfig.label ? getTranslation(activeTabConfig.label, i18n) : activeTabConfig['name'])
-                            ]
-                        })
-                    })
-                })
-            ]
-        })
+      }
+      return tabPath;
+    };
+    $[16] = path;
+    $[17] = activeTabConfig;
+    $[18] = t9;
+  } else {
+    t9 = $[18];
+  }
+  const generateTabPath = t9;
+  const t10 = isWithinCollapsible && `${baseClass}--within-collapsible`;
+  let t11;
+  if ($[19] !== className || $[20] !== t10) {
+    t11 = [fieldBaseClass, className, baseClass, t10].filter(Boolean);
+    $[19] = className;
+    $[20] = t10;
+    $[21] = t11;
+  } else {
+    t11 = $[21];
+  }
+  const t12 = t11.join(" ");
+  let t13;
+  if ($[22] !== activeTabIndex || $[23] !== path || $[24] !== handleTabChange || $[25] !== tabs || $[26] !== activeTabConfig || $[27] !== i18n || $[28] !== field || $[29] !== generateTabPath || $[30] !== siblingPermissions || $[31] !== schemaPath || $[32] !== forceRender || $[33] !== readOnly || $[34] !== t12) {
+    let t14;
+    if ($[36] !== activeTabIndex || $[37] !== path || $[38] !== handleTabChange) {
+      t14 = (tab, tabIndex) => _jsx(TabComponent, {
+        isActive: activeTabIndex === tabIndex,
+        parentPath: path,
+        setIsActive: () => {
+          handleTabChange(tabIndex);
+        },
+        tab
+      }, tabIndex);
+      $[36] = activeTabIndex;
+      $[37] = path;
+      $[38] = handleTabChange;
+      $[39] = t14;
+    } else {
+      t14 = $[39];
+    }
+    let t15;
+    if ($[40] !== activeTabConfig || $[41] !== i18n || $[42] !== field || $[43] !== generateTabPath || $[44] !== siblingPermissions || $[45] !== schemaPath || $[46] !== forceRender || $[47] !== readOnly) {
+      t15 = activeTabConfig && _jsxs("div", {
+        className: [`${baseClass}__tab`, activeTabConfig.label && `${baseClass}__tabConfigLabel-${toKebabCase(getTranslation(activeTabConfig.label, i18n))}`].filter(Boolean).join(" "),
+        children: [_jsx(FieldDescription, {
+          Description: field?.admin?.components?.Description,
+          field
+        }), _jsx(RenderFields, {
+          fields: activeTabConfig.fields,
+          forceRender,
+          margins: "small",
+          path: generateTabPath(),
+          permissions: "name" in activeTabConfig && siblingPermissions?.[activeTabConfig.name]?.fields ? siblingPermissions[activeTabConfig.name]?.fields : siblingPermissions,
+          readOnly,
+          schemaPath: `${schemaPath ? `${schemaPath}` : ""}${tabHasName(activeTabConfig) && activeTabConfig.name ? `.${activeTabConfig.name}` : ""}`
+        }, activeTabConfig.label ? getTranslation(activeTabConfig.label, i18n) : activeTabConfig.name)]
+      });
+      $[40] = activeTabConfig;
+      $[41] = i18n;
+      $[42] = field;
+      $[43] = generateTabPath;
+      $[44] = siblingPermissions;
+      $[45] = schemaPath;
+      $[46] = forceRender;
+      $[47] = readOnly;
+      $[48] = t15;
+    } else {
+      t15 = $[48];
+    }
+    t13 = _jsx("div", {
+      className: t12,
+      children: _jsxs(TabsProvider, {
+        children: [_jsx("div", {
+          className: `${baseClass}__tabs-wrap`,
+          children: _jsx("div", {
+            className: `${baseClass}__tabs`,
+            children: tabs.map(t14)
+          })
+        }), _jsx("div", {
+          className: `${baseClass}__content-wrap`,
+          children: t15
+        })]
+      })
     });
+    $[22] = activeTabIndex;
+    $[23] = path;
+    $[24] = handleTabChange;
+    $[25] = tabs;
+    $[26] = activeTabConfig;
+    $[27] = i18n;
+    $[28] = field;
+    $[29] = generateTabPath;
+    $[30] = siblingPermissions;
+    $[31] = schemaPath;
+    $[32] = forceRender;
+    $[33] = readOnly;
+    $[34] = t12;
+    $[35] = t13;
+  } else {
+    t13 = $[35];
+  }
+  return t13;
 };
-export const Tabs = withCondition(TabsField);
-
+export const TabsField = withCondition(TabsFieldComponent);
 //# 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 { FieldPermissions } from 'payload/auth'\nimport type { DocumentPreferences } from 'payload/types'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { toKebabCase } from 'payload/utilities'\nimport React, { useCallback, useEffect, useState } from 'react'\n\nimport type { MappedTab } from '../../providers/ComponentMap/buildComponentMap/types.js'\nimport type { FormFieldBase } from '../shared/index.js'\n\nimport { useCollapsible } from '../../elements/Collapsible/provider.js'\nimport { FieldDescription } from '../../forms/FieldDescription/index.js'\nimport { useFieldProps } from '../../forms/FieldPropsProvider/index.js'\nimport { RenderFields } from '../../forms/RenderFields/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 { fieldBaseClass } from '../shared/index.js'\nimport { TabComponent } from './Tab/index.js'\nimport './index.scss'\nimport { TabsProvider } from './provider.js'\n\nconst baseClass = 'tabs-field'\n\nexport { TabsProvider }\n\nexport type TabsFieldProps = FormFieldBase & {\n  forceRender?: boolean\n  name?: string\n  path?: string\n  permissions: FieldPermissions\n  tabs?: MappedTab[]\n  width?: string\n}\n\nconst TabsField: React.FC<TabsFieldProps> = (props) => {\n  const {\n    name,\n    CustomDescription,\n    className,\n    descriptionProps,\n    forceRender = false,\n    path: pathFromProps,\n    readOnly: readOnlyFromProps,\n    tabs = [],\n  } = props\n\n  const {\n    indexPath,\n    path: pathFromContext,\n    permissions,\n    readOnly: readOnlyFromContext,\n    schemaPath,\n  } = useFieldProps()\n\n  const readOnly = readOnlyFromProps || readOnlyFromContext\n  const path = pathFromContext || pathFromProps || name\n  const { getPreference, setPreference } = usePreferences()\n  const { preferencesKey } = useDocumentInfo()\n  const { i18n } = useTranslation()\n  const { isWithinCollapsible } = useCollapsible()\n  const [activeTabIndex, setActiveTabIndex] = useState<number>(0)\n  const tabsPrefKey = `tabs-${indexPath}`\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        setActiveTabIndex(initialIndex || 0)\n      }\n      void getInitialPref()\n    }\n  }, [path, getPreference, preferencesKey, tabsPrefKey])\n\n  const handleTabChange = useCallback(\n    async (incomingTabIndex: number) => {\n      setActiveTabIndex(incomingTabIndex)\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    [preferencesKey, getPreference, setPreference, path, tabsPrefKey],\n  )\n\n  const activeTabConfig = tabs[activeTabIndex]\n\n  return (\n    <div\n      className={[\n        fieldBaseClass,\n        className,\n        baseClass,\n        isWithinCollapsible && `${baseClass}--within-collapsible`,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      <TabsProvider>\n        <div className={`${baseClass}__tabs-wrap`}>\n          <div className={`${baseClass}__tabs`}>\n            {tabs.map((tab, tabIndex) => {\n              return (\n                <TabComponent\n                  isActive={activeTabIndex === tabIndex}\n                  key={tabIndex}\n                  parentPath={path}\n                  setIsActive={() => handleTabChange(tabIndex)}\n                  tab={tab}\n                />\n              )\n            })}\n          </div>\n        </div>\n        <div className={`${baseClass}__content-wrap`}>\n          {activeTabConfig && (\n            <React.Fragment>\n              <div\n                className={[\n                  `${baseClass}__tab`,\n                  activeTabConfig.label &&\n                    `${baseClass}__tabConfigLabel-${toKebabCase(\n                      getTranslation(activeTabConfig.label, i18n),\n                    )}`,\n                ]\n                  .filter(Boolean)\n                  .join(' ')}\n              >\n                {CustomDescription ? (\n                  CustomDescription\n                ) : (\n                  <FieldDescription {...(descriptionProps || {})} />\n                )}\n                <RenderFields\n                  fieldMap={activeTabConfig.fieldMap}\n                  forceRender={forceRender}\n                  key={\n                    activeTabConfig.label\n                      ? getTranslation(activeTabConfig.label, i18n)\n                      : activeTabConfig['name']\n                  }\n                  margins=\"small\"\n                  path={`${path ? `${path}.` : ''}${activeTabConfig.name ? `${activeTabConfig.name}` : ''}`}\n                  permissions={\n                    'name' in activeTabConfig && permissions?.fields?.[activeTabConfig.name]?.fields\n                      ? permissions?.fields?.[activeTabConfig.name]?.fields\n                      : permissions?.fields\n                  }\n                  readOnly={readOnly}\n                  schemaPath={`${schemaPath ? `${schemaPath}` : ''}${activeTabConfig.name ? `.${activeTabConfig.name}` : ''}`}\n                />\n              </div>\n            </React.Fragment>\n          )}\n        </div>\n      </TabsProvider>\n    </div>\n  )\n}\n\nexport const Tabs = withCondition(TabsField)\n"],"names":["getTranslation","toKebabCase","React","useCallback","useEffect","useState","useCollapsible","FieldDescription","useFieldProps","RenderFields","withCondition","useDocumentInfo","usePreferences","useTranslation","fieldBaseClass","TabComponent","TabsProvider","baseClass","TabsField","props","name","CustomDescription","className","descriptionProps","forceRender","path","pathFromProps","readOnly","readOnlyFromProps","tabs","indexPath","pathFromContext","permissions","readOnlyFromContext","schemaPath","getPreference","setPreference","preferencesKey","i18n","isWithinCollapsible","activeTabIndex","setActiveTabIndex","tabsPrefKey","getInitialPref","existingPreferences","initialIndex","fields","tabIndex","handleTabChange","incomingTabIndex","activeTabConfig","div","filter","Boolean","join","map","tab","isActive","parentPath","setIsActive","Fragment","label","fieldMap","margins","Tabs"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"file":"index.js","names":["c","_c","getTranslation","tabHasName","toKebabCase","React","useCallback","useEffect","useState","useCollapsible","useFieldProps","RenderFields","withCondition","useDocumentInfo","usePreferences","useTranslation","FieldDescription","fieldBaseClass","TabComponent","TabsProvider","baseClass","TabsFieldComponent","props","$","field","t0","forceRender","t1","readOnly","readOnlyFromTopLevelProps","_path","pathFromProps","admin","t2","tabs","t3","t4","undefined","className","readOnlyFromAdmin","t5","indexPath","path","pathFromContext","readOnlyFromContext","schemaPath","siblingPermissions","readOnlyFromProps","getPreference","setPreference","preferencesKey","i18n","isWithinCollapsible","activeTabIndex","setActiveTabIndex","tabsPrefKey","t6","t7","getInitialPref","existingPreferences","initialIndex","fields","tabIndex","t8","incomingTabIndex","existingPreferences_0","handleTabChange","activeTabConfig","t9","generateTabPath","tabPath","name","t10","t11","filter","Boolean","t12","join","t13","t14","tab","_jsx","isActive","parentPath","setIsActive","t15","_jsxs","label","children","Description","components","margins","permissions","map","TabsField"],"sources":["../../../src/fields/Tabs/index.tsx"],"sourcesContent":["'use client'\nimport type { DocumentPreferences, TabsFieldProps } 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 { useFieldProps } from '../../forms/FieldPropsProvider/index.js'\nimport { RenderFields } from '../../forms/RenderFields/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 { TabComponent } from './Tab/index.js'\nimport './index.scss'\nimport { TabsProvider } from './provider.js'\n\nconst baseClass = 'tabs-field'\n\nexport { TabsProvider }\n\nconst TabsFieldComponent: React.FC<TabsFieldProps> = (props) => {\n  const {\n    field,\n    field: {\n      _path: pathFromProps,\n      admin: { className, readOnly: readOnlyFromAdmin } = {},\n      tabs = [],\n    },\n    forceRender = false,\n    readOnly: readOnlyFromTopLevelProps,\n  } = props\n\n  const {\n    indexPath,\n    path: pathFromContext,\n    readOnly: readOnlyFromContext,\n    schemaPath,\n    siblingPermissions,\n  } = useFieldProps()\n  const readOnlyFromProps = readOnlyFromTopLevelProps || readOnlyFromAdmin\n\n  const readOnly = readOnlyFromProps || readOnlyFromContext\n  const path = pathFromContext ?? pathFromProps\n  const { getPreference, setPreference } = usePreferences()\n  const { preferencesKey } = useDocumentInfo()\n  const { i18n } = useTranslation()\n  const { isWithinCollapsible } = useCollapsible()\n  const [activeTabIndex, setActiveTabIndex] = useState<number>(0)\n  const tabsPrefKey = `tabs-${indexPath}`\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        setActiveTabIndex(initialIndex || 0)\n      }\n      void getInitialPref()\n    }\n  }, [path, getPreference, preferencesKey, tabsPrefKey])\n\n  const handleTabChange = useCallback(\n    async (incomingTabIndex: number): Promise<void> => {\n      setActiveTabIndex(incomingTabIndex)\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    [preferencesKey, getPreference, setPreference, path, tabsPrefKey],\n  )\n\n  const activeTabConfig = tabs[activeTabIndex]\n\n  function generateTabPath() {\n    let tabPath = path\n    if (path && tabHasName(activeTabConfig) && activeTabConfig.name) {\n      tabPath = `${path}.${activeTabConfig.name}`\n    } else if (!path && tabHasName(activeTabConfig) && activeTabConfig.name) {\n      tabPath = activeTabConfig.name\n    }\n\n    return tabPath\n  }\n\n  return (\n    <div\n      className={[\n        fieldBaseClass,\n        className,\n        baseClass,\n        isWithinCollapsible && `${baseClass}--within-collapsible`,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      <TabsProvider>\n        <div className={`${baseClass}__tabs-wrap`}>\n          <div className={`${baseClass}__tabs`}>\n            {tabs.map((tab, tabIndex) => {\n              return (\n                <TabComponent\n                  isActive={activeTabIndex === tabIndex}\n                  key={tabIndex}\n                  parentPath={path}\n                  setIsActive={() => {\n                    void handleTabChange(tabIndex)\n                  }}\n                  tab={tab}\n                />\n              )\n            })}\n          </div>\n        </div>\n        <div className={`${baseClass}__content-wrap`}>\n          {activeTabConfig && (\n            <div\n              className={[\n                `${baseClass}__tab`,\n                activeTabConfig.label &&\n                  `${baseClass}__tabConfigLabel-${toKebabCase(\n                    getTranslation(activeTabConfig.label, i18n),\n                  )}`,\n              ]\n                .filter(Boolean)\n                .join(' ')}\n            >\n              <FieldDescription Description={field?.admin?.components?.Description} field={field} />\n              <RenderFields\n                fields={activeTabConfig.fields}\n                forceRender={forceRender}\n                key={\n                  activeTabConfig.label\n                    ? getTranslation(activeTabConfig.label, i18n)\n                    : activeTabConfig['name']\n                }\n                margins=\"small\"\n                path={generateTabPath()}\n                permissions={\n                  'name' in activeTabConfig && siblingPermissions?.[activeTabConfig.name]?.fields\n                    ? siblingPermissions[activeTabConfig.name]?.fields\n                    : siblingPermissions\n                }\n                readOnly={readOnly}\n                schemaPath={`${schemaPath ? `${schemaPath}` : ''}${tabHasName(activeTabConfig) && activeTabConfig.name ? `.${activeTabConfig.name}` : ''}`}\n              />\n            </div>\n          )}\n        </div>\n      </TabsProvider>\n    </div>\n  )\n}\n\nexport const TabsField = withCondition(TabsFieldComponent)\n"],"mappings":"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","ignoreList":[]}