@payloadcms/ui 4.0.0-internal.5f0cd13 → 4.0.0-internal.a0ef1b8

package/dist/views/Verify/index.scss

@@ -0,0 +1,18 @@
+@import '../../scss/styles.scss';
+
+@layer payload-default {
+  .verify {
+    display: flex;
+    align-items: center;
+    text-align: center;
+    flex-wrap: wrap;
+    min-height: 100vh;
+
+    &__brand {
+      display: flex;
+      justify-content: center;
+      width: 100%;
+      margin-bottom: calc(var(--base) * 2);
+    }
+  }
+}

package/dist/views/Verify/metadata.d.ts

@@ -0,0 +1,3 @@
+import type { GenerateViewMetadata } from 'payload';
+export declare const generateVerifyMetadata: GenerateViewMetadata;
+//# sourceMappingURL=metadata.d.ts.map

package/dist/views/Verify/metadata.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"metadata.d.ts","sourceRoot":"","sources":["../../../src/views/Verify/metadata.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAInD,eAAO,MAAM,sBAAsB,EAAE,oBAOjC,CAAA"}

package/dist/views/Verify/metadata.js

@@ -0,0 +1,14 @@
+import { formatMetadata } from '../../utilities/formatMetadata.js';
+export const generateVerifyMetadata = async ({
+  config,
+  i18n: {
+    t
+  }
+}) => formatMetadata({
+  description: t('authentication:verifyUser'),
+  keywords: t('authentication:verify'),
+  serverURL: config.serverURL,
+  title: t('authentication:verify'),
+  ...(config.admin.meta || {})
+});
+//# sourceMappingURL=metadata.js.map

package/dist/views/Verify/metadata.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"metadata.js","names":["formatMetadata","generateVerifyMetadata","config","i18n","t","description","keywords","serverURL","title","admin","meta"],"sources":["../../../src/views/Verify/metadata.ts"],"sourcesContent":["import type { GenerateViewMetadata } from 'payload'\n\nimport { formatMetadata } from '../../utilities/formatMetadata.js'\n\nexport const generateVerifyMetadata: GenerateViewMetadata = async ({ config, i18n: { t } }) =>\n  formatMetadata({\n    description: t('authentication:verifyUser'),\n    keywords: t('authentication:verify'),\n    serverURL: config.serverURL,\n    title: t('authentication:verify'),\n    ...(config.admin.meta || {}),\n  })\n"],"mappings":"AAEA,SAASA,cAAc,QAAQ;AAE/B,OAAO,MAAMC,sBAAA,GAA+C,MAAAA,CAAO;EAAEC,MAAM;EAAEC,IAAA,EAAM;IAAEC;EAAC;AAAE,CAAE,KACxFJ,cAAA,CAAe;EACbK,WAAA,EAAaD,CAAA,CAAE;EACfE,QAAA,EAAUF,CAAA,CAAE;EACZG,SAAA,EAAWL,MAAA,CAAOK,SAAS;EAC3BC,KAAA,EAAOJ,CAAA,CAAE;EACT,IAAIF,MAAA,CAAOO,KAAK,CAACC,IAAI,IAAI,CAAC,CAAC;AAC7B","ignoreList":[]}

package/dist/views/Version/Default/SelectedLocalesContext.d.ts

@@ -0,0 +1,7 @@
+type SelectedLocalesContextType = {
+    selectedLocales: string[];
+};
+export declare const SelectedLocalesContext: import("react").Context<SelectedLocalesContextType>;
+export declare const useSelectedLocales: () => SelectedLocalesContextType;
+export {};
+//# sourceMappingURL=SelectedLocalesContext.d.ts.map

package/dist/views/Version/Default/SelectedLocalesContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectedLocalesContext.d.ts","sourceRoot":"","sources":["../../../../src/views/Version/Default/SelectedLocalesContext.tsx"],"names":[],"mappings":"AAIA,KAAK,0BAA0B,GAAG;IAChC,eAAe,EAAE,MAAM,EAAE,CAAA;CAC1B,CAAA;AAED,eAAO,MAAM,sBAAsB,qDAEjC,CAAA;AAEF,eAAO,MAAM,kBAAkB,kCAAoC,CAAA"}

package/dist/views/Version/Default/SelectedLocalesContext.js

@@ -0,0 +1,8 @@
+'use client';
+
+import { createContext, use } from 'react';
+export const SelectedLocalesContext = /*#__PURE__*/createContext({
+  selectedLocales: []
+});
+export const useSelectedLocales = () => use(SelectedLocalesContext);
+//# sourceMappingURL=SelectedLocalesContext.js.map

