@dxos/react-ui-mosaic 0.8.4-main.bc674ce → 0.8.4-main.ef1bc66f44

package/dist/lib/browser/index.mjs

@@ -9,26 +9,149 @@ import {
   styles,
   styles2,
   styles3,
+  translationKey,
   useContainerContext,
-  useContainerDebug,
-  useEventHandlerAdapter,
   useFocus,
   useRootContext,
   useTileContext,
   useVisibleItems
-} from "./chunk-UMBPEG4F.mjs";
+} from "./chunk-Y6GU2CCU.mjs";
 
-// src/components/Card/CardDragPreview.tsx
-import React from "react";
+// src/components/Board/Board.tsx
+import { createContext } from "@radix-ui/react-context";
+import React5, { forwardRef as forwardRef4, useRef as useRef4, useState as useState2 } from "react";
+import { Layout, ScrollArea as ScrollArea2 } from "@dxos/react-ui";
+import { Json as Json2 } from "@dxos/react-ui-syntax-highlighter";
+import { mx as mx4 } from "@dxos/ui-theme";
+
+// src/hooks/useContainerDebug.tsx
+import React, { forwardRef, useMemo, useRef } from "react";
+import { createPortal } from "react-dom";
+import { Json } from "@dxos/react-ui-syntax-highlighter";
 import { mx } from "@dxos/ui-theme";
