@payloadcms/ui 3.39.0-internal.32c7661 → 3.39.0

package/dist/elements/FolderView/DraggableTableRow/index.js

@@ -0,0 +1,64 @@
+'use client';
+
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useDroppable } from '@dnd-kit/core';
+import React from 'react';
+import { DraggableWithClick } from '../DraggableWithClick/index.js';
+import { HiddenCell, TableCell } from '../SimpleTable/index.js';
+import './index.scss';
+const baseClass = 'draggable-table-row';
+export function DraggableTableRow({
+  id,
+  columns,
+  disabled = false,
+  dragData,
+  isDroppable: _isDroppable,
+  isFocused,
+  isSelected,
+  isSelecting,
+  itemKey,
+  onClick,
+  onKeyDown
+}) {
+  const isDroppable = !disabled && _isDroppable && !isSelected;
+  const {
+    isOver,
+    setNodeRef
+  } = useDroppable({
+    id,
+    data: dragData,
+    disabled: !isDroppable
+  });
+  const ref = React.useRef(null);
+  React.useEffect(() => {
+    const copyOfRef = ref.current;
+    if (isFocused && ref.current) {
+      ref.current.focus();
+    } else if (!isFocused && ref.current) {
+      ref.current.blur();
+    }
+    return () => {
+      if (copyOfRef) {
+        copyOfRef.blur();
+      }
+    };
+  }, [isFocused]);
+  return /*#__PURE__*/_jsxs(DraggableWithClick, {
+    as: "tr",
+    className: [baseClass, isSelected && `${baseClass}--selected`, isSelecting && `${baseClass}--selecting`, disabled && `${baseClass}--disabled`, isFocused && `${baseClass}--focused`, isOver && `${baseClass}--over`].filter(Boolean).join(' '),
+    id: itemKey,
+    onClick: onClick,
+    onKeyDown: onKeyDown,
+    ref: ref,
+    children: [columns.map((col, i) => /*#__PURE__*/_jsx(TableCell, {
+      className: [`${baseClass}__cell-content`, i === 0 && `${baseClass}__first-td`, i === columns.length - 1 && `${baseClass}__last-td`].filter(Boolean).join(' '),
+      children: col
+    }, `${itemKey}-${i}`)), isDroppable ? /*#__PURE__*/_jsx(HiddenCell, {
+      children: /*#__PURE__*/_jsx("div", {
+        className: `${baseClass}__drop-area`,
+        ref: setNodeRef
+      })
+    }) : null]
+  }, itemKey);
+}
+//# sourceMappingURL=index.js.map

