@dxos/react-ui-mosaic 0.8.4-main.c85a9c8dae → 0.8.4-main.d05673bc65

package/dist/lib/browser/{chunk-7S4PIFKU.mjs → chunk-75KCPN67.mjs}

@@ -27,14 +27,15 @@ import { useComposedRefs } from "@radix-ui/react-compose-refs";
 import { Primitive } from "@radix-ui/react-primitive";
 import { Slot } from "@radix-ui/react-slot";
 import React, { createContext, forwardRef, useContext, useRef, useState } from "react";
-import { mx } from "@dxos/ui-theme";
+import { composableProps, mx } from "@dxos/ui-theme";
 var FOCUS_STATE_ATTR = "focus-state";
 var FocusContext = /* @__PURE__ */ createContext({});
 var useFocus = () => useContext(FocusContext);
-var Group = /* @__PURE__ */ forwardRef(({ classNames, className, children, asChild, orientation = "vertical", ...props }, forwardedRef) => {
+var Group = /* @__PURE__ */ forwardRef(({ children, asChild, orientation = "vertical", ...props }, forwardedRef) => {
+  const { className, ...rest } = composableProps(props);
+  const Comp = asChild ? Slot : Primitive.div;
   const rootRef = useRef(null);
   const composedRef = useComposedRefs(rootRef, forwardedRef);
-  const Comp = asChild ? Slot : Primitive.div;
   const focusableGroupAttrs = useFocusableGroup({
     tabBehavior: "limited-trap-focus"
   });
@@ -49,7 +50,7 @@ var Group = /* @__PURE__ */ forwardRef(({ classNames, className, children, asChi
       setFocus: setState
     }
   }, /* @__PURE__ */ React.createElement(Comp, {
-    ...props,
+    ...rest,
     ...tabsterAttrs,
     ...state && {
       [`data-${FOCUS_STATE_ATTR}`]: state
@@ -64,7 +65,7 @@ var Group = /* @__PURE__ */ forwardRef(({ classNames, className, children, asChi
       "data-[focus-state=active]:border-neutral-focus-indicator",
       // Error
       "data-[focus-state=error]:border-rose-500"
-    ], className, classNames),
+    ], className),
     ref: composedRef
   }, children));
 });
@@ -371,7 +372,7 @@ import { Primitive as Primitive3 } from "@radix-ui/react-primitive";
 import { Slot as Slot3 } from "@radix-ui/react-slot";
 import { bind } from "bind-event-listener";
 import React3, { forwardRef as forwardRef3, useEffect as useEffect2, useMemo as useMemo2, useRef as useRef3, useState as useState3 } from "react";
-import { mx as mx3 } from "@dxos/ui-theme";
+import { composableProps as composableProps2, mx as mx3 } from "@dxos/ui-theme";
 import { isTruthy } from "@dxos/util";
 var MOSAIC_CONTAINER_NAME = "Mosaic.Container";
 var [MosaicContainerContextProvider, useMosaicContainerContext] = createContext3("MosaicContainer");
@@ -379,10 +380,11 @@ var MOSAIC_CONTAINER_STATE_ATTR = "mosaic-container-state";
 var MOSAIC_CONTAINER_PLACEHOLDER_WIDTH = "--mosaic-placeholder-width";
 var MOSAIC_CONTAINER_PLACEHOLDER_HEIGHT = "--mosaic-placeholder-height";
 var counter = 0;
-var MosaicContainer = /* @__PURE__ */ forwardRef3(({ classNames, className, children, eventHandler: eventHandlerProp, orientation = "vertical", asChild, autoScroll: autoscrollElement, withFocus, debug, ...props }, forwardedRef) => {
+var MosaicContainer = /* @__PURE__ */ forwardRef3(({ children, eventHandler: eventHandlerProp, orientation = "vertical", asChild, autoScroll: autoscrollElement, withFocus, debug, ...props }, forwardedRef) => {
+  const { className, ...rest } = composableProps2(props);
+  const Comp = asChild ? Slot3 : Primitive3.div;
   const rootRef = useRef3(null);
   const composedRef = useComposedRefs3(rootRef, forwardedRef);
-  const Comp = asChild ? Slot3 : Primitive3.div;
   const eventHandler = useMemo2(() => eventHandlerProp ?? {
     id: `mosaic-container-${counter++}`
   }, [
@@ -538,12 +540,12 @@ var MosaicContainer = /* @__PURE__ */ forwardRef3(({ classNames, className, chil
     activeLocation,
     setActiveLocation
   }, /* @__PURE__ */ React3.createElement(Comp, {
-    className: mx3("h-full", className, classNames),
+    className: mx3("h-full", className),
     style: {
       [MOSAIC_CONTAINER_PLACEHOLDER_WIDTH]: state.type === "active" && state.bounds ? `${state.bounds.width}px` : "0px",
       [MOSAIC_CONTAINER_PLACEHOLDER_HEIGHT]: state.type === "active" && state.bounds ? `${state.bounds.height}px` : "0px"
     },
-    ...props,
+    ...rest,
     [`data-${MOSAIC_CONTAINER_STATE_ATTR}`]: state.type,
     ref: composedRef
   }, children), debug?.());
@@ -562,14 +564,15 @@ import { Primitive as Primitive4 } from "@radix-ui/react-primitive";
 import { Slot as Slot4 } from "@radix-ui/react-slot";
 import React4, { forwardRef as forwardRef4, useLayoutEffect, useMemo as useMemo3, useRef as useRef4, useState as useState4 } from "react";
 import { createPortal } from "react-dom";
-import { mx as mx4 } from "@dxos/ui-theme";
+import { composableProps as composableProps3, mx as mx4 } from "@dxos/ui-theme";
 var MOSAIC_TILE_NAME = "Mosaic.Tile";
 var [MosaicTileContextProvider, useMosaicTileContext] = createContext4("MosaicTile");
 var MOSAIC_TILE_STATE_ATTR = "mosaic-tile-state";
-var MosaicTile = /* @__PURE__ */ forwardRef4(({ classNames, className, children, asChild, dragHandle, allowedEdges: allowedEdgesProp, location, id, data: dataProp, debug: _, ...props }, forwardedRef) => {
+var MosaicTile = /* @__PURE__ */ forwardRef4(({ children, asChild, dragHandle, allowedEdges: allowedEdgesProp, location, id, data: dataProp, debug: _, ...props }, forwardedRef) => {
+  const { className, ...rest } = composableProps3(props);
+  const Comp = asChild ? Slot4 : Primitive4.div;
   const rootRef = useRef4(null);
   const composedRef = composeRefs(rootRef, forwardedRef);
-  const Comp = asChild ? Slot4 : Primitive4.div;
   const { id: containerId, eventHandler, orientation, scrolling, setActiveLocation } = useMosaicContainerContext(MOSAIC_TILE_NAME);
   const [state, setState] = useState4({
     type: "idle"
@@ -701,16 +704,16 @@ var MosaicTile = /* @__PURE__ */ forwardRef4(({ classNames, className, children,
   return /* @__PURE__ */ React4.createElement(MosaicTileContextProvider, {
     state
   }, /* @__PURE__ */ React4.createElement(Comp, {
-    ...props,
+    ...rest,
     [`data-${MOSAIC_TILE_STATE_ATTR}`]: state.type,
     role: "listitem",
-    className: mx4("relative", className, classNames),
+    className: mx4("relative", className),
     ref: composedRef
   }, children), state.type === "preview" && /* @__PURE__ */ createPortal(/* @__PURE__ */ React4.createElement(Comp, {
     // NOTE: Use to control appearance while dragging.
     [`data-${MOSAIC_TILE_STATE_ATTR}`]: state.type,
     // TODO(burdon): Configure drop animation.
-    className: mx4("relative", className, classNames),
+    className: mx4("relative", className),
     style: {
       width: `${state.rect.width}px`,
       height: `${state.rect.height}px`
@@ -794,13 +797,14 @@ MosaicDropIndicator.displayName = DROP_INDICATOR_NAME;
 import { useVirtualizer } from "@tanstack/react-virtual";
 import React6, { Fragment, forwardRef as forwardRef5 } from "react";
 import { invariant } from "@dxos/invariant";
-import { mx as mx6 } from "@dxos/ui-theme";
+import { composableProps as composableProps4, mx as mx6 } from "@dxos/ui-theme";
 var __dxlog_file2 = "/__w/dxos/dxos/packages/ui/react-ui-mosaic/src/components/Mosaic/Stack.tsx";
 var MOSAIC_STACK_NAME = "MosaicStack";
-var MosaicStackInner = /* @__PURE__ */ forwardRef5(({ classNames, className, role = "list", orientation: orientationProp = "vertical", draggable: draggable2 = true, items, getId, Tile, debug, ...props }, forwardedRef) => {
+var MosaicStackInner = /* @__PURE__ */ forwardRef5(({ role = "list", orientation: orientationProp = "vertical", draggable: draggable2 = true, items, getId, Tile, debug, ...props }, forwardedRef) => {
+  const { className, ...rest } = composableProps4(props);
   invariant(Tile, void 0, {
     F: __dxlog_file2,
-    L: 75,
+    L: 63,
     S: void 0,
     A: [
       "Tile",
@@ -816,7 +820,7 @@ var MosaicStackInner = /* @__PURE__ */ forwardRef5(({ classNames, className, rol
   });
   invariant(orientation === "vertical" || orientation === "horizontal", `Invalid orientation: ${orientation}`, {
     F: __dxlog_file2,
-    L: 78,
+    L: 66,
     S: void 0,
     A: [
       "orientation === 'vertical' || orientation === 'horizontal'",
@@ -824,9 +828,9 @@ var MosaicStackInner = /* @__PURE__ */ forwardRef5(({ classNames, className, rol
     ]
   });
   return /* @__PURE__ */ React6.createElement("div", {
-    ...props,
+    ...rest,
     role,
-    className: mx6("flex", orientation === "horizontal" && "h-full [&>*]:shrink-0", orientation === "vertical" && "flex-col", classNames, className),
+    className: mx6("flex", orientation === "horizontal" && "h-full [&>*]:shrink-0", orientation === "vertical" && "flex-col", className),
     ref: forwardedRef
   }, /* @__PURE__ */ React6.createElement(InternalPlaceholder, {
     orientation,
@@ -847,10 +851,11 @@ var MosaicStackInner = /* @__PURE__ */ forwardRef5(({ classNames, className, rol
 MosaicStackInner.displayName = MOSAIC_STACK_NAME;
 var MosaicStack = MosaicStackInner;
 var MOSAIC_VIRTUAL_STACK_NAME = "MosaicVirtualStack";
-var MosaicVirtualStackInner = /* @__PURE__ */ forwardRef5(({ classNames, className, role = "list", orientation = "vertical", items, getId, Tile, estimateSize, getScrollElement, overscan = 8, onChange, debug, ...props }, forwardedRef) => {
+var MosaicVirtualStackInner = /* @__PURE__ */ forwardRef5(({ role = "list", orientation = "vertical", items, getId, Tile, estimateSize, getScrollElement, overscan = 8, onChange, debug, ...props }, forwardedRef) => {
+  const { className, ...rest } = composableProps4(props);
   invariant(Tile, void 0, {
     F: __dxlog_file2,
-    L: 142,
+    L: 128,
     S: void 0,
     A: [
       "Tile",
@@ -873,9 +878,9 @@ var MosaicVirtualStackInner = /* @__PURE__ */ forwardRef5(({ classNames, classNa
   });
   const virtualItems = virtualizer.getVirtualItems();
   return /* @__PURE__ */ React6.createElement("div", {
-    ...props,
+    ...rest,
     role,
-    className: mx6("flex", orientation === "horizontal" && "h-full [&>*]:shrink-0", orientation === "vertical" && "flex-col", classNames, className),
+    className: mx6("flex", orientation === "horizontal" && "h-full [&>*]:shrink-0", orientation === "vertical" && "flex-col", className),
     style: {
       position: "relative",
       ...orientation === "vertical" ? {
@@ -950,4 +955,4 @@ export {
   useMosaicTileContext,
   Mosaic
 };
-//# sourceMappingURL=chunk-7S4PIFKU.mjs.map
+//# sourceMappingURL=chunk-75KCPN67.mjs.map

package/dist/lib/browser/chunk-75KCPN67.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/hooks/useVisibleItems.ts", "../../../src/components/Focus/Focus.tsx", "../../../src/components/Mosaic/styles.ts", "../../../src/components/Mosaic/types.ts", "../../../src/components/Mosaic/Root.tsx", "../../../src/components/Mosaic/Container.tsx", "../../../src/components/Mosaic/Tile.tsx", "../../../src/components/Mosaic/Placeholder.tsx", "../../../src/components/Mosaic/Stack.tsx", "../../../src/components/Mosaic/Mosaic.tsx"],
+  "sourcesContent": ["//\n// Copyright 2026 DXOS.org\n//\n\nimport { useMemo } from 'react';\n\nimport { type GetId, type MosaicTileData } from '../components';\n\nexport type UseVisibleItemsProps<TItem = any> = {\n  /** Container id. */\n  id: string;\n\n  /** Current items. */\n  items?: readonly TItem[] | TItem[];\n\n  /** Currently dragging item. */\n  dragging: MosaicTileData<TItem> | undefined;\n\n  /** ID getter */\n  getId: GetId<TItem>;\n};\n\n/**\n * Returns items with the dragging item removed.\n */\nexport const useVisibleItems = <TItem = any>({\n  id,\n  items,\n  dragging,\n  getId,\n}: UseVisibleItemsProps<TItem>): readonly TItem[] | TItem[] => {\n  const visibleItems = useMemo(() => {\n    if (!items || !dragging || id !== dragging.containerId) {\n      return items ?? [];\n    }\n\n    const idx = items.findIndex((item) => getId(item) === dragging.id);\n    if (idx === -1) {\n      return items;\n    }\n\n    const visibleItems = items.slice();\n    visibleItems.splice(idx, 1);\n    return visibleItems;\n  }, [id, items, dragging, getId]);\n\n  return visibleItems;\n};\n", "//\n// Copyright 2026 DXOS.org\n//\n\nimport {\n  useArrowNavigationGroup,\n  useFocusableGroup,\n  useMergedTabsterAttributes_unstable,\n} from '@fluentui/react-tabster';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport { Slot } from '@radix-ui/react-slot';\nimport React, { type PropsWithChildren, createContext, forwardRef, useContext, useRef, useState } from 'react';\n\nimport { type Axis, type ThemedClassName } from '@dxos/react-ui';\nimport { composableProps, mx } from '@dxos/ui-theme';\n\n//\n// Context\n//\n\ntype FocusState = 'active' | 'error';\n\nconst FOCUS_STATE_ATTR = 'focus-state';\n\ntype ContextValue = {\n  setFocus?: (state: FocusState | undefined) => void;\n};\n\nconst FocusContext = createContext<ContextValue>({});\n\nconst useFocus = () => useContext(FocusContext);\n\n//\n// Group\n//\n\ntype GroupProps = ThemedClassName<\n  PropsWithChildren<{\n    asChild?: boolean;\n    orientation?: Axis;\n  }>\n> & { className?: string };\n\n// TODO(wittjosiah): Consider how this could integrate with with react-ui-attention.\n//   Perhaps react-ui-attention comes under the mosaic umbrella as it supports selection?\nconst Group = forwardRef<HTMLDivElement, GroupProps>(\n  ({ children, asChild, orientation = 'vertical', ...props }: GroupProps, forwardedRef) => {\n    const { className, ...rest } = composableProps(props);\n    const Comp = asChild ? Slot : Primitive.div;\n    const rootRef = useRef<HTMLDivElement>(null);\n    const composedRef = useComposedRefs<HTMLDivElement>(rootRef, forwardedRef);\n\n    // TODO(burdon): Configure.\n    const focusableGroupAttrs = useFocusableGroup({\n      tabBehavior: 'limited-trap-focus',\n    });\n    const arrowNavigationAttrs = useArrowNavigationGroup({\n      axis: orientation,\n      memorizeCurrent: true,\n    });\n    const tabsterAttrs = useMergedTabsterAttributes_unstable(focusableGroupAttrs, arrowNavigationAttrs);\n    const [state, setState] = useState<FocusState | undefined>();\n\n    return (\n      <FocusContext.Provider value={{ setFocus: setState }}>\n        <Comp\n          {...rest}\n          {...tabsterAttrs}\n          {...(state && {\n            [`data-${FOCUS_STATE_ATTR}`]: state,\n          })}\n          tabIndex={0}\n          className={mx(\n            [\n              // TODO(burdon): Option for border/rounded; ring/outline vs border?\n              'outline-hidden border border-separator md:rounded-xs',\n              // Focus (e.g., via tabster).\n              'focus:!border-accent-surface',\n              // Active (e.g., drop target).\n              'data-[focus-state=active]:border-neutral-focus-indicator',\n              // Error\n              'data-[focus-state=error]:border-rose-500',\n            ],\n            className,\n          )}\n          ref={composedRef}\n        >\n          {children}\n        </Comp>\n      </FocusContext.Provider>\n    );\n  },\n);\n\n//\n// Focus\n//\n\nexport const Focus = {\n  Group,\n};\n\nexport type { GroupProps as FocusGroupProps };\n\nexport { useFocus };\n", "//\n// Copyright 2026 DXOS.org\n//\n\nimport { type ClassNameValue } from '@dxos/react-ui';\n\nexport const styles = {\n  placeholder: {\n    root: [\n      'group opacity-0',\n      'group-data-[mosaic-debug=\"true\"]:opacity-100',\n      'group-data-[mosaic-debug=\"true\"]:bg-orange-500',\n      'data-[mosaic-placeholder-state=active]:opacity-100',\n      'data-[mosaic-placeholder-orientation=vertical]:snap-start', // TODO(burdon): Option.\n      'data-[mosaic-placeholder-orientation=vertical]:py-1',\n      'data-[mosaic-placeholder-orientation=vertical]:data-[mosaic-placeholder-state=active]:py-2.5',\n      'data-[mosaic-placeholder-orientation=horizontal]:px-1',\n      'data-[mosaic-placeholder-orientation=horizontal]:data-[mosaic-placeholder-state=active]:px-2.5',\n    ],\n    content: [\n      'transition-all duration-0',\n      // TODO(burdon): Don't animate open if placeholder is the source.\n      // TODO(burdon): Flickers when start to drag since source is removed and then the placeholder shows up.\n      //  - Use absolute positioning?\n      // 'group-data-[mosaic-placeholder-state=active]:duration-200',\n      'group-data-[mosaic-placeholder-orientation=vertical]:h-0',\n      'group-data-[mosaic-placeholder-orientation=vertical]:group-data-[mosaic-placeholder-state=active]:h-[var(--mosaic-placeholder-height)]',\n      'group-data-[mosaic-placeholder-orientation=horizontal]:w-0',\n      'group-data-[mosaic-placeholder-orientation=horizontal]:group-data-[mosaic-placeholder-state=active]:w-[var(--mosaic-placeholder-width)]',\n    ],\n  },\n} satisfies Record<string, Record<string, ClassNameValue>>;\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { type ElementDragPayload } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';\n\nexport type GetId<TData = any> = (data: TData) => string;\n\n/**\n * NOTE: Must implement value equivalence.\n */\nexport type LocationType = string | number;\n\n/**\n * Get the source data from the drag payload.\n */\nexport const getSourceData = <TData = any, TLocation = any>(\n  source: ElementDragPayload,\n): MosaicTileData<TData, TLocation> | null => {\n  return source.data.type === 'tile' ? (source.data as MosaicTileData<TData, TLocation>) : null;\n};\n\n/**\n * Draggable item.\n * Tiles may contain arbitrary data (which may not be an ECHO object; e.g., search result).\n */\nexport type MosaicTileData<TData = any, TLocation = any> = {\n  type: 'tile';\n  containerId: string;\n  id: string;\n  data: TData;\n  location: TLocation;\n  bounds?: DOMRect;\n};\n\n/**\n * Drop target placeholder.\n */\nexport type MosaicPlaceholderData<TLocation = any> = {\n  type: 'placeholder';\n  containerId: string;\n  location: TLocation;\n};\n\n/**\n * Drop target container.\n */\nexport type MosaicContainerData = {\n  type: 'container';\n  id: string;\n};\n\nexport type MosaicData = MosaicTileData | MosaicPlaceholderData | MosaicContainerData;\n\nexport type MosaicTargetData = MosaicTileData | MosaicPlaceholderData;\n\n/**\n * Handler implemented by drop containers.\n */\nexport interface MosaicEventHandler<TData = any, TObject = any> {\n  /**\n   * Container identifier.\n   */\n  id: string;\n\n  /**\n   * Determine if the item can be dropped into this container.\n   * NOTE: This is continuously called while dragging (doesn't require mouse movement).\n   */\n  canDrop?: (props: { source: MosaicTileData<TData> }) => boolean;\n\n  /**\n   * Called during drag for custom visualization.\n   */\n  onDrag?: (props: { source: MosaicTileData<TData>; position: { x: number; y: number } }) => void;\n\n  /**\n   * Insert/rearrange the item at the given location.\n   */\n  onDrop?: (props: { source: MosaicTileData<TData>; target?: MosaicData }) => void;\n\n  /**\n   * Request the object to be dropped.\n   * This allows the source container to clone/mutate/swap the object before it is dropped.\n   * If the callback returns true, then the callback may decide to remove the item from the source container,\n   * completing the transfer.\n   */\n  onTake?: (props: { source: MosaicTileData<TData> }, cb: (object: TObject) => Promise<boolean>) => void;\n\n  /**\n   * Dragging ended.\n   */\n  onCancel?: () => void;\n}\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { combine } from '@atlaskit/pragmatic-drag-and-drop/combine';\nimport { type ElementDragPayload, monitorForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';\nimport { type DragLocationHistory } from '@atlaskit/pragmatic-drag-and-drop/types';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { createContext } from '@radix-ui/react-context';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport { Slot } from '@radix-ui/react-slot';\nimport React, { type PropsWithChildren, forwardRef, useCallback, useEffect, useRef, useState } from 'react';\n\nimport { log } from '@dxos/log';\nimport { type ThemedClassName } from '@dxos/react-ui';\nimport { mx } from '@dxos/ui-theme';\n\nimport { type MosaicData, type MosaicEventHandler, type MosaicTileData } from './types';\n\n//\n// Context\n//\n\ntype MosaicDraggingSource = {\n  data: MosaicTileData;\n  handler?: MosaicEventHandler;\n  container?: Element;\n};\n\ntype MosaicDraggingTarget = {\n  data: MosaicData;\n  handler?: MosaicEventHandler;\n};\n\ntype MosaicDraggingState = {\n  source: MosaicDraggingSource;\n  target?: MosaicDraggingTarget;\n};\n\ntype MosaicRootContextValue = {\n  containers: Record<string, MosaicEventHandler>;\n  addContainer: (container: MosaicEventHandler) => void;\n  removeContainer: (id: string) => void;\n  dragging?: MosaicDraggingState;\n};\n\nconst [MosaicRootContextProvider, useMosaicRootContext] = createContext<MosaicRootContextValue>('MosaicRoot');\n\n//\n// Root\n//\n\nconst MOSAIC_ROOT_NAME = 'Mosaic.Root';\n\n// State attribute: [&:has(>_[data-mosaic-debug=true])]\nconst MOSAIC_ROOT_DEBUG_ATTR = 'mosaic-debug';\n\ntype MosaicRootProps = ThemedClassName<\n  PropsWithChildren<{\n    asChild?: boolean;\n    debug?: boolean;\n  }>\n>;\n\nconst MosaicRoot = forwardRef<HTMLDivElement, MosaicRootProps>(\n  ({ classNames, children, asChild, debug }, forwardedRef) => {\n    const rootRef = useRef<HTMLDivElement>(null);\n    const composedRef = useComposedRefs<HTMLDivElement>(rootRef, forwardedRef);\n    const Comp = asChild ? Slot : Primitive.div;\n\n    const [handlers, setHandlers] = useState<Record<string, MosaicEventHandler>>({});\n    const [dragging, setDragging] = useState<MosaicDraggingState | undefined>();\n\n    const getSourceHandler = useCallback(\n      (source: ElementDragPayload): { data: MosaicTileData; handler?: MosaicEventHandler } => {\n        const data = source.data as MosaicTileData;\n        return { data, handler: handlers[data.containerId] };\n      },\n      [handlers],\n    );\n\n    const getTargetHandler = useCallback(\n      (location: DragLocationHistory): { data?: MosaicData; handler?: MosaicEventHandler } => {\n        for (const target of location.current.dropTargets) {\n          const data = target.data as MosaicData;\n          let containerId: string;\n          switch (data.type) {\n            case 'tile':\n            case 'placeholder':\n              containerId = data.containerId;\n              break;\n            case 'container':\n              containerId = data.id;\n              break;\n          }\n\n          const handler = handlers[containerId];\n          if (handler) {\n            return { data, handler };\n          }\n        }\n\n        return {};\n      },\n      [handlers],\n    );\n\n    useEffect(() => {\n      const handleChange = ({ source, location }: { source: ElementDragPayload; location: DragLocationHistory }) => {\n        const { data: sourceData } = getSourceHandler(source);\n        const { data: targetData, handler } = getTargetHandler(location);\n        setDragging((dragging) => {\n          dragging?.target?.handler?.onCancel?.();\n          return {\n            source: {\n              data: sourceData,\n              handler: handlers[sourceData.containerId],\n              // TOOD(burdon): Check id matches.\n              container: location.initial.dropTargets.find((target) => target.data.type === 'container')?.element,\n            },\n            target: targetData && {\n              data: targetData,\n              handler,\n            },\n          };\n        });\n      };\n\n      const handleCancel = () => {\n        setDragging((dragging) => {\n          requestAnimationFrame(() => {\n            dragging?.target?.handler?.onCancel?.();\n            dragging?.source?.container?.dispatchEvent(new CustomEvent('dnd:cancel', { bubbles: true }));\n          });\n\n          return undefined;\n        });\n      };\n\n      let noTargetTimeout: NodeJS.Timeout;\n\n      // Main controller.\n      return combine(\n        monitorForElements({\n          /**\n           * Dragging started within any container.\n           */\n          onDragStart: ({ source, location }) => {\n            log('Root.onDragStart', {\n              source: source.data,\n              location: location.current.dropTargets.map((target) => target.data),\n            });\n\n            handleChange({ source, location });\n          },\n\n          /**\n           * Dragging entered a new container.\n           */\n          onDropTargetChange: ({ source, location }) => {\n            clearTimeout(noTargetTimeout);\n            log('Root.onDropTargetChange', {\n              source: source.data,\n              location: location.current.dropTargets.map((target) => target.data),\n            });\n\n            // Stop dragging if there are no drop targets (or we are cancelling).\n            if (location.current.dropTargets.length === 0) {\n              noTargetTimeout = setTimeout(() => setDragging(undefined), 1_000);\n            } else {\n              handleChange({ source, location });\n            }\n          },\n\n          /**\n           * Dragging within any container.\n           */\n          onDrag: ({ source, location }) => {\n            const { data } = getSourceHandler(source);\n            const { handler } = getTargetHandler(location);\n            if (handler) {\n              const { clientX: x, clientY: y } = location.current.input;\n              handler.onDrag?.({ source: data, position: { x, y } });\n            }\n          },\n\n          /**\n           * Dragging ended.\n           */\n          onDrop: ({ source, location }) => {\n            log.info('Root.onDrop', {\n              source: source.data,\n              location: location.current.dropTargets.map((target) => target.data),\n            });\n\n            // Get the source container.\n            const { data: sourceData, handler: sourceHandler } = getSourceHandler(source);\n            if (!sourceHandler) {\n              log.warn('invalid source', {\n                source: sourceData,\n                handlers: Object.keys(handlers),\n              });\n              return;\n            }\n\n            // NOTE: When dragging is cancelled (e.g., user presses ESC) onDrop is only called after a subsequent event.\n            // NOTE: pDND blocks ESC event propagation while dragging.\n            // - ESC only flips internal state.\n            // - Completion happens on the next processed input event.\n            // - This avoids reentrancy and keeps pointer/keyboard behavior consistent.\n            // - We set dragging to undefined in onDropTargetChange after a delay if there are no drop targets.\n            try {\n              if (location.current.dropTargets.length === 0) {\n                log.info('cancelled');\n              } else {\n                // Get the target container.\n                const { data: targetData, handler: targetHandler } = getTargetHandler(location);\n                if (!targetHandler) {\n                  log.warn('invalid target', {\n                    source: sourceData,\n                    location,\n                    handlers: Object.keys(handlers),\n                  });\n                  return;\n                }\n\n                // TODO(burdon): Check object doesn't already exist in the collection.\n                if (sourceHandler === targetHandler) {\n                  targetHandler.onDrop?.({\n                    source: sourceData,\n                    target: targetData,\n                  });\n                } else {\n                  if (!sourceHandler.onTake) {\n                    log.warn('invalid source', { source: sourceData });\n                    return;\n                  }\n\n                  sourceHandler.onTake?.({ source: sourceData }, async (object) => {\n                    targetHandler.onDrop?.({\n                      source: { ...sourceData, data: object },\n                      target: targetData,\n                    });\n\n                    return true;\n                  });\n                }\n              }\n            } finally {\n              handleCancel();\n            }\n          },\n        }),\n      );\n    }, [handlers, getSourceHandler, getTargetHandler]);\n\n    return (\n      <MosaicRootContextProvider\n        containers={handlers}\n        addContainer={(container) =>\n          setHandlers((containers) => ({\n            ...containers,\n            [container.id]: container,\n          }))\n        }\n        removeContainer={(id) =>\n          setHandlers((containers) => {\n            delete containers[id];\n            return { ...containers };\n          })\n        }\n        dragging={dragging}\n      >\n        <Comp\n          className={mx('group', classNames)}\n          {...{\n            [`data-${MOSAIC_ROOT_DEBUG_ATTR}`]: debug,\n          }}\n          ref={composedRef}\n        >\n          {children}\n        </Comp>\n      </MosaicRootContextProvider>\n    );\n  },\n);\n\nMosaicRoot.displayName = MOSAIC_ROOT_NAME;\n\nexport { MosaicRoot, useMosaicRootContext };\n\nexport type { MosaicRootProps, MosaicDraggingState };\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { combine } from '@atlaskit/pragmatic-drag-and-drop/combine';\nimport { dropTargetForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';\nimport { autoScrollForElements } from '@atlaskit/pragmatic-drag-and-drop-auto-scroll/element';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { createContext } from '@radix-ui/react-context';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport { Slot } from '@radix-ui/react-slot';\nimport { bind } from 'bind-event-listener';\nimport React, {\n  type CSSProperties,\n  type PropsWithChildren,\n  type ReactNode,\n  forwardRef,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\n\nimport { type AllowedAxis, type ComposableProps } from '@dxos/react-ui';\nimport { composableProps, mx } from '@dxos/ui-theme';\nimport { isTruthy } from '@dxos/util';\n\nimport { useFocus } from '../Focus';\n\nimport { type MosaicDraggingState, useMosaicRootContext } from './Root';\nimport {\n  type LocationType,\n  type MosaicContainerData,\n  type MosaicEventHandler,\n  type MosaicTileData,\n  getSourceData,\n} from './types';\n\n//\n// Container\n//\n\nconst MOSAIC_CONTAINER_NAME = 'Mosaic.Container';\n\ntype MosaicContainerState = { type: 'idle' } | { type: 'active'; bounds?: DOMRect };\n\ntype MosaicContainerContextValue<TData = any, Location = LocationType> = {\n  id: string;\n  eventHandler: MosaicEventHandler<TData>;\n  orientation?: AllowedAxis;\n  dragging?: MosaicDraggingState;\n  scrolling?: boolean;\n  state: MosaicContainerState;\n\n  /** Active drop location. */\n  activeLocation?: Location;\n  setActiveLocation: (location: Location | undefined) => void;\n};\n\nconst [MosaicContainerContextProvider, useMosaicContainerContext] =\n  createContext<MosaicContainerContextValue>('MosaicContainer');\n\n// State attribute: [&:has(>_[data-mosaic-container-state=active])]\nconst MOSAIC_CONTAINER_STATE_ATTR = 'mosaic-container-state';\n\n// CSS variables: [var(--mosaic-placeholder-xxx)]\nconst MOSAIC_CONTAINER_PLACEHOLDER_WIDTH = '--mosaic-placeholder-width';\nconst MOSAIC_CONTAINER_PLACEHOLDER_HEIGHT = '--mosaic-placeholder-height';\n\nlet counter = 0;\n\ntype MosaicContainerProps = ComposableProps<HTMLDivElement> &\n  PropsWithChildren<\n    Partial<Pick<MosaicContainerContextValue, 'eventHandler' | 'orientation'>> & {\n      asChild?: boolean;\n      autoScroll?: HTMLElement | null;\n      withFocus?: boolean;\n      debug?: () => ReactNode;\n    }\n  >;\n\n// TODO(burdon): Make generic.\nconst MosaicContainer = forwardRef<HTMLDivElement, MosaicContainerProps>(\n  (\n    {\n      children,\n      eventHandler: eventHandlerProp,\n      orientation = 'vertical',\n      asChild,\n      autoScroll: autoscrollElement,\n      withFocus,\n      debug,\n      ...props\n    }: MosaicContainerProps,\n    forwardedRef,\n  ) => {\n    const { className, ...rest } = composableProps(props);\n    const Comp = asChild ? Slot : Primitive.div;\n    const rootRef = useRef<HTMLDivElement>(null);\n    const composedRef = useComposedRefs<HTMLDivElement>(rootRef, forwardedRef);\n\n    // Handler.\n    const eventHandler = useMemo(\n      () =>\n        eventHandlerProp ?? {\n          id: `mosaic-container-${counter++}`,\n        },\n      [eventHandlerProp],\n    );\n\n    // State.\n    const { dragging } = useMosaicRootContext(MOSAIC_CONTAINER_NAME);\n    const [state, setState] = useState<MosaicContainerState>({ type: 'idle' });\n    const [activeLocation, setActiveLocation] = useState<LocationType | undefined>();\n    const [scrolling, setScrolling] = useState(false);\n\n    // Focus container.\n    const { setFocus } = useFocus();\n    useEffect(() => {\n      if (withFocus) {\n        setFocus?.(state.type === 'active' ? 'active' : undefined);\n      }\n    }, [setFocus, withFocus, state]);\n\n    // Register handler.\n    const { addContainer, removeContainer } = useMosaicRootContext(eventHandler.id);\n    useEffect(() => {\n      addContainer(eventHandler);\n      return () => removeContainer(eventHandler.id);\n    }, [eventHandler]);\n\n    const data = useMemo<MosaicContainerData>(\n      () =>\n        ({\n          type: 'container',\n          id: eventHandler.id,\n        }) satisfies MosaicContainerData,\n      [eventHandler.id],\n    );\n\n    useEffect(() => {\n      if (!rootRef.current) {\n        return;\n      }\n\n      // Determine if scrolling (pause drag/drop handlers).\n      let timeout: ReturnType<typeof setTimeout>;\n      const handleScroll = () => {\n        setScrolling(true);\n        clearTimeout(timeout);\n        timeout = setTimeout(() => {\n          setScrolling(false);\n        }, 500);\n      };\n\n      return combine(\n        ...[\n          /**\n           * Custom event for dragging cancellation.\n           */\n          bind(rootRef.current, {\n            type: 'dnd:cancel',\n            listener: () => {\n              setState({ type: 'idle' });\n            },\n          }),\n\n          // Target.\n          dropTargetForElements({\n            element: rootRef.current,\n            getData: () => data,\n\n            /**\n             * Test if permitted to drop here.\n             * NOTE: Contained Tile and Placeholder elements do the same.\n             */\n            canDrop: ({ source }) => {\n              const data = getSourceData(source);\n              return (data && eventHandler.canDrop?.({ source: data })) || false;\n            },\n\n            // TODO(burdon): Provide semantic intent to onDrop.\n            // getDropEffect: () => {\n            //   return 'move';\n            // },\n\n            /**\n             * Dragging started in this container.\n             */\n            onDragStart: ({ source }) => {\n              const sourceData = source.data as MosaicTileData;\n              setState({ type: 'active', bounds: sourceData.bounds });\n            },\n            /**\n             * Dragging entered this container.\n             */\n            onDragEnter: ({ source }) => {\n              const sourceData = source.data as MosaicTileData;\n              setState({ type: 'active', bounds: sourceData.bounds });\n            },\n            /**\n             * Dragging left this container.\n             * NOTE: If the container isn't full-height, then when the dragged item is temporarily removed the container will shrink,\n             * triggering `onDragLeave`, which then causes the item to be added and removed continually (flickering).\n             */\n            onDragLeave: ({ source }) => {\n              const sourceData = source.data as MosaicTileData;\n              if (sourceData.containerId !== eventHandler.id) {\n                setState({ type: 'idle' });\n              }\n            },\n            /**\n             * Dropped in this container.\n             */\n            onDrop: () => {\n              setState({ type: 'idle' });\n            },\n          }),\n\n          // Autoscroll.\n          // NOTE: When used with Scrollable we get a spurious warning (in dev mode).\n          // \"Auto scrolling has been attached to an element that appears not to be scrollable.\"\n          autoscrollElement && [\n            autoScrollForElements({\n              element: autoscrollElement,\n              // canScroll: ({ element: _ }) => {\n              //   return true;\n              // },\n              getAllowedAxis: () => orientation,\n              getConfiguration: () => ({\n                maxScrollSpeed: 'fast',\n              }),\n            }),\n\n            bind(autoscrollElement, {\n              type: 'scroll',\n              listener: handleScroll,\n            }),\n\n            () => setScrolling(false),\n          ],\n        ]\n          .filter(isTruthy)\n          .flatMap((x) => x),\n      );\n    }, [rootRef, eventHandler, data, autoscrollElement]);\n\n    return (\n      <MosaicContainerContextProvider\n        id={eventHandler.id}\n        eventHandler={eventHandler}\n        orientation={orientation}\n        state={state}\n        dragging={state.type === 'active' ? dragging : undefined}\n        scrolling={scrolling}\n        activeLocation={activeLocation}\n        setActiveLocation={setActiveLocation}\n      >\n        <Comp\n          className={mx('h-full', className)}\n          style={\n            {\n              [MOSAIC_CONTAINER_PLACEHOLDER_WIDTH]:\n                state.type === 'active' && state.bounds ? `${state.bounds.width}px` : '0px',\n              [MOSAIC_CONTAINER_PLACEHOLDER_HEIGHT]:\n                state.type === 'active' && state.bounds ? `${state.bounds.height}px` : '0px',\n            } as CSSProperties\n          }\n          {...rest}\n          {...{\n            [`data-${MOSAIC_CONTAINER_STATE_ATTR}`]: state.type,\n          }}\n          ref={composedRef}\n        >\n          {children}\n        </Comp>\n        {debug?.()}\n      </MosaicContainerContextProvider>\n    );\n  },\n);\n\nMosaicContainer.displayName = MOSAIC_CONTAINER_NAME;\n\nexport { MosaicContainer, useMosaicContainerContext };\n\nexport type { MosaicContainerProps, MosaicContainerState };\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { combine } from '@atlaskit/pragmatic-drag-and-drop/combine';\nimport {\n  type ElementDragPayload,\n  draggable,\n  dropTargetForElements,\n} from '@atlaskit/pragmatic-drag-and-drop/element/adapter';\nimport { preserveOffsetOnSource } from '@atlaskit/pragmatic-drag-and-drop/element/preserve-offset-on-source';\nimport { setCustomNativeDragPreview } from '@atlaskit/pragmatic-drag-and-drop/element/set-custom-native-drag-preview';\nimport { type DropTargetRecord } from '@atlaskit/pragmatic-drag-and-drop/types';\nimport {\n  type Edge,\n  attachClosestEdge,\n  extractClosestEdge,\n} from '@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge';\nimport { composeRefs } from '@radix-ui/react-compose-refs';\nimport { createContext } from '@radix-ui/react-context';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport { Slot } from '@radix-ui/react-slot';\nimport React, {\n  type CSSProperties,\n  type PropsWithChildren,\n  forwardRef,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { type ComposableProps } from '@dxos/react-ui';\nimport { composableProps, mx } from '@dxos/ui-theme';\n\nimport { useMosaicContainerContext } from './Container';\nimport { type LocationType, type MosaicTileData, getSourceData } from './types';\n\n//\n// Tile\n//\n\nconst MOSAIC_TILE_NAME = 'Mosaic.Tile';\n\ntype MosaicTileState =\n  | { type: 'idle' }\n  | { type: 'preview'; container: HTMLElement; rect: DOMRect }\n  | { type: 'dragging' }\n  | { type: 'target'; closestEdge: Edge | null };\n\ntype MosaicTileContextValue = {\n  state: MosaicTileState;\n};\n\nconst [MosaicTileContextProvider, useMosaicTileContext] = createContext<MosaicTileContextValue>('MosaicTile');\n\n// State attribute: data-[mosaic-tile-state=dragging]\nconst MOSAIC_TILE_STATE_ATTR = 'mosaic-tile-state';\n\ntype MosaicTileProps<TData = any, TLocation = LocationType> = ComposableProps<HTMLDivElement> &\n  PropsWithChildren<{\n    asChild?: boolean;\n    dragHandle?: HTMLElement | null;\n    allowedEdges?: Edge[];\n    id: string;\n    data: TData;\n    location: TLocation;\n    draggable?: boolean; // TODO(burdon): Not currently implemented.\n    debug?: boolean;\n  }>;\n\nconst MosaicTile = forwardRef<HTMLDivElement, MosaicTileProps>(\n  (\n    {\n      children,\n      asChild,\n      dragHandle,\n      allowedEdges: allowedEdgesProp,\n      location,\n      id,\n      data: dataProp,\n      debug: _,\n      ...props\n    }: MosaicTileProps,\n    forwardedRef,\n  ) => {\n    const { className, ...rest } = composableProps(props);\n    const Comp = asChild ? Slot : Primitive.div;\n    const rootRef = useRef<HTMLDivElement>(null);\n    const composedRef = composeRefs<HTMLDivElement>(rootRef, forwardedRef);\n\n    // State.\n    const {\n      id: containerId,\n      eventHandler,\n      orientation,\n      scrolling,\n      setActiveLocation,\n    } = useMosaicContainerContext(MOSAIC_TILE_NAME);\n    const [state, setState] = useState<MosaicTileState>({ type: 'idle' });\n\n    const allowedEdges = useMemo<Edge[]>(\n      () => allowedEdgesProp || (orientation === 'vertical' ? ['top', 'bottom'] : ['left', 'right']),\n      [allowedEdgesProp, orientation],\n    );\n\n    const data = useMemo<MosaicTileData>(\n      () =>\n        ({\n          type: 'tile',\n          id,\n          containerId,\n          data: dataProp,\n          location,\n        }) satisfies MosaicTileData,\n      [containerId, location, dataProp],\n    );\n\n    useLayoutEffect(() => {\n      const root = rootRef.current;\n      if (!root || !containerId || scrolling) {\n        return;\n      }\n\n      const handleChange = ({ self, source }: { self: DropTargetRecord; source: ElementDragPayload }) => {\n        if (source.data.id !== dataProp.id) {\n          const closestEdge = extractClosestEdge(self.data);\n          const location = data.location + (closestEdge === 'top' || closestEdge === 'left' ? -0.5 : 0.5);\n          setActiveLocation(location);\n          setState({ type: 'target', closestEdge });\n        }\n      };\n\n      return combine(\n        // Source.\n        draggable({\n          element: root,\n          dragHandle: dragHandle && state.type !== 'preview' ? dragHandle : undefined,\n          canDrag: () => true,\n          getInitialData: () => data,\n          onGenerateDragPreview: ({ location, nativeSetDragImage }) => {\n            setCustomNativeDragPreview({\n              nativeSetDragImage,\n              getOffset: preserveOffsetOnSource({\n                element: root,\n                input: location.current.input,\n              }),\n              render: ({ container }) => {\n                data.bounds = root.getBoundingClientRect();\n                setState({\n                  type: 'preview',\n                  container,\n                  rect: root.getBoundingClientRect(),\n                });\n                return () => setState({ type: 'dragging' });\n              },\n            });\n          },\n\n          onDragStart: () => {\n            setState({ type: 'dragging' });\n          },\n          onDrop: () => {\n            setState({ type: 'idle' });\n          },\n        }),\n\n        // Target.\n        dropTargetForElements({\n          element: root,\n          getData: ({ input, element }) => attachClosestEdge(data, { input, element, allowedEdges }),\n          canDrop: ({ source }) => {\n            const data = getSourceData(source);\n            return (data && eventHandler.canDrop?.({ source: data })) || false;\n          },\n          onDragEnter: ({ self, source }) => {\n            handleChange({ self, source });\n          },\n          onDragLeave: () => {\n            setState({ type: 'idle' });\n            setActiveLocation(undefined);\n          },\n          onDrag: ({ self, source }) => {\n            handleChange({ self, source });\n          },\n          onDrop: () => {\n            setState({ type: 'idle' });\n            setActiveLocation(undefined);\n          },\n        }),\n      );\n    }, [rootRef, dragHandle, eventHandler, data, scrolling, allowedEdges, setActiveLocation]);\n\n    // NOTE: Ensure no gaps between cells (prevent drop indicators flickering).\n    // NOTE: Ensure padding doesn't change position of cursor when dragging (no margins).\n    return (\n      <MosaicTileContextProvider state={state}>\n        <Comp\n          {...rest}\n          {...{\n            [`data-${MOSAIC_TILE_STATE_ATTR}`]: state.type,\n          }}\n          role='listitem'\n          className={mx('relative', className)}\n          ref={composedRef}\n        >\n          {children}\n        </Comp>\n\n        {state.type === 'preview' &&\n          createPortal(\n            <Comp\n              {...{\n                // NOTE: Use to control appearance while dragging.\n                [`data-${MOSAIC_TILE_STATE_ATTR}`]: state.type,\n              }}\n              // TODO(burdon): Configure drop animation.\n              className={mx('relative', className)}\n              style={\n                {\n                  width: `${state.rect.width}px`,\n                  height: `${state.rect.height}px`,\n                } as CSSProperties\n              }\n            >\n              {children}\n            </Comp>,\n            state.container,\n          )}\n      </MosaicTileContextProvider>\n    );\n  },\n);\n\nMosaicTile.displayName = MOSAIC_TILE_NAME;\n\nexport { MosaicTile, useMosaicTileContext };\n\nexport type { MosaicTileProps, MosaicTileState };\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { dropTargetForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';\nimport {\n  DropIndicator as NaturalDropIndicator,\n  type DropIndicatorProps as NaturalDropIndicatorProps,\n} from '@atlaskit/pragmatic-drag-and-drop-react-drop-indicator/box';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport { Slot } from '@radix-ui/react-slot';\nimport React, { type PropsWithChildren, useLayoutEffect, useMemo, useRef } from 'react';\n\nimport { type Axis, type ThemedClassName } from '@dxos/react-ui';\nimport { mx } from '@dxos/ui-theme';\n\nimport { useMosaicContainerContext } from './Container';\nimport { useMosaicTileContext } from './Tile';\nimport { type LocationType, type MosaicPlaceholderData, getSourceData } from './types';\n\n//\n// Placeholder\n//\n\nconst MOSAIC_PLACEHOLDER_NAME = 'Mosaic.Placeholder';\n\n// Orientation: data-[mosaic-placeholder-orientation=vertical]\nconst MOSAIC_PLACEHOLDER_ORIENTATION_ATTR = 'mosaic-placeholder-orientation';\n\n// State attribute: data-[mosaic-placeholder-state=active]\nconst MOSAIC_PLACEHOLDER_STATE_ATTR = 'mosaic-placeholder-state';\n\ntype MosaicPlaceholderProps<Location = LocationType> = ThemedClassName<\n  PropsWithChildren<{\n    asChild?: boolean;\n    orientation?: Axis;\n    location: Location;\n  }>\n>;\n\nconst MosaicPlaceholder = <Location extends LocationType = LocationType>({\n  classNames,\n  children,\n  asChild,\n  orientation = 'vertical',\n  location,\n}: MosaicPlaceholderProps<Location>) => {\n  const rootRef = useRef<HTMLDivElement>(null);\n  const Comp = asChild ? Slot : Primitive.div;\n  const {\n    id: containerId,\n    eventHandler,\n    scrolling,\n    activeLocation,\n    setActiveLocation,\n  } = useMosaicContainerContext(MOSAIC_PLACEHOLDER_NAME);\n  const data = useMemo<MosaicPlaceholderData<Location>>(\n    () =>\n      ({\n        type: 'placeholder',\n        containerId,\n        location,\n      }) satisfies MosaicPlaceholderData<Location>,\n    [containerId, location],\n  );\n\n  useLayoutEffect(() => {\n    const root = rootRef.current;\n    if (!root || scrolling) {\n      return;\n    }\n\n    return dropTargetForElements({\n      element: root,\n      getData: () => data,\n      canDrop: ({ source }) => {\n        const data = getSourceData(source);\n        return (data && eventHandler.canDrop?.({ source: data })) || false;\n      },\n      onDragEnter: () => {\n        setActiveLocation(data.location);\n      },\n      onDragLeave: () => {\n        setActiveLocation(undefined);\n      },\n      onDrop: () => {\n        setActiveLocation(undefined);\n      },\n    });\n  }, [rootRef, data, scrolling, setActiveLocation]);\n\n  return (\n    <Comp\n      {...{\n        [`data-${MOSAIC_PLACEHOLDER_ORIENTATION_ATTR}`]: orientation,\n        [`data-${MOSAIC_PLACEHOLDER_STATE_ATTR}`]: data.location === activeLocation ? 'active' : 'idle',\n      }}\n      role='none'\n      className={mx('relative', classNames)}\n      ref={rootRef}\n    >\n      {children}\n    </Comp>\n  );\n};\n\nMosaicPlaceholder.displayName = MOSAIC_PLACEHOLDER_NAME;\n\n//\n// DropIndicator\n// TODO(burdon): Support DropIndicator or Placeholder variants.\n//\n\nconst DROP_INDICATOR_NAME = 'Mosaic.DropIndicator';\n\ntype MosaicDropIndicatorProps = Omit<NaturalDropIndicatorProps, 'edge'>;\n\nconst MosaicDropIndicator = (props: MosaicDropIndicatorProps) => {\n  const { state } = useMosaicTileContext(DROP_INDICATOR_NAME);\n  return state.type === 'target' && state.closestEdge ? (\n    <NaturalDropIndicator {...props} edge={state.closestEdge} />\n  ) : null;\n};\n\nMosaicDropIndicator.displayName = DROP_INDICATOR_NAME;\n\n//\n// Exports\n//\n\nexport { MosaicPlaceholder, MosaicDropIndicator };\n\nexport type { MosaicPlaceholderProps, MosaicDropIndicatorProps };\n", "//\n// Copyright 2026 DXOS.org\n//\n\nimport { type ReactVirtualizerOptions, useVirtualizer } from '@tanstack/react-virtual';\nimport React, { type FC, Fragment, type ReactElement, type Ref, forwardRef } from 'react';\n\nimport { invariant } from '@dxos/invariant';\nimport { type Axis, type ComposableProps } from '@dxos/react-ui';\nimport { composableProps, mx } from '@dxos/ui-theme';\n\nimport { useVisibleItems } from '../../hooks';\n\nimport { useMosaicContainerContext } from './Container';\nimport { MosaicPlaceholder, type MosaicPlaceholderProps } from './Placeholder';\nimport { styles } from './styles';\nimport { type MosaicTileProps } from './Tile';\nimport { type GetId } from './types';\n\n//\n// Mosaic Drag-and-drop\n//\n// Drop targets:\n// - Placeholders exist to allow gaps but prevent deadspace when dragging within a container.\n// - When dragging over a Tile, the placeholder next to the closest edge is activated.\n// - Placeholders expand when active; event handlers are disabled while the container is scrolling.\n//\n// [Container]\n// - [Placeholder 0.5]\n// - [Tile        1  ]\n// - [Placeholder 1.5]\n// - [Tile        2  ]\n// - [Placeholder 2.5]\n// - [Tile        3  ]\n// - [Placeholder 3.5]\n//\n// Implementation Notes\n// - We use [Radix composition](https://www.radix-ui.com/primitives/docs/guides/composition) to factor out composible aspects (e.g., Focus, Mosaic, etc.)\n// - NOTE: Use Slottable only if needed to disambiguate; otherwise a suspected Radix bug causes compositional problems.\n\nconst MOSAIC_STACK_NAME = 'MosaicStack';\n\ntype MosaicStackTileComponent<TData = any> = FC<MosaicTileProps<TData>>;\n\ntype MosaicStackProps<TData = any> = Omit<ComposableProps<HTMLDivElement>, 'onChange'> & {\n  Tile: MosaicStackTileComponent<TData>;\n  getId: GetId<TData>;\n  role?: string;\n  orientation?: Axis;\n  items?: readonly TData[];\n} & Pick<MosaicTileProps<TData>, 'draggable' | 'debug'>;\n\n/**\n * Linear layout of Mosaic tiles.\n * NOTE: This is a low-level component and should be wrapped by a scrollable container.\n */\nconst MosaicStackInner = forwardRef<HTMLDivElement, MosaicStackProps>(\n  (\n    { role = 'list', orientation: orientationProp = 'vertical', draggable = true, items, getId, Tile, debug, ...props },\n    forwardedRef,\n  ) => {\n    const { className, ...rest } = composableProps(props);\n    invariant(Tile);\n    const { id, orientation = orientationProp, dragging } = useMosaicContainerContext(MOSAIC_STACK_NAME);\n    const visibleItems = useVisibleItems({ id, items, dragging: dragging?.source.data, getId });\n    invariant(orientation === 'vertical' || orientation === 'horizontal', `Invalid orientation: ${orientation}`);\n\n    return (\n      <div\n        {...rest}\n        role={role}\n        className={mx(\n          'flex',\n          orientation === 'horizontal' && 'h-full [&>*]:shrink-0',\n          orientation === 'vertical' && 'flex-col',\n          className,\n        )}\n        ref={forwardedRef}\n      >\n        <InternalPlaceholder orientation={orientation} location={0.5} />\n        {visibleItems?.map((item, index) => (\n          <Fragment key={getId(item)}>\n            <Tile id={getId(item)} data={item} location={index + 1} draggable={draggable} debug={debug} />\n            <InternalPlaceholder orientation={orientation} location={index + 1.5} />\n          </Fragment>\n        ))}\n      </div>\n    );\n  },\n);\n\nMosaicStackInner.displayName = MOSAIC_STACK_NAME;\n\nconst MosaicStack = MosaicStackInner as <TData = any>(\n  props: MosaicStackProps<TData> & { ref?: Ref<HTMLDivElement> },\n) => ReactElement;\n\n//\n// VirtualStack\n//\n\nconst MOSAIC_VIRTUAL_STACK_NAME = 'MosaicVirtualStack';\n\ntype MosaicVirtualStackProps<TData = any> = MosaicStackProps<TData> &\n  Pick<\n    ReactVirtualizerOptions<HTMLElement, HTMLDivElement>,\n    'estimateSize' | 'getScrollElement' | 'overscan' | 'onChange'\n  >;\n\nconst MosaicVirtualStackInner = forwardRef<HTMLDivElement, MosaicVirtualStackProps>(\n  (\n    {\n      role = 'list',\n      orientation = 'vertical',\n      items,\n      getId,\n      Tile,\n      estimateSize,\n      getScrollElement,\n      overscan = 8,\n      onChange,\n      debug,\n      ...props\n    },\n    forwardedRef,\n  ) => {\n    const { className, ...rest } = composableProps(props);\n    invariant(Tile);\n    const { id, dragging } = useMosaicContainerContext(MOSAIC_VIRTUAL_STACK_NAME);\n    const visibleItems = useVisibleItems({ id, items, dragging: dragging?.source.data, getId });\n    const virtualizer = useVirtualizer({\n      count: visibleItems.length * 2 + 1,\n      estimateSize,\n      getScrollElement,\n      overscan,\n      onChange,\n    });\n\n    const virtualItems = virtualizer.getVirtualItems();\n\n    return (\n      <div\n        {...rest}\n        role={role}\n        className={mx(\n          'flex',\n          orientation === 'horizontal' && 'h-full [&>*]:shrink-0',\n          orientation === 'vertical' && 'flex-col',\n          className,\n        )}\n        style={{\n          position: 'relative',\n          ...(orientation === 'vertical'\n            ? {\n                width: '100%',\n                height: virtualizer.getTotalSize(),\n              }\n            : {\n                width: virtualizer.getTotalSize(),\n                height: '100%',\n              }),\n        }}\n        ref={forwardedRef}\n      >\n        {virtualItems.map((virtualItem) => {\n          const data = visibleItems![Math.floor(virtualItem.index / 2)];\n          return (\n            <div\n              key={virtualItem.key}\n              data-index={virtualItem.index}\n              style={{\n                position: 'absolute',\n                top: 0,\n                left: 0,\n                ...(orientation === 'vertical'\n                  ? {\n                      width: '100%',\n                      transform: `translateY(${virtualItem.start}px)`,\n                    }\n                  : {\n                      height: '100%',\n                      transform: `translateX(${virtualItem.start}px)`,\n                    }),\n              }}\n              ref={virtualizer.measureElement}\n            >\n              {virtualItem.index % 2 === 0 ? (\n                <InternalPlaceholder orientation={orientation} location={Math.floor(virtualItem.index / 2) + 0.5} />\n              ) : (\n                <Tile id={getId(data)} data={data} location={Math.floor(virtualItem.index / 2) + 1} debug={debug} />\n              )}\n            </div>\n          );\n        })}\n      </div>\n    );\n  },\n);\n\nMosaicVirtualStackInner.displayName = MOSAIC_VIRTUAL_STACK_NAME;\n\nconst MosaicVirtualStack = MosaicVirtualStackInner as <TData = any>(\n  props: MosaicVirtualStackProps<TData> & { ref?: Ref<HTMLDivElement> },\n) => ReactElement;\n\n//\n// InternalPlaceholder\n//\n\nconst InternalPlaceholder = (props: MosaicPlaceholderProps<number>) => {\n  return (\n    <MosaicPlaceholder {...props} classNames={styles.placeholder.root}>\n      <div\n        className={mx(\n          'flex h-full bg-base-surface border border-dashed border-separator rounded-xs',\n          styles.placeholder.content,\n        )}\n      />\n    </MosaicPlaceholder>\n  );\n};\n\nInternalPlaceholder.displayName = 'InternalPlaceholder';\n\n//\n// Exports\n//\n\nexport { MosaicStack, MosaicVirtualStack };\n\nexport type { MosaicStackTileComponent, MosaicStackProps, MosaicVirtualStackProps };\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport {\n  MosaicContainer,\n  type MosaicContainerProps,\n  type MosaicContainerState,\n  useMosaicContainerContext,\n} from './Container';\nimport {\n  MosaicDropIndicator,\n  type MosaicDropIndicatorProps,\n  MosaicPlaceholder,\n  type MosaicPlaceholderProps,\n} from './Placeholder';\nimport { MosaicRoot, type MosaicRootProps, useMosaicRootContext } from './Root';\nimport { MosaicStack, type MosaicStackProps, type MosaicStackTileComponent, MosaicVirtualStack } from './Stack';\nimport { MosaicTile, type MosaicTileProps, type MosaicTileState, useMosaicTileContext } from './Tile';\n\n//\n// Mosaic\n//\n\nexport const Mosaic = {\n  Root: MosaicRoot,\n  Container: MosaicContainer,\n  Tile: MosaicTile,\n  Placeholder: MosaicPlaceholder,\n  DropIndicator: MosaicDropIndicator,\n  Stack: MosaicStack,\n  VirtualStack: MosaicVirtualStack,\n};\n\nexport type {\n  MosaicRootProps,\n  MosaicContainerProps,\n  MosaicContainerState,\n  MosaicTileProps,\n  MosaicTileState,\n  MosaicPlaceholderProps,\n  MosaicDropIndicatorProps,\n  MosaicStackProps,\n  MosaicStackTileComponent,\n};\n\nexport {\n  useMosaicRootContext as useMosaic,\n  useMosaicContainerContext as useMosaicContainer,\n  useMosaicTileContext as useMosaicTile,\n};\n"],
+  "mappings": "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",
+  "names": ["useMemo", "useVisibleItems", "id", "items", "dragging", "getId", "visibleItems", "useMemo", "containerId", "idx", "findIndex", "item", "slice", "splice", "useArrowNavigationGroup", "useFocusableGroup", "useMergedTabsterAttributes_unstable", "useComposedRefs", "Primitive", "Slot", "React", "createContext", "forwardRef", "useContext", "useRef", "useState", "composableProps", "mx", "FOCUS_STATE_ATTR", "FocusContext", "createContext", "useFocus", "useContext", "Group", "forwardRef", "children", "asChild", "orientation", "props", "forwardedRef", "className", "rest", "composableProps", "Comp", "Slot", "Primitive", "div", "rootRef", "useRef", "composedRef", "useComposedRefs", "focusableGroupAttrs", "useFocusableGroup", "tabBehavior", "arrowNavigationAttrs", "useArrowNavigationGroup", "axis", "memorizeCurrent", "tabsterAttrs", "useMergedTabsterAttributes_unstable", "state", "setState", "useState", "Provider", "value", "setFocus", "tabIndex", "mx", "ref", "Focus", "styles", "placeholder", "root", "content", "getSourceData", "source", "data", "type", "combine", "monitorForElements", "useComposedRefs", "createContext", "Primitive", "Slot", "React", "forwardRef", "useCallback", "useEffect", "useRef", "useState", "log", "mx", "MosaicRootContextProvider", "useMosaicRootContext", "MOSAIC_ROOT_NAME", "MOSAIC_ROOT_DEBUG_ATTR", "MosaicRoot", "classNames", "children", "asChild", "debug", "forwardedRef", "rootRef", "composedRef", "Comp", "div", "handlers", "setHandlers", "dragging", "setDragging", "getSourceHandler", "source", "data", "handler", "containerId", "getTargetHandler", "location", "target", "current", "dropTargets", "type", "id", "handleChange", "sourceData", "targetData", "onCancel", "container", "initial", "find", "element", "handleCancel", "requestAnimationFrame", "dispatchEvent", "CustomEvent", "bubbles", "undefined", "noTargetTimeout", "onDragStart", "map", "onDropTargetChange", "clearTimeout", "length", "setTimeout", "onDrag", "clientX", "x", "clientY", "y", "input", "position", "onDrop", "info", "sourceHandler", "warn", "Object", "keys", "targetHandler", "onTake", "object", "containers", "addContainer", "removeContainer", "className", "ref", "displayName", "combine", "dropTargetForElements", "autoScrollForElements", "useComposedRefs", "createContext", "Primitive", "Slot", "bind", "React", "forwardRef", "useEffect", "useMemo", "useRef", "useState", "composableProps", "mx", "isTruthy", "MOSAIC_CONTAINER_NAME", "MosaicContainerContextProvider", "useMosaicContainerContext", "createContext", "MOSAIC_CONTAINER_STATE_ATTR", "MOSAIC_CONTAINER_PLACEHOLDER_WIDTH", "MOSAIC_CONTAINER_PLACEHOLDER_HEIGHT", "counter", "MosaicContainer", "forwardRef", "children", "eventHandler", "eventHandlerProp", "orientation", "asChild", "autoScroll", "autoscrollElement", "withFocus", "debug", "props", "forwardedRef", "className", "rest", "composableProps", "Comp", "Slot", "Primitive", "div", "rootRef", "useRef", "composedRef", "useComposedRefs", "useMemo", "id", "dragging", "useMosaicRootContext", "state", "setState", "useState", "type", "activeLocation", "setActiveLocation", "scrolling", "setScrolling", "setFocus", "useFocus", "useEffect", "undefined", "addContainer", "removeContainer", "data", "current", "timeout", "handleScroll", "clearTimeout", "setTimeout", "combine", "bind", "listener", "dropTargetForElements", "element", "getData", "canDrop", "source", "getSourceData", "onDragStart", "sourceData", "bounds", "onDragEnter", "onDragLeave", "containerId", "onDrop", "autoScrollForElements", "getAllowedAxis", "getConfiguration", "maxScrollSpeed", "filter", "isTruthy", "flatMap", "x", "React", "mx", "style", "width", "height", "ref", "displayName", "combine", "draggable", "dropTargetForElements", "preserveOffsetOnSource", "setCustomNativeDragPreview", "attachClosestEdge", "extractClosestEdge", "composeRefs", "createContext", "Primitive", "Slot", "React", "forwardRef", "useLayoutEffect", "useMemo", "useRef", "useState", "createPortal", "composableProps", "mx", "MOSAIC_TILE_NAME", "MosaicTileContextProvider", "useMosaicTileContext", "createContext", "MOSAIC_TILE_STATE_ATTR", "MosaicTile", "forwardRef", "children", "asChild", "dragHandle", "allowedEdges", "allowedEdgesProp", "location", "id", "data", "dataProp", "debug", "_", "props", "forwardedRef", "className", "rest", "composableProps", "Comp", "Slot", "Primitive", "div", "rootRef", "useRef", "composedRef", "composeRefs", "containerId", "eventHandler", "orientation", "scrolling", "setActiveLocation", "useMosaicContainerContext", "state", "setState", "useState", "type", "useMemo", "useLayoutEffect", "root", "current", "handleChange", "self", "source", "closestEdge", "extractClosestEdge", "combine", "draggable", "element", "undefined", "canDrag", "getInitialData", "onGenerateDragPreview", "nativeSetDragImage", "setCustomNativeDragPreview", "getOffset", "preserveOffsetOnSource", "input", "render", "container", "bounds", "getBoundingClientRect", "rect", "onDragStart", "onDrop", "dropTargetForElements", "getData", "attachClosestEdge", "canDrop", "getSourceData", "onDragEnter", "onDragLeave", "onDrag", "React", "role", "mx", "ref", "createPortal", "style", "width", "height", "displayName", "dropTargetForElements", "DropIndicator", "NaturalDropIndicator", "Primitive", "Slot", "React", "useLayoutEffect", "useMemo", "useRef", "mx", "MOSAIC_PLACEHOLDER_NAME", "MOSAIC_PLACEHOLDER_ORIENTATION_ATTR", "MOSAIC_PLACEHOLDER_STATE_ATTR", "MosaicPlaceholder", "classNames", "children", "asChild", "orientation", "location", "rootRef", "useRef", "Comp", "Slot", "Primitive", "div", "id", "containerId", "eventHandler", "scrolling", "activeLocation", "setActiveLocation", "useMosaicContainerContext", "data", "useMemo", "type", "useLayoutEffect", "root", "current", "dropTargetForElements", "element", "getData", "canDrop", "source", "getSourceData", "onDragEnter", "onDragLeave", "undefined", "onDrop", "React", "role", "className", "mx", "ref", "displayName", "DROP_INDICATOR_NAME", "MosaicDropIndicator", "props", "state", "useMosaicTileContext", "closestEdge", "NaturalDropIndicator", "edge", "useVirtualizer", "React", "Fragment", "forwardRef", "invariant", "composableProps", "mx", "MOSAIC_STACK_NAME", "MosaicStackInner", "forwardRef", "role", "orientation", "orientationProp", "draggable", "items", "getId", "Tile", "debug", "props", "forwardedRef", "className", "rest", "composableProps", "invariant", "id", "dragging", "useMosaicContainerContext", "visibleItems", "useVisibleItems", "source", "data", "React", "div", "mx", "ref", "InternalPlaceholder", "location", "map", "item", "index", "Fragment", "key", "displayName", "MosaicStack", "MOSAIC_VIRTUAL_STACK_NAME", "MosaicVirtualStackInner", "estimateSize", "getScrollElement", "overscan", "onChange", "virtualizer", "useVirtualizer", "count", "length", "virtualItems", "getVirtualItems", "style", "position", "width", "height", "getTotalSize", "virtualItem", "Math", "floor", "data-index", "top", "left", "transform", "start", "measureElement", "MosaicVirtualStack", "MosaicPlaceholder", "classNames", "styles", "placeholder", "root", "content", "Mosaic", "Root", "MosaicRoot", "Container", "MosaicContainer", "Tile", "MosaicTile", "Placeholder", "MosaicPlaceholder", "DropIndicator", "MosaicDropIndicator", "Stack", "MosaicStack", "VirtualStack", "MosaicVirtualStack"]
+}

package/dist/lib/browser/index.mjs

@@ -8,7 +8,7 @@ import {
   useMosaicRootContext,
   useMosaicTileContext,
   useVisibleItems
-} from "./chunk-7S4PIFKU.mjs";
+} from "./chunk-75KCPN67.mjs";
 
 // src/components/Board/Board.tsx
 import { useAtomValue as useAtomValue2 } from "@effect-atom/atom-react";
@@ -16,7 +16,7 @@ import { createContext as createContext2 } from "@radix-ui/react-context";
 import React4, { forwardRef as forwardRef4, useRef as useRef4, useState as useState2 } from "react";
 import { ScrollArea as ScrollArea2 } from "@dxos/react-ui";
 import { Json as Json2 } from "@dxos/react-ui-syntax-highlighter";
-import { mx as mx3 } from "@dxos/ui-theme";
+import { composableProps, mx as mx3 } from "@dxos/ui-theme";
 
 // src/hooks/useContainerDebug.tsx
 import React, { forwardRef, useMemo, useRef } from "react";
@@ -535,14 +535,17 @@ var BoardRootInner = ({ model, children }) => {
 BoardRootInner.displayName = BOARD_ROOT_NAME;
 var BoardRoot = BoardRootInner;
 var BOARD_CONTENT_NAME = "Board.Content";
-var BoardContentInner = /* @__PURE__ */ forwardRef4(({ classNames, id: _id, debug, eventHandler, Tile = DefaultBoardColumn }, forwardedRef) => {
+var BoardContentInner = /* @__PURE__ */ forwardRef4(({ id: _id, debug, eventHandler, Tile = DefaultBoardColumn, ...props }, forwardedRef) => {
+  const { className, ...rest } = composableProps(props);
   const { model } = useBoardContext(BOARD_CONTENT_NAME);
   const [DebugInfo, debugHandler] = useContainerDebug(debug);
   const [viewport, setViewport] = useState2(null);
   const items = useAtomValue2(model.columns);
   return /* @__PURE__ */ React4.createElement("div", {
-    ref: forwardedRef,
-    className: mx3("flex h-full w-full overflow-hidden", classNames)
+    role: "none",
+    ...rest,
+    className: mx3("dx-container", className),
+    ref: forwardedRef
   }, /* @__PURE__ */ React4.createElement(Focus.Group, {
     asChild: true,
     orientation: "horizontal"