@payloadcms/ui 4.0.0-internal.d21c039 → 4.0.0-internal.d3909a9

package/dist/widgets/UploadDropzone/index.client.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.client.d.ts","sourceRoot":"","sources":["../../../src/widgets/UploadDropzone/index.client.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAA;AASzB,OAAO,aAAa,CAAA;AAEpB,eAAO,MAAM,0BAA0B,mCAGpC;IACD,cAAc,EAAE,MAAM,CAAA;IACtB,SAAS,CAAC,EAAE,MAAM,EAAE,CAAA;CACrB,sBAoDA,CAAA"}
+{"version":3,"file":"index.client.d.ts","sourceRoot":"","sources":["../../../src/widgets/UploadDropzone/index.client.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAA;AAUzB,KAAK,KAAK,GAAG;IACX,WAAW,EAAE,KAAK,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,EAAE,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;CAC3D,CAAA;AAED,wBAAgB,0BAA0B,CAAC,EAAE,WAAW,EAAE,EAAE,KAAK,qBAmEhE"}

package/dist/widgets/UploadDropzone/index.client.js

@@ -1,33 +1,22 @@
 'use client';
 
-import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useModal } from '@faceless-ui/modal';
 import { validateMimeType } from 'payload/shared';
 import React from 'react';
 import { toast } from 'sonner';
 import { useBulkUpload } from '../../elements/BulkUpload/index.js';
 import { Button } from '../../elements/Button/index.js';
 import { Dropzone } from '../../elements/Dropzone/index.js';
-import { useRouter } from '../../providers/RouterAdapter/index.js';
+import { useModal } from '../../elements/Modal/index.js';
+import { ImageStackIcon } from '../../icons/ImageStack/index.js';
 import { useTranslation } from '../../providers/Translation/index.js';
