@payloadcms/next 3.68.0-internal.35482da → 3.68.0-internal.6fa474a

package/dist/elements/Nav/index.scss

@@ -0,0 +1,173 @@
+@import '~@payloadcms/ui/scss';
+
+@layer payload-default {
+  .nav {
+    position: sticky;
+    top: 0;
+    left: 0;
+    flex-shrink: 0;
+    height: 100vh;
+    width: var(--nav-width);
+    border-right: 1px solid var(--theme-elevation-100);
+    opacity: 0;
+    overflow: hidden;
+    --nav-padding-inline-start: var(--base);
+    --nav-padding-inline-end: var(--base);
+    --nav-padding-block-start: var(--app-header-height);
+    --nav-padding-block-end: calc(var(--base) * 2);
+
+    [dir='rtl'] & {
+      border-right: none;
+      border-left: 1px solid var(--theme-elevation-100);
+    }
+
+    &--nav-animate {
+      transition: opacity var(--nav-trans-time) ease-in-out;
+    }
+
+    &--nav-open {
+      opacity: 1;
+    }
+
+    &__header {
+      position: absolute;
+      top: 0;
+      width: 100vw;
+      height: var(--app-header-height);
+    }
+
+    &__header-content {
+      z-index: 1;
+      position: relative;
+      height: 100%;
+      width: 100%;
+    }
+
+    &__mobile-close {
+      display: none;
+      background: none;
+      border: 0;
+      outline: 0;
+      padding: base(0.8) 0;
+    }
+
+    &__scroll {
+      height: 100%;
+      display: flex;
+      flex-direction: column;
+      padding: var(--nav-padding-block-start) var(--nav-padding-inline-end)
+        var(--nav-padding-block-end) var(--nav-padding-inline-start);
+      overflow-y: auto;
+
+      // remove the scrollbar here to prevent layout shift as nav groups are toggled
+      &::-webkit-scrollbar {
+        display: none;
+      }
+    }
+
+    &__wrap {
+      width: 100%;
+      display: flex;
+      flex-direction: column;
+      align-items: flex-start;
+      flex-grow: 1;
+    }
+
+    &__label {
+      color: var(--theme-elevation-400);
+    }
+
+    &__controls {
+      display: flex;
+      flex-direction: column;
+      gap: base(0.75);
+      margin-top: auto;
+      margin-bottom: 0;
+
+      > :first-child {
+        margin-top: base(1);
+      }
+
+      a:focus-visible {
+        outline: var(--accessibility-outline);
+      }
+    }
+
+    &__log-out {
+      &:hover {
+        g {
+          transform: translateX(-#{base(0.125)});
+        }
+      }
+    }
+
+    &__link {
+      display: flex;
+      align-items: center;
+      position: relative;
+      padding-block: base(0.125);
+      padding-inline-start: 0;
+      padding-inline-end: base(1.5);
+      text-decoration: none;
+
+      &:focus:not(:focus-visible) {
+        box-shadow: none;
+        font-weight: 600;
+      }
+
+      &.active {
+        font-weight: normal;
+        padding-left: 0;
+        font-weight: 600;
+      }
+    }
+
+    a.nav__link {
+      &:hover,
+      &:focus-visible {
+        text-decoration: underline;
+      }
+    }
+
+    &__link:has(.nav__link-indicator) {
+      font-weight: 600;
+      padding-left: 0;
+    }
+
+    &__link-indicator {
+      position: absolute;
+      display: block;
+      // top: 0;
+      inset-inline-start: base(-1);
+      width: 2px;
+      height: 16px;
+      border-start-end-radius: 2px;
+      border-end-end-radius: 2px;
+      background: var(--theme-text);
+    }
+
+    @include mid-break {
+      &__scroll {
+        --nav-padding-inline-start: calc(var(--base) * 0.5);
+        --nav-padding-inline-end: calc(var(--base) * 0.5);
+      }
+    }
+
+    @include small-break {
+      &__scroll {
+        --nav-padding-inline-start: var(--gutter-h);
+        --nav-padding-inline-end: var(--gutter-h);
+      }
+
+      &__link {
+        font-size: base(0.875);
+        line-height: base(1.5);
+      }
+
+      &__mobile-close {
+        display: flex;
+        align-items: center;
+      }
+    }
+  }
+}

package/dist/index.d.ts

@@ -1,2 +1,2 @@
-export { default as withPayload } from "./withPayload.js";
+export { default as withPayload } from "./withPayload/withPayload.js";
 //# sourceMappingURL=index.d.ts.map

package/dist/index.js

@@ -1,2 +1,2 @@
-export { default as withPayload } from './withPayload.js';
+export { default as withPayload } from './withPayload/withPayload.js';
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["default","withPayload"],"sources":["../src/index.js"],"sourcesContent":["export { default as withPayload } from './withPayload.js'\n"],"mappings":"AAAA,SAASA,OAAA,IAAWC,WAAW,QAAQ","ignoreList":[]}
+{"version":3,"file":"index.js","names":["default","withPayload"],"sources":["../src/index.js"],"sourcesContent":["export { default as withPayload } from './withPayload/withPayload.js'\n"],"mappings":"AAAA,SAASA,OAAA,IAAWC,WAAW,QAAQ","ignoreList":[]}