package/dist/elements/FolderView/DraggableTableRow/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["useDroppable","React","DraggableWithClick","HiddenCell","TableCell","baseClass","DraggableTableRow","id","columns","disabled","dragData","isDroppable","_isDroppable","isFocused","isSelected","isSelecting","itemKey","onClick","onKeyDown","isOver","setNodeRef","data","ref","useRef","useEffect","copyOfRef","current","focus","blur","_jsxs","as","className","filter","Boolean","join","map","col","i","_jsx","length"],"sources":["../../../../src/elements/FolderView/DraggableTableRow/index.tsx"],"sourcesContent":["'use client'\nimport { useDroppable } from '@dnd-kit/core'\nimport React from 'react'\n\nimport { DraggableWithClick } from '../DraggableWithClick/index.js'\nimport { HiddenCell, TableCell } from '../SimpleTable/index.js'\nimport './index.scss'\n\nconst baseClass = 'draggable-table-row'\ntype Props = {\n  readonly columns: React.ReactNode[]\n  readonly disabled?: boolean\n  readonly dragData?: Record<string, unknown>\n  readonly id: number | string\n  readonly isDroppable?: boolean\n  readonly isFocused?: boolean\n  readonly isSelected?: boolean\n  readonly isSelecting?: boolean\n  readonly itemKey: string\n  readonly onClick?: (e: React.MouseEvent) => void\n  readonly onKeyDown?: (e: React.KeyboardEvent) => void\n}\nexport function DraggableTableRow({\n  id,\n  columns,\n  disabled = false,\n  dragData,\n  isDroppable: _isDroppable,\n  isFocused,\n  isSelected,\n  isSelecting,\n  itemKey,\n  onClick,\n  onKeyDown,\n}: Props) {\n  const isDroppable = !disabled && _isDroppable && !isSelected\n  const { isOver, setNodeRef } = useDroppable({\n    id,\n    data: dragData,\n    disabled: !isDroppable,\n  })\n  const ref = React.useRef(null)\n\n  React.useEffect(() => {\n    const copyOfRef = ref.current\n    if (isFocused && ref.current) {\n      ref.current.focus()\n    } else if (!isFocused && ref.current) {\n      ref.current.blur()\n    }\n\n    return () => {\n      if (copyOfRef) {\n        copyOfRef.blur()\n      }\n    }\n  }, [isFocused])\n\n  return (\n    <DraggableWithClick\n      as=\"tr\"\n      className={[\n        baseClass,\n        isSelected && `${baseClass}--selected`,\n        isSelecting && `${baseClass}--selecting`,\n        disabled && `${baseClass}--disabled`,\n        isFocused && `${baseClass}--focused`,\n        isOver && `${baseClass}--over`,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      id={itemKey}\n      key={itemKey}\n      onClick={onClick}\n      onKeyDown={onKeyDown}\n      ref={ref}\n    >\n      {columns.map((col, i) => (\n        <TableCell\n          className={[\n            `${baseClass}__cell-content`,\n            i === 0 && `${baseClass}__first-td`,\n            i === columns.length - 1 && `${baseClass}__last-td`,\n          ]\n            .filter(Boolean)\n            .join(' ')}\n          key={`${itemKey}-${i}`}\n        >\n          {col}\n        </TableCell>\n      ))}\n\n      {isDroppable ? (\n        <HiddenCell>\n          <div className={`${baseClass}__drop-area`} ref={setNodeRef} />\n        </HiddenCell>\n      ) : null}\n    </DraggableWithClick>\n  )\n}\n"],"mappings":"AAAA;;;AACA,SAASA,YAAY,QAAQ;AAC7B,OAAOC,KAAA,MAAW;AAElB,SAASC,kBAAkB,QAAQ;AACnC,SAASC,UAAU,EAAEC,SAAS,QAAQ;AACtC,OAAO;AAEP,MAAMC,SAAA,GAAY;AAclB,OAAO,SAASC,kBAAkB;EAChCC,EAAE;EACFC,OAAO;EACPC,QAAA,GAAW,KAAK;EAChBC,QAAQ;EACRC,WAAA,EAAaC,YAAY;EACzBC,SAAS;EACTC,UAAU;EACVC,WAAW;EACXC,OAAO;EACPC,OAAO;EACPC;AAAS,CACH;EACN,MAAMP,WAAA,GAAc,CAACF,QAAA,IAAYG,YAAA,IAAgB,CAACE,UAAA;EAClD,MAAM;IAAEK,MAAM;IAAEC;EAAU,CAAE,GAAGpB,YAAA,CAAa;IAC1CO,EAAA;IACAc,IAAA,EAAMX,QAAA;IACND,QAAA,EAAU,CAACE;EACb;EACA,MAAMW,GAAA,GAAMrB,KAAA,CAAMsB,MAAM,CAAC;EAEzBtB,KAAA,CAAMuB,SAAS,CAAC;IACd,MAAMC,SAAA,GAAYH,GAAA,CAAII,OAAO;IAC7B,IAAIb,SAAA,IAAaS,GAAA,CAAII,OAAO,EAAE;MAC5BJ,GAAA,CAAII,OAAO,CAACC,KAAK;IACnB,OAAO,IAAI,CAACd,SAAA,IAAaS,GAAA,CAAII,OAAO,EAAE;MACpCJ,GAAA,CAAII,OAAO,CAACE,IAAI;IAClB;IAEA,OAAO;MACL,IAAIH,SAAA,EAAW;QACbA,SAAA,CAAUG,IAAI;MAChB;IACF;EACF,GAAG,CAACf,SAAA,CAAU;EAEd,oBACEgB,KAAA,CAAC3B,kBAAA;IACC4B,EAAA,EAAG;IACHC,SAAA,EAAW,CACT1B,SAAA,EACAS,UAAA,IAAc,GAAGT,SAAA,YAAqB,EACtCU,WAAA,IAAe,GAAGV,SAAA,aAAsB,EACxCI,QAAA,IAAY,GAAGJ,SAAA,YAAqB,EACpCQ,SAAA,IAAa,GAAGR,SAAA,WAAoB,EACpCc,MAAA,IAAU,GAAGd,SAAA,QAAiB,CAC/B,CACE2B,MAAM,CAACC,OAAA,EACPC,IAAI,CAAC;IACR3B,EAAA,EAAIS,OAAA;IAEJC,OAAA,EAASA,OAAA;IACTC,SAAA,EAAWA,SAAA;IACXI,GAAA,EAAKA,GAAA;eAEJd,OAAA,CAAQ2B,GAAG,CAAC,CAACC,GAAA,EAAKC,CAAA,kBACjBC,IAAA,CAAClC,SAAA;MACC2B,SAAA,EAAW,CACT,GAAG1B,SAAA,gBAAyB,EAC5BgC,CAAA,KAAM,KAAK,GAAGhC,SAAA,YAAqB,EACnCgC,CAAA,KAAM7B,OAAA,CAAQ+B,MAAM,GAAG,KAAK,GAAGlC,SAAA,WAAoB,CACpD,CACE2B,MAAM,CAACC,OAAA,EACPC,IAAI,CAAC;gBAGPE;OAFI,GAAGpB,OAAA,IAAWqB,CAAA,EAAG,IAMzB1B,WAAA,gBACC2B,IAAA,CAACnC,UAAA;gBACC,aAAAmC,IAAA,CAAC;QAAIP,SAAA,EAAW,GAAG1B,SAAA,aAAsB;QAAEiB,GAAA,EAAKF;;SAEhD;KAxBCJ,OAAA;AA2BX","ignoreList":[]}