package/dist/views/Version/Default/SelectedLocalesContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectedLocalesContext.js","names":["createContext","use","SelectedLocalesContext","selectedLocales","useSelectedLocales"],"sources":["../../../../src/views/Version/Default/SelectedLocalesContext.tsx"],"sourcesContent":["'use client'\n\nimport { createContext, use } from 'react'\n\ntype SelectedLocalesContextType = {\n  selectedLocales: string[]\n}\n\nexport const SelectedLocalesContext = createContext<SelectedLocalesContextType>({\n  selectedLocales: [],\n})\n\nexport const useSelectedLocales = () => use(SelectedLocalesContext)\n"],"mappings":"AAAA;;AAEA,SAASA,aAAa,EAAEC,GAAG,QAAQ;AAMnC,OAAO,MAAMC,sBAAA,gBAAyBF,aAAA,CAA0C;EAC9EG,eAAA,EAAiB;AACnB;AAEA,OAAO,MAAMC,kBAAA,GAAqBA,CAAA,KAAMH,GAAA,CAAIC,sBAAA","ignoreList":[]}

package/dist/views/Version/Default/SetStepNav.d.ts

@@ -0,0 +1,11 @@
+import type { ClientCollectionConfig, ClientGlobalConfig } from 'payload';
+import type React from 'react';
+export declare const SetStepNav: React.FC<{
+    readonly collectionConfig?: ClientCollectionConfig;
+    readonly globalConfig?: ClientGlobalConfig;
+    readonly id?: number | string;
+    readonly isTrashed?: boolean;
+    versionToCreatedAtFormatted?: string;
+    versionToID?: string;
+}>;
+//# sourceMappingURL=SetStepNav.d.ts.map

package/dist/views/Version/Default/SetStepNav.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SetStepNav.d.ts","sourceRoot":"","sources":["../../../../src/views/Version/Default/SetStepNav.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,sBAAsB,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAA;AACzE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAY9B,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC;IAChC,QAAQ,CAAC,gBAAgB,CAAC,EAAE,sBAAsB,CAAA;IAClD,QAAQ,CAAC,YAAY,CAAC,EAAE,kBAAkB,CAAA;IAC1C,QAAQ,CAAC,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC7B,QAAQ,CAAC,SAAS,CAAC,EAAE,OAAO,CAAA;IAC5B,2BAA2B,CAAC,EAAE,MAAM,CAAA;IACpC,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,CAiHA,CAAA"}

package/dist/views/Version/Default/SetStepNav.js