-import { WidgetIcon } from '../WidgetIcon/index.js';
-import './index.css';
-export const UploadDropzoneWidgetClient = t0 => {
-  const $ = _c(22);
-  const {
-    collectionSlug,
-    mimeTypes
-  } = t0;
+export function UploadDropzoneWidgetClient({
+  collections
+}) {
   const {
     modalSlug,
     setCollectionSlug,
     setInitialFiles,
-    setInitialForms,
-    setMaxFiles,
-    setOnCancel,
-    setOnSuccess,
-    setParentID,
     setSelectableCollections
   } = useBulkUpload();
   const {
@@ -36,99 +25,54 @@ export const UploadDropzoneWidgetClient = t0 => {
   const {
     t
   } = useTranslation();
-  const router = useRouter();
-  let t1;
-  if ($[0] !== collectionSlug || $[1] !== mimeTypes || $[2] !== modalSlug || $[3] !== openModal || $[4] !== router || $[5] !== setCollectionSlug || $[6] !== setInitialFiles || $[7] !== setInitialForms || $[8] !== setMaxFiles || $[9] !== setOnCancel || $[10] !== setOnSuccess || $[11] !== setParentID || $[12] !== setSelectableCollections || $[13] !== t) {
-    t1 = t2 => {
-      const {
-        files
-      } = t2 === undefined ? {} : t2;
-      if (files && mimeTypes?.length && Array.from(files).some(file => !validateMimeType(file.type, mimeTypes))) {
-        toast.error(t("error:invalidFileType"));
-        return;
-      }
-      setCollectionSlug(collectionSlug);
-      setInitialFiles(files);
-      setInitialForms(undefined);
-      setParentID(undefined);
-      setMaxFiles(undefined);
-      setSelectableCollections(null);
-      setOnCancel(_temp);
-      setOnSuccess(() => router.refresh());
-      openModal(modalSlug);
-    };
-    $[0] = collectionSlug;
-    $[1] = mimeTypes;
-    $[2] = modalSlug;
-    $[3] = openModal;
-    $[4] = router;
-    $[5] = setCollectionSlug;
-    $[6] = setInitialFiles;
-    $[7] = setInitialForms;
-    $[8] = setMaxFiles;
-    $[9] = setOnCancel;
-    $[10] = setOnSuccess;
-    $[11] = setParentID;
-    $[12] = setSelectableCollections;
-    $[13] = t;
-    $[14] = t1;
-  } else {
-    t1 = $[14];
-  }
-  const openUpload = t1;
-  let t2;
-  if ($[15] !== openUpload || $[16] !== t) {
-    let t3;
-    if ($[18] !== openUpload) {
-      t3 = files_0 => openUpload({
-        files: files_0
-      });
-      $[18] = openUpload;
-      $[19] = t3;
-    } else {
-      t3 = $[19];
-    }
-    let t4;
-    if ($[20] !== openUpload) {
-      t4 = () => openUpload();
-      $[20] = openUpload;
-      $[21] = t4;
-    } else {
-      t4 = $[21];
+  const openUpload = React.useCallback(({
+    collectionSlug = collections[0].slug,
+    files
+  } = {}) => {
+    setSelectableCollections(collections.map(({
+      slug
+    }) => slug));
+    setCollectionSlug(collectionSlug);
+    setInitialFiles(files);
+    openModal(modalSlug);
+  }, [collections, modalSlug, openModal, setCollectionSlug, setInitialFiles, setSelectableCollections]);
+  const onDrop = React.useCallback(files_0 => {
+    const compatibleCollections = collections.filter(({
+      mimeTypes
+    }) => Array.from(files_0).every(file => !mimeTypes?.length || validateMimeType(file.type, mimeTypes)));
+    if (!compatibleCollections.length) {
+      toast.error(t('error:invalidFileType'));
+      return;
     }
-    t2 = _jsx("section", {
-      "aria-label": t("dashboard:uploadDropzone"),
-      className: "upload-dropzone-widget",
-      children: _jsxs(Dropzone, {
-        className: "upload-dropzone-widget__zone",
-        multipleFiles: true,
-        onChange: t3,
-        children: [_jsx("span", {
-          className: "upload-dropzone-widget__icon",
-          children: _jsx(WidgetIcon, {
-            name: "images"
-          })
-        }), _jsx("p", {
-          className: "upload-dropzone-widget__prompt",
-          children: t("dashboard:uploadHint")
-        }), _jsx("p", {
-          className: "upload-dropzone-widget__drag",
-          children: t("dashboard:dropFiles")
-        }), _jsx(Button, {
-          buttonStyle: "secondary",
-          onClick: t4,
-          size: "medium",
-          children: t("dashboard:uploadFiles")
-        })]
-      })
+    openUpload({
+      collectionSlug: compatibleCollections[0].slug,
+      files: files_0
     });
-    $[15] = openUpload;
-    $[16] = t;
-    $[17] = t2;
-  } else {
-    t2 = $[17];
-  }
-  return t2;
-};
-function _temp() {}
+  }, [collections, openUpload, t]);
+  return /*#__PURE__*/_jsxs(Dropzone, {
+    className: "upload-dropzone-widget__dropzone",
+    isFocusable: false,
+    multipleFiles: true,
+    onChange: onDrop,
+    children: [/*#__PURE__*/_jsxs("div", {
+      className: "upload-dropzone-widget__content",
+      children: [/*#__PURE__*/_jsx("span", {
+        "aria-hidden": "true",
+        className: "upload-dropzone-widget__icon",
+        children: /*#__PURE__*/_jsx(ImageStackIcon, {})
+      }), /*#__PURE__*/_jsx("p", {
+        className: "upload-dropzone-widget__description",
+        children: t('dashboard:widgetUploadDropzoneDescription')
+      }), /*#__PURE__*/_jsx(Button, {
+        buttonStyle: "secondary",
+        onClick: () => openUpload(),
+        size: "medium",
+        children: t('dashboard:widgetUploadFiles')
+      })]
+    }), /*#__PURE__*/_jsx("p", {
+      className: "upload-dropzone-widget__drag-message",
+      children: t('dashboard:widgetDropFilesToUpload')
+    })]
+  });
+}
 //# sourceMappingURL=index.client.js.map

package/dist/widgets/UploadDropzone/index.client.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.client.js","names":["c","_c","useModal","validateMimeType","React","toast","useBulkUpload","Button","Dropzone","useRouter","useTranslation","WidgetIcon","UploadDropzoneWidgetClient","t0","$","collectionSlug","mimeTypes","modalSlug","setCollectionSlug","setInitialFiles","setInitialForms","setMaxFiles","setOnCancel","setOnSuccess","setParentID","setSelectableCollections","openModal","t","router","t1","t2","files","undefined","length","Array","from","some","file","type","error","_temp","refresh","openUpload","t3","files_0","t4","_jsx","className","children","_jsxs","multipleFiles","onChange","name","buttonStyle","onClick","size"],"sources":["../../../src/widgets/UploadDropzone/index.client.tsx"],"sourcesContent":["'use client'\nimport { useModal } from '@faceless-ui/modal'\nimport { validateMimeType } from 'payload/shared'\nimport React from 'react'\nimport { toast } from 'sonner'\n\nimport { useBulkUpload } from '../../elements/BulkUpload/index.js'\nimport { Button } from '../../elements/Button/index.js'\nimport { Dropzone } from '../../elements/Dropzone/index.js'\nimport { useRouter } from '../../providers/RouterAdapter/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { WidgetIcon } from '../WidgetIcon/index.js'\nimport './index.css'\n\nexport const UploadDropzoneWidgetClient = ({\n  collectionSlug,\n  mimeTypes,\n}: {\n  collectionSlug: string\n  mimeTypes?: string[]\n}) => {\n  const {\n    modalSlug,\n    setCollectionSlug,\n    setInitialFiles,\n    setInitialForms,\n    setMaxFiles,\n    setOnCancel,\n    setOnSuccess,\n    setParentID,\n    setSelectableCollections,\n  } = useBulkUpload()\n  const { openModal } = useModal()\n  const { t } = useTranslation()\n  const router = useRouter()\n  const openUpload = ({ files }: { files?: FileList } = {}) => {\n    if (\n      files &&\n      mimeTypes?.length &&\n      Array.from(files).some((file) => !validateMimeType(file.type, mimeTypes))\n    ) {\n      toast.error(t('error:invalidFileType'))\n      return\n    }\n    setCollectionSlug(collectionSlug)\n    setInitialFiles(files)\n    setInitialForms(undefined)\n    setParentID(undefined)\n    setMaxFiles(undefined)\n    setSelectableCollections(null)\n    setOnCancel(() => {})\n    setOnSuccess(() => router.refresh())\n    openModal(modalSlug)\n  }\n  return (\n    <section aria-label={t('dashboard:uploadDropzone')} className=\"upload-dropzone-widget\">\n      <Dropzone\n        className=\"upload-dropzone-widget__zone\"\n        multipleFiles\n        onChange={(files) => openUpload({ files })}\n      >\n        <span className=\"upload-dropzone-widget__icon\">\n          <WidgetIcon name=\"images\" />\n        </span>\n        <p className=\"upload-dropzone-widget__prompt\">{t('dashboard:uploadHint')}</p>\n        <p className=\"upload-dropzone-widget__drag\">{t('dashboard:dropFiles')}</p>\n        <Button buttonStyle=\"secondary\" onClick={() => openUpload()} size=\"medium\">\n          {t('dashboard:uploadFiles')}\n        </Button>\n      </Dropzone>\n    </section>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.client.js","names":["validateMimeType","React","toast","useBulkUpload","Button","Dropzone","useModal","ImageStackIcon","useTranslation","UploadDropzoneWidgetClient","collections","modalSlug","setCollectionSlug","setInitialFiles","setSelectableCollections","openModal","t","openUpload","useCallback","collectionSlug","slug","files","map","onDrop","compatibleCollections","filter","mimeTypes","Array","from","every","file","length","type","error","_jsxs","className","isFocusable","multipleFiles","onChange","_jsx","buttonStyle","onClick","size"],"sources":["../../../src/widgets/UploadDropzone/index.client.tsx"],"sourcesContent":["'use client'\n\nimport { validateMimeType } from 'payload/shared'\nimport React from 'react'\nimport { toast } from 'sonner'\n\nimport { useBulkUpload } from '../../elements/BulkUpload/index.js'\nimport { Button } from '../../elements/Button/index.js'\nimport { Dropzone } from '../../elements/Dropzone/index.js'\nimport { useModal } from '../../elements/Modal/index.js'\nimport { ImageStackIcon } from '../../icons/ImageStack/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\n\ntype Props = {\n  collections: Array<{ mimeTypes?: string[]; slug: string }>\n}\n\nexport function UploadDropzoneWidgetClient({ collections }: Props) {\n  const { modalSlug, setCollectionSlug, setInitialFiles, setSelectableCollections } =\n    useBulkUpload()\n  const { openModal } = useModal()\n  const { t } = useTranslation()\n\n  const openUpload = React.useCallback(\n    ({\n      collectionSlug = collections[0].slug,\n      files,\n    }: { collectionSlug?: string; files?: FileList } = {}) => {\n      setSelectableCollections(collections.map(({ slug }) => slug))\n      setCollectionSlug(collectionSlug)\n      setInitialFiles(files)\n      openModal(modalSlug)\n    },\n    [\n      collections,\n      modalSlug,\n      openModal,\n      setCollectionSlug,\n      setInitialFiles,\n      setSelectableCollections,\n    ],\n  )\n\n  const onDrop = React.useCallback(\n    (files: FileList) => {\n      const compatibleCollections = collections.filter(({ mimeTypes }) =>\n        Array.from(files).every(\n          (file) => !mimeTypes?.length || validateMimeType(file.type, mimeTypes),\n        ),\n      )\n\n      if (!compatibleCollections.length) {\n        toast.error(t('error:invalidFileType'))\n        return\n      }\n\n      openUpload({ collectionSlug: compatibleCollections[0].slug, files })\n    },\n    [collections, openUpload, t],\n  )\n\n  return (\n    <Dropzone\n      className=\"upload-dropzone-widget__dropzone\"\n      isFocusable={false}\n      multipleFiles\n      onChange={onDrop}\n    >\n      <div className=\"upload-dropzone-widget__content\">\n        <span aria-hidden=\"true\" className=\"upload-dropzone-widget__icon\">\n          <ImageStackIcon />\n        </span>\n        <p className=\"upload-dropzone-widget__description\">\n          {t('dashboard:widgetUploadDropzoneDescription')}\n        </p>\n        <Button buttonStyle=\"secondary\" onClick={() => openUpload()} size=\"medium\">\n          {t('dashboard:widgetUploadFiles')}\n        </Button>\n      </div>\n      <p className=\"upload-dropzone-widget__drag-message\">\n        {t('dashboard:widgetDropFilesToUpload')}\n      </p>\n    </Dropzone>\n  )\n}\n"],"mappings":"AAAA;;;AAEA,SAASA,gBAAgB,QAAQ;AACjC,OAAOC,KAAA,MAAW;AAClB,SAASC,KAAK,QAAQ;AAEtB,SAASC,aAAa,QAAQ;AAC9B,SAASC,MAAM,QAAQ;AACvB,SAASC,QAAQ,QAAQ;AACzB,SAASC,QAAQ,QAAQ;AACzB,SAASC,cAAc,QAAQ;AAC/B,SAASC,cAAc,QAAQ;AAM/B,OAAO,SAASC,2BAA2B;EAAEC;AAAW,CAAS;EAC/D,MAAM;IAAEC,SAAS;IAAEC,iBAAiB;IAAEC,eAAe;IAAEC;EAAwB,CAAE,GAC/EX,aAAA;EACF,MAAM;IAAEY;EAAS,CAAE,GAAGT,QAAA;EACtB,MAAM;IAAEU;EAAC,CAAE,GAAGR,cAAA;EAEd,MAAMS,UAAA,GAAahB,KAAA,CAAMiB,WAAW,CAClC,CAAC;IACCC,cAAA,GAAiBT,WAAW,CAAC,EAAE,CAACU,IAAI;IACpCC;EAAK,CACyC,GAAG,CAAC,CAAC;IACnDP,wBAAA,CAAyBJ,WAAA,CAAYY,GAAG,CAAC,CAAC;MAAEF;IAAI,CAAE,KAAKA,IAAA;IACvDR,iBAAA,CAAkBO,cAAA;IAClBN,eAAA,CAAgBQ,KAAA;IAChBN,SAAA,CAAUJ,SAAA;EACZ,GACA,CACED,WAAA,EACAC,SAAA,EACAI,SAAA,EACAH,iBAAA,EACAC,eAAA,EACAC,wBAAA,CACD;EAGH,MAAMS,MAAA,GAAStB,KAAA,CAAMiB,WAAW,CAC7BG,OAAA;IACC,MAAMG,qBAAA,GAAwBd,WAAA,CAAYe,MAAM,CAAC,CAAC;MAAEC;IAAS,CAAE,KAC7DC,KAAA,CAAMC,IAAI,CAACP,OAAA,EAAOQ,KAAK,CACpBC,IAAA,IAAS,CAACJ,SAAA,EAAWK,MAAA,IAAU/B,gBAAA,CAAiB8B,IAAA,CAAKE,IAAI,EAAEN,SAAA;IAIhE,IAAI,CAACF,qBAAA,CAAsBO,MAAM,EAAE;MACjC7B,KAAA,CAAM+B,KAAK,CAACjB,CAAA,CAAE;MACd;IACF;IAEAC,UAAA,CAAW;MAAEE,cAAA,EAAgBK,qBAAqB,CAAC,EAAE,CAACJ,IAAI;MAAEC,KAAA,EAAAA;IAAM;EACpE,GACA,CAACX,WAAA,EAAaO,UAAA,EAAYD,CAAA,CAAE;EAG9B,oBACEkB,KAAA,CAAC7B,QAAA;IACC8B,SAAA,EAAU;IACVC,WAAA,EAAa;IACbC,aAAa;IACbC,QAAA,EAAUf,MAAA;4BAEVW,KAAA,CAAC;MAAIC,SAAA,EAAU;8BACbI,IAAA,CAAC;QAAK,eAAY;QAAOJ,SAAA,EAAU;kBACjC,aAAAI,IAAA,CAAChC,cAAA;uBAEHgC,IAAA,CAAC;QAAEJ,SAAA,EAAU;kBACVnB,CAAA,CAAE;uBAELuB,IAAA,CAACnC,MAAA;QAAOoC,WAAA,EAAY;QAAYC,OAAA,EAASA,CAAA,KAAMxB,UAAA;QAAcyB,IAAA,EAAK;kBAC/D1B,CAAA,CAAE;;qBAGPuB,IAAA,CAAC;MAAEJ,SAAA,EAAU;gBACVnB,CAAA,CAAE;;;AAIX","ignoreList":[]}

package/dist/widgets/UploadDropzone/index.css

@@ -1,50 +1,80 @@
 @layer payload-default {
-  .upload-dropzone-widget {
+  .card.upload-dropzone-widget {
+    min-height: calc(var(--spacer-6) * 5);
     padding: var(--spacer-2);
-    border: var(--stroke-width-small) solid var(--color-border);
     border-radius: var(--radius-large);
+    background: var(--color-bg);
   }
-  .upload-dropzone-widget .upload-dropzone-widget__zone {
+
+  .card.upload-dropzone-widget .upload-dropzone-widget__dropzone {
     display: flex;
-    flex-direction: column;
+    flex: 1 1 auto;
     align-items: center;
     justify-content: center;
-    gap: var(--spacer-3);
-    min-block-size: calc(var(--spacer-6) * 4.5);
+    min-height: 0;
     padding: var(--spacer-4) var(--spacer-3);
     border: var(--stroke-width-small) dashed var(--color-border);
     border-radius: var(--radius-medium);
     background: var(--color-bg);
     text-align: center;
+
+    &:hover {
+      background: var(--color-bg);
+    }
+
+    &.dragging {
+      border-color: var(--color-border-selected);
+      background: var(--color-bg-selected);
+    }
+  }
+
+  .upload-dropzone-widget__content {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: var(--spacer-3);
   }
+
   .upload-dropzone-widget__icon {
-    inline-size: var(--spacer-6);
-    block-size: var(--spacer-6);
     display: flex;
     align-items: center;
     justify-content: center;
-    background: var(--color-bg-selected);
-    color: var(--color-text-brand);
+    width: var(--spacer-6);
+    height: var(--spacer-6);
     border-radius: var(--radius-full);
+    background: var(--color-bg-selected);
+    color: var(--color-icon-brand);
   }
-  .upload-dropzone-widget p {
+
+  .upload-dropzone-widget__description,
+  .upload-dropzone-widget__drag-message,
+  .upload-dropzone-widget__message {
     margin: 0;
-    color: var(--color-text-secondary);
+    font-family: var(--text-body-medium-font-family);
     font-size: var(--text-body-medium-font-size);
     line-height: var(--text-body-medium-line-height);
   }
-  .upload-dropzone-widget__drag {
-    display: none;
+
+  .upload-dropzone-widget__description,
+  .upload-dropzone-widget__drag-message {
+    color: color-mix(in srgb, var(--color-text-secondary) 91%, var(--color-text) 9%);
   }
-  .upload-dropzone-widget .dragging {
-    background: var(--color-bg-selected);
-    border-color: var(--color-border-brand);
-  }
-  .upload-dropzone-widget .dragging .upload-dropzone-widget__drag {
-    display: block;
+
+  .upload-dropzone-widget__message {
+    color: var(--color-text);
   }
-  .upload-dropzone-widget .dragging .upload-dropzone-widget__prompt,
-  .upload-dropzone-widget .dragging .btn {
+
+  .upload-dropzone-widget__drag-message {
     display: none;
   }
+
+  .upload-dropzone-widget__dropzone.dragging {
+    .upload-dropzone-widget__content {
+      display: none;
+    }
+
+    .upload-dropzone-widget__drag-message {
+      display: block;
+    }
+  }
 }

package/dist/widgets/UploadDropzone/index.d.ts

@@ -1,8 +1,12 @@
-import type { WidgetServerProps } from 'payload';
+import type { CollectionSlug, WidgetServerProps } from 'payload';
 import React from 'react';
-export declare function UploadDropzoneWidget({ req, widgetData, }: WidgetServerProps<{
-    data?: {
-        collection?: string;
-    };
-}>): Promise<React.JSX.Element>;
+import '../../elements/Card/index.css';
+import './index.css';
+type UploadDropzoneWidgetData = {
+    excludedCollections?: CollectionSlug[];
+};
+export declare function UploadDropzoneWidget({ permissions, req, widgetData, }: WidgetServerProps<{
+    data?: UploadDropzoneWidgetData;
+}>): React.JSX.Element;
+export {};
 //# sourceMappingURL=index.d.ts.map

package/dist/widgets/UploadDropzone/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/widgets/UploadDropzone/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAGhD,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,wBAAsB,oBAAoB,CAAC,EACzC,GAAG,EACH,UAAU,GACX,EAAE,iBAAiB,CAAC;IAAE,IAAI,CAAC,EAAE;QAAE,UAAU,CAAC,EAAE,MAAM,CAAA;KAAE,CAAA;CAAE,CAAC,8BAsBvD"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/widgets/UploadDropzone/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAGhE,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,+BAA+B,CAAA;AACtC,OAAO,aAAa,CAAA;AAEpB,KAAK,wBAAwB,GAAG;IAC9B,mBAAmB,CAAC,EAAE,cAAc,EAAE,CAAA;CACvC,CAAA;AAED,wBAAgB,oBAAoB,CAAC,EACnC,WAAW,EACX,GAAG,EACH,UAAU,GACX,EAAE,iBAAiB,CAAC;IAAE,IAAI,CAAC,EAAE,wBAAwB,CAAA;CAAE,CAAC,qBAiDxD"}

package/dist/widgets/UploadDropzone/index.js

@@ -1,29 +1,58 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { getAccessResults } from 'payload';
+import { isEntityHidden } from 'payload';
 import React from 'react';
-// eslint-disable-next-line payload/no-imports-from-exports-dir -- Server component must reference the client bundle.
+// eslint-disable-next-line payload/no-imports-from-exports-dir -- Server component must reference exports dir for proper client boundary
 import { UploadDropzoneWidgetClient } from '../../exports/client/index.js';
-import { getVisibleEntities } from '../../utilities/getVisibleEntities.js';
-export async function UploadDropzoneWidget({
+import '../../elements/Card/index.css';
+import './index.css';
+export function UploadDropzoneWidget({
+  permissions,
   req,
   widgetData
 }) {
-  if (!req.user) {
-    return null;
+  const {
+    i18n,
+    payload
+  } = req;
+  const uploadCollections = Object.values(payload.collections).map(({
+    config
+  }) => config).filter(collection => collection.upload && collection.upload.bulkUpload !== false && !isEntityHidden({
+    hidden: collection.admin?.hidden,
+    user: req.user
+  }));
+  const excludedCollections = new Set(widgetData?.excludedCollections ?? []);
+  const selectedCollections = uploadCollections.filter(collection => !excludedCollections.has(collection.slug));
+  const permittedCollections = selectedCollections.filter(collection => permissions?.collections?.[collection.slug]?.create);
+  const title = i18n.t('dashboard:widgetUploadFiles');
+  if (!selectedCollections.length) {
+    return /*#__PURE__*/_jsx("section", {
+      "aria-label": title,
+      className: "card upload-dropzone-widget",
+      children: /*#__PURE__*/_jsx("p", {
+        className: "upload-dropzone-widget__message",
+        children: i18n.t('dashboard:widgetCollectionRequired')
+      })
+    });
   }
-  const collectionSlug = widgetData?.collection;
-  const collection = req.payload.collections[collectionSlug]?.config;
-  const permissions = await getAccessResults({
-    req
-  });
-  if (!collection?.upload || collection.upload.bulkUpload === false || !getVisibleEntities({
-    req
-  }).collections.includes(collectionSlug) || !permissions.collections?.[collectionSlug]?.create || !permissions.canAccessAdmin) {
-    return null;
+  if (!permittedCollections.length) {
+    return /*#__PURE__*/_jsx("section", {
+      "aria-label": title,
+      className: "card upload-dropzone-widget",
+      children: /*#__PURE__*/_jsx("p", {
+        className: "upload-dropzone-widget__message",
+        children: i18n.t('error:notAllowedToPerformAction')
+      })
+    });
   }
-  return /*#__PURE__*/_jsx(UploadDropzoneWidgetClient, {
-    collectionSlug: collectionSlug,
-    mimeTypes: collection.upload.mimeTypes
+  return /*#__PURE__*/_jsx("section", {
+    "aria-label": title,
+    className: "card upload-dropzone-widget",
+    children: /*#__PURE__*/_jsx(UploadDropzoneWidgetClient, {
+      collections: permittedCollections.map(collection => ({
+        slug: collection.slug,
+        mimeTypes: collection.upload.mimeTypes
+      }))
+    })
   });
 }
 //# sourceMappingURL=index.js.map

package/dist/widgets/UploadDropzone/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["getAccessResults","React","UploadDropzoneWidgetClient","getVisibleEntities","UploadDropzoneWidget","req","widgetData","user","collectionSlug","collection","payload","collections","config","permissions","upload","bulkUpload","includes","create","canAccessAdmin","_jsx","mimeTypes"],"sources":["../../../src/widgets/UploadDropzone/index.tsx"],"sourcesContent":["import type { WidgetServerProps } from 'payload'\n\nimport { getAccessResults } from 'payload'\nimport React from 'react'\n// eslint-disable-next-line payload/no-imports-from-exports-dir -- Server component must reference the client bundle.\nimport { UploadDropzoneWidgetClient } from '../../exports/client/index.js'\nimport { getVisibleEntities } from '../../utilities/getVisibleEntities.js'\n\nexport async function UploadDropzoneWidget({\n  req,\n  widgetData,\n}: WidgetServerProps<{ data?: { collection?: string } }>) {\n  if (!req.user) {\n    return null\n  }\n  const collectionSlug = widgetData?.collection\n  const collection = req.payload.collections[collectionSlug]?.config\n  const permissions = await getAccessResults({ req })\n  if (\n    !collection?.upload ||\n    collection.upload.bulkUpload === false ||\n    !getVisibleEntities({ req }).collections.includes(collectionSlug) ||\n    !permissions.collections?.[collectionSlug]?.create ||\n    !permissions.canAccessAdmin\n  ) {\n    return null\n  }\n  return (\n    <UploadDropzoneWidgetClient\n      collectionSlug={collectionSlug}\n      mimeTypes={collection.upload.mimeTypes}\n    />\n  )\n}\n"],"mappings":";AAEA,SAASA,gBAAgB,QAAQ;AACjC,OAAOC,KAAA,MAAW;AAClB;AACA,SAASC,0BAA0B,QAAQ;AAC3C,SAASC,kBAAkB,QAAQ;AAEnC,OAAO,eAAeC,qBAAqB;EACzCC,GAAG;EACHC;AAAU,CAC4C;EACtD,IAAI,CAACD,GAAA,CAAIE,IAAI,EAAE;IACb,OAAO;EACT;EACA,MAAMC,cAAA,GAAiBF,UAAA,EAAYG,UAAA;EACnC,MAAMA,UAAA,GAAaJ,GAAA,CAAIK,OAAO,CAACC,WAAW,CAACH,cAAA,CAAe,EAAEI,MAAA;EAC5D,MAAMC,WAAA,GAAc,MAAMb,gBAAA,CAAiB;IAAEK;EAAI;EACjD,IACE,CAACI,UAAA,EAAYK,MAAA,IACbL,UAAA,CAAWK,MAAM,CAACC,UAAU,KAAK,SACjC,CAACZ,kBAAA,CAAmB;IAAEE;EAAI,GAAGM,WAAW,CAACK,QAAQ,CAACR,cAAA,KAClD,CAACK,WAAA,CAAYF,WAAW,GAAGH,cAAA,CAAe,EAAES,MAAA,IAC5C,CAACJ,WAAA,CAAYK,cAAc,EAC3B;IACA,OAAO;EACT;EACA,oBACEC,IAAA,CAACjB,0BAAA;IACCM,cAAA,EAAgBA,cAAA;IAChBY,SAAA,EAAWX,UAAA,CAAWK,MAAM,CAACM;;AAGnC","ignoreList":[]}
+{"version":3,"file":"index.js","names":["isEntityHidden","React","UploadDropzoneWidgetClient","UploadDropzoneWidget","permissions","req","widgetData","i18n","payload","uploadCollections","Object","values","collections","map","config","filter","collection","upload","bulkUpload","hidden","admin","user","excludedCollections","Set","selectedCollections","has","slug","permittedCollections","create","title","t","length","_jsx","className","mimeTypes"],"sources":["../../../src/widgets/UploadDropzone/index.tsx"],"sourcesContent":["import type { CollectionSlug, WidgetServerProps } from 'payload'\n\nimport { isEntityHidden } from 'payload'\nimport React from 'react'\n\n// eslint-disable-next-line payload/no-imports-from-exports-dir -- Server component must reference exports dir for proper client boundary\nimport { UploadDropzoneWidgetClient } from '../../exports/client/index.js'\nimport '../../elements/Card/index.css'\nimport './index.css'\n\ntype UploadDropzoneWidgetData = {\n  excludedCollections?: CollectionSlug[]\n}\n\nexport function UploadDropzoneWidget({\n  permissions,\n  req,\n  widgetData,\n}: WidgetServerProps<{ data?: UploadDropzoneWidgetData }>) {\n  const { i18n, payload } = req\n  const uploadCollections = Object.values(payload.collections)\n    .map(({ config }) => config)\n    .filter(\n      (collection) =>\n        collection.upload &&\n        collection.upload.bulkUpload !== false &&\n        !isEntityHidden({ hidden: collection.admin?.hidden, user: req.user }),\n    )\n  const excludedCollections = new Set(widgetData?.excludedCollections ?? [])\n  const selectedCollections = uploadCollections.filter(\n    (collection) => !excludedCollections.has(collection.slug),\n  )\n  const permittedCollections = selectedCollections.filter(\n    (collection) => permissions?.collections?.[collection.slug]?.create,\n  )\n  const title = i18n.t('dashboard:widgetUploadFiles')\n\n  if (!selectedCollections.length) {\n    return (\n      <section aria-label={title} className=\"card upload-dropzone-widget\">\n        <p className=\"upload-dropzone-widget__message\">\n          {i18n.t('dashboard:widgetCollectionRequired')}\n        </p>\n      </section>\n    )\n  }\n\n  if (!permittedCollections.length) {\n    return (\n      <section aria-label={title} className=\"card upload-dropzone-widget\">\n        <p className=\"upload-dropzone-widget__message\">\n          {i18n.t('error:notAllowedToPerformAction')}\n        </p>\n      </section>\n    )\n  }\n\n  return (\n    <section aria-label={title} className=\"card upload-dropzone-widget\">\n      <UploadDropzoneWidgetClient\n        collections={permittedCollections.map((collection) => ({\n          slug: collection.slug,\n          mimeTypes: collection.upload.mimeTypes,\n        }))}\n      />\n    </section>\n  )\n}\n"],"mappings":";AAEA,SAASA,cAAc,QAAQ;AAC/B,OAAOC,KAAA,MAAW;AAElB;AACA,SAASC,0BAA0B,QAAQ;AAC3C,OAAO;AACP,OAAO;AAMP,OAAO,SAASC,qBAAqB;EACnCC,WAAW;EACXC,GAAG;EACHC;AAAU,CAC6C;EACvD,MAAM;IAAEC,IAAI;IAAEC;EAAO,CAAE,GAAGH,GAAA;EAC1B,MAAMI,iBAAA,GAAoBC,MAAA,CAAOC,MAAM,CAACH,OAAA,CAAQI,WAAW,EACxDC,GAAG,CAAC,CAAC;IAAEC;EAAM,CAAE,KAAKA,MAAA,EACpBC,MAAM,CACJC,UAAA,IACCA,UAAA,CAAWC,MAAM,IACjBD,UAAA,CAAWC,MAAM,CAACC,UAAU,KAAK,SACjC,CAAClB,cAAA,CAAe;IAAEmB,MAAA,EAAQH,UAAA,CAAWI,KAAK,EAAED,MAAA;IAAQE,IAAA,EAAMhB,GAAA,CAAIgB;EAAK;EAEzE,MAAMC,mBAAA,GAAsB,IAAIC,GAAA,CAAIjB,UAAA,EAAYgB,mBAAA,IAAuB,EAAE;EACzE,MAAME,mBAAA,GAAsBf,iBAAA,CAAkBM,MAAM,CACjDC,UAAA,IAAe,CAACM,mBAAA,CAAoBG,GAAG,CAACT,UAAA,CAAWU,IAAI;EAE1D,MAAMC,oBAAA,GAAuBH,mBAAA,CAAoBT,MAAM,CACpDC,UAAA,IAAeZ,WAAA,EAAaQ,WAAA,GAAcI,UAAA,CAAWU,IAAI,CAAC,EAAEE,MAAA;EAE/D,MAAMC,KAAA,GAAQtB,IAAA,CAAKuB,CAAC,CAAC;EAErB,IAAI,CAACN,mBAAA,CAAoBO,MAAM,EAAE;IAC/B,oBACEC,IAAA,CAAC;MAAQ,cAAYH,KAAA;MAAOI,SAAA,EAAU;gBACpC,aAAAD,IAAA,CAAC;QAAEC,SAAA,EAAU;kBACV1B,IAAA,CAAKuB,CAAC,CAAC;;;EAIhB;EAEA,IAAI,CAACH,oBAAA,CAAqBI,MAAM,EAAE;IAChC,oBACEC,IAAA,CAAC;MAAQ,cAAYH,KAAA;MAAOI,SAAA,EAAU;gBACpC,aAAAD,IAAA,CAAC;QAAEC,SAAA,EAAU;kBACV1B,IAAA,CAAKuB,CAAC,CAAC;;;EAIhB;EAEA,oBACEE,IAAA,CAAC;IAAQ,cAAYH,KAAA;IAAOI,SAAA,EAAU;cACpC,aAAAD,IAAA,CAAC9B,0BAAA;MACCU,WAAA,EAAae,oBAAA,CAAqBd,GAAG,CAAEG,UAAA,KAAgB;QACrDU,IAAA,EAAMV,UAAA,CAAWU,IAAI;QACrBQ,SAAA,EAAWlB,UAAA,CAAWC,MAAM,CAACiB;MAC/B;;;AAIR","ignoreList":[]}

package/dist/widgets/Welcome/getWelcomeDisplay.d.ts

@@ -0,0 +1,7 @@
+type GetWelcomeDisplayArgs = {
+    useAsTitle?: string;
+    user?: null | object;
+};
+export declare function getWelcomeDisplay({ useAsTitle, user }: GetWelcomeDisplayArgs): string | undefined;
+export {};
+//# sourceMappingURL=getWelcomeDisplay.d.ts.map

package/dist/widgets/Welcome/getWelcomeDisplay.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getWelcomeDisplay.d.ts","sourceRoot":"","sources":["../../../src/widgets/Welcome/getWelcomeDisplay.ts"],"names":[],"mappings":"AAAA,KAAK,qBAAqB,GAAG;IAC3B,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,IAAI,CAAC,EAAE,IAAI,GAAG,MAAM,CAAA;CACrB,CAAA;AAcD,wBAAgB,iBAAiB,CAAC,EAAE,UAAU,EAAE,IAAI,EAAE,EAAE,qBAAqB,GAAG,MAAM,GAAG,SAAS,CAQjG"}

package/dist/widgets/Welcome/getWelcomeDisplay.js

@@ -0,0 +1,21 @@
+const getDisplayString = value => {
+  if (typeof value === 'string') {
+    return value.trim() || undefined;
+  }
+  if (typeof value === 'number' && Number.isFinite(value)) {
+    return String(value);
+  }
+  return undefined;
+};
+export function getWelcomeDisplay({
+  useAsTitle,
+  user
+}) {
+  const userData = user;
+  const email = getDisplayString(userData?.email);
+  const username = getDisplayString(userData?.username);
+  const userID = getDisplayString(userData?.id);
+  const title = useAsTitle ? getDisplayString(userData?.[useAsTitle]) : undefined;
+  return title ?? username ?? email ?? userID;
+}
+//# sourceMappingURL=getWelcomeDisplay.js.map

package/dist/widgets/Welcome/getWelcomeDisplay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getWelcomeDisplay.js","names":["getDisplayString","value","trim","undefined","Number","isFinite","String","getWelcomeDisplay","useAsTitle","user","userData","email","username","userID","id","title"],"sources":["../../../src/widgets/Welcome/getWelcomeDisplay.ts"],"sourcesContent":["type GetWelcomeDisplayArgs = {\n  useAsTitle?: string\n  user?: null | object\n}\n\nconst getDisplayString = (value: unknown): string | undefined => {\n  if (typeof value === 'string') {\n    return value.trim() || undefined\n  }\n\n  if (typeof value === 'number' && Number.isFinite(value)) {\n    return String(value)\n  }\n\n  return undefined\n}\n\nexport function getWelcomeDisplay({ useAsTitle, user }: GetWelcomeDisplayArgs): string | undefined {\n  const userData = user as null | Record<string, unknown> | undefined\n  const email = getDisplayString(userData?.email)\n  const username = getDisplayString(userData?.username)\n  const userID = getDisplayString(userData?.id)\n  const title = useAsTitle ? getDisplayString(userData?.[useAsTitle]) : undefined\n\n  return title ?? username ?? email ?? userID\n}\n"],"mappings":"AAKA,MAAMA,gBAAA,GAAoBC,KAAA;EACxB,IAAI,OAAOA,KAAA,KAAU,UAAU;IAC7B,OAAOA,KAAA,CAAMC,IAAI,MAAMC,SAAA;EACzB;EAEA,IAAI,OAAOF,KAAA,KAAU,YAAYG,MAAA,CAAOC,QAAQ,CAACJ,KAAA,GAAQ;IACvD,OAAOK,MAAA,CAAOL,KAAA;EAChB;EAEA,OAAOE,SAAA;AACT;AAEA,OAAO,SAASI,kBAAkB;EAAEC,UAAU;EAAEC;AAAI,CAAyB;EAC3E,MAAMC,QAAA,GAAWD,IAAA;EACjB,MAAME,KAAA,GAAQX,gBAAA,CAAiBU,QAAA,EAAUC,KAAA;EACzC,MAAMC,QAAA,GAAWZ,gBAAA,CAAiBU,QAAA,EAAUE,QAAA;EAC5C,MAAMC,MAAA,GAASb,gBAAA,CAAiBU,QAAA,EAAUI,EAAA;EAC1C,MAAMC,KAAA,GAAQP,UAAA,GAAaR,gBAAA,CAAiBU,QAAA,GAAWF,UAAA,CAAW,IAAIL,SAAA;EAEtE,OAAOY,KAAA,IAASH,QAAA,IAAYD,KAAA,IAASE,MAAA;AACvC","ignoreList":[]}

package/dist/widgets/Welcome/index.css

@@ -1,13 +1,25 @@
 @layer payload-default {
   .welcome-widget {
-    margin: 0;
-    padding-block-start: var(--spacer-1);
-    font-family: var(--text-heading-large-font-family);
-    font-size: var(--text-heading-large-font-size);
-    font-weight: var(--text-heading-large-font-weight);
-    line-height: var(--text-heading-large-line-height);
-    letter-spacing: var(--text-heading-large-letter-spacing);
-    color: var(--color-text);
     overflow-wrap: anywhere;
+    padding-block: var(--spacer-2);
+  }
+
+  .welcome-widget__heading {
+    color: var(--color-text);
+    font-size: var(--text-heading-xl-font-size);
+    font-weight: var(--text-heading-xl-font-weight);
+    line-height: var(--text-heading-xl-line-height);
+    letter-spacing: var(--text-heading-xl-letter-spacing);
+    min-height: var(--spacer-5);
+    margin-block: 0;
+  }
+
+  .widget-wrapper--editing .welcome-widget {
+    padding-inline-end: calc(var(--spacer-6) + var(--spacer-3));
+  }
+
+  .widget-wrapper:has(.welcome-widget) .widget-wrapper__controls {
+    inset-block-start: 50%;
+    transform: translateY(-50%);
   }
 }

package/dist/widgets/Welcome/index.d.ts

@@ -1,5 +1,5 @@
 import type { WidgetServerProps } from 'payload';
 import React from 'react';
 import './index.css';
-export declare function WelcomeWidget({ req: { i18n, payload, user } }: WidgetServerProps): React.JSX.Element;
+export declare function WelcomeWidget({ req, user }: WidgetServerProps): React.JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/dist/widgets/Welcome/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/widgets/Welcome/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAEhD,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,aAAa,CAAA;AAEpB,wBAAgB,aAAa,CAAC,EAAE,GAAG,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE,EAAE,iBAAiB,qBAehF"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/widgets/Welcome/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAEhD,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,aAAa,CAAA;AAEpB,wBAAgB,aAAa,CAAC,EAAE,GAAG,EAAE,IAAI,EAAE,EAAE,iBAAiB,qBAkB7D"}

package/dist/widgets/Welcome/index.js

@@ -1,26 +1,25 @@
-import { jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
-import { getValueAtPath } from '../RecentlyViewed/getDocumentThumbnail.js';
+import { getWelcomeDisplay } from './getWelcomeDisplay.js';
 import './index.css';
 export function WelcomeWidget({
-  req: {
-    i18n,
-    payload,
-    user
-  }
+  req,
+  user
 }) {
-  if (!user) {
-    return null;
-  }
-  const collection = payload.collections[user.collection]?.config;
-  const title = collection?.admin.useAsTitle ? getValueAtPath({
-    path: collection.admin.useAsTitle,
-    value: user
-  }) : undefined;
-  const name = typeof title === 'string' && title || user.username || user.email || String(user.id);
-  return /*#__PURE__*/_jsxs("h1", {
+  const userCollection = req.payload.config.collections.find(({
+    slug
+  }) => slug === req.payload.config.admin.user);
+  const displayName = getWelcomeDisplay({
+    useAsTitle: userCollection?.admin.useAsTitle,
+    user
+  });
+  const welcome = req.i18n.t('general:welcome');
+  return /*#__PURE__*/_jsx("section", {
     className: "welcome-widget",
-    children: [i18n.t('general:welcome'), ", ", name]
+    children: /*#__PURE__*/_jsxs("h1", {
+      className: "welcome-widget__heading",
+      children: [welcome, displayName ? `, ${displayName}` : '']
+    })
   });
 }
 //# sourceMappingURL=index.js.map

package/dist/widgets/Welcome/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","getValueAtPath","WelcomeWidget","req","i18n","payload","user","collection","collections","config","title","admin","useAsTitle","path","value","undefined","name","username","email","String","id","_jsxs","className","t"],"sources":["../../../src/widgets/Welcome/index.tsx"],"sourcesContent":["import type { WidgetServerProps } from 'payload'\n\nimport React from 'react'\n\nimport { getValueAtPath } from '../RecentlyViewed/getDocumentThumbnail.js'\nimport './index.css'\n\nexport function WelcomeWidget({ req: { i18n, payload, user } }: WidgetServerProps) {\n  if (!user) {\n    return null\n  }\n  const collection = payload.collections[user.collection]?.config\n  const title = collection?.admin.useAsTitle\n    ? getValueAtPath({ path: collection.admin.useAsTitle, value: user })\n    : undefined\n  const name =\n    (typeof title === 'string' && title) || user.username || user.email || String(user.id)\n  return (\n    <h1 className=\"welcome-widget\">\n      {i18n.t('general:welcome')}, {name}\n    </h1>\n  )\n}\n"],"mappings":";AAEA,OAAOA,KAAA,MAAW;AAElB,SAASC,cAAc,QAAQ;AAC/B,OAAO;AAEP,OAAO,SAASC,cAAc;EAAEC,GAAA,EAAK;IAAEC,IAAI;IAAEC,OAAO;IAAEC;EAAI;AAAE,CAAqB;EAC/E,IAAI,CAACA,IAAA,EAAM;IACT,OAAO;EACT;EACA,MAAMC,UAAA,GAAaF,OAAA,CAAQG,WAAW,CAACF,IAAA,CAAKC,UAAU,CAAC,EAAEE,MAAA;EACzD,MAAMC,KAAA,GAAQH,UAAA,EAAYI,KAAA,CAAMC,UAAA,GAC5BX,cAAA,CAAe;IAAEY,IAAA,EAAMN,UAAA,CAAWI,KAAK,CAACC,UAAU;IAAEE,KAAA,EAAOR;EAAK,KAChES,SAAA;EACJ,MAAMC,IAAA,GACJ,OAAQN,KAAA,KAAU,YAAYA,KAAA,IAAUJ,IAAA,CAAKW,QAAQ,IAAIX,IAAA,CAAKY,KAAK,IAAIC,MAAA,CAAOb,IAAA,CAAKc,EAAE;EACvF,oBACEC,KAAA,CAAC;IAAGC,SAAA,EAAU;eACXlB,IAAA,CAAKmB,CAAC,CAAC,oBAAmB,MAAGP,IAAA;;AAGpC","ignoreList":[]}
+{"version":3,"file":"index.js","names":["React","getWelcomeDisplay","WelcomeWidget","req","user","userCollection","payload","config","collections","find","slug","admin","displayName","useAsTitle","welcome","i18n","t","_jsx","className","_jsxs"],"sources":["../../../src/widgets/Welcome/index.tsx"],"sourcesContent":["import type { WidgetServerProps } from 'payload'\n\nimport React from 'react'\n\nimport { getWelcomeDisplay } from './getWelcomeDisplay.js'\nimport './index.css'\n\nexport function WelcomeWidget({ req, user }: WidgetServerProps) {\n  const userCollection = req.payload.config.collections.find(\n    ({ slug }) => slug === req.payload.config.admin.user,\n  )\n  const displayName = getWelcomeDisplay({\n    useAsTitle: userCollection?.admin.useAsTitle,\n    user,\n  })\n  const welcome = req.i18n.t('general:welcome')\n\n  return (\n    <section className=\"welcome-widget\">\n      <h1 className=\"welcome-widget__heading\">\n        {welcome}\n        {displayName ? `, ${displayName}` : ''}\n      </h1>\n    </section>\n  )\n}\n"],"mappings":";AAEA,OAAOA,KAAA,MAAW;AAElB,SAASC,iBAAiB,QAAQ;AAClC,OAAO;AAEP,OAAO,SAASC,cAAc;EAAEC,GAAG;EAAEC;AAAI,CAAqB;EAC5D,MAAMC,cAAA,GAAiBF,GAAA,CAAIG,OAAO,CAACC,MAAM,CAACC,WAAW,CAACC,IAAI,CACxD,CAAC;IAAEC;EAAI,CAAE,KAAKA,IAAA,KAASP,GAAA,CAAIG,OAAO,CAACC,MAAM,CAACI,KAAK,CAACP,IAAI;EAEtD,MAAMQ,WAAA,GAAcX,iBAAA,CAAkB;IACpCY,UAAA,EAAYR,cAAA,EAAgBM,KAAA,CAAME,UAAA;IAClCT;EACF;EACA,MAAMU,OAAA,GAAUX,GAAA,CAAIY,IAAI,CAACC,CAAC,CAAC;EAE3B,oBACEC,IAAA,CAAC;IAAQC,SAAA,EAAU;cACjB,aAAAC,KAAA,CAAC;MAAGD,SAAA,EAAU;iBACXJ,OAAA,EACAF,WAAA,GAAc,KAAKA,WAAA,EAAa,GAAG;;;AAI5C","ignoreList":[]}