@flamingo-stack/openframe-frontend-core 0.0.777 → 0.0.781

package/dist/{chunk-KLTUTZBO.cjs → chunk-YEJWNHD3.cjs}

@@ -12,13 +12,13 @@ var _chunkVXAKQRV7cjs = require('./chunk-VXAKQRV7.cjs');
 
 
 
-var _chunkLBGAHB6Xcjs = require('./chunk-LBGAHB6X.cjs');
+var _chunkT7SDYBSTcjs = require('./chunk-T7SDYBST.cjs');
 
 
 
 
 
-var _chunkLELS4XMXcjs = require('./chunk-LELS4XMX.cjs');
+var _chunkVZKAAXU3cjs = require('./chunk-VZKAAXU3.cjs');
 
 
 var _chunk4WI2CEC2cjs = require('./chunk-4WI2CEC2.cjs');
@@ -69,11 +69,11 @@ var _chunkZ7OPT4PNcjs = require('./chunk-Z7OPT4PN.cjs');
 var _chunkSKI6NKOEcjs = require('./chunk-SKI6NKOE.cjs');
 
 
-var _chunk3ZLPYEL5cjs = require('./chunk-3ZLPYEL5.cjs');
+var _chunkQ7HXTF2Ccjs = require('./chunk-Q7HXTF2C.cjs');
 
 
 
-var _chunkBNUZKBNVcjs = require('./chunk-BNUZKBNV.cjs');
+var _chunkAFJEUBDScjs = require('./chunk-AFJEUBDS.cjs');
 
 
 var _chunkV4FXUIMHcjs = require('./chunk-V4FXUIMH.cjs');
@@ -82,16 +82,20 @@ var _chunkV4FXUIMHcjs = require('./chunk-V4FXUIMH.cjs');
 var _chunkSZHDXXMKcjs = require('./chunk-SZHDXXMK.cjs');
 
 
-var _chunkXFRBEXQNcjs = require('./chunk-XFRBEXQN.cjs');
 
+var _chunkYNDH72VUcjs = require('./chunk-YNDH72VU.cjs');
 
-var _chunkTF5D5MNOcjs = require('./chunk-TF5D5MNO.cjs');
 
+var _chunkCDBFQVPAcjs = require('./chunk-CDBFQVPA.cjs');
 
-var _chunkV45KLJQPcjs = require('./chunk-V45KLJQP.cjs');
 
 
-var _chunk65VVJSQZcjs = require('./chunk-65VVJSQZ.cjs');
+
+
+var _chunkN6YCOBLKcjs = require('./chunk-N6YCOBLK.cjs');
+
+
+var _chunkV45KLJQPcjs = require('./chunk-V45KLJQP.cjs');
 
 // src/components/ui/deleted-user-avatar.tsx
 var _jsxruntime = require('react/jsx-runtime');
@@ -111,12 +115,12 @@ function DeletedUserAvatar({ size = "md", className, accessibleLabel }) {
     {
       role: "img",
       "aria-label": accessibleLabel || "Deleted user",
-      className: _chunk65VVJSQZcjs.cn.call(void 0, 
+      className: _chunkN6YCOBLKcjs.cn.call(void 0, 
         "flex shrink-0 items-center justify-center rounded-full bg-ods-error/20",
         SIZE_CLASSES[size],
         className
       ),
-      children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk4WI2CEC2cjs.UserXmarkIcon, { className: _chunk65VVJSQZcjs.cn.call(void 0, "text-ods-error", ICON_CLASSES[size]) })
+      children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk4WI2CEC2cjs.UserXmarkIcon, { className: _chunkN6YCOBLKcjs.cn.call(void 0, "text-ods-error", ICON_CLASSES[size]) })
     }
   );
 }
@@ -142,9 +146,9 @@ function TouchFriendlyTooltip({ content, side = "left", children }) {
       return next;
     });
   };
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLELS4XMXcjs.TooltipProvider, { delayDuration: 150, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkLELS4XMXcjs.Tooltip, { open, onOpenChange: setOpen, children: [
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVZKAAXU3cjs.TooltipProvider, { delayDuration: 150, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkVZKAAXU3cjs.Tooltip, { open, onOpenChange: setOpen, children: [
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunkLELS4XMXcjs.TooltipTrigger,
+      _chunkVZKAAXU3cjs.TooltipTrigger,
       {
         asChild: true,
         onPointerDown: (e) => {
@@ -162,7 +166,7 @@ function TouchFriendlyTooltip({ content, side = "left", children }) {
         children
       }
     ),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLELS4XMXcjs.TooltipContent, { side, className: "max-w-xs", children: content })
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVZKAAXU3cjs.TooltipContent, { side, className: "max-w-xs", children: content })
   ] }) });
 }
 
@@ -177,12 +181,12 @@ function BoardColumnHeader({
 }) {
   const count = _nullishCoalesce(column.total, () => ( column.tickets.length));
   const tagStatus = _nullishCoalesce(column.statusKey, () => ( column.id));
-  const useStatusVariant = _chunkLBGAHB6Xcjs.resolveTicketStatus.call(void 0, tagStatus) !== null;
+  const useStatusVariant = _chunkT7SDYBSTcjs.resolveTicketStatus.call(void 0, tagStatus) !== null;
   const actionClass = "h-8 w-8 p-0 content-md:h-8 content-md:w-8";
   if (collapsed) {
     return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-full flex-col items-center gap-[var(--spacing-system-xsf)]", children: [
       onToggleCollapse && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        _chunkTF5D5MNOcjs.Button,
+        _chunkCDBFQVPAcjs.Button,
         {
           variant: "transparent",
           size: "icon",
@@ -193,7 +197,7 @@ function BoardColumnHeader({
         }
       ),
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        _chunkLBGAHB6Xcjs.TicketStatusTag,
+        _chunkT7SDYBSTcjs.TicketStatusTag,
         {
           status: tagStatus,
           label: column.label,
@@ -206,13 +210,13 @@ function BoardColumnHeader({
   }
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-[var(--spacing-system-xsf)]", children: [
     /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-w-0 flex-1 items-center gap-[var(--spacing-system-xsf)]", children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLBGAHB6Xcjs.TicketStatusTag, { status: tagStatus, label: column.label, color: useStatusVariant ? void 0 : column.color }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkT7SDYBSTcjs.TicketStatusTag, { status: tagStatus, label: column.label, color: useStatusVariant ? void 0 : column.color }),
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-h5", style: useStatusVariant ? void 0 : { color: column.color }, children: count })
     ] }),
     /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex shrink-0 items-center gap-[var(--spacing-system-xxs)]", children: [
-      column.tooltip && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TouchFriendlyTooltip, { content: column.tooltip, side: "bottom", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkTF5D5MNOcjs.Button, { variant: "transparent", size: "icon", className: actionClass, "aria-label": column.tooltip, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkRHC2FRVEcjs.InfoCircleIcon, { className: "h-6 w-6 text-ods-text-secondary" }) }) }),
+      column.tooltip && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TouchFriendlyTooltip, { content: column.tooltip, side: "bottom", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkCDBFQVPAcjs.Button, { variant: "transparent", size: "icon", className: actionClass, "aria-label": column.tooltip, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkRHC2FRVEcjs.InfoCircleIcon, { className: "h-6 w-6 text-ods-text-secondary" }) }) }),
       onToggleCollapse && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        _chunkTF5D5MNOcjs.Button,
