@payloadcms/ui 3.24.0-canary.7d9fbaf → 3.24.0-canary.80e034e

package/dist/elements/Autosave/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Autosave/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,sBAAsB,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAGzE,OAAO,KAAsC,MAAM,OAAO,CAAA;AAgB1D,OAAO,cAAc,CAAA;AAQrB,MAAM,MAAM,KAAK,GAAG;IAClB,UAAU,CAAC,EAAE,sBAAsB,CAAA;IACnC,MAAM,CAAC,EAAE,kBAAkB,CAAA;IAC3B,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACpB,qBAAqB,EAAE,MAAM,CAAA;CAC9B,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAkQpC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Autosave/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,sBAAsB,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAIzE,OAAO,KAAwD,MAAM,OAAO,CAAA;AAe5E,OAAO,cAAc,CAAA;AAUrB,MAAM,MAAM,KAAK,GAAG;IAClB,UAAU,CAAC,EAAE,sBAAsB,CAAA;IACnC,MAAM,CAAC,EAAE,kBAAkB,CAAA;IAC3B,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACpB,qBAAqB,EAAE,MAAM,CAAA;CAC9B,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAqTpC,CAAA"}

package/dist/elements/Autosave/index.js

@@ -1,8 +1,9 @@
 'use client';
 
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { versionDefaults } from 'payload/shared';
-import React, { useEffect, useRef, useState } from 'react';
+import { dequal } from 'dequal/lite';
+import { reduceFieldsToValues, versionDefaults } from 'payload/shared';
+import React, { useDeferredValue, useEffect, useRef, useState } from 'react';
 import { toast } from 'sonner';
 import { useAllFormFields, useForm, useFormModified, useFormSubmitted } from '../../forms/Form/context.js';
 import { useDebounce } from '../../hooks/useDebounce.js';
@@ -11,10 +12,11 @@ import { useConfig } from '../../providers/Config/index.js';
 import { useDocumentEvents } from '../../providers/DocumentEvents/index.js';
 import { useDocumentInfo } from '../../providers/DocumentInfo/index.js';
 import { useLocale } from '../../providers/Locale/index.js';
-import { useTranslation } from '../../providers/Translation/index.js';
 import './index.scss';
+import { useTranslation } from '../../providers/Translation/index.js';
 import { formatTimeToNow } from '../../utilities/formatDate.js';
 import { reduceFieldsToValuesWithValidation } from '../../utilities/reduceFieldsToValuesWithValidation.js';
+import { LeaveWithoutSaving } from '../LeaveWithoutSaving/index.js';
 const baseClass = 'autosave';
 // The minimum time the saving state should be shown
 const minimumAnimationTime = 1000;
