@adecore/ui 0.33.3 → 0.34.0

package/dist/workspace/TabStrip.js

@@ -25,7 +25,7 @@ function tabIndexForKey(key, index, count) {
   }
 }
 export function TabStrip(t0) {
-  const $ = _c(93);
+  const $ = _c(95);
   let className;
   let insertAt;
   let items;
@@ -42,6 +42,7 @@ export function TabStrip(t0) {
   let render;
   let renderTab;
   let t1;
+  let t2;
   let value;
   if ($[0] !== t0) {
     ({
@@ -51,6 +52,7 @@ export function TabStrip(t0) {
       renderTab,
       focused: t1,
       insertAt,
+      pressToClose: t2,
       onClose,
       onDoubleClick,
       onContextMenu,
@@ -80,7 +82,8 @@ export function TabStrip(t0) {
     $[14] = render;
     $[15] = renderTab;
     $[16] = t1;
-    $[17] = value;
+    $[17] = t2;
+    $[18] = value;
   } else {
     className = $[1];
     insertAt = $[2];
@@ -98,17 +101,19 @@ export function TabStrip(t0) {
     render = $[14];
     renderTab = $[15];
     t1 = $[16];
-    value = $[17];
+    t2 = $[17];
+    value = $[18];
   }
   const focused = t1 === undefined ? true : t1;
+  const pressToClose = t2 === undefined ? false : t2;
   const {
     t
   } = useTranslation("ui");
   const strip = useRef(null);
   const closingFocus = useRef(null);
-  let t2;
-  if ($[18] !== items) {
-    t2 = () => {
+  let t3;
+  if ($[19] !== items) {
+    t3 = () => {
       if (closingFocus.current && !items.some(item => item.id === closingFocus.current)) {
         closingFocus.current = null;
         const target = strip.current?.querySelector("[aria-selected=\"true\"]") ?? strip.current?.querySelector("[role=\"tab\"]");
@@ -117,15 +122,15 @@ export function TabStrip(t0) {
         });
       }
     };
-    $[18] = items;
-    $[19] = t2;
+    $[19] = items;
+    $[20] = t3;
   } else {
-    t2 = $[19];
+    t3 = $[20];
   }
-  useLayoutEffect(t2);
-  let t3;
-  if ($[20] !== onClose) {
-    t3 = (id, action) => {
+  useLayoutEffect(t3);
+  let t4;
+  if ($[21] !== onClose) {
+    t4 = (id, action) => {
       if (strip.current?.contains(strip.current.ownerDocument.activeElement)) {
         closingFocus.current = id;
       }
@@ -135,27 +140,27 @@ export function TabStrip(t0) {
         onClose?.(id);
       }
     };
-    $[20] = onClose;
-    $[21] = t3;
+    $[21] = onClose;
+    $[22] = t4;
   } else {
-    t3 = $[21];
+    t4 = $[22];
   }
-  const close = t3;
-  let t4;
-  if ($[22] === Symbol.for("react.memo_cache_sentinel")) {
-    t4 = {
+  const close = t4;
+  let t5;
+  if ($[23] === Symbol.for("react.memo_cache_sentinel")) {
+    t5 = {
       start: false,
       end: false
     };
-    $[22] = t4;
+    $[23] = t5;
   } else {
-    t4 = $[22];
+    t5 = $[23];
   }
-  const [edges, setEdges] = useState(t4);
+  const [edges, setEdges] = useState(t5);
   const [insertion, setInsertion] = useState(0);
-  let t5;
-  if ($[23] !== insertAt) {
-    t5 = () => {
+  let t6;
+  if ($[24] !== insertAt) {
+    t6 = () => {
       const element = strip.current;
       if (!element) {
         return;
@@ -173,16 +178,16 @@ export function TabStrip(t0) {
         setInsertion(after?.offsetLeft ?? (last ? last.offsetLeft + last.offsetWidth : 0));
       }
     };
-    $[23] = insertAt;
-    $[24] = t5;
+    $[24] = insertAt;
+    $[25] = t6;
   } else {
-    t5 = $[24];
+    t6 = $[25];
   }
-  const measure = t5;
+  const measure = t6;
   const revealing = useRef(false);
-  let t6;
-  if ($[25] === Symbol.for("react.memo_cache_sentinel")) {
-    t6 = () => {
+  let t7;
+  if ($[26] === Symbol.for("react.memo_cache_sentinel")) {
+    t7 = () => {
       const element_0 = strip.current;
       const selected = element_0?.querySelector("[aria-selected=\"true\"]");
       if (!revealing.current || !element_0 || !selected) {
@@ -198,44 +203,44 @@ export function TabStrip(t0) {
         element_0.scrollLeft = left;
       }
     };
-    $[25] = t6;
-  } else {
-    t6 = $[25];
-  }
-  const reveal = t6;
-  let t7;
-  if ($[26] === Symbol.for("react.memo_cache_sentinel")) {
-    t7 = () => {
-      revealing.current = true;
-    };
     $[26] = t7;
   } else {
     t7 = $[26];
   }
+  const reveal = t7;
   let t8;
-  if ($[27] !== value) {
-    t8 = [value];
-    $[27] = value;
-    $[28] = t8;
+  if ($[27] === Symbol.for("react.memo_cache_sentinel")) {
+    t8 = () => {
+      revealing.current = true;
+    };
+    $[27] = t8;
   } else {
-    t8 = $[28];
+    t8 = $[27];
   }
-  useLayoutEffect(t7, t8);
   let t9;
-  if ($[29] !== measure) {
-    t9 = () => {
+  if ($[28] !== value) {
+    t9 = [value];
+    $[28] = value;
+    $[29] = t9;
+  } else {
+    t9 = $[29];
+  }
+  useLayoutEffect(t8, t9);
+  let t10;
+  if ($[30] !== measure) {
+    t10 = () => {
       reveal();
       measure();
     };
-    $[29] = measure;
-    $[30] = t9;
+    $[30] = measure;
+    $[31] = t10;
   } else {
-    t9 = $[30];
+    t10 = $[31];
   }
-  useLayoutEffect(t9);
-  let t10;
-  if ($[31] !== measure) {
-    t10 = () => {
+  useLayoutEffect(t10);
+  let t11;
+  if ($[32] !== measure) {
+    t11 = () => {
       const element_1 = strip.current;
       if (!element_1 || typeof ResizeObserver === "undefined") {
         return;
@@ -248,93 +253,95 @@ export function TabStrip(t0) {
       element_1.querySelectorAll("[data-document-tab]").forEach(tab_0 => observer.observe(tab_0));
       return () => observer.disconnect();
     };
-    $[31] = measure;
-    $[32] = t10;
-  } else {
-    t10 = $[32];
-  }
-  useEffect(t10);
-  const gap = _temp2;
-  let t11;
-  if ($[33] === Symbol.for("react.memo_cache_sentinel")) {
-    t11 = index => strip.current?.querySelectorAll("[role=\"tab\"]")[index]?.focus();
+    $[32] = measure;
     $[33] = t11;
   } else {
     t11 = $[33];
   }
+  useEffect(t11);
+  const gap = _temp2;
   let t12;
-  if ($[34] !== close || $[35] !== items || $[36] !== onClose || $[37] !== onContextMenu || $[38] !== onDoubleClick || $[39] !== onDragEnd || $[40] !== onDragStart || $[41] !== onValueChange || $[42] !== value) {
-    t12 = {
+  if ($[34] === Symbol.for("react.memo_cache_sentinel")) {
+    t12 = index => strip.current?.querySelectorAll("[role=\"tab\"]")[index]?.focus();
+    $[34] = t12;
+  } else {
+    t12 = $[34];
+  }
+  let t13;
+  if ($[35] !== close || $[36] !== items || $[37] !== onClose || $[38] !== onContextMenu || $[39] !== onDoubleClick || $[40] !== onDragEnd || $[41] !== onDragStart || $[42] !== onValueChange || $[43] !== pressToClose || $[44] !== value) {
+    t13 = {
       items,
       value,
       onValueChange,
+      pressToClose,
       onClose,
       onDoubleClick,
       onContextMenu,
       onDragStart,
       onDragEnd,
       close,
-      focus: t11
+      focus: t12
     };
-    $[34] = close;
-    $[35] = items;
-    $[36] = onClose;
-    $[37] = onContextMenu;
-    $[38] = onDoubleClick;
-    $[39] = onDragEnd;
-    $[40] = onDragStart;
-    $[41] = onValueChange;
-    $[42] = value;
-    $[43] = t12;
-  } else {
-    t12 = $[43];
-  }
-  const context = t12;
-  const t13 = ref ?? null;
-  let t14;
-  if ($[44] !== t13) {
-    t14 = [strip, t13];
-    $[44] = t13;
-    $[45] = t14;
+    $[35] = close;
+    $[36] = items;
+    $[37] = onClose;
+    $[38] = onContextMenu;
+    $[39] = onDoubleClick;
+    $[40] = onDragEnd;
+    $[41] = onDragStart;
+    $[42] = onValueChange;
+    $[43] = pressToClose;
+    $[44] = value;
+    $[45] = t13;
   } else {
-    t14 = $[45];
+    t13 = $[45];
   }
+  const context = t13;
+  const t14 = ref ?? null;
   let t15;
-  if ($[46] !== props || $[47] !== t) {
-    t15 = props["aria-label"] ?? t("workspace.tabs");
-    $[46] = props;
-    $[47] = t;
-    $[48] = t15;
+  if ($[46] !== t14) {
+    t15 = [strip, t14];
+    $[46] = t14;
+    $[47] = t15;
   } else {
-    t15 = $[48];
+    t15 = $[47];
   }
   let t16;
-  if ($[49] !== className) {
-    t16 = clsx("ade-tab-strip scroll-fade-x", className);
-    $[49] = className;
+  if ($[48] !== props || $[49] !== t) {
+    t16 = props["aria-label"] ?? t("workspace.tabs");
+    $[48] = props;
+    $[49] = t;
     $[50] = t16;
   } else {
     t16 = $[50];
   }
-  const t17 = focused || undefined;
-  const t18 = edges.start || undefined;
-  const t19 = edges.end || undefined;
-  let t20;
-  if ($[51] !== measure || $[52] !== props) {
-    t20 = event_0 => {
+  let t17;
+  if ($[51] !== className) {
+    t17 = clsx("ade-tab-strip scroll-fade-x", className);
+    $[51] = className;
+    $[52] = t17;
+  } else {
+    t17 = $[52];
+  }
+  const t18 = focused || undefined;
+  const t19 = edges.start || undefined;
+  const t20 = edges.end || undefined;
+  let t21;
+  if ($[53] !== measure || $[54] !== props) {
+    t21 = event_0 => {
       props.onScroll?.(event_0);
       measure();
     };
-    $[51] = measure;
-    $[52] = props;
-    $[53] = t20;
+    $[53] = measure;
+    $[54] = props;
+    $[55] = t21;
   } else {
-    t20 = $[53];
+    t21 = $[55];
   }
-  let t21;
   let t22;
-  if ($[54] !== props) {
-    t21 = event_1 => {
+  let t23;
+  if ($[56] !== props) {
+    t22 = event_1 => {
       props.onWheel?.(event_1);
       if (event_1.defaultPrevented) {
         return;
@@ -344,146 +351,146 @@ export function TabStrip(t0) {
         event_1.currentTarget.scrollLeft = event_1.currentTarget.scrollLeft + event_1.deltaY;
       }
     };
-    t22 = event_2 => {
+    t23 = event_2 => {
       props.onPointerDown?.(event_2);
       if (event_2.target === event_2.currentTarget || event_2.pointerType === "touch") {
         revealing.current = false;
       }
     };
-    $[54] = props;
-    $[55] = t21;
-    $[56] = t22;
+    $[56] = props;
+    $[57] = t22;
+    $[58] = t23;
   } else {
-    t21 = $[55];
-    t22 = $[56];
+    t22 = $[57];
+    t23 = $[58];
   }
-  let t23;
-  if ($[57] !== onTabDragOver || $[58] !== props) {
-    t23 = event_3 => {
+  let t24;
+  if ($[59] !== onTabDragOver || $[60] !== props) {
+    t24 = event_3 => {
       props.onDragOver?.(event_3);
       if (!event_3.defaultPrevented) {
         onTabDragOver?.(gap(event_3), event_3);
       }
     };
-    $[57] = onTabDragOver;
-    $[58] = props;
-    $[59] = t23;
+    $[59] = onTabDragOver;
+    $[60] = props;
+    $[61] = t24;
   } else {
-    t23 = $[59];
+    t24 = $[61];
   }
-  let t24;
-  if ($[60] !== onTabDrop || $[61] !== props) {
-    t24 = event_4 => {
+  let t25;
+  if ($[62] !== onTabDrop || $[63] !== props) {
+    t25 = event_4 => {
       props.onDrop?.(event_4);
       if (!event_4.defaultPrevented) {
         onTabDrop?.(gap(event_4), event_4);
       }
     };
-    $[60] = onTabDrop;
-    $[61] = props;
-    $[62] = t24;
+    $[62] = onTabDrop;
+    $[63] = props;
+    $[64] = t25;
   } else {
-    t24 = $[62];
+    t25 = $[64];
   }
-  let t25;
-  if ($[63] !== context || $[64] !== items || $[65] !== renderTab) {
-    let t26;
-    if ($[67] !== context || $[68] !== renderTab) {
-      t26 = item_0 => /*#__PURE__*/_jsx(TabContext.Provider, {
+  let t26;
+  if ($[65] !== context || $[66] !== items || $[67] !== renderTab) {
+    let t27;
+    if ($[69] !== context || $[70] !== renderTab) {
+      t27 = item_0 => /*#__PURE__*/_jsx(TabContext.Provider, {
         value: context,
         children: renderTab ? renderTab(item_0) : /*#__PURE__*/_jsx(DocumentTab, {
           item: item_0
         })
       }, item_0.id);
-      $[67] = context;
-      $[68] = renderTab;
-      $[69] = t26;
+      $[69] = context;
+      $[70] = renderTab;
+      $[71] = t27;
     } else {
-      t26 = $[69];
+      t27 = $[71];
     }
-    t25 = items.map(t26);
-    $[63] = context;
-    $[64] = items;
-    $[65] = renderTab;
-    $[66] = t25;
+    t26 = items.map(t27);
+    $[65] = context;
+    $[66] = items;
+    $[67] = renderTab;
+    $[68] = t26;
   } else {
-    t25 = $[66];
+    t26 = $[68];
   }
-  let t26;
-  if ($[70] !== insertAt || $[71] !== insertion) {
-    t26 = insertAt !== undefined && insertAt !== null && /*#__PURE__*/_jsx("span", {
+  let t27;
+  if ($[72] !== insertAt || $[73] !== insertion) {
+    t27 = insertAt !== undefined && insertAt !== null && /*#__PURE__*/_jsx("span", {
       "aria-hidden": "true",
       className: "ade-tab-insertion",
       style: {
         left: insertion
       }
     });
-    $[70] = insertAt;
-    $[71] = insertion;
-    $[72] = t26;
+    $[72] = insertAt;
+    $[73] = insertion;
+    $[74] = t27;
   } else {
-    t26 = $[72];
+    t27 = $[74];
   }
-  let t27;
-  if ($[73] !== t25 || $[74] !== t26) {
-    t27 = /*#__PURE__*/_jsxs(_Fragment, {
-      children: [t25, t26]
+  let t28;
+  if ($[75] !== t26 || $[76] !== t27) {
+    t28 = /*#__PURE__*/_jsxs(_Fragment, {
+      children: [t26, t27]
     });
-    $[73] = t25;
-    $[74] = t26;
-    $[75] = t27;
+    $[75] = t26;
+    $[76] = t27;
+    $[77] = t28;
   } else {
-    t27 = $[75];
+    t28 = $[77];
   }
-  let t28;
-  if ($[76] !== props || $[77] !== t15 || $[78] !== t16 || $[79] !== t17 || $[80] !== t18 || $[81] !== t19 || $[82] !== t20 || $[83] !== t21 || $[84] !== t22 || $[85] !== t23 || $[86] !== t24 || $[87] !== t27) {
-    t28 = {
+  let t29;
+  if ($[78] !== props || $[79] !== t16 || $[80] !== t17 || $[81] !== t18 || $[82] !== t19 || $[83] !== t20 || $[84] !== t21 || $[85] !== t22 || $[86] !== t23 || $[87] !== t24 || $[88] !== t25 || $[89] !== t28) {
+    t29 = {
       ...props,
       role: "tablist",
-      "aria-label": t15,
-      className: t16,
-      "data-focused": t17,
-      "data-fade-start": t18,
-      "data-fade-end": t19,
-      onScroll: t20,
-      onWheel: t21,
-      onPointerDown: t22,
-      onDragOver: t23,
-      onDrop: t24,
-      children: t27
+      "aria-label": t16,
+      className: t17,
+      "data-focused": t18,
+      "data-fade-start": t19,
+      "data-fade-end": t20,
+      onScroll: t21,
+      onWheel: t22,
+      onPointerDown: t23,
+      onDragOver: t24,
+      onDrop: t25,
+      children: t28
     };
-    $[76] = props;
-    $[77] = t15;
-    $[78] = t16;
-    $[79] = t17;
-    $[80] = t18;
-    $[81] = t19;
-    $[82] = t20;
-    $[83] = t21;
-    $[84] = t22;
-    $[85] = t23;
-    $[86] = t24;
-    $[87] = t27;
-    $[88] = t28;
-  } else {
-    t28 = $[88];
-  }
-  let t29;
-  if ($[89] !== render || $[90] !== t14 || $[91] !== t28) {
-    t29 = {
+    $[78] = props;
+    $[79] = t16;
+    $[80] = t17;
+    $[81] = t18;
+    $[82] = t19;
+    $[83] = t20;
+    $[84] = t21;
+    $[85] = t22;
+    $[86] = t23;
+    $[87] = t24;
+    $[88] = t25;
+    $[89] = t28;
+    $[90] = t29;
+  } else {
+    t29 = $[90];
+  }
+  let t30;
+  if ($[91] !== render || $[92] !== t15 || $[93] !== t29) {
+    t30 = {
       render,
-      ref: t14,
+      ref: t15,
       defaultTagName: "div",
-      props: t28
+      props: t29
     };
-    $[89] = render;
-    $[90] = t14;
-    $[91] = t28;
-    $[92] = t29;
+    $[91] = render;
+    $[92] = t15;
+    $[93] = t29;
+    $[94] = t30;
   } else {
-    t29 = $[92];
+    t30 = $[94];
   }
-  return useRender(t29);
+  return useRender(t30);
 }
 function _temp2(event) {
   const rects = Array.from(event.currentTarget.querySelectorAll("[data-document-tab]"), _temp);
@@ -495,7 +502,7 @@ function _temp(tab_1) {
 const TabContext = createContext(null);
 /** A tab with application-owned metadata and menus, rendered inside TabStrip's renderTab slot. */
 export function DocumentTab(t0) {
-  const $ = _c(92);
+  const $ = _c(107);
   let className;
   let closeShortcut;
   let item;
@@ -585,180 +592,229 @@ export function DocumentTab(t0) {
   const close = t2;
   const closable = item.closable !== false && (onClose ?? context.onClose) !== undefined;
   let t3;
-  if ($[20] !== className) {
-    t3 = clsx("ade-document-tab", className);
-    $[20] = className;
-    $[21] = t3;
+  if ($[20] !== closable || $[21] !== context.pressToClose || $[22] !== item.pinned) {
+    t3 = event => !!context.pressToClose && closable && !item.pinned && (event.button === 1 || event.button === 0 && event.shiftKey && !event.metaKey && !event.ctrlKey && !event.altKey);
+    $[20] = closable;
+    $[21] = context.pressToClose;
+    $[22] = item.pinned;
+    $[23] = t3;
   } else {
-    t3 = $[21];
+    t3 = $[23];
   }
-  const t4 = item.id === value || undefined;
-  const t5 = !!item.detail || undefined;
-  let t6;
-  if ($[22] !== context || $[23] !== item.id || $[24] !== props) {
-    t6 = event => {
-      props.onContextMenu?.(event);
-      context.onContextMenu?.(item.id, event);
+  const closesOnPress = t3;
+  let t4;
+  if ($[24] !== className) {
+    t4 = clsx("ade-document-tab", className);
+    $[24] = className;
+    $[25] = t4;
+  } else {
+    t4 = $[25];
+  }
+  const t5 = item.id === value || undefined;
+  const t6 = !!item.detail || undefined;
+  let t7;
+  if ($[26] !== context || $[27] !== item.id || $[28] !== props) {
+    t7 = event_0 => {
+      props.onContextMenu?.(event_0);
+      context.onContextMenu?.(item.id, event_0);
     };
-    $[22] = context;
-    $[23] = item.id;
-    $[24] = props;
-    $[25] = t6;
+    $[26] = context;
+    $[27] = item.id;
+    $[28] = props;
+    $[29] = t7;
   } else {
-    t6 = $[25];
+    t7 = $[29];
   }
-  const t7 = item.hint ?? item.label;
-  const t8 = item.id === value;
-  const t9 = item.id === value || value === null && index === 0 ? 0 : -1;
-  const t10 = !!(onDragStart ?? context.onDragStart);
-  let t11;
-  if ($[26] !== item.id || $[27] !== onValueChange) {
-    t11 = () => onValueChange(item.id);
-    $[26] = item.id;
-    $[27] = onValueChange;
-    $[28] = t11;
+  let t8;
+  if ($[30] !== closesOnPress || $[31] !== props) {
+    t8 = event_1 => {
+      props.onMouseDown?.(event_1);
+      if (closesOnPress(event_1)) {
+        event_1.preventDefault();
+      }
+    };
+    $[30] = closesOnPress;
+    $[31] = props;
+    $[32] = t8;
   } else {
-    t11 = $[28];
+    t8 = $[32];
   }
-  let t12;
-  if ($[29] !== context.onDoubleClick || $[30] !== item.id || $[31] !== onDoubleClick) {
-    t12 = event_0 => (onDoubleClick ?? context.onDoubleClick)?.(item.id, event_0);
-    $[29] = context.onDoubleClick;
-    $[30] = item.id;
-    $[31] = onDoubleClick;
-    $[32] = t12;
+  let t9;
+  if ($[33] !== close || $[34] !== closesOnPress || $[35] !== props) {
+    t9 = event_2 => {
+      props.onAuxClick?.(event_2);
+      if (event_2.button === 1 && closesOnPress(event_2)) {
+        event_2.preventDefault();
+        close();
+      }
+    };
+    $[33] = close;
+    $[34] = closesOnPress;
+    $[35] = props;
+    $[36] = t9;
   } else {
-    t12 = $[32];
+    t9 = $[36];
   }
-  let t13;
-  if ($[33] !== context.onDragStart || $[34] !== item.id || $[35] !== onDragStart) {
-    t13 = event_1 => {
-      event_1.stopPropagation();
-      (onDragStart ?? context.onDragStart)?.(item.id, event_1);
+  const t10 = item.hint ?? item.label;
+  const t11 = item.id === value;
+  const t12 = item.id === value || value === null && index === 0 ? 0 : -1;
+  const t13 = !!(onDragStart ?? context.onDragStart);
+  let t14;
+  if ($[37] !== close || $[38] !== closesOnPress || $[39] !== item.id || $[40] !== onValueChange) {
+    t14 = event_3 => {
+      if (closesOnPress(event_3)) {
+        close();
+        return;
+      }
+      onValueChange(item.id);
     };
-    $[33] = context.onDragStart;
-    $[34] = item.id;
-    $[35] = onDragStart;
-    $[36] = t13;
+    $[37] = close;
+    $[38] = closesOnPress;
+    $[39] = item.id;
+    $[40] = onValueChange;
+    $[41] = t14;
   } else {
-    t13 = $[36];
+    t14 = $[41];
   }
-  const t14 = onDragEnd ?? context.onDragEnd;
   let t15;
-  if ($[37] !== closable || $[38] !== close || $[39] !== context || $[40] !== index || $[41] !== items || $[42] !== onValueChange) {
-    t15 = event_2 => {
-      const next = tabIndexForKey(event_2.key, index, items.length);
+  if ($[42] !== context.onDoubleClick || $[43] !== item.id || $[44] !== onDoubleClick) {
+    t15 = event_4 => (onDoubleClick ?? context.onDoubleClick)?.(item.id, event_4);
+    $[42] = context.onDoubleClick;
+    $[43] = item.id;
+    $[44] = onDoubleClick;
+    $[45] = t15;
+  } else {
+    t15 = $[45];
+  }
+  let t16;
+  if ($[46] !== context.onDragStart || $[47] !== item.id || $[48] !== onDragStart) {
+    t16 = event_5 => {
+      event_5.stopPropagation();
+      (onDragStart ?? context.onDragStart)?.(item.id, event_5);
+    };
+    $[46] = context.onDragStart;
+    $[47] = item.id;
+    $[48] = onDragStart;
+    $[49] = t16;
+  } else {
+    t16 = $[49];
+  }
+  const t17 = onDragEnd ?? context.onDragEnd;
+  let t18;
+  if ($[50] !== closable || $[51] !== close || $[52] !== context || $[53] !== index || $[54] !== items || $[55] !== onValueChange) {
+    t18 = event_6 => {
+      const next = tabIndexForKey(event_6.key, index, items.length);
       if (next !== null) {
-        event_2.preventDefault();
+        event_6.preventDefault();
         onValueChange(items[next].id);
         context.focus(next);
       } else {
-        if (event_2.key === "Delete" && closable) {
-          event_2.preventDefault();
+        if (event_6.key === "Delete" && closable) {
+          event_6.preventDefault();
           close();
         }
       }
     };
-    $[37] = closable;
-    $[38] = close;
-    $[39] = context;
-    $[40] = index;
-    $[41] = items;
-    $[42] = onValueChange;
-    $[43] = t15;
+    $[50] = closable;
+    $[51] = close;
+    $[52] = context;
+    $[53] = index;
+    $[54] = items;
+    $[55] = onValueChange;
+    $[56] = t18;
   } else {
-    t15 = $[43];
+    t18 = $[56];
   }
-  let t16;
-  if ($[44] !== item.label) {
-    t16 = /*#__PURE__*/_jsx("span", {
+  let t19;
+  if ($[57] !== item.label) {
+    t19 = /*#__PURE__*/_jsx("span", {
       className: "truncate",
       children: item.label
     });
-    $[44] = item.label;
-    $[45] = t16;
+    $[57] = item.label;
+    $[58] = t19;
   } else {
-    t16 = $[45];
+    t19 = $[58];
   }
-  let t17;
-  if ($[46] !== item.unsaved || $[47] !== t) {
-    t17 = item.unsaved && /*#__PURE__*/_jsx("span", {
+  let t20;
+  if ($[59] !== item.unsaved || $[60] !== t) {
+    t20 = item.unsaved && /*#__PURE__*/_jsx("span", {
       className: "ade-tab-unsaved",
       children: /*#__PURE__*/_jsx("span", {
         className: "sr-only",
         children: typeof item.unsaved === "string" ? item.unsaved : t("workspace.unsaved")
       })
     });
-    $[46] = item.unsaved;
-    $[47] = t;
-    $[48] = t17;
+    $[59] = item.unsaved;
+    $[60] = t;
+    $[61] = t20;
   } else {
-    t17 = $[48];
+    t20 = $[61];
   }
-  let t18;
-  if ($[49] !== item.attention || $[50] !== item.detail || $[51] !== item.icon || $[52] !== item.panelId || $[53] !== item.tabId || $[54] !== t10 || $[55] !== t11 || $[56] !== t12 || $[57] !== t13 || $[58] !== t14 || $[59] !== t15 || $[60] !== t16 || $[61] !== t17 || $[62] !== t8 || $[63] !== t9) {
-    t18 = /*#__PURE__*/_jsxs("button", {
+  let t21;
+  if ($[62] !== item.attention || $[63] !== item.detail || $[64] !== item.icon || $[65] !== item.panelId || $[66] !== item.tabId || $[67] !== t11 || $[68] !== t12 || $[69] !== t13 || $[70] !== t14 || $[71] !== t15 || $[72] !== t16 || $[73] !== t17 || $[74] !== t18 || $[75] !== t19 || $[76] !== t20) {
+    t21 = /*#__PURE__*/_jsxs("button", {
       type: "button",
       role: "tab",
       id: item.tabId,
       "aria-controls": item.panelId,
-      "aria-selected": t8,
-      tabIndex: t9,
+      "aria-selected": t11,
+      tabIndex: t12,
       className: "ade-document-tab-open",
-      draggable: t10,
-      onClick: t11,
-      onDoubleClick: t12,
-      onDragStart: t13,
-      onDragEnd: t14,
-      onKeyDown: t15,
-      children: [item.icon, t16, item.detail, item.attention, t17]
+      draggable: t13,
+      onClick: t14,
+      onDoubleClick: t15,
+      onDragStart: t16,
+      onDragEnd: t17,
+      onKeyDown: t18,
+      children: [item.icon, t19, item.detail, item.attention, t20]
     });
-    $[49] = item.attention;
-    $[50] = item.detail;
-    $[51] = item.icon;
-    $[52] = item.panelId;
-    $[53] = item.tabId;
-    $[54] = t10;
-    $[55] = t11;
-    $[56] = t12;
-    $[57] = t13;
-    $[58] = t14;
-    $[59] = t15;
-    $[60] = t16;
-    $[61] = t17;
-    $[62] = t8;
-    $[63] = t9;
-    $[64] = t18;
-  } else {
-    t18 = $[64];
+    $[62] = item.attention;
+    $[63] = item.detail;
+    $[64] = item.icon;
+    $[65] = item.panelId;
+    $[66] = item.tabId;
+    $[67] = t11;
+    $[68] = t12;
+    $[69] = t13;
+    $[70] = t14;
+    $[71] = t15;
+    $[72] = t16;
+    $[73] = t17;
+    $[74] = t18;
+    $[75] = t19;
+    $[76] = t20;
+    $[77] = t21;
+  } else {
+    t21 = $[77];
   }
-  let t19;
-  if ($[65] !== t18 || $[66] !== t7) {
-    t19 = /*#__PURE__*/_jsx(Tooltip, {
-      label: t7,
-      children: t18
+  let t22;
+  if ($[78] !== t10 || $[79] !== t21) {
+    t22 = /*#__PURE__*/_jsx(Tooltip, {
+      label: t10,
+      children: t21
     });
-    $[65] = t18;
-    $[66] = t7;
-    $[67] = t19;
+    $[78] = t10;
+    $[79] = t21;
+    $[80] = t22;
   } else {
-    t19 = $[67];
+    t22 = $[80];
   }
-  let t20;
-  if ($[68] !== item.pinned) {
-    t20 = item.pinned && /*#__PURE__*/_jsx(Icon, {
+  let t23;
+  if ($[81] !== item.pinned) {
+    t23 = item.pinned && /*#__PURE__*/_jsx(Icon, {
       icon: Pin,
       size: 12,
       className: "shrink-0 text-text-muted"
     });
-    $[68] = item.pinned;
-    $[69] = t20;
+    $[81] = item.pinned;
+    $[82] = t23;
   } else {
-    t20 = $[69];
+    t23 = $[82];
   }
-  let t21;
-  if ($[70] !== closable || $[71] !== close || $[72] !== closeShortcut || $[73] !== item.label || $[74] !== t) {
-    t21 = closable && /*#__PURE__*/_jsx(IconButton, {
+  let t24;
+  if ($[83] !== closable || $[84] !== close || $[85] !== closeShortcut || $[86] !== item.label || $[87] !== t) {
+    t24 = closable && /*#__PURE__*/_jsx(IconButton, {
       icon: X,
       size: "2xs",
       label: t("workspace.closeTab", {
@@ -768,63 +824,67 @@ export function DocumentTab(t0) {
       className: "ade-document-tab-close",
       onClick: close
     });
-    $[70] = closable;
-    $[71] = close;
-    $[72] = closeShortcut;
-    $[73] = item.label;
-    $[74] = t;
-    $[75] = t21;
+    $[83] = closable;
+    $[84] = close;
+    $[85] = closeShortcut;
+    $[86] = item.label;
+    $[87] = t;
+    $[88] = t24;
   } else {
-    t21 = $[75];
+    t24 = $[88];
   }
-  let t22;
-  if ($[76] !== t19 || $[77] !== t20 || $[78] !== t21) {
-    t22 = /*#__PURE__*/_jsxs(_Fragment, {
-      children: [t19, t20, t21]
+  let t25;
+  if ($[89] !== t22 || $[90] !== t23 || $[91] !== t24) {
+    t25 = /*#__PURE__*/_jsxs(_Fragment, {
+      children: [t22, t23, t24]
     });
-    $[76] = t19;
-    $[77] = t20;
-    $[78] = t21;
-    $[79] = t22;
+    $[89] = t22;
+    $[90] = t23;
+    $[91] = t24;
+    $[92] = t25;
   } else {
-    t22 = $[79];
+    t25 = $[92];
   }
-  let t23;
-  if ($[80] !== item.id || $[81] !== props || $[82] !== t22 || $[83] !== t3 || $[84] !== t4 || $[85] !== t5 || $[86] !== t6) {
-    t23 = {
+  let t26;
+  if ($[93] !== item.id || $[94] !== props || $[95] !== t25 || $[96] !== t4 || $[97] !== t5 || $[98] !== t6 || $[99] !== t7 || $[100] !== t8 || $[101] !== t9) {
+    t26 = {
       ...props,
-      className: t3,
+      className: t4,
       "data-document-tab": item.id,
-      "data-active": t4,
-      "data-detail": t5,
-      onContextMenu: t6,
-      children: t22
+      "data-active": t5,
+      "data-detail": t6,
+      onContextMenu: t7,
+      onMouseDown: t8,
+      onAuxClick: t9,
+      children: t25
     };
-    $[80] = item.id;
-    $[81] = props;
-    $[82] = t22;
-    $[83] = t3;
-    $[84] = t4;
-    $[85] = t5;
-    $[86] = t6;
-    $[87] = t23;
-  } else {
-    t23 = $[87];
+    $[93] = item.id;
+    $[94] = props;
+    $[95] = t25;
+    $[96] = t4;
+    $[97] = t5;
+    $[98] = t6;
+    $[99] = t7;
+    $[100] = t8;
+    $[101] = t9;
+    $[102] = t26;
+  } else {
+    t26 = $[102];
   }
-  let t24;
-  if ($[88] !== ref || $[89] !== render || $[90] !== t23) {
-    t24 = {
+  let t27;
+  if ($[103] !== ref || $[104] !== render || $[105] !== t26) {
+    t27 = {
       render,
       ref,
       defaultTagName: "span",
-      props: t23
+      props: t26
     };
-    $[88] = ref;
-    $[89] = render;
-    $[90] = t23;
-    $[91] = t24;
+    $[103] = ref;
+    $[104] = render;
+    $[105] = t26;
+    $[106] = t27;
   } else {
-    t24 = $[91];
+    t27 = $[106];
   }
-  return useRender(t24);
+  return useRender(t27);
 }