package/dist/elements/FolderView/DraggableTableRow/index.scss

@@ -0,0 +1,135 @@
+@layer payload-default {
+  .draggable-table-row {
+    // vars
+    --border-top-left-radius: var(--style-radius-m);
+    --border-top-right-radius: var(--style-radius-m);
+    --border-bottom-right-radius: var(--style-radius-m);
+    --border-bottom-left-radius: var(--style-radius-m);
+    --row-text-color: var(--theme-text);
+    --row-icon-opacity: 1;
+    --row-icon-color: var(--theme-elevation-400);
+    --row-bg-color: transparent;
+    --row-opacity: 1;
+    --foreground-opacity: 0;
+    --row-cursor: pointer;
+
+    isolation: isolate;
+    opacity: var(--row-opacity);
+    cursor: var(--row-cursor);
+
+    &__first-td {
+      border-top-left-radius: var(--border-top-left-radius);
+      border-bottom-left-radius: var(--border-bottom-left-radius);
+    }
+
+    td.draggable-table-row__last-td {
+      border-top-right-radius: var(--border-top-right-radius);
+      border-bottom-right-radius: var(--border-bottom-right-radius);
+      padding-inline-end: calc(var(--base) * (0.8));
+    }
+
+    &:not(.draggable-table-row--selected):nth-child(odd) {
+      --row-bg-color: var(--theme-elevation-50);
+    }
+
+    &:nth-child(odd) {
+      &:after {
+        display: none;
+      }
+    }
+
+    &--focused {
+      &.draggable-table-row:nth-child(odd),
+      &.draggable-table-row:nth-child(even) {
+        --row-bg-color: var(--theme-elevation-100);
+      }
+    }
+
+    &--disabled {
+      --row-cursor: no-drop;
+      --row-opacity: 0.6;
+    }
+
+    &--selected {
+      --row-icon-color: var(--theme-success-800);
+      --row-icon-opacity: 0.6;
+      &.draggable-table-row:nth-child(odd),
+      &.draggable-table-row:nth-child(even) {
+        --row-bg-color: var(--theme-success-150);
+      }
+    }
+
+    &--selected + .draggable-table-row--selected {
+      --border-top-left-radius: 0;
+      --border-top-right-radius: 0;
+    }
+
+    &--selected:not(:last-child):has(+ .draggable-table-row--selected) {
+      --border-bottom-left-radius: 0;
+      --border-bottom-right-radius: 0;
+    }
+
+    &--over {
+      &.draggable-table-row:nth-child(odd),
+      &.draggable-table-row:nth-child(even) {
+        --row-bg-color: var(--theme-elevation-150);
+      }
+    }
+
+    &__cell-content {
+      position: relative;
+      z-index: 1;
+      color: var(--row-text-color);
+      background-color: var(--row-bg-color);
+    }
+
+    &__drag-handle {
+      position: absolute;
+      top: 0;
+      width: 100%;
+      height: 100%;
+      left: 0;
+      right: 0;
+      cursor: var(--row-cursor);
+      background: none;
+      border: none;
+      padding: 0;
+      outline-offset: 0;
+      z-index: 2;
+
+      &:focus-visible {
+        box-shadow: inset 0px 0px 0px 2px var(--theme-text);
+        outline: none;
+      }
+    }
+
+    &__drop-area {
+      position: absolute;
+      top: 0;
+      width: 100%;
+      height: 100%;
+      left: 0;
+      right: 0;
+    }
+
+    .simple-table {
+      &__hidden-cell {
+        position: absolute;
+        padding: 0;
+        width: 100%;
+        height: 100%;
+        left: 0;
+        right: 0;
+      }
+    }
+
+    &.draggable-table-row {
+      position: relative;
+    }
+
+    .icon {
+      color: var(--row-icon-color);
+      opacity: var(--row-icon-opacity);
+    }
+  }
+}

