@payloadcms/next 3.78.0-internal-debug.f663370 → 3.78.0-internal.ab11ffa

package/dist/views/Dashboard/Default/ModularDashboard/utils/localeUtils.js

@@ -0,0 +1,103 @@
+import { fieldAffectsData, fieldHasSubFields, tabHasName } from 'payload/shared';
+function isLocalized(field) {
+  return 'localized' in field && Boolean(field.localized);
+}
+function getObjectValue(value) {
+  return typeof value === 'object' && value !== null && !Array.isArray(value) ? value : {};
+}
+/**
+ * Extracts locale-specific data from widget data stored in preferences.
+ *
+ * Localized fields are stored as `{ fieldName: { en: "Hello", de: "Hallo" } }` in preferences.
+ * This function flattens them to `{ fieldName: "Hello" }` for the given locale,
+ * which is the format the form state builder expects.
+ *
+ * Recursively handles nested field types (group, row, collapsible, tabs).
+ */
+export function extractLocaleData(widgetData, locale, fields) {
+  const result = {};
+  for (const field of fields) {
+    if (field.type === 'tabs') {
+      for (const tab of field.tabs) {
+        const tabFields = tab.fields;
+        if (tabHasName(tab)) {
+          result[tab.name] = extractLocaleData(getObjectValue(widgetData[tab.name]), locale, tabFields);
+        } else {
+          Object.assign(result, extractLocaleData(widgetData, locale, tabFields));
+        }
+      }
+      continue;
+    }
+    if (fieldHasSubFields(field) && !fieldAffectsData(field)) {
+      Object.assign(result, extractLocaleData(widgetData, locale, field.fields));
+      continue;
+    }
+    if (!fieldAffectsData(field)) {
+      continue;
+    }
+    const {
+      name
+    } = field;
+    const value = widgetData[name];
+    if (fieldHasSubFields(field)) {
+      result[name] = extractLocaleData(getObjectValue(value), locale, field.fields);
+      continue;
+    }
+    if (isLocalized(field) && value !== undefined && typeof value === 'object' && value !== null && !Array.isArray(value)) {
+      result[name] = value[locale];
+    } else {
+      result[name] = value;
+    }
+  }
+  return result;
+}
+/**
+ * Merges locale-specific form data back into the full widget data structure.
+ *
+ * Non-localized fields are stored directly. Localized fields are stored as
+ * `{ fieldName: { en: "Hello", de: "Hallo" } }` so each locale's value is preserved independently.
+ *
+ * Recursively handles nested field types (group, row, collapsible, tabs).
+ */
+export function mergeLocaleData(existingData, formData, locale, fields) {
+  const result = {
+    ...existingData
+  };
+  for (const field of fields) {
+    if (field.type === 'tabs') {
+      for (const tab of field.tabs) {
+        const tabFields = tab.fields;
+        if (tabHasName(tab)) {
+          result[tab.name] = mergeLocaleData(getObjectValue(result[tab.name]), getObjectValue(formData[tab.name]), locale, tabFields);
+        } else {
+          Object.assign(result, mergeLocaleData(result, formData, locale, tabFields));
+        }
+      }
+      continue;
+    }
+    if (fieldHasSubFields(field) && !fieldAffectsData(field)) {
+      Object.assign(result, mergeLocaleData(result, formData, locale, field.fields));
+      continue;
+    }
+    if (!fieldAffectsData(field)) {
+      continue;
+    }
+    const {
+      name
+    } = field;
+    if (fieldHasSubFields(field)) {
+      result[name] = mergeLocaleData(getObjectValue(result[name]), getObjectValue(formData[name]), locale, field.fields);
+      continue;
+    }
+    if (isLocalized(field)) {
+      result[name] = {
+        ...getObjectValue(result[name]),
+        [locale]: formData[name]
+      };
+    } else {
+      result[name] = formData[name];
+    }
+  }
+  return result;
+}
+//# sourceMappingURL=localeUtils.js.map

