@payloadcms/ui 4.0.0-internal.9496957 → 4.0.0-internal.970009e

package/dist/elements/DraggableSortable/useDraggableSortable/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","useSortable","useDraggableSortable","props","$","id","disabled","t0","Symbol","for","duration","easing","t1","transition","attributes","isDragging","isOver","isSorting","listeners","setNodeRef","transform","t2","t3","style","t4","x","y","t5"],"sources":["../../../../src/elements/DraggableSortable/useDraggableSortable/index.tsx"],"sourcesContent":["'use client'\nimport type { UseDraggableArguments } from '@dnd-kit/core'\n\nimport { useSortable } from '@dnd-kit/sortable'\n\nimport type { UseDraggableSortableReturn } from './types.js'\n\nexport const useDraggableSortable = (props: UseDraggableArguments): UseDraggableSortableReturn => {\n  const { id, disabled } = props\n\n  const {\n    attributes,\n    isDragging,\n    isOver,\n    isSorting,\n    listeners,\n    setNodeRef,\n    transform,\n    transition,\n  } = useSortable({\n    id,\n    disabled,\n    transition: {\n      duration: 250,\n      easing: 'cubic-bezier(0, 0.2, 0.2, 1)',\n    },\n  })\n\n  return {\n    attributes: {\n      ...attributes,\n      style: {\n        transition,\n      },\n    },\n    isDragging,\n    isOver,\n    isSorting,\n    listeners,\n    setNodeRef,\n    transform: transform && `translate3d(${transform.x}px, ${transform.y}px, 0)`, // translate3d is faster than translate in most browsers\n    transition,\n  }\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;AAGA,SAASC,WAAW,QAAQ;AAI5B,OAAO,MAAMC,oBAAA,GAAuBC,KAAA;EAAA,MAAAC,CAAA,GAAAJ,EAAA;EAClC;IAAAK,EAAA;IAAAC;EAAA,IAAyBH,KAAA;EAAA,IAAAI,EAAA;EAAA,IAAAH,CAAA,QAAAI,MAAA,CAAAC,GAAA;IAcXF,EAAA;MAAAG,QAAA;MAAAC,MAAA,EAEF;IAAA;IACVP,CAAA,MAAAG,EAAA;EAAA;IAAAA,EAAA,GAAAH,CAAA;EAAA;EAAA,IAAAQ,EAAA;EAAA,IAAAR,CAAA,QAAAE,QAAA,IAAAF,CAAA,QAAAC,EAAA;IANcO,EAAA;MAAAP,EAAA;MAAAC,QAAA;MAAAO,UAAA,EAGFN;IAGZ;IACFH,CAAA,MAAAE,QAAA;IAAAF,CAAA,MAAAC,EAAA;IAAAD,CAAA,MAAAQ,EAAA;EAAA;IAAAA,EAAA,GAAAR,CAAA;EAAA;EAhBA;IAAAU,UAAA;IAAAC,UAAA;IAAAC,MAAA;IAAAC,SAAA;IAAAC,SAAA;IAAAC,UAAA;IAAAC,SAAA;IAAAP;EAAA,IASIZ,WAAA,CAAYW,EAOhB;EAAA,IAAAS,EAAA;EAAA,IAAAjB,CAAA,QAAAS,UAAA;IAKWQ,EAAA;MAAAR;IAAA;IAEPT,CAAA,MAAAS,UAAA;IAAAT,CAAA,MAAAiB,EAAA;EAAA;IAAAA,EAAA,GAAAjB,CAAA;EAAA;EAAA,IAAAkB,EAAA;EAAA,IAAAlB,CAAA,QAAAU,UAAA,IAAAV,CAAA,QAAAiB,EAAA;IAJUC,EAAA;MAAA,GACPR,UAAU;MAAAS,KAAA,EACNF;IAEP;IACFjB,CAAA,MAAAU,UAAA;IAAAV,CAAA,MAAAiB,EAAA;IAAAjB,CAAA,MAAAkB,EAAA;EAAA;IAAAA,EAAA,GAAAlB,CAAA;EAAA;EAMW,MAAAoB,EAAA,GAAAJ,SAAA,IAAa,eAAeA,SAAA,CAAAK,CAAA,OAAkBL,SAAA,CAAAM,CAAA,QAAmB;EAAA,IAAAC,EAAA;EAAA,IAAAvB,CAAA,QAAAW,UAAA,IAAAX,CAAA,SAAAY,MAAA,IAAAZ,CAAA,SAAAa,SAAA,IAAAb,CAAA,SAAAc,SAAA,IAAAd,CAAA,SAAAe,UAAA,IAAAf,CAAA,SAAAkB,EAAA,IAAAlB,CAAA,SAAAoB,EAAA,IAAApB,CAAA,SAAAS,UAAA;IAZvEc,EAAA;MAAAb,UAAA,EACOQ,EAKZ;MAAAP,UAAA;MAAAC,MAAA;MAAAC,SAAA;MAAAC,SAAA;MAAAC,UAAA;MAAAC,SAAA,EAMWI,EAAiE;MAAAX;IAAA;IAE9ET,CAAA,MAAAW,UAAA;IAAAX,CAAA,OAAAY,MAAA;IAAAZ,CAAA,OAAAa,SAAA;IAAAb,CAAA,OAAAc,SAAA;IAAAd,CAAA,OAAAe,UAAA;IAAAf,CAAA,OAAAkB,EAAA;IAAAlB,CAAA,OAAAoB,EAAA;IAAApB,CAAA,OAAAS,UAAA;IAAAT,CAAA,OAAAuB,EAAA;EAAA;IAAAA,EAAA,GAAAvB,CAAA;EAAA;EAAA,OAdOuB,EAcP;AAAA,CACF","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","useSortable","useDraggableSortable","props","$","id","disabled","t0","Symbol","for","duration","easing","t1","transition","attributes","isDragging","isOver","isSorting","listeners","setActivatorNodeRef","setNodeRef","transform","t2","t3","style","t4","x","y","t5"],"sources":["../../../../src/elements/DraggableSortable/useDraggableSortable/index.tsx"],"sourcesContent":["'use client'\nimport type { UseDraggableArguments } from '@dnd-kit/core'\n\nimport { useSortable } from '@dnd-kit/sortable'\n\nimport type { UseDraggableSortableReturn } from './types.js'\n\nexport const useDraggableSortable = (props: UseDraggableArguments): UseDraggableSortableReturn => {\n  const { id, disabled } = props\n\n  const {\n    attributes,\n    isDragging,\n    isOver,\n    isSorting,\n    listeners,\n    setActivatorNodeRef,\n    setNodeRef,\n    transform,\n    transition,\n  } = useSortable({\n    id,\n    disabled,\n    transition: {\n      duration: 250,\n      easing: 'cubic-bezier(0, 0.2, 0.2, 1)',\n    },\n  })\n\n  return {\n    attributes: {\n      ...attributes,\n      style: {\n        transition,\n      },\n    },\n    isDragging,\n    isOver,\n    isSorting,\n    listeners,\n    setActivatorNodeRef,\n    setNodeRef,\n    transform: transform && `translate3d(${transform.x}px, ${transform.y}px, 0)`, // translate3d is faster than translate in most browsers\n    transition,\n  }\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;AAGA,SAASC,WAAW,QAAQ;AAI5B,OAAO,MAAMC,oBAAA,GAAuBC,KAAA;EAAA,MAAAC,CAAA,GAAAJ,EAAA;EAClC;IAAAK,EAAA;IAAAC;EAAA,IAAyBH,KAAA;EAAA,IAAAI,EAAA;EAAA,IAAAH,CAAA,QAAAI,MAAA,CAAAC,GAAA;IAeXF,EAAA;MAAAG,QAAA,EACA;MAAAC,MAAA,EACF;IACV;IAAAP,CAAA,MAAAG,EAAA;EAAA;IAAAA,EAAA,GAAAH,CAAA;EAAA;EAAA,IAAAQ,EAAA;EAAA,IAAAR,CAAA,QAAAE,QAAA,IAAAF,CAAA,QAAAC,EAAA;IANcO,EAAA;MAAAP,EAAA;MAAAC,QAAA;MAAAO,UAAA,EAGFN;IAId;IAAAH,CAAA,MAAAE,QAAA;IAAAF,CAAA,MAAAC,EAAA;IAAAD,CAAA,MAAAQ,EAAA;EAAA;IAAAA,EAAA,GAAAR,CAAA;EAAA;EAjBA;IAAAU,UAAA;IAAAC,UAAA;IAAAC,MAAA;IAAAC,SAAA;IAAAC,SAAA;IAAAC,mBAAA;IAAAC,UAAA;IAAAC,SAAA;IAAAR;EAAA,IAUIZ,WAAA,CAAYW,EAOhB;EAAA,IAAAU,EAAA;EAAA,IAAAlB,CAAA,QAAAS,UAAA;IAKWS,EAAA;MAAAT;IAEP;IAAAT,CAAA,MAAAS,UAAA;IAAAT,CAAA,MAAAkB,EAAA;EAAA;IAAAA,EAAA,GAAAlB,CAAA;EAAA;EAAA,IAAAmB,EAAA;EAAA,IAAAnB,CAAA,QAAAU,UAAA,IAAAV,CAAA,QAAAkB,EAAA;IAJUC,EAAA;MAAA,GACPT,UAAU;MAAAU,KAAA,EACNF;IAGT;IAAAlB,CAAA,MAAAU,UAAA;IAAAV,CAAA,MAAAkB,EAAA;IAAAlB,CAAA,MAAAmB,EAAA;EAAA;IAAAA,EAAA,GAAAnB,CAAA;EAAA;EAOW,MAAAqB,EAAA,GAAAJ,SAAiE,IAAjE,eAA4BA,SAAA,CAAAK,CAAW,OAAOL,SAAA,CAAAM,CAAW,QAAQ;EAAA,IAAAC,EAAA;EAAA,IAAAxB,CAAA,QAAAW,UAAA,IAAAX,CAAA,SAAAY,MAAA,IAAAZ,CAAA,SAAAa,SAAA,IAAAb,CAAA,SAAAc,SAAA,IAAAd,CAAA,SAAAe,mBAAA,IAAAf,CAAA,SAAAgB,UAAA,IAAAhB,CAAA,SAAAmB,EAAA,IAAAnB,CAAA,SAAAqB,EAAA,IAAArB,CAAA,SAAAS,UAAA;IAbvEe,EAAA;MAAAd,UAAA,EACOS,EAKZ;MAAAR,UAAA;MAAAC,MAAA;MAAAC,SAAA;MAAAC,SAAA;MAAAC,mBAAA;MAAAC,UAAA;MAAAC,SAAA,EAOWI,EAAiE;MAAAZ;IAE9E;IAAAT,CAAA,MAAAW,UAAA;IAAAX,CAAA,OAAAY,MAAA;IAAAZ,CAAA,OAAAa,SAAA;IAAAb,CAAA,OAAAc,SAAA;IAAAd,CAAA,OAAAe,mBAAA;IAAAf,CAAA,OAAAgB,UAAA;IAAAhB,CAAA,OAAAmB,EAAA;IAAAnB,CAAA,OAAAqB,EAAA;IAAArB,CAAA,OAAAS,UAAA;IAAAT,CAAA,OAAAwB,EAAA;EAAA;IAAAA,EAAA,GAAAxB,CAAA;EAAA;EAAA,OAfOwB,EAeP;AAAA,CACF","ignoreList":[]}

package/dist/elements/DraggableSortable/useDraggableSortable/types.d.ts

@@ -6,6 +6,7 @@ export type UseDraggableSortableReturn = {
     readonly isOver?: boolean;
     readonly isSorting?: boolean;
     readonly listeners: SyntheticListenerMap;
+    readonly setActivatorNodeRef?: (node: HTMLElement | null) => void;
     readonly setNodeRef: (node: HTMLElement | null) => void;
     readonly transform: string;
     readonly transition: string;

package/dist/elements/DraggableSortable/useDraggableSortable/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/elements/DraggableSortable/useDraggableSortable/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,6CAA6C,CAAA;AACvF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAE3C,MAAM,MAAM,0BAA0B,GAAG;IACvC,QAAQ,CAAC,UAAU,EAAE,cAAc,CAAC,OAAO,CAAC,CAAA;IAC5C,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO,CAAA;IAC7B,QAAQ,CAAC,MAAM,CAAC,EAAE,OAAO,CAAA;IACzB,QAAQ,CAAC,SAAS,CAAC,EAAE,OAAO,CAAA;IAC5B,QAAQ,CAAC,SAAS,EAAE,oBAAoB,CAAA;IACxC,QAAQ,CAAC,UAAU,EAAE,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAA;IACvD,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAA;IAC1B,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAA;CAC5B,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/elements/DraggableSortable/useDraggableSortable/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,6CAA6C,CAAA;AACvF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAE3C,MAAM,MAAM,0BAA0B,GAAG;IACvC,QAAQ,CAAC,UAAU,EAAE,cAAc,CAAC,OAAO,CAAC,CAAA;IAC5C,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO,CAAA;IAC7B,QAAQ,CAAC,MAAM,CAAC,EAAE,OAAO,CAAA;IACzB,QAAQ,CAAC,SAAS,CAAC,EAAE,OAAO,CAAA;IAC5B,QAAQ,CAAC,SAAS,EAAE,oBAAoB,CAAA;IACxC,QAAQ,CAAC,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAA;IACjE,QAAQ,CAAC,UAAU,EAAE,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAA;IACvD,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAA;IAC1B,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAA;CAC5B,CAAA"}

package/dist/elements/DraggableSortable/useDraggableSortable/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":[],"sources":["../../../../src/elements/DraggableSortable/useDraggableSortable/types.ts"],"sourcesContent":["import type { SyntheticListenerMap } from '@dnd-kit/core/dist/hooks/utilities/index.js'\nimport type { HTMLAttributes } from 'react'\n\nexport type UseDraggableSortableReturn = {\n  readonly attributes: HTMLAttributes<unknown>\n  readonly isDragging?: boolean\n  readonly isOver?: boolean\n  readonly isSorting?: boolean\n  readonly listeners: SyntheticListenerMap\n  readonly setNodeRef: (node: HTMLElement | null) => void\n  readonly transform: string\n  readonly transition: string\n}\n"],"mappings":"AAGA","ignoreList":[]}
+{"version":3,"file":"types.js","names":[],"sources":["../../../../src/elements/DraggableSortable/useDraggableSortable/types.ts"],"sourcesContent":["import type { SyntheticListenerMap } from '@dnd-kit/core/dist/hooks/utilities/index.js'\nimport type { HTMLAttributes } from 'react'\n\nexport type UseDraggableSortableReturn = {\n  readonly attributes: HTMLAttributes<unknown>\n  readonly isDragging?: boolean\n  readonly isOver?: boolean\n  readonly isSorting?: boolean\n  readonly listeners: SyntheticListenerMap\n  readonly setActivatorNodeRef?: (node: HTMLElement | null) => void\n  readonly setNodeRef: (node: HTMLElement | null) => void\n  readonly transform: string\n  readonly transition: string\n}\n"],"mappings":"AAGA","ignoreList":[]}

package/dist/elements/DraggableSortable/useRowAccessibility.d.ts

@@ -0,0 +1,14 @@
+import type { Announcements } from '@dnd-kit/core';
+import type { RefObject } from 'react';
+/** Keep the picked-up row's name stable while its displayed ordinal changes. */
+export declare function useRowAccessibility({ containerRef, enabled, ids, }: {
+    containerRef: RefObject<HTMLDivElement | null>;
+    enabled: boolean;
+    ids: string[];
+}): {
+    announcements: Announcements;
+    screenReaderInstructions: {
+        draggable: string;
+    };
+};
+//# sourceMappingURL=useRowAccessibility.d.ts.map

package/dist/elements/DraggableSortable/useRowAccessibility.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRowAccessibility.d.ts","sourceRoot":"","sources":["../../../src/elements/DraggableSortable/useRowAccessibility.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAoB,MAAM,eAAe,CAAA;AACpE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAOtC,gFAAgF;AAChF,wBAAgB,mBAAmB,CAAC,EAClC,YAAY,EACZ,OAAO,EACP,GAAG,GACJ,EAAE;IACD,YAAY,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAA;IAC9C,OAAO,EAAE,OAAO,CAAA;IAChB,GAAG,EAAE,MAAM,EAAE,CAAA;CACd;;;QAuEiC,SAAS;;EAG1C"}

package/dist/elements/DraggableSortable/useRowAccessibility.js

@@ -0,0 +1,99 @@
+import { computeAccessibleName } from 'dom-accessibility-api';
+import { useMemo, useRef } from 'react';
+import { useTranslation } from '../../providers/Translation/index.js';
+/** Keep the picked-up row's name stable while its displayed ordinal changes. */
+export function useRowAccessibility({
+  containerRef,
+  enabled,
+  ids
+}) {
+  const {
+    t
+  } = useTranslation();
+  const pickedUpLabel = useRef('');
+  const previousPosition = useRef(0);
+  return useMemo(() => {
+    if (!enabled) {
+      return undefined;
+    }
+    const position = ({
+      id
+    }) => ids.indexOf(String(id)) + 1;
+    const getLabel = ({
+      id
+    }) => {
+      const handle = Array.from(containerRef.current?.querySelectorAll('[data-sortable-id]') || []).find(element => element.dataset.sortableId === String(id));
+      const name = handle ? computeAccessibleName(handle) : '';
+      const action = t('general:dragToReorder');
+      const label = name.startsWith(action) ? name.slice(action.length).trim() : name;
+      return label || t('general:row');
+    };
+    const announcements = {
+      onDragCancel() {
+        return t('general:dragCancelled', {
+          label: pickedUpLabel.current
+        });
+      },
+      onDragEnd({
+        over
+      }) {
+        const nextPosition = over ? position({
+          id: over.id
+        }) : 0;
+        if (!nextPosition) {
+          return t('general:dragCancelled', {
+            label: pickedUpLabel.current
+          });
+        }
+        return t('general:dragDropped', {
+          count: ids.length,
+          label: pickedUpLabel.current,
+          position: nextPosition
+        });
+      },
+      onDragOver({
+        over
+      }) {
+        if (!over) {
+          return;
+        }
+        const nextPosition = position({
+          id: over.id
+        });
+        if (!nextPosition || nextPosition === previousPosition.current) {
+          return;
+        }
+        const direction = t(nextPosition > previousPosition.current ? 'general:moveDown' : 'general:moveUp');
+        previousPosition.current = nextPosition;
+        return t('general:dragMoved', {
+          count: ids.length,
+          direction,
+          label: pickedUpLabel.current,
+          position: nextPosition
+        });
+      },
+      onDragStart({
+        active
+      }) {
+        pickedUpLabel.current = getLabel({
+          id: active.id
+        });
+        previousPosition.current = position({
+          id: active.id
+        });
+        return t('general:dragPickedUp', {
+          count: ids.length,
+          label: pickedUpLabel.current,
+          position: previousPosition.current
+        });
+      }
+    };
+    return {
+      announcements,
+      screenReaderInstructions: {
+        draggable: t('general:dragInstructions')
+      }
+    };
+  }, [containerRef, enabled, ids, t]);
+}
+//# sourceMappingURL=useRowAccessibility.js.map

package/dist/elements/DraggableSortable/useRowAccessibility.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRowAccessibility.js","names":["computeAccessibleName","useMemo","useRef","useTranslation","useRowAccessibility","containerRef","enabled","ids","t","pickedUpLabel","previousPosition","undefined","position","id","indexOf","String","getLabel","handle","Array","from","current","querySelectorAll","find","element","dataset","sortableId","name","action","label","startsWith","slice","length","trim","announcements","onDragCancel","onDragEnd","over","nextPosition","count","onDragOver","direction","onDragStart","active","screenReaderInstructions","draggable"],"sources":["../../../src/elements/DraggableSortable/useRowAccessibility.ts"],"sourcesContent":["import type { Announcements, UniqueIdentifier } from '@dnd-kit/core'\nimport type { RefObject } from 'react'\n\nimport { computeAccessibleName } from 'dom-accessibility-api'\nimport { useMemo, useRef } from 'react'\n\nimport { useTranslation } from '../../providers/Translation/index.js'\n\n/** Keep the picked-up row's name stable while its displayed ordinal changes. */\nexport function useRowAccessibility({\n  containerRef,\n  enabled,\n  ids,\n}: {\n  containerRef: RefObject<HTMLDivElement | null>\n  enabled: boolean\n  ids: string[]\n}) {\n  const { t } = useTranslation()\n  const pickedUpLabel = useRef('')\n  const previousPosition = useRef(0)\n\n  return useMemo(() => {\n    if (!enabled) {\n      return undefined\n    }\n\n    const position = ({ id }: { id: UniqueIdentifier }) => ids.indexOf(String(id)) + 1\n    const getLabel = ({ id }: { id: UniqueIdentifier }) => {\n      const handle = Array.from(\n        containerRef.current?.querySelectorAll<HTMLElement>('[data-sortable-id]') || [],\n      ).find((element) => element.dataset.sortableId === String(id))\n      const name = handle ? computeAccessibleName(handle) : ''\n      const action = t('general:dragToReorder')\n      const label = name.startsWith(action) ? name.slice(action.length).trim() : name\n\n      return label || t('general:row')\n    }\n    const announcements: Announcements = {\n      onDragCancel() {\n        return t('general:dragCancelled', { label: pickedUpLabel.current })\n      },\n      onDragEnd({ over }) {\n        const nextPosition = over ? position({ id: over.id }) : 0\n\n        if (!nextPosition) {\n          return t('general:dragCancelled', { label: pickedUpLabel.current })\n        }\n        return t('general:dragDropped', {\n          count: ids.length,\n          label: pickedUpLabel.current,\n          position: nextPosition,\n        })\n      },\n      onDragOver({ over }) {\n        if (!over) {\n          return\n        }\n        const nextPosition = position({ id: over.id })\n\n        if (!nextPosition || nextPosition === previousPosition.current) {\n          return\n        }\n        const direction = t(\n          nextPosition > previousPosition.current ? 'general:moveDown' : 'general:moveUp',\n        )\n\n        previousPosition.current = nextPosition\n        return t('general:dragMoved', {\n          count: ids.length,\n          direction,\n          label: pickedUpLabel.current,\n          position: nextPosition,\n        })\n      },\n      onDragStart({ active }) {\n        pickedUpLabel.current = getLabel({ id: active.id })\n        previousPosition.current = position({ id: active.id })\n        return t('general:dragPickedUp', {\n          count: ids.length,\n          label: pickedUpLabel.current,\n          position: previousPosition.current,\n        })\n      },\n    }\n\n    return {\n      announcements,\n      screenReaderInstructions: { draggable: t('general:dragInstructions') },\n    }\n  }, [containerRef, enabled, ids, t])\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/Drawer/index.css

@@ -126,11 +126,10 @@
     white-space: nowrap;
     text-overflow: ellipsis;
     color: var(--color-text);
-    font-family: var(--text-body-medium-strong-font-family);
-    font-size: var(--text-body-medium-strong-font-size);
-    font-weight: var(--text-body-medium-strong-font-weight);
-    line-height: var(--text-body-medium-strong-line-height);
-    letter-spacing: var(--text-body-medium-strong-letter-spacing);
+    font-size: var(--text-body-medium-bold-font-size);
+    font-weight: var(--text-body-medium-bold-font-weight);
+    line-height: var(--text-body-medium-bold-line-height);
+    letter-spacing: var(--text-body-medium-bold-letter-spacing);
   }
 
   .drawer__header__close {

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Drawer/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KASN,MAAM,OAAO,CAAA;AAEd,OAAO,KAAK,EAAE,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAKrD,OAAO,aAAa,CAAA;AAIpB,eAAO,MAAM,WAAW,MAAM,CAAA;AAE9B,eAAO,MAAM,gBAAgB,oBAAqB;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,KAAG,MACzD,CAAA;AAE3B,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAElD,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAwChD,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAIlC,CAAA;AA6GD,eAAO,MAAM,kBAAkB,uBAAmB,CAAA;AAElD,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,CAKvE,CAAA;AAED,eAAO,MAAM,cAAc,QAAO,MAAiC,CAAA;AAEnE,KAAK,sBAAsB,GAAG;IAC5B,4EAA4E;IAC5E,gBAAgB,EAAE,MAAM,EAAE,CAAA;IAC1B,cAAc,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACpD,gBAAgB,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAA;CACxC,CAAA;AAQD;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,CA6BvE,CAAA;AAED,eAAO,MAAM,cAAc,QAAO,sBAAiD,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Drawer/index.tsx"],"names":[],"mappings":"AACA,OAAO,KASN,MAAM,OAAO,CAAA;AAEd,OAAO,KAAK,EAAE,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAMrD,OAAO,aAAa,CAAA;AAIpB,eAAO,MAAM,WAAW,MAAM,CAAA;AAE9B,eAAO,MAAM,gBAAgB,oBAAqB;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,KAAG,MACzD,CAAA;AAE3B,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAElD,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAwChD,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAIlC,CAAA;AA+GD,eAAO,MAAM,kBAAkB,uBAAmB,CAAA;AAElD,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,CAKvE,CAAA;AAED,eAAO,MAAM,cAAc,QAAO,MAAiC,CAAA;AAEnE,KAAK,sBAAsB,GAAG;IAC5B,4EAA4E;IAC5E,gBAAgB,EAAE,MAAM,EAAE,CAAA;IAC1B,cAAc,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACpD,gBAAgB,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAA;CACxC,CAAA;AAQD;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,CA6BvE,CAAA;AAED,eAAO,MAAM,cAAc,QAAO,sBAAiD,CAAA"}

package/dist/elements/Drawer/index.js

@@ -2,11 +2,11 @@
 
 import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Modal, useModal } from '@faceless-ui/modal';
 import React, { createContext, use, useCallback, useEffect, useId, useLayoutEffect, useMemo, useState } from 'react';
 import { ChevronIcon } from '../../icons/Chevron/index.js';
 import { useTranslation } from '../../providers/Translation/index.js';
 import { Button } from '../Button/index.js';
+import { Modal, useModal } from '../Modal/index.js';
 import './index.css';
 const baseClass = 'drawer';
 export const drawerZBase = 100;
@@ -70,7 +70,7 @@ export const Drawer = props => /*#__PURE__*/_jsx(DrawerDepthProvider, {
   })
 });
 const DrawerInner = t0 => {
-  const $ = _c(28);
+  const $ = _c(33);
   const {
     slug,
     children,
@@ -117,64 +117,83 @@ const DrawerInner = t0 => {
     t2 = $[6];
   }
   useEffect(t1, t2);
-  const layersFromTop = openDrawerDepths.filter(depth => depth > drawerDepth).length;
-  const [animateIn, setAnimateIn] = useState(isOpen);
   let t3;
+  if ($[7] !== drawerDepth || $[8] !== openDrawerDepths) {
+    let t4;
+    if ($[10] !== drawerDepth) {
+      t4 = depth => depth > drawerDepth;
+      $[10] = drawerDepth;
+      $[11] = t4;
+    } else {
+      t4 = $[11];
+    }
+    t3 = openDrawerDepths.filter(t4);
+    $[7] = drawerDepth;
+    $[8] = openDrawerDepths;
+    $[9] = t3;
+  } else {
+    t3 = $[9];
+  }
+  const layersFromTop = t3.length;
+  const [animateIn, setAnimateIn] = useState(isOpen);
   let t4;
-  if ($[7] !== isOpen) {
-    t3 = () => {
+  let t5;
+  if ($[12] !== isOpen) {
+    t4 = () => {
       setAnimateIn(isOpen);
     };
-    t4 = [isOpen];
-    $[7] = isOpen;
-    $[8] = t3;
-    $[9] = t4;
+    t5 = [isOpen];
+    $[12] = isOpen;
+    $[13] = t4;
+    $[14] = t5;
   } else {
-    t3 = $[8];
-    t4 = $[9];
+    t4 = $[13];
+    t5 = $[14];
   }
-  useLayoutEffect(t3, t4);
+  useLayoutEffect(t4, t5);
   if (isOpen) {
-    const t5 = animateIn && `${baseClass}--is-open`;
-    let t6;
-    if ($[10] !== className || $[11] !== t5) {
-      t6 = [className, baseClass, t5].filter(Boolean);
-      $[10] = className;
-      $[11] = t5;
-      $[12] = t6;
+    const t6 = animateIn && `${baseClass}--is-open`;
+    let t7;
+    if ($[15] !== className || $[16] !== t6) {
+      t7 = [className, baseClass, t6].filter(Boolean);
+      $[15] = className;
+      $[16] = t6;
+      $[17] = t7;
     } else {
-      t6 = $[12];
+      t7 = $[17];
     }
-    const t7 = t6.join(" ");
-    const t8 = `calc(${layersFromTop} * var(--spacer-3))`;
-    const t9 = drawerZBase + drawerDepth;
-    let t10;
-    if ($[13] !== Header || $[14] !== children || $[15] !== closeModal || $[16] !== headerActions || $[17] !== hoverTitle || $[18] !== slug || $[19] !== t || $[20] !== t7 || $[21] !== t8 || $[22] !== t9 || $[23] !== title) {
-      let t11;
-      if ($[25] !== closeModal || $[26] !== slug) {
-        t11 = () => closeModal(slug);
-        $[25] = closeModal;
-        $[26] = slug;
-        $[27] = t11;
+    const t8 = t7.join(" ");
+    const t9 = `calc(${layersFromTop} * var(--spacer-3))`;
+    const t10 = drawerZBase + drawerDepth;
+    let t11;
+    if ($[18] !== Header || $[19] !== children || $[20] !== closeModal || $[21] !== headerActions || $[22] !== hoverTitle || $[23] !== slug || $[24] !== t || $[25] !== t10 || $[26] !== t8 || $[27] !== t9 || $[28] !== title) {
+      let t12;
+      if ($[30] !== closeModal || $[31] !== slug) {
+        t12 = () => closeModal(slug);
+        $[30] = closeModal;
+        $[31] = slug;
+        $[32] = t12;
       } else {
-        t11 = $[27];
+        t12 = $[32];
       }
-      t10 = _jsxs(Modal, {
-        className: t7,
+      t11 = _jsxs(Modal, {
+        className: t8,
         closeOnBlur: false,
         lockBodyScroll: false,
         slug,
         style: {
-          "--drawer-layer-offset": t8,
-          zIndex: t9
+          "--drawer-layer-offset": t9,
+          zIndex: t10
         },
         children: [_jsx("div", {
           className: `${baseClass}__blur-bg`
         }), _jsx("button", {
+          "aria-hidden": "true",
           "aria-label": t("general:close"),
           className: `${baseClass}__close`,
           id: `close-drawer__${slug}`,
-          onClick: t11,
+          onClick: t12,
+          tabIndex: -1,
           type: "button"
         }), _jsxs("div", {
           className: `${baseClass}__content`,
@@ -205,22 +224,22 @@ const DrawerInner = t0 => {
           })]
         })]
       });
-      $[13] = Header;
-      $[14] = children;
-      $[15] = closeModal;
-      $[16] = headerActions;
-      $[17] = hoverTitle;
-      $[18] = slug;
-      $[19] = t;
-      $[20] = t7;
-      $[21] = t8;
-      $[22] = t9;
-      $[23] = title;
-      $[24] = t10;
+      $[18] = Header;
+      $[19] = children;
+      $[20] = closeModal;
+      $[21] = headerActions;
+      $[22] = hoverTitle;
+      $[23] = slug;
+      $[24] = t;
+      $[25] = t10;
+      $[26] = t8;
+      $[27] = t9;
+      $[28] = title;
+      $[29] = t11;
     } else {
-      t10 = $[24];
+      t11 = $[29];
     }
-    return t10;
+    return t11;
   }
   return null;
 };
@@ -267,37 +286,77 @@ const DrawerStackContext = /*#__PURE__*/createContext({
  * name) so confirmation modals like `leave-without-saving-...` never count, and
  * so stacking never depends on slug naming conventions.
  */
-export const DrawerStackProvider = ({
-  children
-}) => {
-  const [openDrawers, setOpenDrawers] = useState({});
-  const registerDrawer = useCallback((uid, depth) => {
-    setOpenDrawers(prev => prev[uid] === depth ? prev : {
-      ...prev,
-      [uid]: depth
-    });
-  }, []);
-  const unregisterDrawer = useCallback(uid_0 => {
-    setOpenDrawers(prev_0 => {
-      if (!(uid_0 in prev_0)) {
-        return prev_0;
-      }
-      const next = {
-        ...prev_0
-      };
-      delete next[uid_0];
-      return next;
+export const DrawerStackProvider = t0 => {
+  const $ = _c(8);
+  const {
+    children
+  } = t0;
+  let t1;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t1 = {};
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  const [openDrawers, setOpenDrawers] = useState(t1);
+  let t2;
+  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+    t2 = (uid, depth) => {
+      setOpenDrawers(prev => prev[uid] === depth ? prev : {
+        ...prev,
+        [uid]: depth
+      });
+    };
+    $[1] = t2;
+  } else {
+    t2 = $[1];
+  }
+  const registerDrawer = t2;
+  let t3;
+  if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+    t3 = uid_0 => {
+      setOpenDrawers(prev_0 => {
+        if (!(uid_0 in prev_0)) {
+          return prev_0;
+        }
+        const next = {
+          ...prev_0
+        };
+        delete next[uid_0];
+        return next;
+      });
+    };
+    $[2] = t3;
+  } else {
+    t3 = $[2];
+  }
+  const unregisterDrawer = t3;
+  let t4;
+  if ($[3] !== openDrawers) {
+    t4 = {
+      openDrawerDepths: Object.values(openDrawers),
+      registerDrawer,
+      unregisterDrawer
+    };
+    $[3] = openDrawers;
+    $[4] = t4;
+  } else {
+    t4 = $[4];
+  }
+  const value = t4;
+  let t5;
+  if ($[5] !== children || $[6] !== value) {
+    t5 = _jsx(DrawerStackContext, {
+      value,
+      children
     });
-  }, []);
-  const value = useMemo(() => ({
-    openDrawerDepths: Object.values(openDrawers),
-    registerDrawer,
-    unregisterDrawer
-  }), [openDrawers, registerDrawer, unregisterDrawer]);
-  return /*#__PURE__*/_jsx(DrawerStackContext, {
-    value: value,
-    children: children
-  });
+    $[5] = children;
+    $[6] = value;
+    $[7] = t5;
+  } else {
+    t5 = $[7];
+  }
+  return t5;
 };
 export const useDrawerStack = () => use(DrawerStackContext);
 function _temp(action, i) {

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","Modal","useModal","React","createContext","use","useCallback","useEffect","useId","useLayoutEffect","useMemo","useState","ChevronIcon","useTranslation","Button","baseClass","drawerZBase","formatDrawerSlug","slug","depth","useDrawerSlug","DrawerToggler","t0","$","buttonStyle","children","className","disabled","onClick","rest","openModal","t1","e","handleClick","_jsx","type","Drawer","props","DrawerDepthProvider","DrawerInner","Header","headerActions","hoverTitle","title","t","closeModal","modalState","drawerDepth","useDrawerDepth","uid","openDrawerDepths","registerDrawer","unregisterDrawer","useDrawerStack","isOpen","t2","layersFromTop","filter","length","animateIn","setAnimateIn","t3","t4","t5","t6","Boolean","t7","join","t8","t9","t10","t11","_jsxs","closeOnBlur","lockBodyScroll","style","zIndex","id","undefined","icon","direction","size","map","_temp","DrawerDepthContext","parentDepth","value","DrawerStackContext","DrawerStackProvider","openDrawers","setOpenDrawers","prev","next","Object","values","action","i","margin","label"],"sources":["../../../src/elements/Drawer/index.tsx"],"sourcesContent":["'use client'\nimport { Modal, useModal } from '@faceless-ui/modal'\nimport React, {\n  createContext,\n  use,\n  useCallback,\n  useEffect,\n  useId,\n  useLayoutEffect,\n  useMemo,\n  useState,\n} from 'react'\n\nimport type { Props, TogglerProps } from './types.js'\n\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Button } from '../Button/index.js'\nimport './index.css'\n\nconst baseClass = 'drawer'\n\nexport const drawerZBase = 100\n\nexport const formatDrawerSlug = ({ slug, depth }: { depth: number; slug: string }): string =>\n  `drawer_${depth}_${slug}`\n\nexport { useDrawerSlug } from './useDrawerSlug.js'\n\nexport const DrawerToggler: React.FC<TogglerProps> = ({\n  slug,\n  buttonStyle,\n  children,\n  className,\n  disabled,\n  onClick,\n  ...rest\n}) => {\n  const { openModal } = useModal()\n\n  const handleClick = useCallback(\n    (e) => {\n      openModal(slug)\n      if (typeof onClick === 'function') {\n        onClick(e)\n      }\n    },\n    [openModal, slug, onClick],\n  )\n\n  if (buttonStyle) {\n    return (\n      <Button\n        buttonStyle={buttonStyle}\n        className={className}\n        disabled={disabled}\n        onClick={handleClick}\n        {...rest}\n      >\n        {children}\n      </Button>\n    )\n  }\n\n  return (\n    <button className={className} disabled={disabled} onClick={handleClick} type=\"button\" {...rest}>\n      {children}\n    </button>\n  )\n}\n\nexport const Drawer: React.FC<Props> = (props) => (\n  <DrawerDepthProvider>\n    <DrawerInner {...props} />\n  </DrawerDepthProvider>\n)\n\nconst DrawerInner: React.FC<Props> = ({\n  slug,\n  children,\n  className,\n  Header,\n  headerActions,\n  hoverTitle,\n  title,\n}) => {\n  const { t } = useTranslation()\n  const { closeModal, modalState } = useModal()\n  const drawerDepth = useDrawerDepth()\n  const uid = useId()\n  const { openDrawerDepths, registerDrawer, unregisterDrawer } = useDrawerStack()\n\n  const isOpen = !!modalState[slug]?.isOpen\n\n  useEffect(() => {\n    if (isOpen) {\n      registerDrawer(uid, drawerDepth)\n\n      return () => unregisterDrawer(uid)\n    }\n  }, [isOpen, uid, drawerDepth, registerDrawer, unregisterDrawer])\n\n  const layersFromTop = openDrawerDepths.filter((depth) => depth > drawerDepth).length\n\n  const [animateIn, setAnimateIn] = useState(isOpen)\n\n  useLayoutEffect(() => {\n    setAnimateIn(isOpen)\n  }, [isOpen])\n\n  if (isOpen) {\n    // IMPORTANT: do not render the drawer until it is explicitly open, this is to avoid large html trees especially when nesting drawers\n    return (\n      <Modal\n        className={[className, baseClass, animateIn && `${baseClass}--is-open`]\n          .filter(Boolean)\n          .join(' ')}\n        // Fixes https://github.com/payloadcms/payload/issues/13778\n        closeOnBlur={false}\n        // Prevents body-scroll-lock from blocking iOS touch scroll inside the drawer; background scroll is handled by CSS (`body:has(.drawer--is-open)`).\n        lockBodyScroll={false}\n        slug={slug}\n        style={\n          {\n            '--drawer-layer-offset': `calc(${layersFromTop} * var(--spacer-3))`,\n            zIndex: drawerZBase + drawerDepth,\n          } as React.CSSProperties\n        }\n      >\n        <div className={`${baseClass}__blur-bg`} />\n        <button\n          aria-label={t('general:close')}\n          className={`${baseClass}__close`}\n          id={`close-drawer__${slug}`}\n          onClick={() => closeModal(slug)}\n          type=\"button\"\n        />\n        <div className={`${baseClass}__content`}>\n          <div className={`${baseClass}__blur-bg-content`} />\n          <div className={`${baseClass}__content-children`}>\n            {Header}\n            {Header === undefined && (\n              <div className={`${baseClass}__header`}>\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                  buttonStyle=\"ghost\"\n                  className={`${baseClass}__header__close`}\n                  icon={<ChevronIcon direction=\"left\" size={24} />}\n                  onClick={() => closeModal(slug)}\n                />\n                <h2 className={`${baseClass}__header__title`} title={hoverTitle ? title : null}>\n                  {title}\n                </h2>\n                {headerActions && headerActions.length > 0 && (\n                  <div className={`${baseClass}__header__actions`}>\n                    {headerActions.map((action, i) => (\n                      <Button\n                        buttonStyle={action.style || 'secondary'}\n                        disabled={action.disabled}\n                        key={i}\n                        margin={false}\n                        onClick={action.onClick}\n                        size=\"medium\"\n                      >\n                        {action.label}\n                      </Button>\n                    ))}\n                  </div>\n                )}\n              </div>\n            )}\n            {children}\n          </div>\n        </div>\n      </Modal>\n    )\n  }\n\n  return null\n}\n\nexport const DrawerDepthContext = createContext(0)\n\nexport const DrawerDepthProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {\n  const parentDepth = useDrawerDepth()\n  const depth = parentDepth + 1\n\n  return <DrawerDepthContext value={depth}>{children}</DrawerDepthContext>\n}\n\nexport const useDrawerDepth = (): number => use(DrawerDepthContext)\n\ntype DrawerStackContextType = {\n  /** Depths of every currently-open drawer, used to compute layer offsets. */\n  openDrawerDepths: number[]\n  registerDrawer: (uid: string, depth: number) => void\n  unregisterDrawer: (uid: string) => void\n}\n\nconst DrawerStackContext = createContext<DrawerStackContextType>({\n  openDrawerDepths: [],\n  registerDrawer: () => {},\n  unregisterDrawer: () => {},\n})\n\n/**\n * Tracks the depths of all currently-open drawers so each drawer can compute\n * its leftward offset relative to the rest of the open stack.\n *\n * Why this is needed: drawers are anchored to the right edge and stack as real\n * layers. When a child drawer opens on top of its parent(s), every drawer\n * beneath it must slide left to peek out from underneath the active (topmost)\n * drawer — and slide back when that child closes. A drawer's own depth is\n * static, so it cannot know on its own whether something deeper is currently\n * open; that requires shared runtime state about the whole open stack.\n *\n * We track real `Drawer` instances (rather than scanning modal state by slug\n * name) so confirmation modals like `leave-without-saving-...` never count, and\n * so stacking never depends on slug naming conventions.\n */\nexport const DrawerStackProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {\n  const [openDrawers, setOpenDrawers] = useState<Record<string, number>>({})\n\n  const registerDrawer = useCallback((uid: string, depth: number) => {\n    setOpenDrawers((prev) => (prev[uid] === depth ? prev : { ...prev, [uid]: depth }))\n  }, [])\n\n  const unregisterDrawer = useCallback((uid: string) => {\n    setOpenDrawers((prev) => {\n      if (!(uid in prev)) {\n        return prev\n      }\n\n      const next = { ...prev }\n      delete next[uid]\n      return next\n    })\n  }, [])\n\n  const value = useMemo<DrawerStackContextType>(\n    () => ({\n      openDrawerDepths: Object.values(openDrawers),\n      registerDrawer,\n      unregisterDrawer,\n    }),\n    [openDrawers, registerDrawer, unregisterDrawer],\n  )\n\n  return <DrawerStackContext value={value}>{children}</DrawerStackContext>\n}\n\nexport const useDrawerStack = (): DrawerStackContextType => use(DrawerStackContext)\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","React","createContext","use","useCallback","useEffect","useId","useLayoutEffect","useMemo","useState","ChevronIcon","useTranslation","Button","Modal","useModal","baseClass","drawerZBase","formatDrawerSlug","slug","depth","useDrawerSlug","DrawerToggler","t0","$","buttonStyle","children","className","disabled","onClick","rest","openModal","t1","e","handleClick","_jsx","type","Drawer","props","DrawerDepthProvider","DrawerInner","Header","headerActions","hoverTitle","title","t","closeModal","modalState","drawerDepth","useDrawerDepth","uid","openDrawerDepths","registerDrawer","unregisterDrawer","useDrawerStack","isOpen","t2","t3","t4","filter","layersFromTop","length","animateIn","setAnimateIn","t5","t6","t7","Boolean","t8","join","t9","t10","t11","t12","_jsxs","closeOnBlur","lockBodyScroll","style","zIndex","id","tabIndex","undefined","icon","direction","size","map","_temp","DrawerDepthContext","parentDepth","value","DrawerStackContext","DrawerStackProvider","Symbol","for","openDrawers","setOpenDrawers","prev","uid_0","prev_0","next","Object","values","action","i","margin","label"],"sources":["../../../src/elements/Drawer/index.tsx"],"sourcesContent":["'use client'\nimport React, {\n  createContext,\n  use,\n  useCallback,\n  useEffect,\n  useId,\n  useLayoutEffect,\n  useMemo,\n  useState,\n} from 'react'\n\nimport type { Props, TogglerProps } from './types.js'\n\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Button } from '../Button/index.js'\nimport { Modal, useModal } from '../Modal/index.js'\nimport './index.css'\n\nconst baseClass = 'drawer'\n\nexport const drawerZBase = 100\n\nexport const formatDrawerSlug = ({ slug, depth }: { depth: number; slug: string }): string =>\n  `drawer_${depth}_${slug}`\n\nexport { useDrawerSlug } from './useDrawerSlug.js'\n\nexport const DrawerToggler: React.FC<TogglerProps> = ({\n  slug,\n  buttonStyle,\n  children,\n  className,\n  disabled,\n  onClick,\n  ...rest\n}) => {\n  const { openModal } = useModal()\n\n  const handleClick = useCallback(\n    (e) => {\n      openModal(slug)\n      if (typeof onClick === 'function') {\n        onClick(e)\n      }\n    },\n    [openModal, slug, onClick],\n  )\n\n  if (buttonStyle) {\n    return (\n      <Button\n        buttonStyle={buttonStyle}\n        className={className}\n        disabled={disabled}\n        onClick={handleClick}\n        {...rest}\n      >\n        {children}\n      </Button>\n    )\n  }\n\n  return (\n    <button className={className} disabled={disabled} onClick={handleClick} type=\"button\" {...rest}>\n      {children}\n    </button>\n  )\n}\n\nexport const Drawer: React.FC<Props> = (props) => (\n  <DrawerDepthProvider>\n    <DrawerInner {...props} />\n  </DrawerDepthProvider>\n)\n\nconst DrawerInner: React.FC<Props> = ({\n  slug,\n  children,\n  className,\n  Header,\n  headerActions,\n  hoverTitle,\n  title,\n}) => {\n  const { t } = useTranslation()\n  const { closeModal, modalState } = useModal()\n  const drawerDepth = useDrawerDepth()\n  const uid = useId()\n  const { openDrawerDepths, registerDrawer, unregisterDrawer } = useDrawerStack()\n\n  const isOpen = !!modalState[slug]?.isOpen\n\n  useEffect(() => {\n    if (isOpen) {\n      registerDrawer(uid, drawerDepth)\n\n      return () => unregisterDrawer(uid)\n    }\n  }, [isOpen, uid, drawerDepth, registerDrawer, unregisterDrawer])\n\n  const layersFromTop = openDrawerDepths.filter((depth) => depth > drawerDepth).length\n\n  const [animateIn, setAnimateIn] = useState(isOpen)\n\n  useLayoutEffect(() => {\n    setAnimateIn(isOpen)\n  }, [isOpen])\n\n  if (isOpen) {\n    // IMPORTANT: do not render the drawer until it is explicitly open, this is to avoid large html trees especially when nesting drawers\n    return (\n      <Modal\n        className={[className, baseClass, animateIn && `${baseClass}--is-open`]\n          .filter(Boolean)\n          .join(' ')}\n        // Fixes https://github.com/payloadcms/payload/issues/13778\n        closeOnBlur={false}\n        // Prevents body-scroll-lock from blocking iOS touch scroll inside the drawer; background scroll is handled by CSS (`body:has(.drawer--is-open)`).\n        lockBodyScroll={false}\n        slug={slug}\n        style={\n          {\n            '--drawer-layer-offset': `calc(${layersFromTop} * var(--spacer-3))`,\n            zIndex: drawerZBase + drawerDepth,\n          } as React.CSSProperties\n        }\n      >\n        <div className={`${baseClass}__blur-bg`} />\n        <button\n          aria-hidden=\"true\"\n          aria-label={t('general:close')}\n          className={`${baseClass}__close`}\n          id={`close-drawer__${slug}`}\n          onClick={() => closeModal(slug)}\n          tabIndex={-1}\n          type=\"button\"\n        />\n        <div className={`${baseClass}__content`}>\n          <div className={`${baseClass}__blur-bg-content`} />\n          <div className={`${baseClass}__content-children`}>\n            {Header}\n            {Header === undefined && (\n              <div className={`${baseClass}__header`}>\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                  buttonStyle=\"ghost\"\n                  className={`${baseClass}__header__close`}\n                  icon={<ChevronIcon direction=\"left\" size={24} />}\n                  onClick={() => closeModal(slug)}\n                />\n                <h2 className={`${baseClass}__header__title`} title={hoverTitle ? title : null}>\n                  {title}\n                </h2>\n                {headerActions && headerActions.length > 0 && (\n                  <div className={`${baseClass}__header__actions`}>\n                    {headerActions.map((action, i) => (\n                      <Button\n                        buttonStyle={action.style || 'secondary'}\n                        disabled={action.disabled}\n                        key={i}\n                        margin={false}\n                        onClick={action.onClick}\n                        size=\"medium\"\n                      >\n                        {action.label}\n                      </Button>\n                    ))}\n                  </div>\n                )}\n              </div>\n            )}\n            {children}\n          </div>\n        </div>\n      </Modal>\n    )\n  }\n\n  return null\n}\n\nexport const DrawerDepthContext = createContext(0)\n\nexport const DrawerDepthProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {\n  const parentDepth = useDrawerDepth()\n  const depth = parentDepth + 1\n\n  return <DrawerDepthContext value={depth}>{children}</DrawerDepthContext>\n}\n\nexport const useDrawerDepth = (): number => use(DrawerDepthContext)\n\ntype DrawerStackContextType = {\n  /** Depths of every currently-open drawer, used to compute layer offsets. */\n  openDrawerDepths: number[]\n  registerDrawer: (uid: string, depth: number) => void\n  unregisterDrawer: (uid: string) => void\n}\n\nconst DrawerStackContext = createContext<DrawerStackContextType>({\n  openDrawerDepths: [],\n  registerDrawer: () => {},\n  unregisterDrawer: () => {},\n})\n\n/**\n * Tracks the depths of all currently-open drawers so each drawer can compute\n * its leftward offset relative to the rest of the open stack.\n *\n * Why this is needed: drawers are anchored to the right edge and stack as real\n * layers. When a child drawer opens on top of its parent(s), every drawer\n * beneath it must slide left to peek out from underneath the active (topmost)\n * drawer — and slide back when that child closes. A drawer's own depth is\n * static, so it cannot know on its own whether something deeper is currently\n * open; that requires shared runtime state about the whole open stack.\n *\n * We track real `Drawer` instances (rather than scanning modal state by slug\n * name) so confirmation modals like `leave-without-saving-...` never count, and\n * so stacking never depends on slug naming conventions.\n */\nexport const DrawerStackProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {\n  const [openDrawers, setOpenDrawers] = useState<Record<string, number>>({})\n\n  const registerDrawer = useCallback((uid: string, depth: number) => {\n    setOpenDrawers((prev) => (prev[uid] === depth ? prev : { ...prev, [uid]: depth }))\n  }, [])\n\n  const unregisterDrawer = useCallback((uid: string) => {\n    setOpenDrawers((prev) => {\n      if (!(uid in prev)) {\n        return prev\n      }\n\n      const next = { ...prev }\n      delete next[uid]\n      return next\n    })\n  }, [])\n\n  const value = useMemo<DrawerStackContextType>(\n    () => ({\n      openDrawerDepths: Object.values(openDrawers),\n      registerDrawer,\n      unregisterDrawer,\n    }),\n    [openDrawers, registerDrawer, unregisterDrawer],\n  )\n\n  return <DrawerStackContext value={value}>{children}</DrawerStackContext>\n}\n\nexport const useDrawerStack = (): DrawerStackContextType => use(DrawerStackContext)\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/Drawer/types.d.ts

@@ -3,7 +3,7 @@ export type DrawerHeaderAction = {
     readonly disabled?: boolean;
     readonly label: string;
     readonly onClick: () => void;
-    readonly style?: 'dashed' | 'destructive' | 'ghost' | 'pill' | 'primary' | 'secondary';
+    readonly style?: 'dashed' | 'destructive' | 'ghost' | 'link' | 'pill' | 'primary' | 'primary-ghost' | 'secondary';
 };
 export type Props = {
     readonly children: React.ReactNode;
@@ -15,7 +15,7 @@ export type Props = {
     readonly title?: string;
 };
 export type TogglerProps = {
-    buttonStyle?: 'dashed' | 'destructive' | 'ghost' | 'pill' | 'primary' | 'secondary';
+    buttonStyle?: 'dashed' | 'destructive' | 'ghost' | 'link' | 'pill' | 'primary' | 'primary-ghost' | 'secondary';
     children: React.ReactNode;
     className?: string;
     disabled?: boolean;

package/dist/elements/Drawer/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/Drawer/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAE3C,MAAM,MAAM,kBAAkB,GAAG;IAC/B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAC3B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,OAAO,EAAE,MAAM,IAAI,CAAA;IAC5B,QAAQ,CAAC,KAAK,CAAC,EAAE,QAAQ,GAAG,aAAa,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,GAAG,WAAW,CAAA;CACvF,CAAA;AAED,MAAM,MAAM,KAAK,GAAG;IAClB,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IAClC,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACjC,QAAQ,CAAC,aAAa,CAAC,EAAE,aAAa,CAAC,kBAAkB,CAAC,CAAA;IAC1D,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO,CAAA;IAC7B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CACxB,CAAA;AAED,MAAM,MAAM,YAAY,GAAG;IACzB,WAAW,CAAC,EAAE,QAAQ,GAAG,aAAa,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,GAAG,WAAW,CAAA;IACnF,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,gBAAgB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IACtC,IAAI,EAAE,MAAM,CAAA;IACZ,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB,GAAG,cAAc,CAAC,iBAAiB,CAAC,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/Drawer/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAE3C,MAAM,MAAM,kBAAkB,GAAG;IAC/B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAC3B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,OAAO,EAAE,MAAM,IAAI,CAAA;IAC5B,QAAQ,CAAC,KAAK,CAAC,EACX,QAAQ,GACR,aAAa,GACb,OAAO,GACP,MAAM,GACN,MAAM,GACN,SAAS,GACT,eAAe,GACf,WAAW,CAAA;CAChB,CAAA;AAED,MAAM,MAAM,KAAK,GAAG;IAClB,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IAClC,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACjC,QAAQ,CAAC,aAAa,CAAC,EAAE,aAAa,CAAC,kBAAkB,CAAC,CAAA;IAC1D,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO,CAAA;IAC7B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CACxB,CAAA;AAED,MAAM,MAAM,YAAY,GAAG;IACzB,WAAW,CAAC,EACR,QAAQ,GACR,aAAa,GACb,OAAO,GACP,MAAM,GACN,MAAM,GACN,SAAS,GACT,eAAe,GACf,WAAW,CAAA;IACf,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,gBAAgB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IACtC,IAAI,EAAE,MAAM,CAAA;IACZ,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB,GAAG,cAAc,CAAC,iBAAiB,CAAC,CAAA"}

package/dist/elements/Drawer/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":[],"sources":["../../../src/elements/Drawer/types.ts"],"sourcesContent":["import type { HTMLAttributes } from 'react'\n\nexport type DrawerHeaderAction = {\n  readonly disabled?: boolean\n  readonly label: string\n  readonly onClick: () => void\n  readonly style?: 'dashed' | 'destructive' | 'ghost' | 'pill' | 'primary' | 'secondary'\n}\n\nexport type Props = {\n  readonly children: React.ReactNode\n  readonly className?: string\n  readonly Header?: React.ReactNode\n  readonly headerActions?: ReadonlyArray<DrawerHeaderAction>\n  readonly hoverTitle?: boolean\n  readonly slug: string\n  readonly title?: string\n}\n\nexport type TogglerProps = {\n  buttonStyle?: 'dashed' | 'destructive' | 'ghost' | 'pill' | 'primary' | 'secondary'\n  children: React.ReactNode\n  className?: string\n  disabled?: boolean\n  extraButtonProps?: Record<string, any>\n  slug: string\n  tooltip?: string\n} & HTMLAttributes<HTMLButtonElement>\n"],"mappings":"AAmBA","ignoreList":[]}
+{"version":3,"file":"types.js","names":[],"sources":["../../../src/elements/Drawer/types.ts"],"sourcesContent":["import type { HTMLAttributes } from 'react'\n\nexport type DrawerHeaderAction = {\n  readonly disabled?: boolean\n  readonly label: string\n  readonly onClick: () => void\n  readonly style?:\n    | 'dashed'\n    | 'destructive'\n    | 'ghost'\n    | 'link'\n    | 'pill'\n    | 'primary'\n    | 'primary-ghost'\n    | 'secondary'\n}\n\nexport type Props = {\n  readonly children: React.ReactNode\n  readonly className?: string\n  readonly Header?: React.ReactNode\n  readonly headerActions?: ReadonlyArray<DrawerHeaderAction>\n  readonly hoverTitle?: boolean\n  readonly slug: string\n  readonly title?: string\n}\n\nexport type TogglerProps = {\n  buttonStyle?:\n    | 'dashed'\n    | 'destructive'\n    | 'ghost'\n    | 'link'\n    | 'pill'\n    | 'primary'\n    | 'primary-ghost'\n    | 'secondary'\n  children: React.ReactNode\n  className?: string\n  disabled?: boolean\n  extraButtonProps?: Record<string, any>\n  slug: string\n  tooltip?: string\n} & HTMLAttributes<HTMLButtonElement>\n"],"mappings":"AA2BA","ignoreList":[]}

package/dist/elements/Drawer/useDrawerSlug.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDrawerSlug.js","names":["c","_c","useId","useEditDepth","formatDrawerSlug","useDrawerSlug","slug","$","uuid","editDepth","t0","t1","depth"],"sources":["../../../src/elements/Drawer/useDrawerSlug.tsx"],"sourcesContent":["'use client'\nimport { useId } from 'react'\n\nimport { useEditDepth } from '../../providers/EditDepth/index.js'\nimport { formatDrawerSlug } from './index.js'\n\nexport const useDrawerSlug = (slug: string): string => {\n  const uuid = useId()\n  const editDepth = useEditDepth()\n  return formatDrawerSlug({\n    slug: `${slug}-${uuid}`,\n    depth: editDepth,\n  })\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;AACA,SAASC,KAAK,QAAQ;AAEtB,SAASC,YAAY,QAAQ;AAC7B,SAASC,gBAAgB,QAAQ;AAEjC,OAAO,MAAMC,aAAA,GAAgBC,IAAA;EAAA,MAAAC,CAAA,GAAAN,EAAA;EAC3B,MAAAO,IAAA,GAAaN,KAAA;EACb,MAAAO,SAAA,GAAkBN,YAAA;EAEV,MAAAO,EAAA,MAAGJ,IAAA,IAAQE,IAAA,EAAM;EAAA,IAAAG,EAAA;EAAA,IAAAJ,CAAA,QAAAE,SAAA,IAAAF,CAAA,QAAAG,EAAA;IADlBC,EAAA,GAAAP,gBAAA;MAAAE,IAAA,EACCI,EAAiB;MAAAE,KAAA,EAChBH;IAAA,CACT;IAAAF,CAAA,MAAAE,SAAA;IAAAF,CAAA,MAAAG,EAAA;IAAAH,CAAA,MAAAI,EAAA;EAAA;IAAAA,EAAA,GAAAJ,CAAA;EAAA;EAAA,OAHOI,EAGP;AAAA,CACF","ignoreList":[]}
+{"version":3,"file":"useDrawerSlug.js","names":["c","_c","useId","useEditDepth","formatDrawerSlug","useDrawerSlug","slug","$","uuid","editDepth","t0","t1","depth"],"sources":["../../../src/elements/Drawer/useDrawerSlug.tsx"],"sourcesContent":["'use client'\nimport { useId } from 'react'\n\nimport { useEditDepth } from '../../providers/EditDepth/index.js'\nimport { formatDrawerSlug } from './index.js'\n\nexport const useDrawerSlug = (slug: string): string => {\n  const uuid = useId()\n  const editDepth = useEditDepth()\n  return formatDrawerSlug({\n    slug: `${slug}-${uuid}`,\n    depth: editDepth,\n  })\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;AACA,SAASC,KAAK,QAAQ;AAEtB,SAASC,YAAY,QAAQ;AAC7B,SAASC,gBAAgB,QAAQ;AAEjC,OAAO,MAAMC,aAAA,GAAgBC,IAAA;EAAA,MAAAC,CAAA,GAAAN,EAAA;EAC3B,MAAAO,IAAA,GAAaN,KAAA;EACb,MAAAO,SAAA,GAAkBN,YAAA;EAEV,MAAAO,EAAA,MAAGJ,IAAA,IAAQE,IAAA,EAAM;EAAA,IAAAG,EAAA;EAAA,IAAAJ,CAAA,QAAAE,SAAA,IAAAF,CAAA,QAAAG,EAAA;IADlBC,EAAA,GAAAP,gBAAA,CAAiB;MAAAE,IAAA,EAChBI,EAAiB;MAAAE,KAAA,EAChBH;IACT;IAAAF,CAAA,MAAAE,SAAA;IAAAF,CAAA,MAAAG,EAAA;IAAAH,CAAA,MAAAI,EAAA;EAAA;IAAAA,EAAA,GAAAJ,CAAA;EAAA;EAAA,OAHOI,EAGP;AAAA,CACF","ignoreList":[]}