package/dist/elements/FolderView/DraggableWithClick/index.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import './index.scss';
+type Props = {
+    readonly as?: React.ElementType;
+    readonly children?: React.ReactNode;
+    readonly className?: string;
+    readonly id: string;
+    readonly onClick: (e: React.MouseEvent) => void;
+    readonly onKeyDown?: (e: React.KeyboardEvent) => void;
+    readonly ref?: React.RefObject<HTMLDivElement>;
+    readonly thresholdPixels?: number;
+};
+export declare const DraggableWithClick: ({ id, as, children, className, onClick, onKeyDown, ref, thresholdPixels, }: Props) => React.JSX.Element;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/elements/FolderView/DraggableWithClick/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/FolderView/DraggableWithClick/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAiB,MAAM,OAAO,CAAA;AAErC,OAAO,cAAc,CAAA;AAIrB,KAAK,KAAK,GAAG;IACX,QAAQ,CAAC,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;IAC/B,QAAQ,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACnC,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,OAAO,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAA;IAC/C,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,KAAK,IAAI,CAAA;IACrD,QAAQ,CAAC,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAA;IAC9C,QAAQ,CAAC,eAAe,CAAC,EAAE,MAAM,CAAA;CAClC,CAAA;AAED,eAAO,MAAM,kBAAkB,+EAS5B,KAAK,sBA+DP,CAAA"}

package/dist/elements/FolderView/DraggableWithClick/index.js

@@ -0,0 +1,81 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useDraggable } from '@dnd-kit/core';
+import React, { useRef } from 'react';
+import './index.scss';
+const baseClass = 'draggable-with-click';
+export const DraggableWithClick = ({
+  id,
+  as = 'div',
+  children,
+  className,
+  onClick,
+  onKeyDown,
+  ref,
+  thresholdPixels = 3
+}) => {
+  const {
+    attributes,
+    listeners,
+    setNodeRef
+  } = useDraggable({
+    id
+  });
+  const initialPos = useRef({
+    x: 0,
+    y: 0
+  });
+  const isDragging = useRef(false);
+  const handlePointerDown = e => {
+    initialPos.current = {
+      x: e.clientX,
+      y: e.clientY
+    };
+    isDragging.current = false;
+    const handlePointerMove = moveEvent => {
+      const deltaX = Math.abs(moveEvent.clientX - initialPos.current.x);
+      const deltaY = Math.abs(moveEvent.clientY - initialPos.current.y);
+      if (deltaX > thresholdPixels || deltaY > thresholdPixels) {
+        isDragging.current = true;
+        if (listeners?.onPointerDown) {
+          listeners.onPointerDown(e);
+          // when the user starts dragging
+          // - call the click handler
+          // - remove the pointermove listener
+          onClick(moveEvent);
+        }
+        window.removeEventListener('pointermove', handlePointerMove);
+      }
+    };
+    const cleanup = () => {
+      window.removeEventListener('pointermove', handlePointerMove);
+      window.removeEventListener('pointerup', handlePointerUp);
+    };
+    const handlePointerUp = upEvent => {
+      cleanup();
+      if (!isDragging.current) {
+        // if the user did not drag the element
+        // - call the click handler
+        onClick(upEvent);
+      }
+    };
+    window.addEventListener('pointermove', handlePointerMove);
+    window.addEventListener('pointerup', handlePointerUp);
+  };
+  const Component = as || 'div';
+  return /*#__PURE__*/_jsx(Component, {
+    role: "button",
+    tabIndex: 0,
+    ...attributes,
+    className: `${baseClass} ${className || ''}`.trim(),
+    onKeyDown: onKeyDown,
+    onPointerDown: onClick ? handlePointerDown : undefined,
+    ref: node => {
+      setNodeRef(node);
+      if (ref) {
+        ref.current = node;
+      }
+    },
+    children: children
+  });
+};
+//# sourceMappingURL=index.js.map