@@ -48,12 +50,13 @@ export const Autosave = ({
   } = useDocumentEvents();
   const {
     dispatchFields,
+    isValid,
+    setIsValid,
     setSubmitted
   } = useForm();
-  const submitted = useFormSubmitted();
-  const versionsConfig = docConfig?.versions;
   const [fields] = useAllFormFields();
   const modified = useFormModified();
+  const submitted = useFormSubmitted();
   const {
     code: locale
   } = useLocale();
@@ -61,17 +64,23 @@ export const Autosave = ({
     i18n,
     t
   } = useTranslation();
+  const versionsConfig = docConfig?.versions;
   let interval = versionDefaults.autosaveInterval;
   if (versionsConfig.drafts && versionsConfig.drafts.autosave) {
     interval = versionsConfig.drafts.autosave.interval;
   }
-  const [saving, setSaving] = useState(false);
+  const validateOnDraft = Boolean(docConfig?.versions?.drafts && docConfig?.versions?.drafts.validate);
+  const [_saving, setSaving] = useState(false);
+  const saving = useDeferredValue(_saving);
   const debouncedFields = useDebounce(fields, interval);
   const fieldRef = useRef(fields);
   const modifiedRef = useRef(modified);
   const localeRef = useRef(locale);
-  const debouncedRef = useRef(debouncedFields);
-  debouncedRef.current = debouncedFields;
+  /**
+  * Track the validation internally so Autosave can determine when to run queue processing again
+  * Helps us prevent infinite loops when the queue is processing and the form is invalid
+  */
+  const isValidRef = useRef(isValid);
   // Store fields in ref so the autosave func
   // can always retrieve the most to date copies
   // after the timeout has executed
@@ -87,6 +96,13 @@ export const Autosave = ({
     if (isProcessingRef.current || queueRef.current.length === 0) {
       return;
     }
+    if (!isValidRef.current) {
+      // Clear queue so we don't end up in an infinite loop
+      queueRef.current = [];
+      // Reset internal validation state so queue processing can run again
+      isValidRef.current = true;
+      return;
+    }
     isProcessingRef.current = true;
     const latestAction = queueRef.current[queueRef.current.length - 1];
     queueRef.current = [];
@@ -99,12 +115,22 @@ export const Autosave = ({
       }
     }
   }, []);
+  const autosaveTimeoutRef = useRef(null);
   const handleAutosave = useEffectEvent(() => {
-    const abortController = new AbortController();
-    let autosaveTimeout = undefined;
+    autosaveTimeoutRef.current = undefined;
     // We need to log the time in order to figure out if we need to trigger the state off later
     let startTimestamp = undefined;
     let endTimestamp = undefined;
+    const hideIndicator = () => {
+      // If request was faster than minimum animation time, animate the difference
+      if (endTimestamp - startTimestamp < minimumAnimationTime) {
+        autosaveTimeoutRef.current = setTimeout(() => {
+          setSaving(false);
+        }, minimumAnimationTime - (endTimestamp - startTimestamp));
+      } else {
+        stopAutoSaveIndicator();
+      }
+    };
     const autosave = async () => {
       if (modified) {
         startTimestamp = new Date().getTime();
@@ -127,88 +153,86 @@ export const Autosave = ({
             const {
               data,
               valid
-            } = {
-              ...reduceFieldsToValuesWithValidation(fieldRef.current, true)
-            };
+            } = reduceFieldsToValuesWithValidation(fieldRef.current, true);
             data._status = 'draft';
             const skipSubmission = submitted && !valid && versionsConfig?.drafts && versionsConfig?.drafts?.validate;
-            if (!skipSubmission) {
-              await fetch(url, {
-                body: JSON.stringify(data),
-                credentials: 'include',
-                headers: {
-                  'Accept-Language': i18n.language,
-                  'Content-Type': 'application/json'
-                },
-                method,
-                signal: abortController.signal
-              }).then(res => {
-                const newDate = new Date();
-                // We need to log the time in order to figure out if we need to trigger the state off later
-                endTimestamp = newDate.getTime();
-                if (res.status === 200) {
-                  setLastUpdateTime(newDate.getTime());
-                  reportUpdate({
-                    id,
-                    entitySlug,
-                    updatedAt: newDate.toISOString()
-                  });
-                  if (!mostRecentVersionIsAutosaved) {
-                    incrementVersionCount();
-                    setMostRecentVersionIsAutosaved(true);
-                    setUnpublishedVersionCount(prev => prev + 1);
-                  }
+            if (!skipSubmission && isValidRef.current) {
+              let res;
+              try {
+                res = await fetch(url, {
+                  body: JSON.stringify(data),
+                  credentials: 'include',
+                  headers: {
+                    'Accept-Language': i18n.language,
+                    'Content-Type': 'application/json'
+                  },
+                  method
+                });
+              } catch (error) {
+                // Swallow Error
+              }
+              const newDate = new Date();
+              // We need to log the time in order to figure out if we need to trigger the state off later
+              endTimestamp = newDate.getTime();
+              if (res.status === 200) {
+                setLastUpdateTime(newDate.getTime());
+                reportUpdate({
+                  id,
+                  entitySlug,
+                  updatedAt: newDate.toISOString()
+                });
+                if (!mostRecentVersionIsAutosaved) {
+                  incrementVersionCount();
+                  setMostRecentVersionIsAutosaved(true);
+                  setUnpublishedVersionCount(prev => prev + 1);
                 }
-                return res.json();
-              }).then(json => {
-                if (versionsConfig?.drafts && versionsConfig?.drafts?.validate && json?.errors) {
-                  if (Array.isArray(json.errors)) {
-                    const [fieldErrors, nonFieldErrors] = json.errors.reduce(([fieldErrs, nonFieldErrs], err) => {
-                      const newFieldErrs = [];
-                      const newNonFieldErrs = [];
-                      if (err?.message) {
-                        newNonFieldErrs.push(err);
-                      }
-                      if (Array.isArray(err?.data)) {
-                        err.data.forEach(dataError => {
-                          if (dataError?.field) {
-                            newFieldErrs.push(dataError);
-                          } else {
-                            newNonFieldErrs.push(dataError);
-                          }
-                        });
-                      }
-                      return [[...fieldErrs, ...newFieldErrs], [...nonFieldErrs, ...newNonFieldErrs]];
-                    }, [[], []]);
-                    dispatchFields({
-                      type: 'ADD_SERVER_ERRORS',
-                      errors: fieldErrors
-                    });
-                    nonFieldErrors.forEach(err_0 => {
-                      toast.error(err_0.message || i18n.t('error:unknown'));
-                    });
-                    setSubmitted(true);
-                    setSaving(false);
-                    return;
-                  }
-                } else {
-                  // If it's not an error then we can update the document data inside the context
-                  const document = json?.doc || json?.result;
-                  // Manually update the data since this function doesn't fire the `submit` function from useForm
-                  if (document) {
-                    updateSavedDocumentData(document);
-                  }
+              }
+              const json = await res.json();
+              if (versionsConfig?.drafts && versionsConfig?.drafts?.validate && json?.errors) {
+                if (Array.isArray(json.errors)) {
+                  const [fieldErrors, nonFieldErrors] = json.errors.reduce(([fieldErrs, nonFieldErrs], err) => {
+                    const newFieldErrs = [];
+                    const newNonFieldErrs = [];
+                    if (err?.message) {
+                      newNonFieldErrs.push(err);
+                    }
+                    if (Array.isArray(err?.data)) {
+                      err.data.forEach(dataError => {
+                        if (dataError?.field) {
+                          newFieldErrs.push(dataError);
+                        } else {
+                          newNonFieldErrs.push(dataError);
+                        }
+                      });
+                    }
+                    return [[...fieldErrs, ...newFieldErrs], [...nonFieldErrs, ...newNonFieldErrs]];
+                  }, [[], []]);
+                  dispatchFields({
+                    type: 'ADD_SERVER_ERRORS',
+                    errors: fieldErrors
+                  });
+                  nonFieldErrors.forEach(err_0 => {
+                    toast.error(err_0.message || i18n.t('error:unknown'));
+                  });
+                  // Set valid to false internally so the queue doesn't process
+                  isValidRef.current = false;
+                  setIsValid(false);
+                  setSubmitted(true);
+                  hideIndicator();
+                  return;
                 }
-              }).then(() => {
-                // If request was faster than minimum animation time, animate the difference
-                if (endTimestamp - startTimestamp < minimumAnimationTime) {
-                  autosaveTimeout = setTimeout(() => {
-                    setSaving(false);
-                  }, minimumAnimationTime - (endTimestamp - startTimestamp));
-                } else {
-                  setSaving(false);
+              } else {
+                // If it's not an error then we can update the document data inside the context
+                const document = json?.doc || json?.result;
+                // Manually update the data since this function doesn't fire the `submit` function from useForm
+                if (document) {
+                  setIsValid(true);
+                  // Reset internal state allowing the queue to process
+                  isValidRef.current = true;
+                  updateSavedDocumentData(document);
                 }
-              });
+              }
+              hideIndicator();
             }
           }
         }
@@ -216,34 +240,45 @@ export const Autosave = ({
     };
     queueRef.current.push(autosave);
     void processQueue();
-    return {
-      abortController,
-      autosaveTimeout
-    };
   });
+  const didMount = useRef(false);
+  const previousDebouncedFieldValues = useRef(reduceFieldsToValues(debouncedFields));
   // When debounced fields change, autosave
   useEffect(() => {
-    const {
-      abortController: abortController_0,
-      autosaveTimeout: autosaveTimeout_0
-    } = handleAutosave();
+    /**
+    * Ensure autosave doesn't run on mount
+    */
+    if (!didMount.current) {
+      didMount.current = true;
+      return;
+    }
+    /**
+    * Ensure autosave only runs if the form data changes, not every time the entire form state changes
+    */
+    const debouncedFieldValues = reduceFieldsToValues(debouncedFields);
+    if (dequal(debouncedFieldValues, previousDebouncedFieldValues)) {
+      return;
+    }
+    previousDebouncedFieldValues.current = debouncedFieldValues;
+    handleAutosave();
+  }, [debouncedFields]);
+  /**
+  * If component unmounts, clear the autosave timeout
+  */
+  useEffect(() => {
     return () => {
-      if (autosaveTimeout_0) {
-        clearTimeout(autosaveTimeout_0);
-      }
-      if (abortController_0.signal) {
-        try {
-          abortController_0.abort('Autosave closed early.');
-        } catch (error) {
-          // swallow error
-        }
-      }
-      setSaving(false);
+      stopAutoSaveIndicator();
     };
-  }, [debouncedFields]);
+  }, []);
+  const stopAutoSaveIndicator = useEffectEvent(() => {
+    if (autosaveTimeoutRef.current) {
+      clearTimeout(autosaveTimeoutRef.current);
+    }
+    setSaving(false);
+  });
   return /*#__PURE__*/_jsxs("div", {
     className: baseClass,
-    children: [saving && t('general:saving'), !saving && Boolean(lastUpdateTime) && /*#__PURE__*/_jsx(React.Fragment, {
+    children: [validateOnDraft && !isValid && /*#__PURE__*/_jsx(LeaveWithoutSaving, {}), saving && t('general:saving'), !saving && Boolean(lastUpdateTime) && /*#__PURE__*/_jsx(React.Fragment, {
       children: t('version:lastSavedAgo', {
         distance: formatTimeToNow({
           date: lastUpdateTime,

package/dist/elements/Autosave/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["versionDefaults","React","useEffect","useRef","useState","toast","useAllFormFields","useForm","useFormModified","useFormSubmitted","useDebounce","useEffectEvent","useConfig","useDocumentEvents","useDocumentInfo","useLocale","useTranslation","formatTimeToNow","reduceFieldsToValuesWithValidation","baseClass","minimumAnimationTime","Autosave","id","collection","global","globalDoc","config","routes","api","serverURL","docConfig","incrementVersionCount","lastUpdateTime","mostRecentVersionIsAutosaved","setLastUpdateTime","setMostRecentVersionIsAutosaved","setUnpublishedVersionCount","updateSavedDocumentData","queueRef","isProcessingRef","reportUpdate","dispatchFields","setSubmitted","submitted","versionsConfig","versions","fields","modified","code","locale","i18n","t","interval","autosaveInterval","drafts","autosave","saving","setSaving","debouncedFields","fieldRef","modifiedRef","localeRef","debouncedRef","current","processQueue","useCallback","length","latestAction","handleAutosave","abortController","AbortController","autosaveTimeout","undefined","startTimestamp","endTimestamp","Date","getTime","url","method","entitySlug","slug","data","valid","_status","skipSubmission","validate","fetch","body","JSON","stringify","credentials","headers","language","signal","then","res","newDate","status","updatedAt","toISOString","prev","json","errors","Array","isArray","fieldErrors","nonFieldErrors","reduce","fieldErrs","nonFieldErrs","err","newFieldErrs","newNonFieldErrs","message","push","forEach","dataError","field","type","error","document","doc","result","setTimeout","clearTimeout","abort","_jsxs","className","Boolean","_jsx","Fragment","distance","date"],"sources":["../../../src/elements/Autosave/index.tsx"],"sourcesContent":["'use client'\n// TODO: abstract the `next/navigation` dependency out from this component\nimport type { ClientCollectionConfig, ClientGlobalConfig } from 'payload'\n\nimport { versionDefaults } from 'payload/shared'\nimport React, { useEffect, useRef, useState } from 'react'\nimport { toast } from 'sonner'\n\nimport {\n  useAllFormFields,\n  useForm,\n  useFormModified,\n  useFormSubmitted,\n} from '../../forms/Form/context.js'\nimport { useDebounce } from '../../hooks/useDebounce.js'\nimport { useEffectEvent } from '../../hooks/useEffectEvent.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentEvents } from '../../providers/DocumentEvents/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport './index.scss'\nimport { formatTimeToNow } from '../../utilities/formatDate.js'\nimport { reduceFieldsToValuesWithValidation } from '../../utilities/reduceFieldsToValuesWithValidation.js'\n\nconst baseClass = 'autosave'\n// The minimum time the saving state should be shown\nconst minimumAnimationTime = 1000\n\nexport type Props = {\n  collection?: ClientCollectionConfig\n  global?: ClientGlobalConfig\n  id?: number | string\n  publishedDocUpdatedAt: string\n}\n\nexport const Autosave: React.FC<Props> = ({ id, collection, global: globalDoc }) => {\n  const {\n    config: {\n      routes: { api },\n      serverURL,\n    },\n  } = useConfig()\n  const {\n    docConfig,\n    incrementVersionCount,\n    lastUpdateTime,\n    mostRecentVersionIsAutosaved,\n    setLastUpdateTime,\n    setMostRecentVersionIsAutosaved,\n    setUnpublishedVersionCount,\n    updateSavedDocumentData,\n  } = useDocumentInfo()\n  const queueRef = useRef([])\n  const isProcessingRef = useRef(false)\n\n  const { reportUpdate } = useDocumentEvents()\n  const { dispatchFields, setSubmitted } = useForm()\n  const submitted = useFormSubmitted()\n  const versionsConfig = docConfig?.versions\n\n  const [fields] = useAllFormFields()\n  const modified = useFormModified()\n  const { code: locale } = useLocale()\n  const { i18n, t } = useTranslation()\n\n  let interval = versionDefaults.autosaveInterval\n  if (versionsConfig.drafts && versionsConfig.drafts.autosave) {\n    interval = versionsConfig.drafts.autosave.interval\n  }\n\n  const [saving, setSaving] = useState(false)\n  const debouncedFields = useDebounce(fields, interval)\n  const fieldRef = useRef(fields)\n  const modifiedRef = useRef(modified)\n  const localeRef = useRef(locale)\n  const debouncedRef = useRef(debouncedFields)\n\n  debouncedRef.current = debouncedFields\n\n  // Store fields in ref so the autosave func\n  // can always retrieve the most to date copies\n  // after the timeout has executed\n  fieldRef.current = fields\n\n  // Store modified in ref so the autosave func\n  // can bail out if modified becomes false while\n  // timing out during autosave\n  modifiedRef.current = modified\n\n  // Store locale in ref so the autosave func\n  // can always retrieve the most to date locale\n  localeRef.current = locale\n\n  const processQueue = React.useCallback(async () => {\n    if (isProcessingRef.current || queueRef.current.length === 0) {\n      return\n    }\n\n    isProcessingRef.current = true\n    const latestAction = queueRef.current[queueRef.current.length - 1]\n    queueRef.current = []\n\n    try {\n      await latestAction()\n    } finally {\n      isProcessingRef.current = false\n      if (queueRef.current.length > 0) {\n        await processQueue()\n      }\n    }\n  }, [])\n\n  const handleAutosave = useEffectEvent(() => {\n    const abortController = new AbortController()\n    let autosaveTimeout = undefined\n    // We need to log the time in order to figure out if we need to trigger the state off later\n    let startTimestamp = undefined\n    let endTimestamp = undefined\n\n    const autosave = async () => {\n      if (modified) {\n        startTimestamp = new Date().getTime()\n\n        setSaving(true)\n\n        let url: string\n        let method: string\n        let entitySlug: string\n\n        if (collection && id) {\n          entitySlug = collection.slug\n          url = `${serverURL}${api}/${entitySlug}/${id}?draft=true&autosave=true&locale=${localeRef.current}`\n          method = 'PATCH'\n        }\n\n        if (globalDoc) {\n          entitySlug = globalDoc.slug\n          url = `${serverURL}${api}/globals/${entitySlug}?draft=true&autosave=true&locale=${localeRef.current}`\n          method = 'POST'\n        }\n\n        if (url) {\n          if (modifiedRef.current) {\n            const { data, valid } = {\n              ...reduceFieldsToValuesWithValidation(fieldRef.current, true),\n            }\n            data._status = 'draft'\n            const skipSubmission =\n              submitted && !valid && versionsConfig?.drafts && versionsConfig?.drafts?.validate\n\n            if (!skipSubmission) {\n              await fetch(url, {\n                body: JSON.stringify(data),\n                credentials: 'include',\n                headers: {\n                  'Accept-Language': i18n.language,\n                  'Content-Type': 'application/json',\n                },\n                method,\n                signal: abortController.signal,\n              })\n                .then((res) => {\n                  const newDate = new Date()\n                  // We need to log the time in order to figure out if we need to trigger the state off later\n                  endTimestamp = newDate.getTime()\n\n                  if (res.status === 200) {\n                    setLastUpdateTime(newDate.getTime())\n\n                    reportUpdate({\n                      id,\n                      entitySlug,\n                      updatedAt: newDate.toISOString(),\n                    })\n\n                    if (!mostRecentVersionIsAutosaved) {\n                      incrementVersionCount()\n                      setMostRecentVersionIsAutosaved(true)\n                      setUnpublishedVersionCount((prev) => prev + 1)\n                    }\n                  }\n\n                  return res.json()\n                })\n                .then((json) => {\n                  if (versionsConfig?.drafts && versionsConfig?.drafts?.validate && json?.errors) {\n                    if (Array.isArray(json.errors)) {\n                      const [fieldErrors, nonFieldErrors] = json.errors.reduce(\n                        ([fieldErrs, nonFieldErrs], err) => {\n                          const newFieldErrs = []\n                          const newNonFieldErrs = []\n\n                          if (err?.message) {\n                            newNonFieldErrs.push(err)\n                          }\n\n                          if (Array.isArray(err?.data)) {\n                            err.data.forEach((dataError) => {\n                              if (dataError?.field) {\n                                newFieldErrs.push(dataError)\n                              } else {\n                                newNonFieldErrs.push(dataError)\n                              }\n                            })\n                          }\n\n                          return [\n                            [...fieldErrs, ...newFieldErrs],\n                            [...nonFieldErrs, ...newNonFieldErrs],\n                          ]\n                        },\n                        [[], []],\n                      )\n\n                      dispatchFields({\n                        type: 'ADD_SERVER_ERRORS',\n                        errors: fieldErrors,\n                      })\n\n                      nonFieldErrors.forEach((err) => {\n                        toast.error(err.message || i18n.t('error:unknown'))\n                      })\n\n                      setSubmitted(true)\n                      setSaving(false)\n                      return\n                    }\n                  } else {\n                    // If it's not an error then we can update the document data inside the context\n                    const document = json?.doc || json?.result\n\n                    // Manually update the data since this function doesn't fire the `submit` function from useForm\n                    if (document) {\n                      updateSavedDocumentData(document)\n                    }\n                  }\n                })\n                .then(() => {\n                  // If request was faster than minimum animation time, animate the difference\n                  if (endTimestamp - startTimestamp < minimumAnimationTime) {\n                    autosaveTimeout = setTimeout(\n                      () => {\n                        setSaving(false)\n                      },\n                      minimumAnimationTime - (endTimestamp - startTimestamp),\n                    )\n                  } else {\n                    setSaving(false)\n                  }\n                })\n            }\n          }\n        }\n      }\n    }\n\n    queueRef.current.push(autosave)\n    void processQueue()\n\n    return { abortController, autosaveTimeout }\n  })\n\n  // When debounced fields change, autosave\n  useEffect(() => {\n    const { abortController, autosaveTimeout } = handleAutosave()\n\n    return () => {\n      if (autosaveTimeout) {\n        clearTimeout(autosaveTimeout)\n      }\n      if (abortController.signal) {\n        try {\n          abortController.abort('Autosave closed early.')\n        } catch (error) {\n          // swallow error\n        }\n      }\n      setSaving(false)\n    }\n  }, [debouncedFields])\n\n  return (\n    <div className={baseClass}>\n      {saving && t('general:saving')}\n      {!saving && Boolean(lastUpdateTime) && (\n        <React.Fragment>\n          {t('version:lastSavedAgo', {\n            distance: formatTimeToNow({ date: lastUpdateTime, i18n }),\n          })}\n        </React.Fragment>\n      )}\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["dequal","reduceFieldsToValues","versionDefaults","React","useDeferredValue","useEffect","useRef","useState","toast","useAllFormFields","useForm","useFormModified","useFormSubmitted","useDebounce","useEffectEvent","useConfig","useDocumentEvents","useDocumentInfo","useLocale","useTranslation","formatTimeToNow","reduceFieldsToValuesWithValidation","LeaveWithoutSaving","baseClass","minimumAnimationTime","Autosave","id","collection","global","globalDoc","config","routes","api","serverURL","docConfig","incrementVersionCount","lastUpdateTime","mostRecentVersionIsAutosaved","setLastUpdateTime","setMostRecentVersionIsAutosaved","setUnpublishedVersionCount","updateSavedDocumentData","queueRef","isProcessingRef","reportUpdate","dispatchFields","isValid","setIsValid","setSubmitted","fields","modified","submitted","code","locale","i18n","t","versionsConfig","versions","interval","autosaveInterval","drafts","autosave","validateOnDraft","Boolean","validate","_saving","setSaving","saving","debouncedFields","fieldRef","modifiedRef","localeRef","isValidRef","current","processQueue","useCallback","length","latestAction","autosaveTimeoutRef","handleAutosave","undefined","startTimestamp","endTimestamp","hideIndicator","setTimeout","stopAutoSaveIndicator","Date","getTime","url","method","entitySlug","slug","data","valid","_status","skipSubmission","res","fetch","body","JSON","stringify","credentials","headers","language","error","newDate","status","updatedAt","toISOString","prev","json","errors","Array","isArray","fieldErrors","nonFieldErrors","reduce","fieldErrs","nonFieldErrs","err","newFieldErrs","newNonFieldErrs","message","push","forEach","dataError","field","type","document","doc","result","didMount","previousDebouncedFieldValues","debouncedFieldValues","clearTimeout","_jsxs","className","_jsx","Fragment","distance","date"],"sources":["../../../src/elements/Autosave/index.tsx"],"sourcesContent":["'use client'\n// TODO: abstract the `next/navigation` dependency out from this component\nimport type { ClientCollectionConfig, ClientGlobalConfig } from 'payload'\n\nimport { dequal } from 'dequal/lite'\nimport { reduceFieldsToValues, versionDefaults } from 'payload/shared'\nimport React, { useDeferredValue, useEffect, useRef, useState } from 'react'\nimport { toast } from 'sonner'\n\nimport {\n  useAllFormFields,\n  useForm,\n  useFormModified,\n  useFormSubmitted,\n} from '../../forms/Form/context.js'\nimport { useDebounce } from '../../hooks/useDebounce.js'\nimport { useEffectEvent } from '../../hooks/useEffectEvent.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentEvents } from '../../providers/DocumentEvents/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport './index.scss'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { formatTimeToNow } from '../../utilities/formatDate.js'\nimport { reduceFieldsToValuesWithValidation } from '../../utilities/reduceFieldsToValuesWithValidation.js'\nimport { LeaveWithoutSaving } from '../LeaveWithoutSaving/index.js'\n\nconst baseClass = 'autosave'\n// The minimum time the saving state should be shown\nconst minimumAnimationTime = 1000\n\nexport type Props = {\n  collection?: ClientCollectionConfig\n  global?: ClientGlobalConfig\n  id?: number | string\n  publishedDocUpdatedAt: string\n}\n\nexport const Autosave: React.FC<Props> = ({ id, collection, global: globalDoc }) => {\n  const {\n    config: {\n      routes: { api },\n      serverURL,\n    },\n  } = useConfig()\n  const {\n    docConfig,\n    incrementVersionCount,\n    lastUpdateTime,\n    mostRecentVersionIsAutosaved,\n    setLastUpdateTime,\n    setMostRecentVersionIsAutosaved,\n    setUnpublishedVersionCount,\n    updateSavedDocumentData,\n  } = useDocumentInfo()\n  const queueRef = useRef([])\n  const isProcessingRef = useRef(false)\n\n  const { reportUpdate } = useDocumentEvents()\n  const { dispatchFields, isValid, setIsValid, setSubmitted } = useForm()\n\n  const [fields] = useAllFormFields()\n  const modified = useFormModified()\n  const submitted = useFormSubmitted()\n\n  const { code: locale } = useLocale()\n  const { i18n, t } = useTranslation()\n\n  const versionsConfig = docConfig?.versions\n  let interval = versionDefaults.autosaveInterval\n\n  if (versionsConfig.drafts && versionsConfig.drafts.autosave) {\n    interval = versionsConfig.drafts.autosave.interval\n  }\n\n  const validateOnDraft = Boolean(\n    docConfig?.versions?.drafts && docConfig?.versions?.drafts.validate,\n  )\n\n  const [_saving, setSaving] = useState(false)\n  const saving = useDeferredValue(_saving)\n  const debouncedFields = useDebounce(fields, interval)\n  const fieldRef = useRef(fields)\n  const modifiedRef = useRef(modified)\n  const localeRef = useRef(locale)\n  /**\n   * Track the validation internally so Autosave can determine when to run queue processing again\n   * Helps us prevent infinite loops when the queue is processing and the form is invalid\n   */\n  const isValidRef = useRef(isValid)\n\n  // Store fields in ref so the autosave func\n  // can always retrieve the most to date copies\n  // after the timeout has executed\n  fieldRef.current = fields\n\n  // Store modified in ref so the autosave func\n  // can bail out if modified becomes false while\n  // timing out during autosave\n  modifiedRef.current = modified\n\n  // Store locale in ref so the autosave func\n  // can always retrieve the most to date locale\n  localeRef.current = locale\n\n  const processQueue = React.useCallback(async () => {\n    if (isProcessingRef.current || queueRef.current.length === 0) {\n      return\n    }\n\n    if (!isValidRef.current) {\n      // Clear queue so we don't end up in an infinite loop\n      queueRef.current = []\n      // Reset internal validation state so queue processing can run again\n      isValidRef.current = true\n      return\n    }\n    isProcessingRef.current = true\n\n    const latestAction = queueRef.current[queueRef.current.length - 1]\n    queueRef.current = []\n\n    try {\n      await latestAction()\n    } finally {\n      isProcessingRef.current = false\n      if (queueRef.current.length > 0) {\n        await processQueue()\n      }\n    }\n  }, [])\n\n  const autosaveTimeoutRef = useRef<NodeJS.Timeout | null>(null)\n\n  const handleAutosave = useEffectEvent(() => {\n    autosaveTimeoutRef.current = undefined\n    // We need to log the time in order to figure out if we need to trigger the state off later\n    let startTimestamp = undefined\n    let endTimestamp = undefined\n\n    const hideIndicator = () => {\n      // If request was faster than minimum animation time, animate the difference\n      if (endTimestamp - startTimestamp < minimumAnimationTime) {\n        autosaveTimeoutRef.current = setTimeout(\n          () => {\n            setSaving(false)\n          },\n          minimumAnimationTime - (endTimestamp - startTimestamp),\n        )\n      } else {\n        stopAutoSaveIndicator()\n      }\n    }\n\n    const autosave = async () => {\n      if (modified) {\n        startTimestamp = new Date().getTime()\n\n        setSaving(true)\n\n        let url: string\n        let method: string\n        let entitySlug: string\n\n        if (collection && id) {\n          entitySlug = collection.slug\n          url = `${serverURL}${api}/${entitySlug}/${id}?draft=true&autosave=true&locale=${localeRef.current}`\n          method = 'PATCH'\n        }\n\n        if (globalDoc) {\n          entitySlug = globalDoc.slug\n          url = `${serverURL}${api}/globals/${entitySlug}?draft=true&autosave=true&locale=${localeRef.current}`\n          method = 'POST'\n        }\n\n        if (url) {\n          if (modifiedRef.current) {\n            const { data, valid } = reduceFieldsToValuesWithValidation(fieldRef.current, true)\n\n            data._status = 'draft'\n\n            const skipSubmission =\n              submitted && !valid && versionsConfig?.drafts && versionsConfig?.drafts?.validate\n\n            if (!skipSubmission && isValidRef.current) {\n              let res\n              try {\n                res = await fetch(url, {\n                  body: JSON.stringify(data),\n                  credentials: 'include',\n                  headers: {\n                    'Accept-Language': i18n.language,\n                    'Content-Type': 'application/json',\n                  },\n                  method,\n                })\n              } catch (error) {\n                // Swallow Error\n              }\n\n              const newDate = new Date()\n              // We need to log the time in order to figure out if we need to trigger the state off later\n              endTimestamp = newDate.getTime()\n\n              if (res.status === 200) {\n                setLastUpdateTime(newDate.getTime())\n\n                reportUpdate({\n                  id,\n                  entitySlug,\n                  updatedAt: newDate.toISOString(),\n                })\n\n                if (!mostRecentVersionIsAutosaved) {\n                  incrementVersionCount()\n                  setMostRecentVersionIsAutosaved(true)\n                  setUnpublishedVersionCount((prev) => prev + 1)\n                }\n              }\n              const json = await res.json()\n\n              if (versionsConfig?.drafts && versionsConfig?.drafts?.validate && json?.errors) {\n                if (Array.isArray(json.errors)) {\n                  const [fieldErrors, nonFieldErrors] = json.errors.reduce(\n                    ([fieldErrs, nonFieldErrs], err) => {\n                      const newFieldErrs = []\n                      const newNonFieldErrs = []\n\n                      if (err?.message) {\n                        newNonFieldErrs.push(err)\n                      }\n\n                      if (Array.isArray(err?.data)) {\n                        err.data.forEach((dataError) => {\n                          if (dataError?.field) {\n                            newFieldErrs.push(dataError)\n                          } else {\n                            newNonFieldErrs.push(dataError)\n                          }\n                        })\n                      }\n\n                      return [\n                        [...fieldErrs, ...newFieldErrs],\n                        [...nonFieldErrs, ...newNonFieldErrs],\n                      ]\n                    },\n                    [[], []],\n                  )\n\n                  dispatchFields({\n                    type: 'ADD_SERVER_ERRORS',\n                    errors: fieldErrors,\n                  })\n\n                  nonFieldErrors.forEach((err) => {\n                    toast.error(err.message || i18n.t('error:unknown'))\n                  })\n\n                  // Set valid to false internally so the queue doesn't process\n                  isValidRef.current = false\n                  setIsValid(false)\n                  setSubmitted(true)\n                  hideIndicator()\n                  return\n                }\n              } else {\n                // If it's not an error then we can update the document data inside the context\n                const document = json?.doc || json?.result\n\n                // Manually update the data since this function doesn't fire the `submit` function from useForm\n                if (document) {\n                  setIsValid(true)\n\n                  // Reset internal state allowing the queue to process\n                  isValidRef.current = true\n                  updateSavedDocumentData(document)\n                }\n              }\n\n              hideIndicator()\n            }\n          }\n        }\n      }\n    }\n\n    queueRef.current.push(autosave)\n    void processQueue()\n  })\n\n  const didMount = useRef(false)\n  const previousDebouncedFieldValues = useRef(reduceFieldsToValues(debouncedFields))\n  // When debounced fields change, autosave\n  useEffect(() => {\n    /**\n     * Ensure autosave doesn't run on mount\n     */\n    if (!didMount.current) {\n      didMount.current = true\n      return\n    }\n\n    /**\n     * Ensure autosave only runs if the form data changes, not every time the entire form state changes\n     */\n    const debouncedFieldValues = reduceFieldsToValues(debouncedFields)\n    if (dequal(debouncedFieldValues, previousDebouncedFieldValues)) {\n      return\n    }\n\n    previousDebouncedFieldValues.current = debouncedFieldValues\n\n    handleAutosave()\n  }, [debouncedFields])\n\n  /**\n   * If component unmounts, clear the autosave timeout\n   */\n  useEffect(() => {\n    return () => {\n      stopAutoSaveIndicator()\n    }\n  }, [])\n\n  const stopAutoSaveIndicator = useEffectEvent(() => {\n    if (autosaveTimeoutRef.current) {\n      clearTimeout(autosaveTimeoutRef.current)\n    }\n\n    setSaving(false)\n  })\n\n  return (\n    <div className={baseClass}>\n      {validateOnDraft && !isValid && <LeaveWithoutSaving />}\n      {saving && t('general:saving')}\n      {!saving && Boolean(lastUpdateTime) && (\n        <React.Fragment>\n          {t('version:lastSavedAgo', {\n            distance: formatTimeToNow({ date: lastUpdateTime, i18n }),\n          })}\n        </React.Fragment>\n      )}\n    </div>\n  )\n}\n"],"mappings":"AAAA;;;AAIA,SAASA,MAAM,QAAQ;AACvB,SAASC,oBAAoB,EAAEC,eAAe,QAAQ;AACtD,OAAOC,KAAA,IAASC,gBAAgB,EAAEC,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ;AACrE,SAASC,KAAK,QAAQ;AAEtB,SACEC,gBAAgB,EAChBC,OAAO,EACPC,eAAe,EACfC,gBAAgB,QACX;AACP,SAASC,WAAW,QAAQ;AAC5B,SAASC,cAAc,QAAQ;AAC/B,SAASC,SAAS,QAAQ;AAC1B,SAASC,iBAAiB,QAAQ;AAClC,SAASC,eAAe,QAAQ;AAChC,SAASC,SAAS,QAAQ;AAC1B,OAAO;AACP,SAASC,cAAc,QAAQ;AAC/B,SAASC,eAAe,QAAQ;AAChC,SAASC,kCAAkC,QAAQ;AACnD,SAASC,kBAAkB,QAAQ;AAEnC,MAAMC,SAAA,GAAY;AAClB;AACA,MAAMC,oBAAA,GAAuB;AAS7B,OAAO,MAAMC,QAAA,GAA4BA,CAAC;EAAEC,EAAE;EAAEC,UAAU;EAAEC,MAAA,EAAQC;AAAS,CAAE;EAC7E,MAAM;IACJC,MAAA,EAAQ;MACNC,MAAA,EAAQ;QAAEC;MAAG,CAAE;MACfC;IAAS;EACV,CACF,GAAGlB,SAAA;EACJ,MAAM;IACJmB,SAAS;IACTC,qBAAqB;IACrBC,cAAc;IACdC,4BAA4B;IAC5BC,iBAAiB;IACjBC,+BAA+B;IAC/BC,0BAA0B;IAC1BC;EAAuB,CACxB,GAAGxB,eAAA;EACJ,MAAMyB,QAAA,GAAWpC,MAAA,CAAO,EAAE;EAC1B,MAAMqC,eAAA,GAAkBrC,MAAA,CAAO;EAE/B,MAAM;IAAEsC;EAAY,CAAE,GAAG5B,iBAAA;EACzB,MAAM;IAAE6B,cAAc;IAAEC,OAAO;IAAEC,UAAU;IAAEC;EAAY,CAAE,GAAGtC,OAAA;EAE9D,MAAM,CAACuC,MAAA,CAAO,GAAGxC,gBAAA;EACjB,MAAMyC,QAAA,GAAWvC,eAAA;EACjB,MAAMwC,SAAA,GAAYvC,gBAAA;EAElB,MAAM;IAAEwC,IAAA,EAAMC;EAAM,CAAE,GAAGnC,SAAA;EACzB,MAAM;IAAEoC,IAAI;IAAEC;EAAC,CAAE,GAAGpC,cAAA;EAEpB,MAAMqC,cAAA,GAAiBtB,SAAA,EAAWuB,QAAA;EAClC,IAAIC,QAAA,GAAWxD,eAAA,CAAgByD,gBAAgB;EAE/C,IAAIH,cAAA,CAAeI,MAAM,IAAIJ,cAAA,CAAeI,MAAM,CAACC,QAAQ,EAAE;IAC3DH,QAAA,GAAWF,cAAA,CAAeI,MAAM,CAACC,QAAQ,CAACH,QAAQ;EACpD;EAEA,MAAMI,eAAA,GAAkBC,OAAA,CACtB7B,SAAA,EAAWuB,QAAA,EAAUG,MAAA,IAAU1B,SAAA,EAAWuB,QAAA,EAAUG,MAAA,CAAOI,QAAA;EAG7D,MAAM,CAACC,OAAA,EAASC,SAAA,CAAU,GAAG3D,QAAA,CAAS;EACtC,MAAM4D,MAAA,GAAS/D,gBAAA,CAAiB6D,OAAA;EAChC,MAAMG,eAAA,GAAkBvD,WAAA,CAAYoC,MAAA,EAAQS,QAAA;EAC5C,MAAMW,QAAA,GAAW/D,MAAA,CAAO2C,MAAA;EACxB,MAAMqB,WAAA,GAAchE,MAAA,CAAO4C,QAAA;EAC3B,MAAMqB,SAAA,GAAYjE,MAAA,CAAO+C,MAAA;EACzB;;;;EAIA,MAAMmB,UAAA,GAAalE,MAAA,CAAOwC,OAAA;EAE1B;EACA;EACA;EACAuB,QAAA,CAASI,OAAO,GAAGxB,MAAA;EAEnB;EACA;EACA;EACAqB,WAAA,CAAYG,OAAO,GAAGvB,QAAA;EAEtB;EACA;EACAqB,SAAA,CAAUE,OAAO,GAAGpB,MAAA;EAEpB,MAAMqB,YAAA,GAAevE,KAAA,CAAMwE,WAAW,CAAC;IACrC,IAAIhC,eAAA,CAAgB8B,OAAO,IAAI/B,QAAA,CAAS+B,OAAO,CAACG,MAAM,KAAK,GAAG;MAC5D;IACF;IAEA,IAAI,CAACJ,UAAA,CAAWC,OAAO,EAAE;MACvB;MACA/B,QAAA,CAAS+B,OAAO,GAAG,EAAE;MACrB;MACAD,UAAA,CAAWC,OAAO,GAAG;MACrB;IACF;IACA9B,eAAA,CAAgB8B,OAAO,GAAG;IAE1B,MAAMI,YAAA,GAAenC,QAAA,CAAS+B,OAAO,CAAC/B,QAAA,CAAS+B,OAAO,CAACG,MAAM,GAAG,EAAE;IAClElC,QAAA,CAAS+B,OAAO,GAAG,EAAE;IAErB,IAAI;MACF,MAAMI,YAAA;IACR,UAAU;MACRlC,eAAA,CAAgB8B,OAAO,GAAG;MAC1B,IAAI/B,QAAA,CAAS+B,OAAO,CAACG,MAAM,GAAG,GAAG;QAC/B,MAAMF,YAAA;MACR;IACF;EACF,GAAG,EAAE;EAEL,MAAMI,kBAAA,GAAqBxE,MAAA,CAA8B;EAEzD,MAAMyE,cAAA,GAAiBjE,cAAA,CAAe;IACpCgE,kBAAA,CAAmBL,OAAO,GAAGO,SAAA;IAC7B;IACA,IAAIC,cAAA,GAAiBD,SAAA;IACrB,IAAIE,YAAA,GAAeF,SAAA;IAEnB,MAAMG,aAAA,GAAgBA,CAAA;MACpB;MACA,IAAID,YAAA,GAAeD,cAAA,GAAiBzD,oBAAA,EAAsB;QACxDsD,kBAAA,CAAmBL,OAAO,GAAGW,UAAA,CAC3B;UACElB,SAAA,CAAU;QACZ,GACA1C,oBAAA,IAAwB0D,YAAA,GAAeD,cAAa;MAExD,OAAO;QACLI,qBAAA;MACF;IACF;IAEA,MAAMxB,QAAA,GAAW,MAAAA,CAAA;MACf,IAAIX,QAAA,EAAU;QACZ+B,cAAA,GAAiB,IAAIK,IAAA,GAAOC,OAAO;QAEnCrB,SAAA,CAAU;QAEV,IAAIsB,GAAA;QACJ,IAAIC,MAAA;QACJ,IAAIC,UAAA;QAEJ,IAAI/D,UAAA,IAAcD,EAAA,EAAI;UACpBgE,UAAA,GAAa/D,UAAA,CAAWgE,IAAI;UAC5BH,GAAA,GAAM,GAAGvD,SAAA,GAAYD,GAAA,IAAO0D,UAAA,IAAchE,EAAA,oCAAsC6C,SAAA,CAAUE,OAAO,EAAE;UACnGgB,MAAA,GAAS;QACX;QAEA,IAAI5D,SAAA,EAAW;UACb6D,UAAA,GAAa7D,SAAA,CAAU8D,IAAI;UAC3BH,GAAA,GAAM,GAAGvD,SAAA,GAAYD,GAAA,YAAe0D,UAAA,oCAA8CnB,SAAA,CAAUE,OAAO,EAAE;UACrGgB,MAAA,GAAS;QACX;QAEA,IAAID,GAAA,EAAK;UACP,IAAIlB,WAAA,CAAYG,OAAO,EAAE;YACvB,MAAM;cAAEmB,IAAI;cAAEC;YAAK,CAAE,GAAGxE,kCAAA,CAAmCgD,QAAA,CAASI,OAAO,EAAE;YAE7EmB,IAAA,CAAKE,OAAO,GAAG;YAEf,MAAMC,cAAA,GACJ5C,SAAA,IAAa,CAAC0C,KAAA,IAASrC,cAAA,EAAgBI,MAAA,IAAUJ,cAAA,EAAgBI,MAAA,EAAQI,QAAA;YAE3E,IAAI,CAAC+B,cAAA,IAAkBvB,UAAA,CAAWC,OAAO,EAAE;cACzC,IAAIuB,GAAA;cACJ,IAAI;gBACFA,GAAA,GAAM,MAAMC,KAAA,CAAMT,GAAA,EAAK;kBACrBU,IAAA,EAAMC,IAAA,CAAKC,SAAS,CAACR,IAAA;kBACrBS,WAAA,EAAa;kBACbC,OAAA,EAAS;oBACP,mBAAmBhD,IAAA,CAAKiD,QAAQ;oBAChC,gBAAgB;kBAClB;kBACAd;gBACF;cACF,EAAE,OAAOe,KAAA,EAAO;gBACd;cAAA;cAGF,MAAMC,OAAA,GAAU,IAAInB,IAAA;cACpB;cACAJ,YAAA,GAAeuB,OAAA,CAAQlB,OAAO;cAE9B,IAAIS,GAAA,CAAIU,MAAM,KAAK,KAAK;gBACtBpE,iBAAA,CAAkBmE,OAAA,CAAQlB,OAAO;gBAEjC3C,YAAA,CAAa;kBACXlB,EAAA;kBACAgE,UAAA;kBACAiB,SAAA,EAAWF,OAAA,CAAQG,WAAW;gBAChC;gBAEA,IAAI,CAACvE,4BAAA,EAA8B;kBACjCF,qBAAA;kBACAI,+BAAA,CAAgC;kBAChCC,0BAAA,CAA4BqE,IAAA,IAASA,IAAA,GAAO;gBAC9C;cACF;cACA,MAAMC,IAAA,GAAO,MAAMd,GAAA,CAAIc,IAAI;cAE3B,IAAItD,cAAA,EAAgBI,MAAA,IAAUJ,cAAA,EAAgBI,MAAA,EAAQI,QAAA,IAAY8C,IAAA,EAAMC,MAAA,EAAQ;gBAC9E,IAAIC,KAAA,CAAMC,OAAO,CAACH,IAAA,CAAKC,MAAM,GAAG;kBAC9B,MAAM,CAACG,WAAA,EAAaC,cAAA,CAAe,GAAGL,IAAA,CAAKC,MAAM,CAACK,MAAM,CACtD,CAAC,CAACC,SAAA,EAAWC,YAAA,CAAa,EAAEC,GAAA;oBAC1B,MAAMC,YAAA,GAAe,EAAE;oBACvB,MAAMC,eAAA,GAAkB,EAAE;oBAE1B,IAAIF,GAAA,EAAKG,OAAA,EAAS;sBAChBD,eAAA,CAAgBE,IAAI,CAACJ,GAAA;oBACvB;oBAEA,IAAIP,KAAA,CAAMC,OAAO,CAACM,GAAA,EAAK3B,IAAA,GAAO;sBAC5B2B,GAAA,CAAI3B,IAAI,CAACgC,OAAO,CAAEC,SAAA;wBAChB,IAAIA,SAAA,EAAWC,KAAA,EAAO;0BACpBN,YAAA,CAAaG,IAAI,CAACE,SAAA;wBACpB,OAAO;0BACLJ,eAAA,CAAgBE,IAAI,CAACE,SAAA;wBACvB;sBACF;oBACF;oBAEA,OAAO,CACL,C,GAAIR,SAAA,E,GAAcG,YAAA,CAAa,EAC/B,C,GAAIF,YAAA,E,GAAiBG,eAAA,CAAgB,CACtC;kBACH,GACA,CAAC,EAAE,EAAE,EAAE,CAAC;kBAGV5E,cAAA,CAAe;oBACbkF,IAAA,EAAM;oBACNhB,MAAA,EAAQG;kBACV;kBAEAC,cAAA,CAAeS,OAAO,CAAEL,KAAA;oBACtB/G,KAAA,CAAMgG,KAAK,CAACe,KAAA,CAAIG,OAAO,IAAIpE,IAAA,CAAKC,CAAC,CAAC;kBACpC;kBAEA;kBACAiB,UAAA,CAAWC,OAAO,GAAG;kBACrB1B,UAAA,CAAW;kBACXC,YAAA,CAAa;kBACbmC,aAAA;kBACA;gBACF;cACF,OAAO;gBACL;gBACA,MAAM6C,QAAA,GAAWlB,IAAA,EAAMmB,GAAA,IAAOnB,IAAA,EAAMoB,MAAA;gBAEpC;gBACA,IAAIF,QAAA,EAAU;kBACZjF,UAAA,CAAW;kBAEX;kBACAyB,UAAA,CAAWC,OAAO,GAAG;kBACrBhC,uBAAA,CAAwBuF,QAAA;gBAC1B;cACF;cAEA7C,aAAA;YACF;UACF;QACF;MACF;IACF;IAEAzC,QAAA,CAAS+B,OAAO,CAACkD,IAAI,CAAC9D,QAAA;IACtB,KAAKa,YAAA;EACP;EAEA,MAAMyD,QAAA,GAAW7H,MAAA,CAAO;EACxB,MAAM8H,4BAAA,GAA+B9H,MAAA,CAAOL,oBAAA,CAAqBmE,eAAA;EACjE;EACA/D,SAAA,CAAU;IACR;;;IAGA,IAAI,CAAC8H,QAAA,CAAS1D,OAAO,EAAE;MACrB0D,QAAA,CAAS1D,OAAO,GAAG;MACnB;IACF;IAEA;;;IAGA,MAAM4D,oBAAA,GAAuBpI,oBAAA,CAAqBmE,eAAA;IAClD,IAAIpE,MAAA,CAAOqI,oBAAA,EAAsBD,4BAAA,GAA+B;MAC9D;IACF;IAEAA,4BAAA,CAA6B3D,OAAO,GAAG4D,oBAAA;IAEvCtD,cAAA;EACF,GAAG,CAACX,eAAA,CAAgB;EAEpB;;;EAGA/D,SAAA,CAAU;IACR,OAAO;MACLgF,qBAAA;IACF;EACF,GAAG,EAAE;EAEL,MAAMA,qBAAA,GAAwBvE,cAAA,CAAe;IAC3C,IAAIgE,kBAAA,CAAmBL,OAAO,EAAE;MAC9B6D,YAAA,CAAaxD,kBAAA,CAAmBL,OAAO;IACzC;IAEAP,SAAA,CAAU;EACZ;EAEA,oBACEqE,KAAA,CAAC;IAAIC,SAAA,EAAWjH,SAAA;eACbuC,eAAA,IAAmB,CAAChB,OAAA,iBAAW2F,IAAA,CAACnH,kBAAA,OAChC6C,MAAA,IAAUZ,CAAA,CAAE,mBACZ,CAACY,MAAA,IAAUJ,OAAA,CAAQ3B,cAAA,kBAClBqG,IAAA,CAACtI,KAAA,CAAMuI,QAAQ;gBACZnF,CAAA,CAAE,wBAAwB;QACzBoF,QAAA,EAAUvH,eAAA,CAAgB;UAAEwH,IAAA,EAAMxG,cAAA;UAAgBkB;QAAK;MACzD;;;AAKV","ignoreList":[]}

package/dist/elements/Button/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Button/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmC,MAAM,OAAO,CAAA;AAEvD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAWvC,OAAO,cAAc,CAAA;AAarB,eAAO,MAAM,cAAc;;;;;uBAqB1B,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAmJlC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Button/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmC,MAAM,OAAO,CAAA;AAEvD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAWvC,OAAO,cAAc,CAAA;AAarB,eAAO,MAAM,cAAc;;;;;uBAqB1B,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAoJlC,CAAA"}

package/dist/elements/Button/index.js

@@ -161,6 +161,7 @@ export const Button = props => {
         className: disabled && !enableSubMenu ? `${baseClass}--popup-disabled` : '',
         disabled: disabled && !enableSubMenu,
         horizontalAlign: "right",
+        id: `${id}-popup`,
         noBackground: true,
         render: ({
           close

package/dist/elements/Button/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","Fragment","isValidElement","ChevronIcon","EditIcon","LinkIcon","PlusIcon","SwapIcon","XIcon","Link","Popup","Tooltip","icons","chevron","edit","link","plus","swap","x","baseClass","ButtonContents","children","icon","showTooltip","tooltip","BuiltInIcon","_jsxs","_jsx","className","show","Button","props","id","type","ariaLabel","buttonStyle","disabled","el","enableSubMenu","iconPosition","iconStyle","newTab","onClick","onMouseDown","ref","round","size","SubMenuPopupContent","to","url","setShowTooltip","useState","classes","filter","Boolean","join","handleClick","event","preventDefault","styleClasses","buttonProps","undefined","onPointerEnter","onPointerLeave","rel","target","buttonElement","prefetch","href","Tag","button","buttonSize","horizontalAlign","noBackground","render","close","verticalAlign"],"sources":["../../../src/elements/Button/index.tsx"],"sourcesContent":["'use client'\nimport React, { Fragment, isValidElement } from 'react'\n\nimport type { Props } from './types.js'\n\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { EditIcon } from '../../icons/Edit/index.js'\nimport { LinkIcon } from '../../icons/Link/index.js'\nimport { PlusIcon } from '../../icons/Plus/index.js'\nimport { SwapIcon } from '../../icons/Swap/index.js'\nimport { XIcon } from '../../icons/X/index.js'\nimport { Link } from '../Link/index.js'\nimport { Popup } from '../Popup/index.js'\nimport { Tooltip } from '../Tooltip/index.js'\nimport './index.scss'\n\nconst icons = {\n  chevron: ChevronIcon,\n  edit: EditIcon,\n  link: LinkIcon,\n  plus: PlusIcon,\n  swap: SwapIcon,\n  x: XIcon,\n}\n\nconst baseClass = 'btn'\n\nexport const ButtonContents = ({ children, icon, showTooltip, tooltip }) => {\n  const BuiltInIcon = icons[icon]\n\n  return (\n    <Fragment>\n      {tooltip && (\n        <Tooltip className={`${baseClass}__tooltip`} show={showTooltip}>\n          {tooltip}\n        </Tooltip>\n      )}\n      <span className={`${baseClass}__content`}>\n        {children && <span className={`${baseClass}__label`}>{children}</span>}\n        {icon && (\n          <span className={`${baseClass}__icon`}>\n            {isValidElement(icon) && icon}\n            {BuiltInIcon && <BuiltInIcon />}\n          </span>\n        )}\n      </span>\n    </Fragment>\n  )\n}\n\nexport const Button: React.FC<Props> = (props) => {\n  const {\n    id,\n    type = 'button',\n    'aria-label': ariaLabel,\n    buttonStyle = 'primary',\n    children,\n    className,\n    disabled,\n    el = 'button',\n    enableSubMenu,\n    icon,\n    iconPosition = 'right',\n    iconStyle = 'without-border',\n    newTab,\n    onClick,\n    onMouseDown,\n    ref,\n    round,\n    size = 'medium',\n    SubMenuPopupContent,\n    to,\n    tooltip,\n    url,\n  } = props\n\n  const [showTooltip, setShowTooltip] = React.useState(false)\n\n  const classes = [\n    baseClass,\n    className && className,\n    icon && `${baseClass}--icon`,\n    iconStyle && `${baseClass}--icon-style-${iconStyle}`,\n    icon && !children && `${baseClass}--icon-only`,\n    size && `${baseClass}--size-${size}`,\n    icon && iconPosition && `${baseClass}--icon-position-${iconPosition}`,\n    tooltip && `${baseClass}--has-tooltip`,\n    !SubMenuPopupContent && `${baseClass}--withoutPopup`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  function handleClick(event) {\n    setShowTooltip(false)\n    if (type !== 'submit' && onClick) {\n      event.preventDefault()\n    }\n    if (onClick) {\n      onClick(event)\n    }\n  }\n\n  const styleClasses = [\n    buttonStyle && `${baseClass}--style-${buttonStyle}`,\n    disabled && `${baseClass}--disabled`,\n    round && `${baseClass}--round`,\n    SubMenuPopupContent ? `${baseClass}--withPopup` : `${baseClass}--withoutPopup`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  const buttonProps = {\n    id,\n    type,\n    'aria-disabled': disabled,\n    'aria-label': ariaLabel,\n    className: !SubMenuPopupContent ? [classes, styleClasses].join(' ') : classes,\n    disabled,\n    onClick: !disabled ? handleClick : undefined,\n    onMouseDown: !disabled ? onMouseDown : undefined,\n    onPointerEnter: tooltip ? () => setShowTooltip(true) : undefined,\n    onPointerLeave: tooltip ? () => setShowTooltip(false) : undefined,\n    rel: newTab ? 'noopener noreferrer' : undefined,\n    target: newTab ? '_blank' : undefined,\n  }\n\n  let buttonElement\n  let prefetch\n\n  switch (el) {\n    case 'anchor':\n      buttonElement = (\n        <a\n          {...buttonProps}\n          href={!disabled ? url : undefined}\n          ref={ref as React.RefObject<HTMLAnchorElement>}\n        >\n          <ButtonContents icon={icon} showTooltip={showTooltip} tooltip={tooltip}>\n            {children}\n          </ButtonContents>\n        </a>\n      )\n      break\n\n    case 'link':\n      if (disabled) {\n        buttonElement = (\n          <div {...buttonProps}>\n            <ButtonContents icon={icon} showTooltip={showTooltip} tooltip={tooltip}>\n              {children}\n            </ButtonContents>\n          </div>\n        )\n      }\n\n      buttonElement = (\n        <Link {...buttonProps} href={to || url} prefetch={prefetch}>\n          <ButtonContents icon={icon} showTooltip={showTooltip} tooltip={tooltip}>\n            {children}\n          </ButtonContents>\n        </Link>\n      )\n\n      break\n\n    default:\n      const Tag = el // eslint-disable-line no-case-declarations\n\n      buttonElement = (\n        <Tag ref={ref} type=\"submit\" {...buttonProps}>\n          <ButtonContents icon={icon} showTooltip={showTooltip} tooltip={tooltip}>\n            {children}\n          </ButtonContents>\n        </Tag>\n      )\n      break\n  }\n  if (SubMenuPopupContent) {\n    return (\n      <div className={styleClasses}>\n        {buttonElement}\n        <Popup\n          button={<ChevronIcon />}\n          buttonSize={size}\n          className={disabled && !enableSubMenu ? `${baseClass}--popup-disabled` : ''}\n          disabled={disabled && !enableSubMenu}\n          horizontalAlign=\"right\"\n          noBackground\n          render={({ close }) => SubMenuPopupContent({ close: () => close() })}\n          size=\"large\"\n          verticalAlign=\"bottom\"\n        />\n      </div>\n    )\n  }\n\n  return buttonElement\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["React","Fragment","isValidElement","ChevronIcon","EditIcon","LinkIcon","PlusIcon","SwapIcon","XIcon","Link","Popup","Tooltip","icons","chevron","edit","link","plus","swap","x","baseClass","ButtonContents","children","icon","showTooltip","tooltip","BuiltInIcon","_jsxs","_jsx","className","show","Button","props","id","type","ariaLabel","buttonStyle","disabled","el","enableSubMenu","iconPosition","iconStyle","newTab","onClick","onMouseDown","ref","round","size","SubMenuPopupContent","to","url","setShowTooltip","useState","classes","filter","Boolean","join","handleClick","event","preventDefault","styleClasses","buttonProps","undefined","onPointerEnter","onPointerLeave","rel","target","buttonElement","prefetch","href","Tag","button","buttonSize","horizontalAlign","noBackground","render","close","verticalAlign"],"sources":["../../../src/elements/Button/index.tsx"],"sourcesContent":["'use client'\nimport React, { Fragment, isValidElement } from 'react'\n\nimport type { Props } from './types.js'\n\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { EditIcon } from '../../icons/Edit/index.js'\nimport { LinkIcon } from '../../icons/Link/index.js'\nimport { PlusIcon } from '../../icons/Plus/index.js'\nimport { SwapIcon } from '../../icons/Swap/index.js'\nimport { XIcon } from '../../icons/X/index.js'\nimport { Link } from '../Link/index.js'\nimport { Popup } from '../Popup/index.js'\nimport { Tooltip } from '../Tooltip/index.js'\nimport './index.scss'\n\nconst icons = {\n  chevron: ChevronIcon,\n  edit: EditIcon,\n  link: LinkIcon,\n  plus: PlusIcon,\n  swap: SwapIcon,\n  x: XIcon,\n}\n\nconst baseClass = 'btn'\n\nexport const ButtonContents = ({ children, icon, showTooltip, tooltip }) => {\n  const BuiltInIcon = icons[icon]\n\n  return (\n    <Fragment>\n      {tooltip && (\n        <Tooltip className={`${baseClass}__tooltip`} show={showTooltip}>\n          {tooltip}\n        </Tooltip>\n      )}\n      <span className={`${baseClass}__content`}>\n        {children && <span className={`${baseClass}__label`}>{children}</span>}\n        {icon && (\n          <span className={`${baseClass}__icon`}>\n            {isValidElement(icon) && icon}\n            {BuiltInIcon && <BuiltInIcon />}\n          </span>\n        )}\n      </span>\n    </Fragment>\n  )\n}\n\nexport const Button: React.FC<Props> = (props) => {\n  const {\n    id,\n    type = 'button',\n    'aria-label': ariaLabel,\n    buttonStyle = 'primary',\n    children,\n    className,\n    disabled,\n    el = 'button',\n    enableSubMenu,\n    icon,\n    iconPosition = 'right',\n    iconStyle = 'without-border',\n    newTab,\n    onClick,\n    onMouseDown,\n    ref,\n    round,\n    size = 'medium',\n    SubMenuPopupContent,\n    to,\n    tooltip,\n    url,\n  } = props\n\n  const [showTooltip, setShowTooltip] = React.useState(false)\n\n  const classes = [\n    baseClass,\n    className && className,\n    icon && `${baseClass}--icon`,\n    iconStyle && `${baseClass}--icon-style-${iconStyle}`,\n    icon && !children && `${baseClass}--icon-only`,\n    size && `${baseClass}--size-${size}`,\n    icon && iconPosition && `${baseClass}--icon-position-${iconPosition}`,\n    tooltip && `${baseClass}--has-tooltip`,\n    !SubMenuPopupContent && `${baseClass}--withoutPopup`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  function handleClick(event) {\n    setShowTooltip(false)\n    if (type !== 'submit' && onClick) {\n      event.preventDefault()\n    }\n    if (onClick) {\n      onClick(event)\n    }\n  }\n\n  const styleClasses = [\n    buttonStyle && `${baseClass}--style-${buttonStyle}`,\n    disabled && `${baseClass}--disabled`,\n    round && `${baseClass}--round`,\n    SubMenuPopupContent ? `${baseClass}--withPopup` : `${baseClass}--withoutPopup`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  const buttonProps = {\n    id,\n    type,\n    'aria-disabled': disabled,\n    'aria-label': ariaLabel,\n    className: !SubMenuPopupContent ? [classes, styleClasses].join(' ') : classes,\n    disabled,\n    onClick: !disabled ? handleClick : undefined,\n    onMouseDown: !disabled ? onMouseDown : undefined,\n    onPointerEnter: tooltip ? () => setShowTooltip(true) : undefined,\n    onPointerLeave: tooltip ? () => setShowTooltip(false) : undefined,\n    rel: newTab ? 'noopener noreferrer' : undefined,\n    target: newTab ? '_blank' : undefined,\n  }\n\n  let buttonElement\n  let prefetch\n\n  switch (el) {\n    case 'anchor':\n      buttonElement = (\n        <a\n          {...buttonProps}\n          href={!disabled ? url : undefined}\n          ref={ref as React.RefObject<HTMLAnchorElement>}\n        >\n          <ButtonContents icon={icon} showTooltip={showTooltip} tooltip={tooltip}>\n            {children}\n          </ButtonContents>\n        </a>\n      )\n      break\n\n    case 'link':\n      if (disabled) {\n        buttonElement = (\n          <div {...buttonProps}>\n            <ButtonContents icon={icon} showTooltip={showTooltip} tooltip={tooltip}>\n              {children}\n            </ButtonContents>\n          </div>\n        )\n      }\n\n      buttonElement = (\n        <Link {...buttonProps} href={to || url} prefetch={prefetch}>\n          <ButtonContents icon={icon} showTooltip={showTooltip} tooltip={tooltip}>\n            {children}\n          </ButtonContents>\n        </Link>\n      )\n\n      break\n\n    default:\n      const Tag = el // eslint-disable-line no-case-declarations\n\n      buttonElement = (\n        <Tag ref={ref} type=\"submit\" {...buttonProps}>\n          <ButtonContents icon={icon} showTooltip={showTooltip} tooltip={tooltip}>\n            {children}\n          </ButtonContents>\n        </Tag>\n      )\n      break\n  }\n  if (SubMenuPopupContent) {\n    return (\n      <div className={styleClasses}>\n        {buttonElement}\n        <Popup\n          button={<ChevronIcon />}\n          buttonSize={size}\n          className={disabled && !enableSubMenu ? `${baseClass}--popup-disabled` : ''}\n          disabled={disabled && !enableSubMenu}\n          horizontalAlign=\"right\"\n          id={`${id}-popup`}\n          noBackground\n          render={({ close }) => SubMenuPopupContent({ close: () => close() })}\n          size=\"large\"\n          verticalAlign=\"bottom\"\n        />\n      </div>\n    )\n  }\n\n  return buttonElement\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/Button/index.scss

@@ -68,11 +68,20 @@
       background-color: var(--bg-color);
       box-shadow: var(--box-shadow);
       border-radius: $style-radius-m;
-      border-left: 1px solid var(--theme-bg);
-      border-top-left-radius: 0;
-      border-bottom-left-radius: 0;
       align-items: center;
 
+      html:not([dir='RTL']) & {
+        border-left: 1px solid var(--theme-bg);
+        border-top-left-radius: 0;
+        border-bottom-left-radius: 0;
+      }
+
+      html[dir='RTL'] & {
+        border-right: 1px solid var(--theme-bg);
+        border-top-right-radius: 0;
+        border-bottom-right-radius: 0;
+      }
+
       &:hover,
       &:focus-visible,
       &:focus,
@@ -236,8 +245,15 @@
     }
 
     &--withPopup .btn {
-      border-top-right-radius: 0;
-      border-bottom-right-radius: 0;
+      html:not([dir='RTL']) & {
+        border-top-right-radius: 0;
+        border-bottom-right-radius: 0;
+      }
+
+      html[dir='RTL'] & {
+        border-top-left-radius: 0;
+        border-bottom-left-radius: 0;
+      }
     }
 
     &--style-icon-label,

package/dist/elements/ConfirmationModal/index.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import './index.scss';
+export type OnCancel = () => void;
+export type ConfirmationModalProps = {
+    body: React.ReactNode;
+    cancelLabel?: string;
+    className?: string;
+    confirmingLabel?: string;
+    confirmLabel?: string;
+    heading: React.ReactNode;
+    modalSlug: string;
+    onCancel?: OnCancel;
+    onConfirm: () => Promise<void> | void;
+};
+export declare function ConfirmationModal(props: ConfirmationModalProps): React.JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/elements/ConfirmationModal/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/ConfirmationModal/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsB,MAAM,OAAO,CAAA;AAM1C,OAAO,cAAc,CAAA;AAIrB,MAAM,MAAM,QAAQ,GAAG,MAAM,IAAI,CAAA;AAEjC,MAAM,MAAM,sBAAsB,GAAG;IACnC,IAAI,EAAE,KAAK,CAAC,SAAS,CAAA;IACrB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,OAAO,EAAE,KAAK,CAAC,SAAS,CAAA;IACxB,SAAS,EAAE,MAAM,CAAA;IACjB,QAAQ,CAAC,EAAE,QAAQ,CAAA;IACnB,SAAS,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAA;CACtC,CAAA;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,qBA4E9D"}