package/dist/views/Dashboard/Default/ModularDashboard/utils/localeUtils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"localeUtils.js","names":["fieldAffectsData","fieldHasSubFields","tabHasName","isLocalized","field","Boolean","localized","getObjectValue","value","Array","isArray","extractLocaleData","widgetData","locale","fields","result","type","tab","tabs","tabFields","name","Object","assign","undefined","mergeLocaleData","existingData","formData"],"sources":["../../../../../../src/views/Dashboard/Default/ModularDashboard/utils/localeUtils.ts"],"sourcesContent":["import type { ClientField, Field } from 'payload'\n\nimport { fieldAffectsData, fieldHasSubFields, tabHasName } from 'payload/shared'\n\ntype AnyField = ClientField | Field\n\nfunction isLocalized(field: AnyField): boolean {\n  return 'localized' in field && Boolean(field.localized)\n}\n\nfunction getObjectValue(value: unknown): Record<string, unknown> {\n  return typeof value === 'object' && value !== null && !Array.isArray(value)\n    ? (value as Record<string, unknown>)\n    : {}\n}\n\n/**\n * Extracts locale-specific data from widget data stored in preferences.\n *\n * Localized fields are stored as `{ fieldName: { en: \"Hello\", de: \"Hallo\" } }` in preferences.\n * This function flattens them to `{ fieldName: \"Hello\" }` for the given locale,\n * which is the format the form state builder expects.\n *\n * Recursively handles nested field types (group, row, collapsible, tabs).\n */\nexport function extractLocaleData(\n  widgetData: Record<string, unknown>,\n  locale: string,\n  fields: readonly AnyField[],\n): Record<string, unknown> {\n  const result: Record<string, unknown> = {}\n\n  for (const field of fields) {\n    if (field.type === 'tabs') {\n      for (const tab of field.tabs) {\n        const tabFields = tab.fields as AnyField[]\n        if (tabHasName(tab)) {\n          result[tab.name] = extractLocaleData(\n            getObjectValue(widgetData[tab.name]),\n            locale,\n            tabFields,\n          )\n        } else {\n          Object.assign(result, extractLocaleData(widgetData, locale, tabFields))\n        }\n      }\n      continue\n    }\n\n    if (fieldHasSubFields(field) && !fieldAffectsData(field)) {\n      Object.assign(result, extractLocaleData(widgetData, locale, field.fields as AnyField[]))\n      continue\n    }\n\n    if (!fieldAffectsData(field)) {\n      continue\n    }\n\n    const { name } = field\n    const value = widgetData[name]\n\n    if (fieldHasSubFields(field)) {\n      result[name] = extractLocaleData(getObjectValue(value), locale, field.fields as AnyField[])\n      continue\n    }\n\n    if (\n      isLocalized(field) &&\n      value !== undefined &&\n      typeof value === 'object' &&\n      value !== null &&\n      !Array.isArray(value)\n    ) {\n      result[name] = (value as Record<string, unknown>)[locale]\n    } else {\n      result[name] = value\n    }\n  }\n\n  return result\n}\n\n/**\n * Merges locale-specific form data back into the full widget data structure.\n *\n * Non-localized fields are stored directly. Localized fields are stored as\n * `{ fieldName: { en: \"Hello\", de: \"Hallo\" } }` so each locale's value is preserved independently.\n *\n * Recursively handles nested field types (group, row, collapsible, tabs).\n */\nexport function mergeLocaleData(\n  existingData: Record<string, unknown>,\n  formData: Record<string, unknown>,\n  locale: string,\n  fields: readonly AnyField[],\n): Record<string, unknown> {\n  const result: Record<string, unknown> = { ...existingData }\n\n  for (const field of fields) {\n    if (field.type === 'tabs') {\n      for (const tab of field.tabs) {\n        const tabFields = tab.fields as AnyField[]\n        if (tabHasName(tab)) {\n          result[tab.name] = mergeLocaleData(\n            getObjectValue(result[tab.name]),\n            getObjectValue(formData[tab.name]),\n            locale,\n            tabFields,\n          )\n        } else {\n          Object.assign(result, mergeLocaleData(result, formData, locale, tabFields))\n        }\n      }\n      continue\n    }\n\n    if (fieldHasSubFields(field) && !fieldAffectsData(field)) {\n      Object.assign(result, mergeLocaleData(result, formData, locale, field.fields as AnyField[]))\n      continue\n    }\n\n    if (!fieldAffectsData(field)) {\n      continue\n    }\n\n    const { name } = field\n\n    if (fieldHasSubFields(field)) {\n      result[name] = mergeLocaleData(\n        getObjectValue(result[name]),\n        getObjectValue(formData[name]),\n        locale,\n        field.fields as AnyField[],\n      )\n      continue\n    }\n\n    if (isLocalized(field)) {\n      result[name] = { ...getObjectValue(result[name]), [locale]: formData[name] }\n    } else {\n      result[name] = formData[name]\n    }\n  }\n\n  return result\n}\n"],"mappings":"AAEA,SAASA,gBAAgB,EAAEC,iBAAiB,EAAEC,UAAU,QAAQ;AAIhE,SAASC,YAAYC,KAAe;EAClC,OAAO,eAAeA,KAAA,IAASC,OAAA,CAAQD,KAAA,CAAME,SAAS;AACxD;AAEA,SAASC,eAAeC,KAAc;EACpC,OAAO,OAAOA,KAAA,KAAU,YAAYA,KAAA,KAAU,QAAQ,CAACC,KAAA,CAAMC,OAAO,CAACF,KAAA,IAChEA,KAAA,GACD,CAAC;AACP;AAEA;;;;;;;;;AASA,OAAO,SAASG,kBACdC,UAAmC,EACnCC,MAAc,EACdC,MAA2B;EAE3B,MAAMC,MAAA,GAAkC,CAAC;EAEzC,KAAK,MAAMX,KAAA,IAASU,MAAA,EAAQ;IAC1B,IAAIV,KAAA,CAAMY,IAAI,KAAK,QAAQ;MACzB,KAAK,MAAMC,GAAA,IAAOb,KAAA,CAAMc,IAAI,EAAE;QAC5B,MAAMC,SAAA,GAAYF,GAAA,CAAIH,MAAM;QAC5B,IAAIZ,UAAA,CAAWe,GAAA,GAAM;UACnBF,MAAM,CAACE,GAAA,CAAIG,IAAI,CAAC,GAAGT,iBAAA,CACjBJ,cAAA,CAAeK,UAAU,CAACK,GAAA,CAAIG,IAAI,CAAC,GACnCP,MAAA,EACAM,SAAA;QAEJ,OAAO;UACLE,MAAA,CAAOC,MAAM,CAACP,MAAA,EAAQJ,iBAAA,CAAkBC,UAAA,EAAYC,MAAA,EAAQM,SAAA;QAC9D;MACF;MACA;IACF;IAEA,IAAIlB,iBAAA,CAAkBG,KAAA,KAAU,CAACJ,gBAAA,CAAiBI,KAAA,GAAQ;MACxDiB,MAAA,CAAOC,MAAM,CAACP,MAAA,EAAQJ,iBAAA,CAAkBC,UAAA,EAAYC,MAAA,EAAQT,KAAA,CAAMU,MAAM;MACxE;IACF;IAEA,IAAI,CAACd,gBAAA,CAAiBI,KAAA,GAAQ;MAC5B;IACF;IAEA,MAAM;MAAEgB;IAAI,CAAE,GAAGhB,KAAA;IACjB,MAAMI,KAAA,GAAQI,UAAU,CAACQ,IAAA,CAAK;IAE9B,IAAInB,iBAAA,CAAkBG,KAAA,GAAQ;MAC5BW,MAAM,CAACK,IAAA,CAAK,GAAGT,iBAAA,CAAkBJ,cAAA,CAAeC,KAAA,GAAQK,MAAA,EAAQT,KAAA,CAAMU,MAAM;MAC5E;IACF;IAEA,IACEX,WAAA,CAAYC,KAAA,KACZI,KAAA,KAAUe,SAAA,IACV,OAAOf,KAAA,KAAU,YACjBA,KAAA,KAAU,QACV,CAACC,KAAA,CAAMC,OAAO,CAACF,KAAA,GACf;MACAO,MAAM,CAACK,IAAA,CAAK,GAAGZ,KAAkC,CAACK,MAAA,CAAO;IAC3D,OAAO;MACLE,MAAM,CAACK,IAAA,CAAK,GAAGZ,KAAA;IACjB;EACF;EAEA,OAAOO,MAAA;AACT;AAEA;;;;;;;;AAQA,OAAO,SAASS,gBACdC,YAAqC,EACrCC,QAAiC,EACjCb,MAAc,EACdC,MAA2B;EAE3B,MAAMC,MAAA,GAAkC;IAAE,GAAGU;EAAa;EAE1D,KAAK,MAAMrB,KAAA,IAASU,MAAA,EAAQ;IAC1B,IAAIV,KAAA,CAAMY,IAAI,KAAK,QAAQ;MACzB,KAAK,MAAMC,GAAA,IAAOb,KAAA,CAAMc,IAAI,EAAE;QAC5B,MAAMC,SAAA,GAAYF,GAAA,CAAIH,MAAM;QAC5B,IAAIZ,UAAA,CAAWe,GAAA,GAAM;UACnBF,MAAM,CAACE,GAAA,CAAIG,IAAI,CAAC,GAAGI,eAAA,CACjBjB,cAAA,CAAeQ,MAAM,CAACE,GAAA,CAAIG,IAAI,CAAC,GAC/Bb,cAAA,CAAemB,QAAQ,CAACT,GAAA,CAAIG,IAAI,CAAC,GACjCP,MAAA,EACAM,SAAA;QAEJ,OAAO;UACLE,MAAA,CAAOC,MAAM,CAACP,MAAA,EAAQS,eAAA,CAAgBT,MAAA,EAAQW,QAAA,EAAUb,MAAA,EAAQM,SAAA;QAClE;MACF;MACA;IACF;IAEA,IAAIlB,iBAAA,CAAkBG,KAAA,KAAU,CAACJ,gBAAA,CAAiBI,KAAA,GAAQ;MACxDiB,MAAA,CAAOC,MAAM,CAACP,MAAA,EAAQS,eAAA,CAAgBT,MAAA,EAAQW,QAAA,EAAUb,MAAA,EAAQT,KAAA,CAAMU,MAAM;MAC5E;IACF;IAEA,IAAI,CAACd,gBAAA,CAAiBI,KAAA,GAAQ;MAC5B;IACF;IAEA,MAAM;MAAEgB;IAAI,CAAE,GAAGhB,KAAA;IAEjB,IAAIH,iBAAA,CAAkBG,KAAA,GAAQ;MAC5BW,MAAM,CAACK,IAAA,CAAK,GAAGI,eAAA,CACbjB,cAAA,CAAeQ,MAAM,CAACK,IAAA,CAAK,GAC3Bb,cAAA,CAAemB,QAAQ,CAACN,IAAA,CAAK,GAC7BP,MAAA,EACAT,KAAA,CAAMU,MAAM;MAEd;IACF;IAEA,IAAIX,WAAA,CAAYC,KAAA,GAAQ;MACtBW,MAAM,CAACK,IAAA,CAAK,GAAG;QAAE,GAAGb,cAAA,CAAeQ,MAAM,CAACK,IAAA,CAAK,CAAC;QAAE,CAACP,MAAA,GAASa,QAAQ,CAACN,IAAA;MAAM;IAC7E,OAAO;MACLL,MAAM,CAACK,IAAA,CAAK,GAAGM,QAAQ,CAACN,IAAA,CAAK;IAC/B;EACF;EAEA,OAAOL,MAAA;AACT","ignoreList":[]}

