@payloadcms/ui 3.0.0-canary.fb81f02 → 3.0.0

package/dist/elements/DocumentDrawer/DrawerContent.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/DocumentDrawer/DrawerContent.tsx"],"sourcesContent":["'use client'\n\nimport { useModal } from '@faceless-ui/modal'\nimport React, { useCallback, useEffect, useState } from 'react'\nimport { toast } from 'sonner'\n\nimport type { DocumentDrawerProps } from './types.js'\n\nimport { useRelatedCollections } from '../../fields/Relationship/AddNew/useRelatedCollections.js'\nimport { XIcon } from '../../icons/X/index.js'\nimport { useComponentMap } from '../../providers/ComponentMap/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { DocumentInfoProvider, useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Gutter } from '../Gutter/index.js'\nimport { IDLabel } from '../IDLabel/index.js'\nimport { RenderTitle } from '../RenderTitle/index.js'\nimport { baseClass } from './index.js'\n\nexport const DocumentDrawerContent: React.FC<DocumentDrawerProps> = ({\n  id: existingDocID,\n  Header,\n  collectionSlug,\n  drawerSlug,\n  onSave: onSaveFromProps,\n}) => {\n  const config = useConfig()\n\n  const {\n    routes: { api: apiRoute },\n    serverURL,\n  } = config\n\n  const { closeModal, modalState, toggleModal } = useModal()\n  const locale = useLocale()\n  const { t } = useTranslation()\n  const [docID, setDocID] = useState(existingDocID)\n  const [isOpen, setIsOpen] = useState(false)\n  const [collectionConfig] = useRelatedCollections(collectionSlug)\n\n  const { componentMap } = useComponentMap()\n\n  const { Edit } = componentMap[`${collectionSlug ? 'collections' : 'globals'}`][collectionSlug]\n  const isEditing = Boolean(docID)\n  const apiURL = docID\n    ? `${serverURL}${apiRoute}/${collectionSlug}/${docID}${locale?.code ? `?locale=${locale.code}` : ''}`\n    : null\n\n  useEffect(() => {\n    setIsOpen(Boolean(modalState[drawerSlug]?.isOpen))\n  }, [modalState, drawerSlug])\n\n  const onLoadError = React.useCallback(\n    (data) => {\n      if (isOpen) {\n        closeModal(drawerSlug)\n        toast.error(data.errors?.[0].message || t('error:unspecific'))\n      }\n    },\n    [closeModal, drawerSlug, isOpen, t],\n  )\n\n  const onSave = useCallback<DocumentDrawerProps['onSave']>(\n    (args) => {\n      setDocID(args.doc.id)\n      if (typeof onSaveFromProps === 'function') {\n        void onSaveFromProps({\n          ...args,\n          collectionConfig,\n        })\n      }\n    },\n    [onSaveFromProps, collectionConfig],\n  )\n\n  return (\n    <DocumentInfoProvider\n      BeforeDocument={\n        <Gutter className={`${baseClass}__header`}>\n          <div className={`${baseClass}__header-content`}>\n            <h2 className={`${baseClass}__header-text`}>\n              {Header || <RenderTitle element=\"span\" />}\n            </h2>\n            {/* TODO: the `button` HTML element breaks CSS transitions on the drawer for some reason...\n            i.e. changing to a `div` element will fix the animation issue but will break accessibility\n          */}\n            <button\n              aria-label={t('general:close')}\n              className={`${baseClass}__header-close`}\n              onClick={() => toggleModal(drawerSlug)}\n              type=\"button\"\n            >\n              <XIcon />\n            </button>\n          </div>\n          <DocumentTitle />\n        </Gutter>\n      }\n      apiURL={apiURL}\n      collectionSlug={collectionConfig.slug}\n      disableActions\n      disableLeaveWithoutSaving\n      id={docID}\n      isEditing={isEditing}\n      onLoadError={onLoadError}\n      onSave={onSave}\n    >\n      {Edit}\n    </DocumentInfoProvider>\n  )\n}\n\nconst DocumentTitle: React.FC = () => {\n  const { id, title } = useDocumentInfo()\n  return id && id !== title ? <IDLabel id={id.toString()} /> : null\n}\n"],"names":["useModal","React","useCallback","useEffect","useState","toast","useRelatedCollections","XIcon","useComponentMap","useConfig","DocumentInfoProvider","useDocumentInfo","useLocale","useTranslation","Gutter","IDLabel","RenderTitle","baseClass","DocumentDrawerContent","id","existingDocID","Header","collectionSlug","drawerSlug","onSave","onSaveFromProps","config","routes","api","apiRoute","serverURL","closeModal","modalState","toggleModal","locale","t","docID","setDocID","isOpen","setIsOpen","collectionConfig","componentMap","Edit","isEditing","Boolean","apiURL","code","onLoadError","data","error","errors","message","args","doc","BeforeDocument","className","div","h2","element","button","aria-label","onClick","type","DocumentTitle","slug","disableActions","disableLeaveWithoutSaving","title","toString"],"mappings":"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"}
+{"version":3,"file":"DrawerContent.js","names":["useModal","React","useCallback","useEffect","useState","toast","LoadingOverlay","useConfig","useServerFunctions","useTranslation","abortAndIgnore","DocumentDrawerContextProvider","DocumentDrawerContent","id","existingDocID","AfterFields","collectionSlug","disableActions","drawerSlug","Header","initialData","initialState","onDelete","onDeleteFromProps","onDuplicate","onDuplicateFromProps","onSave","onSaveFromProps","redirectAfterDelete","redirectAfterDuplicate","config","collections","collectionConfig","find","collection","slug","documentViewAbortControllerRef","useRef","closeModal","t","renderDocument","DocumentView","setDocumentView","undefined","isLoading","setIsLoading","getDocumentView","docID","current","controller","AbortController","fetchDocumentView","result","signal","Document","error","message","args","doc","clearDoc","_jsx"],"sources":["../../../src/elements/DocumentDrawer/DrawerContent.tsx"],"sourcesContent":["'use client'\n\nimport { useModal } from '@faceless-ui/modal'\nimport React, { useCallback, useEffect, useState } from 'react'\nimport { toast } from 'sonner'\n\nimport type { DocumentDrawerProps } from './types.js'\n\nimport { LoadingOverlay } from '../../elements/Loading/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useServerFunctions } from '../../providers/ServerFunctions/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { abortAndIgnore } from '../../utilities/abortAndIgnore.js'\nimport { DocumentDrawerContextProvider } from './Provider.js'\n\nexport const DocumentDrawerContent: React.FC<DocumentDrawerProps> = ({\n  id: existingDocID,\n  AfterFields,\n  collectionSlug,\n  disableActions,\n  drawerSlug,\n  Header,\n  initialData,\n  initialState,\n  onDelete: onDeleteFromProps,\n  onDuplicate: onDuplicateFromProps,\n  onSave: onSaveFromProps,\n  redirectAfterDelete,\n  redirectAfterDuplicate,\n}) => {\n  const {\n    config: { collections },\n  } = useConfig()\n\n  const [collectionConfig] = useState(() =>\n    collections.find((collection) => collection.slug === collectionSlug),\n  )\n\n  const documentViewAbortControllerRef = React.useRef<AbortController>(null)\n\n  const { closeModal } = useModal()\n  const { t } = useTranslation()\n\n  const { renderDocument } = useServerFunctions()\n\n  const [DocumentView, setDocumentView] = useState<React.ReactNode>(undefined)\n  const [isLoading, setIsLoading] = useState(true)\n\n  const getDocumentView = useCallback(\n    (docID?: number | string) => {\n      abortAndIgnore(documentViewAbortControllerRef.current)\n\n      const controller = new AbortController()\n      documentViewAbortControllerRef.current = controller\n\n      const fetchDocumentView = async () => {\n        setIsLoading(true)\n\n        try {\n          const result = await renderDocument({\n            collectionSlug,\n            disableActions,\n            docID,\n            drawerSlug,\n            initialData,\n            redirectAfterDelete: redirectAfterDelete !== undefined ? redirectAfterDelete : false,\n            redirectAfterDuplicate:\n              redirectAfterDuplicate !== undefined ? redirectAfterDuplicate : false,\n            signal: controller.signal,\n          })\n\n          if (result?.Document) {\n            setDocumentView(result.Document)\n            setIsLoading(false)\n          }\n        } catch (error) {\n          toast.error(error?.message || t('error:unspecific'))\n          closeModal(drawerSlug)\n          // toast.error(data?.errors?.[0].message || t('error:unspecific'))\n        }\n      }\n\n      void fetchDocumentView()\n    },\n    [\n      collectionSlug,\n      disableActions,\n      drawerSlug,\n      initialData,\n      redirectAfterDelete,\n      redirectAfterDuplicate,\n      renderDocument,\n      closeModal,\n      t,\n    ],\n  )\n\n  const onSave = useCallback<DocumentDrawerProps['onSave']>(\n    (args) => {\n      getDocumentView(args.doc.id)\n\n      if (typeof onSaveFromProps === 'function') {\n        void onSaveFromProps({\n          ...args,\n          collectionConfig,\n        })\n      }\n    },\n    [onSaveFromProps, collectionConfig, getDocumentView],\n  )\n\n  const onDuplicate = useCallback<DocumentDrawerProps['onDuplicate']>(\n    (args) => {\n      getDocumentView(args.doc.id)\n\n      if (typeof onDuplicateFromProps === 'function') {\n        void onDuplicateFromProps({\n          ...args,\n          collectionConfig,\n        })\n      }\n    },\n    [onDuplicateFromProps, collectionConfig, getDocumentView],\n  )\n\n  const onDelete = useCallback<DocumentDrawerProps['onDelete']>(\n    (args) => {\n      if (typeof onDeleteFromProps === 'function') {\n        void onDeleteFromProps({\n          ...args,\n          collectionConfig,\n        })\n      }\n\n      closeModal(drawerSlug)\n    },\n    [onDeleteFromProps, closeModal, drawerSlug, collectionConfig],\n  )\n\n  const clearDoc = useCallback(() => {\n    getDocumentView()\n  }, [getDocumentView])\n\n  useEffect(() => {\n    if (!DocumentView) {\n      getDocumentView(existingDocID)\n    }\n  }, [DocumentView, getDocumentView, existingDocID])\n\n  // Cleanup any pending requests when the component unmounts\n  useEffect(() => {\n    return () => {\n      abortAndIgnore(documentViewAbortControllerRef.current)\n    }\n  }, [])\n\n  if (isLoading) {\n    return <LoadingOverlay />\n  }\n\n  return (\n    <DocumentDrawerContextProvider\n      clearDoc={clearDoc}\n      drawerSlug={drawerSlug}\n      onDelete={onDelete}\n      onDuplicate={onDuplicate}\n      onSave={onSave}\n    >\n      {DocumentView}\n    </DocumentDrawerContextProvider>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/DocumentDrawer/DrawerHeader/index.d.ts

@@ -0,0 +1,5 @@
+import './index.scss';
+export declare const DocumentDrawerHeader: React.FC<{
+    drawerSlug: string;
+}>;
+//# sourceMappingURL=index.d.ts.map

package/dist/elements/DocumentDrawer/DrawerHeader/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/DocumentDrawer/DrawerHeader/index.tsx"],"names":[],"mappings":"AAUA,OAAO,cAAc,CAAA;AAErB,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC;IAC1C,UAAU,EAAE,MAAM,CAAA;CACnB,CAoBA,CAAA"}

package/dist/elements/DocumentDrawer/DrawerHeader/index.js

@@ -0,0 +1,82 @@
+'use client';
+
+import { c as _c } from "react/compiler-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Gutter } from '../../../elements/Gutter/index.js';
+import { useModal } from '../../../elements/Modal/index.js';
+import { RenderTitle } from '../../../elements/RenderTitle/index.js';
+import { XIcon } from '../../../icons/X/index.js';
+import { useDocumentInfo } from '../../../providers/DocumentInfo/index.js';
+import { useTranslation } from '../../../providers/Translation/index.js';
+import { IDLabel } from '../../IDLabel/index.js';
+import { baseClass as docDrawerBaseClass } from '../index.js';
+import './index.scss';
+export const DocumentDrawerHeader = t0 => {
+  const $ = _c(7);
+  const {
+    drawerSlug
+  } = t0;
+  const {
+    closeModal
+  } = useModal();
+  const {
+    t
+  } = useTranslation();
+  let t1;
+  if ($[0] !== t || $[1] !== closeModal || $[2] !== drawerSlug) {
+    let t2;
+    if ($[4] !== closeModal || $[5] !== drawerSlug) {
+      t2 = () => closeModal(drawerSlug);
+      $[4] = closeModal;
+      $[5] = drawerSlug;
+      $[6] = t2;
+    } else {
+      t2 = $[6];
+    }
+    t1 = _jsxs(Gutter, {
+      className: `${docDrawerBaseClass}__header`,
+      children: [_jsxs("div", {
+        className: `${docDrawerBaseClass}__header-content`,
+        children: [_jsx("h2", {
+          className: `${docDrawerBaseClass}__header-text`,
+          children: _jsx(RenderTitle, {
+            element: "span"
+          })
+        }), _jsx("button", {
+          "aria-label": t("general:close"),
+          className: `${docDrawerBaseClass}__header-close`,
+          onClick: t2,
+          type: "button",
+          children: _jsx(XIcon, {})
+        })]
+      }), _jsx(DocumentTitle, {})]
+    });
+    $[0] = t;
+    $[1] = closeModal;
+    $[2] = drawerSlug;
+    $[3] = t1;
+  } else {
+    t1 = $[3];
+  }
+  return t1;
+};
+const DocumentTitle = () => {
+  const $ = _c(3);
+  const {
+    id,
+    title
+  } = useDocumentInfo();
+  let t0;
+  if ($[0] !== id || $[1] !== title) {
+    t0 = id && id !== title ? _jsx(IDLabel, {
+      id: id.toString()
+    }) : null;
+    $[0] = id;
+    $[1] = title;
+    $[2] = t0;
+  } else {
+    t0 = $[2];
+  }
+  return t0;
+};
+//# sourceMappingURL=index.js.map

package/dist/elements/DocumentDrawer/DrawerHeader/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["c","_c","Gutter","useModal","RenderTitle","XIcon","useDocumentInfo","useTranslation","IDLabel","baseClass","docDrawerBaseClass","DocumentDrawerHeader","t0","$","drawerSlug","closeModal","t","t1","t2","_jsxs","className","children","_jsx","element","onClick","type","DocumentTitle","id","title","toString"],"sources":["../../../../src/elements/DocumentDrawer/DrawerHeader/index.tsx"],"sourcesContent":["'use client'\n\nimport { Gutter } from '../../../elements/Gutter/index.js'\nimport { useModal } from '../../../elements/Modal/index.js'\nimport { RenderTitle } from '../../../elements/RenderTitle/index.js'\nimport { XIcon } from '../../../icons/X/index.js'\nimport { useDocumentInfo } from '../../../providers/DocumentInfo/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { IDLabel } from '../../IDLabel/index.js'\nimport { baseClass as docDrawerBaseClass } from '../index.js'\nimport './index.scss'\n\nexport const DocumentDrawerHeader: React.FC<{\n  drawerSlug: string\n}> = ({ drawerSlug }) => {\n  const { closeModal } = useModal()\n  const { t } = useTranslation()\n\n  return (\n    <Gutter className={`${docDrawerBaseClass}__header`}>\n      <div className={`${docDrawerBaseClass}__header-content`}>\n        <h2 className={`${docDrawerBaseClass}__header-text`}>{<RenderTitle element=\"span\" />}</h2>\n        <button\n          aria-label={t('general:close')}\n          className={`${docDrawerBaseClass}__header-close`}\n          onClick={() => closeModal(drawerSlug)}\n          type=\"button\"\n        >\n          <XIcon />\n        </button>\n      </div>\n      <DocumentTitle />\n    </Gutter>\n  )\n}\n\nconst DocumentTitle: React.FC = () => {\n  const { id, title } = useDocumentInfo()\n  return id && id !== title ? <IDLabel id={id.toString()} /> : null\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAEA,SAASC,MAAM,QAAQ;AACvB,SAASC,QAAQ,QAAQ;AACzB,SAASC,WAAW,QAAQ;AAC5B,SAASC,KAAK,QAAQ;AACtB,SAASC,eAAe,QAAQ;AAChC,SAASC,cAAc,QAAQ;AAC/B,SAASC,OAAO,QAAQ;AACxB,SAASC,SAAA,IAAaC,kBAAkB,QAAQ;AAChD,OAAO;AAEP,OAAO,MAAMC,oBAAA,GAERC,EAAA;EAAA,MAAAC,CAAA,GAAAZ,EAAA;EAAC;IAAAa;EAAA,IAAAF,EAAc;EAClB;IAAAG;EAAA,IAAuBZ,QAAA;EACvB;IAAAa;EAAA,IAAcT,cAAA;EAAA,IAAAU,EAAA;EAAA,IAAAJ,CAAA,QAAAG,CAAA,IAAAH,CAAA,QAAAE,UAAA,IAAAF,CAAA,QAAAC,UAAA;IAAA,IAAAI,EAAA;IAAA,IAAAL,CAAA,QAAAE,UAAA,IAAAF,CAAA,QAAAC,UAAA;MASGI,EAAA,GAAAA,CAAA,KAAMH,UAAA,CAAWD,UAAA;MAAAD,CAAA,MAAAE,UAAA;MAAAF,CAAA,MAAAC,UAAA;MAAAD,CAAA,MAAAK,EAAA;IAAA;MAAAA,EAAA,GAAAL,CAAA;IAAA;IANhCI,EAAA,GAAAE,KAAA,CAAAjB,MAAA;MAAAkB,SAAA,EAAmB,GAAAV,kBAAA,UAA+B;MAAAW,QAAA,GAChDF,KAAA,CAAC;QAAAC,SAAA,EAAe,GAAAV,kBAAA,kBAAuC;QAAAW,QAAA,GACrDC,IAAA,CAAC;UAAAF,SAAA,EAAc,GAAAV,kBAAA,eAAoC;UAAAW,QAAA,EAAGC,IAAA,CAAAlB,WAAA;YAAAmB,OAAA,EAAqB;UAAA,C;YAC3ED,IAAA,CAAC;UAAA,cACaN,CAAA,CAAE;UAAAI,SAAA,EACH,GAAAV,kBAAA,gBAAqC;UAAAc,OAAA,EACvCN,EAAiB;UAAAO,IAAA,EACrB;UAAAJ,QAAA,EAELC,IAAA,CAAAjB,KAAA,IAAC;QAAA,C;UAGLiB,IAAA,CAAAI,aAAA,IAAC;IAAA,C;;;;;;;;SAZHT,E;CAeJ;AAEA,MAAMS,aAAA,GAA0BA,CAAA;EAAA,MAAAb,CAAA,GAAAZ,EAAA;EAC9B;IAAA0B,EAAA;IAAAC;EAAA,IAAsBtB,eAAA;EAAA,IAAAM,EAAA;EAAA,IAAAC,CAAA,QAAAc,EAAA,IAAAd,CAAA,QAAAe,KAAA;IACfhB,EAAA,GAAAe,EAAA,IAAMA,EAAA,KAAOC,KAAA,GAAQN,IAAA,CAAAd,OAAA;MAAAmB,EAAA,EAAaA,EAAA,CAAAE,QAAA,CAAW;IAAA,C,QAAS;IAAAhB,CAAA,MAAAc,EAAA;IAAAd,CAAA,MAAAe,KAAA;IAAAf,CAAA,MAAAD,EAAA;EAAA;IAAAA,EAAA,GAAAC,CAAA;EAAA;EAAA,OAAtDD,EAAsD;AAAA,CAC/D","ignoreList":[]}

package/dist/elements/DocumentDrawer/DrawerHeader/index.scss

@@ -0,0 +1,73 @@
+@import '../../../scss/styles.scss';
+
+@layer payload-default {
+  .doc-drawer {
+    &__header {
+      width: 100%;
+      margin-top: base(2.5);
+      display: flex;
+      flex-direction: column;
+      gap: base(0.5);
+      align-items: flex-start;
+    }
+
+    &__header-content {
+      display: flex;
+      justify-content: space-between;
+      align-items: flex-start;
+      width: 100%;
+    }
+
+    &__header-text {
+      margin: 0;
+    }
+
+    &__header-toggler {
+      background: transparent;
+      border: 0;
+      margin: 0;
+      padding: 0;
+      cursor: pointer;
+      color: inherit;
+
+      &:focus,
+      &:focus-within {
+        outline: none;
+      }
+
+      &:disabled {
+        pointer-events: none;
+      }
+    }
+
+    &__header-close {
+      border: 0;
+      background-color: transparent;
+      padding: 0;
+      cursor: pointer;
+      overflow: hidden;
+      width: base(2);
+      height: base(2);
+
+      svg {
+        width: base(2);
+        height: base(2);
+        position: relative;
+
+        .stroke {
+          stroke-width: 2px;
+          vector-effect: non-scaling-stroke;
+        }
+      }
+    }
+
+    @include mid-break {
+      .doc-drawer__header {
+        margin-top: base(1.5);
+        margin-bottom: base(0.5);
+        padding-left: var(--gutter-h);
+        padding-right: var(--gutter-h);
+      }
+    }
+  }
+}

package/dist/elements/DocumentDrawer/Provider.d.ts

@@ -0,0 +1,26 @@
+import type { ClientCollectionConfig, Data, TypeWithID } from 'payload';
+export type DocumentDrawerContextProps = {
+    readonly clearDoc?: () => void;
+    readonly drawerSlug: string;
+    readonly onDelete?: (args: {
+        collectionConfig?: ClientCollectionConfig;
+        id: string;
+    }) => Promise<void> | void;
+    readonly onDuplicate?: (args: {
+        collectionConfig?: ClientCollectionConfig;
+        doc: TypeWithID;
+    }) => Promise<void> | void;
+    readonly onSave?: (args: {
+        collectionConfig?: ClientCollectionConfig;
+        doc: TypeWithID;
+        operation: 'create' | 'update';
+        result: Data;
+    }) => Promise<void> | void;
+};
+export type DocumentDrawerContextType = DocumentDrawerContextProps;
+export declare const DocumentDrawerCallbacksContext: import("react").Context<DocumentDrawerContextProps>;
+export declare const DocumentDrawerContextProvider: React.FC<{
+    children: React.ReactNode;
+} & DocumentDrawerContextProps>;
+export declare const useDocumentDrawerContext: () => DocumentDrawerContextType;
+//# sourceMappingURL=Provider.d.ts.map

package/dist/elements/DocumentDrawer/Provider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Provider.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentDrawer/Provider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAIvE,MAAM,MAAM,0BAA0B,GAAG;IACvC,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IAC9B,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE;QACzB,gBAAgB,CAAC,EAAE,sBAAsB,CAAA;QACzC,EAAE,EAAE,MAAM,CAAA;KACX,KAAK,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAA;IAE1B,QAAQ,CAAC,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE;QAC5B,gBAAgB,CAAC,EAAE,sBAAsB,CAAA;QACzC,GAAG,EAAE,UAAU,CAAA;KAChB,KAAK,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAA;IAC1B,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE;QACvB,gBAAgB,CAAC,EAAE,sBAAsB,CAAA;QACzC,GAAG,EAAE,UAAU,CAAA;QACf,SAAS,EAAE,QAAQ,GAAG,QAAQ,CAAA;QAC9B,MAAM,EAAE,IAAI,CAAA;KACb,KAAK,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAA;CAC3B,CAAA;AAED,MAAM,MAAM,yBAAyB,GAAG,0BAA0B,CAAA;AAElE,eAAO,MAAM,8BAA8B,qDAAiD,CAAA;AAE5F,eAAO,MAAM,6BAA6B,EAAE,KAAK,CAAC,EAAE,CAClD;IACE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,GAAG,0BAA0B,CAO/B,CAAA;AAED,eAAO,MAAM,wBAAwB,QAAO,yBAQ3C,CAAA"}

package/dist/elements/DocumentDrawer/Provider.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext } from 'react';
+export const DocumentDrawerCallbacksContext = /*#__PURE__*/createContext({});
+export const DocumentDrawerContextProvider = ({
+  children,
+  ...rest
+}) => {
+  return /*#__PURE__*/_jsx(DocumentDrawerCallbacksContext.Provider, {
+    value: rest,
+    children: children
+  });
+};
+export const useDocumentDrawerContext = () => {
+  const context = useContext(DocumentDrawerCallbacksContext);
+  if (!context) {
+    throw new Error('useDocumentDrawerContext must be used within a DocumentDrawerProvider');
+  }
+  return context;
+};
+//# sourceMappingURL=Provider.js.map

package/dist/elements/DocumentDrawer/Provider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Provider.js","names":["createContext","useContext","DocumentDrawerCallbacksContext","DocumentDrawerContextProvider","children","rest","_jsx","Provider","value","useDocumentDrawerContext","context","Error"],"sources":["../../../src/elements/DocumentDrawer/Provider.tsx"],"sourcesContent":["import type { ClientCollectionConfig, Data, TypeWithID } from 'payload'\n\nimport { createContext, useContext } from 'react'\n\nexport type DocumentDrawerContextProps = {\n  readonly clearDoc?: () => void\n  readonly drawerSlug: string\n  readonly onDelete?: (args: {\n    collectionConfig?: ClientCollectionConfig\n    id: string\n  }) => Promise<void> | void\n  /* only available if `redirectAfterDuplicate` is `false` */\n  readonly onDuplicate?: (args: {\n    collectionConfig?: ClientCollectionConfig\n    doc: TypeWithID\n  }) => Promise<void> | void\n  readonly onSave?: (args: {\n    collectionConfig?: ClientCollectionConfig\n    doc: TypeWithID\n    operation: 'create' | 'update'\n    result: Data\n  }) => Promise<void> | void\n}\n\nexport type DocumentDrawerContextType = DocumentDrawerContextProps\n\nexport const DocumentDrawerCallbacksContext = createContext({} as DocumentDrawerContextType)\n\nexport const DocumentDrawerContextProvider: React.FC<\n  {\n    children: React.ReactNode\n  } & DocumentDrawerContextProps\n> = ({ children, ...rest }) => {\n  return (\n    <DocumentDrawerCallbacksContext.Provider value={rest}>\n      {children}\n    </DocumentDrawerCallbacksContext.Provider>\n  )\n}\n\nexport const useDocumentDrawerContext = (): DocumentDrawerContextType => {\n  const context = useContext(DocumentDrawerCallbacksContext)\n\n  if (!context) {\n    throw new Error('useDocumentDrawerContext must be used within a DocumentDrawerProvider')\n  }\n\n  return context\n}\n"],"mappings":";AAEA,SAASA,aAAa,EAAEC,UAAU,QAAQ;AAwB1C,OAAO,MAAMC,8BAAA,gBAAiCF,aAAA,CAAc,CAAC;AAE7D,OAAO,MAAMG,6BAAA,GAITA,CAAC;EAAEC,QAAQ;EAAE,GAAGC;AAAA,CAAM;EACxB,oBACEC,IAAA,CAACJ,8BAAA,CAA+BK,QAAQ;IAACC,KAAA,EAAOH,IAAA;cAC7CD;;AAGP;AAEA,OAAO,MAAMK,wBAAA,GAA2BA,CAAA;EACtC,MAAMC,OAAA,GAAUT,UAAA,CAAWC,8BAAA;EAE3B,IAAI,CAACQ,OAAA,EAAS;IACZ,MAAM,IAAIC,KAAA,CAAM;EAClB;EAEA,OAAOD,OAAA;AACT","ignoreList":[]}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentDrawer/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA2D,MAAM,OAAO,CAAA;AAE/E,OAAO,KAAK,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAA;AAO9F,OAAO,cAAc,CAAA;AAErB,eAAO,MAAM,SAAS,eAAe,CAAA;AAcrC,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAyBhE,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAQxD,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,iBAiE/B,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentDrawer/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA2D,MAAM,OAAO,CAAA;AAE/E,OAAO,KAAK,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAA;AAO9F,OAAO,cAAc,CAAA;AAErB,eAAO,MAAM,SAAS,eAAe,CAAA;AAcrC,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CA2BhE,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAQxD,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,iBAiE/B,CAAA"}