+        _chunkCDBFQVPAcjs.Button,
         {
           variant: "transparent",
           size: "icon",
@@ -223,7 +227,7 @@ function BoardColumnHeader({
         }
       ),
       onArchive && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        _chunkTF5D5MNOcjs.Button,
+        _chunkCDBFQVPAcjs.Button,
         {
           variant: "transparent",
           size: "icon",
@@ -234,7 +238,7 @@ function BoardColumnHeader({
         }
       ),
       onAddTicket && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        _chunkTF5D5MNOcjs.Button,
+        _chunkCDBFQVPAcjs.Button,
         {
           variant: "transparent",
           size: "icon",
@@ -264,36 +268,27 @@ function tintOnDark(hex) {
 
 function BoardTicketApproval({ pendingApproval, onApprove, onReject }) {
   const [expanded, setExpanded] = _react.useState.call(void 0, false);
-  const { innerRef, containerStyle } = _chunkLBGAHB6Xcjs.useCollapsible.call(void 0, { expanded });
+  const { innerRef, containerStyle } = _chunkT7SDYBSTcjs.useCollapsible.call(void 0, { expanded });
   const isAdmin = pendingApproval.approvalType === "ADMIN";
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "pointer-events-auto flex flex-col", children: [
-    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-      "button",
-      {
-        type: "button",
-        onClick: () => setExpanded((v) => !v),
-        "aria-expanded": expanded,
-        className: "flex w-full cursor-pointer items-center gap-[var(--spacing-system-xxs)] text-h6",
-        children: [
-          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-            "span",
-            {
-              className: _chunk65VVJSQZcjs.cn.call(void 0, 
-                "flex min-w-0 flex-1 items-center gap-[var(--spacing-system-xxs)]",
-                isAdmin ? "text-ods-open-yellow" : "text-ods-text-secondary"
-              ),
-              children: [
-                isAdmin ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkOBGYDNT6cjs.ShieldCheckIcon, { className: "size-4 shrink-0" }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkC7GIHB3Vcjs.DotsLoaderIcon, { size: 16, className: "shrink-0" }),
-                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "flex-1 truncate text-left", children: isAdmin ? "Technician approval required" : "Pending client approval" })
-              ]
-            }
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkCDBFQVPAcjs.Button, { variant: "row", type: "button", onClick: () => setExpanded((v) => !v), "aria-expanded": expanded, children: [
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+        "span",
+        {
+          className: _chunkN6YCOBLKcjs.cn.call(void 0, 
+            "flex min-w-0 flex-1 items-center gap-[var(--spacing-system-xxs)] text-h6",
+            isAdmin ? "text-ods-open-yellow" : "text-ods-text-secondary"
           ),
-          expanded ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk3MRRIHC2cjs.Chevron02UpIcon, { className: "size-4 shrink-0 text-ods-text-secondary" }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkSKI6NKOEcjs.Chevron02DownIcon, { className: "size-4 shrink-0 text-ods-text-secondary" })
-        ]
-      }
-    ),
+          children: [
+            isAdmin ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkOBGYDNT6cjs.ShieldCheckIcon, { className: "size-4 shrink-0" }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkC7GIHB3Vcjs.DotsLoaderIcon, { size: 16, className: "shrink-0" }),
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "flex-1 truncate text-left", children: isAdmin ? "Technician approval required" : "Pending client approval" })
+          ]
+        }
+      ),
+      expanded ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk3MRRIHC2cjs.Chevron02UpIcon, { className: "size-4 shrink-0 text-ods-text-secondary" }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkSKI6NKOEcjs.Chevron02DownIcon, { className: "size-4 shrink-0 text-ods-text-secondary" })
+    ] }),
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { style: containerStyle, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { ref: innerRef, className: "pt-[var(--spacing-system-xs)]", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunkLBGAHB6Xcjs.ApprovalBatchMessage,
+      _chunkT7SDYBSTcjs.ApprovalBatchMessage,
       {
         className: "mb-0",
         data: {
@@ -428,14 +423,14 @@ function useIsLanding(ticketId) {
   return _react.useContext.call(void 0, LandingCardContext) === ticketId;
 }
 function hasMoveSettled(columns, move) {
-  const tickets = _optionalChain([columns, 'access', _2 => _2.find, 'call', _3 => _3((c) => c.id === move.toColumnId), 'optionalAccess', _4 => _4.tickets]);
+  const tickets = _optionalChain([columns, 'access', _ => _.find, 'call', _2 => _2((c) => c.id === move.toColumnId), 'optionalAccess', _3 => _3.tickets]);
   if (!tickets) return false;
   const index = tickets.findIndex((t) => t.id === move.ticketId);
   if (index < 0) return false;
   if (move.fromColumnId === move.toColumnId) {
-    return (_nullishCoalesce(_optionalChain([tickets, 'access', _5 => _5[index - 1], 'optionalAccess', _6 => _6.id]), () => ( null))) === move.afterTicketId;
+    return (_nullishCoalesce(_optionalChain([tickets, 'access', _4 => _4[index - 1], 'optionalAccess', _5 => _5.id]), () => ( null))) === move.afterTicketId;
   }
-  return !_optionalChain([columns, 'access', _7 => _7.find, 'call', _8 => _8((c) => c.id === move.fromColumnId), 'optionalAccess', _9 => _9.tickets, 'access', _10 => _10.some, 'call', _11 => _11((t) => t.id === move.ticketId)]);
+  return !_optionalChain([columns, 'access', _6 => _6.find, 'call', _7 => _7((c) => c.id === move.fromColumnId), 'optionalAccess', _8 => _8.tickets, 'access', _9 => _9.some, 'call', _10 => _10((t) => t.id === move.ticketId)]);
 }
 
 // src/components/features/board/ticket-card.tsx
@@ -457,6 +452,7 @@ var ACTIVITY_DEFAULT_LABEL = {
   stale: "No activity"
 };
 var TICKET_CARD_SHELL = "relative flex flex-col gap-[var(--spacing-system-sf)] rounded-md border border-ods-border bg-ods-bg p-[var(--spacing-system-sf)] select-none text-left";
+var TICKET_CARD_META_CLASS = "truncate text-ods-text-secondary text-h6";
 function TicketCardBody({
   ticket,
   columnColor,
@@ -467,15 +463,15 @@ function TicketCardBody({
   onLinkClick
 }) {
   const showNewMessage = !!ticket.hasNewMessage && !!columnColor;
-  const newMessageTextColor = columnColor ? _chunk3ZLPYEL5cjs.getReadableTextColor.call(void 0, columnColor) : void 0;
-  const showDeviceRow = !!(_optionalChain([ticket, 'access', _12 => _12.deviceHostnames, 'optionalAccess', _13 => _13.length]) || ticket.organizationName);
-  const deviceText = [_optionalChain([ticket, 'access', _14 => _14.deviceHostnames, 'optionalAccess', _15 => _15.join, 'call', _16 => _16(", ")]), ticket.organizationName].filter(Boolean).join(", ");
-  const hasRightSection = !!(ticket.priority || ticket.agent || _optionalChain([ticket, 'access', _17 => _17.assignees, 'optionalAccess', _18 => _18.length]) || renderAssignSlot);
+  const newMessageTextColor = columnColor ? _chunkQ7HXTF2Ccjs.getReadableTextColor.call(void 0, columnColor) : void 0;
+  const showDeviceRow = !!(_optionalChain([ticket, 'access', _11 => _11.deviceHostnames, 'optionalAccess', _12 => _12.length]) || ticket.organizationName);
+  const deviceText = [_optionalChain([ticket, 'access', _13 => _13.deviceHostnames, 'optionalAccess', _14 => _14.join, 'call', _15 => _15(", ")]), ticket.organizationName].filter(Boolean).join(", ");
+  const hasRightSection = !!(ticket.priority || ticket.agent || _optionalChain([ticket, 'access', _16 => _16.assignees, 'optionalAccess', _17 => _17.length]) || renderAssignSlot);
   const rightSection = hasRightSection ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "pointer-events-auto flex shrink-0 items-center gap-[var(--spacing-system-xsf)]", children: [
     ticket.priority && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
       _chunk52ILP67Ecjs.Flag02Icon,
       {
-        className: _chunk65VVJSQZcjs.cn.call(void 0, "size-4", PRIORITY_COLOR_CLASS[ticket.priority]),
+        className: _chunkN6YCOBLKcjs.cn.call(void 0, "size-4", PRIORITY_COLOR_CLASS[ticket.priority]),
         "aria-label": `Priority: ${ticket.priority}`
       }
     ),
@@ -485,10 +481,10 @@ function TicketCardBody({
         role: "img",
         "aria-label": `Owned by ${ticket.agent === "fae" ? "Fae" : "Mingo"}`,
         className: "flex size-8 shrink-0 items-center justify-center overflow-hidden rounded-full border border-ods-border bg-ods-bg",
-        children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLBGAHB6Xcjs.AgentMark, { agent: ticket.agent, className: ticket.agent === "fae" ? "size-full" : "size-5" })
+        children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkT7SDYBSTcjs.AgentMark, { agent: ticket.agent, className: ticket.agent === "fae" ? "size-full" : "size-5" })
       }
     ),
-    renderAssignSlot ? renderAssignSlot(ticket) : _optionalChain([ticket, 'access', _19 => _19.assignees, 'optionalAccess', _20 => _20.length]) ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex -space-x-2", children: [
+    renderAssignSlot ? renderAssignSlot(ticket) : _optionalChain([ticket, 'access', _18 => _18.assignees, 'optionalAccess', _19 => _19.length]) ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex -space-x-2", children: [
       ticket.assignees.slice(0, MAX_VISIBLE_ASSIGNEES).map(
         (a) => a.deleted ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
           DeletedUserAvatar,
@@ -498,7 +494,7 @@ function TicketCardBody({
           },
           a.id
         ) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          _chunkBNUZKBNVcjs.SquareAvatar,
+          _chunkAFJEUBDScjs.SquareAvatar,
           {
             src: a.avatarUrl,
             alt: _nullishCoalesce(_nullishCoalesce(a.name, () => ( a.initials)), () => ( a.id)),
@@ -515,10 +511,9 @@ function TicketCardBody({
       ] })
     ] }) : null
   ] }) : null;