package/dist/views/Dashboard/Default/ModularDashboard/utils/sensors.js

@@ -2,257 +2,263 @@ import { KeyboardCode, KeyboardSensor, PointerSensor, useSensor, useSensors } fr
 /**
  * Get all droppable widget positions, filtering out overlapping "before" droppables
  * and assigning row numbers based on Y position.
- */ function getDroppablePositions() {
-    const positionTolerance = 5;
-    const rowTolerance = 10;
-    const result = [];
-    let currentRow = 0;
-    let currentY = null;
-    const allDroppables = Array.from(document.querySelectorAll('.droppable-widget'));
-    for(let i = 0; i < allDroppables.length; i++){
-        const element = allDroppables[i];
-        const rect = element.getBoundingClientRect();
-        // Skip hidden elements
-        if (rect.width === 0 || rect.height === 0) {
-            continue;
-        }
-        const centerX = rect.left + rect.width / 2;
-        const centerY = rect.top + rect.height / 2;
-        const testId = element.getAttribute('data-testid') || '';
-        const isBeforeDroppable = testId.endsWith('-before');
-        // Skip "before" droppables that overlap with another droppable
-        if (isBeforeDroppable) {
-            const hasOverlapping = allDroppables.some((other, otherIndex)=>{
-                if (otherIndex === i) {
-                    return false;
-                }
-                const otherRect = other.getBoundingClientRect();
-                const otherCenterX = otherRect.left + otherRect.width / 2;
-                const otherCenterY = otherRect.top + otherRect.height / 2;
-                return Math.abs(otherCenterX - centerX) < positionTolerance && Math.abs(otherCenterY - centerY) < positionTolerance;
-            });
-            if (hasOverlapping) {
-                continue;
-            }
-        }
-        // Assign row number based on Y position change
-        if (currentY === null) {
-            currentY = centerY;
-        } else if (Math.abs(centerY - currentY) >= rowTolerance) {
-            currentRow++;
-            currentY = centerY;
+ */
+function getDroppablePositions() {
+  const positionTolerance = 5;
+  const rowTolerance = 10;
+  const result = [];
+  let currentRow = 0;
+  let currentY = null;
+  const allDroppables = Array.from(document.querySelectorAll('.droppable-widget'));
+  for (let i = 0; i < allDroppables.length; i++) {
+    const element = allDroppables[i];
+    const rect = element.getBoundingClientRect();
+    // Skip hidden elements
+    if (rect.width === 0 || rect.height === 0) {
+      continue;
+    }
+    const centerX = rect.left + rect.width / 2;
+    const centerY = rect.top + rect.height / 2;
+    const testId = element.getAttribute('data-testid') || '';
+    const isBeforeDroppable = testId.endsWith('-before');
+    // Skip "before" droppables that overlap with another droppable
+    if (isBeforeDroppable) {
+      const hasOverlapping = allDroppables.some((other, otherIndex) => {
+        if (otherIndex === i) {
+          return false;
         }
-        result.push({
-            centerX,
-            centerY,
-            element,
-            isBeforeDroppable,
-            rect,
-            row: currentRow
-        });
+        const otherRect = other.getBoundingClientRect();
+        const otherCenterX = otherRect.left + otherRect.width / 2;
+        const otherCenterY = otherRect.top + otherRect.height / 2;
+        return Math.abs(otherCenterX - centerX) < positionTolerance && Math.abs(otherCenterY - centerY) < positionTolerance;
+      });
+      if (hasOverlapping) {
+        continue;
+      }
     }
-    return result;
+    // Assign row number based on Y position change
+    if (currentY === null) {
+      currentY = centerY;
+    } else if (Math.abs(centerY - currentY) >= rowTolerance) {
+      currentRow++;
+      currentY = centerY;
+    }
+    result.push({
+      centerX,
+      centerY,
+      element,
+      isBeforeDroppable,
+      rect,
+      row: currentRow
+    });
+  }
+  return result;
 }
 /**
  * Find the row with the closest Y position to the given posY.
  * Returns the row index, or null if no droppables exist.
- */ function findClosestRow(droppables, posY) {
-    if (droppables.length === 0) {
-        return null;
-    }
-    let closestRow = droppables[0].row;
-    let minYDistance = Infinity;
-    for (const droppable of droppables){
-        const yDistance = Math.abs(droppable.centerY - posY);
-        if (yDistance < minYDistance) {
-            minYDistance = yDistance;
-            closestRow = droppable.row;
-        }
+ */
+function findClosestRow(droppables, posY) {
+  if (droppables.length === 0) {
+    return null;
+  }
+  let closestRow = droppables[0].row;
+  let minYDistance = Infinity;
+  for (const droppable of droppables) {
+    const yDistance = Math.abs(droppable.centerY - posY);
+    if (yDistance < minYDistance) {
+      minYDistance = yDistance;
+      closestRow = droppable.row;
     }
-    return closestRow;
+  }
+  return closestRow;
 }
 /**
  * Find the closest droppable within a specific row by X position.
  * Returns the droppable and its index, or null if no droppables in that row.
- */ function findClosestDroppableInRow(droppables, rowIndex, posX) {
-    let closestIndex = -1;
-    let minXDistance = Infinity;
-    for(let i = 0; i < droppables.length; i++){
-        const droppable = droppables[i];
-        if (droppable.row === rowIndex) {
-            const xDistance = Math.abs(droppable.centerX - posX);
-            if (xDistance < minXDistance) {
-                minXDistance = xDistance;
-                closestIndex = i;
-            }
-        }
+ */
+function findClosestDroppableInRow(droppables, rowIndex, posX) {
+  let closestIndex = -1;
+  let minXDistance = Infinity;
+  for (let i = 0; i < droppables.length; i++) {
+    const droppable = droppables[i];
+    if (droppable.row === rowIndex) {
+      const xDistance = Math.abs(droppable.centerX - posX);
+      if (xDistance < minXDistance) {
+        minXDistance = xDistance;
+        closestIndex = i;
+      }
     }
-    if (closestIndex === -1) {
-        return null;
-    }
-    return {
-        droppable: droppables[closestIndex],
-        index: closestIndex
-    };
+  }
+  if (closestIndex === -1) {
+    return null;
+  }
+  return {
+    droppable: droppables[closestIndex],
+    index: closestIndex
+  };
 }
 /**
  * Find the target droppable based on direction
  * - ArrowRight/Left: Next/previous in DOM order (now that overlapping droppables are filtered)
  * - ArrowUp/Down: Closest in adjacent row (row +1 or -1) by X position
- */ function findTargetDroppable(droppables, currentCenterX, currentCenterY, direction) {
-    // Find the closest row, then the closest droppable in that row
-    const currentRow = findClosestRow(droppables, currentCenterY);
-    if (currentRow === null) {
-        return null;
-    }
-    const currentDroppable = findClosestDroppableInRow(droppables, currentRow, currentCenterX);
-    if (!currentDroppable) {
-        return null;
-    }
-    const { index: currentIndex } = currentDroppable;
-    switch(direction){
-        case 'ArrowDown':
-            {
-                const targetRow = currentRow + 1;
-                return findClosestDroppableInRow(droppables, targetRow, currentCenterX)?.droppable || null;
-            }
-        case 'ArrowLeft':
-            // Previous in DOM order
-            return droppables[currentIndex - 1] || null;
-        case 'ArrowRight':
-            // Next in DOM order
-            return droppables[currentIndex + 1] || null;
-        case 'ArrowUp':
-            {
-                const targetRow = currentRow - 1;
-                return findClosestDroppableInRow(droppables, targetRow, currentCenterX)?.droppable || null;
-            }
-        default:
-            return null;
-    }
+ */
+function findTargetDroppable(droppables, currentCenterX, currentCenterY, direction) {
+  // Find the closest row, then the closest droppable in that row
+  const currentRow = findClosestRow(droppables, currentCenterY);
+  if (currentRow === null) {
+    return null;
+  }
+  const currentDroppable = findClosestDroppableInRow(droppables, currentRow, currentCenterX);
+  if (!currentDroppable) {
+    return null;
+  }
+  const {
+    index: currentIndex
+  } = currentDroppable;
+  switch (direction) {
+    case 'ArrowDown':
+      {
+        const targetRow = currentRow + 1;
+        return findClosestDroppableInRow(droppables, targetRow, currentCenterX)?.droppable || null;
+      }
+    case 'ArrowLeft':
+      // Previous in DOM order
+      return droppables[currentIndex - 1] || null;
+    case 'ArrowRight':
+      // Next in DOM order
+      return droppables[currentIndex + 1] || null;
+    case 'ArrowUp':
+      {
+        const targetRow = currentRow - 1;
+        return findClosestDroppableInRow(droppables, targetRow, currentCenterX)?.droppable || null;
+      }
+    default:
+      return null;
+  }
 }
 /**
  * Custom coordinate getter that jumps directly to droppable positions
  * instead of moving in pixel increments. This works better with scrolling
  * and provides more predictable navigation.
- */ const droppableJumpKeyboardCoordinateGetter = (event, { context, currentCoordinates })=>{
-    const { collisionRect } = context;
-    const { code } = event;
-    if (!collisionRect) {
-        return currentCoordinates;
-    }
-    // Only handle arrow keys
-    if (![
-        'ArrowDown',
-        'ArrowLeft',
-        'ArrowRight',
-        'ArrowUp'
-    ].includes(code)) {
-        return currentCoordinates;
-    }
-    // Prevent default browser scroll behavior for arrow keys
-    event.preventDefault();
-    // Clear scrollableAncestors to prevent dnd-kit from scrolling instead of moving
-    // This must be done on every keydown because context is updated by dnd-kit
-    if (context.scrollableAncestors) {
-        context.scrollableAncestors.length = 0;
-    }
-    // Get all droppable widgets and their positions
-    const droppables = getDroppablePositions();
-    if (droppables.length === 0) {
-        return currentCoordinates;
-    }
-    // Current position center (viewport coordinates from collisionRect)
-    const currentCenterX = collisionRect.left + collisionRect.width / 2;
-    const currentCenterY = collisionRect.top + collisionRect.height / 2;
-    // Find the target droppable based on direction
-    const targetDroppable = findTargetDroppable(droppables, currentCenterX, currentCenterY, code);
-    // If we found a target, scroll if needed and calculate the delta
-    if (targetDroppable) {
-        const viewportHeight = window.innerHeight;
-        const targetRect = targetDroppable.rect;
-        const scrollPadding = 20;
-        // Extra padding to ensure element is fully visible
-        // Check if target droppable is fully visible in viewport
-        const isAboveViewport = targetRect.top < scrollPadding;
-        const isBelowViewport = targetRect.bottom > viewportHeight - scrollPadding;
-        // Scroll to make target visible (using instant scroll for synchronous behavior)
-        if (isAboveViewport) {
-            const scrollAmount = targetRect.top - scrollPadding;
-            // don't use smooth scroll here, because it will mess up the delta calculation
-            window.scrollBy({
-                behavior: 'instant',
-                top: scrollAmount
-            });
-        } else if (isBelowViewport) {
-            const scrollAmount = targetRect.bottom - viewportHeight + scrollPadding;
-            window.scrollBy({
-                behavior: 'instant',
-                top: scrollAmount
-            });
-        }
-        // After scroll, recalculate target position (it may have changed due to scroll)
-        const newTargetRect = targetDroppable.element.getBoundingClientRect();
-        const newTargetCenterX = newTargetRect.left + newTargetRect.width / 2;
-        const newTargetCenterY = newTargetRect.top + newTargetRect.height / 2;
-        // Calculate delta using current overlay position (which didn't change) and new target position
-        const deltaX = newTargetCenterX - currentCenterX;
-        const deltaY = newTargetCenterY - currentCenterY;
-        // Add delta to currentCoordinates to position overlay's center at target's center
-        return {
-            x: currentCoordinates.x + deltaX,
-            y: currentCoordinates.y + deltaY
-        };
-    }
-    // No valid target found, stay in place
+ */
+const droppableJumpKeyboardCoordinateGetter = (event, {
+  context,
+  currentCoordinates
+}) => {
+  const {
+    collisionRect
+  } = context;
+  const {
+    code
+  } = event;
+  if (!collisionRect) {
     return currentCoordinates;
+  }
+  // Only handle arrow keys
+  if (!['ArrowDown', 'ArrowLeft', 'ArrowRight', 'ArrowUp'].includes(code)) {
+    return currentCoordinates;
+  }
+  // Prevent default browser scroll behavior for arrow keys
+  event.preventDefault();
+  // Clear scrollableAncestors to prevent dnd-kit from scrolling instead of moving
+  // This must be done on every keydown because context is updated by dnd-kit
+  if (context.scrollableAncestors) {
+    context.scrollableAncestors.length = 0;
+  }
+  // Get all droppable widgets and their positions
+  const droppables = getDroppablePositions();
+  if (droppables.length === 0) {
+    return currentCoordinates;
+  }
+  // Current position center (viewport coordinates from collisionRect)
+  const currentCenterX = collisionRect.left + collisionRect.width / 2;
+  const currentCenterY = collisionRect.top + collisionRect.height / 2;
+  // Find the target droppable based on direction
+  const targetDroppable = findTargetDroppable(droppables, currentCenterX, currentCenterY, code);
+  // If we found a target, scroll if needed and calculate the delta
+  if (targetDroppable) {
+    const viewportHeight = window.innerHeight;
+    const targetRect = targetDroppable.rect;
+    const scrollPadding = 20 // Extra padding to ensure element is fully visible
+;
+    // Check if target droppable is fully visible in viewport
+    const isAboveViewport = targetRect.top < scrollPadding;
+    const isBelowViewport = targetRect.bottom > viewportHeight - scrollPadding;
+    // Scroll to make target visible (using instant scroll for synchronous behavior)
+    if (isAboveViewport) {
+      const scrollAmount = targetRect.top - scrollPadding;
+      // don't use smooth scroll here, because it will mess up the delta calculation
+      window.scrollBy({
+        behavior: 'instant',
+        top: scrollAmount
+      });
+    } else if (isBelowViewport) {
+      const scrollAmount = targetRect.bottom - viewportHeight + scrollPadding;
+      window.scrollBy({
+        behavior: 'instant',
+        top: scrollAmount
+      });
+    }
+    // After scroll, recalculate target position (it may have changed due to scroll)
+    const newTargetRect = targetDroppable.element.getBoundingClientRect();
+    const newTargetCenterX = newTargetRect.left + newTargetRect.width / 2;
+    const newTargetCenterY = newTargetRect.top + newTargetRect.height / 2;
+    // Calculate delta using current overlay position (which didn't change) and new target position
+    const deltaX = newTargetCenterX - currentCenterX;
+    const deltaY = newTargetCenterY - currentCenterY;
+    // Add delta to currentCoordinates to position overlay's center at target's center
+    return {
+      x: currentCoordinates.x + deltaX,
+      y: currentCoordinates.y + deltaY
+    };
+  }
+  // No valid target found, stay in place
+  return currentCoordinates;
 };
 /**
  * Custom KeyboardSensor that only activates when focus is directly on the
  * draggable element, not on any of its descendants. This allows interactive
  * elements inside draggables (like buttons) to work normally with the keyboard.
- */ let DirectFocusKeyboardSensor = class DirectFocusKeyboardSensor extends KeyboardSensor {
-    static activators = [
-        {
-            eventName: 'onKeyDown',
-            handler: (event, { keyboardCodes = {
-                cancel: [
-                    KeyboardCode.Esc
-                ],
-                end: [
-                    KeyboardCode.Space,
-                    KeyboardCode.Enter
-                ],
-                start: [
-                    KeyboardCode.Space,
-                    KeyboardCode.Enter
-                ]
-            }, onActivation }, { active })=>{
-                const { code } = event.nativeEvent;
-                // Only activate if focus is directly on the draggable node, not descendants
-                if (event.target !== active.node.current) {
-                    return false;
-                }
-                if (keyboardCodes.start.includes(code)) {
-                    event.preventDefault();
-                    onActivation?.({
-                        event: event.nativeEvent
-                    });
-                    return true;
-                }
-                return false;
-            }
-        }
-    ];
-};
+ */
+class DirectFocusKeyboardSensor extends KeyboardSensor {
+  static activators = [{
+    eventName: 'onKeyDown',
+    handler: (event, {
+      keyboardCodes = {
+        cancel: [KeyboardCode.Esc],
+        end: [KeyboardCode.Space, KeyboardCode.Enter],
+        start: [KeyboardCode.Space, KeyboardCode.Enter]
+      },
+      onActivation
+    }, {
+      active
+    }) => {
+      const {
+        code
+      } = event.nativeEvent;
+      // Only activate if focus is directly on the draggable node, not descendants
+      if (event.target !== active.node.current) {
+        return false;
+      }
+      if (keyboardCodes.start.includes(code)) {
+        event.preventDefault();
+        onActivation?.({
+          event: event.nativeEvent
+        });
+        return true;
+      }
+      return false;
+    }
+  }];
+}
 export function useDashboardSensors() {
-    return useSensors(useSensor(PointerSensor, {
-        activationConstraint: {
-            distance: 5
-        }
-    }), useSensor(DirectFocusKeyboardSensor, {
-        coordinateGetter: droppableJumpKeyboardCoordinateGetter
-    }));
+  return useSensors(useSensor(PointerSensor, {
+    activationConstraint: {
+      distance: 5
+    }
+  }), useSensor(DirectFocusKeyboardSensor, {
+    coordinateGetter: droppableJumpKeyboardCoordinateGetter
+  }));
 }
-
 //# sourceMappingURL=sensors.js.map