@payloadcms/ui 3.0.0-canary.d894ac7 → 3.0.0-canary.dc8b1fe

package/dist/elements/Dropzone/index.js

@@ -1,168 +1,82 @@
 'use client';
 
-import { c as _c } from "react/compiler-runtime";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
-import { useTranslation } from '../../providers/Translation/index.js';
-import { Button } from '../Button/index.js';
 import './index.scss';
 const handleDragOver = e => {
   e.preventDefault();
   e.stopPropagation();
 };
 const baseClass = 'dropzone';
-export const Dropzone = t0 => {
-  const $ = _c(14);
-  const {
-    className,
-    mimeTypes,
-    multipleFiles,
-    onChange,
-    onPasteUrlClick
-  } = t0;
+export function Dropzone({
+  children,
+  className,
+  disabled = false,
+  dropzoneStyle = 'default',
+  multipleFiles,
+  onChange
+}) {
   const dropRef = React.useRef(null);
   const [dragging, setDragging] = React.useState(false);
-  const inputRef = React.useRef(null);
-  const {
-    t
-  } = useTranslation();
-  let t1;
-  if ($[0] !== onChange) {
-    t1 = e => {
-      e.preventDefault();
-      e.stopPropagation();
-      if (e.clipboardData.files && e.clipboardData.files.length > 0) {
-        onChange(e.clipboardData.files);
-      }
-    };
-    $[0] = onChange;
-    $[1] = t1;
-  } else {
-    t1 = $[1];
-  }
-  const handlePaste = t1;
-  let t2;
-  if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
-    t2 = e_0 => {
-      e_0.preventDefault();
-      e_0.stopPropagation();
-      setDragging(true);
-    };
-    $[2] = t2;
-  } else {
-    t2 = $[2];
-  }
-  const handleDragEnter = t2;
-  let t3;
-  if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
-    t3 = e_1 => {
-      e_1.preventDefault();
-      e_1.stopPropagation();
-      setDragging(false);
-    };
-    $[3] = t3;
-  } else {
-    t3 = $[3];
-  }
-  const handleDragLeave = t3;
-  let t4;
-  if ($[4] !== onChange) {
-    t4 = e_2 => {
-      e_2.preventDefault();
-      e_2.stopPropagation();
+  const addFiles = React.useCallback(files => {
+    if (!multipleFiles && files.length > 1) {
+      const dataTransfer = new DataTransfer();
+      dataTransfer.items.add(files[0]);
+      onChange(dataTransfer.files);
+    } else {
+      onChange(files);
+    }
+  }, [multipleFiles, onChange]);
+  const handlePaste = React.useCallback(e => {
+    e.preventDefault();
+    e.stopPropagation();
+    if (e.clipboardData.files && e.clipboardData.files.length > 0) {
+      addFiles(e.clipboardData.files);
+    }
+  }, [addFiles]);
+  const handleDragEnter = React.useCallback(e_0 => {
+    e_0.preventDefault();
+    e_0.stopPropagation();
+    setDragging(true);
+  }, []);
+  const handleDragLeave = React.useCallback(e_1 => {
+    e_1.preventDefault();
+    e_1.stopPropagation();
+    setDragging(false);
+  }, []);
+  const handleDrop = React.useCallback(e_2 => {
+    e_2.preventDefault();
+    e_2.stopPropagation();
+    setDragging(false);
+    if (e_2.dataTransfer.files && e_2.dataTransfer.files.length > 0) {
+      addFiles(e_2.dataTransfer.files);
       setDragging(false);
-      if (e_2.dataTransfer.files && e_2.dataTransfer.files.length > 0) {
-        onChange(e_2.dataTransfer.files);
-        setDragging(false);
-        e_2.dataTransfer.clearData();
-      }
-    };
-    $[4] = onChange;
-    $[5] = t4;
-  } else {
-    t4 = $[5];
-  }
-  const handleDrop = t4;
-  let t5;
-  if ($[6] !== onChange) {
-    t5 = e_3 => {
-      if (e_3.target.files && e_3.target.files.length > 0) {
-        onChange(e_3.target.files);
-      }
-    };
-    $[6] = onChange;
-    $[7] = t5;
-  } else {
-    t5 = $[7];
-  }
-  const handleFileSelection = t5;
-  let t6;
-  if ($[8] !== handleDrop || $[9] !== handlePaste) {
-    t6 = [handleDragEnter, handleDragLeave, handleDrop, handlePaste];
-    $[8] = handleDrop;
-    $[9] = handlePaste;
-    $[10] = t6;
-  } else {
-    t6 = $[10];
-  }
+      e_2.dataTransfer.clearData();
+    }
+  }, [addFiles]);
   React.useEffect(() => {
     const div = dropRef.current;
-    if (div) {
-      div.addEventListener("dragenter", handleDragEnter);
-      div.addEventListener("dragleave", handleDragLeave);
-      div.addEventListener("dragover", handleDragOver);
-      div.addEventListener("drop", handleDrop);
-      div.addEventListener("paste", handlePaste);
+    if (div && !disabled) {
+      div.addEventListener('dragenter', handleDragEnter);
+      div.addEventListener('dragleave', handleDragLeave);
+      div.addEventListener('dragover', handleDragOver);
+      div.addEventListener('drop', handleDrop);
+      div.addEventListener('paste', handlePaste);
       return () => {
-        div.removeEventListener("dragenter", handleDragEnter);
-        div.removeEventListener("dragleave", handleDragLeave);
-        div.removeEventListener("dragover", handleDragOver);
-        div.removeEventListener("drop", handleDrop);
-        div.removeEventListener("paste", handlePaste);
+        div.removeEventListener('dragenter', handleDragEnter);
+        div.removeEventListener('dragleave', handleDragLeave);
+        div.removeEventListener('dragover', handleDragOver);
+        div.removeEventListener('drop', handleDrop);
+        div.removeEventListener('paste', handlePaste);
       };
     }
     return () => null;
-  }, t6);
-  const t7 = dragging ? "dragging" : "";
-  let t8;
-  if ($[11] !== className || $[12] !== t7) {
-    t8 = [baseClass, className, t7].filter(Boolean);
-    $[11] = className;
-    $[12] = t7;
-    $[13] = t8;
-  } else {
-    t8 = $[13];
-  }
-  const classes = t8.join(" ");
-  return _jsxs("div", {
+  }, [disabled, handleDragEnter, handleDragLeave, handleDrop, handlePaste]);
+  const classes = [baseClass, className, dragging ? 'dragging' : '', `dropzoneStyle--${dropzoneStyle}`].filter(Boolean).join(' ');
+  return /*#__PURE__*/_jsx("div", {
     className: classes,
     ref: dropRef,
-    children: [_jsx(Button, {
-      buttonStyle: "secondary",
-      className: `${baseClass}__file-button`,
-      onClick: () => {
-        inputRef.current.click();
-      },
-      size: "medium",
-      children: t("upload:selectFile")
-    }), typeof onPasteUrlClick === "function" && _jsx(Button, {
-      buttonStyle: "secondary",
-      className: `${baseClass}__file-button`,
-      onClick: onPasteUrlClick,
-      size: "medium",
-      children: t("upload:pasteURL")
-    }), _jsx("input", {
-      accept: mimeTypes?.join(","),
-      "aria-hidden": "true",
-      className: `${baseClass}__hidden-input`,
-      multiple: multipleFiles,
-      onChange: handleFileSelection,
-      ref: inputRef,
-      type: "file"
-    }), _jsxs("p", {
-      className: `${baseClass}__label`,
-      children: [t("general:or"), " ", t("upload:dragAndDrop")]
-    })]
+    children: children
   });
-};
+}
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","useTranslation","Button","handleDragOver","e","preventDefault","stopPropagation","baseClass","Dropzone","t0","$","className","mimeTypes","multipleFiles","onChange","onPasteUrlClick","dropRef","useRef","dragging","setDragging","useState","inputRef","t","t1","clipboardData","files","length","handlePaste","t2","Symbol","for","e_0","handleDragEnter","t3","e_1","handleDragLeave","t4","e_2","dataTransfer","clearData","handleDrop","t5","e_3","target","handleFileSelection","t6","useEffect","div","current","addEventListener","removeEventListener","t7","t8","filter","Boolean","classes","join","_jsxs","ref","children","_jsx","buttonStyle","onClick","click","size","accept","multiple","type"],"sources":["../../../src/elements/Dropzone/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Button } from '../Button/index.js'\nimport './index.scss'\n\nconst handleDragOver = (e: DragEvent) => {\n  e.preventDefault()\n  e.stopPropagation()\n}\n\nconst baseClass = 'dropzone'\n\nexport type Props = {\n  readonly className?: string\n  readonly mimeTypes?: string[]\n  readonly multipleFiles?: boolean\n  readonly onChange: (e: FileList) => void\n  readonly onPasteUrlClick?: () => void\n}\n\nexport const Dropzone: React.FC<Props> = ({\n  className,\n  mimeTypes,\n  multipleFiles,\n  onChange,\n  onPasteUrlClick,\n}) => {\n  const dropRef = React.useRef<HTMLDivElement>(null)\n  const [dragging, setDragging] = React.useState(false)\n  const inputRef = React.useRef(null)\n\n  const { t } = useTranslation()\n\n  const handlePaste = React.useCallback(\n    (e: ClipboardEvent) => {\n      e.preventDefault()\n      e.stopPropagation()\n\n      if (e.clipboardData.files && e.clipboardData.files.length > 0) {\n        onChange(e.clipboardData.files)\n      }\n    },\n    [onChange],\n  )\n\n  const handleDragEnter = React.useCallback((e: DragEvent) => {\n    e.preventDefault()\n    e.stopPropagation()\n    setDragging(true)\n  }, [])\n\n  const handleDragLeave = React.useCallback((e: DragEvent) => {\n    e.preventDefault()\n    e.stopPropagation()\n    setDragging(false)\n  }, [])\n\n  const handleDrop = React.useCallback(\n    (e: DragEvent) => {\n      e.preventDefault()\n      e.stopPropagation()\n      setDragging(false)\n\n      if (e.dataTransfer.files && e.dataTransfer.files.length > 0) {\n        onChange(e.dataTransfer.files)\n        setDragging(false)\n\n        e.dataTransfer.clearData()\n      }\n    },\n    [onChange],\n  )\n\n  const handleFileSelection = React.useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      if (e.target.files && e.target.files.length > 0) {\n        onChange(e.target.files)\n      }\n    },\n    [onChange],\n  )\n\n  React.useEffect(() => {\n    const div = dropRef.current\n\n    if (div) {\n      div.addEventListener('dragenter', handleDragEnter)\n      div.addEventListener('dragleave', handleDragLeave)\n      div.addEventListener('dragover', handleDragOver)\n      div.addEventListener('drop', handleDrop)\n      div.addEventListener('paste', handlePaste)\n\n      return () => {\n        div.removeEventListener('dragenter', handleDragEnter)\n        div.removeEventListener('dragleave', handleDragLeave)\n        div.removeEventListener('dragover', handleDragOver)\n        div.removeEventListener('drop', handleDrop)\n        div.removeEventListener('paste', handlePaste)\n      }\n    }\n\n    return () => null\n  }, [handleDragEnter, handleDragLeave, handleDrop, handlePaste])\n\n  const classes = [baseClass, className, dragging ? 'dragging' : ''].filter(Boolean).join(' ')\n\n  return (\n    <div className={classes} ref={dropRef}>\n      <Button\n        buttonStyle=\"secondary\"\n        className={`${baseClass}__file-button`}\n        onClick={() => {\n          inputRef.current.click()\n        }}\n        size=\"medium\"\n      >\n        {t('upload:selectFile')}\n      </Button>\n      {typeof onPasteUrlClick === 'function' && (\n        <Button\n          buttonStyle=\"secondary\"\n          className={`${baseClass}__file-button`}\n          onClick={onPasteUrlClick}\n          size=\"medium\"\n        >\n          {t('upload:pasteURL')}\n        </Button>\n      )}\n      <input\n        accept={mimeTypes?.join(',')}\n        aria-hidden=\"true\"\n        className={`${baseClass}__hidden-input`}\n        multiple={multipleFiles}\n        onChange={handleFileSelection}\n        ref={inputRef}\n        type=\"file\"\n      />\n\n      <p className={`${baseClass}__label`}>\n        {t('general:or')} {t('upload:dragAndDrop')}\n      </p>\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["React","handleDragOver","e","preventDefault","stopPropagation","baseClass","Dropzone","children","className","disabled","dropzoneStyle","multipleFiles","onChange","dropRef","useRef","dragging","setDragging","useState","addFiles","useCallback","files","length","dataTransfer","DataTransfer","items","add","handlePaste","clipboardData","handleDragEnter","handleDragLeave","handleDrop","clearData","useEffect","div","current","addEventListener","removeEventListener","classes","filter","Boolean","join","_jsx","ref"],"sources":["../../../src/elements/Dropzone/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport './index.scss'\n\nconst handleDragOver = (e: DragEvent) => {\n  e.preventDefault()\n  e.stopPropagation()\n}\n\nconst baseClass = 'dropzone'\n\nexport type Props = {\n  readonly children?: React.ReactNode\n  readonly className?: string\n  readonly disabled?: boolean\n  readonly dropzoneStyle?: 'default' | 'none'\n  readonly multipleFiles?: boolean\n  readonly onChange: (e: FileList) => void\n}\n\nexport function Dropzone({\n  children,\n  className,\n  disabled = false,\n  dropzoneStyle = 'default',\n  multipleFiles,\n  onChange,\n}: Props) {\n  const dropRef = React.useRef<HTMLDivElement>(null)\n  const [dragging, setDragging] = React.useState(false)\n\n  const addFiles = React.useCallback(\n    (files: FileList) => {\n      if (!multipleFiles && files.length > 1) {\n        const dataTransfer = new DataTransfer()\n        dataTransfer.items.add(files[0])\n        onChange(dataTransfer.files)\n      } else {\n        onChange(files)\n      }\n    },\n    [multipleFiles, onChange],\n  )\n\n  const handlePaste = React.useCallback(\n    (e: ClipboardEvent) => {\n      e.preventDefault()\n      e.stopPropagation()\n\n      if (e.clipboardData.files && e.clipboardData.files.length > 0) {\n        addFiles(e.clipboardData.files)\n      }\n    },\n    [addFiles],\n  )\n\n  const handleDragEnter = React.useCallback((e: DragEvent) => {\n    e.preventDefault()\n    e.stopPropagation()\n    setDragging(true)\n  }, [])\n\n  const handleDragLeave = React.useCallback((e: DragEvent) => {\n    e.preventDefault()\n    e.stopPropagation()\n    setDragging(false)\n  }, [])\n\n  const handleDrop = React.useCallback(\n    (e: DragEvent) => {\n      e.preventDefault()\n      e.stopPropagation()\n      setDragging(false)\n\n      if (e.dataTransfer.files && e.dataTransfer.files.length > 0) {\n        addFiles(e.dataTransfer.files)\n        setDragging(false)\n\n        e.dataTransfer.clearData()\n      }\n    },\n    [addFiles],\n  )\n\n  React.useEffect(() => {\n    const div = dropRef.current\n\n    if (div && !disabled) {\n      div.addEventListener('dragenter', handleDragEnter)\n      div.addEventListener('dragleave', handleDragLeave)\n      div.addEventListener('dragover', handleDragOver)\n      div.addEventListener('drop', handleDrop)\n      div.addEventListener('paste', handlePaste)\n\n      return () => {\n        div.removeEventListener('dragenter', handleDragEnter)\n        div.removeEventListener('dragleave', handleDragLeave)\n        div.removeEventListener('dragover', handleDragOver)\n        div.removeEventListener('drop', handleDrop)\n        div.removeEventListener('paste', handlePaste)\n      }\n    }\n\n    return () => null\n  }, [disabled, handleDragEnter, handleDragLeave, handleDrop, handlePaste])\n\n  const classes = [\n    baseClass,\n    className,\n    dragging ? 'dragging' : '',\n    `dropzoneStyle--${dropzoneStyle}`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  return (\n    <div className={classes} ref={dropRef}>\n      {children}\n    </div>\n  )\n}\n"],"mappings":"AAAA;;;AACA,OAAOA,KAAA,MAAW;AAElB,OAAO;AAEP,MAAMC,cAAA,GAAkBC,CAAA;EACtBA,CAAA,CAAEC,cAAc;EAChBD,CAAA,CAAEE,eAAe;AACnB;AAEA,MAAMC,SAAA,GAAY;AAWlB,OAAO,SAASC,SAAS;EACvBC,QAAQ;EACRC,SAAS;EACTC,QAAA,GAAW,KAAK;EAChBC,aAAA,GAAgB,SAAS;EACzBC,aAAa;EACbC;AAAQ,CACF;EACN,MAAMC,OAAA,GAAUb,KAAA,CAAMc,MAAM,CAAiB;EAC7C,MAAM,CAACC,QAAA,EAAUC,WAAA,CAAY,GAAGhB,KAAA,CAAMiB,QAAQ,CAAC;EAE/C,MAAMC,QAAA,GAAWlB,KAAA,CAAMmB,WAAW,CAC/BC,KAAA;IACC,IAAI,CAACT,aAAA,IAAiBS,KAAA,CAAMC,MAAM,GAAG,GAAG;MACtC,MAAMC,YAAA,GAAe,IAAIC,YAAA;MACzBD,YAAA,CAAaE,KAAK,CAACC,GAAG,CAACL,KAAK,CAAC,EAAE;MAC/BR,QAAA,CAASU,YAAA,CAAaF,KAAK;IAC7B,OAAO;MACLR,QAAA,CAASQ,KAAA;IACX;EACF,GACA,CAACT,aAAA,EAAeC,QAAA,CAAS;EAG3B,MAAMc,WAAA,GAAc1B,KAAA,CAAMmB,WAAW,CAClCjB,CAAA;IACCA,CAAA,CAAEC,cAAc;IAChBD,CAAA,CAAEE,eAAe;IAEjB,IAAIF,CAAA,CAAEyB,aAAa,CAACP,KAAK,IAAIlB,CAAA,CAAEyB,aAAa,CAACP,KAAK,CAACC,MAAM,GAAG,GAAG;MAC7DH,QAAA,CAAShB,CAAA,CAAEyB,aAAa,CAACP,KAAK;IAChC;EACF,GACA,CAACF,QAAA,CAAS;EAGZ,MAAMU,eAAA,GAAkB5B,KAAA,CAAMmB,WAAW,CAAEjB,GAAA;IACzCA,GAAA,CAAEC,cAAc;IAChBD,GAAA,CAAEE,eAAe;IACjBY,WAAA,CAAY;EACd,GAAG,EAAE;EAEL,MAAMa,eAAA,GAAkB7B,KAAA,CAAMmB,WAAW,CAAEjB,GAAA;IACzCA,GAAA,CAAEC,cAAc;IAChBD,GAAA,CAAEE,eAAe;IACjBY,WAAA,CAAY;EACd,GAAG,EAAE;EAEL,MAAMc,UAAA,GAAa9B,KAAA,CAAMmB,WAAW,CACjCjB,GAAA;IACCA,GAAA,CAAEC,cAAc;IAChBD,GAAA,CAAEE,eAAe;IACjBY,WAAA,CAAY;IAEZ,IAAId,GAAA,CAAEoB,YAAY,CAACF,KAAK,IAAIlB,GAAA,CAAEoB,YAAY,CAACF,KAAK,CAACC,MAAM,GAAG,GAAG;MAC3DH,QAAA,CAAShB,GAAA,CAAEoB,YAAY,CAACF,KAAK;MAC7BJ,WAAA,CAAY;MAEZd,GAAA,CAAEoB,YAAY,CAACS,SAAS;IAC1B;EACF,GACA,CAACb,QAAA,CAAS;EAGZlB,KAAA,CAAMgC,SAAS,CAAC;IACd,MAAMC,GAAA,GAAMpB,OAAA,CAAQqB,OAAO;IAE3B,IAAID,GAAA,IAAO,CAACxB,QAAA,EAAU;MACpBwB,GAAA,CAAIE,gBAAgB,CAAC,aAAaP,eAAA;MAClCK,GAAA,CAAIE,gBAAgB,CAAC,aAAaN,eAAA;MAClCI,GAAA,CAAIE,gBAAgB,CAAC,YAAYlC,cAAA;MACjCgC,GAAA,CAAIE,gBAAgB,CAAC,QAAQL,UAAA;MAC7BG,GAAA,CAAIE,gBAAgB,CAAC,SAAST,WAAA;MAE9B,OAAO;QACLO,GAAA,CAAIG,mBAAmB,CAAC,aAAaR,eAAA;QACrCK,GAAA,CAAIG,mBAAmB,CAAC,aAAaP,eAAA;QACrCI,GAAA,CAAIG,mBAAmB,CAAC,YAAYnC,cAAA;QACpCgC,GAAA,CAAIG,mBAAmB,CAAC,QAAQN,UAAA;QAChCG,GAAA,CAAIG,mBAAmB,CAAC,SAASV,WAAA;MACnC;IACF;IAEA,OAAO,MAAM;EACf,GAAG,CAACjB,QAAA,EAAUmB,eAAA,EAAiBC,eAAA,EAAiBC,UAAA,EAAYJ,WAAA,CAAY;EAExE,MAAMW,OAAA,GAAU,CACdhC,SAAA,EACAG,SAAA,EACAO,QAAA,GAAW,aAAa,IACxB,kBAAkBL,aAAA,EAAe,CAClC,CACE4B,MAAM,CAACC,OAAA,EACPC,IAAI,CAAC;EAER,oBACEC,IAAA,CAAC;IAAIjC,SAAA,EAAW6B,OAAA;IAASK,GAAA,EAAK7B,OAAA;cAC3BN;;AAGP","ignoreList":[]}

package/dist/elements/Dropzone/index.scss

@@ -1,56 +1,43 @@
 @import '../../scss/styles.scss';
 
-.dropzone {
-  position: relative;
-  display: flex;
-  align-items: center;
-  gap: base(0.4);
-  padding: base(1.6);
-  background: var(--theme-elevation-50);
-  border: 1px dotted var(--theme-elevation-400);
-  border-radius: var(--style-radius-s);
-  height: 100%;
-  width: 100%;
-  box-shadow: 0 0 0 0 transparent;
-  transition: all 100ms cubic-bezier(0, 0.2, 0.2, 1);
+@layer payload-default {
+  .dropzone {
+    position: relative;
+    display: flex;
+    align-items: center;
+    padding: calc(var(--base) * 0.9) var(--base);
+    background: transparent;
+    border: 1px dotted var(--theme-elevation-400);
+    border-radius: var(--style-radius-s);
+    height: 100%;
+    width: 100%;
+    box-shadow: 0 0 0 0 transparent;
+    transition: all 100ms cubic-bezier(0, 0.2, 0.2, 1);
 
-  .btn {
-    margin: 0;
-  }
-
-  &.dragging {
-    border-color: var(--theme-success-500);
-    background: var(--theme-success-150);
-    @include shadow-m;
-
-    * {
-      pointer-events: none;
+    .btn {
+      margin: 0;
+      display: flex;
+      justify-content: center;
+      align-items: center;
     }
-  }
 
-  &__label {
-    margin: 0;
-    text-transform: lowercase;
-  }
-
-  &__hidden-input {
-    position: absolute;
-    pointer-events: none;
-    visibility: hidden;
-  }
+    &.dragging {
+      border-color: var(--theme-success-500);
+      background: var(--theme-success-150);
+      @include shadow-m;
 
-  @include mid-break {
-    display: block;
-    text-align: center;
+      * {
+        pointer-events: none;
+      }
+    }
 
-    .btn {
-      margin: 0 auto;
-      width: 100%;
-      max-width: 200px;
+    @include mid-break {
+      display: block;
+      text-align: center;
     }
 
-    &__label {
-      display: none;
+    &.dropzoneStyle--none {
+      all: unset;
     }
   }
 }

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

@@ -1,10 +1,13 @@
 import type { SanitizedCollectionConfig } from 'payload';
 import React from 'react';
+import { DocumentDrawerContextType } from '../DocumentDrawer/Provider.jsx';
 import './index.scss';
 export type Props = {
-    id: string;
-    singularLabel: SanitizedCollectionConfig['labels']['singular'];
-    slug: string;
+    readonly id: string;
+    readonly onDuplicate?: DocumentDrawerContextType['onDuplicate'];
+    readonly redirectAfterDuplicate?: boolean;
+    readonly singularLabel: SanitizedCollectionConfig['labels']['singular'];
+    readonly slug: string;
 };
 export declare const DuplicateDocument: React.FC<Props>;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DuplicateDocument/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAKxD,OAAO,KAAgC,MAAM,OAAO,CAAA;AAWpD,OAAO,cAAc,CAAA;AAIrB,MAAM,MAAM,KAAK,GAAG;IAClB,EAAE,EAAE,MAAM,CAAA;IACV,aAAa,EAAE,yBAAyB,CAAC,QAAQ,CAAC,CAAC,UAAU,CAAC,CAAA;IAC9D,IAAI,EAAE,MAAM,CAAA;CACb,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA+G7C,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DuplicateDocument/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAA0B,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAKhF,OAAO,KAAgC,MAAM,OAAO,CAAA;AAapD,OAAO,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAA;AAC1E,OAAO,cAAc,CAAA;AAIrB,MAAM,MAAM,KAAK,GAAG;IAClB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,WAAW,CAAC,EAAE,yBAAyB,CAAC,aAAa,CAAC,CAAA;IAC/D,QAAQ,CAAC,sBAAsB,CAAC,EAAE,OAAO,CAAA;IACzC,QAAQ,CAAC,aAAa,EAAE,yBAAyB,CAAC,QAAQ,CAAC,CAAC,UAAU,CAAC,CAAA;IACvE,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;CACtB,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAgJ7C,CAAA"}