@payloadcms/ui 3.70.0-canary.9 → 3.71.0-internal-debug.80dab4c

package/dist/fields/Slug/index.js

@@ -1,7 +1,5 @@
 'use client';
-
-import { c as _c } from "react/compiler-runtime";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import React, { useCallback, useState } from 'react';
 import { Button } from '../../elements/Button/index.js';
 import { useForm } from '../../forms/Form/index.js';
@@ -14,138 +12,109 @@ import { TextInput } from '../Text/index.js';
 import './index.scss';
 /**
  * @experimental This component is experimental and may change or be removed in the future. Use at your own risk.
- */
-export const SlugField = t0 => {
-  const $ = _c(24);
-  const {
-    field,
-    path,
-    readOnly: readOnlyFromProps,
-    useAsSlug
-  } = t0;
-  const {
-    label
-  } = field;
-  const {
-    t
-  } = useTranslation();
-  const {
-    collectionSlug,
-    globalSlug
-  } = useDocumentInfo();
-  const {
-    slugify
-  } = useServerFunctions();
-  const t1 = path || field.name;
-  let t2;
-  if ($[0] !== t1) {
-    t2 = {
-      path: t1
-    };
-    $[0] = t1;
-    $[1] = t2;
-  } else {
-    t2 = $[1];
-  }
-  const {
-    setValue,
-    value
-  } = useField(t2);
-  const {
-    getData,
-    getDataByPath
-  } = useForm();
-  const [isLocked, setIsLocked] = useState(true);
-  let t3;
-  if ($[2] !== collectionSlug || $[3] !== getData || $[4] !== getDataByPath || $[5] !== globalSlug || $[6] !== path || $[7] !== setValue || $[8] !== slugify || $[9] !== useAsSlug || $[10] !== value) {
-    t3 = async e => {
-      e.preventDefault();
-      const valueToSlugify = getDataByPath(useAsSlug);
-      const formattedSlug = await slugify({
+ */ export const SlugField = ({ field, path, readOnly: readOnlyFromProps, useAsSlug })=>{
+    const { label } = field;
+    const { t } = useTranslation();
+    const { collectionSlug, globalSlug } = useDocumentInfo();
+    const { slugify } = useServerFunctions();
+    const { setValue, value } = useField({
+        path: path || field.name
+    });
+    const { getData, getDataByPath } = useForm();
+    const [isLocked, setIsLocked] = useState(true);
+    /**
+   * This method allows the user to generate their slug on demand, e.g. when they click the "generate" button.
+   * It uses the `slugify` server function to gain access to their custom slugify function defined in their field config.
+   */ const handleGenerate = useCallback(async (e)=>{
+        e.preventDefault();
+        const valueToSlugify = getDataByPath(useAsSlug);
+        const formattedSlug = await slugify({
+            collectionSlug,
+            data: getData(),
+            globalSlug,
+            path,
+            valueToSlugify
+        });
+        if (formattedSlug === null || formattedSlug === undefined) {
+            setValue('');
+            return;
+        }
+        /**
+       * The result may be the same as the current value, and if so, we don't want to trigger a re-render.
+       */ if (value !== formattedSlug) {
+            setValue(formattedSlug);
+        }
+    }, [
+        setValue,
+        value,
+        useAsSlug,
+        getData,
+        slugify,
+        getDataByPath,
         collectionSlug,
-        data: getData(),
         globalSlug,
-        path,
-        valueToSlugify
-      });
-      if (formattedSlug === null || formattedSlug === undefined) {
-        setValue("");
-        return;
-      }
-      if (value !== formattedSlug) {
-        setValue(formattedSlug);
-      }
-    };
-    $[2] = collectionSlug;
-    $[3] = getData;
-    $[4] = getDataByPath;
-    $[5] = globalSlug;
-    $[6] = path;
-    $[7] = setValue;
-    $[8] = slugify;
-    $[9] = useAsSlug;
-    $[10] = value;
-    $[11] = t3;
-  } else {
-    t3 = $[11];
-  }
-  const handleGenerate = t3;
-  let t4;
-  if ($[12] === Symbol.for("react.memo_cache_sentinel")) {
-    t4 = e_0 => {
-      e_0.preventDefault();
-      setIsLocked(_temp);
-    };
-    $[12] = t4;
-  } else {
-    t4 = $[12];
-  }
-  const toggleLock = t4;
-  const t5 = `field-${path}`;
-  let t6;
-  if ($[13] !== field.name || $[14] !== handleGenerate || $[15] !== isLocked || $[16] !== label || $[17] !== path || $[18] !== readOnlyFromProps || $[19] !== setValue || $[20] !== t || $[21] !== t5 || $[22] !== value) {
-    t6 = _jsxs("div", {
-      className: "field-type slug-field-component",
-      children: [_jsxs("div", {
-        className: "label-wrapper",
-        children: [_jsx(FieldLabel, {
-          htmlFor: t5,
-          label
-        }), !isLocked && _jsx(Button, {
-          buttonStyle: "none",
-          className: "lock-button",
-          onClick: handleGenerate,
-          children: t("authentication:generate")
-        }), _jsx(Button, {
-          buttonStyle: "none",
-          className: "lock-button",
-          onClick: toggleLock,
-          children: isLocked ? t("general:unlock") : t("general:lock")
-        })]
-      }), _jsx(TextInput, {
-        onChange: setValue,
-        path: path || field.name,
-        readOnly: Boolean(readOnlyFromProps || isLocked),
-        value
-      })]
-    });
-    $[13] = field.name;
-    $[14] = handleGenerate;
-    $[15] = isLocked;
-    $[16] = label;
-    $[17] = path;
-    $[18] = readOnlyFromProps;
-    $[19] = setValue;
-    $[20] = t;
-    $[21] = t5;
-    $[22] = value;
-    $[23] = t6;
-  } else {
-    t6 = $[23];
-  }
-  return t6;
+        path
+    ]);
+    const toggleLock = useCallback((e)=>{
+        e.preventDefault();
+        setIsLocked((prev)=>!prev);
+    }, []);
+    return /*#__PURE__*/ _jsxDEV("div", {
+        className: "field-type slug-field-component",
+        children: [
+            /*#__PURE__*/ _jsxDEV("div", {
+                className: "label-wrapper",
+                children: [
+                    /*#__PURE__*/ _jsxDEV(FieldLabel, {
+                        htmlFor: `field-${path}`,
+                        label: label
+                    }, void 0, false, {
+                        fileName: "src/fields/Slug/index.tsx",
+                        lineNumber: 81,
+                        columnNumber: 9
+                    }, this),
+                    !isLocked && /*#__PURE__*/ _jsxDEV(Button, {
+                        buttonStyle: "none",
+                        className: "lock-button",
+                        onClick: handleGenerate,
+                        children: t('authentication:generate')
+                    }, void 0, false, {
+                        fileName: "src/fields/Slug/index.tsx",
+                        lineNumber: 83,
+                        columnNumber: 11
+                    }, this),
+                    /*#__PURE__*/ _jsxDEV(Button, {
+                        buttonStyle: "none",
+                        className: "lock-button",
+                        onClick: toggleLock,
+                        children: isLocked ? t('general:unlock') : t('general:lock')
+                    }, void 0, false, {
+                        fileName: "src/fields/Slug/index.tsx",
+                        lineNumber: 87,
+                        columnNumber: 9
+                    }, this)
+                ]
+            }, void 0, true, {
+                fileName: "src/fields/Slug/index.tsx",
+                lineNumber: 80,
+                columnNumber: 7
+            }, this),
+            /*#__PURE__*/ _jsxDEV(TextInput, {
+                onChange: setValue,
+                path: path || field.name,
+                readOnly: Boolean(readOnlyFromProps || isLocked),
+                value: value
+            }, void 0, false, {
+                fileName: "src/fields/Slug/index.tsx",
+                lineNumber: 91,
+                columnNumber: 7
+            }, this)
+        ]
+    }, void 0, true, {
+        fileName: "src/fields/Slug/index.tsx",
+        lineNumber: 79,
+        columnNumber: 5
+    }, this);
 };
-function _temp(prev) {
-  return !prev;
-}
+
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","useCallback","useState","Button","useForm","useField","useDocumentInfo","useServerFunctions","useTranslation","FieldLabel","TextInput","SlugField","t0","$","field","path","readOnly","readOnlyFromProps","useAsSlug","label","t","collectionSlug","globalSlug","slugify","t1","name","t2","setValue","value","getData","getDataByPath","isLocked","setIsLocked","t3","e","preventDefault","valueToSlugify","formattedSlug","data","undefined","handleGenerate","t4","Symbol","for","e_0","_temp","toggleLock","t5","t6","_jsxs","className","children","_jsx","htmlFor","buttonStyle","onClick","onChange","Boolean","prev"],"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"],"mappings":"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","ignoreList":[]}
+{"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,7 +1,5 @@
 'use client';
-
-import { c as _c } from "react/compiler-runtime";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import { getTranslation } from '@payloadcms/translations';
 import { tabHasName } from 'payload/shared';
 import React, { useState } from 'react';
@@ -10,63 +8,59 @@ 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 = t0 => {
-  const $ = _c(12);
-  const {
-    hidden,
-    isActive,
-    parentPath,
-    setIsActive,
-    tab
-  } = t0;
-  const {
-    i18n
-  } = useTranslation();
-  const [errorCount, setErrorCount] = useState(undefined);
-  let t1;
-  if ($[0] !== errorCount || $[1] !== hidden || $[2] !== i18n || $[3] !== isActive || $[4] !== parentPath || $[5] !== setIsActive || $[6] !== tab) {
-    const path = [...(parentPath ? parentPath.split(".").slice(0, -1) : []), ...(tabHasName(tab) ? [tab.name] : [])];
+export const TabComponent = ({ hidden, isActive, parentPath, setIsActive, tab })=>{
+    const { i18n } = useTranslation();
+    const [errorCount, setErrorCount] = useState(undefined);
+    const path = [
+        // removes parent 'tabs' path segment, i.e. `_index-0`
+        ...parentPath ? parentPath.split('.').slice(0, -1) : [],
+        ...tabHasName(tab) ? [
+            tab.name
+        ] : []
+    ];
     const fieldHasErrors = errorCount > 0;
-    const t2 = _jsx(WatchChildErrors, {
-      fields: tab.fields,
-      path,
-      setErrorCount
-    });
-    const t3 = fieldHasErrors && `${baseClass}--has-error`;
-    const t4 = isActive && `${baseClass}--active`;
-    const t5 = hidden && `${baseClass}--hidden`;
-    let t6;
-    if ($[8] !== t3 || $[9] !== t4 || $[10] !== t5) {
-      t6 = [baseClass, t3, t4, t5].filter(Boolean);
-      $[8] = t3;
-      $[9] = t4;
-      $[10] = t5;
-      $[11] = t6;
-    } else {
-      t6 = $[11];
-    }
-    t1 = _jsxs(React.Fragment, {
-      children: [t2, _jsxs("button", {
-        className: t6.join(" "),
-        onClick: setIsActive,
-        type: "button",
-        children: [tab.label ? getTranslation(tab.label, i18n) : tabHasName(tab) ? tab.name : "", fieldHasErrors && _jsx(ErrorPill, {
-          count: errorCount,
-          i18n
-        })]
-      })]
-    });
-    $[0] = errorCount;
-    $[1] = hidden;
-    $[2] = i18n;
-    $[3] = isActive;
-    $[4] = parentPath;
-    $[5] = setIsActive;
-    $[6] = tab;
-    $[7] = t1;
-  } else {
-    t1 = $[7];
-  }
-  return t1;
+    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,"file":"index.js","names":["c","_c","getTranslation","tabHasName","React","useState","ErrorPill","WatchChildErrors","useTranslation","baseClass","TabComponent","t0","$","hidden","isActive","parentPath","setIsActive","tab","i18n","errorCount","setErrorCount","undefined","t1","path","split","slice","name","fieldHasErrors","t2","_jsx","fields","t3","t4","t5","t6","filter","Boolean","_jsxs","Fragment","children","className","join","onClick","type","label","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 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"],"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;AAUlB,OAAO,MAAMC,YAAA,GAAmCC,EAAA;EAAA,MAAAC,CAAA,GAAAX,EAAA;EAAC;IAAAY,MAAA;IAAAC,QAAA;IAAAC,UAAA;IAAAC,WAAA;IAAAC;EAAA,IAAAN,EAMhD;EACC;IAAAO;EAAA,IAAiBV,cAAA;EACjB,OAAAW,UAAA,EAAAC,aAAA,IAAoCf,QAAA,CAAAgB,SAAS;EAAA,IAAAC,EAAA;EAAA,IAAAV,CAAA,QAAAO,UAAA,IAAAP,CAAA,QAAAC,MAAA,IAAAD,CAAA,QAAAM,IAAA,IAAAN,CAAA,QAAAE,QAAA,IAAAF,CAAA,QAAAG,UAAA,IAAAH,CAAA,QAAAI,WAAA,IAAAJ,CAAA,QAAAK,GAAA;IAE7C,MAAAM,IAAA,QAEMR,UAAA,GAAaA,UAAA,CAAAS,KAAA,CAAiB,KAAAC,KAAA,MAAe,MAAO,OACpDtB,UAAA,CAAWc,GAAA,KAAQA,GAAA,CAAAS,IAAA,MAAc;IAGvC,MAAAC,cAAA,GAAuBR,UAAA,IAAa;IAIhC,MAAAS,EAAA,GAAAC,IAAA,CAAAtB,gBAAA;MAAAuB,MAAA,EAA0Bb,GAAA,CAAAa,MAAA;MAAAP,IAAA;MAAAH;IAAA,C;IAItB,MAAAW,EAAA,GAAAJ,cAAA,IAAkB,GAAAlB,SAAA,aAAyB;IAC3C,MAAAuB,EAAA,GAAAlB,QAAA,IAAY,GAAAL,SAAA,UAAsB;IAClC,MAAAwB,EAAA,GAAApB,MAAA,IAAU,GAAAJ,SAAA,UAAsB;IAAA,IAAAyB,EAAA;IAAA,IAAAtB,CAAA,QAAAmB,EAAA,IAAAnB,CAAA,QAAAoB,EAAA,IAAApB,CAAA,SAAAqB,EAAA;MAJvBC,EAAA,IAAAzB,SAAA,EAETsB,EAA2C,EAC3CC,EAAkC,EAClCC,EAAgC,EAAAE,MAAA,CAAAC,OAExB;MAAAxB,CAAA,MAAAmB,EAAA;MAAAnB,CAAA,MAAAoB,EAAA;MAAApB,CAAA,OAAAqB,EAAA;MAAArB,CAAA,OAAAsB,EAAA;IAAA;MAAAA,EAAA,GAAAtB,CAAA;IAAA;IATdU,EAAA,GAAAe,KAAA,CAAAjC,KAAA,CAAAkC,QAAA;MAAAC,QAAA,GACEX,E,EACAS,KAAA,CAAC;QAAAG,SAAA,EACYN,EAMD,CAAAO,IAAA,CACF;QAAAC,OAAA,EACC1B,WAAA;QAAA2B,IAAA,EACJ;QAAAJ,QAAA,GAEJtB,GAAA,CAAA2B,KAAA,GAAY1C,cAAA,CAAee,GAAA,CAAA2B,KAAA,EAAW1B,IAAA,IAAQf,UAAA,CAAWc,GAAA,IAAOA,GAAA,CAAAS,IAAA,GAAW,IAC3EC,cAAA,IAAkBE,IAAA,CAAAvB,SAAA;UAAAuC,KAAA,EAAkB1B,UAAA;UAAAD;QAAA,C;;;;;;;;;;;;;;SAfzCI,E;CAmBJ","ignoreList":[]}
+{"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"}