-  const timestampLabel = ticket.createdAt ? _chunkLBGAHB6Xcjs.formatTicketRelativeTime.call(void 0, ticket.createdAt) : null;
-  const tooltipLabel = ticket.createdAt ? _chunkLBGAHB6Xcjs.formatTicketFullTimestamp.call(void 0, ticket.createdAt) : null;
+  const timestampLabel = ticket.createdAt ? _chunkT7SDYBSTcjs.formatTicketRelativeTime.call(void 0, ticket.createdAt) : null;
+  const tooltipLabel = ticket.createdAt ? _chunkT7SDYBSTcjs.formatTicketFullTimestamp.call(void 0, ticket.createdAt) : null;
   const metaLabel = [ticket.ticketNumber || null, timestampLabel].filter(Boolean).join(" \u2022 ");
-  const metaClass = "truncate text-ods-text-secondary text-h6";
   const meta = href ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
     _chunkV45KLJQPcjs.next_link_default,
     {
@@ -527,10 +522,10 @@ function TicketCardBody({
       prefetch: false,
       tabIndex: -1,
       onClick: onLinkClick,
-      className: _chunk65VVJSQZcjs.cn.call(void 0, "pointer-events-auto block", metaClass),
+      className: _chunkN6YCOBLKcjs.cn.call(void 0, "pointer-events-auto block", TICKET_CARD_META_CLASS),
       children: metaLabel
     }
-  ) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: _chunk65VVJSQZcjs.cn.call(void 0, tooltipLabel && "pointer-events-auto", metaClass), children: metaLabel });
+  ) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: _chunkN6YCOBLKcjs.cn.call(void 0, tooltipLabel && "pointer-events-auto", TICKET_CARD_META_CLASS), children: metaLabel });
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
     /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-start gap-[var(--spacing-system-sf)]", children: [
       /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-w-0 flex-1 flex-col gap-[var(--spacing-system-zero)]", title: ticket.title, children: [
@@ -542,10 +537,10 @@ function TicketCardBody({
       ] }),
       rightSection
     ] }),
-    _optionalChain([ticket, 'access', _21 => _21.tags, 'optionalAccess', _22 => _22.length]) ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TicketTagRow, { tags: ticket.tags }) : null,
-    metaLabel && (tooltipLabel ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLELS4XMXcjs.TooltipProvider, { children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkLELS4XMXcjs.Tooltip, { children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLELS4XMXcjs.TooltipTrigger, { asChild: true, children: meta }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkLELS4XMXcjs.TooltipContent, { children: tooltipLabel })
+    _optionalChain([ticket, 'access', _20 => _20.tags, 'optionalAccess', _21 => _21.length]) ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TicketTagRow, { tags: ticket.tags }) : null,
+    metaLabel && (tooltipLabel ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVZKAAXU3cjs.TooltipProvider, { children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkVZKAAXU3cjs.Tooltip, { children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVZKAAXU3cjs.TooltipTrigger, { asChild: true, children: meta }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkVZKAAXU3cjs.TooltipContent, { children: tooltipLabel })
     ] }) }) : meta),
     ticket.escalatedByUser && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-[var(--spacing-system-xxs)] text-ods-open-yellow text-h6", children: [
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk4MGDY2AAcjs.UserCheckIcon, { className: "size-4 shrink-0" }),
@@ -554,7 +549,7 @@ function TicketCardBody({
     ticket.activity && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
       "div",
       {
-        className: _chunk65VVJSQZcjs.cn.call(void 0, 
+        className: _chunkN6YCOBLKcjs.cn.call(void 0, 
           "flex items-center gap-[var(--spacing-system-xxs)] text-h6",
           ticket.activity.kind === "stale" ? "text-ods-open-yellow" : "text-ods-text-secondary"
         ),
@@ -565,7 +560,7 @@ function TicketCardBody({
       }
     ),
     showNewMessage && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunkBNUZKBNVcjs.Tag,
+      _chunkAFJEUBDScjs.Tag,
       {
         label: "New Message",
         icon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJSIUVERGcjs.MessagesIcon, { size: 16, color: newMessageTextColor }),
@@ -582,13 +577,13 @@ function TicketCardView({ className, style, ...bodyProps }) {
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
     "div",
     {
-      className: _chunk65VVJSQZcjs.cn.call(void 0, TICKET_CARD_SHELL, className),
+      className: _chunkN6YCOBLKcjs.cn.call(void 0, TICKET_CARD_SHELL, className),
       style: showNewMessage ? { borderColor: columnColor, ...style } : style,
       children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "relative z-10 flex flex-col gap-[var(--spacing-system-sf)]", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TicketCardBody, { ...bodyProps }) })
     }
   );
 }