@@ -0,0 +1,139 @@
+'use client';
+
+import { c as _c } from "react/compiler-runtime";
+import { getTranslation } from '@payloadcms/translations';
+import { formatAdminURL } from 'payload/shared';
+import { useEffect } from 'react';
+import { useStepNav } from '../../../elements/StepNav/index.js';
+import { useConfig } from '../../../providers/Config/index.js';
+import { useDocumentTitle } from '../../../providers/DocumentTitle/index.js';
+import { useLocale } from '../../../providers/Locale/index.js';
+import { useTranslation } from '../../../providers/Translation/index.js';
+export const SetStepNav = t0 => {
+  const $ = _c(24);
+  const {
+    id,
+    collectionConfig,
+    globalConfig,
+    isTrashed,
+    versionToCreatedAtFormatted,
+    versionToID
+  } = t0;
+  const {
+    config
+  } = useConfig();
+  const {
+    setStepNav
+  } = useStepNav();
+  const {
+    i18n,
+    t
+  } = useTranslation();
+  const locale = useLocale();
+  const {
+    title
+  } = useDocumentTitle();
+  let t1;
+  if ($[0] !== collectionConfig || $[1] !== config || $[2] !== globalConfig || $[3] !== i18n || $[4] !== id || $[5] !== isTrashed || $[6] !== setStepNav || $[7] !== t || $[8] !== title || $[9] !== versionToCreatedAtFormatted) {
+    t1 = () => {
+      const {
+        routes: t2
+      } = config;
+      const {
+        admin: adminRoute
+      } = t2;
+      if (collectionConfig) {
+        const collectionSlug = collectionConfig.slug;
+        const pluralLabel = collectionConfig.labels?.plural;
+        const docBasePath = isTrashed ? `/collections/${collectionSlug}/trash/${id}` : `/collections/${collectionSlug}/${id}`;
+        const nav = [{
+          label: getTranslation(pluralLabel, i18n),
+          url: formatAdminURL({
+            adminRoute,
+            path: `/collections/${collectionSlug}`
+          })
+        }];
+        if (isTrashed) {
+          nav.push({
+            label: t("general:trash"),
+            url: formatAdminURL({
+              adminRoute,
+              path: `/collections/${collectionSlug}/trash`
+            })
+          });
+        }
+        nav.push({
+          label: title,
+          url: formatAdminURL({
+            adminRoute,
+            path: docBasePath
+          })
+        }, {
+          label: t("version:versions"),
+          url: formatAdminURL({
+            adminRoute,
+            path: `${docBasePath}/versions`
+          })
+        }, {
+          label: versionToCreatedAtFormatted,
+          url: undefined
+        });
+        setStepNav(nav);
+        return;
+      }
+      if (globalConfig) {
+        const globalSlug = globalConfig.slug;
+        setStepNav([{
+          label: globalConfig.label,
+          url: formatAdminURL({
+            adminRoute,
+            path: `/globals/${globalSlug}`
+          })
+        }, {
+          label: t("version:versions"),
+          url: formatAdminURL({
+            adminRoute,
+            path: `/globals/${globalSlug}/versions`
+          })
+        }, {
+          label: versionToCreatedAtFormatted
+        }]);
+      }
+    };
+    $[0] = collectionConfig;
+    $[1] = config;
+    $[2] = globalConfig;
+    $[3] = i18n;
+    $[4] = id;
+    $[5] = isTrashed;
+    $[6] = setStepNav;
+    $[7] = t;
+    $[8] = title;
+    $[9] = versionToCreatedAtFormatted;
+    $[10] = t1;
+  } else {
+    t1 = $[10];
+  }
+  let t2;
+  if ($[11] !== collectionConfig || $[12] !== config || $[13] !== globalConfig || $[14] !== i18n || $[15] !== id || $[16] !== isTrashed || $[17] !== locale || $[18] !== setStepNav || $[19] !== t || $[20] !== title || $[21] !== versionToCreatedAtFormatted || $[22] !== versionToID) {
+    t2 = [config, setStepNav, id, isTrashed, locale, t, i18n, collectionConfig, globalConfig, title, versionToCreatedAtFormatted, versionToID];
+    $[11] = collectionConfig;
+    $[12] = config;
+    $[13] = globalConfig;
+    $[14] = i18n;
+    $[15] = id;
+    $[16] = isTrashed;
+    $[17] = locale;
+    $[18] = setStepNav;
+    $[19] = t;
+    $[20] = title;
+    $[21] = versionToCreatedAtFormatted;
+    $[22] = versionToID;
+    $[23] = t2;
+  } else {
+    t2 = $[23];
+  }
+  useEffect(t1, t2);
+  return null;
+};
+//# sourceMappingURL=SetStepNav.js.map