package/dist/templates/Default/Wrapper/index.scss

@@ -0,0 +1,58 @@
+@import '~@payloadcms/ui/scss';
+
+@layer payload-default {
+  .template-default {
+    min-height: 100vh;
+    display: grid;
+    position: relative;
+    isolation: isolate;
+
+    @media (prefers-reduced-motion) {
+      transition: none;
+    }
+
+    &--nav-animate {
+      transition: grid-template-columns var(--nav-trans-time) linear;
+    }
+
+    &--nav-open {
+      .template-default {
+        &__nav-overlay {
+          transition: opacity var(--nav-trans-time) linear;
+        }
+      }
+    }
+  }
+
+  @media (min-width: 1441px) {
+    .template-default {
+      grid-template-columns: 0 auto;
+
+      &--nav-open {
+        grid-template-columns: var(--nav-width) auto;
+      }
+    }
+  }
+
+  @media (max-width: 1440px) {
+    .template-default--nav-hydrated.template-default--nav-open {
+      grid-template-columns: var(--nav-width) auto;
+    }
+
+    .template-default {
+      grid-template-columns: 1fr auto;
+
+      .nav {
+        display: none;
+      }
+
+      &--nav-hydrated {
+        grid-template-columns: 0 auto;
+
+        .nav {
+          display: unset;
+        }
+      }
+    }
+  }
+}

package/dist/templates/Default/index.scss

@@ -0,0 +1,79 @@
+@import '~@payloadcms/ui/scss';
+
+@layer payload-default {
+  .template-default {
+    background-color: var(--theme-bg);
+    color: var(--theme-text);
+
+    [dir='rtl'] &__nav-toggler-wrapper {
+      left: unset;
+      right: 0;
+    }
+
+    &__nav-toggler-wrapper {
+      position: sticky;
+      z-index: var(--z-modal);
+      top: 0;
+      left: 0;
+      height: 0;
+      width: var(--gutter-h);
+      display: flex;
+      justify-content: center;
+    }
+
+    &__nav-toggler-container {
+      height: var(--app-header-height);
+      display: flex;
+      align-items: center;
+    }
+
+    &__nav-toggler {
+      display: flex;
+      align-items: center;
+    }
+
+    &__wrap {
+      min-width: 0;
+      width: 100%;
+      flex-grow: 1;
+      position: relative;
+      background-color: var(--theme-bg);
+      &:before {
+        content: '';
+        display: block;
+        position: absolute;
+        inset: 0;
+        background-color: inherit;
+        opacity: 0;
+        z-index: var(--z-status);
+        visibility: hidden;
+        transition: all var(--nav-trans-time) linear;
+      }
+    }
+
+    @include mid-break {
+      &__nav-toggler-wrapper {
+        .hamburger {
+          left: unset;
+        }
+      }
+    }
+
+    @include small-break {
+      &__nav-toggler-wrapper {
+        width: unset;
+        justify-content: unset;
+
+        .hamburger {
+          display: none;
+        }
+      }
+
+      .template-default {
+        &__wrap {
+          min-width: 100%;
+        }
+      }
+    }
+  }
+}