+var useContainerDebug = (debug) => {
+  const debugRef = useRef(null);
+  return useMemo(() => {
+    if (!debug) {
+      return [
+        () => null,
+        void 0
+      ];
+    }
+    return [
+      ({ classNames }) => /* @__PURE__ */ React.createElement("div", {
+        role: "none",
+        className: mx("overflow-hidden", classNames),
+        ref: debugRef
+      }),
+      () => debugRef.current && /* @__PURE__ */ createPortal(/* @__PURE__ */ React.createElement(ContainerInfo, null), debugRef.current)
+    ];
+  }, [
+    debug,
+    debugRef
+  ]);
+};
+var CONTAINER_INFO_NAME = "ContainerInfo";
+var ContainerInfo = /* @__PURE__ */ forwardRef(({ classNames }, forwardedRef) => {
+  const { id, state, activeLocation, scrolling } = useContainerContext(CONTAINER_INFO_NAME);
+  const counter = useRef(0);
+  return /* @__PURE__ */ React.createElement(Json, {
+    data: {
+      id,
+      activeLocation,
+      scrolling,
+      state,
+      count: counter.current++
+    },
+    classNames: mx("text-xs", classNames),
+    ref: forwardedRef
+  });
+});
+ContainerInfo.displayName = CONTAINER_INFO_NAME;
+
+// src/hooks/useEventHandlerAdapter.ts
+import { useMemo as useMemo2 } from "react";
+import { log } from "@dxos/log";
+import { arrayMove } from "@dxos/util";
+var __dxlog_file = "/__w/dxos/dxos/packages/ui/react-ui-mosaic/src/hooks/useEventHandlerAdapter.ts";
+var useEventHandlerAdapter = ({ items, getId, get, make, onChange, ...props }) => {
+  return useMemo2(() => ({
+    ...props,
+    onTake: ({ source }, cb) => {
+      log.info("onTake", {
+        source
+      }, {
+        F: __dxlog_file,
+        L: 58,
+        S: void 0,
+        C: (f, a) => f(...a)
+      });
+      const mutate = (items2) => {
+        const from = items2.findIndex((item) => getId(item) === source.id);
+        if (from !== -1) {
+          items2.splice(from, 1);
+        }
+      };
+      if (onChange) {
+        onChange(mutate);
+      } else {
+        mutate(items);
+      }
+      void cb(source.data);
+    },
+    onDrop: ({ source, target }) => {
+      const to = target?.type === "tile" || target?.type === "placeholder" ? target.location : -1;
+      log.info("onDrop", {
+        source,
+        target,
+        to
+      }, {
+        F: __dxlog_file,
+        L: 76,
+        S: void 0,
+        C: (f, a) => f(...a)
+      });
+      const mutate = (items2) => {
+        const from = items2.findIndex((item) => getId(item) === source.id);
+        if (to !== -1) {
+          if (from !== -1) {
+            arrayMove(items2, from, to);
+          } else {
+            items2.splice(to, 0, make(get(source.data)));
+          }
+        }
+      };
+      if (onChange) {
+        onChange(mutate);
+      } else {
+        mutate(items);
+      }
+    }
+  }), [
+    items,
+    onChange
+  ]);
+};
+
+// src/components/Board/Column.tsx
+import React4, { forwardRef as forwardRef3, useMemo as useMemo3, useRef as useRef3, useState } from "react";
+import { Obj as Obj2, Ref } from "@dxos/echo";
+import { useObject } from "@dxos/react-client/echo";
+import { IconButton, ScrollArea, Toolbar, useTranslation } from "@dxos/react-ui";
+import { mx as mx3 } from "@dxos/ui-theme";
+import { isNonNullable } from "@dxos/util";
+
+// src/components/Card/CardDragPreview.tsx
+import React2 from "react";
+import { mx as mx2 } from "@dxos/ui-theme";
 var CardDragPreviewRoot = ({ children }) => {
-  return /* @__PURE__ */ React.createElement("div", {
+  return /* @__PURE__ */ React2.createElement("div", {
     className: "p-2"
   }, children);
 };
 var CardDragPreviewContent = ({ children }) => {
-  return /* @__PURE__ */ React.createElement("div", {
-    className: mx(styles.root, "ring-focusLine ring-neutralFocusIndicator")
+  return /* @__PURE__ */ React2.createElement("div", {
+    className: mx2(styles3.root, "ring-focusLine ring-neutralFocusIndicator")
   }, children);
 };
 var CardDragPreview = {
@@ -36,58 +159,297 @@ var CardDragPreview = {
   Content: CardDragPreviewContent
 };
 
-// src/components/Layout/Layout.tsx
-import React2, { forwardRef, useMemo } from "react";
-import { mx as mx2 } from "@dxos/ui-theme";
-var Main = /* @__PURE__ */ forwardRef(({ classNames, children, role, toolbar, statusbar }, forwardedRef) => {
-  const style = useMemo(() => ({
-    gridTemplateRows: [
-      toolbar && "var(--toolbar-size)",
-      "1fr",
-      statusbar && "var(--statusbar-size)"
-    ].filter(Boolean).join(" ")
-  }), [
-    toolbar,
-    statusbar
+// src/components/Board/Item.tsx
+import { useComposedRefs } from "@radix-ui/react-compose-refs";
+import React3, { forwardRef as forwardRef2, useRef as useRef2 } from "react";
+import { Obj } from "@dxos/echo";
+import { Tag } from "@dxos/react-ui";
+import { getHashStyles } from "@dxos/ui-theme";
+var BOARD_ITEM_NAME = "Board.Item";
+var BoardItemInner = /* @__PURE__ */ forwardRef2(({ classNames, data: ref, location, debug }, forwardedRef) => {
+  const rootRef = useRef2(null);
+  const composedRef = useComposedRefs(rootRef, forwardedRef);
+  const dragHandleRef = useRef2(null);
+  const object = ref.target;
+  if (!object) {
+    return null;
+  }
+  const label = Obj.getLabel(object);
+  const description = Obj.getDescription(object);
+  return /* @__PURE__ */ React3.createElement(Mosaic.Tile, {
+    asChild: true,
+    dragHandle: dragHandleRef.current,
+    id: ref.dxn.toString(),
+    data: ref,
+    location,
+    debug
+  }, /* @__PURE__ */ React3.createElement(Focus.Group, {
+    asChild: true
+  }, /* @__PURE__ */ React3.createElement(Card.Root, {
+    classNames,
+    onClick: () => rootRef.current?.focus(),
+    ref: composedRef
+  }, /* @__PURE__ */ React3.createElement(Card.Toolbar, null, /* @__PURE__ */ React3.createElement(Card.DragHandle, {
+    ref: dragHandleRef
+  }), /* @__PURE__ */ React3.createElement(Card.Title, null, label), /* @__PURE__ */ React3.createElement(Card.Menu, {
+    context: object
+  })), /* @__PURE__ */ React3.createElement(Card.Row, {
+    icon: "ph--note--regular",
+    classNames: "text-description"
+  }, description), /* @__PURE__ */ React3.createElement(Card.Row, {
+    icon: "ph--tag--regular"
+  }, label && /* @__PURE__ */ React3.createElement("div", {
+    role: "none",
+    className: "shrink-0 flex gap-1 items-center text-xs"
+  }, /* @__PURE__ */ React3.createElement(Tag, {
+    palette: getHashStyles(label).hue
+  }, label))))));
+});
+BoardItemInner.displayName = BOARD_ITEM_NAME;
+var BoardItem = BoardItemInner;
+
+// src/components/Board/Column.tsx
+var BOARD_COLUMN_NAME = "Board.Column";
+var BoardColumnRootInner = /* @__PURE__ */ forwardRef3(({ classNames, children, location, data, debug, dragHandleRef }, forwardedRef) => {
+  return /* @__PURE__ */ React4.createElement(Mosaic.Tile, {
+    asChild: true,
+    location,
+    id: data.id,
+    data,
+    debug,
+    dragHandle: dragHandleRef.current
+  }, /* @__PURE__ */ React4.createElement(Focus.Group, {
+    classNames: mx3(
+      // NOTE: Reserves 2px for outer Focus.Group border.
+      "bs-full overflow-hidden is-[calc(100vw-2px)] md:is-card-default-width snap-center bg-deckSurface",
+      classNames
+    ),
+    ref: forwardedRef
+  }, children));
+});
+BoardColumnRootInner.displayName = BOARD_COLUMN_NAME;
+var BoardColumnRootImpl = /* @__PURE__ */ forwardRef3((props, forwardedRef) => {
+  const dragHandleRef = useRef3(null);
+  return /* @__PURE__ */ React4.createElement(BoardColumnRootInner, {
+    ...props,
+    dragHandleRef,
+    ref: forwardedRef
+  });
+});
+BoardColumnRootImpl.displayName = "Board.Column.Root";
+var BoardColumnRoot = BoardColumnRootImpl;
+var BOARD_COLUMN_HEADER_NAME = "Board.Column.Header";
+var BoardColumnHeader = /* @__PURE__ */ forwardRef3(({ classNames, label, dragHandleRef }, forwardedRef) => {
+  return /* @__PURE__ */ React4.createElement(Card.Toolbar, {
+    classNames,
+    ref: forwardedRef
+  }, /* @__PURE__ */ React4.createElement(Card.DragHandle, {
+    ref: dragHandleRef
+  }), /* @__PURE__ */ React4.createElement(Card.Title, null, label), /* @__PURE__ */ React4.createElement(Card.Menu, {
+    items: []
+  }));
+});
+BoardColumnHeader.displayName = BOARD_COLUMN_HEADER_NAME;
+var BOARD_COLUMN_BODY_NAME = "Board.Column.Body";
+var BoardColumnBody = ({ data, Tile = BoardItem, debug }) => {
+  const { t } = useTranslation(translationKey);
+  const { model } = useBoardContext(BOARD_COLUMN_BODY_NAME);
+  const [column, updateColumn] = useObject(data);
+  const [viewport, setViewport] = useState(null);
+  const eventHandler = useEventHandlerAdapter({
+    id: data.id,
+    items: model.getItems(column),
+    getId: (data2) => data2.dxn.toString(),
+    get: (data2) => data2.target,
+    make: (object) => Ref.make(object),
+    canDrop: ({ source }) => source.data.target ? model.isItem(source.data.target) : false,
+    onChange: (mutator) => updateColumn((column2) => mutator(model.getItems(column2)))
+  });
+  const menuItems = useMemo3(() => [
+    model.onItemDelete && {
+      label: t("delete menu label"),
+      onClick: (obj) => {
+        model.onItemDelete?.(data, obj);
+      }
+    }
+  ].filter(isNonNullable), [
+    model.onItemDelete,
+    data,
+    t
   ]);
-  return /* @__PURE__ */ React2.createElement("div", {
-    ref: forwardedRef,
-    role: role ?? "none",
-    style,
-    className: mx2("bs-full is-full grid grid-cols-[100%] overflow-hidden", toolbar && "[&>.dx-toolbar]:relative [&>.dx-toolbar]:border-be [&>.dx-toolbar]:border-subduedSeparator", classNames)
-  }, children);
+  return /* @__PURE__ */ React4.createElement(Card.Context, {
+    value: {
+      menuItems
+    }
+  }, /* @__PURE__ */ React4.createElement(Mosaic.Container, {
+    asChild: true,
+    withFocus: true,
+    orientation: "vertical",
+    autoScroll: viewport,
+    eventHandler,
+    debug
+  }, /* @__PURE__ */ React4.createElement(ScrollArea.Root, {
+    orientation: "vertical",
+    thin: true,
+    margin: true,
+    padding: true
+  }, /* @__PURE__ */ React4.createElement(ScrollArea.Viewport, {
+    classNames: "snap-y md:snap-none",
+    ref: setViewport
+  }, /* @__PURE__ */ React4.createElement(Mosaic.Stack, {
+    items: model.getItems(column),
+    getId: (data2) => data2.dxn.toString(),
+    Tile
+  })))));
+};
+BoardColumnBody.displayName = BOARD_COLUMN_BODY_NAME;
+var BOARD_COLUMN_FOOTER_NAME = "Board.Column.Footer";
+var BoardColumnFooter = /* @__PURE__ */ forwardRef3(({ classNames }, forwardedRef) => {
+  const { t } = useTranslation(translationKey);
+  const { model } = useBoardContext(BOARD_COLUMN_FOOTER_NAME);
+  return /* @__PURE__ */ React4.createElement(Toolbar.Root, {
+    classNames: mx3("rounded-b-sm", classNames),
+    ref: forwardedRef
+  }, model.onItemCreate && /* @__PURE__ */ React4.createElement(IconButton, {
+    classNames: "group-hover/column:opacity-100 opacity-0 transition transition-opacity duration-500",
+    variant: "ghost",
+    icon: "ph--plus--regular",
+    iconOnly: true,
+    label: t("add item label")
+  }));
 });
-var Container = /* @__PURE__ */ forwardRef(({ classNames, children, role, scrollable }, forwardedRef) => {
-  return /* @__PURE__ */ React2.createElement("div", {
+BoardColumnFooter.displayName = BOARD_COLUMN_FOOTER_NAME;
+var BOARD_DEFAULT_COLUMN_NAME = "Board.DefaultColumn";
+var DefaultBoardColumn = /* @__PURE__ */ forwardRef3(({ classNames, location, data, debug, Tile = BoardItem }, forwardedRef) => {
+  const [DebugInfo, debugHandler] = useContainerDebug(debug);
+  const dragHandleRef = useRef3(null);
+  return /* @__PURE__ */ React4.createElement(BoardColumnRootInner, {
+    location,
+    data,
+    dragHandleRef,
+    ref: forwardedRef
+  }, /* @__PURE__ */ React4.createElement("div", {
+    role: "none",
+    className: mx3("group/column grid bs-full overflow-hidden", debug ? "grid-rows-[var(--rail-action)_1fr_20rem]" : "grid-rows-[var(--rail-action)_1fr_var(--rail-action)]", classNames)
+  }, /* @__PURE__ */ React4.createElement(BoardColumnHeader, {
+    classNames: "border-be border-separator",
+    label: Obj2.getLabel(data) ?? data.id,
+    dragHandleRef
+  }), /* @__PURE__ */ React4.createElement(BoardColumnBody, {
+    data,
+    debug: debugHandler,
+    Tile
+  }), /* @__PURE__ */ React4.createElement("div", {
+    role: "none",
+    className: "flex flex-col"
+  }, /* @__PURE__ */ React4.createElement(BoardColumnFooter, {
+    classNames: "border-bs border-separator"
+  }), /* @__PURE__ */ React4.createElement(DebugInfo, null))));
+});
+DefaultBoardColumn.displayName = BOARD_DEFAULT_COLUMN_NAME;
+var BoardColumn = {
+  Root: BoardColumnRoot,
+  Header: BoardColumnHeader,
+  Body: BoardColumnBody,
+  Footer: BoardColumnFooter
+};
+
+// src/components/Board/Board.tsx
+var BOARD_NAME = "Board";
+var [BoardContextProvider, useBoardContext] = createContext(BOARD_NAME);
+var BOARD_ROOT_NAME = "Board.Root";
+var BoardRootInner = /* @__PURE__ */ forwardRef4(({ classNames, id, model, debug, Tile = DefaultBoardColumn }, forwardedRef) => {
+  const [DebugInfo, debugHandler] = useContainerDebug(debug);
+  const [viewport, setViewport] = useState2(null);
+  const items = model.getColumns();
+  const eventHandler = useEventHandlerAdapter({
+    id,
+    items,
+    getId: (data) => data.id,
+    get: (data) => data,
+    make: (object) => object,
+    canDrop: ({ source }) => model.isColumn(source.data)
+  });
+  return /* @__PURE__ */ React5.createElement(BoardContextProvider, {
+    model
+  }, /* @__PURE__ */ React5.createElement(Layout.Main, {
     ref: forwardedRef,
-    role: role ?? "none",
-    className: mx2("grid bs-full", scrollable ? "overflow-y-auto" : "overflow-hidden", classNames)
-  }, children);
+    classNames: mx4("border-red-500", classNames)
+  }, /* @__PURE__ */ React5.createElement(Focus.Group, {
+    asChild: true,
+    orientation: "horizontal"
+  }, /* @__PURE__ */ React5.createElement(Mosaic.Container, {
+    asChild: true,
+    withFocus: true,
+    orientation: "horizontal",
+    autoScroll: viewport,
+    eventHandler,
+    debug: debugHandler
+  }, /* @__PURE__ */ React5.createElement(ScrollArea2.Root, {
+    orientation: "horizontal",
+    classNames: "md:pbs-3",
+    margin: true,
+    padding: true
+  }, /* @__PURE__ */ React5.createElement(ScrollArea2.Viewport, {
+    classNames: "snap-mandatory snap-x md:snap-none",
+    ref: setViewport
+  }, /* @__PURE__ */ React5.createElement(Mosaic.Stack, {
+    items,
+    getId: (item) => item.id,
+    Tile,
+    debug
+  }))))), /* @__PURE__ */ React5.createElement(DebugInfo, null)));
 });
-var Flex = ({ children, classNames, role, column, grow }) => {
-  return /* @__PURE__ */ React2.createElement("div", {
-    role: role ?? "none",
-    className: mx2("flex", column && "flex-col", grow && "flex-1 overflow-hidden", classNames)
-  }, children);
+BoardRootInner.displayName = BOARD_ROOT_NAME;
+var BoardRoot = BoardRootInner;
+var BOARD_PLACEHOLDER_NAME = "Board.Placeholder";
+var BoardPlaceholder = (props) => {
+  return /* @__PURE__ */ React5.createElement(Mosaic.Placeholder, {
+    ...props,
+    classNames: styles2.placeholder.root
+  }, /* @__PURE__ */ React5.createElement("div", {
+    className: mx4("flex bs-full border border-dashed border-separator rounded-sm", styles2.placeholder.content)
+  }));
 };
-var Layout = {
-  Main,
-  Container,
-  Flex
+BoardPlaceholder.displayName = BOARD_PLACEHOLDER_NAME;
+var BOARD_DEBUG_NAME = "Board.Debug";
+var BoardDebug = /* @__PURE__ */ forwardRef4(({ classNames }, forwardedRef) => {
+  const { containers, dragging } = useRootContext(BOARD_DEBUG_NAME);
+  const counter = useRef4(0);
+  return /* @__PURE__ */ React5.createElement(Json2, {
+    data: {
+      containers,
+      dragging,
+      count: counter.current++
+    },
+    classNames: mx4("text-xs", classNames),
+    ref: forwardedRef
+  });
+});
+BoardDebug.displayName = BOARD_DEBUG_NAME;
+var Board = {
+  Root: BoardRoot,
+  Column: BoardColumn,
+  Item: BoardItem,
+  Placeholder: BoardPlaceholder,
+  Debug: BoardDebug
 };
 export {
+  Board,
+  BoardContextProvider,
+  BoardDebug,
   Card,
   CardDragPreview,
   Focus,
   Image,
-  Layout,
   Mosaic,
   Stack,
   VirtualStack,
-  styles as cardStyles,
+  styles3 as cardStyles,
   dropHandler,
-  styles2 as focusStyles,
-  styles3 as mosaicStyles,
+  styles as focusStyles,
+  styles2 as mosaicStyles,
+  useBoardContext,
   useContainerDebug,
   useEventHandlerAdapter,
   useFocus,

package/dist/lib/browser/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/Card/CardDragPreview.tsx", "../../../src/components/Layout/Layout.tsx"],
-  "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport React, { type PropsWithChildren } from 'react';\n\nimport { mx } from '@dxos/ui-theme';\n\nimport { styles } from './styles';\n\n// TODO(burdon): Why p-2?\nconst CardDragPreviewRoot = ({ children }: PropsWithChildren<{}>) => {\n  return <div className='p-2'>{children}</div>;\n};\n\nconst CardDragPreviewContent = ({ children }: PropsWithChildren<{}>) => {\n  return <div className={mx(styles.root, 'ring-focusLine ring-neutralFocusIndicator')}>{children}</div>;\n};\n\nexport const CardDragPreview = {\n  Root: CardDragPreviewRoot,\n  Content: CardDragPreviewContent,\n};\n", "//\n// Copyright 2026 DXOS.org\n//\n\nimport React, { type HTMLAttributes, type PropsWithChildren, forwardRef, useMemo } from 'react';\n\nimport { type ThemedClassName } from '@dxos/react-ui';\nimport { mx } from '@dxos/ui-theme';\n\n//\n// Main\n//\n\ntype MainProps = ThemedClassName<\n  PropsWithChildren<{\n    role?: string;\n    toolbar?: boolean;\n    statusbar?: boolean;\n  }>\n>;\n\n// TODO(burdon): Borders.\nconst Main = forwardRef<HTMLDivElement, MainProps>(\n  ({ classNames, children, role, toolbar, statusbar }, forwardedRef) => {\n    const style = useMemo(\n      () => ({\n        gridTemplateRows: [toolbar && 'var(--toolbar-size)', '1fr', statusbar && 'var(--statusbar-size)']\n          .filter(Boolean)\n          .join(' '),\n      }),\n      [toolbar, statusbar],\n    );\n\n    return (\n      <div\n        ref={forwardedRef}\n        role={role ?? 'none'}\n        style={style}\n        className={mx(\n          'bs-full is-full grid grid-cols-[100%] overflow-hidden',\n          toolbar && '[&>.dx-toolbar]:relative [&>.dx-toolbar]:border-be [&>.dx-toolbar]:border-subduedSeparator',\n          classNames,\n        )}\n      >\n        {children}\n      </div>\n    );\n  },\n);\n\n//\n// Container\n//\n\ntype ContainerProps = ThemedClassName<\n  PropsWithChildren<{\n    role?: string;\n    scrollable?: boolean;\n  }>\n>;\n\nconst Container = forwardRef<HTMLDivElement, ContainerProps>(\n  ({ classNames, children, role, scrollable }, forwardedRef) => {\n    return (\n      <div\n        ref={forwardedRef}\n        role={role ?? 'none'}\n        className={mx('grid bs-full', scrollable ? 'overflow-y-auto' : 'overflow-hidden', classNames)}\n      >\n        {children}\n      </div>\n    );\n  },\n);\n\n//\n// Flex\n//\n\ntype FlexProps = ThemedClassName<\n  HTMLAttributes<HTMLDivElement> & {\n    column?: boolean;\n    grow?: boolean;\n  }\n>;\n\nconst Flex = ({ children, classNames, role, column, grow }: FlexProps) => {\n  return (\n    <div\n      role={role ?? 'none'}\n      className={mx('flex', column && 'flex-col', grow && 'flex-1 overflow-hidden', classNames)}\n    >\n      {children}\n    </div>\n  );\n};\n\n//\n// Layout\n//\n\nexport const Layout = {\n  Main,\n  Container,\n  Flex,\n};\n\nexport type { MainProps as LayoutMainProps, ContainerProps as LayoutContainerProps, FlexProps as LayoutFlexProps };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAIA,OAAOA,WAAuC;AAE9C,SAASC,UAAU;AAKnB,IAAMC,sBAAsB,CAAC,EAAEC,SAAQ,MAAyB;AAC9D,SAAO,sBAAA,cAACC,OAAAA;IAAIC,WAAU;KAAOF,QAAAA;AAC/B;AAEA,IAAMG,yBAAyB,CAAC,EAAEH,SAAQ,MAAyB;AACjE,SAAO,sBAAA,cAACC,OAAAA;IAAIC,WAAWE,GAAGC,OAAOC,MAAM,2CAAA;KAA+CN,QAAAA;AACxF;AAEO,IAAMO,kBAAkB;EAC7BC,MAAMT;EACNU,SAASN;AACX;;;AClBA,OAAOO,UAAsDC,YAAYC,eAAe;AAGxF,SAASC,MAAAA,WAAU;AAenB,IAAMC,OAAOC,2BACX,CAAC,EAAEC,YAAYC,UAAUC,MAAMC,SAASC,UAAS,GAAIC,iBAAAA;AACnD,QAAMC,QAAQC,QACZ,OAAO;IACLC,kBAAkB;MAACL,WAAW;MAAuB;MAAOC,aAAa;MACtEK,OAAOC,OAAAA,EACPC,KAAK,GAAA;EACV,IACA;IAACR;IAASC;GAAU;AAGtB,SACE,gBAAAQ,OAAA,cAACC,OAAAA;IACCC,KAAKT;IACLH,MAAMA,QAAQ;IACdI;IACAS,WAAWC,IACT,yDACAb,WAAW,8FACXH,UAAAA;KAGDC,QAAAA;AAGP,CAAA;AAcF,IAAMgB,YAAYlB,2BAChB,CAAC,EAAEC,YAAYC,UAAUC,MAAMgB,WAAU,GAAIb,iBAAAA;AAC3C,SACE,gBAAAO,OAAA,cAACC,OAAAA;IACCC,KAAKT;IACLH,MAAMA,QAAQ;IACda,WAAWC,IAAG,gBAAgBE,aAAa,oBAAoB,mBAAmBlB,UAAAA;KAEjFC,QAAAA;AAGP,CAAA;AAcF,IAAMkB,OAAO,CAAC,EAAElB,UAAUD,YAAYE,MAAMkB,QAAQC,KAAI,MAAa;AACnE,SACE,gBAAAT,OAAA,cAACC,OAAAA;IACCX,MAAMA,QAAQ;IACda,WAAWC,IAAG,QAAQI,UAAU,YAAYC,QAAQ,0BAA0BrB,UAAAA;KAE7EC,QAAAA;AAGP;AAMO,IAAMqB,SAAS;EACpBxB;EACAmB;EACAE;AACF;",
-  "names": ["React", "mx", "CardDragPreviewRoot", "children", "div", "className", "CardDragPreviewContent", "mx", "styles", "root", "CardDragPreview", "Root", "Content", "React", "forwardRef", "useMemo", "mx", "Main", "forwardRef", "classNames", "children", "role", "toolbar", "statusbar", "forwardedRef", "style", "useMemo", "gridTemplateRows", "filter", "Boolean", "join", "React", "div", "ref", "className", "mx", "Container", "scrollable", "Flex", "column", "grow", "Layout"]
+  "sources": ["../../../src/components/Board/Board.tsx", "../../../src/hooks/useContainerDebug.tsx", "../../../src/hooks/useEventHandlerAdapter.ts", "../../../src/components/Board/Column.tsx", "../../../src/components/Card/CardDragPreview.tsx", "../../../src/components/Board/Item.tsx"],
+  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { createContext } from '@radix-ui/react-context';\nimport React, { type ReactElement, type Ref as ReactRef, forwardRef, useRef, useState } from 'react';\n\nimport { type Obj, type Ref } from '@dxos/echo';\nimport { Layout, ScrollArea, type ThemedClassName } from '@dxos/react-ui';\nimport { Json } from '@dxos/react-ui-syntax-highlighter';\nimport { mx } from '@dxos/ui-theme';\n\nimport { useContainerDebug, useEventHandlerAdapter } from '../../hooks';\nimport { Focus } from '../Focus';\nimport { Mosaic, type MosiacPlaceholderProps, mosaicStyles, useMosaic } from '../Mosaic';\nimport { type StackProps } from '../Stack';\n\nimport { BoardColumn, type BoardColumnProps, DefaultBoardColumn } from './Column';\nimport { BoardItem, type BoardItemProps } from './Item';\n\n//\n// Model\n//\n\nexport interface BoardModel<TColumn extends Obj.Unknown = any, TItem extends Obj.Unknown = any> {\n  isColumn: (obj: Obj.Unknown) => obj is TColumn;\n  isItem: (obj: Obj.Unknown) => obj is TItem;\n  // TODO(burdon): Normalize Column/Item object vs refs?\n  getColumns: () => TColumn[];\n  getItems: (column: TColumn) => Ref.Ref<TItem>[];\n  onColumnDelete?: (column: TColumn) => void;\n  onColumnCreate?: () => Promise<TColumn>;\n  onItemDelete?: (column: TColumn, item: TItem) => void;\n  onItemCreate?: (column: TColumn) => Promise<TItem>;\n}\n\n//\n// Context\n//\n\nconst BOARD_NAME = 'Board';\n\ntype BoardContextValue<TColumn extends Obj.Unknown = any, TItem extends Obj.Unknown = any> = {\n  model: BoardModel<TColumn, TItem>;\n};\n\n/**\n * @internal\n */\nexport const [BoardContextProvider, useBoardContext] = createContext<BoardContextValue>(BOARD_NAME);\n\n//\n// Root\n//\n\nconst BOARD_ROOT_NAME = 'Board.Root';\n\ntype BoardRootProps<TColumn extends Obj.Unknown = any, TItem extends Obj.Unknown = any> = ThemedClassName<\n  {\n    id: string;\n    debug?: boolean;\n    Tile?: StackProps<TColumn>['Tile'];\n  } & BoardContextValue<TColumn, TItem>\n>;\n\nconst BoardRootInner = forwardRef<HTMLDivElement, BoardRootProps>(\n  ({ classNames, id, model, debug, Tile = DefaultBoardColumn }, forwardedRef) => {\n    const [DebugInfo, debugHandler] = useContainerDebug(debug);\n    const [viewport, setViewport] = useState<HTMLElement | null>(null);\n\n    const items = model.getColumns();\n    const eventHandler = useEventHandlerAdapter({\n      id,\n      items,\n      getId: (data) => data.id,\n      get: (data) => data,\n      make: (object) => object,\n      canDrop: ({ source }) => model.isColumn(source.data),\n    });\n\n    return (\n      <BoardContextProvider model={model}>\n        <Layout.Main ref={forwardedRef} classNames={mx('border-red-500', classNames)}>\n          <Focus.Group asChild orientation='horizontal'>\n            <Mosaic.Container\n              asChild\n              withFocus\n              orientation='horizontal'\n              autoScroll={viewport}\n              eventHandler={eventHandler}\n              debug={debugHandler}\n            >\n              <ScrollArea.Root orientation='horizontal' classNames='md:pbs-3' margin padding>\n                <ScrollArea.Viewport classNames='snap-mandatory snap-x md:snap-none' ref={setViewport}>\n                  <Mosaic.Stack items={items} getId={(item) => item.id} Tile={Tile} debug={debug} />\n                </ScrollArea.Viewport>\n              </ScrollArea.Root>\n            </Mosaic.Container>\n          </Focus.Group>\n          <DebugInfo />\n        </Layout.Main>\n      </BoardContextProvider>\n    );\n  },\n);\n\nBoardRootInner.displayName = BOARD_ROOT_NAME;\n\nconst BoardRoot = BoardRootInner as <TColumn extends Obj.Unknown>(\n  props: BoardRootProps<TColumn> & { ref?: ReactRef<HTMLDivElement> },\n) => ReactElement;\n\n//\n// Placeholder\n//\n\nconst BOARD_PLACEHOLDER_NAME = 'Board.Placeholder';\n\nconst BoardPlaceholder = (props: MosiacPlaceholderProps<number>) => {\n  return (\n    <Mosaic.Placeholder {...props} classNames={mosaicStyles.placeholder.root}>\n      <div\n        className={mx(\n          'flex bs-full border border-dashed border-separator rounded-sm',\n          mosaicStyles.placeholder.content,\n        )}\n      />\n    </Mosaic.Placeholder>\n  );\n};\n\nBoardPlaceholder.displayName = BOARD_PLACEHOLDER_NAME;\n\n//\n// Debug\n//\n\nconst BOARD_DEBUG_NAME = 'Board.Debug';\n\nexport const BoardDebug = forwardRef<HTMLDivElement, ThemedClassName>(({ classNames }, forwardedRef) => {\n  const { containers, dragging } = useMosaic(BOARD_DEBUG_NAME);\n  const counter = useRef(0);\n  return (\n    <Json\n      data={{ containers, dragging, count: counter.current++ }}\n      classNames={mx('text-xs', classNames)}\n      ref={forwardedRef}\n    />\n  );\n});\n\nBoardDebug.displayName = BOARD_DEBUG_NAME;\n\n//\n// Board\n//\n\nexport const Board = {\n  Root: BoardRoot,\n  Column: BoardColumn,\n  Item: BoardItem,\n  Placeholder: BoardPlaceholder,\n  Debug: BoardDebug,\n};\n\nexport type { BoardRootProps, BoardColumnProps, BoardItemProps };\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport React, { type FC, type ReactNode, forwardRef, useMemo, useRef } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { type ThemedClassName } from '@dxos/react-ui';\nimport { Json } from '@dxos/react-ui-syntax-highlighter';\nimport { mx } from '@dxos/ui-theme';\n\nimport { useMosaicContainer } from '../components';\n\nexport type UseContainerDebug = [FC<ThemedClassName>, (() => ReactNode) | undefined];\n\n/**\n * Hook that returns a component to be rendered in the container's viewport (within the context),\n * and a component that creates a portal in the container's debug area.\n */\nexport const useContainerDebug = (debug?: boolean): UseContainerDebug => {\n  const debugRef = useRef<HTMLDivElement | null>(null);\n  return useMemo(() => {\n    if (!debug) {\n      return [() => null, undefined];\n    }\n\n    return [\n      ({ classNames }) => <div role='none' className={mx('overflow-hidden', classNames)} ref={debugRef} />,\n      () => debugRef.current && createPortal(<ContainerInfo />, debugRef.current),\n    ];\n  }, [debug, debugRef]);\n};\n\nconst CONTAINER_INFO_NAME = 'ContainerInfo';\n\nconst ContainerInfo = forwardRef<HTMLDivElement, ThemedClassName>(({ classNames }, forwardedRef) => {\n  const { id, state, activeLocation, scrolling } = useMosaicContainer(CONTAINER_INFO_NAME);\n  const counter = useRef(0);\n  return (\n    <Json\n      data={{ id, activeLocation, scrolling, state, count: counter.current++ }}\n      classNames={mx('text-xs', classNames)}\n      ref={forwardedRef}\n    />\n  );\n});\n\nContainerInfo.displayName = CONTAINER_INFO_NAME;\n", "//\n// Copyright 2026 DXOS.org\n//\n\nimport { useMemo } from 'react';\n\nimport { type Obj } from '@dxos/echo';\nimport { log } from '@dxos/log';\nimport { arrayMove } from '@dxos/util';\n\nimport { type GetId, type MosaicEventHandler } from '../components';\n\nexport type UseEventHandlerProps<TItem = any, TObject = any> = Pick<MosaicEventHandler<TItem>, 'id' | 'canDrop'> & {\n  /**\n   * The items to manage.\n   */\n  items: TItem[];\n\n  /**\n   * ID getter.\n   */\n  getId: GetId<TItem>;\n\n  /**\n   * Extracts the object from an item.\n   */\n  get: (item: TItem) => TObject;\n\n  /**\n   * Creates a new item from the dragged object.\n   */\n  make: (object: TObject) => TItem;\n\n  /**\n   * Optional change callback for wrapping mutations in Obj.change style.\n   * When provided, all array mutations will be wrapped in this callback.\n   * When not provided, mutations happen directly on the items array.\n   */\n  onChange?: (mutator: (items: TItem[]) => void) => void;\n};\n\n/**\n * Returns a handler for the given items.\n * NOTE: This supports arrays of objects, or arrays of refs to objects.\n */\nexport const useEventHandlerAdapter = <TItem = any, TObject extends Obj.Unknown = Obj.Unknown>({\n  items,\n  getId,\n  get,\n  make,\n  onChange,\n  ...props\n}: UseEventHandlerProps<TItem, TObject>): MosaicEventHandler<TItem> => {\n  return useMemo<MosaicEventHandler<TItem>>(\n    () => ({\n      ...props,\n      onTake: ({ source }, cb) => {\n        log.info('onTake', { source });\n        const mutate = (items: TItem[]) => {\n          const from = items.findIndex((item) => getId(item) === source.id);\n          if (from !== -1) {\n            items.splice(from, 1);\n          }\n        };\n\n        if (onChange) {\n          onChange(mutate);\n        } else {\n          mutate(items);\n        }\n\n        void cb(source.data);\n      },\n      onDrop: ({ source, target }) => {\n        const to = target?.type === 'tile' || target?.type === 'placeholder' ? target.location : -1;\n        log.info('onDrop', { source, target, to });\n\n        const mutate = (items: TItem[]) => {\n          const from = items.findIndex((item) => getId(item) === source.id);\n          if (to !== -1) {\n            if (from !== -1) {\n              arrayMove(items, from, to);\n            } else {\n              // TODO(burdon): This should be the responsibility of the source container.\n              items.splice(to, 0, make(get(source.data)));\n            }\n          }\n        };\n\n        if (onChange) {\n          onChange(mutate);\n        } else {\n          mutate(items);\n        }\n      },\n    }),\n    [items, onChange],\n  );\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport React, {\n  type PropsWithChildren,\n  type ReactElement,\n  type Ref as ReactRef,\n  type RefObject,\n  forwardRef,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\n\nimport { Obj, Ref } from '@dxos/echo';\nimport { useObject } from '@dxos/react-client/echo';\nimport { IconButton, ScrollArea, type ThemedClassName, Toolbar, useTranslation } from '@dxos/react-ui';\nimport { mx } from '@dxos/ui-theme';\nimport { isNonNullable } from '@dxos/util';\n\nimport { useContainerDebug, useEventHandlerAdapter } from '../../hooks';\nimport { translationKey } from '../../translations';\nimport { Card, type CardMenuProps } from '../Card';\nimport { Focus } from '../Focus';\nimport { Mosaic, type MosaicContainerProps, type MosaicTileProps } from '../Mosaic';\nimport { type StackProps } from '../Stack';\n\nimport { useBoardContext } from './Board';\nimport { BoardItem } from './Item';\n\n//\n// Column\n//\n\nconst BOARD_COLUMN_NAME = 'Board.Column';\n\ntype BoardColumnProps<TColumn extends Obj.Unknown = any> = Pick<\n  MosaicTileProps<TColumn>,\n  'classNames' | 'location' | 'data' | 'debug'\n>;\n\ntype BoardColumnRootInnerProps<TColumn extends Obj.Unknown = any> = BoardColumnProps<TColumn> & {\n  dragHandleRef: RefObject<HTMLButtonElement | null>;\n};\n\nconst BoardColumnRootInner = forwardRef<HTMLDivElement, PropsWithChildren<BoardColumnRootInnerProps>>(\n  ({ classNames, children, location, data, debug, dragHandleRef }, forwardedRef) => {\n    return (\n      <Mosaic.Tile\n        asChild\n        location={location}\n        id={data.id}\n        data={data}\n        debug={debug}\n        dragHandle={dragHandleRef.current}\n      >\n        <Focus.Group\n          classNames={mx(\n            // NOTE: Reserves 2px for outer Focus.Group border.\n            'bs-full overflow-hidden is-[calc(100vw-2px)] md:is-card-default-width snap-center bg-deckSurface',\n            classNames,\n          )}\n          ref={forwardedRef}\n        >\n          {children}\n        </Focus.Group>\n      </Mosaic.Tile>\n    );\n  },\n);\n\nBoardColumnRootInner.displayName = BOARD_COLUMN_NAME;\n\nconst BoardColumnRootImpl = forwardRef<HTMLDivElement, BoardColumnProps>((props, forwardedRef) => {\n  const dragHandleRef = useRef<HTMLButtonElement>(null);\n  return <BoardColumnRootInner {...props} dragHandleRef={dragHandleRef} ref={forwardedRef} />;\n});\n\nBoardColumnRootImpl.displayName = 'Board.Column.Root';\n\nconst BoardColumnRoot = BoardColumnRootImpl as <TColumn extends Obj.Unknown = any>(\n  props: BoardColumnProps<TColumn> & { ref?: ReactRef<HTMLDivElement> },\n) => ReactElement;\n\n//\n// Column Header\n//\n\nconst BOARD_COLUMN_HEADER_NAME = 'Board.Column.Header';\n\ntype BoardColumnHeaderProps = ThemedClassName<{ label: string; dragHandleRef: ReactRef<HTMLButtonElement> }>;\n\nconst BoardColumnHeader = forwardRef<HTMLDivElement, BoardColumnHeaderProps>(\n  ({ classNames, label, dragHandleRef }, forwardedRef) => {\n    return (\n      <Card.Toolbar classNames={classNames} ref={forwardedRef}>\n        <Card.DragHandle ref={dragHandleRef} />\n        <Card.Title>{label}</Card.Title>\n        <Card.Menu items={[]} />\n      </Card.Toolbar>\n    );\n  },\n);\n\nBoardColumnHeader.displayName = BOARD_COLUMN_HEADER_NAME;\n\n//\n// Column Body\n//\n\nconst BOARD_COLUMN_BODY_NAME = 'Board.Column.Body';\n\ntype BoardColumnBodyProps = Pick<BoardColumnProps, 'data'> & {\n  Tile?: StackProps<Ref.Ref<Obj.Unknown>>['Tile'];\n} & Pick<MosaicContainerProps, 'debug'>;\n\nconst BoardColumnBody = ({ data, Tile = BoardItem, debug }: BoardColumnBodyProps) => {\n  const { t } = useTranslation(translationKey);\n  const { model } = useBoardContext(BOARD_COLUMN_BODY_NAME);\n  const [column, updateColumn] = useObject(data);\n  const [viewport, setViewport] = useState<HTMLElement | null>(null);\n\n  const eventHandler = useEventHandlerAdapter<Ref.Unknown>({\n    id: data.id,\n    items: model.getItems(column),\n    getId: (data) => data.dxn.toString(),\n    get: (data) => data.target!,\n    make: (object) => Ref.make(object),\n    canDrop: ({ source }) => (source.data.target ? model.isItem(source.data.target) : false),\n    onChange: (mutator) => updateColumn((column) => mutator(model.getItems(column))),\n  });\n\n  // Context menu for items.\n  const menuItems = useMemo<NonNullable<CardMenuProps<Obj.Unknown>['items']>>(\n    () =>\n      [\n        model.onItemDelete && {\n          label: t('delete menu label'),\n          onClick: (obj: Obj.Unknown) => {\n            model.onItemDelete?.(data, obj);\n          },\n        },\n      ].filter(isNonNullable),\n    [model.onItemDelete, data, t],\n  );\n\n  return (\n    <Card.Context value={{ menuItems }}>\n      <Mosaic.Container\n        asChild\n        withFocus\n        orientation='vertical'\n        autoScroll={viewport}\n        eventHandler={eventHandler}\n        debug={debug}\n      >\n        <ScrollArea.Root orientation='vertical' thin margin padding>\n          <ScrollArea.Viewport classNames='snap-y md:snap-none' ref={setViewport}>\n            <Mosaic.Stack items={model.getItems(column)} getId={(data) => data.dxn.toString()} Tile={Tile} />\n          </ScrollArea.Viewport>\n        </ScrollArea.Root>\n      </Mosaic.Container>\n    </Card.Context>\n  );\n};\n\nBoardColumnBody.displayName = BOARD_COLUMN_BODY_NAME;\n\n//\n// Column Footer\n//\n\nconst BOARD_COLUMN_FOOTER_NAME = 'Board.Column.Footer';\n\ntype BoardColumnFooterProps = ThemedClassName;\n\nconst BoardColumnFooter = forwardRef<HTMLDivElement, BoardColumnFooterProps>(({ classNames }, forwardedRef) => {\n  const { t } = useTranslation(translationKey);\n  const { model } = useBoardContext(BOARD_COLUMN_FOOTER_NAME);\n\n  return (\n    <Toolbar.Root classNames={mx('rounded-b-sm', classNames)} ref={forwardedRef}>\n      {model.onItemCreate && (\n        <IconButton\n          classNames='group-hover/column:opacity-100 opacity-0 transition transition-opacity duration-500'\n          variant='ghost'\n          icon='ph--plus--regular'\n          iconOnly\n          label={t('add item label')}\n        />\n      )}\n    </Toolbar.Root>\n  );\n});\n\nBoardColumnFooter.displayName = BOARD_COLUMN_FOOTER_NAME;\n\n//\n// DefaultBoardColumn\n//\n\nconst BOARD_DEFAULT_COLUMN_NAME = 'Board.DefaultColumn';\n\ntype DefaultBoardColumnProps = BoardColumnProps & Pick<BoardColumnBodyProps, 'Tile'>;\n\nconst DefaultBoardColumn = forwardRef<HTMLDivElement, DefaultBoardColumnProps>(\n  ({ classNames, location, data, debug, Tile = BoardItem }, forwardedRef) => {\n    const [DebugInfo, debugHandler] = useContainerDebug(debug);\n    const dragHandleRef = useRef<HTMLButtonElement>(null);\n\n    return (\n      <BoardColumnRootInner location={location} data={data} dragHandleRef={dragHandleRef} ref={forwardedRef}>\n        <div\n          role='none'\n          className={mx(\n            'group/column grid bs-full overflow-hidden',\n            debug\n              ? 'grid-rows-[var(--rail-action)_1fr_20rem]'\n              : 'grid-rows-[var(--rail-action)_1fr_var(--rail-action)]',\n            classNames,\n          )}\n        >\n          <BoardColumnHeader\n            classNames='border-be border-separator'\n            label={Obj.getLabel(data) ?? data.id}\n            dragHandleRef={dragHandleRef}\n          />\n          <BoardColumnBody data={data} debug={debugHandler} Tile={Tile} />\n          <div role='none' className='flex flex-col'>\n            <BoardColumnFooter classNames='border-bs border-separator' />\n            <DebugInfo />\n          </div>\n        </div>\n      </BoardColumnRootInner>\n    );\n  },\n);\n\nDefaultBoardColumn.displayName = BOARD_DEFAULT_COLUMN_NAME;\n\n//\n// BoardColumn\n//\n\nconst BoardColumn = {\n  Root: BoardColumnRoot,\n  Header: BoardColumnHeader,\n  Body: BoardColumnBody,\n  Footer: BoardColumnFooter,\n};\n\nexport { BoardColumn, DefaultBoardColumn, type BoardColumnProps };\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport React, { type PropsWithChildren } from 'react';\n\nimport { mx } from '@dxos/ui-theme';\n\nimport { styles } from './styles';\n\n// TODO(burdon): Why p-2?\nconst CardDragPreviewRoot = ({ children }: PropsWithChildren<{}>) => {\n  return <div className='p-2'>{children}</div>;\n};\n\nconst CardDragPreviewContent = ({ children }: PropsWithChildren<{}>) => {\n  return <div className={mx(styles.root, 'ring-focusLine ring-neutralFocusIndicator')}>{children}</div>;\n};\n\nexport const CardDragPreview = {\n  Root: CardDragPreviewRoot,\n  Content: CardDragPreviewContent,\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport React, { type ReactElement, type Ref as ReactRef, forwardRef, useRef } from 'react';\n\nimport { Obj, type Ref } from '@dxos/echo';\nimport { Tag } from '@dxos/react-ui';\nimport { getHashStyles } from '@dxos/ui-theme';\n\nimport { Card } from '../Card';\nimport { Focus } from '../Focus';\nimport { Mosaic, type MosaicTileProps } from '../Mosaic';\n\n//\n// Item\n//\n\nconst BOARD_ITEM_NAME = 'Board.Item';\n\ntype BoardItemProps<TItem extends Obj.Unknown = any> = Pick<\n  MosaicTileProps<Ref.Ref<TItem>>,\n  'classNames' | 'location' | 'data' | 'debug'\n>;\n\nconst BoardItemInner = forwardRef<HTMLDivElement, BoardItemProps>(\n  ({ classNames, data: ref, location, debug }, forwardedRef) => {\n    const rootRef = useRef<HTMLDivElement>(null);\n    const composedRef = useComposedRefs<HTMLDivElement>(rootRef, forwardedRef);\n    const dragHandleRef = useRef<HTMLButtonElement>(null);\n    const object = ref.target;\n    if (!object) {\n      return null;\n    }\n\n    const label = Obj.getLabel(object);\n    const description = Obj.getDescription(object);\n\n    return (\n      <Mosaic.Tile\n        asChild\n        dragHandle={dragHandleRef.current}\n        id={ref.dxn.toString()}\n        data={ref}\n        location={location}\n        debug={debug}\n      >\n        <Focus.Group asChild>\n          <Card.Root classNames={classNames} onClick={() => rootRef.current?.focus()} ref={composedRef}>\n            <Card.Toolbar>\n              <Card.DragHandle ref={dragHandleRef} />\n              <Card.Title>{label}</Card.Title>\n              <Card.Menu context={object} />\n            </Card.Toolbar>\n            {/* TODO(burdon): Replace with surface. */}\n            <Card.Row icon='ph--note--regular' classNames='text-description'>\n              {description}\n            </Card.Row>\n            <Card.Row icon='ph--tag--regular'>\n              {label && (\n                <div role='none' className='shrink-0 flex gap-1 items-center text-xs'>\n                  <Tag palette={getHashStyles(label).hue}>{label}</Tag>\n                </div>\n              )}\n            </Card.Row>\n          </Card.Root>\n        </Focus.Group>\n      </Mosaic.Tile>\n    );\n  },\n);\n\nBoardItemInner.displayName = BOARD_ITEM_NAME;\n\nconst BoardItem = BoardItemInner as <TItem extends Obj.Unknown = any>(\n  props: BoardItemProps<TItem> & { ref?: ReactRef<HTMLDivElement> },\n) => ReactElement;\n\nexport { BoardItem, type BoardItemProps };\n"],
+  "mappings": "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",
+  "names": ["createContext", "React", "forwardRef", "useRef", "useState", "Layout", "ScrollArea", "Json", "mx", "React", "forwardRef", "useMemo", "useRef", "createPortal", "Json", "mx", "useContainerDebug", "debug", "debugRef", "useRef", "useMemo", "undefined", "classNames", "div", "role", "className", "mx", "ref", "current", "createPortal", "ContainerInfo", "CONTAINER_INFO_NAME", "forwardRef", "forwardedRef", "id", "state", "activeLocation", "scrolling", "useMosaicContainer", "counter", "Json", "data", "count", "displayName", "useMemo", "log", "arrayMove", "useEventHandlerAdapter", "items", "getId", "get", "make", "onChange", "props", "onTake", "source", "cb", "info", "mutate", "from", "findIndex", "item", "id", "splice", "data", "onDrop", "target", "to", "type", "location", "React", "forwardRef", "useMemo", "useRef", "useState", "Obj", "Ref", "useObject", "IconButton", "ScrollArea", "Toolbar", "useTranslation", "mx", "isNonNullable", "React", "mx", "CardDragPreviewRoot", "children", "React", "div", "className", "CardDragPreviewContent", "mx", "styles", "root", "CardDragPreview", "Root", "Content", "useComposedRefs", "React", "forwardRef", "useRef", "Obj", "Tag", "getHashStyles", "BOARD_ITEM_NAME", "BoardItemInner", "forwardRef", "classNames", "data", "ref", "location", "debug", "forwardedRef", "rootRef", "useRef", "composedRef", "useComposedRefs", "dragHandleRef", "object", "target", "label", "Obj", "getLabel", "description", "getDescription", "React", "Mosaic", "Tile", "asChild", "dragHandle", "current", "id", "dxn", "toString", "Focus", "Group", "Card", "Root", "onClick", "focus", "Toolbar", "DragHandle", "Title", "Menu", "context", "Row", "icon", "div", "role", "className", "Tag", "palette", "getHashStyles", "hue", "displayName", "BoardItem", "BOARD_COLUMN_NAME", "BoardColumnRootInner", "forwardRef", "classNames", "children", "location", "data", "debug", "dragHandleRef", "forwardedRef", "React", "Mosaic", "Tile", "asChild", "id", "dragHandle", "current", "Focus", "Group", "mx", "ref", "displayName", "BoardColumnRootImpl", "props", "useRef", "BoardColumnRoot", "BOARD_COLUMN_HEADER_NAME", "BoardColumnHeader", "label", "Card", "Toolbar", "DragHandle", "Title", "Menu", "items", "BOARD_COLUMN_BODY_NAME", "BoardColumnBody", "BoardItem", "t", "useTranslation", "translationKey", "model", "useBoardContext", "column", "updateColumn", "useObject", "viewport", "setViewport", "useState", "eventHandler", "useEventHandlerAdapter", "getItems", "getId", "dxn", "toString", "get", "target", "make", "object", "Ref", "canDrop", "source", "isItem", "onChange", "mutator", "menuItems", "useMemo", "onItemDelete", "onClick", "obj", "filter", "isNonNullable", "Context", "value", "Container", "withFocus", "orientation", "autoScroll", "ScrollArea", "Root", "thin", "margin", "padding", "Viewport", "Stack", "BOARD_COLUMN_FOOTER_NAME", "BoardColumnFooter", "onItemCreate", "IconButton", "variant", "icon", "iconOnly", "BOARD_DEFAULT_COLUMN_NAME", "DefaultBoardColumn", "DebugInfo", "debugHandler", "useContainerDebug", "div", "role", "className", "Obj", "getLabel", "BoardColumn", "Header", "Body", "Footer", "BOARD_NAME", "BoardContextProvider", "useBoardContext", "createContext", "BOARD_ROOT_NAME", "BoardRootInner", "forwardRef", "classNames", "id", "model", "debug", "Tile", "DefaultBoardColumn", "forwardedRef", "DebugInfo", "debugHandler", "useContainerDebug", "viewport", "setViewport", "useState", "items", "getColumns", "eventHandler", "useEventHandlerAdapter", "getId", "data", "get", "make", "object", "canDrop", "source", "isColumn", "React", "Layout", "Main", "ref", "mx", "Focus", "Group", "asChild", "orientation", "Mosaic", "Container", "withFocus", "autoScroll", "ScrollArea", "Root", "margin", "padding", "Viewport", "Stack", "item", "displayName", "BoardRoot", "BOARD_PLACEHOLDER_NAME", "BoardPlaceholder", "props", "Placeholder", "mosaicStyles", "placeholder", "root", "div", "className", "content", "BOARD_DEBUG_NAME", "BoardDebug", "containers", "dragging", "useMosaic", "counter", "useRef", "Json", "count", "current", "Board", "Column", "BoardColumn", "Item", "BoardItem", "Debug"]
 }