-var TicketCard = _react.memo.call(void 0, function TicketCardImpl({
+var TicketCardImpl = _react.memo.call(void 0, function TicketCardDraggable({
   ticket,
   columnId,
   columnColor,
@@ -598,7 +593,8 @@ var TicketCard = _react.memo.call(void 0, function TicketCardImpl({
   allowedFromColumns,
   renderAssignSlot,
   onApprove,
-  onReject
+  onReject,
+  ...props
 }) {
   const ref = _react.useRef.call(void 0, null);
   const ticketRef = _react.useRef.call(void 0, ticket);
@@ -609,7 +605,7 @@ var TicketCard = _react.memo.call(void 0, function TicketCardImpl({
   const isLanding = useIsLanding(ticket.id);
   const aim = useDropAim();
   const closestEdge = aim && aim.columnId === columnId && aim.ticketId === ticket.id ? aim.edge : null;
-  const isSource = isDragging || _optionalChain([aim, 'optionalAccess', _23 => _23.ticket, 'access', _24 => _24.id]) === ticket.id;
+  const isSource = isDragging || _optionalChain([aim, 'optionalAccess', _22 => _22.ticket, 'access', _23 => _23.id]) === ticket.id;
   const lift = useBoardLift();
   const handleKeyDown = (e) => {
     if (e.key !== " " || dragDisabled || !lift) return;
@@ -713,14 +709,15 @@ var TicketCard = _react.memo.call(void 0, function TicketCardImpl({
     ),
     [ticket, columnColor, renderAssignSlot, onApprove, onReject, href, handleClick]
   );
-  const cardClasses = _chunk65VVJSQZcjs.cn.call(void 0, TICKET_CARD_SHELL, !dragDisabled && "cursor-pointer");
+  const cardClasses = _chunkN6YCOBLKcjs.cn.call(void 0, TICKET_CARD_SHELL, !dragDisabled && "cursor-pointer");
   const outerProps = {
     ref,
     style,
     className: cardClasses,
     // Read by the lane's scroll anchor to keep the list still when tickets are
     // inserted above the viewport — see `use-lane-scroll-anchor.ts`.
-    [TICKET_ID_ATTRIBUTE]: ticket.id
+    [TICKET_ID_ATTRIBUTE]: ticket.id,
+    ..._chunkN6YCOBLKcjs.loadingItemProps.call(void 0, props)
   };
   const innerWrapperClass = "relative z-10 flex flex-col gap-[var(--spacing-system-sf)]";
   if (isSource) {
@@ -733,7 +730,7 @@ var TicketCard = _react.memo.call(void 0, function TicketCardImpl({
     {
       "aria-hidden": true,
       ...{ [DROP_LINE_ATTRIBUTE]: "" },
-      className: _chunk65VVJSQZcjs.cn.call(void 0, 
+      className: _chunkN6YCOBLKcjs.cn.call(void 0, 
         // Nothing sticks out sideways or beyond the line's own 2px: the lane
         // scrolls, and a scroll container clips whatever leaves its padding box
         // — an end cap or a knob on this would be cut off against the first and
@@ -762,70 +759,114 @@ var TicketCard = _react.memo.call(void 0, function TicketCardImpl({
           className: "absolute inset-0 z-0 rounded-md focus-visible:outline-none"
         }
       ),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _chunk65VVJSQZcjs.cn.call(void 0, "pointer-events-none", innerWrapperClass), children: body })
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _chunkN6YCOBLKcjs.cn.call(void 0, "pointer-events-none", innerWrapperClass), children: body })
     ] });
   }
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { ...outerProps, children: [
     insertionLine,
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      "button",
+      _chunkCDBFQVPAcjs.Button,
       {
+        variant: "card",
         type: "button",
         onClick: handleClick,
         onKeyDown: handleKeyDown,
         "aria-label": ticket.title,
         "aria-keyshortcuts": keyShortcuts,
-        className: "absolute inset-0 z-0 cursor-pointer rounded-md focus-visible:outline-none"
+        className: "absolute inset-0 z-0"
       }
     ),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _chunk65VVJSQZcjs.cn.call(void 0, "pointer-events-none", innerWrapperClass), children: body })
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _chunkN6YCOBLKcjs.cn.call(void 0, "pointer-events-none", innerWrapperClass), children: body })
   ] });
 });
+var TicketCard = _react.memo.call(void 0, function TicketCardSwitch({ ticket, ...props }) {
+  const loading = _chunkN6YCOBLKcjs.useLoadingScope.call(void 0, ) || ticket === null;
+  if (loading) return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TicketCardSkeleton, { ..._chunkN6YCOBLKcjs.loadingItemProps.call(void 0, props) });
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TicketCardImpl, { ticket, ...props });
+});
 function TicketTagRow({ tags }) {
   const visible = tags.slice(0, MAX_VISIBLE_TAGS);
   const hidden = tags.length - visible.length;
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-8 flex-wrap items-start gap-[var(--spacing-system-xxs)] overflow-clip", children: [
-    visible.map((tag) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkBNUZKBNVcjs.Tag, { variant: "outline", label: tag }, tag)),
-    hidden > 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkBNUZKBNVcjs.Tag, { variant: "outline", label: `+${hidden}` })
+    visible.map((tag) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkAFJEUBDScjs.Tag, { variant: "outline", label: tag }, tag)),
+    hidden > 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkAFJEUBDScjs.Tag, { variant: "outline", label: `+${hidden}` })
   ] });
 }