package/dist/templates/Minimal/index.scss

@@ -0,0 +1,30 @@
+@import '~@payloadcms/ui/scss';
+
+@layer payload-default {
+  .template-minimal {
+    display: flex;
+    width: 100%;
+    justify-content: center;
+    align-items: center;
+    padding: base(3) $baseline;
+    margin-left: auto;
+    margin-right: auto;
+    min-height: 100%;
+    background-color: var(--theme-bg-color);
+    color: var(--theme-text);
+
+    &--width-normal {
+      .template-minimal__wrap {
+        max-width: base(24);
+        width: 100%;
+      }
+    }
+
+    &--width-wide {
+      .template-minimal__wrap {
+        max-width: base(48);
+        width: 100%;
+      }
+    }
+  }
+}

package/dist/views/API/RenderJSON/index.scss

@@ -0,0 +1,129 @@
+@import '~@payloadcms/ui/scss';
+
+$tab-width: 24px;
+
+@layer payload-default {
+  .query-inspector {
+    --tab-width: 24px;
+
+    &__json-children {
+      position: relative;
+
+      &--nested {
+        & li {
+          padding-left: 8px;
+        }
+      }
+
+      &:before {
+        content: '';
+        position: absolute;
+        top: 0;
+        width: 1px;
+        height: 100%;
+        border-left: 1px dashed var(--theme-elevation-200);
+      }
+    }
+
+    &__row-line {
+      &--nested {
+        .query-inspector__json-children {
+          padding-left: var(--tab-width);
+        }
+      }
+    }
+
+    &__list-wrap {
+      position: relative;
+    }
+
+    &__list-toggle {
+      all: unset;
+      width: 100%;
+      text-align: left;
+      cursor: pointer;
+      border-radius: 3px;
+      border-top-right-radius: 0;
+      border-bottom-right-radius: 0;
+      position: relative;
+      display: flex;
+      column-gap: 14px;
+      row-gap: 10px;
+      align-items: center;
+      left: 0;
+      width: calc(100% + 3px);
+      background-color: var(--theme-elevation-50);
+
+      &:not(.query-inspector__list-toggle--empty) {
+        margin-left: calc(var(--tab-width) * -1 - 10px);
+      }
+
+      svg .stroke {
+        stroke: var(--theme-elevation-400);
+      }
+
+      &:hover {
+        background-color: var(--theme-elevation-100);
+      }
+
+      &--empty {
+        cursor: default;
+        pointer-events: none;
+      }
+    }
+
+    &__toggle-row-icon {
+      &--open {
+        transform: rotate(0deg);
+      }
+      &--closed {
+        transform: rotate(-90deg);
+      }
+    }
+
+    &__value-type {
+      &--number {
+        .query-inspector__value {
+          color: var(--number-color);
+        }
+      }
+
+      &--string {
+        .query-inspector__value {
+          color: var(--string-color);
+        }
+      }
+    }
+
+    &__bracket {
+      position: relative;
+
+      &--position-end {
+        left: 2px;
+        width: calc(100% - 5px);
+      }
+    }
+
+    // Some specific rules targetting the very top of the nested JSON structure or very first items since they need slightly different styling
+    &__results {
+      & > .query-inspector__row-line--nested {
+        & > .query-inspector__list-toggle {
+          margin-left: 0;
+          column-gap: 6px;
+
+          .query-inspector__toggle-row-icon {
+            margin-left: -4px;
+          }
+        }
+
+        & > .query-inspector__json-children {
+          padding-left: calc(var(--base) * 1);
+        }
+
+        & > .query-inspector__bracket--nested > .query-inspector__bracket--position-end {
+          padding-left: 16px;
+        }
+      }
+    }
+  }
+}