package/dist/elements/FolderView/DraggableWithClick/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["useDraggable","React","useRef","baseClass","DraggableWithClick","id","as","children","className","onClick","onKeyDown","ref","thresholdPixels","attributes","listeners","setNodeRef","initialPos","x","y","isDragging","handlePointerDown","e","current","clientX","clientY","handlePointerMove","moveEvent","deltaX","Math","abs","deltaY","onPointerDown","window","removeEventListener","cleanup","handlePointerUp","upEvent","addEventListener","Component","_jsx","role","tabIndex","trim","undefined","node"],"sources":["../../../../src/elements/FolderView/DraggableWithClick/index.tsx"],"sourcesContent":["import { useDraggable } from '@dnd-kit/core'\nimport React, { useRef } from 'react'\n\nimport './index.scss'\n\nconst baseClass = 'draggable-with-click'\n\ntype Props = {\n  readonly as?: React.ElementType\n  readonly children?: React.ReactNode\n  readonly className?: string\n  readonly id: string\n  readonly onClick: (e: React.MouseEvent) => void\n  readonly onKeyDown?: (e: React.KeyboardEvent) => void\n  readonly ref?: React.RefObject<HTMLDivElement>\n  readonly thresholdPixels?: number\n}\n\nexport const DraggableWithClick = ({\n  id,\n  as = 'div',\n  children,\n  className,\n  onClick,\n  onKeyDown,\n  ref,\n  thresholdPixels = 3,\n}: Props) => {\n  const { attributes, listeners, setNodeRef } = useDraggable({ id })\n  const initialPos = useRef({ x: 0, y: 0 })\n  const isDragging = useRef(false)\n\n  const handlePointerDown = (e) => {\n    initialPos.current = { x: e.clientX, y: e.clientY }\n    isDragging.current = false\n\n    const handlePointerMove = (moveEvent) => {\n      const deltaX = Math.abs(moveEvent.clientX - initialPos.current.x)\n      const deltaY = Math.abs(moveEvent.clientY - initialPos.current.y)\n      if (deltaX > thresholdPixels || deltaY > thresholdPixels) {\n        isDragging.current = true\n        if (listeners?.onPointerDown) {\n          listeners.onPointerDown(e)\n          // when the user starts dragging\n          // - call the click handler\n          // - remove the pointermove listener\n          onClick(moveEvent)\n        }\n        window.removeEventListener('pointermove', handlePointerMove)\n      }\n    }\n\n    const cleanup = () => {\n      window.removeEventListener('pointermove', handlePointerMove)\n      window.removeEventListener('pointerup', handlePointerUp)\n    }\n\n    const handlePointerUp = (upEvent) => {\n      cleanup()\n      if (!isDragging.current) {\n        // if the user did not drag the element\n        // - call the click handler\n        onClick(upEvent)\n      }\n    }\n\n    window.addEventListener('pointermove', handlePointerMove)\n    window.addEventListener('pointerup', handlePointerUp)\n  }\n\n  const Component = as || 'div'\n\n  return (\n    <Component\n      role=\"button\"\n      tabIndex={0}\n      {...attributes}\n      className={`${baseClass} ${className || ''}`.trim()}\n      onKeyDown={onKeyDown}\n      onPointerDown={onClick ? handlePointerDown : undefined}\n      ref={(node) => {\n        setNodeRef(node)\n        if (ref) {\n          ref.current = node\n        }\n      }}\n    >\n      {children}\n    </Component>\n  )\n}\n"],"mappings":";AAAA,SAASA,YAAY,QAAQ;AAC7B,OAAOC,KAAA,IAASC,MAAM,QAAQ;AAE9B,OAAO;AAEP,MAAMC,SAAA,GAAY;AAalB,OAAO,MAAMC,kBAAA,GAAqBA,CAAC;EACjCC,EAAE;EACFC,EAAA,GAAK,KAAK;EACVC,QAAQ;EACRC,SAAS;EACTC,OAAO;EACPC,SAAS;EACTC,GAAG;EACHC,eAAA,GAAkB;AAAC,CACb;EACN,MAAM;IAAEC,UAAU;IAAEC,SAAS;IAAEC;EAAU,CAAE,GAAGf,YAAA,CAAa;IAAEK;EAAG;EAChE,MAAMW,UAAA,GAAad,MAAA,CAAO;IAAEe,CAAA,EAAG;IAAGC,CAAA,EAAG;EAAE;EACvC,MAAMC,UAAA,GAAajB,MAAA,CAAO;EAE1B,MAAMkB,iBAAA,GAAqBC,CAAA;IACzBL,UAAA,CAAWM,OAAO,GAAG;MAAEL,CAAA,EAAGI,CAAA,CAAEE,OAAO;MAAEL,CAAA,EAAGG,CAAA,CAAEG;IAAQ;IAClDL,UAAA,CAAWG,OAAO,GAAG;IAErB,MAAMG,iBAAA,GAAqBC,SAAA;MACzB,MAAMC,MAAA,GAASC,IAAA,CAAKC,GAAG,CAACH,SAAA,CAAUH,OAAO,GAAGP,UAAA,CAAWM,OAAO,CAACL,CAAC;MAChE,MAAMa,MAAA,GAASF,IAAA,CAAKC,GAAG,CAACH,SAAA,CAAUF,OAAO,GAAGR,UAAA,CAAWM,OAAO,CAACJ,CAAC;MAChE,IAAIS,MAAA,GAASf,eAAA,IAAmBkB,MAAA,GAASlB,eAAA,EAAiB;QACxDO,UAAA,CAAWG,OAAO,GAAG;QACrB,IAAIR,SAAA,EAAWiB,aAAA,EAAe;UAC5BjB,SAAA,CAAUiB,aAAa,CAACV,CAAA;UACxB;UACA;UACA;UACAZ,OAAA,CAAQiB,SAAA;QACV;QACAM,MAAA,CAAOC,mBAAmB,CAAC,eAAeR,iBAAA;MAC5C;IACF;IAEA,MAAMS,OAAA,GAAUA,CAAA;MACdF,MAAA,CAAOC,mBAAmB,CAAC,eAAeR,iBAAA;MAC1CO,MAAA,CAAOC,mBAAmB,CAAC,aAAaE,eAAA;IAC1C;IAEA,MAAMA,eAAA,GAAmBC,OAAA;MACvBF,OAAA;MACA,IAAI,CAACf,UAAA,CAAWG,OAAO,EAAE;QACvB;QACA;QACAb,OAAA,CAAQ2B,OAAA;MACV;IACF;IAEAJ,MAAA,CAAOK,gBAAgB,CAAC,eAAeZ,iBAAA;IACvCO,MAAA,CAAOK,gBAAgB,CAAC,aAAaF,eAAA;EACvC;EAEA,MAAMG,SAAA,GAAYhC,EAAA,IAAM;EAExB,oBACEiC,IAAA,CAACD,SAAA;IACCE,IAAA,EAAK;IACLC,QAAA,EAAU;IACT,GAAG5B,UAAU;IACdL,SAAA,EAAW,GAAGL,SAAA,IAAaK,SAAA,IAAa,IAAI,CAACkC,IAAI;IACjDhC,SAAA,EAAWA,SAAA;IACXqB,aAAA,EAAetB,OAAA,GAAUW,iBAAA,GAAoBuB,SAAA;IAC7ChC,GAAA,EAAMiC,IAAA;MACJ7B,UAAA,CAAW6B,IAAA;MACX,IAAIjC,GAAA,EAAK;QACPA,GAAA,CAAIW,OAAO,GAAGsB,IAAA;MAChB;IACF;cAECrC;;AAGP","ignoreList":[]}