package/dist/views/Version/Default/SetStepNav.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SetStepNav.js","names":["c","_c","getTranslation","formatAdminURL","useEffect","useStepNav","useConfig","useDocumentTitle","useLocale","useTranslation","SetStepNav","t0","$","id","collectionConfig","globalConfig","isTrashed","versionToCreatedAtFormatted","versionToID","config","setStepNav","i18n","t","locale","title","t1","routes","t2","admin","adminRoute","collectionSlug","slug","pluralLabel","labels","plural","docBasePath","nav","label","url","path","push","undefined","globalSlug"],"sources":["../../../../src/views/Version/Default/SetStepNav.tsx"],"sourcesContent":["'use client'\n\nimport type { ClientCollectionConfig, ClientGlobalConfig } from 'payload'\nimport type React from 'react'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { formatAdminURL } from 'payload/shared'\nimport { useEffect } from 'react'\n\nimport { useStepNav } from '../../../elements/StepNav/index.js'\nimport { useConfig } from '../../../providers/Config/index.js'\nimport { useDocumentTitle } from '../../../providers/DocumentTitle/index.js'\nimport { useLocale } from '../../../providers/Locale/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\n\nexport const SetStepNav: React.FC<{\n  readonly collectionConfig?: ClientCollectionConfig\n  readonly globalConfig?: ClientGlobalConfig\n  readonly id?: number | string\n  readonly isTrashed?: boolean\n  versionToCreatedAtFormatted?: string\n  versionToID?: string\n}> = ({\n  id,\n  collectionConfig,\n  globalConfig,\n  isTrashed,\n  versionToCreatedAtFormatted,\n  versionToID,\n}) => {\n  const { config } = useConfig()\n  const { setStepNav } = useStepNav()\n  const { i18n, t } = useTranslation()\n  const locale = useLocale()\n  const { title } = useDocumentTitle()\n\n  useEffect(() => {\n    const {\n      routes: { admin: adminRoute },\n      serverURL,\n    } = config\n\n    if (collectionConfig) {\n      const collectionSlug = collectionConfig.slug\n\n      const pluralLabel = collectionConfig.labels?.plural\n\n      const docBasePath: `/${string}` = isTrashed\n        ? `/collections/${collectionSlug}/trash/${id}`\n        : `/collections/${collectionSlug}/${id}`\n\n      const nav = [\n        {\n          label: getTranslation(pluralLabel, i18n),\n          url: formatAdminURL({\n            adminRoute,\n            path: `/collections/${collectionSlug}`,\n          }),\n        },\n      ]\n\n      if (isTrashed) {\n        nav.push({\n          label: t('general:trash'),\n          url: formatAdminURL({\n            adminRoute,\n            path: `/collections/${collectionSlug}/trash`,\n          }),\n        })\n      }\n\n      nav.push(\n        {\n          label: title,\n          url: formatAdminURL({\n            adminRoute,\n            path: docBasePath,\n          }),\n        },\n        {\n          label: t('version:versions'),\n          url: formatAdminURL({\n            adminRoute,\n            path: `${docBasePath}/versions`,\n          }),\n        },\n        {\n          label: versionToCreatedAtFormatted,\n          url: undefined,\n        },\n      )\n\n      setStepNav(nav)\n      return\n    }\n\n    if (globalConfig) {\n      const globalSlug = globalConfig.slug\n\n      setStepNav([\n        {\n          label: globalConfig.label,\n          url: formatAdminURL({\n            adminRoute,\n            path: `/globals/${globalSlug}`,\n          }),\n        },\n        {\n          label: t('version:versions'),\n          url: formatAdminURL({\n            adminRoute,\n            path: `/globals/${globalSlug}/versions`,\n          }),\n        },\n        {\n          label: versionToCreatedAtFormatted,\n        },\n      ])\n    }\n  }, [\n    config,\n    setStepNav,\n    id,\n    isTrashed,\n    locale,\n    t,\n    i18n,\n    collectionConfig,\n    globalConfig,\n    title,\n    versionToCreatedAtFormatted,\n    versionToID,\n  ])\n\n  return null\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/views/Version/Default/index.css