-
-// src/components/features/board/ticket-card-skeleton.tsx
-
-
-var TicketCardSkeleton = _react.forwardRef.call(void 0, 
-  ({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-    "div",
-    {
-      ref,
-      className: _chunk65VVJSQZcjs.cn.call(void 0, 
-        "flex flex-col gap-[var(--spacing-system-sf)] rounded-md border border-ods-border bg-ods-bg p-[var(--spacing-system-sf)]",
-        className
-      ),
-      ...props,
-      children: [
-        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-start gap-[var(--spacing-system-sf)]", children: [
-          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-w-0 flex-1 flex-col gap-[var(--spacing-system-xxs)]", children: [
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex items-center text-h3", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-4 w-3/4" }) }),
-            /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-[var(--spacing-system-xxs)] text-h6", children: [
-              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "size-4 shrink-0 rounded-sm" }),
-              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-3 w-1/2" })
-            ] })
-          ] }),
-          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex shrink-0 items-center gap-[var(--spacing-system-xsf)]", children: [
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "size-4 rounded-sm" }),
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "size-8 rounded-full" })
-          ] })
-        ] }),
-        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-8 items-center gap-[var(--spacing-system-xxs)]", children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-8 w-16 rounded-md" }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-8 w-12 rounded-md" })
+function TicketCardSkeleton({ className, ...props }) {
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { "aria-hidden": true, className: _chunkN6YCOBLKcjs.cn.call(void 0, TICKET_CARD_SHELL, className), ..._chunkN6YCOBLKcjs.loadingItemProps.call(void 0, props), children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-start gap-[var(--spacing-system-sf)]", children: [
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-w-0 flex-1 flex-col gap-[var(--spacing-system-zero)]", children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYNDH72VUcjs.TextLineSkeleton, { type: "h3", className: "w-3/4" }),
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-w-0 items-center gap-[var(--spacing-system-xxs)] text-h6", children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYNDH72VUcjs.UnifiedSkeleton, { className: "size-4 shrink-0 rounded-sm" }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYNDH72VUcjs.TextLineSkeleton, { type: "inherit", className: "w-1/2" })
         ] })
-      ]
-    }
-  )
-);
-TicketCardSkeleton.displayName = "TicketCardSkeleton";
+      ] }),
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex shrink-0 items-center gap-[var(--spacing-system-xsf)]", children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYNDH72VUcjs.UnifiedSkeleton, { className: "size-4 rounded-sm" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYNDH72VUcjs.UnifiedSkeleton, { className: "size-8 rounded-full" })
+      ] })
+    ] }),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-8 items-start gap-[var(--spacing-system-xxs)]", children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkAFJEUBDScjs.Tag, { loading: true, label: "" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkAFJEUBDScjs.Tag, { loading: true, label: "" })
+    ] }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYNDH72VUcjs.TextLineSkeleton, { type: "h6", className: _chunkN6YCOBLKcjs.cn.call(void 0, TICKET_CARD_META_CLASS, "w-1/3") })
+  ] });
+}
+
+// src/components/features/board/types.ts
+var BOARD_COLUMN_PAGE_SIZE = 20;
+var STATUS_DEFAULTS = {
+  ACTIVE: { label: "Active", color: "#5ea62e" },
+  AI_ASSISTANCE: { label: "AI Handling", color: "#888888" },
+  TECH_REQUIRED: { label: "Tech Required", color: "#e1b32f" },
+  ON_HOLD: { label: "On Hold", color: "#f36666" },
+  RESOLVED: { label: "Resolved", color: "#888888" },
+  ARCHIVED: { label: "Archived", color: "#3a3a3a" }
+};
+function columnFromTicketStatus(status, tickets, overrides = {}) {
+  const defaults = STATUS_DEFAULTS[status];
+  return {
+    id: status,
+    label: _nullishCoalesce(overrides.label, () => ( defaults.label)),
+    color: _nullishCoalesce(overrides.color, () => ( defaults.color)),
+    tooltip: overrides.tooltip,
+    tickets,
+    total: overrides.total,
+    hasMore: overrides.hasMore,
+    isLoading: overrides.isLoading,
+    isLoadingMore: overrides.isLoadingMore,
+    system: overrides.system,
+    dropDisabled: overrides.dropDisabled,
+    dragDisabled: overrides.dragDisabled,
+    allowedFromColumns: overrides.allowedFromColumns,
+    archivable: overrides.archivable
+  };
+}
+function groupTicketsByStatus(tickets, statuses) {
+  const buckets = {
+    ACTIVE: [],
+    AI_ASSISTANCE: [],
+    TECH_REQUIRED: [],
+    ON_HOLD: [],
+    RESOLVED: [],
+    ARCHIVED: []
+  };
+  for (const t of tickets) {
+    const canonical = canonicalize(t.status);
+    if (canonical) buckets[canonical].push(t);
+  }
+  return statuses.map((s) => columnFromTicketStatus(s, buckets[s]));
+}
+function canonicalize(status) {
+  const upper = status.toUpperCase().replace(/\s+/g, "_");
+  if (upper === "ACTION_REQUIRED") return "TECH_REQUIRED";
+  if (upper === "ACTIVE" || upper === "AI_ASSISTANCE" || upper === "TECH_REQUIRED" || upper === "ON_HOLD" || upper === "RESOLVED" || upper === "ARCHIVED") {
+    return upper;
+  }
+  return null;
+}
 
 // src/components/features/board/board-column.tsx
 
@@ -924,7 +965,7 @@ var BoardColumn = _react.memo.call(void 0, function BoardColumnImpl({
       // large ones like the only thing that did.
       getData: ({ input, element: lane, source }) => {
         const nearest = nearestCardIn(lane, input.clientY, String(source.data.ticketId));
-        const ticketId = _optionalChain([nearest, 'optionalAccess', _25 => _25.dataset, 'access', _26 => _26.ticketId]);
+        const ticketId = _optionalChain([nearest, 'optionalAccess', _24 => _24.dataset, 'access', _25 => _25.ticketId]);
         if (!nearest || !ticketId) return { type: "column", columnId: column.id };
         return _closestedge.attachClosestEdge.call(void 0, 
           { type: "ticket", ticketId, columnId: column.id },
@@ -936,12 +977,12 @@ var BoardColumn = _react.memo.call(void 0, function BoardColumnImpl({
       onDrop: () => setIsOver(false)
     });
   }, [column.id, column.dropDisabled, column.allowedFromColumns, collapsed, touchMode]);
-  const handleToggleCollapse = _react.useCallback.call(void 0, () => _optionalChain([onToggleCollapse, 'optionalCall', _27 => _27(column.id)]), [onToggleCollapse, column.id]);
+  const handleToggleCollapse = _react.useCallback.call(void 0, () => _optionalChain([onToggleCollapse, 'optionalCall', _26 => _26(column.id)]), [onToggleCollapse, column.id]);
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
     "div",
     {
       ref: laneRef,
-      className: _chunk65VVJSQZcjs.cn.call(void 0, 
+      className: _chunkN6YCOBLKcjs.cn.call(void 0, 
         "flex h-full shrink-0 flex-col gap-[var(--spacing-system-sf)] overflow-hidden rounded-md border border-ods-border p-[var(--spacing-system-sf)]",
         "transition-[width] duration-300 ease-out",
         collapsed ? "w-14" : "w-[400px]",
@@ -1015,7 +1056,7 @@ function ColumnBody({
     const observer = new IntersectionObserver(
       (entries) => {
         if (entries.some((e) => e.isIntersecting)) {
-          _optionalChain([loadMoreRef, 'access', _28 => _28.current, 'optionalCall', _29 => _29(columnIdRef.current)]);
+          _optionalChain([loadMoreRef, 'access', _27 => _27.current, 'optionalCall', _28 => _28(columnIdRef.current)]);
         }
       },
       { root, rootMargin: loadMoreRootMargin }
@@ -1034,32 +1075,33 @@ function ColumnBody({
         ref: scrollRef,
         className: "flex min-h-0 flex-1 flex-col gap-[var(--spacing-system-xs)] overflow-y-auto py-[5px] [overflow-anchor:none]",
         children: [
-          column.isLoading ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SkeletonStack, {}) : column.tickets.length === 0 ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, EmptyState, { columnId: column.id, touchMode }) : column.tickets.map((t) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          column.isLoading ? (
+            // A lane loads one page of its tickets: its loading form draws that page, each card its own skeleton.
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkN6YCOBLKcjs.LoadingItems, { count: _nullishCoalesce(column.pageSize, () => ( BOARD_COLUMN_PAGE_SIZE)), children: () => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TicketCard, { ticket: null, columnId: column.id, "data-loading-item": true }) })
+          ) : column.tickets.length === 0 ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, EmptyState, { columnId: column.id, touchMode }) : column.tickets.map((t) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
             TicketCard,
             {
               ticket: t,
               columnId: column.id,
               columnColor: column.color,
-              href: _optionalChain([getTicketHref, 'optionalCall', _30 => _30(t.id)]),
+              href: _optionalChain([getTicketHref, 'optionalCall', _29 => _29(t.id)]),
               renderAssignSlot,
               onApprove,
               onReject,
               dragDisabled: touchMode || column.dragDisabled,
               dropDisabled: touchMode || column.dropDisabled,
-              allowedFromColumns: column.allowedFromColumns
+              allowedFromColumns: column.allowedFromColumns,
+              "data-loading-item": true
             },
             t.id
           )),
-          column.isLoadingMore && !column.isLoading && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TicketCardSkeleton, {}),
+          column.isLoadingMore && !column.isLoading && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TicketCard, { ticket: null, columnId: column.id }),
           column.hasMore && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { ref: sentinelRef, "aria-hidden": true, className: "h-1 shrink-0" })
         ]
       }
     )
   );
 }