package/dist/elements/FolderView/DraggableWithClick/index.scss

@@ -0,0 +1,5 @@
+@layer payload-default {
+  .draggable-with-click {
+    user-select: none;
+  }
+}

package/dist/elements/FolderView/Drawers/DrawerHeader/index.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import './index.scss';
+type DrawerHeaderArgs = {
+    readonly onCancel?: () => void;
+    readonly onSave?: () => void;
+    readonly title: string;
+};
+export declare const DrawerHeader: ({ onCancel, onSave, title }: DrawerHeaderArgs) => React.JSX.Element;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/elements/FolderView/Drawers/DrawerHeader/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/elements/FolderView/Drawers/DrawerHeader/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,cAAc,CAAA;AAIrB,KAAK,gBAAgB,GAAG;IACtB,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IAC9B,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;IAC5B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;CACvB,CAAA;AACD,eAAO,MAAM,YAAY,gCAAiC,gBAAgB,sBAoBzE,CAAA"}

package/dist/elements/FolderView/Drawers/DrawerHeader/index.js

@@ -0,0 +1,55 @@
+'use client';
+
+import { c as _c } from "react/compiler-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { FormSubmit } from '../../../../forms/Submit/index.js';
+import { useTranslation } from '../../../../providers/Translation/index.js';
+import { Button } from '../../../Button/index.js';
+import './index.scss';
+const baseClass = 'drawerHeader';
+export const DrawerHeader = t0 => {
+  const $ = _c(5);
+  const {
+    onCancel,
+    onSave,
+    title
+  } = t0;
+  const {
+    t
+  } = useTranslation();
+  let t1;
+  if ($[0] !== onCancel || $[1] !== onSave || $[2] !== t || $[3] !== title) {
+    t1 = _jsx("div", {
+      className: baseClass,
+      children: _jsxs("div", {
+        className: `${baseClass}__content`,
+        children: [_jsx("h1", {
+          className: `${baseClass}__title`,
+          children: title
+        }), _jsxs("div", {
+          className: `${baseClass}__actions`,
+          children: [_jsx(Button, {
+            "aria-label": t("general:cancel"),
+            buttonStyle: "secondary",
+            onClick: onCancel,
+            children: t("general:cancel")
+          }), _jsx(FormSubmit, {
+            "aria-label": t("general:applyChanges"),
+            onClick: onSave,
+            children: t("general:applyChanges")
+          })]
+        })]
+      })
+    });
+    $[0] = onCancel;
+    $[1] = onSave;
+    $[2] = t;
+    $[3] = title;
+    $[4] = t1;
+  } else {
+    t1 = $[4];
+  }
+  return t1;
+};
+//# sourceMappingURL=index.js.map