package/dist/views/API/index.client.js

@@ -84,13 +84,11 @@ export const APIViewClient = () => {
           setData(json);
         } catch (error_0) {
           toast.error('Error parsing response');
-          console.error(error_0) // eslint-disable-line no-console
-          ;
+          console.error(error_0); // eslint-disable-line no-console
         }
       } catch (error) {
         toast.error('Error making request');
-        console.error(error) // eslint-disable-line no-console
-        ;
+        console.error(error); // eslint-disable-line no-console
       }
     };
     void fetchData();

package/dist/views/API/index.client.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.client.js","names":["CheckboxField","CopyToClipboard","Form","Gutter","MinimizeMaximizeIcon","NumberField","SetDocumentStepNav","toast","useConfig","useDocumentInfo","useLocale","useTranslation","useSearchParams","hasDraftsEnabled","React","LocaleSelector","RenderJSON","baseClass","APIViewClient","id","collectionSlug","globalSlug","initialData","isTrashed","searchParams","i18n","t","code","config","defaultDepth","localization","routes","api","apiRoute","serverURL","getEntityConfig","collectionConfig","globalConfig","localeOptions","locales","map","locale","label","value","draftsEnabled","docEndpoint","data","setData","useState","draft","setDraft","get","setLocale","depth","setDepth","toString","authenticated","setAuthenticated","fullscreen","setFullscreen","trashParam","deletedAt","params","URLSearchParams","String","trash","fetchURL","useEffect","fetchData","res","fetch","credentials","headers","language","method","json","error","console","_jsxs","className","filter","Boolean","join","right","_jsx","globalLabel","pluralLabel","labels","plural","undefined","useAsTitle","admin","view","href","rel","target","initialState","initialValue","valid","Number","field","name","onChange","path","step","max","min","onClick","type","isMinimized","object"],"sources":["../../../src/views/API/index.client.tsx"],"sourcesContent":["'use client'\n\nimport {\n  CheckboxField,\n  CopyToClipboard,\n  Form,\n  Gutter,\n  MinimizeMaximizeIcon,\n  NumberField,\n  SetDocumentStepNav,\n  toast,\n  useConfig,\n  useDocumentInfo,\n  useLocale,\n  useTranslation,\n} from '@payloadcms/ui'\nimport { useSearchParams } from 'next/navigation.js'\n\nimport './index.scss'\n\nimport { hasDraftsEnabled } from 'payload/shared'\nimport * as React from 'react'\n\nimport { LocaleSelector } from './LocaleSelector/index.js'\nimport { RenderJSON } from './RenderJSON/index.js'\n\nconst baseClass = 'query-inspector'\n\nexport const APIViewClient: React.FC = () => {\n  const { id, collectionSlug, globalSlug, initialData, isTrashed } = useDocumentInfo()\n\n  const searchParams = useSearchParams()\n  const { i18n, t } = useTranslation()\n  const { code } = useLocale()\n\n  const {\n    config: {\n      defaultDepth,\n      localization,\n      routes: { api: apiRoute },\n      serverURL,\n    },\n    getEntityConfig,\n  } = useConfig()\n\n  const collectionConfig = getEntityConfig({ collectionSlug })\n  const globalConfig = getEntityConfig({ globalSlug })\n\n  const localeOptions =\n    localization &&\n    localization.locales.map((locale) => ({ label: locale.label, value: locale.code }))\n\n  let draftsEnabled: boolean = false\n  let docEndpoint: string = ''\n\n  if (collectionConfig) {\n    draftsEnabled = hasDraftsEnabled(collectionConfig)\n    docEndpoint = `/${collectionSlug}/${id}`\n  }\n\n  if (globalConfig) {\n    draftsEnabled = hasDraftsEnabled(globalConfig)\n    docEndpoint = `/globals/${globalSlug}`\n  }\n\n  const [data, setData] = React.useState<any>(initialData)\n  const [draft, setDraft] = React.useState<boolean>(searchParams.get('draft') === 'true')\n  const [locale, setLocale] = React.useState<string>(searchParams?.get('locale') || code)\n  const [depth, setDepth] = React.useState<string>(\n    searchParams.get('depth') || defaultDepth.toString(),\n  )\n  const [authenticated, setAuthenticated] = React.useState<boolean>(true)\n  const [fullscreen, setFullscreen] = React.useState<boolean>(false)\n\n  const trashParam = typeof initialData?.deletedAt === 'string'\n\n  const params = new URLSearchParams({\n    depth,\n    draft: String(draft),\n    locale,\n    trash: trashParam ? 'true' : 'false',\n  }).toString()\n\n  const fetchURL = `${serverURL}${apiRoute}${docEndpoint}?${params}`\n\n  React.useEffect(() => {\n    const fetchData = async () => {\n      try {\n        const res = await fetch(fetchURL, {\n          credentials: authenticated ? 'include' : 'omit',\n          headers: {\n            'Accept-Language': i18n.language,\n          },\n          method: 'GET',\n        })\n\n        try {\n          const json = await res.json()\n          setData(json)\n        } catch (error) {\n          toast.error('Error parsing response')\n          console.error(error) // eslint-disable-line no-console\n        }\n      } catch (error) {\n        toast.error('Error making request')\n        console.error(error) // eslint-disable-line no-console\n      }\n    }\n\n    void fetchData()\n  }, [i18n.language, fetchURL, authenticated])\n\n  return (\n    <Gutter\n      className={[baseClass, fullscreen && `${baseClass}--fullscreen`].filter(Boolean).join(' ')}\n      right={false}\n    >\n      <SetDocumentStepNav\n        collectionSlug={collectionSlug}\n        globalLabel={globalConfig?.label}\n        globalSlug={globalSlug}\n        id={id}\n        isTrashed={isTrashed}\n        pluralLabel={collectionConfig ? collectionConfig?.labels?.plural : undefined}\n        useAsTitle={collectionConfig ? collectionConfig?.admin?.useAsTitle : undefined}\n        view=\"API\"\n      />\n      <div className={`${baseClass}__configuration`}>\n        <div className={`${baseClass}__api-url`}>\n          <span className={`${baseClass}__label`}>\n            API URL <CopyToClipboard value={fetchURL} />\n          </span>\n          <a href={fetchURL} rel=\"noopener noreferrer\" target=\"_blank\">\n            {fetchURL}\n          </a>\n        </div>\n        <Form\n          initialState={{\n            authenticated: {\n              initialValue: authenticated || false,\n              valid: true,\n              value: authenticated || false,\n            },\n            depth: {\n              initialValue: Number(depth || 0),\n              valid: true,\n              value: Number(depth || 0),\n            },\n            draft: {\n              initialValue: draft || false,\n              valid: true,\n              value: draft || false,\n            },\n            locale: {\n              initialValue: locale,\n              valid: true,\n              value: locale,\n            },\n          }}\n        >\n          <div className={`${baseClass}__form-fields`}>\n            <div className={`${baseClass}__filter-query-checkboxes`}>\n              {draftsEnabled && (\n                <CheckboxField\n                  field={{\n                    name: 'draft',\n                    label: t('version:draft'),\n                  }}\n                  onChange={() => setDraft(!draft)}\n                  path=\"draft\"\n                />\n              )}\n              <CheckboxField\n                field={{\n                  name: 'authenticated',\n                  label: t('authentication:authenticated'),\n                }}\n                onChange={() => setAuthenticated(!authenticated)}\n                path=\"authenticated\"\n              />\n            </div>\n            {localeOptions && <LocaleSelector localeOptions={localeOptions} onChange={setLocale} />}\n            <NumberField\n              field={{\n                name: 'depth',\n                admin: {\n                  step: 1,\n                },\n                label: t('general:depth'),\n                max: 10,\n                min: 0,\n              }}\n              onChange={(value) => setDepth(value?.toString())}\n              path=\"depth\"\n            />\n          </div>\n        </Form>\n      </div>\n      <div className={`${baseClass}__results-wrapper`}>\n        <div className={`${baseClass}__toggle-fullscreen-button-container`}>\n          <button\n            aria-label=\"toggle fullscreen\"\n            className={`${baseClass}__toggle-fullscreen-button`}\n            onClick={() => setFullscreen(!fullscreen)}\n            type=\"button\"\n          >\n            <MinimizeMaximizeIcon isMinimized={!fullscreen} />\n          </button>\n        </div>\n        <div className={`${baseClass}__results`}>\n          <RenderJSON object={data} />\n        </div>\n      </div>\n    </Gutter>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.client.js","names":["CheckboxField","CopyToClipboard","Form","Gutter","MinimizeMaximizeIcon","NumberField","SetDocumentStepNav","toast","useConfig","useDocumentInfo","useLocale","useTranslation","useSearchParams","hasDraftsEnabled","React","LocaleSelector","RenderJSON","baseClass","APIViewClient","id","collectionSlug","globalSlug","initialData","isTrashed","searchParams","i18n","t","code","config","defaultDepth","localization","routes","api","apiRoute","serverURL","getEntityConfig","collectionConfig","globalConfig","localeOptions","locales","map","locale","label","value","draftsEnabled","docEndpoint","data","setData","useState","draft","setDraft","get","setLocale","depth","setDepth","toString","authenticated","setAuthenticated","fullscreen","setFullscreen","trashParam","deletedAt","params","URLSearchParams","String","trash","fetchURL","useEffect","fetchData","res","fetch","credentials","headers","language","method","json","error","console","_jsxs","className","filter","Boolean","join","right","_jsx","globalLabel","pluralLabel","labels","plural","undefined","useAsTitle","admin","view","href","rel","target","initialState","initialValue","valid","Number","field","name","onChange","path","step","max","min","onClick","type","isMinimized","object"],"sources":["../../../src/views/API/index.client.tsx"],"sourcesContent":["'use client'\n\nimport {\n  CheckboxField,\n  CopyToClipboard,\n  Form,\n  Gutter,\n  MinimizeMaximizeIcon,\n  NumberField,\n  SetDocumentStepNav,\n  toast,\n  useConfig,\n  useDocumentInfo,\n  useLocale,\n  useTranslation,\n} from '@payloadcms/ui'\nimport { useSearchParams } from 'next/navigation.js'\n\nimport './index.scss'\n\nimport { hasDraftsEnabled } from 'payload/shared'\nimport * as React from 'react'\n\nimport { LocaleSelector } from './LocaleSelector/index.js'\nimport { RenderJSON } from './RenderJSON/index.js'\n\nconst baseClass = 'query-inspector'\n\nexport const APIViewClient: React.FC = () => {\n  const { id, collectionSlug, globalSlug, initialData, isTrashed } = useDocumentInfo()\n\n  const searchParams = useSearchParams()\n  const { i18n, t } = useTranslation()\n  const { code } = useLocale()\n\n  const {\n    config: {\n      defaultDepth,\n      localization,\n      routes: { api: apiRoute },\n      serverURL,\n    },\n    getEntityConfig,\n  } = useConfig()\n\n  const collectionConfig = getEntityConfig({ collectionSlug })\n  const globalConfig = getEntityConfig({ globalSlug })\n\n  const localeOptions =\n    localization &&\n    localization.locales.map((locale) => ({ label: locale.label, value: locale.code }))\n\n  let draftsEnabled: boolean = false\n  let docEndpoint: string = ''\n\n  if (collectionConfig) {\n    draftsEnabled = hasDraftsEnabled(collectionConfig)\n    docEndpoint = `/${collectionSlug}/${id}`\n  }\n\n  if (globalConfig) {\n    draftsEnabled = hasDraftsEnabled(globalConfig)\n    docEndpoint = `/globals/${globalSlug}`\n  }\n\n  const [data, setData] = React.useState<any>(initialData)\n  const [draft, setDraft] = React.useState<boolean>(searchParams.get('draft') === 'true')\n  const [locale, setLocale] = React.useState<string>(searchParams?.get('locale') || code)\n  const [depth, setDepth] = React.useState<string>(\n    searchParams.get('depth') || defaultDepth.toString(),\n  )\n  const [authenticated, setAuthenticated] = React.useState<boolean>(true)\n  const [fullscreen, setFullscreen] = React.useState<boolean>(false)\n\n  const trashParam = typeof initialData?.deletedAt === 'string'\n\n  const params = new URLSearchParams({\n    depth,\n    draft: String(draft),\n    locale,\n    trash: trashParam ? 'true' : 'false',\n  }).toString()\n\n  const fetchURL = `${serverURL}${apiRoute}${docEndpoint}?${params}`\n\n  React.useEffect(() => {\n    const fetchData = async () => {\n      try {\n        const res = await fetch(fetchURL, {\n          credentials: authenticated ? 'include' : 'omit',\n          headers: {\n            'Accept-Language': i18n.language,\n          },\n          method: 'GET',\n        })\n\n        try {\n          const json = await res.json()\n          setData(json)\n        } catch (error) {\n          toast.error('Error parsing response')\n          console.error(error) // eslint-disable-line no-console\n        }\n      } catch (error) {\n        toast.error('Error making request')\n        console.error(error) // eslint-disable-line no-console\n      }\n    }\n\n    void fetchData()\n  }, [i18n.language, fetchURL, authenticated])\n\n  return (\n    <Gutter\n      className={[baseClass, fullscreen && `${baseClass}--fullscreen`].filter(Boolean).join(' ')}\n      right={false}\n    >\n      <SetDocumentStepNav\n        collectionSlug={collectionSlug}\n        globalLabel={globalConfig?.label}\n        globalSlug={globalSlug}\n        id={id}\n        isTrashed={isTrashed}\n        pluralLabel={collectionConfig ? collectionConfig?.labels?.plural : undefined}\n        useAsTitle={collectionConfig ? collectionConfig?.admin?.useAsTitle : undefined}\n        view=\"API\"\n      />\n      <div className={`${baseClass}__configuration`}>\n        <div className={`${baseClass}__api-url`}>\n          <span className={`${baseClass}__label`}>\n            API URL <CopyToClipboard value={fetchURL} />\n          </span>\n          <a href={fetchURL} rel=\"noopener noreferrer\" target=\"_blank\">\n            {fetchURL}\n          </a>\n        </div>\n        <Form\n          initialState={{\n            authenticated: {\n              initialValue: authenticated || false,\n              valid: true,\n              value: authenticated || false,\n            },\n            depth: {\n              initialValue: Number(depth || 0),\n              valid: true,\n              value: Number(depth || 0),\n            },\n            draft: {\n              initialValue: draft || false,\n              valid: true,\n              value: draft || false,\n            },\n            locale: {\n              initialValue: locale,\n              valid: true,\n              value: locale,\n            },\n          }}\n        >\n          <div className={`${baseClass}__form-fields`}>\n            <div className={`${baseClass}__filter-query-checkboxes`}>\n              {draftsEnabled && (\n                <CheckboxField\n                  field={{\n                    name: 'draft',\n                    label: t('version:draft'),\n                  }}\n                  onChange={() => setDraft(!draft)}\n                  path=\"draft\"\n                />\n              )}\n              <CheckboxField\n                field={{\n                  name: 'authenticated',\n                  label: t('authentication:authenticated'),\n                }}\n                onChange={() => setAuthenticated(!authenticated)}\n                path=\"authenticated\"\n              />\n            </div>\n            {localeOptions && <LocaleSelector localeOptions={localeOptions} onChange={setLocale} />}\n            <NumberField\n              field={{\n                name: 'depth',\n                admin: {\n                  step: 1,\n                },\n                label: t('general:depth'),\n                max: 10,\n                min: 0,\n              }}\n              onChange={(value) => setDepth(value?.toString())}\n              path=\"depth\"\n            />\n          </div>\n        </Form>\n      </div>\n      <div className={`${baseClass}__results-wrapper`}>\n        <div className={`${baseClass}__toggle-fullscreen-button-container`}>\n          <button\n            aria-label=\"toggle fullscreen\"\n            className={`${baseClass}__toggle-fullscreen-button`}\n            onClick={() => setFullscreen(!fullscreen)}\n            type=\"button\"\n          >\n            <MinimizeMaximizeIcon isMinimized={!fullscreen} />\n          </button>\n        </div>\n        <div className={`${baseClass}__results`}>\n          <RenderJSON object={data} />\n        </div>\n      </div>\n    </Gutter>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/views/API/index.scss

@@ -0,0 +1,119 @@
+@import '~@payloadcms/ui/scss';
+
+@layer payload-default {
+  .query-inspector {
+    --string-color: var(--color-success-450);
+    --number-color: var(--color-warning-450);
+    display: flex;
+    gap: calc(var(--base) * 2);
+    align-items: flex-start;
+
+    ul {
+      padding-left: calc(var(--base) * 1);
+    }
+
+    &--fullscreen {
+      padding-left: 0;
+      .query-inspector__configuration {
+        display: none;
+      }
+    }
+
+    &__configuration {
+      margin-top: calc(var(--base) * 2);
+      width: 60%;
+      position: sticky;
+      top: var(--base);
+    }
+
+    &__api-url {
+      margin-bottom: calc(var(--base) * 1.5);
+
+      a {
+        display: block;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        text-decoration: none;
+
+        &:hover,
+        &:focus-visible {
+          text-decoration: underline;
+        }
+      }
+    }
+
+    &__form-fields {
+      display: flex;
+      flex-direction: column;
+      gap: var(--base);
+    }
+
+    &__label {
+      color: var(--theme-elevation-400);
+    }
+
+    &__filter-query-checkboxes {
+      display: flex;
+      gap: var(--base);
+    }
+
+    &__results-wrapper {
+      font-family: var(--font-mono);
+      width: 100%;
+      ul {
+        margin: 0;
+      }
+      li {
+        list-style: none;
+      }
+    }
+
+    &__toggle-fullscreen-button-container {
+      position: sticky;
+      top: 0;
+      z-index: 1;
+
+      @include mid-break {
+        display: none;
+      }
+    }
+
+    &__toggle-fullscreen-button {
+      position: absolute;
+      right: calc(var(--base) * 0.5);
+      top: calc(var(--base) * 0.5);
+      padding: calc(var(--base) * 0.25);
+      background-color: var(--theme-elevation-0);
+      cursor: pointer;
+      z-index: 1;
+      margin: 0;
+      border: 0;
+      border-radius: 3px;
+      color: var(--theme-elevation-300);
+      &:hover {
+        color: var(--theme-elevation-700);
+      }
+    }
+
+    &__results {
+      padding-top: calc(var(--base) * 0.5);
+      padding-left: calc(var(--base) * 0.5);
+      padding-bottom: calc(var(--base) * 0.5);
+      background-color: var(--theme-elevation-50);
+      overflow: auto;
+      min-height: 100vh;
+    }
+
+    @include mid-break {
+      flex-direction: column;
+      padding-left: 0;
+
+      .query-inspector__configuration {
+        position: relative;
+        width: 100%;
+        top: 0;
+        padding-inline-end: var(--gutter-h);
+      }
+    }
+  }
+}