-function SkeletonStack({ count = 4 }) {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _jsxruntime.Fragment, { children: Array.from({ length: count }, (_, i) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TicketCardSkeleton, {}, `skeleton-${i}`)) });
-}
 function EmptyState({ columnId, touchMode }) {
   const aim = useDropAim();
   if (aim && aim.columnId === columnId) {
@@ -1103,7 +1145,7 @@ var _reactdom = require('react-dom');
 
 // src/components/features/board/aim.ts
 
-var othersIn = (columns, columnId, ticketId) => (_nullishCoalesce(_optionalChain([columns, 'access', _31 => _31.find, 'call', _32 => _32((c) => c.id === columnId), 'optionalAccess', _33 => _33.tickets]), () => ( []))).filter((t) => t.id !== ticketId);
+var othersIn = (columns, columnId, ticketId) => (_nullishCoalesce(_optionalChain([columns, 'access', _30 => _30.find, 'call', _31 => _31((c) => c.id === columnId), 'optionalAccess', _32 => _32.tickets]), () => ( []))).filter((t) => t.id !== ticketId);
 function laneOf(columns, ticketId) {
   return _nullishCoalesce(columns.find((c) => c.tickets.some((t) => t.id === ticketId)), () => ( null));
 }
@@ -1147,11 +1189,11 @@ function aimToChange(columns, ticketId, aim) {
   const lane = laneOf(columns, ticketId);
   if (!lane) return null;
   const others = othersIn(columns, aim.columnId, ticketId);
-  const afterTicketId = _nullishCoalesce(_optionalChain([others, 'access', _34 => _34[aim.index - 1], 'optionalAccess', _35 => _35.id]), () => ( null));
-  const beforeTicketId = _nullishCoalesce(_optionalChain([others, 'access', _36 => _36[aim.index], 'optionalAccess', _37 => _37.id]), () => ( null));
+  const afterTicketId = _nullishCoalesce(_optionalChain([others, 'access', _33 => _33[aim.index - 1], 'optionalAccess', _34 => _34.id]), () => ( null));
+  const beforeTicketId = _nullishCoalesce(_optionalChain([others, 'access', _35 => _35[aim.index], 'optionalAccess', _36 => _36.id]), () => ( null));
   if (lane.id === aim.columnId) {
     const currentIndex = lane.tickets.findIndex((t) => t.id === ticketId);
-    if ((_nullishCoalesce(_optionalChain([lane, 'access', _38 => _38.tickets, 'access', _39 => _39[currentIndex - 1], 'optionalAccess', _40 => _40.id]), () => ( null))) === afterTicketId) return null;
+    if ((_nullishCoalesce(_optionalChain([lane, 'access', _37 => _37.tickets, 'access', _38 => _38[currentIndex - 1], 'optionalAccess', _39 => _39.id]), () => ( null))) === afterTicketId) return null;
   }
   return { ticketId, fromColumnId: lane.id, toColumnId: aim.columnId, afterTicketId, beforeTicketId };
 }
@@ -1181,7 +1223,7 @@ function TouchBoard({
   className
 }) {
   const { collapsed, toggle } = useBoardCollapse(collapseStorageKey, initialCollapsed);
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _chunk65VVJSQZcjs.cn.call(void 0, "flex h-full min-h-0 flex-col", className), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _chunkN6YCOBLKcjs.cn.call(void 0, "flex h-full min-h-0 flex-col", className), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
     "div",
     {
       className: "flex min-h-0 flex-1 snap-x snap-mandatory gap-[var(--spacing-system-mf)] overflow-x-auto overscroll-x-contain [scrollbar-width:none] [&::-webkit-scrollbar]:hidden",
@@ -1192,7 +1234,7 @@ function TouchBoard({
           touchMode: true,
           collapsed: !!collapsed[column.id],
           onToggleCollapse: toggle,
-          className: _chunk65VVJSQZcjs.cn.call(void 0, 
+          className: _chunkN6YCOBLKcjs.cn.call(void 0, 
             "snap-start",
             !collapsed[column.id] && "w-[min(400px,calc(100%_-_2*var(--spacing-system-mf)))]"
           ),
@@ -1220,11 +1262,24 @@ var DRAG_PREVIEW_Z = 1200;
 var ARROW_KEYS = ["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"];
 function Board(props) {
   const dragAndDropEnabled = _chunkV4FXUIMHcjs.useMediaQuery.call(void 0, _chunkVXAKQRV7cjs.DRAG_AND_DROP_MEDIA_QUERY);
-  if (dragAndDropEnabled === void 0) {
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { "aria-hidden": true, className: _chunk65VVJSQZcjs.cn.call(void 0, "flex h-full min-h-0 flex-col", props.className) });
-  }
+  if (dragAndDropEnabled === void 0) return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, BoardShell, { ...props });
   return dragAndDropEnabled ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DragBoard, { ...props }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TouchBoard, { ...props });
 }
+function laneJoins(columns, i) {
+  const column = columns[i];
+  const joinLeft = !!(column.system && _optionalChain([columns, 'access', _40 => _40[i - 1], 'optionalAccess', _41 => _41.system]));
+  const joinRight = !!(column.system && _optionalChain([columns, 'access', _42 => _42[i + 1], 'optionalAccess', _43 => _43.system]));
+  return { joinLeft, joinRight, showGap: i > 0 && !joinLeft };
+}
+function BoardShell({ columns, className }) {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { inert: true, "aria-hidden": true, className: _chunkN6YCOBLKcjs.cn.call(void 0, "flex h-full min-h-0 flex-col", className), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex min-h-0 flex-1 overflow-x-hidden", children: columns.map((column, i) => {
+    const { joinLeft, joinRight, showGap } = laneJoins(columns, i);
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _react.Fragment, { children: [
+      showGap && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { "aria-hidden": true, className: "w-[var(--spacing-system-mf)] shrink-0" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, BoardColumn, { column, touchMode: true, joinLeft, joinRight })
+    ] }, column.id);
+  }) }) });
+}
 function DragBoard({
   columns,
   onChange,
@@ -1281,7 +1336,7 @@ function DragBoard({
   const [landing, setLanding] = _react.useState.call(void 0, null);
   const landingTimer = _react.useRef.call(void 0, null);
   const pointRef = _react.useRef.call(void 0, { x: 0, y: 0 });
-  const laneLabel = _react.useCallback.call(void 0, (columnId) => _nullishCoalesce(_optionalChain([view, 'access', _41 => _41.find, 'call', _42 => _42((c) => c.id === columnId), 'optionalAccess', _43 => _43.label]), () => ( columnId)), [view]);
+  const laneLabel = _react.useCallback.call(void 0, (columnId) => _nullishCoalesce(_optionalChain([view, 'access', _44 => _44.find, 'call', _45 => _45((c) => c.id === columnId), 'optionalAccess', _46 => _46.label]), () => ( columnId)), [view]);
   const acceptsLifted = _react.useCallback.call(void 0, 
     (fromColumnId) => (column) => {
       if (column.dropDisabled || collapsed[column.id]) return false;
@@ -1295,7 +1350,7 @@ function DragBoard({
       const start = initialAim(view, ticketId);
       if (!start) return;
       setLifted({ ticketId, aim: start });
-      const title = _nullishCoalesce(_optionalChain([laneOf, 'call', _44 => _44(view, ticketId), 'optionalAccess', _45 => _45.tickets, 'access', _46 => _46.find, 'call', _47 => _47((t) => t.id === ticketId), 'optionalAccess', _48 => _48.title]), () => ( "Ticket"));
+      const title = _nullishCoalesce(_optionalChain([laneOf, 'call', _47 => _47(view, ticketId), 'optionalAccess', _48 => _48.tickets, 'access', _49 => _49.find, 'call', _50 => _50((t) => t.id === ticketId), 'optionalAccess', _51 => _51.title]), () => ( "Ticket"));
       setAnnouncement(`${title} lifted. Use the arrow keys to move it, space to drop it, escape to put it back.`);
     },
     [view]
@@ -1320,11 +1375,11 @@ function DragBoard({
   const walk = _react.useCallback.call(void 0, 
     (key) => {
       if (!lifted) return;
-      const from = _nullishCoalesce(_optionalChain([laneOf, 'call', _49 => _49(view, lifted.ticketId), 'optionalAccess', _50 => _50.id]), () => ( lifted.aim.columnId));
+      const from = _nullishCoalesce(_optionalChain([laneOf, 'call', _52 => _52(view, lifted.ticketId), 'optionalAccess', _53 => _53.id]), () => ( lifted.aim.columnId));
       const next = moveAim(view, lifted.ticketId, lifted.aim, key, acceptsLifted(from));
       if (next === lifted.aim) return;
       setLifted({ ...lifted, aim: next });
-      const total = (_nullishCoalesce(_optionalChain([view, 'access', _51 => _51.find, 'call', _52 => _52((c) => c.id === next.columnId), 'optionalAccess', _53 => _53.tickets]), () => ( []))).filter(
+      const total = (_nullishCoalesce(_optionalChain([view, 'access', _54 => _54.find, 'call', _55 => _55((c) => c.id === next.columnId), 'optionalAccess', _56 => _56.tickets]), () => ( []))).filter(
         (t) => t.id !== lifted.ticketId
       ).length;
       setAnnouncement(`${laneLabel(next.columnId)}, position ${next.index + 1} of ${total + 1}.`);
@@ -1351,11 +1406,11 @@ function DragBoard({
   }, [lifted, drop, walk]);
   _react.useEffect.call(void 0, () => {
     if (!lifted) return;
-    _optionalChain([boardRef, 'access', _54 => _54.current, 'optionalAccess', _55 => _55.querySelector, 'call', _56 => _56(`[${DROP_LINE_ATTRIBUTE}]`), 'optionalAccess', _57 => _57.scrollIntoView, 'call', _58 => _58({ block: "nearest", inline: "nearest" })]);
+    _optionalChain([boardRef, 'access', _57 => _57.current, 'optionalAccess', _58 => _58.querySelector, 'call', _59 => _59(`[${DROP_LINE_ATTRIBUTE}]`), 'optionalAccess', _60 => _60.scrollIntoView, 'call', _61 => _61({ block: "nearest", inline: "nearest" })]);
   }, [lifted]);
   const keyboardAim = _react.useMemo.call(void 0, () => {
     if (!lifted) return null;
-    const ticket = _optionalChain([laneOf, 'call', _59 => _59(view, lifted.ticketId), 'optionalAccess', _60 => _60.tickets, 'access', _61 => _61.find, 'call', _62 => _62((t) => t.id === lifted.ticketId)]);
+    const ticket = _optionalChain([laneOf, 'call', _62 => _62(view, lifted.ticketId), 'optionalAccess', _63 => _63.tickets, 'access', _64 => _64.find, 'call', _65 => _65((t) => t.id === lifted.ticketId)]);
     if (!ticket) return null;
     const anchor = aimToChange(view, lifted.ticketId, lifted.aim) ? aimAnchor(view, lifted.ticketId, lifted.aim) : { ticketId: null, edge: null };
     return { columnId: lifted.aim.columnId, ...anchor, ticket };
@@ -1377,7 +1432,7 @@ function DragBoard({
       return { columnId: slot.columnId, ...anchor, ticket };
     };
     const aimAt = (source, targets) => {
-      const next = readAim(source, _optionalChain([targets, 'access', _63 => _63[0], 'optionalAccess', _64 => _64.data]));
+      const next = readAim(source, _optionalChain([targets, 'access', _66 => _66[0], 'optionalAccess', _67 => _67.data]));
       setAim((prev) => isSameAim(prev, next) ? prev : next);
     };
     return _combine.combine.call(void 0, 
@@ -1406,7 +1461,7 @@ function DragBoard({
           setLanding(null);
           dragGeometry.current = {
             ticket,
-            columnColor: _optionalChain([columnsRef, 'access', _65 => _65.current, 'access', _66 => _66.find, 'call', _67 => _67((c) => c.id === source.data.columnId), 'optionalAccess', _68 => _68.color]),
+            columnColor: _optionalChain([columnsRef, 'access', _68 => _68.current, 'access', _69 => _69.find, 'call', _70 => _70((c) => c.id === source.data.columnId), 'optionalAccess', _71 => _71.color]),
             width: rect.width,
             grabX: clientX - rect.left,
             grabY: clientY - rect.top
@@ -1423,7 +1478,7 @@ function DragBoard({
           setAim(null);
           const change = resolveBoardDrop(columnsRef.current, {
             source: source.data,
-            target: _optionalChain([location, 'access', _69 => _69.current, 'access', _70 => _70.dropTargets, 'access', _71 => _71[0], 'optionalAccess', _72 => _72.data])
+            target: _optionalChain([location, 'access', _72 => _72.current, 'access', _73 => _73.dropTargets, 'access', _74 => _74[0], 'optionalAccess', _75 => _75.data])
           });
           if (!change) return;
           setPendingMove({
@@ -1456,7 +1511,7 @@ function DragBoard({
       return void 0;
     }
     const to = card.getBoundingClientRect();
-    const lane = _optionalChain([nearestScrollableAncestor, 'call', _73 => _73(card), 'optionalAccess', _74 => _74.getBoundingClientRect, 'call', _75 => _75()]);
+    const lane = _optionalChain([nearestScrollableAncestor, 'call', _76 => _76(card), 'optionalAccess', _77 => _77.getBoundingClientRect, 'call', _78 => _78()]);
     if (lane && (to.top < lane.top || to.bottom > lane.bottom)) {
       finish();
       return void 0;
@@ -1505,7 +1560,7 @@ function DragBoard({
   );
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, LandingCardContext.Provider, { value: landing, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DropAimContext.Provider, { value: _nullishCoalesce(aim, () => ( keyboardAim)), children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, BoardLiftContext.Provider, { value: lift, children: [
     preview,
-    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { ref: boardRef, className: _chunk65VVJSQZcjs.cn.call(void 0, "flex h-full flex-col", className), children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { ref: boardRef, className: _chunkN6YCOBLKcjs.cn.call(void 0, "flex h-full flex-col", className), children: [
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
         "div",
         {
@@ -1513,11 +1568,7 @@ function DragBoard({
           onScroll,
           className: "flex min-h-0 flex-1 overflow-x-auto [scrollbar-width:none] [&::-webkit-scrollbar]:hidden",
           children: view.map((column, i) => {
-            const prev = view[i - 1];
-            const next = view[i + 1];
-            const joinLeft = !!(column.system && _optionalChain([prev, 'optionalAccess', _76 => _76.system]));
-            const joinRight = !!(column.system && _optionalChain([next, 'optionalAccess', _77 => _77.system]));
-            const showGap = i > 0 && !joinLeft;
+            const { joinLeft, joinRight, showGap } = laneJoins(view, i);
             return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _react.Fragment, { children: [
               showGap && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { "aria-hidden": true, className: "w-[var(--spacing-system-mf)] shrink-0" }),
               /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -1569,58 +1620,6 @@ function DragBoard({
   ] }) }) });
 }
 
-// src/components/features/board/types.ts
-var STATUS_DEFAULTS = {
-  ACTIVE: { label: "Active", color: "#5ea62e" },
-  AI_ASSISTANCE: { label: "AI Handling", color: "#888888" },
-  TECH_REQUIRED: { label: "Tech Required", color: "#e1b32f" },
-  ON_HOLD: { label: "On Hold", color: "#f36666" },
-  RESOLVED: { label: "Resolved", color: "#888888" },
-  ARCHIVED: { label: "Archived", color: "#3a3a3a" }
-};
-function columnFromTicketStatus(status, tickets, overrides = {}) {
-  const defaults = STATUS_DEFAULTS[status];
-  return {
-    id: status,
-    label: _nullishCoalesce(overrides.label, () => ( defaults.label)),
-    color: _nullishCoalesce(overrides.color, () => ( defaults.color)),
-    tooltip: overrides.tooltip,
-    tickets,
-    total: overrides.total,
-    hasMore: overrides.hasMore,
-    isLoading: overrides.isLoading,
-    isLoadingMore: overrides.isLoadingMore,
-    system: overrides.system,
-    dropDisabled: overrides.dropDisabled,
-    dragDisabled: overrides.dragDisabled,
-    allowedFromColumns: overrides.allowedFromColumns,
-    archivable: overrides.archivable
-  };
-}
-function groupTicketsByStatus(tickets, statuses) {
-  const buckets = {
-    ACTIVE: [],
-    AI_ASSISTANCE: [],
-    TECH_REQUIRED: [],
-    ON_HOLD: [],
-    RESOLVED: [],
-    ARCHIVED: []
-  };
-  for (const t of tickets) {
-    const canonical = canonicalize(t.status);
-    if (canonical) buckets[canonical].push(t);
-  }
-  return statuses.map((s) => columnFromTicketStatus(s, buckets[s]));
-}
-function canonicalize(status) {
-  const upper = status.toUpperCase().replace(/\s+/g, "_");
-  if (upper === "ACTION_REQUIRED") return "TECH_REQUIRED";
-  if (upper === "ACTIVE" || upper === "AI_ASSISTANCE" || upper === "TECH_REQUIRED" || upper === "ON_HOLD" || upper === "RESOLVED" || upper === "ARCHIVED") {
-    return upper;
-  }
-  return null;
-}
-
 
 
 
@@ -1639,4 +1638,4 @@ function canonicalize(status) {
 
 
 
-exports.DeletedUserAvatar = DeletedUserAvatar; exports.TouchFriendlyTooltip = TouchFriendlyTooltip; exports.autoScrollBothWays = autoScrollBothWays; exports.autoScrollAncestors = autoScrollAncestors; exports.BoardColumnHeader = BoardColumnHeader; exports.tintOnDark = tintOnDark; exports.holdMoveDragEffect = holdMoveDragEffect; exports.BoardTicketApproval = BoardTicketApproval; exports.TicketCardBody = TicketCardBody; exports.TicketCardView = TicketCardView; exports.TicketCard = TicketCard; exports.TicketCardSkeleton = TicketCardSkeleton; exports.BoardColumn = BoardColumn; exports.useBoardCollapse = useBoardCollapse; exports.Board = Board; exports.columnFromTicketStatus = columnFromTicketStatus; exports.groupTicketsByStatus = groupTicketsByStatus;
+exports.DeletedUserAvatar = DeletedUserAvatar; exports.TouchFriendlyTooltip = TouchFriendlyTooltip; exports.autoScrollBothWays = autoScrollBothWays; exports.autoScrollAncestors = autoScrollAncestors; exports.BoardColumnHeader = BoardColumnHeader; exports.tintOnDark = tintOnDark; exports.holdMoveDragEffect = holdMoveDragEffect; exports.BoardTicketApproval = BoardTicketApproval; exports.TicketCardBody = TicketCardBody; exports.TicketCardView = TicketCardView; exports.TicketCard = TicketCard; exports.BOARD_COLUMN_PAGE_SIZE = BOARD_COLUMN_PAGE_SIZE; exports.columnFromTicketStatus = columnFromTicketStatus; exports.groupTicketsByStatus = groupTicketsByStatus; exports.BoardColumn = BoardColumn; exports.useBoardCollapse = useBoardCollapse; exports.Board = Board;