package/dist/elements/FolderView/Drawers/DrawerHeader/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["c","_c","React","FormSubmit","useTranslation","Button","baseClass","DrawerHeader","t0","$","onCancel","onSave","title","t","t1","_jsx","className","children","_jsxs","buttonStyle","onClick"],"sources":["../../../../../src/elements/FolderView/Drawers/DrawerHeader/index.tsx"],"sourcesContent":["'use client'\n\nimport React from 'react'\n\nimport { FormSubmit } from '../../../../forms/Submit/index.js'\nimport { useTranslation } from '../../../../providers/Translation/index.js'\nimport { Button } from '../../../Button/index.js'\nimport './index.scss'\n\nconst baseClass = 'drawerHeader'\n\ntype DrawerHeaderArgs = {\n  readonly onCancel?: () => void\n  readonly onSave?: () => void\n  readonly title: string\n}\nexport const DrawerHeader = ({ onCancel, onSave, title }: DrawerHeaderArgs) => {\n  const { t } = useTranslation()\n\n  return (\n    <div className={baseClass}>\n      <div className={`${baseClass}__content`}>\n        <h1 className={`${baseClass}__title`}>{title}</h1>\n\n        <div className={`${baseClass}__actions`}>\n          <Button aria-label={t('general:cancel')} buttonStyle=\"secondary\" onClick={onCancel}>\n            {t('general:cancel')}\n          </Button>\n\n          <FormSubmit aria-label={t('general:applyChanges')} onClick={onSave}>\n            {t('general:applyChanges')}\n          </FormSubmit>\n        </div>\n      </div>\n    </div>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAEA,OAAOC,KAAA,MAAW;AAElB,SAASC,UAAU,QAAQ;AAC3B,SAASC,cAAc,QAAQ;AAC/B,SAASC,MAAM,QAAQ;AACvB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAOlB,OAAO,MAAMC,YAAA,GAAeC,EAAA;EAAA,MAAAC,CAAA,GAAAR,EAAA;EAAC;IAAAS,QAAA;IAAAC,MAAA;IAAAC;EAAA,IAAAJ,EAA6C;EACxE;IAAAK;EAAA,IAAcT,cAAA;EAAA,IAAAU,EAAA;EAAA,IAAAL,CAAA,QAAAC,QAAA,IAAAD,CAAA,QAAAE,MAAA,IAAAF,CAAA,QAAAI,CAAA,IAAAJ,CAAA,QAAAG,KAAA;IAGZE,EAAA,GAAAC,IAAA,CAAC;MAAAC,SAAA,EAAAV,SAAA;MAAAW,QAAA,EACCC,KAAA,CAAC;QAAAF,SAAA,EAAe,GAAAV,SAAA,WAAuB;QAAAW,QAAA,GACrCF,IAAA,CAAC;UAAAC,SAAA,EAAc,GAAAV,SAAA,SAAqB;UAAAW,QAAA,EAAGL;QAAA,C,GAEvCM,KAAA,CAAC;UAAAF,SAAA,EAAe,GAAAV,SAAA,WAAuB;UAAAW,QAAA,GACrCF,IAAA,CAAAV,MAAA;YAAA,cAAoBQ,CAAA,CAAE;YAAAM,WAAA,EAA+B;YAAAC,OAAA,EAAqBV,QAAA;YAAAO,QAAA,EACvEJ,CAAA,CAAE;UAAA,C,GAGLE,IAAA,CAAAZ,UAAA;YAAA,cAAwBU,CAAA,CAAE;YAAAO,OAAA,EAAkCT,MAAA;YAAAM,QAAA,EACzDJ,CAAA,CAAE;UAAA,C;;;;;;;;;;;;SAVXC,E;CAgBJ","ignoreList":[]}