@@ -0,0 +1,227 @@
+@layer payload-default {
+  .view-version {
+    width: 100%;
+    padding-bottom: var(--spacing-view-bottom);
+  }
+
+  .view-version__toggle-locales-label {
+    color: var(--color-text-secondary);
+  }
+
+  .view-version-controls-top {
+    border-bottom: var(--stroke-width-small) solid var(--color-border);
+    padding: var(--spacer-2) var(--spacer-4);
+  }
+
+  .view-version-controls-top__wrapper {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    align-items: center;
+  }
+
+  .view-version-controls-top__wrapper-actions {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    gap: var(--spacer-4);
+  }
+
+  .view-version-controls-top h2 {
+    color: var(--color-text);
+    font-family: var(--text-body-large-strong-font-family);
+    font-size: var(--text-body-large-strong-font-size);
+    font-style: normal;
+    font-weight: var(--text-body-large-strong-font-weight);
+    line-height: var(--text-body-large-strong-line-height);
+    letter-spacing: var(--text-body-large-strong-letter-spacing);
+  }
+
+  .view-version-controls-bottom {
+    border-bottom: var(--stroke-width-small) solid var(--color-border);
+    padding: var(--spacer-2-5) var(--spacer-4);
+    position: relative;
+
+    /* Vertical separator line */
+    &::after {
+      content: '';
+      position: absolute;
+      top: 0;
+      bottom: 0;
+      left: 50%;
+      width: var(--stroke-width-small);
+      background-color: var(--color-border);
+      transform: translateX(-50%);
+    }
+  }
+
+  .view-version-controls-bottom__wrapper {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: var(--spacer-4);
+  }
+
+  .view-version__time-elapsed {
+    color: var(--color-text-secondary);
+    font-weight: var(--text-body-medium-font-weight);
+  }
+
+  .view-version__version-from,
+  .view-version__version-to {
+    display: flex;
+    flex-direction: column;
+    gap: var(--spacer-2);
+  }
+
+  .view-version__version-from-labels,
+  .view-version__version-to-labels {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    color: var(--color-text);
+    font-family: var(--text-body-medium-strong-font-family);
+    font-size: var(--text-body-medium-strong-font-size);
+    font-style: normal;
+    font-weight: var(--text-body-medium-strong-font-weight);
+    line-height: var(--text-body-medium-strong-line-height);
+    letter-spacing: var(--text-body-medium-letter-spacing);
+  }
+
+  .view-version__version-to-version {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
+    border: var(--stroke-width-small) solid var(--color-border);
+    border-radius: var(--radius-medium);
+    padding: var(--spacer-1) var(--spacer-2);
+    gap: var(--spacer-2);
+  }
+
+  .view-version__version-to-version h2 {
+    font-family: var(--text-body-medium-font-family);
+    font-size: var(--text-body-medium-font-size);
+    font-weight: var(--text-body-medium-font-weight);
+    line-height: var(--text-body-medium-line-height);
+    letter-spacing: var(--text-body-medium-letter-spacing);
+    color: var(--color-text-secondary);
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  .view-version__restore div {
+    margin-block: 0;
+  }
+
+  .view-version__modifiedCheckBox {
+    margin: 0 0 0 var(--spacer-4);
+    display: flex;
+    align-items: center;
+    overflow: hidden;
+    color: var(--color-text);
+    text-overflow: ellipsis;
+    font-family: var(--text-body-medium-font-family);
+    font-size: var(--text-body-medium-font-size);
+    font-style: normal;
+    font-weight: var(--text-body-medium-font-weight);
+    line-height: var(--text-body-medium-line-height);
+    letter-spacing: var(--text-body-medium-letter-spacing);
+  }
+
+  .view-version__modifiedCheckBox label.field-label {
+    font-weight: var(--text-body-medium-font-weight);
+  }
+
+  .compare-version .rs__control {
+    padding: var(--spacer-2);
+  }
+
+  .view-version__diff-wrap {
+    padding: var(--spacer-3) var(--spacer-4);
+    display: flex;
+    flex-direction: column;
+    gap: var(--spacer-3);
+    position: relative;
+    border-bottom: var(--stroke-width-small) solid var(--color-border);
+
+    /* Vertical separator line */
+    &::after {
+      content: '';
+      position: absolute;
+      top: 0;
+      bottom: 0;
+      left: 50%;
+      width: var(--stroke-width-small);
+      background-color: var(--color-border);
+      transform: translateX(-50%);
+      z-index: 2;
+    }
+  }
+
+  @media (max-width: 1024px) {
+    .view-version__version-to-version {
+      flex-direction: column;
+      align-items: flex-start;
+    }
+  }
+
+  @media (max-width: 768px) {
+    .view-version {
+      display: flex;
+      flex-direction: column;
+    }
+
+    .view-version__version-to-version {
+      flex-direction: row;
+      align-items: center;
+    }
+
+    /* Reorder: controls-bottom first, controls-top (checkbox) second, diff last */
+    .view-version-controls-bottom {
+      order: 1;
+      padding-inline: var(--spacer-3);
+
+      /* Hide vertical separator on mobile */
+      &::after {
+        display: none;
+      }
+    }
+
+    .view-version-controls-top {
+      order: 2;
+      padding-inline: var(--spacer-3);
+    }
+
+    .view-version__diff-wrap {
+      order: 3;
+      padding: var(--spacer-3);
+
+      /* Hide vertical separator on mobile */
+      &::after {
+        display: none;
+      }
+    }
+
+    /* Hide title on mobile */
+    .view-version-controls-top h2 {
+      display: none;
+    }
+
+    /* Checkbox: remove left margin */
+    .view-version-controls-top__wrapper .view-version__modifiedCheckBox {
+      margin-left: 0;
+    }
+
+    .view-version-controls-top__wrapper-actions {
+      width: 100%;
+      justify-content: space-between;
+    }
+
+    /* Single column for version selectors */
+    .view-version-controls-bottom__wrapper {
+      grid-template-columns: 1fr;
+      gap: var(--spacer-3);
+    }
+  }
+}

package/dist/views/Version/Default/index.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import type { DefaultVersionsViewProps } from './types.js';
+import './index.css';
+export declare const DefaultVersionView: React.FC<DefaultVersionsViewProps>;
+//# sourceMappingURL=index.d.ts.map

package/dist/views/Version/Default/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/views/Version/Default/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA2E,MAAM,OAAO,CAAA;AAG/F,OAAO,KAAK,EAAiB,wBAAwB,EAAE,MAAM,YAAY,CAAA;AAczE,OAAO,aAAa,CAAA;AAQpB,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CA+PjE,CAAA"}