@adea-ai/ui 0.103.1 → 0.104.1

package/dist/components/layout/split-layout/split-layout.js.map

@@ -1 +1 @@
-{"version":3,"file":"split-layout.js","names":["Resizable","For","createMemo","createComputed","createUniqueId","createSignal","onCleanup","on","Accessor","JSX","X","GripVertical","Button","cn","computeLayoutFrames","LayoutRect","paneDropIntent","PaneDropIntent","PANE_DRAG_TYPE","listLeaves","MIN_SPLIT_RATIO","MAX_SPLIT_RATIO","SplitLayoutBranch","SplitLayoutLeaf","SplitLayoutState","SplitLayoutProps","state","L","label","labelForLeaf","leaf","renderLeaf","Element","renderPaneLabel","paneTabIndex","labelForSeparator","branch","onResize","splitId","ratio","onFocus","leafId","onClose","onMove","targetId","intent","renderPaneActions","class","rectStyle","rect","CSSProperties","left","x","top","y","width","height","SplitLayout","props","root","HTMLDivElement","pendingFrame","refs","Map","HTMLElement","domIds","prefix","nextDomId","nextDragId","drag","setDrag","id","token","drop","setDrop","clearDrag","undefined","domId","existing","get","created","set","leaves","center","leafMap","map","frames","branches","Array","from","values","flatMap","frame","node","kind","current","has","target","allowedTarget","transfer","DataTransfer","types","includes","dropLabel","placement","branchMap","schedule","action","cancelAnimationFrame","requestAnimationFrame","active","ownerDocument","activeElement","contains","field","HTMLTextAreaElement","HTMLInputElement","selection","start","selectionStart","end","selectionEnd","direction","selectionDirection","isConnected","body","focus","preventScroll","setSelectionRange","clear","close","next","_el$","_tmpl$","_el$2","firstChild","_$use","el","_$insert","_$createComponent","each","children","initial","content","paneLabel","actions","delete","_el$3","_tmpl$2","_el$4","_el$5","_el$6","_el$7","nextSibling","$$focusin","addEventListener","event","dataTransfer","clientX","clientY","currentTarget","getBoundingClientRect","accepted","getData","preventDefault","relatedTarget","Node","dropEffect","_$setAttribute","setData","effectAllowed","source","setDragImage","Math","max","round","_c$","_$memo","_c$2","variant","size","aria-label","onClick","_c$3","_el$8","_tmpl$3","_$effect","_$className","_p$","_v$4","_v$5","_v$6","_v$7","focusedLeafId","_v$8","_v$9","_v$0","_v$1","_v$10","Boolean","_v$11","_v$12","e","t","a","o","i","n","s","h","_$style","r","d","l","orientation","sizes","keyboardDelta","onSizesChange","getClientRects","length","some","Number","isFinite","abs","style","Panel","minSize","maxSize","Handle","aria-orientation","aria-controls","join","aria-valuenow","_v$","_v$2","_v$3","_$delegateEvents","_$createComponent","_$memo","_$className","_$setAttribute","_$style","_$delegateEvents"],"sources":["../../../../src/components/layout/split-layout/split-layout.tsx"],"sourcesContent":["import Resizable from '@corvu/resizable'\nimport {\n  For,\n  createMemo,\n  createComputed,\n  createUniqueId,\n  createSignal,\n  onCleanup,\n  on,\n  type Accessor,\n  type JSX,\n} from 'solid-js'\nimport { X, GripVertical } from 'lucide-solid'\nimport { Button } from '../../ui/button'\nimport { cn } from '#lib/utils'\nimport { computeLayoutFrames, type LayoutRect } from './geometry'\nimport { paneDropIntent, type PaneDropIntent } from './drop'\nexport type { PaneDropIntent } from './drop'\nconst PANE_DRAG_TYPE = 'application/x-adea-pane-move'\nimport {\n  listLeaves,\n  MIN_SPLIT_RATIO,\n  MAX_SPLIT_RATIO,\n  type SplitLayoutBranch,\n  type SplitLayoutLeaf,\n  type SplitLayoutState,\n} from './model'\n\nexport type SplitLayoutProps<L extends SplitLayoutLeaf> = {\n  state: SplitLayoutState<L>\n  label: string\n  /** Accessible name for a pane region and its close button. */\n  labelForLeaf: (leaf: L) => string\n  /** Called once per stable leaf owner; the accessor tracks opaque payload replacement. */\n  renderLeaf: (leaf: Accessor<L>) => JSX.Element\n  /** Inline visible header composition, separate from the region and close-button name. */\n  renderPaneLabel?: (leaf: Accessor<L>) => JSX.Element\n  /** Whether pane regions participate in sequential keyboard navigation; defaults to programmatic focus only. */\n  paneTabIndex?: 0 | -1\n  /** Accessible splitter name; defaults to the current orientation-specific label. */\n  labelForSeparator?: (branch: SplitLayoutBranch<L>) => string\n  onResize: (splitId: string, ratio: number) => void\n  onFocus?: (leafId: string) => void\n  /** Host performs the model transition and returns the surviving focus destination. */\n  onClose?: (leafId: string) => string | undefined\n  /** Pointer placement only; the host supplies keyboard commands and performs the model transition. */\n  onMove?: (leafId: string, targetId: string, intent: PaneDropIntent) => void\n  /** Stable header composition for host-owned keyboard actions/capability feedback. */\n  renderPaneActions?: (leaf: Accessor<L>) => JSX.Element\n  class?: string\n}\nfunction rectStyle(rect: LayoutRect): JSX.CSSProperties {\n  return {\n    left: `${rect.x * 100}%`,\n    top: `${rect.y * 100}%`,\n    width: `${rect.width * 100}%`,\n    height: `${rect.height * 100}%`,\n  }\n}\n/** Muxy frame geometry keeps leaf owners stable; Corvu owns constrained separator interactions. */\nexport function SplitLayout<L extends SplitLayoutLeaf>(props: SplitLayoutProps<L>) {\n  let root: HTMLDivElement | undefined\n  let pendingFrame: number | undefined\n  const refs = new Map<string, HTMLElement>()\n  const domIds = new Map<string, string>()\n  const prefix = createUniqueId()\n  let nextDomId = 0\n  let nextDragId = 0\n  const [drag, setDrag] = createSignal<{ id: string; token: string }>()\n  const [drop, setDrop] = createSignal<{ id: string; intent: PaneDropIntent }>()\n  const clearDrag = () => {\n    setDrag(undefined)\n    setDrop(undefined)\n  }\n  const domId = (id: string) => {\n    const existing = domIds.get(id)\n    if (existing) return existing\n    const created = `${prefix}-pane-${nextDomId++}`\n    domIds.set(id, created)\n    return created\n  }\n  const leaves = createMemo(() => listLeaves(props.state.center))\n  const leafMap = createMemo(() => new Map(leaves().map((leaf) => [leaf.id, leaf])))\n  const frames = createMemo(() => computeLayoutFrames(props.state.center))\n  const branches = createMemo(() =>\n    Array.from(frames().values()).flatMap((frame) =>\n      frame.node.kind === 'split' ? [frame.node] : []\n    )\n  )\n  createComputed(() => {\n    const current = drag()\n    if (current && (!props.onMove || !leafMap().has(current.id))) clearDrag()\n    const target = drop()\n    if (target && !leafMap().has(target.id)) setDrop(undefined)\n  })\n  const allowedTarget = (id: string, transfer: DataTransfer | null) => {\n    const current = drag()\n    return props.onMove &&\n      current &&\n      current.id !== id &&\n      leafMap().has(current.id) &&\n      leafMap().has(id) &&\n      transfer?.types.includes(PANE_DRAG_TYPE)\n      ? current\n      : undefined\n  }\n  const dropLabel = createMemo(() => {\n    const target = drop()\n    const leaf = target ? leafMap().get(target.id) : undefined\n    return target && leaf\n      ? `Drop to place pane ${target.intent.placement} ${props.labelForLeaf(leaf)}`\n      : ''\n  })\n  const branchMap = createMemo(() => new Map(branches().map((branch) => [branch.id, branch])))\n  const schedule = (action: () => void) => {\n    if (pendingFrame !== undefined) cancelAnimationFrame(pendingFrame)\n    pendingFrame = requestAnimationFrame(() => {\n      pendingFrame = undefined\n      action()\n    })\n  }\n  // Register before keyed children update: capture a focused editor before an\n  // ordered DOM move can blur it. Never override a newer focus outside this root.\n  createComputed(\n    on(\n      () => props.state.center,\n      () => {\n        const active = root?.ownerDocument.activeElement\n        if (!root || !(active instanceof HTMLElement) || !root.contains(active)) return\n        const field =\n          active instanceof HTMLTextAreaElement || active instanceof HTMLInputElement\n            ? active\n            : undefined\n        const selection = field\n          ? {\n              start: field.selectionStart,\n              end: field.selectionEnd,\n              direction: field.selectionDirection,\n            }\n          : undefined\n        schedule(() => {\n          if (!active.isConnected || !root?.contains(active)) return\n          const current = active.ownerDocument.activeElement\n          if (current !== active && current !== active.ownerDocument.body) return\n          active.focus({ preventScroll: true })\n          if (field && selection?.start !== null && selection?.end !== null && selection)\n            field.setSelectionRange(\n              selection.start,\n              selection.end,\n              selection.direction ?? undefined\n            )\n        })\n      }\n    )\n  )\n  onCleanup(() => {\n    if (pendingFrame !== undefined) cancelAnimationFrame(pendingFrame)\n    clearDrag()\n    refs.clear()\n    domIds.clear()\n  })\n  const close = (id: string) => {\n    const next = props.onClose?.(id)\n    if (next) schedule(() => refs.get(next)?.focus({ preventScroll: true }))\n  }\n  return (\n    <div\n      ref={(el) => {\n        root = el\n      }}\n      role=\"group\"\n      aria-label={props.label}\n      data-slot=\"split-layout\"\n      data-dragging={drag() ? '' : undefined}\n      class={cn('relative size-full min-h-0 min-w-0 data-[dragging]:cursor-grabbing', props.class)}\n    >\n      <For each={leaves().map((leaf) => leaf.id)}>\n        {(id) => {\n          const initial = leafMap().get(id)!\n          const leaf = () => leafMap().get(id) ?? initial\n          const content = props.renderLeaf(leaf)\n          const paneLabel = props.renderPaneLabel?.(leaf)\n          const actions = props.renderPaneActions?.(leaf)\n          const intent = () => (drop()?.id === id ? drop()?.intent : undefined)\n          onCleanup(() => {\n            refs.delete(id)\n            domIds.delete(id)\n          })\n          return (\n            <section\n              ref={(el) => refs.set(id, el)}\n              id={domId(id)}\n              role=\"region\"\n              aria-label={props.labelForLeaf(leaf())}\n              tabIndex={props.paneTabIndex ?? -1}\n              data-pane-id={id}\n              data-focused={props.state.focusedLeafId === id ? '' : undefined}\n              data-drag-source={drag()?.id === id ? '' : undefined}\n              data-drop-direction={intent()?.direction}\n              data-drop-placement={intent()?.placement}\n              onDragOver={(event) => {\n                if (!allowedTarget(id, event.dataTransfer)) return\n                const next = paneDropIntent(\n                  event.clientX,\n                  event.clientY,\n                  event.currentTarget.getBoundingClientRect()\n                )\n                if (!next) {\n                  setDrop(undefined)\n                  return\n                }\n                event.preventDefault()\n                if (event.dataTransfer) event.dataTransfer.dropEffect = 'move'\n                setDrop({ id, intent: next })\n              }}\n              onDragLeave={(event) => {\n                if (\n                  event.relatedTarget instanceof Node &&\n                  event.currentTarget.contains(event.relatedTarget)\n                )\n                  return\n                if (drop()?.id === id) setDrop(undefined)\n              }}\n              onDrop={(event) => {\n                const current = allowedTarget(id, event.dataTransfer)\n                const next = paneDropIntent(\n                  event.clientX,\n                  event.clientY,\n                  event.currentTarget.getBoundingClientRect()\n                )\n                const accepted =\n                  current && next && event.dataTransfer?.getData(PANE_DRAG_TYPE) === current.token\n                clearDrag()\n                if (!accepted) return\n                event.preventDefault()\n                props.onMove?.(current.id, id, next)\n              }}\n              style={rectStyle(frames().get(id)?.rect ?? { x: 0, y: 0, width: 0, height: 0 })}\n              class=\"absolute flex min-h-0 min-w-0 flex-col overflow-hidden border border-border transition-opacity data-[drag-source]:opacity-40 data-[focused]:border-primary bg-background text-foreground focus-visible:outline focus-visible:outline-2 focus-visible:outline-ring\"\n              onFocusIn={() => props.onFocus?.(id)}\n            >\n              <header class=\"flex min-w-0 shrink-0 items-center gap-2 bg-surface px-2\">\n                <span\n                  data-pane-drag-handle=\"\"\n                  draggable={Boolean(props.onMove)}\n                  class={cn('flex min-w-0 flex-1 items-center gap-2 truncate text-sm', {\n                    'cursor-grab': Boolean(props.onMove),\n                  })}\n                  title={props.onMove ? `Drag ${props.labelForLeaf(leaf())} to move` : undefined}\n                  onDragStart={(event) => {\n                    if (!props.onMove || !event.dataTransfer) {\n                      event.preventDefault()\n                      return\n                    }\n                    const token = `${prefix}-${++nextDragId}`\n                    setDrag({ id, token })\n                    event.dataTransfer.setData(PANE_DRAG_TYPE, token)\n                    event.dataTransfer.effectAllowed = 'move'\n                    // The ghost is the pane itself, not the handle strip: the\n                    // browser snapshots the region before the drag state dims\n                    // this section, so the dragged pane stays readable while\n                    // its source visibly recedes.\n                    const source = refs.get(id)\n                    const frame = source?.getBoundingClientRect()\n                    if (source && frame && typeof event.dataTransfer.setDragImage === 'function')\n                      event.dataTransfer.setDragImage(\n                        source,\n                        Math.max(0, Math.round(event.clientX - frame.left)),\n                        Math.max(0, Math.round(event.clientY - frame.top))\n                      )\n                  }}\n                  onDragEnd={clearDrag}\n                >\n                  {props.onMove ? (\n                    <GripVertical class=\"size-3 shrink-0\" aria-hidden=\"true\" />\n                  ) : null}\n                  <span class=\"min-w-0 flex-1 truncate\">\n                    {paneLabel ?? props.labelForLeaf(leaf())}\n                  </span>\n                </span>\n                {actions}\n                {props.onClose ? (\n                  <Button\n                    variant=\"ghost\"\n                    size=\"icon-xs\"\n                    aria-label={`Close ${props.labelForLeaf(leaf())}`}\n                    onClick={() => close(id)}\n                  >\n                    <X />\n                  </Button>\n                ) : null}\n              </header>\n              <div class=\"min-h-0 min-w-0 flex-1 overflow-auto\">{content}</div>\n              {intent() ? (\n                <div\n                  aria-hidden=\"true\"\n                  class={cn('pointer-events-none absolute border-2 border-primary bg-primary/10', {\n                    'inset-y-0 left-0 w-1/2':\n                      intent()?.direction === 'row' && intent()?.placement === 'before',\n                    'inset-y-0 right-0 w-1/2':\n                      intent()?.direction === 'row' && intent()?.placement === 'after',\n                    'inset-x-0 top-0 h-1/2':\n                      intent()?.direction === 'column' && intent()?.placement === 'before',\n                    'inset-x-0 bottom-0 h-1/2':\n                      intent()?.direction === 'column' && intent()?.placement === 'after',\n                  })}\n                />\n              ) : null}\n            </section>\n          )\n        }}\n      </For>\n      <span class=\"sr-only\" role=\"status\">\n        {dropLabel()}\n      </span>\n      <For each={branches().map((branch) => branch.id)}>\n        {(id) => {\n          const initial = branchMap().get(id)!\n          const branch: Accessor<SplitLayoutBranch<L>> = () => branchMap().get(id) ?? initial\n          return (\n            <Resizable\n              orientation={branch().direction === 'row' ? 'horizontal' : 'vertical'}\n              sizes={[branch().ratio, 1 - branch().ratio]}\n              keyboardDelta={0.05}\n              onSizesChange={(sizes) => {\n                // Corvu also reports panel registration/unregistration while\n                // mounting or disposing a controller. Those incomplete or\n                // hidden-host sizes are not user resize intent.\n                if (!root?.isConnected || root.getClientRects().length === 0) return\n                if (\n                  sizes.length !== 2 ||\n                  sizes.some((size) => !Number.isFinite(size)) ||\n                  Math.abs(sizes[0]! + sizes[1]! - 1) > 0.000001\n                )\n                  return\n                if (sizes[0] !== undefined && Math.abs(sizes[0] - branch().ratio) > 0.000001)\n                  props.onResize(id, sizes[0])\n              }}\n              style={rectStyle(frames().get(id)?.rect ?? { x: 0, y: 0, width: 0, height: 0 })}\n              class=\"pointer-events-none absolute flex min-h-0 min-w-0 data-[orientation=vertical]:flex-col\"\n            >\n              <Resizable.Panel\n                minSize={MIN_SPLIT_RATIO}\n                maxSize={MAX_SPLIT_RATIO}\n                aria-hidden=\"true\"\n              />\n              <Resizable.Handle\n                aria-label={\n                  props.labelForSeparator?.(branch()) ??\n                  (branch().direction === 'row' ? 'Resize pane columns' : 'Resize pane rows')\n                }\n                aria-orientation={branch().direction === 'row' ? 'vertical' : 'horizontal'}\n                aria-controls={listLeaves(branch())\n                  .map((leaf) => domId(leaf.id))\n                  .join(' ')}\n                aria-valuemin={10}\n                aria-valuemax={90}\n                aria-valuenow={Math.round(branch().ratio * 100)}\n                class=\"pointer-events-auto relative w-px shrink-0 bg-border after:absolute after:inset-y-0 after:-inset-x-1 after:w-3 focus-visible:bg-primary focus-visible:outline-none hover:bg-primary data-[orientation=vertical]:h-px data-[orientation=vertical]:w-full data-[orientation=vertical]:after:inset-x-0 data-[orientation=vertical]:after:-inset-y-1 data-[orientation=vertical]:after:h-3 data-[orientation=vertical]:after:w-full\"\n              />\n              <Resizable.Panel\n                minSize={MIN_SPLIT_RATIO}\n                maxSize={MAX_SPLIT_RATIO}\n                aria-hidden=\"true\"\n              />\n            </Resizable>\n          )\n        }}\n      </For>\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;AAkBA,IAAMkB,iBAAiB;AAiCvB,SAAS8B,UAAUC,MAAqC;CACtD,OAAO;EACLE,MAAM,GAAGF,KAAKG,IAAI,IAAG;EACrBC,KAAK,GAAGJ,KAAKK,IAAI,IAAG;EACpBC,OAAO,GAAGN,KAAKM,QAAQ,IAAG;EAC1BC,QAAQ,GAAGP,KAAKO,SAAS,IAAG;CAC9B;AACF;;AAEA,SAAgBC,YAAuCC,OAA4B;CACjF,IAAIC;CACJ,IAAIE;CACJ,MAAMC,uBAAO,IAAIC,IAAyB;CAC1C,MAAME,yBAAS,IAAIF,IAAoB;CACvC,MAAMG,SAAS9D,eAAe;CAC9B,IAAI+D,YAAY;CAChB,IAAIC,aAAa;CACjB,MAAM,CAACC,MAAMC,WAAWjE,aAA4C;CACpE,MAAM,CAACoE,MAAMC,WAAWrE,aAAqD;CAC7E,MAAMsE,kBAAkB;EACtBL,QAAQM,KAAAA,CAAS;EACjBF,QAAQE,KAAAA,CAAS;CACnB;CACA,MAAMC,SAASN,OAAe;EAC5B,MAAMO,WAAWb,OAAOc,IAAIR,EAAE;EAC9B,IAAIO,UAAU,OAAOA;EACrB,MAAME,UAAU,GAAGd,OAAM,QAASC;EAClCF,OAAOgB,IAAIV,IAAIS,OAAO;EACtB,OAAOA;CACT;CACA,MAAME,SAAShF,iBAAiBiB,WAAWuC,MAAMhC,MAAMyD,MAAM,CAAC;CAC9D,MAAMC,UAAUlF,iBAAiB,IAAI6D,IAAImB,OAAO,CAAC,CAACG,KAAKvD,SAAS,CAACA,KAAKyC,IAAIzC,IAAI,CAAC,CAAC,CAAC;CACjF,MAAMwD,SAASpF,iBAAiBY,oBAAoB4C,MAAMhC,MAAMyD,MAAM,CAAC;CACvE,MAAMI,WAAWrF,iBACfsF,MAAMC,KAAKH,OAAO,CAAC,CAACI,OAAO,CAAC,CAAC,CAACC,SAASC,UACrCA,MAAMC,KAAKC,SAAS,UAAU,CAACF,MAAMC,IAAI,IAAI,CAAA,CAC/C,CACF;CACA1F,qBAAqB;EACnB,MAAM4F,UAAU1B,KAAK;EACrB,IAAI0B,YAAY,CAACrC,MAAMf,UAAU,CAACyC,QAAQ,CAAC,CAACY,IAAID,QAAQxB,EAAE,IAAII,UAAU;EACxE,MAAMsB,SAASxB,KAAK;EACpB,IAAIwB,UAAU,CAACb,QAAQ,CAAC,CAACY,IAAIC,OAAO1B,EAAE,GAAGG,QAAQE,KAAAA,CAAS;CAC5D,CAAC;CACD,MAAMsB,iBAAiB3B,IAAY4B,aAAkC;EACnE,MAAMJ,UAAU1B,KAAK;EACrB,OAAOX,MAAMf,UACXoD,WACAA,QAAQxB,OAAOA,MACfa,QAAQ,CAAC,CAACY,IAAID,QAAQxB,EAAE,KACxBa,QAAQ,CAAC,CAACY,IAAIzB,EAAE,KAChB4B,UAAUE,MAAMC,SAASpF,cAAc,IACrC6E,UACAnB,KAAAA;CACN;CACA,MAAM2B,YAAYrG,iBAAiB;EACjC,MAAM+F,SAASxB,KAAK;EACpB,MAAM3C,OAAOmE,SAASb,QAAQ,CAAC,CAACL,IAAIkB,OAAO1B,EAAE,IAAIK,KAAAA;EACjD,OAAOqB,UAAUnE,OACb,sBAAsBmE,OAAOpD,OAAO2D,UAAS,GAAI9C,MAAM7B,aAAaC,IAAI,MACxE;CACN,CAAC;CACD,MAAM2E,YAAYvG,iBAAiB,IAAI6D,IAAIwB,SAAS,CAAC,CAACF,KAAKjD,WAAW,CAACA,OAAOmC,IAAInC,MAAM,CAAC,CAAC,CAAC;CAC3F,MAAMsE,YAAYC,WAAuB;EACvC,IAAI9C,iBAAiBe,KAAAA,GAAWgC,qBAAqB/C,YAAY;EACjEA,eAAegD,4BAA4B;GACzChD,eAAee,KAAAA;GACf+B,OAAO;EACT,CAAC;CACH;CAGAxG,eACEI,SACQmD,MAAMhC,MAAMyD,cACZ;EACJ,MAAM2B,SAASnD,MAAMoD,cAAcC;EACnC,IAAI,CAACrD,QAAQ,EAAEmD,kBAAkB9C,gBAAgB,CAACL,KAAKsD,SAASH,MAAM,GAAG;EACzE,MAAMI,QACJJ,kBAAkBK,uBAAuBL,kBAAkBM,mBACvDN,SACAlC,KAAAA;EACN,MAAMyC,YAAYH,QACd;GACEI,OAAOJ,MAAMK;GACbC,KAAKN,MAAMO;GACXC,WAAWR,MAAMS;EACnB,IACA/C,KAAAA;EACJ8B,eAAe;GACb,IAAI,CAACI,OAAOc,eAAe,CAACjE,MAAMsD,SAASH,MAAM,GAAG;GACpD,MAAMf,UAAUe,OAAOC,cAAcC;GACrC,IAAIjB,YAAYe,UAAUf,YAAYe,OAAOC,cAAcc,MAAM;GACjEf,OAAOgB,MAAM,EAAEC,eAAe,KAAK,CAAC;GACpC,IAAIb,SAASG,WAAWC,UAAU,QAAQD,WAAWG,QAAQ,QAAQH,WACnEH,MAAMc,kBACJX,UAAUC,OACVD,UAAUG,KACVH,UAAUK,aAAa9C,KAAAA,CACzB;EACJ,CAAC;CACH,CACF,CACF;CACAtE,gBAAgB;EACd,IAAIuD,iBAAiBe,KAAAA,GAAWgC,qBAAqB/C,YAAY;EACjEc,UAAU;EACVb,KAAKmE,MAAM;EACXhE,OAAOgE,MAAM;CACf,CAAC;CACD,MAAMC,SAAS3D,OAAe;EAC5B,MAAM4D,OAAOzE,MAAMhB,UAAU6B,EAAE;EAC/B,IAAI4D,MAAMzB,eAAe5C,KAAKiB,IAAIoD,IAAI,CAAC,EAAEL,MAAM,EAAEC,eAAe,KAAK,CAAC,CAAC;CACzE;CACA,cAAA;EAAA,IAAAK,OAAAC,OAAA,GAAAC,QAAAF,KAAAG;EAAAC,KAEUC,OAAO;GACX9E,OAAO8E;EACT,GAACL,IAAA;EAAAM,OAAAN,MAAAO,gBAOA1I,KAAG;GAAA,IAAC2I,OAAI;IAAA,OAAE1D,OAAO,CAAC,CAACG,KAAKvD,SAASA,KAAKyC,EAAE;GAAC;GAAAsE,WACtCtE,OAAO;IACP,MAAMuE,UAAU1D,QAAQ,CAAC,CAACL,IAAIR,EAAE;IAChC,MAAMzC,aAAasD,QAAQ,CAAC,CAACL,IAAIR,EAAE,KAAKuE;IACxC,MAAMC,UAAUrF,MAAM3B,WAAWD,IAAI;IACrC,MAAMkH,YAAYtF,MAAMzB,kBAAkBH,IAAI;IAC9C,MAAMmH,UAAUvF,MAAMZ,oBAAoBhB,IAAI;IAC9C,MAAMe,eAAgB4B,KAAK,CAAC,EAAEF,OAAOA,KAAKE,KAAK,CAAC,EAAE5B,SAAS+B,KAAAA;IAC3DtE,gBAAgB;KACdwD,KAAKoF,OAAO3E,EAAE;KACdN,OAAOiF,OAAO3E,EAAE;IAClB,CAAC;IACD,cAAA;KAAA,IAAA4E,QAAAC,QAAA,GAAAC,QAAAF,MAAAZ,YAAAe,QAAAD,MAAAd,YAAAgB,QAAAD,MAAAf,YAAAiB,QAAAH,MAAAI;KAAAN,MAAAO,kBAmDqBhG,MAAMlB,UAAU+B,EAAE;KAAC4E,MAAAQ,iBAAA,SAhB3BC,UAAU;MACjB,MAAM7D,UAAUG,cAAc3B,IAAIqF,MAAMC,YAAY;MACpD,MAAM1B,OAAOnH,eACX4I,MAAME,SACNF,MAAMG,SACNH,MAAMI,cAAcC,sBAAsB,CAC5C;MACA,MAAMC,WACJnE,WAAWoC,QAAQyB,MAAMC,cAAcM,QAAQjJ,cAAc,MAAM6E,QAAQvB;MAC7EG,UAAU;MACV,IAAI,CAACuF,UAAU;MACfN,MAAMQ,eAAe;MACrB1G,MAAMf,SAASoD,QAAQxB,IAAIA,IAAI4D,IAAI;KACrC,CAAC;KAAAgB,MAAAQ,iBAAA,cArBaC,UAAU;MACtB,IACEA,MAAMS,yBAAyBC,QAC/BV,MAAMI,cAAc/C,SAAS2C,MAAMS,aAAa,GAEhD;MACF,IAAI5F,KAAK,CAAC,EAAEF,OAAOA,IAAIG,QAAQE,KAAAA,CAAS;KAC1C,CAAC;KAAAuE,MAAAQ,iBAAA,aAtBYC,UAAU;MACrB,IAAI,CAAC1D,cAAc3B,IAAIqF,MAAMC,YAAY,GAAG;MAC5C,MAAM1B,OAAOnH,eACX4I,MAAME,SACNF,MAAMG,SACNH,MAAMI,cAAcC,sBAAsB,CAC5C;MACA,IAAI,CAAC9B,MAAM;OACTzD,QAAQE,KAAAA,CAAS;OACjB;MACF;MACAgF,MAAMQ,eAAe;MACrB,IAAIR,MAAMC,cAAcD,MAAMC,aAAaU,aAAa;MACxD7F,QAAQ;OAAEH;OAAI1B,QAAQsF;MAAK,CAAC;KAC9B,CAAC;KAAAK,KAxBKC,OAAO3E,KAAKmB,IAAIV,IAAIkE,EAAE,GAACU,KAAA;KAAAqB,aAAArB,OAAA,gBAKf5E,EAAE;KAAA+E,MAAAK,iBAAA,WA4EDhF,SAAS;KAAA2E,MAAAK,iBAAA,cAtBNC,UAAU;MACtB,IAAI,CAAClG,MAAMf,UAAU,CAACiH,MAAMC,cAAc;OACxCD,MAAMQ,eAAe;OACrB;MACF;MACA,MAAM5F,QAAQ,GAAGN,OAAM,GAAI,EAAEE;MAC7BE,QAAQ;OAAEC;OAAIC;MAAM,CAAC;MACrBoF,MAAMC,aAAaY,QAAQvJ,gBAAgBsD,KAAK;MAChDoF,MAAMC,aAAaa,gBAAgB;MAKnC,MAAMC,SAAS7G,KAAKiB,IAAIR,EAAE;MAC1B,MAAMqB,QAAQ+E,QAAQV,sBAAsB;MAC5C,IAAIU,UAAU/E,SAAS,OAAOgE,MAAMC,aAAae,iBAAiB,YAChEhB,MAAMC,aAAae,aACjBD,QACAE,KAAKC,IAAI,GAAGD,KAAKE,MAAMnB,MAAME,UAAUlE,MAAMzC,IAAI,CAAC,GAClD0H,KAAKC,IAAI,GAAGD,KAAKE,MAAMnB,MAAMG,UAAUnE,MAAMvC,GAAG,CAAC,CACnD;KACJ,CAAC;KAAAqF,OAAAY,cAAA;MAAA,IAAA0B,MAAAC,WAAA,CAAA,CAGAvH,MAAMf,MAAM;MAAA,aAAZqI,IAAA,IAAArC,gBACEhI,cAAY;OAAA,SAAA;OAAA,eAAA;MAAA,CAAA,IACX;KAAI,EAAA,CAAA,GAAA4I,KAAA;KAAAb,OAAAa,aAELP,aAAatF,MAAM7B,aAAaC,KAAK,CAAC,CAAC;KAAA4G,OAAAW,OAG3CJ,SAAO,IAAA;KAAAP,OAAAW,cAAA;MAAA,IAAA6B,OAAAD,WAAA,CAAA,CACPvH,MAAMhB,OAAO;MAAA,aAAbwI,KAAA,IAAAvC,gBACE/H,QAAM;OACLuK,SAAO;OACPC,MAAI;OAAA,KAAA,gBAAA;QAAA,OACQ,SAAS1H,MAAM7B,aAAaC,KAAK,CAAC;OAAG;OACjDwJ,eAAepD,MAAM3D,EAAE;OAAC,IAAAsE,WAAA;QAAA,OAAAF,gBAEvBjI,GAAC,CAAA,CAAA;OAAA;MAAA,CAAA,IAEF;KAAI,EAAA,CAAA,GAAA,IAAA;KAAAgI,OAAAc,OAEyCT,OAAO;KAAAL,OAAAS,cAAA;MAAA,IAAAoC,OAAAN,WAAA,CAAA,CACzDpI,OAAO,CAAC;MAAA,aAAR0I,KAAA,WAAA;OAAA,IAAAC,QAAAC,QAAA;OAAAC,aAAAC,UAAAH,OAGU3K,GAAG,sEAAsE;QAC9E,0BACEgC,OAAO,CAAC,EAAE6E,cAAc,SAAS7E,OAAO,CAAC,EAAE2D,cAAc;QAC3D,2BACE3D,OAAO,CAAC,EAAE6E,cAAc,SAAS7E,OAAO,CAAC,EAAE2D,cAAc;QAC3D,yBACE3D,OAAO,CAAC,EAAE6E,cAAc,YAAY7E,OAAO,CAAC,EAAE2D,cAAc;QAC9D,4BACE3D,OAAO,CAAC,EAAE6E,cAAc,YAAY7E,OAAO,CAAC,EAAE2D,cAAc;OAChE,CAAC,CAAC,CAAA;OAAA,OAAAgF;MAAA,EAAA,CAAA,IAEF;KAAI,EAAA,CAAA,GAAA,IAAA;KAAAE,QAAAE,QAAA;MAAA,IAAAC,OApHJhH,MAAMN,EAAE,GAACuH,OAEDpI,MAAM7B,aAAaC,KAAK,CAAC,GAACiK,OAC5BrI,MAAMxB,gBAAgB,IAAE8J,OAEpBtI,MAAMhC,MAAMuK,kBAAkB1H,KAAK,KAAKK,KAAAA,GAASsH,OAC7C7H,KAAK,CAAC,EAAEE,OAAOA,KAAK,KAAKK,KAAAA,GAASuH,OAC/BtJ,OAAO,CAAC,EAAE6E,WAAS0E,OACnBvJ,OAAO,CAAC,EAAE2D,WAAS6F,OAsCjCrJ,UAAUsC,OAAO,CAAC,CAACP,IAAIR,EAAE,CAAC,EAAEtB,QAAQ;OAAEG,GAAG;OAAGE,GAAG;OAAGC,OAAO;OAAGC,QAAQ;MAAE,CAAC,GAAC8I,QAOhEC,QAAQ7I,MAAMf,MAAM,GAAC6J,QACzB3L,GAAG,2DAA2D,EACnE,eAAe0L,QAAQ7I,MAAMf,MAAM,EACrC,CAAC,GAAC8J,QACK/I,MAAMf,SAAS,QAAQe,MAAM7B,aAAaC,KAAK,CAAC,EAAC,YAAa8C,KAAAA;MAASiH,SAAAD,IAAAc,KAAAlC,aAAArB,OAAA,MAAAyC,IAAAc,IAAAb,IAAA;MAAAC,SAAAF,IAAAe,KAAAnC,aAAArB,OAAA,cAAAyC,IAAAe,IAAAb,IAAA;MAAAC,SAAAH,IAAAgB,KAAApC,aAAArB,OAAA,YAAAyC,IAAAgB,IAAAb,IAAA;MAAAC,SAAAJ,IAAAiB,KAAArC,aAAArB,OAAA,gBAAAyC,IAAAiB,IAAAb,IAAA;MAAAE,SAAAN,IAAAkB,KAAAtC,aAAArB,OAAA,oBAAAyC,IAAAkB,IAAAZ,IAAA;MAAAC,SAAAP,IAAAmB,KAAAvC,aAAArB,OAAA,uBAAAyC,IAAAmB,IAAAZ,IAAA;MAAAC,SAAAR,IAAAoB,KAAAxC,aAAArB,OAAA,uBAAAyC,IAAAoB,IAAAZ,IAAA;MAAAR,IAAAqB,IAAAC,MAAA/D,OAAAkD,MAAAT,IAAAqB,CAAA;MAAAX,UAAAV,IAAAuB,KAAA3C,aAAAlB,OAAA,aAAAsC,IAAAuB,IAAAb,KAAA;MAAAE,UAAAZ,IAAAwB,KAAAzB,UAAArC,OAAAsC,IAAAwB,IAAAZ,KAAA;MAAAC,UAAAb,IAAAyB,KAAA7C,aAAAlB,OAAA,SAAAsC,IAAAyB,IAAAZ,KAAA;MAAA,OAAAb;KAAA,GAAA;MAAAc,GAAA9H,KAAAA;MAAA+H,GAAA/H,KAAAA;MAAAgI,GAAAhI,KAAAA;MAAAiI,GAAAjI,KAAAA;MAAAkI,GAAAlI,KAAAA;MAAAmI,GAAAnI,KAAAA;MAAAoI,GAAApI,KAAAA;MAAAqI,GAAArI,KAAAA;MAAAuI,GAAAvI,KAAAA;MAAAwI,GAAAxI,KAAAA;MAAAyI,GAAAzI,KAAAA;KAAA,CAAA;KAAA,OAAAuE;IAAA,EAAA,CAAA;GA8DxF;EAAC,CAAA,GAAAb,KAAA;EAAAI,OAAAJ,OAGA/B,SAAS;EAAAmC,OAAAN,MAAAO,gBAEX1I,KAAG;GAAA,IAAC2I,OAAI;IAAA,OAAErD,SAAS,CAAC,CAACF,KAAKjD,WAAWA,OAAOmC,EAAE;GAAC;GAAAsE,WAC5CtE,OAAO;IACP,MAAMuE,UAAUrC,UAAU,CAAC,CAAC1B,IAAIR,EAAE;IAClC,MAAMnC,eAA+CqE,UAAU,CAAC,CAAC1B,IAAIR,EAAE,KAAKuE;IAC5E,OAAAH,gBACG3I,WAAS;KAAA,IACRsN,cAAW;MAAA,OAAElL,OAAO,CAAC,CAACsF,cAAc,QAAQ,eAAe;KAAU;KAAA,IACrE6F,QAAK;MAAA,OAAE,CAACnL,OAAO,CAAC,CAACG,OAAO,IAAIH,OAAO,CAAC,CAACG,KAAK;KAAC;KAC3CiL,eAAe;KACfC,gBAAgBF,UAAU;MAIxB,IAAI,CAAC5J,MAAMiE,eAAejE,KAAK+J,eAAe,CAAC,CAACC,WAAW,GAAG;MAC9D,IACEJ,MAAMI,WAAW,KACjBJ,MAAMK,MAAMxC,SAAS,CAACyC,OAAOC,SAAS1C,IAAI,CAAC,KAC3CP,KAAKkD,IAAIR,MAAM,KAAMA,MAAM,KAAM,CAAC,IAAI,MAEtC;MACF,IAAIA,MAAM,OAAO3I,KAAAA,KAAaiG,KAAKkD,IAAIR,MAAM,KAAKnL,OAAO,CAAC,CAACG,KAAK,IAAI,MAClEmB,MAAMrB,SAASkC,IAAIgJ,MAAM,EAAE;KAC/B;KAAC,IACDS,QAAK;MAAA,OAAEhL,UAAUsC,OAAO,CAAC,CAACP,IAAIR,EAAE,CAAC,EAAEtB,QAAQ;OAAEG,GAAG;OAAGE,GAAG;OAAGC,OAAO;OAAGC,QAAQ;MAAE,CAAC;KAAC;KAAA,SAAA;KAAA,IAAAqF,WAAA;MAAA,OAAA;OAAAF,gBAG9E3I,UAAUiO,OAAK;QACdC,SAAS9M;QACT+M,SAAS9M;QAAe,eAAA;OAAA,CAAA;OAAAsH,gBAGzB3I,UAAUoO,QAAM;QAAA,KAAA,gBAAA;SAAA,OAEb1K,MAAMvB,oBAAoBC,OAAO,CAAC,MACjCA,OAAO,CAAC,CAACsF,cAAc,QAAQ,wBAAwB;QAAmB;QAAA,KAAA,sBAAA;SAAA,OAE3DtF,OAAO,CAAC,CAACsF,cAAc,QAAQ,aAAa;QAAY;QAAA,KAAA,mBAAA;SAAA,OAC3DvG,WAAWiB,OAAO,CAAC,CAAC,CAChCiD,KAAKvD,SAAS+C,MAAM/C,KAAKyC,EAAE,CAAC,CAAC,CAC7BgK,KAAK,GAAG;QAAC;QAAA,iBACG;QAAE,iBACF;QAAE,KAAA,mBAAA;SAAA,OACF1D,KAAKE,MAAM3I,OAAO,CAAC,CAACG,QAAQ,GAAG;QAAC;QAAA,SAAA;OAAA,CAAA;OAAAoG,gBAGhD3I,UAAUiO,OAAK;QACdC,SAAS9M;QACT+M,SAAS9M;QAAe,eAAA;OAAA,CAAA;MAAA;KAAA;IAAA,CAAA;GAKhC;EAAC,CAAA,GAAA,IAAA;EAAAqK,QAAAE,QAAA;GAAA,IAAA6C,MApMS/K,MAAM9B,OAAK8M,OAERrK,KAAK,IAAI,KAAKO,KAAAA,GAAS+J,OAC/B9N,GAAG,sEAAsE6C,MAAMX,KAAK;GAAC0L,QAAA7C,IAAAc,KAAAlC,aAAApC,MAAA,cAAAwD,IAAAc,IAAA+B,GAAA;GAAAC,SAAA9C,IAAAe,KAAAnC,aAAApC,MAAA,iBAAAwD,IAAAe,IAAA+B,IAAA;GAAAC,SAAA/C,IAAAgB,KAAAjB,UAAAvD,MAAAwD,IAAAgB,IAAA+B,IAAA;GAAA,OAAA/C;EAAA,GAAA;GAAAc,GAAA9H,KAAAA;GAAA+H,GAAA/H,KAAAA;GAAAgI,GAAAhI,KAAAA;EAAA,CAAA;EAAA,OAAAwD;CAAA,EAAA,CAAA;AAqMlG;AAACwG,eAAA,CAAA,SAAA,CAAA"}
+{"version":3,"file":"split-layout.js","names":["Resizable","For","createMemo","createComputed","createUniqueId","createSignal","onCleanup","on","Accessor","JSX","X","GripVertical","Button","cn","computeLayoutFrames","LayoutRect","paneDropIntent","PaneDropIntent","PANE_DRAG_TYPE","DRAG_PREVIEW_MAX_WIDTH","DRAG_PREVIEW_MAX_HEIGHT","listLeaves","MIN_SPLIT_RATIO","MAX_SPLIT_RATIO","SplitLayoutBranch","SplitLayoutLeaf","SplitLayoutState","SplitLayoutProps","state","L","label","labelForLeaf","leaf","renderLeaf","Element","renderPaneLabel","paneTabIndex","labelForSeparator","branch","onResize","splitId","ratio","onFocus","leafId","onClose","onMove","targetId","intent","renderPaneActions","class","rectStyle","rect","CSSProperties","left","x","top","y","width","height","dragPreviewPlaceholder","source","HTMLElement","message","placeholder","document","createElement","className","getAttribute","setAttribute","localName","textContent","boundedSnapshotSize","sourceWidth","Math","max","sourceHeight","scale","min","round","cloneDragPreviewNode","Node","nodeType","TEXT_NODE","cloneNode","SVGElement","includes","undefined","HTMLImageElement","snapshot","size","naturalWidth","naturalHeight","complete","Error","context","getContext","drawImage","children","createDocumentFragment","child","childNodes","clone","append","length","attribute","removeAttribute","Array","from","attributes","test","name","HTMLCanvasElement","childClone","SplitLayout","props","root","HTMLDivElement","pendingFrame","refs","Map","domIds","prefix","nextDomId","nextDragId","dragPreview","drag","setDrag","id","token","drop","setDrop","clearDrag","remove","createDragPreview","preview","inert","body","domId","existing","get","created","set","leaves","center","leafMap","map","frames","branches","values","flatMap","frame","node","kind","current","has","target","allowedTarget","transfer","DataTransfer","types","dropLabel","placement","branchMap","schedule","action","cancelAnimationFrame","requestAnimationFrame","active","ownerDocument","activeElement","contains","field","HTMLTextAreaElement","HTMLInputElement","selection","start","selectionStart","end","selectionEnd","direction","selectionDirection","isConnected","focus","preventScroll","setSelectionRange","clear","close","next","_el$","_tmpl$","_el$2","firstChild","_$use","el","_$insert","_$createComponent","each","initial","content","paneLabel","actions","delete","_el$3","_tmpl$2","_el$4","_el$5","_el$6","_el$7","nextSibling","$$focusin","addEventListener","event","dataTransfer","clientX","clientY","currentTarget","getBoundingClientRect","accepted","getData","preventDefault","relatedTarget","dropEffect","_$setAttribute","setData","effectAllowed","setDragImage","previewFrame","scaleX","scaleY","_c$","_$memo","_c$2","variant","aria-label","onClick","_c$3","_el$8","_tmpl$3","_$effect","_$className","_p$","_v$4","_v$5","_v$6","_v$7","focusedLeafId","_v$8","_v$9","_v$0","_v$1","_v$10","Boolean","_v$11","_v$12","e","t","a","o","i","n","s","h","_$style","r","d","l","orientation","sizes","keyboardDelta","onSizesChange","getClientRects","some","Number","isFinite","abs","style","Panel","minSize","maxSize","Handle","aria-orientation","aria-controls","join","aria-valuenow","_v$","_v$2","_v$3","_$delegateEvents","_$createComponent","_$memo","_$className","_$setAttribute","_$style","_$delegateEvents"],"sources":["../../../../src/components/layout/split-layout/split-layout.tsx"],"sourcesContent":["import Resizable from '@corvu/resizable'\nimport {\n  For,\n  createMemo,\n  createComputed,\n  createUniqueId,\n  createSignal,\n  onCleanup,\n  on,\n  type Accessor,\n  type JSX,\n} from 'solid-js'\nimport { X, GripVertical } from 'lucide-solid'\nimport { Button } from '../../ui/button'\nimport { cn } from '#lib/utils'\nimport { computeLayoutFrames, type LayoutRect } from './geometry'\nimport { paneDropIntent, type PaneDropIntent } from './drop'\nexport type { PaneDropIntent } from './drop'\nconst PANE_DRAG_TYPE = 'application/x-adea-pane-move'\nconst DRAG_PREVIEW_MAX_WIDTH = 384\nconst DRAG_PREVIEW_MAX_HEIGHT = 256\nimport {\n  listLeaves,\n  MIN_SPLIT_RATIO,\n  MAX_SPLIT_RATIO,\n  type SplitLayoutBranch,\n  type SplitLayoutLeaf,\n  type SplitLayoutState,\n} from './model'\n\nexport type SplitLayoutProps<L extends SplitLayoutLeaf> = {\n  state: SplitLayoutState<L>\n  label: string\n  /** Accessible name for a pane region and its close button. */\n  labelForLeaf: (leaf: L) => string\n  /** Called once per stable leaf owner; the accessor tracks opaque payload replacement. */\n  renderLeaf: (leaf: Accessor<L>) => JSX.Element\n  /** Inline visible header composition, separate from the region and close-button name. */\n  renderPaneLabel?: (leaf: Accessor<L>) => JSX.Element\n  /** Whether pane regions participate in sequential keyboard navigation; defaults to programmatic focus only. */\n  paneTabIndex?: 0 | -1\n  /** Accessible splitter name; defaults to the current orientation-specific label. */\n  labelForSeparator?: (branch: SplitLayoutBranch<L>) => string\n  onResize: (splitId: string, ratio: number) => void\n  onFocus?: (leafId: string) => void\n  /** Host performs the model transition and returns the surviving focus destination. */\n  onClose?: (leafId: string) => string | undefined\n  /** Pointer placement only; the host supplies keyboard commands and performs the model transition. */\n  onMove?: (leafId: string, targetId: string, intent: PaneDropIntent) => void\n  /** Stable header composition for host-owned keyboard actions/capability feedback. */\n  renderPaneActions?: (leaf: Accessor<L>) => JSX.Element\n  class?: string\n}\nfunction rectStyle(rect: LayoutRect): JSX.CSSProperties {\n  return {\n    left: `${rect.x * 100}%`,\n    top: `${rect.y * 100}%`,\n    width: `${rect.width * 100}%`,\n    height: `${rect.height * 100}%`,\n  }\n}\nfunction dragPreviewPlaceholder(source: HTMLElement, message: string) {\n  const placeholder = document.createElement('div')\n  placeholder.className = cn(\n    source.getAttribute('class'),\n    'flex min-h-8 min-w-0 items-center justify-center bg-muted px-2 text-center text-xs text-muted-foreground'\n  )\n  placeholder.setAttribute('data-split-drag-placeholder', source.localName)\n  placeholder.textContent = message\n  return placeholder\n}\nfunction boundedSnapshotSize(width: number, height: number) {\n  const sourceWidth = Math.max(1, width)\n  const sourceHeight = Math.max(1, height)\n  const scale = Math.min(\n    1,\n    DRAG_PREVIEW_MAX_WIDTH / sourceWidth,\n    DRAG_PREVIEW_MAX_HEIGHT / sourceHeight\n  )\n  return {\n    width: Math.max(1, Math.round(sourceWidth * scale)),\n    height: Math.max(1, Math.round(sourceHeight * scale)),\n  }\n}\nfunction cloneDragPreviewNode(source: Node): Node | undefined {\n  if (source.nodeType === Node.TEXT_NODE) return source.cloneNode(false)\n  if (!(source instanceof HTMLElement || source instanceof SVGElement))\n    return source.cloneNode(false)\n\n  if (['script', 'style', 'link', 'source', 'track', 'meta'].includes(source.localName))\n    return undefined\n  if (['iframe', 'video', 'audio', 'object', 'embed'].includes(source.localName))\n    return dragPreviewPlaceholder(\n      source as HTMLElement,\n      'Embedded content unavailable while moving'\n    )\n  if (source instanceof HTMLImageElement) {\n    const snapshot = document.createElement('canvas')\n    const size = boundedSnapshotSize(\n      source.naturalWidth || source.width,\n      source.naturalHeight || source.height\n    )\n    snapshot.width = size.width\n    snapshot.height = size.height\n    snapshot.className = source.getAttribute('class') ?? ''\n    snapshot.setAttribute('data-split-drag-image', '')\n    try {\n      if (!source.complete || source.naturalWidth === 0)\n        throw new Error('image has no decoded pixels')\n      const context = snapshot.getContext('2d')\n      if (!context) throw new Error('canvas snapshot context is unavailable')\n      context.drawImage(source, 0, 0, snapshot.width, snapshot.height)\n      return snapshot\n    } catch {\n      return dragPreviewPlaceholder(source, 'Image preview unavailable')\n    }\n  }\n\n  // Copying a defined custom element can run its constructor; inserting it can\n  // also reconnect a stream or terminal session. Flatten its display tree.\n  if (source instanceof HTMLElement && source.localName.includes('-')) {\n    const children = document.createDocumentFragment()\n    for (const child of source.childNodes) {\n      const clone = cloneDragPreviewNode(child)\n      if (clone) children.append(clone)\n    }\n    return children.childNodes.length > 0\n      ? children\n      : dragPreviewPlaceholder(source, 'Live component preview unavailable while moving')\n  }\n\n  const clone = source.cloneNode(false) as HTMLElement | SVGElement\n  for (const attribute of [\n    'id',\n    'style',\n    'draggable',\n    'data-pane-drag-handle',\n    'data-pane-id',\n    'src',\n    'srcset',\n    'href',\n    'xlink:href',\n    'data',\n    'poster',\n  ])\n    clone.removeAttribute(attribute)\n  for (const attribute of Array.from(clone.attributes))\n    if (/^on/i.test(attribute.name)) clone.removeAttribute(attribute.name)\n\n  if (source instanceof HTMLCanvasElement && clone instanceof HTMLCanvasElement) {\n    const size = boundedSnapshotSize(source.width, source.height)\n    clone.width = size.width\n    clone.height = size.height\n    try {\n      const context = clone.getContext('2d')\n      if (!context) throw new Error('canvas snapshot context is unavailable')\n      context.drawImage(source, 0, 0, clone.width, clone.height)\n    } catch {\n      return dragPreviewPlaceholder(source, 'Canvas preview unavailable while moving')\n    }\n    return clone\n  }\n\n  for (const child of source.childNodes) {\n    const childClone = cloneDragPreviewNode(child)\n    if (childClone) clone.append(childClone)\n  }\n  return clone\n}\n/** Muxy frame geometry keeps leaf owners stable; Corvu owns constrained separator interactions. */\nexport function SplitLayout<L extends SplitLayoutLeaf>(props: SplitLayoutProps<L>) {\n  let root: HTMLDivElement | undefined\n  let pendingFrame: number | undefined\n  const refs = new Map<string, HTMLElement>()\n  const domIds = new Map<string, string>()\n  const prefix = createUniqueId()\n  let nextDomId = 0\n  let nextDragId = 0\n  let dragPreview: HTMLElement | undefined\n  const [drag, setDrag] = createSignal<{ id: string; token: string }>()\n  const [drop, setDrop] = createSignal<{ id: string; intent: PaneDropIntent }>()\n  const clearDrag = () => {\n    setDrag(undefined)\n    setDrop(undefined)\n    dragPreview?.remove()\n    dragPreview = undefined\n  }\n  const createDragPreview = (source: HTMLElement) => {\n    dragPreview?.remove()\n    const preview = cloneDragPreviewNode(source) as HTMLElement\n    preview.className =\n      'pointer-events-none fixed -left-full top-0 z-(--z-dialog) flex h-64 max-h-screen w-96 max-w-screen min-h-0 min-w-0 flex-col overflow-hidden rounded-lg border border-border bg-card text-card-foreground shadow-xl'\n    preview.removeAttribute('id')\n    preview.removeAttribute('style')\n    preview.removeAttribute('role')\n    preview.removeAttribute('aria-label')\n    preview.removeAttribute('data-pane-id')\n    preview.removeAttribute('data-focused')\n    preview.removeAttribute('data-drag-source')\n    preview.removeAttribute('data-drop-direction')\n    preview.removeAttribute('data-drop-placement')\n    preview.setAttribute('data-split-drag-preview', '')\n    preview.setAttribute('aria-hidden', 'true')\n    preview.inert = true\n    document.body.append(preview)\n    dragPreview = preview\n    return preview\n  }\n  const domId = (id: string) => {\n    const existing = domIds.get(id)\n    if (existing) return existing\n    const created = `${prefix}-pane-${nextDomId++}`\n    domIds.set(id, created)\n    return created\n  }\n  const leaves = createMemo(() => listLeaves(props.state.center))\n  const leafMap = createMemo(() => new Map(leaves().map((leaf) => [leaf.id, leaf])))\n  const frames = createMemo(() => computeLayoutFrames(props.state.center))\n  const branches = createMemo(() =>\n    Array.from(frames().values()).flatMap((frame) =>\n      frame.node.kind === 'split' ? [frame.node] : []\n    )\n  )\n  createComputed(() => {\n    const current = drag()\n    if (current && (!props.onMove || !leafMap().has(current.id))) clearDrag()\n    const target = drop()\n    if (target && !leafMap().has(target.id)) setDrop(undefined)\n  })\n  const allowedTarget = (id: string, transfer: DataTransfer | null) => {\n    const current = drag()\n    return props.onMove &&\n      current &&\n      current.id !== id &&\n      leafMap().has(current.id) &&\n      leafMap().has(id) &&\n      transfer?.types.includes(PANE_DRAG_TYPE)\n      ? current\n      : undefined\n  }\n  const dropLabel = createMemo(() => {\n    const target = drop()\n    const leaf = target ? leafMap().get(target.id) : undefined\n    return target && leaf\n      ? `Drop to place pane ${target.intent.placement} ${props.labelForLeaf(leaf)}`\n      : ''\n  })\n  const branchMap = createMemo(() => new Map(branches().map((branch) => [branch.id, branch])))\n  const schedule = (action: () => void) => {\n    if (pendingFrame !== undefined) cancelAnimationFrame(pendingFrame)\n    pendingFrame = requestAnimationFrame(() => {\n      pendingFrame = undefined\n      action()\n    })\n  }\n  // Register before keyed children update: capture a focused editor before an\n  // ordered DOM move can blur it. Never override a newer focus outside this root.\n  createComputed(\n    on(\n      () => props.state.center,\n      () => {\n        const active = root?.ownerDocument.activeElement\n        if (!root || !(active instanceof HTMLElement) || !root.contains(active)) return\n        const field =\n          active instanceof HTMLTextAreaElement || active instanceof HTMLInputElement\n            ? active\n            : undefined\n        const selection = field\n          ? {\n              start: field.selectionStart,\n              end: field.selectionEnd,\n              direction: field.selectionDirection,\n            }\n          : undefined\n        schedule(() => {\n          if (!active.isConnected || !root?.contains(active)) return\n          const current = active.ownerDocument.activeElement\n          if (current !== active && current !== active.ownerDocument.body) return\n          active.focus({ preventScroll: true })\n          if (field && selection?.start !== null && selection?.end !== null && selection)\n            field.setSelectionRange(\n              selection.start,\n              selection.end,\n              selection.direction ?? undefined\n            )\n        })\n      }\n    )\n  )\n  onCleanup(() => {\n    if (pendingFrame !== undefined) cancelAnimationFrame(pendingFrame)\n    clearDrag()\n    refs.clear()\n    domIds.clear()\n  })\n  const close = (id: string) => {\n    const next = props.onClose?.(id)\n    if (next) schedule(() => refs.get(next)?.focus({ preventScroll: true }))\n  }\n  return (\n    <div\n      ref={(el) => {\n        root = el\n      }}\n      role=\"group\"\n      aria-label={props.label}\n      data-slot=\"split-layout\"\n      data-dragging={drag() ? '' : undefined}\n      class={cn('relative size-full min-h-0 min-w-0 data-[dragging]:cursor-grabbing', props.class)}\n    >\n      <For each={leaves().map((leaf) => leaf.id)}>\n        {(id) => {\n          const initial = leafMap().get(id)!\n          const leaf = () => leafMap().get(id) ?? initial\n          const content = props.renderLeaf(leaf)\n          const paneLabel = props.renderPaneLabel?.(leaf)\n          const actions = props.renderPaneActions?.(leaf)\n          const intent = () => (drop()?.id === id ? drop()?.intent : undefined)\n          onCleanup(() => {\n            refs.delete(id)\n            domIds.delete(id)\n          })\n          return (\n            <section\n              ref={(el) => refs.set(id, el)}\n              id={domId(id)}\n              role=\"region\"\n              aria-label={props.labelForLeaf(leaf())}\n              tabIndex={props.paneTabIndex ?? -1}\n              data-pane-id={id}\n              data-focused={props.state.focusedLeafId === id ? '' : undefined}\n              data-drag-source={drag()?.id === id ? '' : undefined}\n              data-drop-direction={intent()?.direction}\n              data-drop-placement={intent()?.placement}\n              onDragOver={(event) => {\n                if (!allowedTarget(id, event.dataTransfer)) return\n                const next = paneDropIntent(\n                  event.clientX,\n                  event.clientY,\n                  event.currentTarget.getBoundingClientRect()\n                )\n                if (!next) {\n                  setDrop(undefined)\n                  return\n                }\n                event.preventDefault()\n                if (event.dataTransfer) event.dataTransfer.dropEffect = 'move'\n                setDrop({ id, intent: next })\n              }}\n              onDragLeave={(event) => {\n                if (\n                  event.relatedTarget instanceof Node &&\n                  event.currentTarget.contains(event.relatedTarget)\n                )\n                  return\n                if (drop()?.id === id) setDrop(undefined)\n              }}\n              onDrop={(event) => {\n                const current = allowedTarget(id, event.dataTransfer)\n                const next = paneDropIntent(\n                  event.clientX,\n                  event.clientY,\n                  event.currentTarget.getBoundingClientRect()\n                )\n                const accepted =\n                  current && next && event.dataTransfer?.getData(PANE_DRAG_TYPE) === current.token\n                clearDrag()\n                if (!accepted) return\n                event.preventDefault()\n                props.onMove?.(current.id, id, next)\n              }}\n              style={rectStyle(frames().get(id)?.rect ?? { x: 0, y: 0, width: 0, height: 0 })}\n              class=\"absolute flex min-h-0 min-w-0 flex-col overflow-hidden border border-border transition-opacity motion-reduce:transition-none data-[drag-source]:opacity-40 data-[focused]:border-primary bg-background text-foreground focus-visible:outline focus-visible:outline-2 focus-visible:outline-ring\"\n              onFocusIn={() => props.onFocus?.(id)}\n            >\n              <header class=\"flex min-w-0 shrink-0 items-center gap-2 bg-surface px-2\">\n                <span\n                  data-pane-drag-handle=\"\"\n                  draggable={Boolean(props.onMove)}\n                  class={cn('flex min-w-0 flex-1 items-center gap-2 truncate text-sm', {\n                    'cursor-grab': Boolean(props.onMove),\n                    'cursor-grabbing': drag()?.id === id,\n                  })}\n                  title={props.onMove ? `Drag ${props.labelForLeaf(leaf())} to move` : undefined}\n                  onDragStart={(event) => {\n                    if (!props.onMove || !event.dataTransfer) {\n                      event.preventDefault()\n                      return\n                    }\n                    const token = `${prefix}-${++nextDragId}`\n                    setDrag({ id, token })\n                    event.dataTransfer.setData(PANE_DRAG_TYPE, token)\n                    event.dataTransfer.effectAllowed = 'move'\n                    // The native drag image carries this pane's actual content\n                    // in a bounded floating-window frame; the source recedes\n                    // independently as the browser follows the image pointer.\n                    const source = refs.get(id)\n                    const frame = source?.getBoundingClientRect()\n                    if (source && frame && typeof event.dataTransfer.setDragImage === 'function') {\n                      const preview = createDragPreview(source)\n                      const previewFrame = preview.getBoundingClientRect()\n                      const scaleX = previewFrame.width / frame.width\n                      const scaleY = previewFrame.height / frame.height\n                      event.dataTransfer.setDragImage(\n                        preview,\n                        Math.max(0, Math.round((event.clientX - frame.left) * scaleX)),\n                        Math.max(0, Math.round((event.clientY - frame.top) * scaleY))\n                      )\n                      preview.setAttribute('data-native-drag-image', '')\n                    }\n                  }}\n                  onDragEnd={clearDrag}\n                >\n                  {props.onMove ? (\n                    <GripVertical class=\"size-3 shrink-0\" aria-hidden=\"true\" />\n                  ) : null}\n                  <span class=\"min-w-0 flex-1 truncate\">\n                    {paneLabel ?? props.labelForLeaf(leaf())}\n                  </span>\n                </span>\n                {actions}\n                {props.onClose ? (\n                  <Button\n                    variant=\"ghost\"\n                    size=\"icon-xs\"\n                    aria-label={`Close ${props.labelForLeaf(leaf())}`}\n                    onClick={() => close(id)}\n                  >\n                    <X />\n                  </Button>\n                ) : null}\n              </header>\n              <div class=\"min-h-0 min-w-0 flex-1 overflow-auto\">{content}</div>\n              {intent() ? (\n                <div\n                  aria-hidden=\"true\"\n                  class={cn('pointer-events-none absolute border-2 border-primary bg-primary/10', {\n                    'inset-y-0 left-0 w-1/2':\n                      intent()?.direction === 'row' && intent()?.placement === 'before',\n                    'inset-y-0 right-0 w-1/2':\n                      intent()?.direction === 'row' && intent()?.placement === 'after',\n                    'inset-x-0 top-0 h-1/2':\n                      intent()?.direction === 'column' && intent()?.placement === 'before',\n                    'inset-x-0 bottom-0 h-1/2':\n                      intent()?.direction === 'column' && intent()?.placement === 'after',\n                  })}\n                />\n              ) : null}\n            </section>\n          )\n        }}\n      </For>\n      <span class=\"sr-only\" role=\"status\">\n        {dropLabel()}\n      </span>\n      <For each={branches().map((branch) => branch.id)}>\n        {(id) => {\n          const initial = branchMap().get(id)!\n          const branch: Accessor<SplitLayoutBranch<L>> = () => branchMap().get(id) ?? initial\n          return (\n            <Resizable\n              orientation={branch().direction === 'row' ? 'horizontal' : 'vertical'}\n              sizes={[branch().ratio, 1 - branch().ratio]}\n              keyboardDelta={0.05}\n              onSizesChange={(sizes) => {\n                // Corvu also reports panel registration/unregistration while\n                // mounting or disposing a controller. Those incomplete or\n                // hidden-host sizes are not user resize intent.\n                if (!root?.isConnected || root.getClientRects().length === 0) return\n                if (\n                  sizes.length !== 2 ||\n                  sizes.some((size) => !Number.isFinite(size)) ||\n                  Math.abs(sizes[0]! + sizes[1]! - 1) > 0.000001\n                )\n                  return\n                if (sizes[0] !== undefined && Math.abs(sizes[0] - branch().ratio) > 0.000001)\n                  props.onResize(id, sizes[0])\n              }}\n              style={rectStyle(frames().get(id)?.rect ?? { x: 0, y: 0, width: 0, height: 0 })}\n              class=\"pointer-events-none absolute flex min-h-0 min-w-0 data-[orientation=vertical]:flex-col\"\n            >\n              <Resizable.Panel\n                minSize={MIN_SPLIT_RATIO}\n                maxSize={MAX_SPLIT_RATIO}\n                aria-hidden=\"true\"\n              />\n              <Resizable.Handle\n                aria-label={\n                  props.labelForSeparator?.(branch()) ??\n                  (branch().direction === 'row' ? 'Resize pane columns' : 'Resize pane rows')\n                }\n                aria-orientation={branch().direction === 'row' ? 'vertical' : 'horizontal'}\n                aria-controls={listLeaves(branch())\n                  .map((leaf) => domId(leaf.id))\n                  .join(' ')}\n                aria-valuemin={10}\n                aria-valuemax={90}\n                aria-valuenow={Math.round(branch().ratio * 100)}\n                class=\"pointer-events-auto relative w-px shrink-0 bg-border after:absolute after:inset-y-0 after:-inset-x-1 after:w-3 focus-visible:bg-primary focus-visible:outline-none hover:bg-primary data-[orientation=vertical]:h-px data-[orientation=vertical]:w-full data-[orientation=vertical]:after:inset-x-0 data-[orientation=vertical]:after:-inset-y-1 data-[orientation=vertical]:after:h-3 data-[orientation=vertical]:after:w-full\"\n              />\n              <Resizable.Panel\n                minSize={MIN_SPLIT_RATIO}\n                maxSize={MAX_SPLIT_RATIO}\n                aria-hidden=\"true\"\n              />\n            </Resizable>\n          )\n        }}\n      </For>\n    </div>\n  )\n}\n"],"mappings":"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"}

package/dist/r/catalog-browser.json

@@ -4,6 +4,7 @@
   "title": "Catalog Browser",
   "description": "",
   "dependencies": [
+    "class-variance-authority@^0.7.1",
     "lucide-solid@^1.48.0"
   ],
   "registryDependencies": [

package/dist/r/registry.json

@@ -1956,6 +1956,7 @@
       "title": "Catalog Browser",
       "description": "",
       "dependencies": [
+        "class-variance-authority@^0.7.1",
         "lucide-solid@^1.48.0"
       ],
       "registryDependencies": [

package/dist/r/src/components/composites/about-dialog/about-dialog.tsx

@@ -94,7 +94,7 @@ export function AboutDialog(props: AboutDialogProps) {
   return (
     <Dialog open={props.open} onOpenChange={props.onOpenChange}>
       <DialogContent
-        class="w-96"
+        class="w-full max-w-96"
         onKeyDown={(event: KeyboardEvent) => {
           // Tooltip help on the identity actions cannot trap Escape in this popup.
           if (event.key === 'Escape' && !event.defaultPrevented) {

package/dist/r/src/components/composites/catalog-browser/catalog-detail.tsx

@@ -1,5 +1,27 @@
-import { createUniqueId, Show, type JSX } from 'solid-js'
+import { createContext, createUniqueId, Show, useContext, type JSX } from 'solid-js'
 import { Badge } from '../../ui/badge'
+import { cva } from 'class-variance-authority'
+
+type SectionsLayout = 'stacked' | 'columns'
+const SectionsLayoutContext = createContext<() => SectionsLayout>((): SectionsLayout => 'stacked')
+const sectionsVariants = cva('grid min-w-0', {
+  variants: {
+    layout: {
+      stacked: 'gap-2',
+      columns:
+        'gap-4 rounded-xl border border-border p-3 md:auto-cols-fr md:grid-flow-col md:gap-0',
+    },
+  },
+})
+const sectionVariants = cva('grid min-w-0 gap-1.5 wrap-anywhere', {
+  variants: {
+    layout: {
+      stacked: 'rounded-xl border border-border p-3',
+      columns:
+        'md:border-s md:border-border md:px-3 md:first:border-s-0 md:first:ps-0 md:last:pe-0',
+    },
+  },
+})
 
 /** Shared item summary and action frame for catalog-owned detail content. */
 export function CatalogDetail(props: {
@@ -13,6 +35,8 @@ export function CatalogDetail(props: {
   badges?: JSX.Element
   action?: JSX.Element
   status?: JSX.Element
+  /** Groups related fields in one padded card; stacks them on narrow screens. */
+  sectionsLayout?: SectionsLayout
   children?: JSX.Element
 }) {
   return (
@@ -40,19 +64,25 @@ export function CatalogDetail(props: {
           </div>
         </Show>
       </div>
-      <div class="grid min-w-0 gap-2">{props.children}</div>
+      <SectionsLayoutContext.Provider value={() => props.sectionsLayout ?? 'stacked'}>
+        <div
+          data-catalog-detail-sections
+          data-layout={props.sectionsLayout ?? 'stacked'}
+          class={sectionsVariants({ layout: props.sectionsLayout ?? 'stacked' })}
+        >
+          {props.children}
+        </div>
+      </SectionsLayoutContext.Provider>
     </article>
   )
 }
 
 /** A shared compact row for host-specific fields, permissions, and copy. */
 export function CatalogDetailSection(props: { title: string; children?: JSX.Element }) {
+  const layout = useContext(SectionsLayoutContext)
   const headingId = `catalog-detail-section-${createUniqueId()}`
   return (
-    <section
-      class="grid min-w-0 gap-1.5 rounded-xl border border-border p-3"
-      aria-labelledby={headingId}
-    >
+    <section class={sectionVariants({ layout: layout() })} aria-labelledby={headingId}>
       <h3
         id={headingId}
         class="text-2xs font-semibold tracking-wider text-muted-foreground uppercase"

package/dist/r/src/components/composites/update-dialog/update-dialog.tsx

@@ -615,7 +615,8 @@ export function UpdateDialog(props: UpdateDialogProps) {
       </Show>
 
       <DialogContent
-        class={cn('max-w-3xl', local.class)}
+        positioner="inset"
+        class={cn('flex max-h-full min-h-0 max-w-3xl flex-col overflow-hidden', local.class)}
         onKeyDown={(event: KeyboardEvent) => {
           // An explanatory tooltip must not consume the popup's close shortcut,
           // including while its exit animation still owns Kobalte's top layer.
@@ -634,7 +635,7 @@ export function UpdateDialog(props: UpdateDialogProps) {
         }}
         onCloseAutoFocus={focusRestoration.onCloseAutoFocus}
       >
-        <DialogHeader>
+        <DialogHeader class="shrink-0">
           <div class="flex items-center gap-3">
             <Show
               when={local.appIcon}
@@ -651,7 +652,10 @@ export function UpdateDialog(props: UpdateDialogProps) {
           </div>
         </DialogHeader>
 
-        <div class="flex min-h-0 flex-col gap-5 overflow-y-auto p-6">
+        <div
+          data-slot="update-dialog-scroll-region"
+          class="flex min-h-0 min-w-0 flex-1 flex-col gap-5 overflow-y-auto p-6"
+        >
           <section
             class="rounded-xl border border-border bg-background/45 p-4"
             aria-label="Version status"

package/dist/r/src/components/layout/split-layout/split-layout.tsx

@@ -17,6 +17,8 @@ import { computeLayoutFrames, type LayoutRect } from './geometry'
 import { paneDropIntent, type PaneDropIntent } from './drop'
 export type { PaneDropIntent } from './drop'
 const PANE_DRAG_TYPE = 'application/x-adea-pane-move'
+const DRAG_PREVIEW_MAX_WIDTH = 384
+const DRAG_PREVIEW_MAX_HEIGHT = 256
 import {
   listLeaves,
   MIN_SPLIT_RATIO,
@@ -57,6 +59,114 @@ function rectStyle(rect: LayoutRect): JSX.CSSProperties {
     height: `${rect.height * 100}%`,
   }
 }
+function dragPreviewPlaceholder(source: HTMLElement, message: string) {
+  const placeholder = document.createElement('div')
+  placeholder.className = cn(
+    source.getAttribute('class'),
+    'flex min-h-8 min-w-0 items-center justify-center bg-muted px-2 text-center text-xs text-muted-foreground'
+  )
+  placeholder.setAttribute('data-split-drag-placeholder', source.localName)
+  placeholder.textContent = message
+  return placeholder
+}
+function boundedSnapshotSize(width: number, height: number) {
+  const sourceWidth = Math.max(1, width)
+  const sourceHeight = Math.max(1, height)
+  const scale = Math.min(
+    1,
+    DRAG_PREVIEW_MAX_WIDTH / sourceWidth,
+    DRAG_PREVIEW_MAX_HEIGHT / sourceHeight
+  )
+  return {
+    width: Math.max(1, Math.round(sourceWidth * scale)),
+    height: Math.max(1, Math.round(sourceHeight * scale)),
+  }
+}
+function cloneDragPreviewNode(source: Node): Node | undefined {
+  if (source.nodeType === Node.TEXT_NODE) return source.cloneNode(false)
+  if (!(source instanceof HTMLElement || source instanceof SVGElement))
+    return source.cloneNode(false)
+
+  if (['script', 'style', 'link', 'source', 'track', 'meta'].includes(source.localName))
+    return undefined
+  if (['iframe', 'video', 'audio', 'object', 'embed'].includes(source.localName))
+    return dragPreviewPlaceholder(
+      source as HTMLElement,
+      'Embedded content unavailable while moving'
+    )
+  if (source instanceof HTMLImageElement) {
+    const snapshot = document.createElement('canvas')
+    const size = boundedSnapshotSize(
+      source.naturalWidth || source.width,
+      source.naturalHeight || source.height
+    )
+    snapshot.width = size.width
+    snapshot.height = size.height
+    snapshot.className = source.getAttribute('class') ?? ''
+    snapshot.setAttribute('data-split-drag-image', '')
+    try {
+      if (!source.complete || source.naturalWidth === 0)
+        throw new Error('image has no decoded pixels')
+      const context = snapshot.getContext('2d')
+      if (!context) throw new Error('canvas snapshot context is unavailable')
+      context.drawImage(source, 0, 0, snapshot.width, snapshot.height)
+      return snapshot
+    } catch {
+      return dragPreviewPlaceholder(source, 'Image preview unavailable')
+    }
+  }
+
+  // Copying a defined custom element can run its constructor; inserting it can
+  // also reconnect a stream or terminal session. Flatten its display tree.
+  if (source instanceof HTMLElement && source.localName.includes('-')) {
+    const children = document.createDocumentFragment()
+    for (const child of source.childNodes) {
+      const clone = cloneDragPreviewNode(child)
+      if (clone) children.append(clone)
+    }
+    return children.childNodes.length > 0
+      ? children
+      : dragPreviewPlaceholder(source, 'Live component preview unavailable while moving')
+  }
+
+  const clone = source.cloneNode(false) as HTMLElement | SVGElement
+  for (const attribute of [
+    'id',
+    'style',
+    'draggable',
+    'data-pane-drag-handle',
+    'data-pane-id',
+    'src',
+    'srcset',
+    'href',
+    'xlink:href',
+    'data',
+    'poster',
+  ])
+    clone.removeAttribute(attribute)
+  for (const attribute of Array.from(clone.attributes))
+    if (/^on/i.test(attribute.name)) clone.removeAttribute(attribute.name)
+
+  if (source instanceof HTMLCanvasElement && clone instanceof HTMLCanvasElement) {
+    const size = boundedSnapshotSize(source.width, source.height)
+    clone.width = size.width
+    clone.height = size.height
+    try {
+      const context = clone.getContext('2d')
+      if (!context) throw new Error('canvas snapshot context is unavailable')
+      context.drawImage(source, 0, 0, clone.width, clone.height)
+    } catch {
+      return dragPreviewPlaceholder(source, 'Canvas preview unavailable while moving')
+    }
+    return clone
+  }
+
+  for (const child of source.childNodes) {
+    const childClone = cloneDragPreviewNode(child)
+    if (childClone) clone.append(childClone)
+  }
+  return clone
+}
 /** Muxy frame geometry keeps leaf owners stable; Corvu owns constrained separator interactions. */
 export function SplitLayout<L extends SplitLayoutLeaf>(props: SplitLayoutProps<L>) {
   let root: HTMLDivElement | undefined
@@ -66,11 +176,35 @@ export function SplitLayout<L extends SplitLayoutLeaf>(props: SplitLayoutProps<L
   const prefix = createUniqueId()
   let nextDomId = 0
   let nextDragId = 0
+  let dragPreview: HTMLElement | undefined
   const [drag, setDrag] = createSignal<{ id: string; token: string }>()
   const [drop, setDrop] = createSignal<{ id: string; intent: PaneDropIntent }>()
   const clearDrag = () => {
     setDrag(undefined)
     setDrop(undefined)
+    dragPreview?.remove()
+    dragPreview = undefined
+  }
+  const createDragPreview = (source: HTMLElement) => {
+    dragPreview?.remove()
+    const preview = cloneDragPreviewNode(source) as HTMLElement
+    preview.className =
+      'pointer-events-none fixed -left-full top-0 z-(--z-dialog) flex h-64 max-h-screen w-96 max-w-screen min-h-0 min-w-0 flex-col overflow-hidden rounded-lg border border-border bg-card text-card-foreground shadow-xl'
+    preview.removeAttribute('id')
+    preview.removeAttribute('style')
+    preview.removeAttribute('role')
+    preview.removeAttribute('aria-label')
+    preview.removeAttribute('data-pane-id')
+    preview.removeAttribute('data-focused')
+    preview.removeAttribute('data-drag-source')
+    preview.removeAttribute('data-drop-direction')
+    preview.removeAttribute('data-drop-placement')
+    preview.setAttribute('data-split-drag-preview', '')
+    preview.setAttribute('aria-hidden', 'true')
+    preview.inert = true
+    document.body.append(preview)
+    dragPreview = preview
+    return preview
   }
   const domId = (id: string) => {
     const existing = domIds.get(id)
@@ -236,7 +370,7 @@ export function SplitLayout<L extends SplitLayoutLeaf>(props: SplitLayoutProps<L
                 props.onMove?.(current.id, id, next)
               }}
               style={rectStyle(frames().get(id)?.rect ?? { x: 0, y: 0, width: 0, height: 0 })}
-              class="absolute flex min-h-0 min-w-0 flex-col overflow-hidden border border-border transition-opacity data-[drag-source]:opacity-40 data-[focused]:border-primary bg-background text-foreground focus-visible:outline focus-visible:outline-2 focus-visible:outline-ring"
+              class="absolute flex min-h-0 min-w-0 flex-col overflow-hidden border border-border transition-opacity motion-reduce:transition-none data-[drag-source]:opacity-40 data-[focused]:border-primary bg-background text-foreground focus-visible:outline focus-visible:outline-2 focus-visible:outline-ring"
               onFocusIn={() => props.onFocus?.(id)}
             >
               <header class="flex min-w-0 shrink-0 items-center gap-2 bg-surface px-2">
@@ -245,6 +379,7 @@ export function SplitLayout<L extends SplitLayoutLeaf>(props: SplitLayoutProps<L
                   draggable={Boolean(props.onMove)}
                   class={cn('flex min-w-0 flex-1 items-center gap-2 truncate text-sm', {
                     'cursor-grab': Boolean(props.onMove),
+                    'cursor-grabbing': drag()?.id === id,
                   })}
                   title={props.onMove ? `Drag ${props.labelForLeaf(leaf())} to move` : undefined}
                   onDragStart={(event) => {
@@ -256,18 +391,23 @@ export function SplitLayout<L extends SplitLayoutLeaf>(props: SplitLayoutProps<L
                     setDrag({ id, token })
                     event.dataTransfer.setData(PANE_DRAG_TYPE, token)
                     event.dataTransfer.effectAllowed = 'move'
-                    // The ghost is the pane itself, not the handle strip: the
-                    // browser snapshots the region before the drag state dims
-                    // this section, so the dragged pane stays readable while
-                    // its source visibly recedes.
+                    // The native drag image carries this pane's actual content
+                    // in a bounded floating-window frame; the source recedes
+                    // independently as the browser follows the image pointer.
                     const source = refs.get(id)
                     const frame = source?.getBoundingClientRect()
-                    if (source && frame && typeof event.dataTransfer.setDragImage === 'function')
+                    if (source && frame && typeof event.dataTransfer.setDragImage === 'function') {
+                      const preview = createDragPreview(source)
+                      const previewFrame = preview.getBoundingClientRect()
+                      const scaleX = previewFrame.width / frame.width
+                      const scaleY = previewFrame.height / frame.height
                       event.dataTransfer.setDragImage(
-                        source,
-                        Math.max(0, Math.round(event.clientX - frame.left)),
-                        Math.max(0, Math.round(event.clientY - frame.top))
+                        preview,
+                        Math.max(0, Math.round((event.clientX - frame.left) * scaleX)),
+                        Math.max(0, Math.round((event.clientY - frame.top) * scaleY))
                       )
+                      preview.setAttribute('data-native-drag-image', '')
+                    }
                   }}
                   onDragEnd={clearDrag}
                 >

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adea-ai/ui",
-  "version": "0.103.1",
+  "version": "0.104.1",
   "description": "The Adea design system: Kobalte-backed Solid components, semantic OKLCH tokens, and the app-shell layout primitives shared by Adea and Cortana.",
   "keywords": [
     "adea",

package/registry.json

@@ -1956,6 +1956,7 @@
       "title": "Catalog Browser",
       "description": "",
       "dependencies": [
+        "class-variance-authority@^0.7.1",
         "lucide-solid@^1.48.0"
       ],
       "registryDependencies": [

package/src/components/composites/about-dialog/about-dialog.tsx

@@ -94,7 +94,7 @@ export function AboutDialog(props: AboutDialogProps) {
   return (
     <Dialog open={props.open} onOpenChange={props.onOpenChange}>
       <DialogContent
-        class="w-96"
+        class="w-full max-w-96"
         onKeyDown={(event: KeyboardEvent) => {
           // Tooltip help on the identity actions cannot trap Escape in this popup.
           if (event.key === 'Escape' && !event.defaultPrevented) {

package/src/components/composites/catalog-browser/catalog-detail.tsx

@@ -1,5 +1,27 @@
-import { createUniqueId, Show, type JSX } from 'solid-js'
+import { createContext, createUniqueId, Show, useContext, type JSX } from 'solid-js'
 import { Badge } from '../../ui/badge'
+import { cva } from 'class-variance-authority'
+
+type SectionsLayout = 'stacked' | 'columns'
+const SectionsLayoutContext = createContext<() => SectionsLayout>((): SectionsLayout => 'stacked')
+const sectionsVariants = cva('grid min-w-0', {
+  variants: {
+    layout: {
+      stacked: 'gap-2',
+      columns:
+        'gap-4 rounded-xl border border-border p-3 md:auto-cols-fr md:grid-flow-col md:gap-0',
+    },
+  },
+})
+const sectionVariants = cva('grid min-w-0 gap-1.5 wrap-anywhere', {
+  variants: {
+    layout: {
+      stacked: 'rounded-xl border border-border p-3',
+      columns:
+        'md:border-s md:border-border md:px-3 md:first:border-s-0 md:first:ps-0 md:last:pe-0',
+    },
+  },
+})
 
 /** Shared item summary and action frame for catalog-owned detail content. */
 export function CatalogDetail(props: {
@@ -13,6 +35,8 @@ export function CatalogDetail(props: {
   badges?: JSX.Element
   action?: JSX.Element
   status?: JSX.Element
+  /** Groups related fields in one padded card; stacks them on narrow screens. */
+  sectionsLayout?: SectionsLayout
   children?: JSX.Element
 }) {
   return (
@@ -40,19 +64,25 @@ export function CatalogDetail(props: {
           </div>
         </Show>
       </div>
-      <div class="grid min-w-0 gap-2">{props.children}</div>
+      <SectionsLayoutContext.Provider value={() => props.sectionsLayout ?? 'stacked'}>
+        <div
+          data-catalog-detail-sections
+          data-layout={props.sectionsLayout ?? 'stacked'}
+          class={sectionsVariants({ layout: props.sectionsLayout ?? 'stacked' })}
+        >
+          {props.children}
+        </div>
+      </SectionsLayoutContext.Provider>
     </article>
   )
 }
 
 /** A shared compact row for host-specific fields, permissions, and copy. */
 export function CatalogDetailSection(props: { title: string; children?: JSX.Element }) {
+  const layout = useContext(SectionsLayoutContext)
   const headingId = `catalog-detail-section-${createUniqueId()}`
   return (
-    <section
-      class="grid min-w-0 gap-1.5 rounded-xl border border-border p-3"
-      aria-labelledby={headingId}
-    >
+    <section class={sectionVariants({ layout: layout() })} aria-labelledby={headingId}>
       <h3
         id={headingId}
         class="text-2xs font-semibold tracking-wider text-muted-foreground uppercase"

package/src/components/composites/update-dialog/update-dialog.tsx

@@ -615,7 +615,8 @@ export function UpdateDialog(props: UpdateDialogProps) {
       </Show>
 
       <DialogContent
-        class={cn('max-w-3xl', local.class)}
+        positioner="inset"
+        class={cn('flex max-h-full min-h-0 max-w-3xl flex-col overflow-hidden', local.class)}
         onKeyDown={(event: KeyboardEvent) => {
           // An explanatory tooltip must not consume the popup's close shortcut,
           // including while its exit animation still owns Kobalte's top layer.
@@ -634,7 +635,7 @@ export function UpdateDialog(props: UpdateDialogProps) {
         }}
         onCloseAutoFocus={focusRestoration.onCloseAutoFocus}
       >
-        <DialogHeader>
+        <DialogHeader class="shrink-0">
           <div class="flex items-center gap-3">
             <Show
               when={local.appIcon}
@@ -651,7 +652,10 @@ export function UpdateDialog(props: UpdateDialogProps) {
           </div>
         </DialogHeader>
 
-        <div class="flex min-h-0 flex-col gap-5 overflow-y-auto p-6">
+        <div
+          data-slot="update-dialog-scroll-region"
+          class="flex min-h-0 min-w-0 flex-1 flex-col gap-5 overflow-y-auto p-6"
+        >
           <section
             class="rounded-xl border border-border bg-background/45 p-4"
             aria-label="Version status"