package/dist/elements/FolderView/Drawers/DrawerHeader/index.scss

@@ -0,0 +1,30 @@
+@layer payload-default {
+  .drawerHeader {
+    padding-top: calc(var(--base) * 2);
+    padding-bottom: calc(var(--base) * 1.5);
+    border-bottom: 1px solid var(--theme-border-color);
+
+    &__content {
+      margin-left: var(--gutter-h);
+      margin-right: var(--gutter-h);
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+    }
+
+    &__title {
+      margin: 0;
+    }
+
+    &__actions {
+      display: flex;
+      margin-left: auto;
+      padding-left: var(--base);
+      gap: var(--base);
+
+      button {
+        margin: 0;
+      }
+    }
+  }
+}

package/dist/elements/FolderView/Drawers/MoveToFolder/index.d.ts

@@ -0,0 +1,32 @@
+import type { FolderOrDocument } from 'payload/shared';
+import React from 'react';
+import './index.scss';
+type ActionProps = {
+    readonly action: 'moveItemsToFolder';
+} | {
+    readonly action: 'moveItemToFolder';
+    readonly title: string;
+};
+export type MoveToFolderDrawerProps = {
+    readonly drawerSlug: string;
+    readonly fromFolderID?: number | string;
+    readonly fromFolderName?: string;
+    readonly itemsToMove: FolderOrDocument[];
+    /**
+     * Callback function to be called when the user confirms the move
+     *
+     * @param folderID - The ID of the folder to move the items to
+     */
+    readonly onConfirm: (args: {
+        id: null | number | string;
+        name: null | string;
+    }) => Promise<void> | void;
+    /**
+     * Set to `true` to skip the confirmation modal
+     * @default false
+     */
+    readonly skipConfirmModal?: boolean;
+} & ActionProps;
+export declare function MoveItemsToFolderDrawer(props: MoveToFolderDrawerProps): React.JSX.Element;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/elements/FolderView/Drawers/MoveToFolder/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/elements/FolderView/Drawers/MoveToFolder/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAGV,gBAAgB,EAEjB,MAAM,gBAAgB,CAAA;AAIvB,OAAO,KAAK,MAAM,OAAO,CAAA;AAkBzB,OAAO,cAAc,CAAA;AAOrB,KAAK,WAAW,GACZ;IACE,QAAQ,CAAC,MAAM,EAAE,mBAAmB,CAAA;CACrC,GACD;IACE,QAAQ,CAAC,MAAM,EAAE,kBAAkB,CAAA;IACnC,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;CACvB,CAAA;AACL,MAAM,MAAM,uBAAuB,GAAG;IACpC,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvC,QAAQ,CAAC,cAAc,CAAC,EAAE,MAAM,CAAA;IAChC,QAAQ,CAAC,WAAW,EAAE,gBAAgB,EAAE,CAAA;IACxC;;;;OAIG;IACH,QAAQ,CAAC,SAAS,EAAE,CAAC,IAAI,EAAE;QACzB,EAAE,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,CAAA;QAC1B,IAAI,EAAE,IAAI,GAAG,MAAM,CAAA;KACpB,KAAK,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAA;IAC1B;;;OAGG;IACH,QAAQ,CAAC,gBAAgB,CAAC,EAAE,OAAO,CAAA;CACpC,GAAG,WAAW,CAAA;AAEf,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,uBAAuB,qBAMrE"}