@payloadcms/ui 3.0.0-canary.e14c80d → 3.0.0-canary.e1fc0e0

package/dist/elements/Popup/index.scss

@@ -1,231 +1,250 @@
 @import '../../scss/styles.scss';
 
-.popup {
-  --popup-button-highlight: var(--theme-elevation-200);
-  --popup-bg: var(--theme-input-bg);
-  --popup-text: var(--theme-text);
-  --popup-caret-size: 10px;
-  --popup-x-padding: calc(var(--base) * 0.33);
-  --popup-padding: calc(var(--base) * 0.5);
-  position: relative;
-
-  &__trigger-wrap {
-    display: flex;
-    align-items: stretch;
-    height: 100%;
-  }
-
-  &__content {
-    position: absolute;
-    background: var(--popup-bg);
-    opacity: 0;
-    visibility: hidden;
-    pointer-events: none;
-    z-index: var(--z-popup);
-    max-width: calc(100vw - #{$baseline});
-    color: var(--popup-text);
-    border-radius: 4px;
-    padding-left: var(--popup-padding);
-    padding-right: var(--popup-padding);
-    min-width: var(--popup-width, auto);
-  }
-
-  &__hide-scrollbar {
-    overflow: hidden;
-  }
-
-  &__scroll-container {
-    overflow-y: auto;
-    white-space: nowrap;
-    width: calc(100% + var(--scrollbar-width));
-    padding-top: var(--popup-padding);
-    padding-bottom: var(--popup-padding);
-  }
-
-  &__scroll-content {
-    width: calc(100% - var(--scrollbar-width));
-  }
-
-  &--show-scrollbar {
-    .popup__scroll-container,
-    .popup__scroll-content {
-      width: 100%;
+@layer payload-default {
+  .popup {
+    --popup-button-highlight: var(--theme-elevation-200);
+    --popup-bg: var(--theme-input-bg);
+    --popup-text: var(--theme-text);
+    --popup-caret-size: 10px;
+    --popup-x-padding: calc(var(--base) * 0.33);
+    --popup-padding: calc(var(--base) * 0.5);
+    --button-size-offset: -8px;
+    position: relative;
+
+    &__trigger-wrap {
+      display: flex;
+      align-items: stretch;
+      height: 100%;
+    }
+
+    &__content {
+      position: absolute;
+      background: var(--popup-bg);
+      opacity: 0;
+      visibility: hidden;
+      pointer-events: none;
+      z-index: var(--z-popup);
+      max-width: calc(100vw - #{$baseline});
+      color: var(--popup-text);
+      border-radius: 4px;
+      padding-left: var(--popup-padding);
+      padding-right: var(--popup-padding);
+      min-width: var(--popup-width, auto);
+    }
+
+    &__hide-scrollbar {
+      overflow: hidden;
+    }
+
+    &__scroll-container {
+      overflow-y: auto;
+      white-space: nowrap;
+      width: calc(100% + var(--scrollbar-width));
+      padding-top: var(--popup-padding);
+      padding-bottom: var(--popup-padding);
+    }
+
+    &__scroll-content {
+      width: calc(100% - var(--scrollbar-width));
+    }
+
+    &--show-scrollbar {
+      .popup__scroll-container,
+      .popup__scroll-content {
+        width: 100%;
+      }
     }
-  }
 
-  &:focus,
-  &:active {
-    outline: none;
-  }
+    &:focus,
+    &:active {
+      outline: none;
+    }
 
-  ////////////////////////////////
-  // SIZE
-  ////////////////////////////////
+    ////////////////////////////////
+    // SIZE
+    ////////////////////////////////
 
-  &--size-small {
-    --popup-width: 100px;
-    .popup__content {
-      @include shadow-m;
+    &--size-small {
+      --popup-width: 100px;
+      .popup__content {
+        @include shadow-m;
+      }
     }
-  }
 
-  &--size-medium {
-    --popup-width: 150px;
-    .popup__content {
-      @include shadow-lg;
+    &--size-medium {
+      --popup-width: 150px;
+      .popup__content {
+        @include shadow-lg;
+      }
     }
-  }
 
-  &--size-large {
-    --popup-width: 200px;
-    .popup__content {
-      @include shadow-lg;
+    &--size-large {
+      --popup-width: 200px;
+      .popup__content {
+        @include shadow-lg;
+      }
     }
-  }
 
-  ////////////////////////////////
-  // HORIZONTAL ALIGNMENT
-  ////////////////////////////////
-  [dir='rtl'] &--h-align-left {
-    .popup__caret {
-      right: var(--popup-padding);
-      left: unset;
-    }
-  }
-  &--h-align-left {
-    .popup__caret {
-      left: var(--popup-padding);
-    }
-  }
-  &--h-align-center {
-    .popup__content {
-      left: 50%;
-      transform: translateX(-50%);
-    }
+    ////////////////////////////////
+    /// BUTTON SIZE
+    ////////////////////////////////
 
-    .popup__caret {
-      left: 50%;
-      transform: translateX(-50%);
+    &--button-size-small {
+      --button-size-offset: -8px;
     }
-  }
 
-  [dir='rtl'] &--h-align-right {
-    .popup__content {
-      right: unset;
-      left: 0;
+    &--button-size-medium {
+      --button-size-offset: -4px;
     }
 
-    .popup__caret {
-      right: unset;
-      left: var(--popup-padding);
+    &--button-size-large {
+      --button-size-offset: 0px;
     }
-  }
 
-  &--h-align-right {
-    .popup__content {
-      right: 0;
+    ////////////////////////////////
+    // HORIZONTAL ALIGNMENT
+    ////////////////////////////////
+    [dir='rtl'] &--h-align-left {
+      .popup__caret {
+        right: var(--popup-padding);
+        left: unset;
+      }
     }
-
-    .popup__caret {
-      right: var(--popup-padding);
+    &--h-align-left {
+      .popup__caret {
+        left: var(--popup-padding);
+      }
     }
-  }
-
-  ////////////////////////////////
-  // VERTICAL ALIGNMENT
-  ////////////////////////////////
-
-  &__caret {
-    position: absolute;
-    border: var(--popup-caret-size) solid transparent;
-  }
+    &--h-align-center {
+      .popup__content {
+        left: 50%;
+        transform: translateX(-50%);
+      }
 
-  &--v-align-top {
-    .popup__content {
-      @include shadow-lg;
-      bottom: calc(100% + var(--popup-caret-size));
+      .popup__caret {
+        left: 50%;
+        transform: translateX(-50%);
+      }
     }
 
-    .popup__caret {
-      top: calc(100% - 1px);
-      border-top-color: var(--popup-bg);
-    }
-  }
+    [dir='rtl'] &--h-align-right {
+      .popup__content {
+        right: unset;
+        left: 0;
+      }
 
-  &--v-align-bottom {
-    .popup__content {
-      @include shadow-lg-top;
-      top: calc(100% + var(--popup-caret-size));
+      .popup__caret {
+        right: unset;
+        left: var(--popup-padding);
+      }
     }
 
-    .popup__caret {
-      bottom: calc(100% - 1px);
-      border-bottom-color: var(--popup-bg);
+    &--h-align-right {
+      .popup__content {
+        right: var(--button-size-offset);
+      }
+
+      .popup__caret {
+        right: var(--popup-padding);
+      }
     }
-  }
 
-  ////////////////////////////////
-  // ACTIVE
-  ////////////////////////////////
+    ////////////////////////////////
+    // VERTICAL ALIGNMENT
+    ////////////////////////////////
 
-  &--active {
-    .popup__content {
-      opacity: 1;
-      visibility: visible;
-      pointer-events: all;
+    &__caret {
+      position: absolute;
+      border: var(--popup-caret-size) solid transparent;
     }
-  }
-
-  @include mid-break {
-    --popup-padding: calc(var(--base) * 0.25);
 
-    &--h-align-center {
+    &--v-align-top {
       .popup__content {
-        left: 50%;
-        transform: translateX(-0%);
+        @include shadow-lg;
+        bottom: calc(100% + var(--popup-caret-size));
       }
 
       .popup__caret {
-        left: 50%;
-        transform: translateX(-0%);
+        top: calc(100% - 1px);
+        border-top-color: var(--popup-bg);
       }
     }
 
-    &--h-align-right {
+    &--v-align-bottom {
       .popup__content {
-        right: 0;
+        @include shadow-lg-top;
+        top: calc(100% + var(--popup-caret-size));
       }
 
       .popup__caret {
-        right: var(--popup-padding);
+        bottom: calc(100% - 1px);
+        border-bottom-color: var(--popup-bg);
       }
     }
 
-    &--force-h-align-left {
+    ////////////////////////////////
+    // ACTIVE
+    ////////////////////////////////
+
+    &--active {
       .popup__content {
-        left: 0;
-        right: unset;
-        transform: unset;
+        opacity: 1;
+        visibility: visible;
+        pointer-events: all;
       }
+    }
 
-      .popup__caret {
-        left: var(--popup-padding);
-        right: unset;
-        transform: unset;
+    @include mid-break {
+      --popup-padding: calc(var(--base) * 0.25);
+
+      &--h-align-center {
+        .popup__content {
+          left: 50%;
+          transform: translateX(-0%);
+        }
+
+        .popup__caret {
+          left: 50%;
+          transform: translateX(-0%);
+        }
       }
-    }
 
-    &--force-h-align-right {
-      .popup__content {
-        right: 0;
-        left: unset;
-        transform: unset;
+      &--h-align-right {
+        .popup__content {
+          right: 0;
+        }
+
+        .popup__caret {
+          right: var(--popup-padding);
+        }
       }
 
-      .popup__caret {
-        right: var(--popup-padding);
-        left: unset;
-        transform: unset;
+      &--force-h-align-left {
+        .popup__content {
+          left: 0;
+          right: unset;
+          transform: unset;
+        }
+
+        .popup__caret {
+          left: var(--popup-padding);
+          right: unset;
+          transform: unset;
+        }
+      }
+
+      &--force-h-align-right {
+        .popup__content {
+          right: 0;
+          left: unset;
+          transform: unset;
+        }
+
+        .popup__caret {
+          right: var(--popup-padding);
+          left: unset;
+          transform: unset;
+        }
       }
     }
   }

package/dist/elements/PreviewButton/index.js

@@ -1,32 +1,55 @@
 'use client';
+
+import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 import { RenderComponent } from '../../providers/Config/RenderComponent.js';
 import { Button } from '../Button/index.js';
 import { usePreviewURL } from './usePreviewURL.js';
 const baseClass = 'preview-btn';
-const DefaultPreviewButton = ()=>{
-    const { generatePreviewURL, label } = usePreviewURL();
-    return /*#__PURE__*/ _jsx(Button, {
-        buttonStyle: "secondary",
-        className: baseClass,
-        icon: 'link',
-        iconPosition: "left",
-        // disabled={disabled}
-        onClick: ()=>generatePreviewURL({
-                openPreviewWindow: true
-            }),
-        size: "medium",
-        children: label
+const DefaultPreviewButton = () => {
+  const $ = _c(5);
+  const {
+    generatePreviewURL,
+    label
+  } = usePreviewURL();
+  let t0;
+  if ($[0] !== generatePreviewURL) {
+    t0 = () => generatePreviewURL({
+      openPreviewWindow: true
+    });
+    $[0] = generatePreviewURL;
+    $[1] = t0;
+  } else {
+    t0 = $[1];
+  }
+  let t1;
+  if ($[2] !== t0 || $[3] !== label) {
+    t1 = _jsx(Button, {
+      buttonStyle: "secondary",
+      className: baseClass,
+      icon: "link",
+      iconPosition: "left",
+      onClick: t0,
+      size: "medium",
+      children: label
     });
+    $[2] = t0;
+    $[3] = label;
+    $[4] = t1;
+  } else {
+    t1 = $[4];
+  }
+  return t1;
 };
-export const PreviewButton = ({ CustomComponent })=>{
-    if (CustomComponent) {
-        return /*#__PURE__*/ _jsx(RenderComponent, {
-            mappedComponent: CustomComponent
-        });
-    }
-    return /*#__PURE__*/ _jsx(DefaultPreviewButton, {});
+export const PreviewButton = ({
+  CustomComponent
+}) => {
+  if (CustomComponent) {
+    return /*#__PURE__*/_jsx(RenderComponent, {
+      mappedComponent: CustomComponent
+    });
+  }
+  return /*#__PURE__*/_jsx(DefaultPreviewButton, {});
 };
-
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/PreviewButton/index.tsx"],"sourcesContent":["'use client'\nimport type { MappedComponent } from 'payload'\n\nimport React from 'react'\n\nimport { RenderComponent } from '../../providers/Config/RenderComponent.js'\nimport { Button } from '../Button/index.js'\nimport { usePreviewURL } from './usePreviewURL.js'\n\nconst baseClass = 'preview-btn'\n\nconst DefaultPreviewButton: React.FC = () => {\n  const { generatePreviewURL, label } = usePreviewURL()\n\n  return (\n    <Button\n      buttonStyle=\"secondary\"\n      className={baseClass}\n      icon={'link'}\n      iconPosition=\"left\"\n      // disabled={disabled}\n      onClick={() =>\n        generatePreviewURL({\n          openPreviewWindow: true,\n        })\n      }\n      size=\"medium\"\n    >\n      {label}\n    </Button>\n  )\n}\n\ntype Props = {\n  CustomComponent?: MappedComponent\n}\n\nexport const PreviewButton: React.FC<Props> = ({ CustomComponent }) => {\n  if (CustomComponent) {\n    return <RenderComponent mappedComponent={CustomComponent} />\n  }\n\n  return <DefaultPreviewButton />\n}\n"],"names":["React","RenderComponent","Button","usePreviewURL","baseClass","DefaultPreviewButton","generatePreviewURL","label","buttonStyle","className","icon","iconPosition","onClick","openPreviewWindow","size","PreviewButton","CustomComponent","mappedComponent"],"mappings":"AAAA;;AAGA,OAAOA,WAAW,QAAO;AAEzB,SAASC,eAAe,QAAQ,4CAA2C;AAC3E,SAASC,MAAM,QAAQ,qBAAoB;AAC3C,SAASC,aAAa,QAAQ,qBAAoB;AAElD,MAAMC,YAAY;AAElB,MAAMC,uBAAiC;IACrC,MAAM,EAAEC,kBAAkB,EAAEC,KAAK,EAAE,GAAGJ;IAEtC,qBACE,KAACD;QACCM,aAAY;QACZC,WAAWL;QACXM,MAAM;QACNC,cAAa;QACb,sBAAsB;QACtBC,SAAS,IACPN,mBAAmB;gBACjBO,mBAAmB;YACrB;QAEFC,MAAK;kBAEJP;;AAGP;AAMA,OAAO,MAAMQ,gBAAiC,CAAC,EAAEC,eAAe,EAAE;IAChE,IAAIA,iBAAiB;QACnB,qBAAO,KAACf;YAAgBgB,iBAAiBD;;IAC3C;IAEA,qBAAO,KAACX;AACV,EAAC"}
+{"version":3,"file":"index.js","names":["c","_c","React","RenderComponent","Button","usePreviewURL","baseClass","DefaultPreviewButton","$","generatePreviewURL","label","t0","openPreviewWindow","t1","_jsx","buttonStyle","className","icon","iconPosition","onClick","size","children","PreviewButton","CustomComponent","mappedComponent"],"sources":["../../../src/elements/PreviewButton/index.tsx"],"sourcesContent":["'use client'\nimport type { MappedComponent } from 'payload'\n\nimport React from 'react'\n\nimport { RenderComponent } from '../../providers/Config/RenderComponent.js'\nimport { Button } from '../Button/index.js'\nimport { usePreviewURL } from './usePreviewURL.js'\n\nconst baseClass = 'preview-btn'\n\nconst DefaultPreviewButton: React.FC = () => {\n  const { generatePreviewURL, label } = usePreviewURL()\n\n  return (\n    <Button\n      buttonStyle=\"secondary\"\n      className={baseClass}\n      icon={'link'}\n      iconPosition=\"left\"\n      // disabled={disabled}\n      onClick={() =>\n        generatePreviewURL({\n          openPreviewWindow: true,\n        })\n      }\n      size=\"medium\"\n    >\n      {label}\n    </Button>\n  )\n}\n\ntype Props = {\n  CustomComponent?: MappedComponent\n}\n\nexport const PreviewButton: React.FC<Props> = ({ CustomComponent }) => {\n  if (CustomComponent) {\n    return <RenderComponent mappedComponent={CustomComponent} />\n  }\n\n  return <DefaultPreviewButton />\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAGA,OAAOC,KAAA,MAAW;AAElB,SAASC,eAAe,QAAQ;AAChC,SAASC,MAAM,QAAQ;AACvB,SAASC,aAAa,QAAQ;AAE9B,MAAMC,SAAA,GAAY;AAElB,MAAMC,oBAAA,GAAiCA,CAAA;EAAA,MAAAC,CAAA,GAAAP,EAAA;EACrC;IAAAQ,kBAAA;IAAAC;EAAA,IAAsCL,aAAA;EAAA,IAAAM,EAAA;EAAA,IAAAH,CAAA,QAAAC,kBAAA;IASzBE,EAAA,GAAAA,CAAA,KACPF,kBAAA;MAAAG,iBAAA;IAAA,CAEA;IAAAJ,CAAA,MAAAC,kBAAA;IAAAD,CAAA,MAAAG,EAAA;EAAA;IAAAA,EAAA,GAAAH,CAAA;EAAA;EAAA,IAAAK,EAAA;EAAA,IAAAL,CAAA,QAAAG,EAAA,IAAAH,CAAA,QAAAE,KAAA;IATJG,EAAA,GAAAC,IAAA,CAAAV,MAAA;MAAAW,WAAA,EACc;MAAAC,SAAA,EAAAV,SAAA;MAAAW,IAAA,EAEN;MAAAC,YAAA,EACO;MAAAC,OAAA,EAEJR,EAGP;MAAAS,IAAA,EAEG;MAAAC,QAAA,EAEJX;IAAA,C;;;;;;;SAbHG,E;CAgBJ;AAMA,OAAO,MAAMS,aAAA,GAAiCA,CAAC;EAAEC;AAAe,CAAE;EAChE,IAAIA,eAAA,EAAiB;IACnB,oBAAOT,IAAA,CAACX,eAAA;MAAgBqB,eAAA,EAAiBD;;EAC3C;EAEA,oBAAOT,IAAA,CAACP,oBAAA;AACV","ignoreList":[]}

package/dist/elements/PreviewButton/usePreviewURL.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"usePreviewURL.d.ts","sourceRoot":"","sources":["../../../src/elements/PreviewButton/usePreviewURL.tsx"],"names":[],"mappings":"AASA,eAAO,MAAM,aAAa,QAAO;IAC/B,kBAAkB,EAAE,CAAC,EAAE,iBAAiB,EAAE,EAAE;QAAE,iBAAiB,CAAC,EAAE,OAAO,CAAA;KAAE,KAAK,IAAI,CAAA;IACpF,SAAS,EAAE,OAAO,CAAA;IAClB,KAAK,EAAE,MAAM,CAAA;IACb,UAAU,EAAE,MAAM,CAAA;CA0DnB,CAAA"}
+{"version":3,"file":"usePreviewURL.d.ts","sourceRoot":"","sources":["../../../src/elements/PreviewButton/usePreviewURL.tsx"],"names":[],"mappings":"AAUA,eAAO,MAAM,aAAa,QAAO;IAC/B,kBAAkB,EAAE,CAAC,EAAE,iBAAiB,EAAE,EAAE;QAAE,iBAAiB,CAAC,EAAE,OAAO,CAAA;KAAE,KAAK,IAAI,CAAA;IACpF,SAAS,EAAE,OAAO,CAAA;IAClB,KAAK,EAAE,MAAM,CAAA;IACb,UAAU,EAAE,MAAM,CAAA;CA8EnB,CAAA"}

package/dist/elements/PreviewButton/usePreviewURL.js

@@ -1,57 +1,86 @@
 'use client';
+
+import * as qs from 'qs-esm';
 import { useCallback, useRef, useState } from 'react';
 import { toast } from 'sonner';
 import { useConfig } from '../../providers/Config/index.js';
 import { useDocumentInfo } from '../../providers/DocumentInfo/index.js';
 import { useLocale } from '../../providers/Locale/index.js';
 import { useTranslation } from '../../providers/Translation/index.js';
-export const usePreviewURL = ()=>{
-    const { id, collectionSlug, globalSlug } = useDocumentInfo();
-    const [isLoading, setIsLoading] = useState(false);
-    const [previewURL, setPreviewURL] = useState('');
-    const { code: locale } = useLocale();
-    const { config: { routes: { api }, serverURL } } = useConfig();
-    const { t } = useTranslation();
-    const isGeneratingPreviewURL = useRef(false);
-    // we need to regenerate the preview URL every time the button is clicked
-    // to do this we need to fetch the document data fresh from the API
-    // this will ensure the latest data is used when generating the preview URL
-    const generatePreviewURL = useCallback(async ({ openPreviewWindow = false })=>{
-        if (isGeneratingPreviewURL.current) return;
-        isGeneratingPreviewURL.current = true;
-        try {
-            setIsLoading(true);
-            let url = `${serverURL}${api}`;
-            if (collectionSlug) url = `${url}/${collectionSlug}/${id}/preview`;
-            if (globalSlug) url = `${url}/globals/${globalSlug}/preview`;
-            const res = await fetch(`${url}${locale ? `?locale=${locale}` : ''}`);
-            if (!res.ok) throw new Error();
-            const newPreviewURL = await res.json();
-            if (!newPreviewURL) throw new Error();
-            setPreviewURL(newPreviewURL);
-            setIsLoading(false);
-            isGeneratingPreviewURL.current = false;
-            if (openPreviewWindow) window.open(newPreviewURL, '_blank');
-        } catch (err) {
-            setIsLoading(false);
-            isGeneratingPreviewURL.current = false;
-            toast.error(t('error:previewing'));
-        }
-    }, [
-        serverURL,
-        api,
-        collectionSlug,
-        globalSlug,
-        id,
-        locale,
-        t
-    ]);
-    return {
-        generatePreviewURL,
-        isLoading,
-        label: isLoading ? t('general:loading') : t('version:preview'),
-        previewURL
-    };
+export const usePreviewURL = () => {
+  const {
+    id,
+    collectionSlug,
+    globalSlug,
+    versions
+  } = useDocumentInfo();
+  const [isLoading, setIsLoading] = useState(false);
+  const [previewURL, setPreviewURL] = useState('');
+  const {
+    code: locale
+  } = useLocale();
+  const hasVersions = versions?.totalDocs > 0;
+  const {
+    config: {
+      routes: {
+        api
+      },
+      serverURL
+    }
+  } = useConfig();
+  const {
+    t
+  } = useTranslation();
+  const isGeneratingPreviewURL = useRef(false);
+  // we need to regenerate the preview URL every time the button is clicked
+  // to do this we need to fetch the document data fresh from the API
+  // this will ensure the latest data is used when generating the preview URL
+  const generatePreviewURL = useCallback(async ({
+    openPreviewWindow = false
+  }) => {
+    if (isGeneratingPreviewURL.current) {
+      return;
+    }
+    isGeneratingPreviewURL.current = true;
+    try {
+      setIsLoading(true);
+      let url = `${serverURL}${api}`;
+      if (collectionSlug) {
+        url = `${url}/${collectionSlug}/${id}/preview`;
+      }
+      if (globalSlug) {
+        url = `${url}/globals/${globalSlug}/preview`;
+      }
+      const params = {
+        draft: hasVersions ? 'true' : 'false',
+        locale: locale || undefined
+      };
+      const res = await fetch(`${url}?${qs.stringify(params)}`);
+      if (!res.ok) {
+        throw new Error();
+      }
+      const newPreviewURL = await res.json();
+      if (!newPreviewURL) {
+        throw new Error();
+      }
+      setPreviewURL(newPreviewURL);
+      setIsLoading(false);
+      isGeneratingPreviewURL.current = false;
+      if (openPreviewWindow) {
+        window.open(newPreviewURL, '_blank');
+      }
+    } catch (err) {
+      setIsLoading(false);
+      isGeneratingPreviewURL.current = false;
+      toast.error(t('error:previewing'));
+    }
+  }, [serverURL, api, collectionSlug, globalSlug, hasVersions, locale, id, t]);
+  return {
+    // eslint-disable-next-line @typescript-eslint/no-misused-promises
+    generatePreviewURL,
+    isLoading,
+    label: isLoading ? t('general:loading') : t('version:preview'),
+    previewURL
+  };
 };
-
 //# sourceMappingURL=usePreviewURL.js.map