@ahrowe/ui 0.44.0 → 0.46.0

package/dist/esm/common/kanbanBoard/KanbanBoard.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"KanbanBoard.mjs","names":[],"sources":["../../../../package/common/kanbanBoard/KanbanBoard.tsx"],"sourcesContent":["import { useMemo, useRef, useState } from 'react';\nimport {\n  DndContext,\n  DragOverlay,\n  KeyboardSensor,\n  MouseSensor,\n  TouchSensor,\n  useSensor,\n  useSensors,\n  type DragStartEvent,\n  type DragOverEvent,\n  type DragEndEvent,\n  type ScreenReaderInstructions,\n} from '@dnd-kit/core';\nimport { SortableContext, horizontalListSortingStrategy } from '@dnd-kit/sortable';\nimport cx from 'classnames';\n\nimport type { KanbanBoardProps, KanbanColumnDef } from './kanbanBoard.types';\nimport styles from './kanbanBoard.module.pcss';\nimport KanbanColumn from './KanbanColumn';\nimport {\n  buildAnnouncements,\n  columnsEqual,\n  isColumnDragData,\n  kanbanCollisionDetection,\n  kanbanKeyboardCoordinateGetter,\n  moveColumn,\n  moveItem,\n} from './kanbanBoard.utils';\n\nconst defaultGetItemLabel = <T,>(_item: T, id: string): string => id;\n\n// Hoisted so these are referentially stable across renders — inline literals here would give\n// `useSensor` a new options object every render (including every dragOver during an active\n// drag), which defeats its own memoization and makes `sensors` a new array each time too.\n//\n// Mouse and touch are split (rather than one combined `PointerSensor`) because they need\n// different activation constraints: a small movement threshold for mouse starts a drag\n// immediately without interfering with clicks, but the same threshold on a touchscreen would\n// hijack an ordinary scroll gesture as soon as the finger moves a few pixels. Touch instead\n// requires a brief press-and-hold before a drag arms, so a normal swipe-to-scroll passes through\n// untouched — the same pattern `VirtualList`'s `longPressDelay` uses.\nconst MOUSE_SENSOR_OPTIONS = { activationConstraint: { distance: 8 } };\nconst TOUCH_SENSOR_OPTIONS = { activationConstraint: { delay: 250, tolerance: 5 } };\nconst KEYBOARD_SENSOR_OPTIONS = { coordinateGetter: kanbanKeyboardCoordinateGetter };\n\nconst SCREEN_READER_INSTRUCTIONS: ScreenReaderInstructions = {\n  draggable: `\n    To pick up a card or column, press space or enter.\n    While dragging, use the arrow keys to move it — for a card, between positions and columns;\n    for a column, left/right to reorder it.\n    Press space or enter again to drop it, or press escape to cancel.\n  `,\n};\n\nfunction KanbanBoard<T = unknown>({\n  columns,\n  items,\n  renderItem,\n  onChange,\n  dragHandle,\n  getItemLabel = defaultGetItemLabel,\n  getItemDisabled,\n  renderEmptyColumn,\n  renderColumnActions,\n  reorderableColumns,\n  collapseEmptyColumns,\n  columnMaxHeight,\n  onLoadMore,\n  loadMoreThreshold,\n  className,\n  style,\n  classNames,\n  styles: slotStyles,\n  ...rest\n}: KanbanBoardProps<T>) {\n  const [activeId, setActiveId] = useState<string | null>(null);\n  const [activeIsColumn, setActiveIsColumn] = useState(false);\n  const [shadowColumns, setShadowColumns] = useState<KanbanColumnDef[] | null>(null);\n\n  // Guards against a self-sustaining reorder loop: applying a card move reflows the columns\n  // involved, which can shift a *different* card under an otherwise-stationary pointer. dnd-kit\n  // then re-fires `dragOver` with that new `over`, even though the user hasn't moved anything —\n  // and if the geometry decision for that new target flips back once applied, the two states\n  // (or more) can bounce forever, purely from our own layout changes, eventually tripping React's\n  // \"Maximum update depth exceeded\" guard. `activeRect` only changes when the dragged card's own\n  // position actually moves (real pointer/keyboard input), so it's used here as a proxy for \"did\n  // anything the user did actually change\" — a reorder is only applied once per distinct\n  // `activeRect`, which lets a drag settle and then holds still instead of oscillating.\n  const lastAppliedActiveRectKeyRef = useRef<string | null>(null);\n\n  const sensors = useSensors(\n    useSensor(MouseSensor, MOUSE_SENSOR_OPTIONS),\n    useSensor(TouchSensor, TOUCH_SENSOR_OPTIONS),\n    useSensor(KeyboardSensor, KEYBOARD_SENSOR_OPTIONS),\n  );\n\n  const displayColumns = shadowColumns ?? columns;\n\n  // `SortableContext` memoizes its own derived `items`/context value keyed on this array's\n  // *reference*, not its contents — an inline `.map()` here would hand it a new array every\n  // render (including every `dragOver` while a drag is in progress, via `shadowColumns`), forcing\n  // every column's own `useSortable` to recompute and its whole subtree to re-render on every\n  // board render, not just when the column order actually changes. Same class of bug as the\n  // sensor options and the `data`/`disabled` objects in `KanbanColumn.tsx`/`KanbanItem.tsx`.\n  const columnIds = useMemo(() => displayColumns.map((col) => col.id), [displayColumns]);\n\n  const announcements = useMemo(\n    () => buildAnnouncements(displayColumns, items, getItemLabel),\n    [displayColumns, items, getItemLabel],\n  );\n\n  const accessibility = useMemo(\n    () => ({ announcements, screenReaderInstructions: SCREEN_READER_INSTRUCTIONS }),\n    [announcements],\n  );\n\n  function handleDragStart({ active }: DragStartEvent) {\n    setActiveId(String(active.id));\n    setActiveIsColumn(isColumnDragData(active.data.current));\n    // `moveItem`/`moveColumn` never mutate what's passed in, only returning new objects/arrays\n    // for the column(s) actually touched — so seeding the shadow state directly with `columns`\n    // (rather than a full deep clone) is safe, and skips an O(total cards) clone on every drag.\n    setShadowColumns(columns);\n    lastAppliedActiveRectKeyRef.current = null;\n  }\n\n  function handleDragOver({ active, over }: DragOverEvent) {\n    if (!over) return;\n\n    if (isColumnDragData(active.data.current)) {\n      const activeColumnId = String(active.id);\n      const overColumnId = String(over.id);\n\n      setShadowColumns((prev) => {\n        const base = prev ?? columns;\n        const next = moveColumn(base, activeColumnId, overColumnId);\n        return next === base ? prev : next;\n      });\n      return;\n    }\n\n    const activeItemId = String(active.id);\n    const overId = String(over.id);\n    const activeRect = active.rect.current.translated ?? active.rect.current.initial;\n\n    const activeRectKey = activeRect ? `${activeRect.top}:${activeRect.left}` : null;\n    if (activeRectKey !== null && activeRectKey === lastAppliedActiveRectKeyRef.current) {\n      return;\n    }\n    lastAppliedActiveRectKeyRef.current = activeRectKey;\n\n    setShadowColumns((prev) => {\n      const base = prev ?? columns;\n      const next = moveItem(base, activeItemId, overId, { activeRect, overRect: over.rect });\n      return next === base ? prev : next;\n    });\n  }\n\n  function handleDragEnd({ over }: DragEndEvent) {\n    setActiveId(null);\n    setActiveIsColumn(false);\n\n    if (!over || !shadowColumns) {\n      setShadowColumns(null);\n      return;\n    }\n\n    if (!columnsEqual(shadowColumns, columns)) {\n      onChange(shadowColumns);\n    }\n    setShadowColumns(null);\n  }\n\n  function handleDragCancel() {\n    setActiveId(null);\n    setActiveIsColumn(false);\n    setShadowColumns(null);\n  }\n\n  const activeColumn = activeId && activeIsColumn ? displayColumns.find((col) => col.id === activeId) : undefined;\n\n  return (\n    <DndContext\n      sensors={sensors}\n      collisionDetection={kanbanCollisionDetection}\n      onDragStart={handleDragStart}\n      onDragOver={handleDragOver}\n      onDragEnd={handleDragEnd}\n      onDragCancel={handleDragCancel}\n      accessibility={accessibility}\n    >\n      <SortableContext id='kanban-columns' items={columnIds} strategy={horizontalListSortingStrategy}>\n        <div {...rest} className={cx(styles.board, className)} style={style}>\n          {displayColumns.map((col) => (\n            <KanbanColumn\n              key={col.id}\n              id={col.id}\n              title={col.title}\n              itemIds={col.itemIds}\n              maxItems={col.maxItems}\n              disabled={col.disabled}\n              getItemDisabled={getItemDisabled}\n              emptyPlaceholder={renderEmptyColumn?.(col)}\n              actions={renderColumnActions?.(col)}\n              reorderable={reorderableColumns}\n              activeIsColumn={activeId !== null && activeIsColumn}\n              collapseEmptyColumns={collapseEmptyColumns}\n              columnMaxHeight={columnMaxHeight}\n              hasMore={col.hasMore}\n              onLoadMore={onLoadMore ? () => onLoadMore(col.id) : undefined}\n              loadMoreThreshold={loadMoreThreshold}\n              items={items}\n              renderItem={renderItem}\n              dragHandle={dragHandle}\n              preserveSizeWhileEmpty={activeId !== null}\n            />\n          ))}\n        </div>\n      </SortableContext>\n      <DragOverlay>\n        {activeColumn ? (\n          <div className={cx(styles.column, styles.columnDragOverlay)}>\n            <div className={styles.columnHeader}>\n              <span className={styles.columnHeaderTitle}>{activeColumn.title}</span>\n            </div>\n          </div>\n        ) : activeId && !activeIsColumn && items[activeId] !== undefined ? (\n          <div className={cx(styles.dragOverlay, classNames?.dragOverlay)} style={slotStyles?.dragOverlay}>\n            {renderItem(items[activeId], activeId)}\n          </div>\n        ) : null}\n      </DragOverlay>\n    </DndContext>\n  );\n}\n\nexport default KanbanBoard;\n"],"mappings":"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"}
+{"version":3,"file":"KanbanBoard.mjs","names":[],"sources":["../../../../package/common/kanbanBoard/KanbanBoard.tsx"],"sourcesContent":["import type { KeyboardEvent } from 'react';\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport {\n  DndContext,\n  DragOverlay,\n  KeyboardSensor,\n  MouseSensor,\n  TouchSensor,\n  useSensor,\n  useSensors,\n  type DragStartEvent,\n  type DragOverEvent,\n  type DragEndEvent,\n  type Active,\n  type ScreenReaderInstructions,\n} from '@dnd-kit/core';\nimport { SortableContext, horizontalListSortingStrategy } from '@dnd-kit/sortable';\nimport cx from 'classnames';\n\nimport type { KanbanBoardProps } from './kanbanBoard.types';\nimport styles from './kanbanBoard.module.pcss';\nimport KanbanColumn, { ColumnHeaderContent } from './KanbanColumn';\nimport {\n  applyPlacement,\n  buildAnnouncements,\n  columnsEqual,\n  findArrowFocusTarget,\n  findPlacement,\n  isColumnDragData,\n  kanbanCollisionDetection,\n  kanbanKeyboardCoordinateGetter,\n  moveColumn,\n  moveItem,\n  scrollsTowardBoard,\n  type DragPlacement,\n} from './kanbanBoard.utils';\n\nconst defaultGetItemLabel = <T,>(_item: T, id: string): string => id;\n\n// Hoisted so these are referentially stable across renders — inline literals here would give\n// `useSensor` a new options object every render (including every dragOver during an active\n// drag), which defeats its own memoization and makes `sensors` a new array each time too.\n//\n// Mouse and touch are split (rather than one combined `PointerSensor`) because they need\n// different activation constraints: a small movement threshold for mouse starts a drag\n// immediately without interfering with clicks, but the same threshold on a touchscreen would\n// hijack an ordinary scroll gesture as soon as the finger moves a few pixels. Touch instead\n// requires a brief press-and-hold before a drag arms, so a normal swipe-to-scroll passes through\n// untouched — the same pattern `VirtualList`'s `longPressDelay` uses.\nconst MOUSE_SENSOR_OPTIONS = { activationConstraint: { distance: 8 } };\nconst TOUCH_SENSOR_OPTIONS = { activationConstraint: { delay: 250, tolerance: 5 } };\nconst KEYBOARD_SENSOR_OPTIONS = { coordinateGetter: kanbanKeyboardCoordinateGetter };\n\nconst SCREEN_READER_INSTRUCTIONS: ScreenReaderInstructions = {\n  draggable: `\n    To pick up a card or column, press space or enter.\n    Use the arrow keys to move between cards and columns.\n    While dragging, use the arrow keys to move it — for a card, between positions and columns;\n    for a column, left/right to reorder it.\n    Press space or enter again to drop it, or press escape to cancel.\n  `,\n};\n\nfunction KanbanBoard<T = unknown>({\n  columns,\n  items,\n  renderItem,\n  onChange,\n  dragHandle,\n  getItemLabel = defaultGetItemLabel,\n  getItemDisabled,\n  renderEmptyColumn,\n  renderColumnActions,\n  reorderableColumns,\n  collapseEmptyColumns = false,\n  columnMaxHeight,\n  onLoadMore,\n  loadMoreThreshold,\n  onKeyDown,\n  className,\n  style,\n  classNames,\n  styles: slotStyles,\n  ...rest\n}: KanbanBoardProps<T>) {\n  const [activeId, setActiveId] = useState<string | null>(null);\n  const [activeIsColumn, setActiveIsColumn] = useState(false);\n  const [placement, setPlacement] = useState<DragPlacement | null>(null);\n\n  // Guards against a self-sustaining reorder loop: applying a card move reflows the columns\n  // involved, which can shift a *different* card under an otherwise-stationary pointer. dnd-kit\n  // then re-fires `dragOver` with that new `over`, even though the user hasn't moved anything —\n  // and if the geometry decision for that new target flips back once applied, the two states\n  // (or more) can bounce forever, purely from our own layout changes, eventually tripping React's\n  // \"Maximum update depth exceeded\" guard. `activeRect` only changes when the dragged card's own\n  // position actually moves (real pointer/keyboard input), so it's used here as a proxy for \"did\n  // anything the user did actually change\" — a reorder is only applied once per distinct\n  // `activeRect`, which lets a drag settle and then holds still instead of oscillating.\n  const lastAppliedActiveRectKeyRef = useRef<string | null>(null);\n\n  const boardRef = useRef<HTMLDivElement>(null);\n\n  // Lets an ancestor of the board (the page) auto-scroll only toward a part of the board out of\n  // view. Left to dnd-kit, a card held near the bottom of the viewport scrolled the page on until\n  // the board was gone; refused, dnd-kit moves on to the column's own list.\n  const draggedRectRef = useRef<Active['rect'] | null>(null);\n  const canScroll = useCallback((element: Element) => {\n    const board = boardRef.current;\n    const dragged = draggedRectRef.current?.current.translated;\n    if (!board || !dragged || board.contains(element)) return true;\n    const scroller =\n      element === document.scrollingElement ? { top: 0, bottom: window.innerHeight } : element.getBoundingClientRect();\n    return scrollsTowardBoard(scroller, board.getBoundingClientRect(), dragged);\n  }, []);\n  // dnd-kit asks `canScroll` only when it re-plans, which WebKit never prompts while the pointer\n  // holds still, so the page scrolled on past the board there. A render hands dnd-kit a new\n  // `canScroll`, which makes it re-plan: the scroll listener below asks for one when the page\n  // should stop.\n  const [, replanAutoScroll] = useState(0);\n\n  // A scroll is input too: it moves the cards under a pointer that holds still, which is what the\n  // auto-scroll at a column's edge does. Only a scroll that moves this board counts, so a scroller\n  // elsewhere on the page cannot switch the guard off for the whole drag.\n  const isDragging = activeId !== null;\n  useEffect(() => {\n    if (!isDragging) return;\n    const handleScroll = ({ target }: Event) => {\n      const board = boardRef.current;\n      if (!board || !(target instanceof Node) || !(target.contains(board) || board.contains(target))) return;\n      lastAppliedActiveRectKeyRef.current = null;\n      const scroller = target === document ? document.scrollingElement : target;\n      if (scroller instanceof Element && !canScroll(scroller)) replanAutoScroll((n) => n + 1);\n    };\n    // Capture, because a scroll event does not bubble, and the scroller can be any ancestor.\n    window.addEventListener('scroll', handleScroll, { capture: true, passive: true });\n    return () => window.removeEventListener('scroll', handleScroll, { capture: true });\n  }, [isDragging, canScroll]);\n\n  const sensors = useSensors(\n    useSensor(MouseSensor, MOUSE_SENSOR_OPTIONS),\n    useSensor(TouchSensor, TOUCH_SENSOR_OPTIONS),\n    useSensor(KeyboardSensor, KEYBOARD_SENSOR_OPTIONS),\n  );\n\n  // Rebuilt from the live `columns` on every change rather than snapshotted at drag start: a page\n  // `onLoadMore` appended mid-drag stayed invisible in the snapshot, so the column kept asking for\n  // more, and the drop then handed the snapshot to `onChange`, discarding every page loaded since.\n  const displayColumns = useMemo(() => applyPlacement(columns, placement), [columns, placement]);\n\n  // `SortableContext` memoizes its own derived `items`/context value keyed on this array's\n  // *reference*, not its contents — an inline `.map()` here would hand it a new array every\n  // render (including every `dragOver` while a drag is in progress, via `placement`), forcing\n  // every column's own `useSortable` to recompute and its whole subtree to re-render on every\n  // board render, not just when the column order actually changes. Same class of bug as the\n  // sensor options and the `data`/`disabled` objects in `KanbanColumn.tsx`/`KanbanItem.tsx`.\n  const columnIds = useMemo(() => displayColumns.map((col) => col.id), [displayColumns]);\n\n  // Read from `columns`, not `displayColumns`, so no column grows or shrinks during a drag: a\n  // width change under the pointer moves the drop targets, and a column that shrank mid-drag once\n  // fed a reorder loop. A column the drag empties or fills changes width once, after the drop.\n  const collapsedColumnIds = useMemo(\n    () => new Set(collapseEmptyColumns ? columns.filter((col) => col.itemIds.length === 0).map((col) => col.id) : []),\n    [columns, collapseEmptyColumns],\n  );\n\n  const announcements = useMemo(\n    () => buildAnnouncements(displayColumns, items, getItemLabel),\n    [displayColumns, items, getItemLabel],\n  );\n\n  const accessibility = useMemo(\n    () => ({ announcements, screenReaderInstructions: SCREEN_READER_INSTRUCTIONS }),\n    [announcements],\n  );\n\n  function handleKeyDown(event: KeyboardEvent<HTMLDivElement>) {\n    onKeyDown?.(event);\n    if (event.defaultPrevented || activeId !== null || !boardRef.current || !(event.target instanceof HTMLElement))\n      return;\n    if (event.altKey || event.ctrlKey || event.metaKey || event.shiftKey) return;\n    const target = findArrowFocusTarget(boardRef.current, event.target, event.key);\n    if (!target) return;\n    event.preventDefault();\n    target.focus();\n  }\n\n  function handleDragStart({ active }: DragStartEvent) {\n    setActiveId(String(active.id));\n    setActiveIsColumn(isColumnDragData(active.data.current));\n    draggedRectRef.current = active.rect;\n    lastAppliedActiveRectKeyRef.current = null;\n  }\n\n  function handleDragOver({ active, over }: DragOverEvent) {\n    if (!over) return;\n\n    if (isColumnDragData(active.data.current)) {\n      const activeColumnId = String(active.id);\n      const overColumnId = String(over.id);\n\n      setPlacement((prev) => {\n        const base = applyPlacement(columns, prev);\n        const next = moveColumn(base, activeColumnId, overColumnId);\n        return next === base ? prev : findPlacement(next, activeColumnId, true);\n      });\n      return;\n    }\n\n    const activeItemId = String(active.id);\n    const overId = String(over.id);\n    const activeRect = active.rect.current.translated ?? active.rect.current.initial;\n\n    const activeRectKey = activeRect ? `${activeRect.top}:${activeRect.left}` : null;\n    if (activeRectKey !== null && activeRectKey === lastAppliedActiveRectKeyRef.current) {\n      return;\n    }\n    lastAppliedActiveRectKeyRef.current = activeRectKey;\n\n    setPlacement((prev) => {\n      const base = applyPlacement(columns, prev);\n      const next = moveItem(base, activeItemId, overId, { activeRect, overRect: over.rect });\n      return next === base ? prev : findPlacement(next, activeItemId, false);\n    });\n  }\n\n  function handleDragEnd({ over }: DragEndEvent) {\n    handleDragCancel();\n    if (over && !columnsEqual(displayColumns, columns)) onChange(displayColumns);\n  }\n\n  function handleDragCancel() {\n    setActiveId(null);\n    setActiveIsColumn(false);\n    setPlacement(null);\n  }\n\n  const activeColumn = activeId && activeIsColumn ? displayColumns.find((col) => col.id === activeId) : undefined;\n\n  return (\n    <DndContext\n      sensors={sensors}\n      collisionDetection={kanbanCollisionDetection}\n      onDragStart={handleDragStart}\n      onDragOver={handleDragOver}\n      onDragEnd={handleDragEnd}\n      onDragCancel={handleDragCancel}\n      accessibility={accessibility}\n      // A new `canScroll` every render on purpose, see `replanAutoScroll`.\n      autoScroll={{ canScroll: (element) => canScroll(element) }}\n    >\n      <SortableContext id='kanban-columns' items={columnIds} strategy={horizontalListSortingStrategy}>\n        <div {...rest} ref={boardRef} className={cx(styles.board, className)} style={style} onKeyDown={handleKeyDown}>\n          {displayColumns.map((col) => (\n            <KanbanColumn\n              key={col.id}\n              id={col.id}\n              title={col.title}\n              itemIds={col.itemIds}\n              maxItems={col.maxItems}\n              disabled={col.disabled}\n              getItemDisabled={getItemDisabled}\n              getItemLabel={getItemLabel}\n              emptyPlaceholder={renderEmptyColumn?.(col)}\n              actions={renderColumnActions?.(col)}\n              reorderable={reorderableColumns}\n              activeIsColumn={activeId !== null && activeIsColumn}\n              collapsed={collapsedColumnIds.has(col.id)}\n              columnMaxHeight={columnMaxHeight}\n              hasMore={col.hasMore}\n              onLoadMore={onLoadMore ? () => onLoadMore(col.id) : undefined}\n              loadMoreThreshold={loadMoreThreshold}\n              items={items}\n              renderItem={renderItem}\n              dragHandle={dragHandle}\n            />\n          ))}\n        </div>\n      </SortableContext>\n      <DragOverlay>\n        {activeColumn ? (\n          <div className={cx(styles.column, styles.columnDragOverlay)} inert>\n            <div className={styles.columnHeader}>\n              <ColumnHeaderContent\n                title={activeColumn.title}\n                count={activeColumn.itemIds.length}\n                maxItems={activeColumn.maxItems}\n                actions={renderColumnActions?.(activeColumn)}\n              />\n            </div>\n          </div>\n        ) : activeId && !activeIsColumn && items[activeId] !== undefined ? (\n          <div className={cx(styles.dragOverlay, classNames?.dragOverlay)} style={slotStyles?.dragOverlay}>\n            {renderItem(items[activeId], activeId)}\n          </div>\n        ) : null}\n      </DragOverlay>\n    </DndContext>\n  );\n}\n\nexport default KanbanBoard;\n"],"mappings":"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"}

package/dist/esm/common/kanbanBoard/KanbanColumn.mjs

@@ -1,2 +1,2 @@
-"use client";import e from"../loader/loader.mjs";import t from"./kanbanBoard.module.mjs";import n from"./KanbanItem.mjs";import{useCallback as r,useEffect as i,useRef as a,useState as o}from"react";import s from"classnames";import{jsx as c,jsxs as l}from"react/jsx-runtime";import{useDroppable as u}from"@dnd-kit/core";import{SortableContext as d,useSortable as f,verticalListSortingStrategy as p}from"@dnd-kit/sortable";import{CSS as m}from"@dnd-kit/utilities";var h={type:`column`},g={draggable:!0,droppable:!0};function _({id:_,title:v,itemIds:y,items:b,renderItem:x,dragHandle:S,preserveSizeWhileEmpty:C,collapseEmptyColumns:w=!0,maxItems:T,disabled:E,getItemDisabled:D,emptyPlaceholder:O,actions:k,reorderable:A,activeIsColumn:j,columnMaxHeight:M,hasMore:N,onLoadMore:P,loadMoreThreshold:F=100,className:I,style:L,classNames:R,styles:z,...B}){let V=`column-${_}`,{setNodeRef:H,isOver:U}=u({id:V,disabled:E}),W=w&&y.length===0&&!C,G=T!=null&&y.length>T,K=a(null),q=r(e=>{K.current=e,H(e)},[H]),J=a(!1),[Y,X]=o(!1),Z=r(()=>{P&&!J.current&&(J.current=!0,X(!0),Promise.resolve(P()).finally(()=>{J.current=!1,X(!1)}))},[P]),Q=r(e=>{if(!N)return;let t=e.currentTarget;t.scrollTop+t.clientHeight>=t.scrollHeight-F&&Z()},[N,F,Z]),$=a(``);i(()=>{if(!N||!M||Y)return;let e=K.current;if(!e||e.clientHeight===0||e.scrollHeight>e.clientHeight)return;let t=`${y.length}:${e.clientHeight}`;$.current!==t&&($.current=t,Z())},[N,M,Y,y.length,Z]);let{attributes:ee,listeners:te,setNodeRef:ne,transform:re,transition:ie,isDragging:ae,isOver:oe}=f({id:_,data:h,disabled:!A&&g});return l(`div`,{...B,ref:ne,id:_,className:s(t.column,U&&!j&&t.columnOver,oe&&t.columnDropTarget,W&&t.columnEmpty,G&&t.columnOverLimit,E&&t.columnDisabled,ae&&t.columnDragging,I),style:{transform:m.Transform.toString(re),transition:ie,...L},children:[l(`div`,{className:s(t.columnHeader,A&&t.columnHeaderReorderable,R?.header),style:z?.header,...A?ee:void 0,...A?te:void 0,children:[c(`span`,{className:t.columnHeaderTitle,children:v}),l(`div`,{className:t.columnHeaderTrailing,children:[T!=null&&l(`span`,{className:s(t.columnHeaderCount,G&&t.columnHeaderCountOver,R?.count),style:z?.count,children:[y.length,`/`,T]}),k!=null&&c(`div`,{className:s(t.columnHeaderActions,R?.actions),style:z?.actions,children:k})]})]}),c(d,{id:_,items:y,strategy:p,children:l(`div`,{ref:q,className:s(t.columnItems,R?.items),style:{maxHeight:M,overflowY:M?`auto`:void 0,...z?.items},onScroll:M?Q:void 0,children:[y.length===0&&O!=null?c(`div`,{className:s(t.columnPlaceholder,R?.placeholder),style:z?.placeholder,children:O}):null,y.map(e=>c(n,{id:e,dragHandle:S,disabled:E||b[e]!==void 0&&(D?.(b[e],e)??!1),preventAsDropTarget:E,children:b[e]===void 0?null:x(b[e],e)},e)),Y&&c(`div`,{className:s(t.columnLoadingIndicator,R?.loadingIndicator),style:z?.loadingIndicator,children:c(e,{size:`2.6em`})})]})})]})}export{_ as default};
+"use client";import e from"../loader/loader.mjs";import t from"./kanbanBoard.module.mjs";import n from"./KanbanItem.mjs";import{useCallback as r,useEffect as i,useRef as a,useState as o}from"react";import s from"classnames";import{Fragment as c,jsx as l,jsxs as u}from"react/jsx-runtime";import{useDroppable as d}from"@dnd-kit/core";import{SortableContext as f,useSortable as p,verticalListSortingStrategy as m}from"@dnd-kit/sortable";import{CSS as h}from"@dnd-kit/utilities";var g={type:`column`},_={draggable:!0,droppable:!0};function v({title:e,count:n,maxItems:r,actions:i,titleProps:a,classNames:o,styles:d}){let f=r!=null&&n>r;return u(c,{children:[l(`span`,{...a,className:t.columnHeaderTitle,children:e}),u(`div`,{className:t.columnHeaderTrailing,children:[r!=null&&u(`span`,{className:s(t.columnHeaderCount,f&&t.columnHeaderCountOver,o?.count),style:d?.count,children:[n,`/`,r]}),i!=null&&l(`div`,{className:s(t.columnHeaderActions,o?.actions),style:d?.actions,children:i})]})]})}function y({id:c,title:y,itemIds:b,items:x,renderItem:S,dragHandle:C,collapsed:w,maxItems:T,disabled:E,getItemDisabled:D,getItemLabel:O,emptyPlaceholder:k,actions:A,reorderable:j,activeIsColumn:M,columnMaxHeight:N,hasMore:P,onLoadMore:F,loadMoreThreshold:I=100,className:L,style:R,classNames:z,styles:B,...V}){let H=`column-${c}`,{setNodeRef:U,isOver:W}=d({id:H,disabled:E}),G=T!=null&&b.length>T,K=a(null),q=r(e=>{K.current=e,U(e)},[U]),J=a(!1),[Y,X]=o(!1),Z=r(()=>{F&&!J.current&&(J.current=!0,X(!0),Promise.resolve(F()).finally(()=>{J.current=!1,X(!1)}))},[F]),Q=r(e=>{if(!P)return;let t=e.currentTarget;t.scrollTop+t.clientHeight>=t.scrollHeight-I&&Z()},[P,I,Z]),$=a(``);i(()=>{if(!P||Y)return;let e=K.current;if(!e||e.clientHeight===0)return;let t=e.lastElementChild,n=parseFloat(getComputedStyle(e).paddingBottom)||0;if((t?t.offsetTop+t.offsetHeight:0)+n>=e.clientHeight-1)return;let r=`${b.length}:${e.clientHeight}`;$.current!==r&&($.current=r,Z())},[P,Y,b.length,Z]);let{attributes:ee,listeners:te,setNodeRef:ne,setActivatorNodeRef:re,transform:ie,transition:ae,isDragging:oe,isOver:se}=p({id:c,data:g,disabled:!j&&_});return u(`div`,{...V,ref:ne,id:c,"data-kanban-column":``,className:s(t.column,W&&!M&&t.columnOver,se&&t.columnDropTarget,w&&t.columnCollapsed,G&&t.columnOverLimit,E&&t.columnDisabled,oe&&t.columnDragging,L),style:{transform:h.Transform.toString(ie),transition:ae,...R},children:[l(`div`,{className:s(t.columnHeader,j&&t.columnHeaderReorderable,z?.header),style:B?.header,...j?te:void 0,children:l(v,{title:y,count:b.length,maxItems:T,actions:A,titleProps:j?{...ee,ref:re,"data-kanban-handle":``}:void 0,classNames:z,styles:B})}),l(f,{id:c,items:b,strategy:m,children:u(`div`,{ref:q,className:s(t.columnItems,z?.items),style:{maxHeight:N,...B?.items},onScroll:Q,children:[b.length===0&&k!=null?l(`div`,{className:s(t.columnPlaceholder,z?.placeholder),style:B?.placeholder,children:k}):null,b.map(e=>l(n,{id:e,label:x[e]===void 0?void 0:O?.(x[e],e),dragHandle:C,disabled:E||x[e]!==void 0&&(D?.(x[e],e)??!1),preventAsDropTarget:E,children:x[e]===void 0?null:S(x[e],e)},e)),Y&&l(`div`,{className:s(t.columnLoadingIndicator,z?.loadingIndicator),style:B?.loadingIndicator,children:l(e,{size:`2.6em`})})]})})]})}export{v as ColumnHeaderContent,y as default};
 //# sourceMappingURL=KanbanColumn.mjs.map

package/dist/esm/common/kanbanBoard/KanbanColumn.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"KanbanColumn.mjs","names":[],"sources":["../../../../package/common/kanbanBoard/KanbanColumn.tsx"],"sourcesContent":["import type { ReactNode, UIEvent } from 'react';\nimport { useCallback, useEffect, useRef, useState } from 'react';\nimport { useDroppable } from '@dnd-kit/core';\nimport { SortableContext, useSortable, verticalListSortingStrategy } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport cx from 'classnames';\n\nimport type { KanbanColumnProps } from './kanbanBoard.types';\nimport styles from './kanbanBoard.module.pcss';\nimport KanbanItem from './KanbanItem';\nimport Loader from '../loader';\n\n// Hoisted so these are referentially stable across renders — inline literals here would give\n// `useSortable` a new `data`/`disabled` object every render (every column re-renders on every\n// `dragOver` while a drag is in progress, via `shadowColumns`), which can spin dnd-kit's own\n// registration effect into a render loop that eventually trips React's \"Maximum update depth\n// exceeded\" guard. Same fix as the sensor options in `KanbanBoard.tsx`.\nconst COLUMN_SORTABLE_DATA = { type: 'column' };\nconst COLUMN_SORTABLE_DISABLED = { draggable: true, droppable: true };\n\ninterface KanbanColumnInternalProps<T> extends KanbanColumnProps {\n  itemIds: string[];\n  items: Record<string, T>;\n  renderItem: (item: T, id: string) => ReactNode;\n  dragHandle?: boolean;\n  /**\n   * Keep the column at its normal flex width even when `itemIds` is empty. Used while a drag\n   * is in progress: the empty-column collapse is driven by transient shadow state during a\n   * drag, and letting the column shrink mid-drag shifts every column's layout underneath the\n   * pointer, which can flip the collision target back and forth forever.\n   */\n  preserveSizeWhileEmpty?: boolean;\n  /** Shrink to a narrow strip when empty — see `KanbanBoardProps.collapseEmptyColumns`. Defaults to `true`. */\n  collapseEmptyColumns?: boolean;\n  /** Work-in-progress limit — see `KanbanColumnDef.maxItems`. Display-only. */\n  maxItems?: number;\n  /** Freezes the column — see `KanbanColumnDef.disabled`. */\n  disabled?: boolean;\n  /** Returns whether a specific card can't be picked up — see `KanbanBoardProps.getItemDisabled`. */\n  getItemDisabled?: (item: T, id: string) => boolean;\n  /** Custom content shown when the column has no cards — see `KanbanBoardProps.renderEmptyColumn`. */\n  emptyPlaceholder?: ReactNode;\n  /** Custom header actions — see `KanbanBoardProps.renderColumnActions`. */\n  actions?: ReactNode;\n  /** Allow the whole column to be dragged (by its header) to reorder it — see `KanbanBoardProps.reorderableColumns`. */\n  reorderable?: boolean;\n  /**\n   * Whether the card currently being dragged (if any) is actually a column. Suppresses the\n   * cards drop-target highlight, which otherwise lights up on every column a dragged column\n   * passes over — that highlight means \"drop a card here\", which doesn't apply mid-column-drag.\n   */\n  activeIsColumn?: boolean;\n  /** Bounds the column's height and makes its card list scroll — see `KanbanBoardProps.columnMaxHeight`. */\n  columnMaxHeight?: string;\n  /** Whether more items exist for this column — see `KanbanColumnDef.hasMore`. */\n  hasMore?: boolean;\n  /** Requests the next page for this column — see `KanbanBoardProps.onLoadMore`. */\n  onLoadMore?: () => void | Promise<void>;\n  /** Scroll distance from the bottom that triggers `onLoadMore` — see `KanbanBoardProps.loadMoreThreshold`. */\n  loadMoreThreshold?: number;\n}\n\nfunction KanbanColumn<T>({\n  id,\n  title,\n  itemIds,\n  items,\n  renderItem,\n  dragHandle,\n  preserveSizeWhileEmpty,\n  collapseEmptyColumns = true,\n  maxItems,\n  disabled,\n  getItemDisabled,\n  emptyPlaceholder,\n  actions,\n  reorderable,\n  activeIsColumn,\n  columnMaxHeight,\n  hasMore,\n  onLoadMore,\n  loadMoreThreshold = 100,\n  className,\n  style,\n  classNames,\n  styles: slotStyles,\n  ...rest\n}: KanbanColumnInternalProps<T>) {\n  const droppableId = `column-${id}`;\n  const { setNodeRef, isOver } = useDroppable({ id: droppableId, disabled });\n  const isEmpty = collapseEmptyColumns && itemIds.length === 0 && !preserveSizeWhileEmpty;\n  const isOverLimit = maxItems != null && itemIds.length > maxItems;\n\n  const itemsRef = useRef<HTMLDivElement | null>(null);\n  const setItemsRef = useCallback(\n    (node: HTMLDivElement | null) => {\n      itemsRef.current = node;\n      setNodeRef(node);\n    },\n    [setNodeRef],\n  );\n  const isLoadingMoreRef = useRef(false);\n  const [isLoadingMore, setIsLoadingMore] = useState(false);\n\n  const triggerLoadMore = useCallback(() => {\n    if (!onLoadMore || isLoadingMoreRef.current) return;\n    isLoadingMoreRef.current = true;\n    setIsLoadingMore(true);\n    Promise.resolve(onLoadMore()).finally(() => {\n      isLoadingMoreRef.current = false;\n      setIsLoadingMore(false);\n    });\n  }, [onLoadMore]);\n\n  const handleItemsScroll = useCallback(\n    (event: UIEvent<HTMLDivElement>) => {\n      if (!hasMore) return;\n      const el = event.currentTarget;\n      if (el.scrollTop + el.clientHeight >= el.scrollHeight - loadMoreThreshold) triggerLoadMore();\n    },\n    [hasMore, loadMoreThreshold, triggerLoadMore],\n  );\n\n  // The scroll trigger above can only fire once the list actually overflows and scrolls. A batch\n  // smaller than the column's own visible height never generates a scroll event, which would\n  // otherwise dead-end pagination after the first page. Re-probes at most once per (item count,\n  // visible height) pair, so settled content can't re-ask a source that already ran dry.\n  const fillProbeRef = useRef('');\n  useEffect(() => {\n    if (!hasMore || !columnMaxHeight || isLoadingMore) return;\n    const el = itemsRef.current;\n    if (!el || el.clientHeight === 0) return;\n    if (el.scrollHeight > el.clientHeight) return;\n    const probe = `${itemIds.length}:${el.clientHeight}`;\n    if (fillProbeRef.current === probe) return;\n    fillProbeRef.current = probe;\n    triggerLoadMore();\n  }, [hasMore, columnMaxHeight, isLoadingMore, itemIds.length, triggerLoadMore]);\n\n  const {\n    attributes: columnAttributes,\n    listeners: columnListeners,\n    setNodeRef: setColumnNodeRef,\n    transform: columnTransform,\n    transition: columnTransition,\n    isDragging: isColumnDragging,\n    isOver: isColumnOver,\n  } = useSortable({\n    id,\n    data: COLUMN_SORTABLE_DATA,\n    disabled: reorderable ? false : COLUMN_SORTABLE_DISABLED,\n  });\n\n  return (\n    <div\n      {...rest}\n      ref={setColumnNodeRef}\n      id={id}\n      className={cx(\n        styles.column,\n        isOver && !activeIsColumn && styles.columnOver,\n        isColumnOver && styles.columnDropTarget,\n        isEmpty && styles.columnEmpty,\n        isOverLimit && styles.columnOverLimit,\n        disabled && styles.columnDisabled,\n        isColumnDragging && styles.columnDragging,\n        className,\n      )}\n      style={{ transform: CSS.Transform.toString(columnTransform), transition: columnTransition, ...style }}\n    >\n      <div\n        className={cx(styles.columnHeader, reorderable && styles.columnHeaderReorderable, classNames?.header)}\n        style={slotStyles?.header}\n        {...(reorderable ? columnAttributes : undefined)}\n        {...(reorderable ? columnListeners : undefined)}\n      >\n        <span className={styles.columnHeaderTitle}>{title}</span>\n        <div className={styles.columnHeaderTrailing}>\n          {maxItems != null && (\n            <span\n              className={cx(styles.columnHeaderCount, isOverLimit && styles.columnHeaderCountOver, classNames?.count)}\n              style={slotStyles?.count}\n            >\n              {itemIds.length}/{maxItems}\n            </span>\n          )}\n          {actions != null && (\n            <div className={cx(styles.columnHeaderActions, classNames?.actions)} style={slotStyles?.actions}>\n              {actions}\n            </div>\n          )}\n        </div>\n      </div>\n      <SortableContext id={id} items={itemIds} strategy={verticalListSortingStrategy}>\n        <div\n          ref={setItemsRef}\n          className={cx(styles.columnItems, classNames?.items)}\n          style={{ maxHeight: columnMaxHeight, overflowY: columnMaxHeight ? 'auto' : undefined, ...slotStyles?.items }}\n          onScroll={columnMaxHeight ? handleItemsScroll : undefined}\n        >\n          {itemIds.length === 0 && emptyPlaceholder != null ? (\n            <div className={cx(styles.columnPlaceholder, classNames?.placeholder)} style={slotStyles?.placeholder}>\n              {emptyPlaceholder}\n            </div>\n          ) : null}\n          {itemIds.map((itemId) => (\n            <KanbanItem\n              key={itemId}\n              id={itemId}\n              dragHandle={dragHandle}\n              disabled={\n                disabled || (items[itemId] !== undefined && (getItemDisabled?.(items[itemId], itemId) ?? false))\n              }\n              preventAsDropTarget={disabled}\n            >\n              {items[itemId] !== undefined ? renderItem(items[itemId], itemId) : null}\n            </KanbanItem>\n          ))}\n          {isLoadingMore && (\n            <div\n              className={cx(styles.columnLoadingIndicator, classNames?.loadingIndicator)}\n              style={slotStyles?.loadingIndicator}\n            >\n              <Loader size='2.6em' />\n            </div>\n          )}\n        </div>\n      </SortableContext>\n    </div>\n  );\n}\n\nexport default KanbanColumn;\n"],"mappings":"8cAiBA,IAAM,EAAuB,CAAE,KAAM,QAAS,EACxC,EAA2B,CAAE,UAAW,GAAM,UAAW,EAAK,EA4CpE,SAAS,EAAgB,CACvB,KACA,QACA,UACA,QACA,aACA,aACA,yBACA,uBAAuB,GACvB,WACA,WACA,kBACA,mBACA,UACA,cACA,iBACA,kBACA,UACA,aACA,oBAAoB,IACpB,YACA,QACA,aACA,OAAQ,EACR,GAAG,GAC4B,CAC/B,IAAM,EAAc,UAAU,IACxB,CAAE,aAAY,UAAW,EAAa,CAAE,GAAI,EAAa,UAAS,CAAC,EACnE,EAAU,GAAwB,EAAQ,SAAW,GAAK,CAAC,EAC3D,EAAc,GAAY,MAAQ,EAAQ,OAAS,EAEnD,EAAW,EAA8B,IAAI,EAC7C,EAAc,EACjB,GAAgC,CAC/B,EAAS,QAAU,EACnB,EAAW,CAAI,CACjB,EACA,CAAC,CAAU,CACb,EACM,EAAmB,EAAO,EAAK,EAC/B,CAAC,EAAe,GAAoB,EAAS,EAAK,EAElD,EAAkB,MAAkB,CACnC,GAAc,GAAiB,UACpC,EAAiB,QAAU,GAC3B,EAAiB,EAAI,EACrB,QAAQ,QAAQ,EAAW,CAAC,CAAC,CAAC,YAAc,CAC1C,EAAiB,QAAU,GAC3B,EAAiB,EAAK,CACxB,CAAC,EACH,EAAG,CAAC,CAAU,CAAC,EAET,EAAoB,EACvB,GAAmC,CAClC,GAAI,CAAC,EAAS,OACd,IAAM,EAAK,EAAM,cACb,EAAG,UAAY,EAAG,cAAgB,EAAG,aAAe,GAAmB,EAAgB,CAC7F,EACA,CAAC,EAAS,EAAmB,CAAe,CAC9C,EAMM,EAAe,EAAO,EAAE,EAC9B,MAAgB,CACd,GAAI,CAAC,GAAW,CAAC,GAAmB,EAAe,OACnD,IAAM,EAAK,EAAS,QAEpB,GADI,CAAC,GAAM,EAAG,eAAiB,GAC3B,EAAG,aAAe,EAAG,aAAc,OACvC,IAAM,EAAQ,GAAG,EAAQ,OAAO,GAAG,EAAG,eAClC,EAAa,UAAY,IAC7B,EAAa,QAAU,EACvB,EAAgB,EAClB,EAAG,CAAC,EAAS,EAAiB,EAAe,EAAQ,OAAQ,CAAe,CAAC,EAE7E,GAAM,CACJ,WAAY,GACZ,UAAW,GACX,WAAY,GACZ,UAAW,GACX,WAAY,GACZ,WAAY,GACZ,OAAQ,IACN,EAAY,CACd,KACA,KAAM,EACN,SAAU,IAAsB,CAClC,CAAC,EAED,OACE,EAAC,MAAD,CACE,GAAI,EACJ,IAAK,GACD,KACJ,UAAW,EACT,EAAO,OACP,GAAU,CAAC,GAAkB,EAAO,WACpC,IAAgB,EAAO,iBACvB,GAAW,EAAO,YAClB,GAAe,EAAO,gBACtB,GAAY,EAAO,eACnB,IAAoB,EAAO,eAC3B,CACF,EACA,MAAO,CAAE,UAAW,EAAI,UAAU,SAAS,EAAe,EAAG,WAAY,GAAkB,GAAG,CAAM,EAdtG,SAAA,CAgBE,EAAC,MAAD,CACE,UAAW,EAAG,EAAO,aAAc,GAAe,EAAO,wBAAyB,GAAY,MAAM,EACpG,MAAO,GAAY,OACnB,GAAK,EAAc,GAAmB,IAAA,GACtC,GAAK,EAAc,GAAkB,IAAA,GAJvC,SAAA,CAME,EAAC,OAAD,CAAM,UAAW,EAAO,kBAAoB,SAAA,CAAY,CAAA,EACxD,EAAC,MAAD,CAAK,UAAW,EAAO,qBAAvB,SAAA,CACG,GAAY,MACX,EAAC,OAAD,CACE,UAAW,EAAG,EAAO,kBAAmB,GAAe,EAAO,sBAAuB,GAAY,KAAK,EACtG,MAAO,GAAY,MAFrB,SAAA,CAIG,EAAQ,OAAO,IAAE,CACd,CAEP,CAAA,EAAA,GAAW,MACV,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,oBAAqB,GAAY,OAAO,EAAG,MAAO,GAAY,QACrF,SAAA,CACE,CAAA,CAEJ,CACF,CAAA,CAAA,CACL,CAAA,EAAA,EAAC,EAAD,CAAqB,KAAI,MAAO,EAAS,SAAU,EACjD,SAAA,EAAC,MAAD,CACE,IAAK,EACL,UAAW,EAAG,EAAO,YAAa,GAAY,KAAK,EACnD,MAAO,CAAE,UAAW,EAAiB,UAAW,EAAkB,OAAS,IAAA,GAAW,GAAG,GAAY,KAAM,EAC3G,SAAU,EAAkB,EAAoB,IAAA,GAJlD,SAAA,CAMG,EAAQ,SAAW,GAAK,GAAoB,KAC3C,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,kBAAmB,GAAY,WAAW,EAAG,MAAO,GAAY,YACvF,SAAA,CACE,CAAA,EACH,KACH,EAAQ,IAAK,GACZ,EAAC,EAAD,CAEE,GAAI,EACQ,aACZ,SACE,GAAa,EAAM,KAAY,IAAA,KAAc,IAAkB,EAAM,GAAS,CAAM,GAAK,IAE3F,oBAAqB,EAEpB,SAAA,EAAM,KAAY,IAAA,GAAgD,KAApC,EAAW,EAAM,GAAS,CAAM,CACrD,EATL,CASK,CACb,EACA,GACC,EAAC,MAAD,CACE,UAAW,EAAG,EAAO,uBAAwB,GAAY,gBAAgB,EACzE,MAAO,GAAY,iBAEnB,SAAA,EAAC,EAAD,CAAQ,KAAK,OAAS,CAAA,CACnB,CAAA,CAEJ,GACU,CAAA,CACd,GAET"}
+{"version":3,"file":"KanbanColumn.mjs","names":[],"sources":["../../../../package/common/kanbanBoard/KanbanColumn.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode, Ref, UIEvent } from 'react';\nimport { useCallback, useEffect, useRef, useState } from 'react';\nimport { useDroppable } from '@dnd-kit/core';\nimport { SortableContext, useSortable, verticalListSortingStrategy } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport cx from 'classnames';\n\nimport type { DataProps, SlotClassNames, SlotStyles } from '../types/slots.types';\nimport type { KanbanColumnProps, KanbanColumnSlots } from './kanbanBoard.types';\nimport styles from './kanbanBoard.module.pcss';\nimport KanbanItem from './KanbanItem';\nimport Loader from '../loader';\n\n// Hoisted so these are referentially stable across renders — inline literals here would give\n// `useSortable` a new `data`/`disabled` object every render (every column re-renders on every\n// `dragOver` while a drag is in progress, via the board's `placement`), which can spin dnd-kit's own\n// registration effect into a render loop that eventually trips React's \"Maximum update depth\n// exceeded\" guard. Same fix as the sensor options in `KanbanBoard.tsx`.\nconst COLUMN_SORTABLE_DATA = { type: 'column' };\nconst COLUMN_SORTABLE_DISABLED = { draggable: true, droppable: true };\n\ninterface KanbanColumnInternalProps<T> extends KanbanColumnProps {\n  itemIds: string[];\n  items: Record<string, T>;\n  renderItem: (item: T, id: string) => ReactNode;\n  dragHandle?: boolean;\n  /** Shrink to a narrow strip. The board decides when, see `KanbanBoardProps.collapseEmptyColumns`. */\n  collapsed?: boolean;\n  /** Work-in-progress limit — see `KanbanColumnDef.maxItems`. Display-only. */\n  maxItems?: number;\n  /** Freezes the column — see `KanbanColumnDef.disabled`. */\n  disabled?: boolean;\n  /** Returns whether a specific card can't be picked up — see `KanbanBoardProps.getItemDisabled`. */\n  getItemDisabled?: (item: T, id: string) => boolean;\n  /** Names a card's drag handle — see `KanbanBoardProps.getItemLabel`. */\n  getItemLabel?: (item: T, id: string) => string;\n  /** Custom content shown when the column has no cards — see `KanbanBoardProps.renderEmptyColumn`. */\n  emptyPlaceholder?: ReactNode;\n  /** Custom header actions — see `KanbanBoardProps.renderColumnActions`. */\n  actions?: ReactNode;\n  /** Allow the whole column to be dragged (by its header) to reorder it — see `KanbanBoardProps.reorderableColumns`. */\n  reorderable?: boolean;\n  /**\n   * Whether the card currently being dragged (if any) is actually a column. Suppresses the\n   * cards drop-target highlight, which otherwise lights up on every column a dragged column\n   * passes over — that highlight means \"drop a card here\", which doesn't apply mid-column-drag.\n   */\n  activeIsColumn?: boolean;\n  /** Bounds the column's height and makes its card list scroll — see `KanbanBoardProps.columnMaxHeight`. */\n  columnMaxHeight?: string;\n  /** Whether more items exist for this column — see `KanbanColumnDef.hasMore`. */\n  hasMore?: boolean;\n  /** Requests the next page for this column — see `KanbanBoardProps.onLoadMore`. */\n  onLoadMore?: () => void | Promise<void>;\n  /** Scroll distance from the bottom that triggers `onLoadMore` — see `KanbanBoardProps.loadMoreThreshold`. */\n  loadMoreThreshold?: number;\n}\n\ninterface ColumnHeaderContentProps {\n  title: string;\n  count: number;\n  maxItems?: number;\n  actions?: ReactNode;\n  /** Makes the title the column's keyboard drag handle. */\n  titleProps?: HTMLAttributes<HTMLSpanElement> & DataProps & { ref?: Ref<HTMLSpanElement> };\n  classNames?: SlotClassNames<KanbanColumnSlots>;\n  styles?: SlotStyles<KanbanColumnSlots>;\n}\n\n// Also rendered by the drag overlay: with the title alone, the overlay was shorter than the header\n// it covers, and the faded original showed below it.\nexport function ColumnHeaderContent({\n  title,\n  count,\n  maxItems,\n  actions,\n  titleProps,\n  classNames,\n  styles: slotStyles,\n}: ColumnHeaderContentProps) {\n  const isOverLimit = maxItems != null && count > maxItems;\n  return (\n    <>\n      <span {...titleProps} className={styles.columnHeaderTitle}>\n        {title}\n      </span>\n      <div className={styles.columnHeaderTrailing}>\n        {maxItems != null && (\n          <span\n            className={cx(styles.columnHeaderCount, isOverLimit && styles.columnHeaderCountOver, classNames?.count)}\n            style={slotStyles?.count}\n          >\n            {count}/{maxItems}\n          </span>\n        )}\n        {actions != null && (\n          <div className={cx(styles.columnHeaderActions, classNames?.actions)} style={slotStyles?.actions}>\n            {actions}\n          </div>\n        )}\n      </div>\n    </>\n  );\n}\n\nfunction KanbanColumn<T>({\n  id,\n  title,\n  itemIds,\n  items,\n  renderItem,\n  dragHandle,\n  collapsed,\n  maxItems,\n  disabled,\n  getItemDisabled,\n  getItemLabel,\n  emptyPlaceholder,\n  actions,\n  reorderable,\n  activeIsColumn,\n  columnMaxHeight,\n  hasMore,\n  onLoadMore,\n  loadMoreThreshold = 100,\n  className,\n  style,\n  classNames,\n  styles: slotStyles,\n  ...rest\n}: KanbanColumnInternalProps<T>) {\n  const droppableId = `column-${id}`;\n  const { setNodeRef, isOver } = useDroppable({ id: droppableId, disabled });\n  const isOverLimit = maxItems != null && itemIds.length > maxItems;\n\n  const itemsRef = useRef<HTMLDivElement | null>(null);\n  const setItemsRef = useCallback(\n    (node: HTMLDivElement | null) => {\n      itemsRef.current = node;\n      setNodeRef(node);\n    },\n    [setNodeRef],\n  );\n  const isLoadingMoreRef = useRef(false);\n  const [isLoadingMore, setIsLoadingMore] = useState(false);\n\n  const triggerLoadMore = useCallback(() => {\n    if (!onLoadMore || isLoadingMoreRef.current) return;\n    isLoadingMoreRef.current = true;\n    setIsLoadingMore(true);\n    Promise.resolve(onLoadMore()).finally(() => {\n      isLoadingMoreRef.current = false;\n      setIsLoadingMore(false);\n    });\n  }, [onLoadMore]);\n\n  const handleItemsScroll = useCallback(\n    (event: UIEvent<HTMLDivElement>) => {\n      if (!hasMore) return;\n      const el = event.currentTarget;\n      if (el.scrollTop + el.clientHeight >= el.scrollHeight - loadMoreThreshold) triggerLoadMore();\n    },\n    [hasMore, loadMoreThreshold, triggerLoadMore],\n  );\n\n  // The scroll trigger above can only fire once the list actually overflows and scrolls. A batch\n  // smaller than the column's own visible height never generates a scroll event, which would\n  // otherwise dead-end pagination after the first page. Re-probes at most once per (item count,\n  // visible height) pair, so settled content can't re-ask a source that already ran dry.\n  //\n  // It asks while the cards leave empty space below them, not while the list fails to overflow:\n  // on a board that grows with its cards no list ever overflows, and that rule loaded every page.\n  // This one fills a short column up to the tallest and stops.\n  const fillProbeRef = useRef('');\n  useEffect(() => {\n    if (!hasMore || isLoadingMore) return;\n    const el = itemsRef.current;\n    if (!el || el.clientHeight === 0) return;\n    const last = el.lastElementChild as HTMLElement | null;\n    const paddingBottom = parseFloat(getComputedStyle(el).paddingBottom) || 0;\n    if ((last ? last.offsetTop + last.offsetHeight : 0) + paddingBottom >= el.clientHeight - 1) return;\n    const probe = `${itemIds.length}:${el.clientHeight}`;\n    if (fillProbeRef.current === probe) return;\n    fillProbeRef.current = probe;\n    triggerLoadMore();\n  }, [hasMore, isLoadingMore, itemIds.length, triggerLoadMore]);\n\n  const {\n    attributes: columnAttributes,\n    listeners: columnListeners,\n    setNodeRef: setColumnNodeRef,\n    setActivatorNodeRef: setColumnActivatorRef,\n    transform: columnTransform,\n    transition: columnTransition,\n    isDragging: isColumnDragging,\n    isOver: isColumnOver,\n  } = useSortable({\n    id,\n    data: COLUMN_SORTABLE_DATA,\n    disabled: reorderable ? false : COLUMN_SORTABLE_DISABLED,\n  });\n\n  return (\n    <div\n      {...rest}\n      ref={setColumnNodeRef}\n      id={id}\n      data-kanban-column=''\n      className={cx(\n        styles.column,\n        isOver && !activeIsColumn && styles.columnOver,\n        isColumnOver && styles.columnDropTarget,\n        collapsed && styles.columnCollapsed,\n        isOverLimit && styles.columnOverLimit,\n        disabled && styles.columnDisabled,\n        isColumnDragging && styles.columnDragging,\n        className,\n      )}\n      style={{ transform: CSS.Transform.toString(columnTransform), transition: columnTransition, ...style }}\n    >\n      {/* The whole header is the pointer grab area, but only the title is the keyboard handle: a\n          focusable header was a button around the actions' own buttons, and the Enter meant for\n          one of them picked the column up instead. */}\n      <div\n        className={cx(styles.columnHeader, reorderable && styles.columnHeaderReorderable, classNames?.header)}\n        style={slotStyles?.header}\n        {...(reorderable ? columnListeners : undefined)}\n      >\n        <ColumnHeaderContent\n          title={title}\n          count={itemIds.length}\n          maxItems={maxItems}\n          actions={actions}\n          titleProps={\n            reorderable ? { ...columnAttributes, ref: setColumnActivatorRef, 'data-kanban-handle': '' } : undefined\n          }\n          classNames={classNames}\n          styles={slotStyles}\n        />\n      </div>\n      <SortableContext id={id} items={itemIds} strategy={verticalListSortingStrategy}>\n        <div\n          ref={setItemsRef}\n          className={cx(styles.columnItems, classNames?.items)}\n          style={{ maxHeight: columnMaxHeight, ...slotStyles?.items }}\n          onScroll={handleItemsScroll}\n        >\n          {itemIds.length === 0 && emptyPlaceholder != null ? (\n            <div className={cx(styles.columnPlaceholder, classNames?.placeholder)} style={slotStyles?.placeholder}>\n              {emptyPlaceholder}\n            </div>\n          ) : null}\n          {itemIds.map((itemId) => (\n            <KanbanItem\n              key={itemId}\n              id={itemId}\n              label={items[itemId] !== undefined ? getItemLabel?.(items[itemId], itemId) : undefined}\n              dragHandle={dragHandle}\n              disabled={\n                disabled || (items[itemId] !== undefined && (getItemDisabled?.(items[itemId], itemId) ?? false))\n              }\n              preventAsDropTarget={disabled}\n            >\n              {items[itemId] !== undefined ? renderItem(items[itemId], itemId) : null}\n            </KanbanItem>\n          ))}\n          {isLoadingMore && (\n            <div\n              className={cx(styles.columnLoadingIndicator, classNames?.loadingIndicator)}\n              style={slotStyles?.loadingIndicator}\n            >\n              <Loader size='2.6em' />\n            </div>\n          )}\n        </div>\n      </SortableContext>\n    </div>\n  );\n}\n\nexport default KanbanColumn;\n"],"mappings":"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"}

package/dist/esm/common/kanbanBoard/KanbanItem.mjs

@@ -1,2 +1,2 @@
-"use client";import e from"./kanbanBoard.module.mjs";import t from"classnames";import{jsx as n}from"react/jsx-runtime";import{useSortable as r}from"@dnd-kit/sortable";import{CSS as i}from"@dnd-kit/utilities";var a={draggable:!0,droppable:!0},o={draggable:!0,droppable:!1};function s({id:s,dragHandle:c,disabled:l,preventAsDropTarget:u,children:d}){let{attributes:f,listeners:p,setNodeRef:m,transform:h,transition:g,isDragging:_}=r({id:s,disabled:l?u?a:o:void 0});function v(e){e.target.closest(`[data-drag-handle]`)&&p?.onPointerDown?.(e)}return n(`div`,{ref:m,style:{transform:i.Transform.toString(h),transition:g},className:t(e.item,c&&e.itemHandled,_&&e.itemDragging,l&&e.itemDisabled),...f,...p,onPointerDown:c?v:p?.onPointerDown,children:d})}export{s as default};
+"use client";import e from"./kanbanBoard.module.mjs";import{useCallback as t,useLayoutEffect as n,useRef as r}from"react";import i from"classnames";import{jsx as a}from"react/jsx-runtime";import{useSortable as o}from"@dnd-kit/sortable";import{CSS as s}from"@dnd-kit/utilities";var c={draggable:!0,droppable:!0},l={draggable:!0,droppable:!1};function u({id:u,label:d,dragHandle:f,disabled:p,preventAsDropTarget:m,children:h}){let{attributes:g,listeners:_,setNodeRef:v,setActivatorNodeRef:y,transform:b,transition:x,isDragging:S}=o({id:u,disabled:p?m?c:l:void 0}),C=r(null),w=t(e=>{C.current=e,v(e),f||y(e)},[v,y,f]);n(()=>{if(!f)return;let e=C.current?.querySelector(`[data-drag-handle]`)??null;if(y(e),!e)return;e.tabIndex<0&&(e.tabIndex=0),e.tagName!==`BUTTON`&&!e.hasAttribute(`role`)&&e.setAttribute(`role`,`button`);let t=e.hasAttribute(`data-kanban-label`);d&&(t||!(e.hasAttribute(`aria-label`)||e.hasAttribute(`aria-labelledby`)))&&(e.setAttribute(`aria-label`,d),e.setAttribute(`data-kanban-label`,``)),e.setAttribute(`data-kanban-card`,``);for(let[t,n]of Object.entries(g))t!==`role`&&t!==`tabIndex`&&(n===void 0?e.removeAttribute(t):e.setAttribute(t,String(n)))});let T=f&&_?Object.fromEntries(Object.entries(_).map(([e,t])=>[e,e=>{e.target.closest(`[data-drag-handle]`)&&t(e)}])):_;return a(`div`,{ref:w,"data-kanban-card":f?void 0:``,style:{transform:s.Transform.toString(b),transition:x},className:i(e.item,f&&e.itemHandled,S&&e.itemDragging,p&&e.itemDisabled),...f?void 0:g,...T,children:h})}export{u as default};
 //# sourceMappingURL=KanbanItem.mjs.map

package/dist/esm/common/kanbanBoard/KanbanItem.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"KanbanItem.mjs","names":[],"sources":["../../../../package/common/kanbanBoard/KanbanItem.tsx"],"sourcesContent":["import type { PointerEvent as ReactPointerEvent, PointerEventHandler } from 'react';\nimport { useSortable } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport cx from 'classnames';\n\nimport type { KanbanItemProps } from './kanbanBoard.types';\nimport styles from './kanbanBoard.module.pcss';\n\n// Hoisted so these are referentially stable across renders — an inline object literal here would\n// give `useSortable` a new `disabled` value every render (every card re-renders on every\n// `dragOver` while a drag is in progress, via `shadowColumns`), which can spin dnd-kit's own\n// registration effect into a render loop that eventually trips React's \"Maximum update depth\n// exceeded\" guard. Same fix as the sensor options in `KanbanBoard.tsx` and `data`/`disabled` in\n// `KanbanColumn.tsx`. Only two shapes are ever needed, so both are hoisted rather than memoized.\nconst ITEM_DISABLED_DRAG_AND_DROP = { draggable: true, droppable: true };\nconst ITEM_DISABLED_DRAG_ONLY = { draggable: true, droppable: false };\n\nfunction KanbanItem({ id, dragHandle, disabled, preventAsDropTarget, children }: KanbanItemProps) {\n  const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({\n    id,\n    // The boolean shorthand only disables dragging *out* of the card — dnd-kit hard-codes\n    // `droppable: false` for it either way (\"backwards compatibility\"). That's actually what we\n    // want for a card pinned individually (`getItemDisabled`): it can't be dragged, but other\n    // cards should still be able to land before/after it normally. Only a frozen *column*\n    // (`preventAsDropTarget`) also disables droppable, so nothing can be dropped into it at all.\n    disabled: disabled ? (preventAsDropTarget ? ITEM_DISABLED_DRAG_AND_DROP : ITEM_DISABLED_DRAG_ONLY) : undefined,\n  });\n\n  function handlePointerDown(event: ReactPointerEvent<HTMLDivElement>) {\n    if (!(event.target as HTMLElement).closest('[data-drag-handle]')) return;\n    listeners?.onPointerDown?.(event);\n  }\n\n  return (\n    <div\n      ref={setNodeRef}\n      style={{ transform: CSS.Transform.toString(transform), transition }}\n      className={cx(\n        styles.item,\n        dragHandle && styles.itemHandled,\n        isDragging && styles.itemDragging,\n        disabled && styles.itemDisabled,\n      )}\n      {...attributes}\n      {...listeners}\n      onPointerDown={\n        dragHandle ? handlePointerDown : (listeners?.onPointerDown as PointerEventHandler<HTMLDivElement> | undefined)\n      }\n    >\n      {children}\n    </div>\n  );\n}\n\nexport default KanbanItem;\n"],"mappings":"gNAcA,IAAM,EAA8B,CAAE,UAAW,GAAM,UAAW,EAAK,EACjE,EAA0B,CAAE,UAAW,GAAM,UAAW,EAAM,EAEpE,SAAS,EAAW,CAAE,KAAI,aAAY,WAAU,sBAAqB,YAA6B,CAChG,GAAM,CAAE,aAAY,YAAW,aAAY,YAAW,aAAY,cAAe,EAAY,CAC3F,KAMA,SAAU,EAAY,EAAsB,EAA8B,EAA2B,IAAA,EACvG,CAAC,EAED,SAAS,EAAkB,EAA0C,CAC7D,EAAM,OAAuB,QAAQ,oBAAoB,GAC/D,GAAW,gBAAgB,CAAK,CAClC,CAEA,OACE,EAAC,MAAD,CACE,IAAK,EACL,MAAO,CAAE,UAAW,EAAI,UAAU,SAAS,CAAS,EAAG,YAAW,EAClE,UAAW,EACT,EAAO,KACP,GAAc,EAAO,YACrB,GAAc,EAAO,aACrB,GAAY,EAAO,YACrB,EACA,GAAI,EACJ,GAAI,EACJ,cACE,EAAa,EAAqB,GAAW,cAG9C,UACE,CAAA,CAET"}
+{"version":3,"file":"KanbanItem.mjs","names":[],"sources":["../../../../package/common/kanbanBoard/KanbanItem.tsx"],"sourcesContent":["import type { SyntheticEvent } from 'react';\nimport { useCallback, useLayoutEffect, useRef } from 'react';\nimport { useSortable } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport cx from 'classnames';\n\nimport type { KanbanItemProps } from './kanbanBoard.types';\nimport styles from './kanbanBoard.module.pcss';\n\n// Hoisted so these are referentially stable across renders — an inline object literal here would\n// give `useSortable` a new `disabled` value every render (every card re-renders on every\n// `dragOver` while a drag is in progress, via the board's `placement`), which can spin dnd-kit's own\n// registration effect into a render loop that eventually trips React's \"Maximum update depth\n// exceeded\" guard. Same fix as the sensor options in `KanbanBoard.tsx` and `data`/`disabled` in\n// `KanbanColumn.tsx`. Only two shapes are ever needed, so both are hoisted rather than memoized.\nconst ITEM_DISABLED_DRAG_AND_DROP = { draggable: true, droppable: true };\nconst ITEM_DISABLED_DRAG_ONLY = { draggable: true, droppable: false };\n\nfunction KanbanItem({ id, label, dragHandle, disabled, preventAsDropTarget, children }: KanbanItemProps) {\n  const { attributes, listeners, setNodeRef, setActivatorNodeRef, transform, transition, isDragging } = useSortable({\n    id,\n    // The boolean shorthand only disables dragging *out* of the card — dnd-kit hard-codes\n    // `droppable: false` for it either way (\"backwards compatibility\"). That's actually what we\n    // want for a card pinned individually (`getItemDisabled`): it can't be dragged, but other\n    // cards should still be able to land before/after it normally. Only a frozen *column*\n    // (`preventAsDropTarget`) also disables droppable, so nothing can be dropped into it at all.\n    disabled: disabled ? (preventAsDropTarget ? ITEM_DISABLED_DRAG_AND_DROP : ITEM_DISABLED_DRAG_ONLY) : undefined,\n  });\n\n  // Without an activator, dnd-kit starts a drag for a Space or Enter bubbling up from anything\n  // inside the card, and cancels it: a button in the card could not be pressed, nor a space typed.\n  const nodeRef = useRef<HTMLDivElement | null>(null);\n  const setRefs = useCallback(\n    (node: HTMLDivElement | null) => {\n      nodeRef.current = node;\n      setNodeRef(node);\n      if (!dragHandle) setActivatorNodeRef(node);\n    },\n    [setNodeRef, setActivatorNodeRef, dragHandle],\n  );\n\n  // With `dragHandle`, the handle is the keyboard handle too, and the card a plain container: as a\n  // button, the card wrapped its own controls, which a screen reader then reads as text. The\n  // handle is the consumer's element, so it gets the drag semantics here rather than as props.\n  // No dependencies: the consumer can re-render the handle at any time.\n  useLayoutEffect(() => {\n    if (!dragHandle) return;\n    const handle = nodeRef.current?.querySelector<HTMLElement>('[data-drag-handle]') ?? null;\n    setActivatorNodeRef(handle);\n    if (!handle) return;\n    if (handle.tabIndex < 0) handle.tabIndex = 0;\n    if (handle.tagName !== 'BUTTON' && !handle.hasAttribute('role')) handle.setAttribute('role', 'button');\n    const namedByUs = handle.hasAttribute('data-kanban-label');\n    if (label && (namedByUs || !(handle.hasAttribute('aria-label') || handle.hasAttribute('aria-labelledby')))) {\n      handle.setAttribute('aria-label', label);\n      handle.setAttribute('data-kanban-label', '');\n    }\n    handle.setAttribute('data-kanban-card', '');\n    for (const [name, value] of Object.entries(attributes)) {\n      if (name === 'role' || name === 'tabIndex') continue;\n      if (value === undefined) handle.removeAttribute(name);\n      else handle.setAttribute(name, String(value));\n    }\n  });\n\n  // dnd-kit's listeners are a new object every render, so wrapping them per render costs nothing.\n  const handleListeners =\n    dragHandle && listeners\n      ? Object.fromEntries(\n          Object.entries(listeners).map(([name, listener]) => [\n            name,\n            (event: SyntheticEvent) => {\n              if ((event.target as HTMLElement).closest('[data-drag-handle]')) listener(event);\n            },\n          ]),\n        )\n      : listeners;\n\n  return (\n    <div\n      ref={setRefs}\n      data-kanban-card={dragHandle ? undefined : ''}\n      style={{ transform: CSS.Transform.toString(transform), transition }}\n      className={cx(\n        styles.item,\n        dragHandle && styles.itemHandled,\n        isDragging && styles.itemDragging,\n        disabled && styles.itemDisabled,\n      )}\n      {...(dragHandle ? undefined : attributes)}\n      {...handleListeners}\n    >\n      {children}\n    </div>\n  );\n}\n\nexport default KanbanItem;\n"],"mappings":"qRAeA,IAAM,EAA8B,CAAE,UAAW,GAAM,UAAW,EAAK,EACjE,EAA0B,CAAE,UAAW,GAAM,UAAW,EAAM,EAEpE,SAAS,EAAW,CAAE,KAAI,QAAO,aAAY,WAAU,sBAAqB,YAA6B,CACvG,GAAM,CAAE,aAAY,YAAW,aAAY,sBAAqB,YAAW,aAAY,cAAe,EAAY,CAChH,KAMA,SAAU,EAAY,EAAsB,EAA8B,EAA2B,IAAA,EACvG,CAAC,EAIK,EAAU,EAA8B,IAAI,EAC5C,EAAU,EACb,GAAgC,CAC/B,EAAQ,QAAU,EAClB,EAAW,CAAI,EACV,GAAY,EAAoB,CAAI,CAC3C,EACA,CAAC,EAAY,EAAqB,CAAU,CAC9C,EAMA,MAAsB,CACpB,GAAI,CAAC,EAAY,OACjB,IAAM,EAAS,EAAQ,SAAS,cAA2B,oBAAoB,GAAK,KAEpF,GADA,EAAoB,CAAM,EACtB,CAAC,EAAQ,OACT,EAAO,SAAW,IAAG,EAAO,SAAW,GACvC,EAAO,UAAY,UAAY,CAAC,EAAO,aAAa,MAAM,GAAG,EAAO,aAAa,OAAQ,QAAQ,EACrG,IAAM,EAAY,EAAO,aAAa,mBAAmB,EACrD,IAAU,GAAa,EAAE,EAAO,aAAa,YAAY,GAAK,EAAO,aAAa,iBAAiB,MACrG,EAAO,aAAa,aAAc,CAAK,EACvC,EAAO,aAAa,oBAAqB,EAAE,GAE7C,EAAO,aAAa,mBAAoB,EAAE,EAC1C,IAAK,GAAM,CAAC,EAAM,KAAU,OAAO,QAAQ,CAAU,EAC/C,IAAS,QAAU,IAAS,aAC5B,IAAU,IAAA,GAAW,EAAO,gBAAgB,CAAI,EAC/C,EAAO,aAAa,EAAM,OAAO,CAAK,CAAC,EAEhD,CAAC,EAGD,IAAM,EACJ,GAAc,EACV,OAAO,YACL,OAAO,QAAQ,CAAS,CAAC,CAAC,KAAK,CAAC,EAAM,KAAc,CAClD,EACC,GAA0B,CACpB,EAAM,OAAuB,QAAQ,oBAAoB,GAAG,EAAS,CAAK,CACjF,CACF,CAAC,CACH,EACA,EAEN,OACE,EAAC,MAAD,CACE,IAAK,EACL,mBAAkB,EAAa,IAAA,GAAY,GAC3C,MAAO,CAAE,UAAW,EAAI,UAAU,SAAS,CAAS,EAAG,YAAW,EAClE,UAAW,EACT,EAAO,KACP,GAAc,EAAO,YACrB,GAAc,EAAO,aACrB,GAAY,EAAO,YACrB,EACA,GAAK,EAAa,IAAA,GAAY,EAC9B,GAAI,EAEH,UACE,CAAA,CAET"}

package/dist/esm/common/kanbanBoard/kanbanBoard.module.mjs

@@ -1,2 +1,2 @@
-"use client";var e=`board_6KRdw`,t=`column_NrNeF`,n=`column-empty_5KYsJ`,r=`column-over_sO7oD`,i=`column-over-limit_QmeZF`,a=`column-drop-target_mznmc`,o=`column-disabled_ehcz3`,s=`column-items_xY5er`,c=`column-dragging_6F5TK`,l=`column-drag-overlay_ctehQ`,u=`column-header_PLeKG`,d=`column-header-reorderable_Jtgii`,f=`column-header-title_FQhHQ`,p=`column-header-count_3t83e`,m=`column-header-count-over_AkAdo`,h=`column-header-trailing_6625D`,g=`column-header-actions_XKY3t`,_=`column-placeholder_WGyF-`,v=`column-loading-indicator_2Q70t`,y=`item_T8CJK`,b=`item-dragging_iWurw`,x=`item-handled_l28gq`,S=`item-disabled_n8Nuq`,C=`dragOverlay_DSyKz`,w={board:e,column:t,"column-empty":`column-empty_5KYsJ`,columnEmpty:n,"column-over":`column-over_sO7oD`,columnOver:r,"column-over-limit":`column-over-limit_QmeZF`,columnOverLimit:i,"column-drop-target":`column-drop-target_mznmc`,columnDropTarget:a,"column-disabled":`column-disabled_ehcz3`,columnDisabled:o,"column-items":`column-items_xY5er`,columnItems:s,"column-dragging":`column-dragging_6F5TK`,columnDragging:c,"column-drag-overlay":`column-drag-overlay_ctehQ`,columnDragOverlay:l,"column-header":`column-header_PLeKG`,columnHeader:u,"column-header-reorderable":`column-header-reorderable_Jtgii`,columnHeaderReorderable:d,"column-header-title":`column-header-title_FQhHQ`,columnHeaderTitle:f,"column-header-count":`column-header-count_3t83e`,columnHeaderCount:p,"column-header-count-over":`column-header-count-over_AkAdo`,columnHeaderCountOver:m,"column-header-trailing":`column-header-trailing_6625D`,columnHeaderTrailing:h,"column-header-actions":`column-header-actions_XKY3t`,columnHeaderActions:g,"column-placeholder":`column-placeholder_WGyF-`,columnPlaceholder:_,"column-loading-indicator":`column-loading-indicator_2Q70t`,columnLoadingIndicator:v,item:y,"item-dragging":`item-dragging_iWurw`,itemDragging:b,"item-handled":`item-handled_l28gq`,itemHandled:x,"item-disabled":`item-disabled_n8Nuq`,itemDisabled:S,dragOverlay:C};export{e as board,t as column,o as columnDisabled,l as columnDragOverlay,c as columnDragging,a as columnDropTarget,n as columnEmpty,u as columnHeader,g as columnHeaderActions,p as columnHeaderCount,m as columnHeaderCountOver,d as columnHeaderReorderable,f as columnHeaderTitle,h as columnHeaderTrailing,s as columnItems,v as columnLoadingIndicator,r as columnOver,i as columnOverLimit,_ as columnPlaceholder,w as default,C as dragOverlay,y as item,S as itemDisabled,b as itemDragging,x as itemHandled};
+"use client";var e=`board_6KRdw`,t=`column_NrNeF`,n=`column-collapsed_D0lOV`,r=`column-header_PLeKG`,i=`column-header-title_FQhHQ`,a=`column-over_sO7oD`,o=`column-over-limit_QmeZF`,s=`column-drop-target_mznmc`,c=`column-disabled_ehcz3`,l=`column-items_xY5er`,u=`column-dragging_6F5TK`,d=`column-drag-overlay_ctehQ`,f=`column-header-reorderable_Jtgii`,p=`column-header-count_3t83e`,m=`column-header-count-over_AkAdo`,h=`column-header-trailing_6625D`,g=`column-header-actions_XKY3t`,_=`column-placeholder_WGyF-`,v=`column-loading-indicator_2Q70t`,y=`item_T8CJK`,b=`item-dragging_iWurw`,x=`item-handled_l28gq`,S=`item-disabled_n8Nuq`,C=`dragOverlay_DSyKz`,w={board:e,column:t,"column-collapsed":`column-collapsed_D0lOV`,columnCollapsed:n,"column-header":`column-header_PLeKG`,columnHeader:r,"column-header-title":`column-header-title_FQhHQ`,columnHeaderTitle:i,"column-over":`column-over_sO7oD`,columnOver:a,"column-over-limit":`column-over-limit_QmeZF`,columnOverLimit:o,"column-drop-target":`column-drop-target_mznmc`,columnDropTarget:s,"column-disabled":`column-disabled_ehcz3`,columnDisabled:c,"column-items":`column-items_xY5er`,columnItems:l,"column-dragging":`column-dragging_6F5TK`,columnDragging:u,"column-drag-overlay":`column-drag-overlay_ctehQ`,columnDragOverlay:d,"column-header-reorderable":`column-header-reorderable_Jtgii`,columnHeaderReorderable:f,"column-header-count":`column-header-count_3t83e`,columnHeaderCount:p,"column-header-count-over":`column-header-count-over_AkAdo`,columnHeaderCountOver:m,"column-header-trailing":`column-header-trailing_6625D`,columnHeaderTrailing:h,"column-header-actions":`column-header-actions_XKY3t`,columnHeaderActions:g,"column-placeholder":`column-placeholder_WGyF-`,columnPlaceholder:_,"column-loading-indicator":`column-loading-indicator_2Q70t`,columnLoadingIndicator:v,item:y,"item-dragging":`item-dragging_iWurw`,itemDragging:b,"item-handled":`item-handled_l28gq`,itemHandled:x,"item-disabled":`item-disabled_n8Nuq`,itemDisabled:S,dragOverlay:C};export{e as board,t as column,n as columnCollapsed,c as columnDisabled,d as columnDragOverlay,u as columnDragging,s as columnDropTarget,r as columnHeader,g as columnHeaderActions,p as columnHeaderCount,m as columnHeaderCountOver,f as columnHeaderReorderable,i as columnHeaderTitle,h as columnHeaderTrailing,l as columnItems,v as columnLoadingIndicator,a as columnOver,o as columnOverLimit,_ as columnPlaceholder,w as default,C as dragOverlay,y as item,S as itemDisabled,b as itemDragging,x as itemHandled};
 //# sourceMappingURL=kanbanBoard.module.mjs.map

package/dist/esm/common/kanbanBoard/kanbanBoard.module.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"kanbanBoard.module.mjs","names":[],"sources":["../../../../package/common/kanbanBoard/kanbanBoard.module.pcss"],"sourcesContent":[".board {\n  display: flex;\n  gap: var(--spacing-s);\n  overflow-x: auto;\n  align-items: flex-start;\n  width: 100%;\n}\n\n.column {\n  background: var(--background-accent-light);\n  border-radius: var(--default-border-radius);\n  box-shadow: var(--card-shadow);\n  flex: 1 1 0;\n  display: flex;\n  flex-direction: column;\n  border: 2px solid transparent;\n  transition:\n    border-color 0.15s ease,\n    background 0.15s ease;\n\n  &-empty {\n    flex: 0 1 0;\n    min-width: var(--kanban-empty-column-width, 140px);\n  }\n\n  &-over {\n    border-color: var(--primary-lighter);\n    background: var(--background-accent);\n  }\n\n  &-over-limit {\n    border-color: var(--warn-color);\n  }\n\n  /* A whole column being dragged over this one, reordering — distinct from -over (a card being\n     dropped into this column's card list), even though both are dashed-free solid borders here;\n     kept as a separate class so consumers can restyle one without affecting the other. */\n  &-drop-target {\n    border-color: var(--primary-color);\n    background: var(--background-accent);\n  }\n\n  /* Dims only the cards area, not the header — header actions (e.g. an \"add card\" button) are\n     consumer-controlled and often meant to stay fully interactive even while the column itself\n     is frozen for dragging, and opacity on an ancestor can't be undone by a child's own opacity. */\n  &-disabled &-items {\n    opacity: 0.6;\n  }\n\n  &-dragging {\n    opacity: 0.4;\n  }\n\n  &-drag-overlay {\n    cursor: grabbing;\n    box-shadow:\n      0 10px 30px rgb(0 0 0 / 25%),\n      var(--card-shadow);\n    min-width: 220px;\n  }\n\n  &-header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: var(--spacing-s);\n    padding: var(--spacing-m) var(--spacing-l);\n    background: var(--background-accent);\n    border-radius: var(--default-border-radius) var(--default-border-radius) 0 0;\n    font-size: var(--header-small-font-size);\n    font-weight: var(--header-font-weight);\n    color: var(--text-color);\n    border-bottom: 1px solid var(--border-color);\n\n    &-reorderable {\n      cursor: grab;\n      -webkit-tap-highlight-color: transparent;\n      touch-action: none;\n\n      &:active {\n        cursor: grabbing;\n      }\n    }\n\n    &-title {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n\n    &-count {\n      flex-shrink: 0;\n      font-size: var(--default-font-size);\n      font-weight: var(--default-font-weight);\n      color: var(--text-dark);\n\n      &-over {\n        color: var(--warn-color);\n        font-weight: var(--header-font-weight);\n      }\n    }\n\n    &-trailing {\n      display: flex;\n      align-items: center;\n      gap: var(--spacing-s);\n      flex-shrink: 0;\n    }\n\n    &-actions {\n      display: flex;\n      align-items: center;\n      gap: var(--spacing-s);\n    }\n  }\n\n  &-items {\n    padding: var(--spacing-m);\n    display: flex;\n    flex-direction: column;\n    gap: var(--spacing-m);\n    min-height: 80px;\n    flex: 1;\n  }\n\n  &-placeholder {\n    flex: 1;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    text-align: center;\n    color: var(--text-dark);\n    font-size: var(--default-font-size);\n  }\n\n  &-loading-indicator {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: var(--spacing-s) 0;\n  }\n}\n\n.item {\n  cursor: grab;\n  touch-action: none;\n\n  &:active {\n    cursor: grabbing;\n  }\n\n  &-dragging {\n    opacity: 0.4;\n  }\n\n  &-handled {\n    cursor: default;\n    touch-action: auto;\n\n    &:active {\n      cursor: default;\n    }\n\n    [data-drag-handle] {\n      cursor: grab;\n      -webkit-tap-highlight-color: transparent;\n      touch-action: none;\n    }\n\n    [data-drag-handle]:active {\n      cursor: grabbing;\n    }\n  }\n\n  &-disabled {\n    cursor: not-allowed;\n\n    &:active {\n      cursor: not-allowed;\n    }\n\n    [data-drag-handle] {\n      cursor: not-allowed;\n    }\n\n    [data-drag-handle]:active {\n      cursor: not-allowed;\n    }\n  }\n}\n\n.dragOverlay {\n  border-radius: var(--default-border-radius);\n  cursor: grabbing;\n  box-shadow:\n    0 10px 30px rgb(0 0 0 / 25%),\n    var(--card-shadow);\n}\n"],"mappings":""}
+{"version":3,"file":"kanbanBoard.module.mjs","names":[],"sources":["../../../../package/common/kanbanBoard/kanbanBoard.module.pcss"],"sourcesContent":["/* Columns stretch to the tallest one, so the space below a column's cards is still its drop zone.\n   Sized to its content, an empty column was a short box, and a card dropped below it landed in\n   the neighbouring column. */\n.board {\n  display: flex;\n  gap: var(--spacing-s);\n  overflow-x: auto;\n  width: 100%;\n}\n\n.column {\n  background: var(--background-accent-light);\n  border-radius: var(--default-border-radius);\n  box-shadow: var(--card-shadow);\n  flex: 1 1 0;\n  display: flex;\n  flex-direction: column;\n  border: 2px solid transparent;\n  transition:\n    border-color 0.15s ease,\n    background 0.15s ease;\n\n  &-collapsed {\n    flex: 0 1 0;\n    min-width: var(--kanban-empty-column-width, 140px);\n  }\n\n  /* Too narrow for the title beside the count and actions, which cut it to \"I…\": they wrap below. */\n  &-collapsed &-header {\n    flex-wrap: wrap;\n  }\n\n  &-collapsed &-header-title {\n    white-space: normal;\n  }\n\n  &-over {\n    border-color: var(--primary-lighter);\n    background: var(--background-accent);\n  }\n\n  &-over-limit {\n    border-color: var(--warn-color);\n  }\n\n  /* A whole column being dragged over this one, reordering — distinct from -over (a card being\n     dropped into this column's card list), even though both are dashed-free solid borders here;\n     kept as a separate class so consumers can restyle one without affecting the other. */\n  &-drop-target {\n    border-color: var(--primary-color);\n    background: var(--background-accent);\n  }\n\n  /* Dims only the cards area, not the header — header actions (e.g. an \"add card\" button) are\n     consumer-controlled and often meant to stay fully interactive even while the column itself\n     is frozen for dragging, and opacity on an ancestor can't be undone by a child's own opacity. */\n  &-disabled &-items {\n    opacity: 0.6;\n  }\n\n  &-dragging {\n    opacity: 0.4;\n  }\n\n  &-drag-overlay {\n    cursor: grabbing;\n    box-shadow:\n      0 10px 30px rgb(0 0 0 / 25%),\n      var(--card-shadow);\n    min-width: 220px;\n  }\n\n  &-header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: var(--spacing-s);\n    padding: var(--spacing-m) var(--spacing-l);\n    background: var(--background-accent);\n    border-radius: var(--default-border-radius) var(--default-border-radius) 0 0;\n    font-size: var(--header-small-font-size);\n    font-weight: var(--header-font-weight);\n    color: var(--text-color);\n    border-bottom: 1px solid var(--border-color);\n\n    &-reorderable {\n      cursor: grab;\n      -webkit-tap-highlight-color: transparent;\n      touch-action: none;\n      user-select: none;\n\n      &:active {\n        cursor: grabbing;\n      }\n    }\n\n    &-title {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n\n      &:focus-visible {\n        outline: 2px solid var(--focus-border-color, var(--primary-color));\n        outline-offset: 2px;\n        border-radius: var(--default-border-radius);\n      }\n    }\n\n    &-count {\n      flex-shrink: 0;\n      font-size: var(--default-font-size);\n      font-weight: var(--default-font-weight);\n      color: var(--text-dark);\n\n      &-over {\n        color: var(--warn-color);\n        font-weight: var(--header-font-weight);\n      }\n    }\n\n    &-trailing {\n      display: flex;\n      align-items: center;\n      gap: var(--spacing-s);\n      flex-shrink: 0;\n    }\n\n    &-actions {\n      display: flex;\n      align-items: center;\n      gap: var(--spacing-s);\n    }\n  }\n\n  /* Scrolls once something bounds it: `columnMaxHeight`, or a height given to the board. A board\n     that grows with its cards never makes it overflow. `position` makes its cards' `offsetTop`\n     relative to it, which the load-more probe measures. */\n  &-items {\n    position: relative;\n    padding: var(--spacing-m);\n    display: flex;\n    flex-direction: column;\n    gap: var(--spacing-m);\n    min-height: 80px;\n    flex: 1;\n    overflow-y: auto;\n  }\n\n  &-placeholder {\n    flex: 1;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    text-align: center;\n    color: var(--text-dark);\n    font-size: var(--default-font-size);\n  }\n\n  &-loading-indicator {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: var(--spacing-s) 0;\n  }\n}\n\n/* A press that can start a text selection lets Chromium scroll the page while the button is held\n   near its edge, however far past the board. Where a press starts a drag, it cannot select. */\n.item {\n  cursor: grab;\n  touch-action: none;\n  user-select: none;\n\n  &:focus-visible {\n    outline: 2px solid var(--focus-border-color, var(--primary-color));\n    outline-offset: 2px;\n    border-radius: var(--default-border-radius);\n  }\n\n  &:active {\n    cursor: grabbing;\n  }\n\n  &-dragging {\n    opacity: 0.4;\n  }\n\n  &-handled {\n    cursor: default;\n    touch-action: auto;\n    user-select: auto;\n\n    &:active {\n      cursor: default;\n    }\n\n    [data-drag-handle] {\n      cursor: grab;\n      -webkit-tap-highlight-color: transparent;\n      touch-action: none;\n      user-select: none;\n\n      &:focus-visible {\n        outline: 2px solid var(--focus-border-color, var(--primary-color));\n        outline-offset: 2px;\n        border-radius: var(--default-border-radius);\n      }\n    }\n\n    [data-drag-handle]:active {\n      cursor: grabbing;\n    }\n  }\n\n  &-disabled {\n    cursor: not-allowed;\n\n    &:active {\n      cursor: not-allowed;\n    }\n\n    [data-drag-handle] {\n      cursor: not-allowed;\n    }\n\n    [data-drag-handle]:active {\n      cursor: not-allowed;\n    }\n  }\n}\n\n.dragOverlay {\n  border-radius: var(--default-border-radius);\n  cursor: grabbing;\n  box-shadow:\n    0 10px 30px rgb(0 0 0 / 25%),\n    var(--card-shadow);\n}\n"],"mappings":""}

package/dist/esm/common/kanbanBoard/kanbanBoard.utils.mjs

@@ -1,2 +1,2 @@
-"use client";import{KeyboardCode as e,closestCorners as t}from"@dnd-kit/core";import{arrayMove as n,hasSortableData as r}from"@dnd-kit/sortable";function i(e,t){return e.length===t.length&&e.every((e,n)=>{let r=t[n];return e.id===r.id&&e.itemIds.length===r.itemIds.length&&e.itemIds.every((e,t)=>e===r.itemIds[t])})}function a(e,t){return e.findIndex(e=>e.itemIds.includes(t))}function o(e){return!!(e&&typeof e==`object`&&e.type===`column`)}function s(e,t,r){let i=e.findIndex(e=>e.id===t),a=e.findIndex(e=>e.id===r);return i===-1||a===-1||i===a?e:n(e,i,a)}var c=e=>{let n=o(e.active.data.current),r=e.droppableContainers.filter(e=>n?o(e.data.current):!o(e.data.current));return t({...e,droppableContainers:r})};function l(e){return e.startsWith(`column-`)?e.slice(7):null}function u(e,t,r,i){let o=a(e,t);if(o===-1)return e;let s=l(r),c=s===null?a(e,r):e.findIndex(e=>e.id===s);if(c===-1)return e;if(o===c){let a=e[o],c=a.itemIds.indexOf(t);if(c===-1)return e;if(s!==null){let{activeRect:t,overRect:r}=i,s=t&&t.top+t.height/2>r.top+r.height/2?a.itemIds.length-1:0;if(s===c)return e;let l=[...e];return l[o]={...a,itemIds:n(a.itemIds,c,s)},l}let l=a.itemIds.indexOf(r);if(l===-1||c===l)return e;let u=[...e];return u[o]={...a,itemIds:n(a.itemIds,c,l)},u}let u=e[o],d=e[c],f=[...d.itemIds],{activeRect:p,overRect:m}=i,h;if(s!==null)h=p&&p.top+p.height/2>m.top+m.height/2?f.length:0;else{let e=f.indexOf(r),t=e!==-1&&e===f.length-1,n=!!(p&&p.top+p.height/2>m.top+m.height);h=e===-1?f.length:t&&n?e+1:e}f.splice(h,0,t);let g=[...e];return g[o]={...u,itemIds:u.itemIds.filter(e=>e!==t)},g[c]={...d,itemIds:f},g}function d(e,t,n){function r(e){let r=t[e];return r===void 0?e:n(r,e)}function i(t){let n=l(t);if(n!==null){let t=e.find(e=>e.id===n);return t?`the ${t.title} column`:`a column`}let i=e.find(e=>e.itemIds.includes(t));return i?`${r(t)}, in the ${i.title} column`:r(t)}function a(t){return e.find(e=>e.id===t)?.title??t}return{onDragStart({active:e}){return o(e.data.current)?`Picked up column ${a(String(e.id))}.`:`Picked up card ${r(String(e.id))}.`},onDragOver({active:e,over:t}){return o(e.data.current)?t?`Column ${a(String(e.id))} is over column ${a(String(t.id))}.`:`Column ${a(String(e.id))} is no longer over a droppable area.`:t?`Card ${r(String(e.id))} is over ${i(String(t.id))}.`:`Card ${r(String(e.id))} is no longer over a droppable area.`},onDragEnd({active:e,over:t}){return o(e.data.current)?t?`Column ${a(String(e.id))} was dropped over column ${a(String(t.id))}.`:`Column ${a(String(e.id))} was dropped.`:t?`Card ${r(String(e.id))} was dropped over ${i(String(t.id))}.`:`Card ${r(String(e.id))} was dropped.`},onDragCancel({active:e}){return o(e.data.current)?`Dragging cancelled. Column ${a(String(e.id))} was returned to its original position.`:`Dragging cancelled. Card ${r(String(e.id))} was returned to its original position.`}}}function f(e,t,n){let i=[];for(let a of e){if(!r(a)||a.data.current.sortable.containerId!==n)continue;let e=t.get(a.id);e&&i.push({container:a,rect:e})}return i.sort((e,t)=>e.rect.top-t.rect.top)}var p=(t,{context:n})=>{let{active:i,collisionRect:a,droppableRects:s,droppableContainers:c}=n;if(!i||!a||!r(i))return;let u=t.code===e.Down||t.code===e.Up,d=t.code===e.Left||t.code===e.Right;if(!u&&!d)return;t.preventDefault();let p=i.data.current.sortable.containerId,m=c.getEnabled();if(o(i.data.current)){if(!d)return;let n=t.code===e.Right?1:-1,r=f(m,s,p).sort((e,t)=>e.rect.left-t.rect.left),o=r.findIndex(e=>e.container.id===i.id);if(o===-1)return;let c=r[o+n];return c?{x:c.rect.left,y:a.top}:void 0}if(u){let n=t.code===e.Down?1:-1,r=f(m,s,p),o=r.findIndex(e=>e.container.id===i.id);if(o===-1)return;let c=r[o+n];return c?{x:a.left,y:c.rect.top}:void 0}let h=t.code===e.Right?1:-1,g=[];for(let e of m){if(l(String(e.id))===null)continue;let t=s.get(e.id);t&&g.push({container:e,rect:t})}g.sort((e,t)=>e.rect.left-t.rect.left);let _=g.findIndex(e=>l(String(e.container.id))===p);if(_===-1)return;let v=g[_+h];if(!v)return;let y=f(m,s,l(String(v.container.id))),b=v.rect;return y.length>0&&(b=y.reduce((e,t)=>Math.abs(t.rect.top-a.top)<Math.abs(e.rect.top-a.top)?t:e).rect),{x:b.left,y:b.top}};export{d as buildAnnouncements,i as columnsEqual,a as findColumnForItem,o as isColumnDragData,c as kanbanCollisionDetection,p as kanbanKeyboardCoordinateGetter,s as moveColumn,u as moveItem,l as resolveColumnDropId};
+"use client";import{KeyboardCode as e,closestCorners as t}from"@dnd-kit/core";import{arrayMove as n,hasSortableData as r}from"@dnd-kit/sortable";function i(e,t){return e.length===t.length&&e.every((e,n)=>{let r=t[n];return e.id===r.id&&e.itemIds.length===r.itemIds.length&&e.itemIds.every((e,t)=>e===r.itemIds[t])})}function a(e,t){return e.findIndex(e=>e.itemIds.includes(t))}function o(e){return!!(e&&typeof e==`object`&&e.type===`column`)}function s(e,t,r){let i=e.findIndex(e=>e.id===t),a=e.findIndex(e=>e.id===r);return i===-1||a===-1||i===a?e:n(e,i,a)}var c=e=>{let n=o(e.active.data.current),i=e.droppableContainers.filter(e=>n?o(e.data.current):!o(e.data.current)),a=e.pointerCoordinates?.x,s=n||a===void 0?void 0:i.find(t=>{let n=e.droppableRects.get(t.id);return u(String(t.id))!==null&&n&&n.left<=a&&a<=n.right});if(!s)return t({...e,droppableContainers:i});let c=u(String(s.id));return t({...e,droppableContainers:i.filter(e=>e===s||r(e)&&e.data.current.sortable.containerId===c)})};function l(e,t,n){return n.top+n.height/2>(e.top+e.bottom)/2?t.bottom>e.bottom+1:t.top<e.top-1}function u(e){return e.startsWith(`column-`)?e.slice(7):null}function d(e,t,r,i){let o=a(e,t);if(o===-1)return e;let s=u(r),c=s===null?a(e,r):e.findIndex(e=>e.id===s);if(c===-1)return e;if(o===c){let a=e[o],c=a.itemIds.indexOf(t);if(c===-1)return e;if(s!==null){let{activeRect:t,overRect:r}=i,s=t&&t.top+t.height/2>r.top+r.height/2?a.itemIds.length-1:0;if(s===c)return e;let l=[...e];return l[o]={...a,itemIds:n(a.itemIds,c,s)},l}let l=a.itemIds.indexOf(r);if(l===-1||c===l)return e;let u=[...e];return u[o]={...a,itemIds:n(a.itemIds,c,l)},u}let l=e[o],d=e[c],f=[...d.itemIds],{activeRect:p,overRect:m}=i,h;if(s!==null)h=p&&p.top+p.height/2>m.top+m.height/2?f.length:0;else{let e=f.indexOf(r),t=e!==-1&&e===f.length-1,n=!!(p&&p.top+p.height/2>m.top+m.height);h=e===-1?f.length:t&&n?e+1:e}f.splice(h,0,t);let g=[...e];return g[o]={...l,itemIds:l.itemIds.filter(e=>e!==t)},g[c]={...d,itemIds:f},g}function f(e,t,n){if(n){let n=e.findIndex(e=>e.id===t);return n===-1?null:{id:t,columnId:null,index:n}}let r=a(e,t);if(r===-1)return null;let i=e[r];return{id:t,columnId:i.id,index:i.itemIds.indexOf(t)}}function p(e,t){if(!t)return e;let{id:r,columnId:i,index:o}=t;if(i===null){let t=e.findIndex(e=>e.id===r);return t===-1?e:n(e,t,o)}let s=a(e,r),c=e.findIndex(e=>e.id===i);if(s===-1||c===-1)return e;let l=[...e],u=e[s];l[s]={...u,itemIds:u.itemIds.filter(e=>e!==r)};let d=[...l[c].itemIds];return d.splice(o,0,r),l[c]={...l[c],itemIds:d},l}var m=`[data-kanban-handle], [data-kanban-card]`;function h(e,t,n){if(!t.matches(m))return null;let r=[...e.querySelectorAll(`:scope > [data-kanban-column]`)],i=r.findIndex(e=>e.contains(t));if(i===-1)return null;let a=e=>[...e.querySelectorAll(m)];if(n===`ArrowUp`||n===`ArrowDown`){let e=a(r[i]);return e[e.indexOf(t)+(n===`ArrowDown`?1:-1)]??null}if(n!==`ArrowLeft`&&n!==`ArrowRight`)return null;let o=n===`ArrowRight`?1:-1,s=t.getBoundingClientRect().top,c=e=>Math.abs(e.getBoundingClientRect().top-s);for(let e=i+o;e>=0&&e<r.length;e+=o){let n=a(r[e]),i=n.find(e=>e.hasAttribute(`data-kanban-handle`)),o=n.filter(e=>e.hasAttribute(`data-kanban-card`));if(i&&(t.hasAttribute(`data-kanban-handle`)||o.length===0))return i;if(o.length>0)return o.reduce((e,t)=>c(t)<c(e)?t:e)}return null}function g(e,t,n){function r(e){let r=t[e];return r===void 0?e:n(r,e)}function i(t){let n=u(t);if(n!==null){let t=e.find(e=>e.id===n);return t?`the ${t.title} column`:`a column`}let i=e.find(e=>e.itemIds.includes(t));return i?`${r(t)}, in the ${i.title} column`:r(t)}function a(t){return e.find(e=>e.id===t)?.title??t}return{onDragStart({active:e}){return o(e.data.current)?`Picked up column ${a(String(e.id))}.`:`Picked up card ${r(String(e.id))}.`},onDragOver({active:e,over:t}){return o(e.data.current)?t?`Column ${a(String(e.id))} is over column ${a(String(t.id))}.`:`Column ${a(String(e.id))} is no longer over a droppable area.`:t?`Card ${r(String(e.id))} is over ${i(String(t.id))}.`:`Card ${r(String(e.id))} is no longer over a droppable area.`},onDragEnd({active:e,over:t}){return o(e.data.current)?t?`Column ${a(String(e.id))} was dropped over column ${a(String(t.id))}.`:`Column ${a(String(e.id))} was dropped.`:t?`Card ${r(String(e.id))} was dropped over ${i(String(t.id))}.`:`Card ${r(String(e.id))} was dropped.`},onDragCancel({active:e}){return o(e.data.current)?`Dragging cancelled. Column ${a(String(e.id))} was returned to its original position.`:`Dragging cancelled. Card ${r(String(e.id))} was returned to its original position.`}}}function _(e,t,n){let i=[];for(let a of e){if(!r(a)||a.data.current.sortable.containerId!==n)continue;let e=t.get(a.id);e&&i.push({container:a,rect:e})}return i.sort((e,t)=>e.rect.top-t.rect.top)}var v=(t,{context:n})=>{let{active:i,collisionRect:a,droppableRects:s,droppableContainers:c}=n;if(!i||!a||!r(i))return;let l=t.code===e.Down||t.code===e.Up,d=t.code===e.Left||t.code===e.Right;if(!l&&!d)return;t.preventDefault();let f=i.data.current.sortable.containerId,p=c.getEnabled();if(o(i.data.current)){if(!d)return;let n=t.code===e.Right?1:-1,r=_(p,s,f).sort((e,t)=>e.rect.left-t.rect.left),o=r.findIndex(e=>e.container.id===i.id);if(o===-1)return;let c=r[o+n];return c?{x:c.rect.left,y:a.top}:void 0}if(l){let n=t.code===e.Down?1:-1,r=_(p,s,f),o=r.findIndex(e=>e.container.id===i.id);if(o===-1)return;let c=r[o+n];return c?{x:a.left,y:c.rect.top}:void 0}let m=t.code===e.Right?1:-1,h=[];for(let e of p){if(u(String(e.id))===null)continue;let t=s.get(e.id);t&&h.push({container:e,rect:t})}h.sort((e,t)=>e.rect.left-t.rect.left);let g=h.findIndex(e=>u(String(e.container.id))===f);if(g===-1)return;let v=h[g+m];if(!v)return;let y=_(p,s,u(String(v.container.id))),b=v.rect;return y.length>0&&(b=y.reduce((e,t)=>Math.abs(t.rect.top-a.top)<Math.abs(e.rect.top-a.top)?t:e).rect),{x:b.left,y:b.top}};export{p as applyPlacement,g as buildAnnouncements,i as columnsEqual,h as findArrowFocusTarget,a as findColumnForItem,f as findPlacement,o as isColumnDragData,c as kanbanCollisionDetection,v as kanbanKeyboardCoordinateGetter,s as moveColumn,d as moveItem,u as resolveColumnDropId,l as scrollsTowardBoard};
 //# sourceMappingURL=kanbanBoard.utils.mjs.map

package/dist/esm/common/kanbanBoard/kanbanBoard.utils.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"kanbanBoard.utils.mjs","names":[],"sources":["../../../../package/common/kanbanBoard/kanbanBoard.utils.ts"],"sourcesContent":["import { arrayMove, hasSortableData } from '@dnd-kit/sortable';\nimport {\n  closestCorners,\n  KeyboardCode,\n  type Announcements,\n  type ClientRect,\n  type CollisionDetection,\n  type DroppableContainer,\n  type KeyboardCoordinateGetter,\n  type UniqueIdentifier,\n} from '@dnd-kit/core';\n\nimport type { KanbanColumnDef } from './kanbanBoard.types';\n\nexport function columnsEqual(a: KanbanColumnDef[], b: KanbanColumnDef[]): boolean {\n  if (a.length !== b.length) return false;\n  return a.every((col, i) => {\n    const other = b[i];\n    return (\n      col.id === other.id &&\n      col.itemIds.length === other.itemIds.length &&\n      col.itemIds.every((itemId, j) => itemId === other.itemIds[j])\n    );\n  });\n}\n\nexport function findColumnForItem(columns: KanbanColumnDef[], itemId: string): number {\n  return columns.findIndex((col) => col.itemIds.includes(itemId));\n}\n\n/** Whether a drag's `active`/`over` participant is a whole column (vs. a card) — see `reorderableColumns`. */\nexport function isColumnDragData(data: unknown): boolean {\n  return Boolean(data && typeof data === 'object' && (data as { type?: string }).type === 'column');\n}\n\n/**\n * Reorders whole columns: moves `activeColumnId` to `overColumnId`'s position. Returns the same\n * `columns` reference, unchanged, when either id doesn't resolve to a column or they're the same\n * — callers can use that to skip a state update.\n */\nexport function moveColumn(\n  columns: KanbanColumnDef[],\n  activeColumnId: string,\n  overColumnId: string,\n): KanbanColumnDef[] {\n  const oldIndex = columns.findIndex((col) => col.id === activeColumnId);\n  const overIndex = columns.findIndex((col) => col.id === overColumnId);\n  if (oldIndex === -1 || overIndex === -1 || oldIndex === overIndex) return columns;\n\n  return arrayMove(columns, oldIndex, overIndex);\n}\n\n/**\n * Collision detection for the board's shared `DndContext`, which has to pick between two very\n * differently-scaled sets of droppables at once: individual cards / a column's own card list\n * (small, numerous) and whole columns (large, few). Plain `closestCorners` weighs every\n * registered droppable together regardless of what's actually being dragged, so while dragging a\n * column it competes against every card and card-list droppable it happens to fly over too — the\n * column-level target only wins when the pointer lands somewhere that geometrically favors it,\n * which reads as needing to \"wiggle it around\" before the right drop target lights up. This\n * restricts the candidates to only the same kind as whatever is being dragged: a column drag only\n * considers other columns, a card drag only considers cards and card lists.\n */\nexport const kanbanCollisionDetection: CollisionDetection = (args) => {\n  const draggingColumn = isColumnDragData(args.active.data.current);\n  const droppableContainers = args.droppableContainers.filter((container) =>\n    draggingColumn ? isColumnDragData(container.data.current) : !isColumnDragData(container.data.current),\n  );\n\n  return closestCorners({ ...args, droppableContainers });\n};\n\n/** Extracts the column id from a column droppable's `column-<id>` identifier, or `null` for a card id. */\nexport function resolveColumnDropId(overId: string): string | null {\n  return overId.startsWith('column-') ? overId.slice('column-'.length) : null;\n}\n\nexport interface DragGeometry {\n  /** The dragged card's current rect (translated by the drag delta), if measured. */\n  activeRect: ClientRect | null;\n  /** The rect of whatever `overId` refers to — a card, or a column's own droppable. */\n  overRect: ClientRect;\n}\n\n/**\n * Computes the columns that result from dragging `activeItemId` over `overId` (a card id, or a\n * `column-<id>` droppable id for empty column space). Returns the same `columns` reference,\n * unchanged, when the drag doesn't resolve to a valid source/destination — callers can use that\n * to skip a state update.\n *\n * `geometry` resolves cross-column drops that land on a card or gap with more than one possible\n * position (see the two branches below for what each one decides).\n */\nexport function moveItem(\n  columns: KanbanColumnDef[],\n  activeItemId: string,\n  overId: string,\n  geometry: DragGeometry,\n): KanbanColumnDef[] {\n  // Only the source/destination column(s) actually change, so only those get new object/array\n  // references — every other column keeps its exact `columns` reference. Cloning every column's\n  // `itemIds` up front (as this used to) cost O(total cards across the whole board) on *every*\n  // drag-over event, not just the couple of columns actually involved in the move.\n  const sourceColIndex = findColumnForItem(columns, activeItemId);\n  if (sourceColIndex === -1) return columns;\n\n  const destColId = resolveColumnDropId(overId);\n  const destColIndex =\n    destColId !== null ? columns.findIndex((col) => col.id === destColId) : findColumnForItem(columns, overId);\n  if (destColIndex === -1) return columns;\n\n  if (sourceColIndex === destColIndex) {\n    const col = columns[sourceColIndex];\n    const oldIndex = col.itemIds.indexOf(activeItemId);\n    if (oldIndex === -1) return columns;\n\n    if (destColId !== null) {\n      // over is the column's own droppable, not a card: nothing else claimed the collision,\n      // which happens hovering the empty gap above/below the cards, or — critically — an edge\n      // next to a disabled/pinned card with no other card nearby, since a disabled card's own\n      // droppable is excluded from collision candidates entirely. Without this branch, that\n      // case fell through to `col.itemIds.indexOf(overId)` below, which is always -1 for a\n      // `column-<id>` id (it's not a card id), silently no-op-ing instead of reordering.\n      const { activeRect, overRect } = geometry;\n      const isBelowCenter = Boolean(\n        activeRect && activeRect.top + activeRect.height / 2 > overRect.top + overRect.height / 2,\n      );\n      const targetIndex = isBelowCenter ? col.itemIds.length - 1 : 0;\n      if (targetIndex === oldIndex) return columns;\n\n      const next = [...columns];\n      next[sourceColIndex] = { ...col, itemIds: arrayMove(col.itemIds, oldIndex, targetIndex) };\n      return next;\n    }\n\n    const newIndex = col.itemIds.indexOf(overId);\n    if (newIndex === -1 || oldIndex === newIndex) return columns;\n\n    const next = [...columns];\n    next[sourceColIndex] = { ...col, itemIds: arrayMove(col.itemIds, oldIndex, newIndex) };\n    return next;\n  }\n\n  const sourceCol = columns[sourceColIndex];\n  const destCol = columns[destColIndex];\n  const destItemIds = [...destCol.itemIds];\n  const { activeRect, overRect } = geometry;\n\n  let insertAt: number;\n  if (destColId !== null) {\n    // Hovering the column's own droppable directly, rather than a specific card: the empty gap\n    // above the first card, the empty gap below the last card, or the whole area when the column\n    // has no cards at all. Comparing centers against the *container's* full-height rect is a\n    // coarse but reliable way to tell the top gap (insert at the start) from the bottom gap\n    // (append at the end) — treating every container hover as \"append\" put a card dropped just\n    // above the first item at the end of the column instead.\n    const isBelowCenter = Boolean(\n      activeRect && activeRect.top + activeRect.height / 2 > overRect.top + overRect.height / 2,\n    );\n    insertAt = isBelowCenter ? destItemIds.length : 0;\n  } else {\n    const overIndex = destItemIds.indexOf(overId);\n\n    // Only the last card's own drop zone extends past its bottom edge with nothing after it to\n    // compete for the collision, so it's the one case where the dragged card can end up \"after\"\n    // it. Requiring the dragged rect's *center* (not its top edge) to pass the hovered card's\n    // bottom edge is deliberately more forgiving than requiring the whole dragged card to clear it\n    // — that stricter version needs the user to drag a full card's height past the last item\n    // before it registers, which in practice almost never happens before the drop, silently\n    // landing the card second-to-last every time despite the live preview showing it last. A pure\n    // center-to-center comparison is too lenient in the other direction: the dragged rect's center\n    // still carries the grab offset from wherever in the source card it was originally picked up,\n    // so a low enough grab point reads as \"past\" well before the drag is visually past the card at\n    // all. Anchoring to the target's *bottom* edge (not its center) keeps that grab-offset problem\n    // from creeping back in while still being achievable in a normal drag.\n    const isLastItem = overIndex !== -1 && overIndex === destItemIds.length - 1;\n    const hasClearedItem = Boolean(\n      activeRect && activeRect.top + activeRect.height / 2 > overRect.top + overRect.height,\n    );\n    insertAt = overIndex === -1 ? destItemIds.length : isLastItem && hasClearedItem ? overIndex + 1 : overIndex;\n  }\n\n  destItemIds.splice(insertAt, 0, activeItemId);\n\n  const next = [...columns];\n  next[sourceColIndex] = { ...sourceCol, itemIds: sourceCol.itemIds.filter((id) => id !== activeItemId) };\n  next[destColIndex] = { ...destCol, itemIds: destItemIds };\n  return next;\n}\n\n/**\n * Builds screen-reader drag announcements against the columns layout as currently understood\n * (the live shadow layout while a drag is in progress, or the settled `columns` prop otherwise).\n */\nexport function buildAnnouncements<T>(\n  columns: KanbanColumnDef[],\n  items: Record<string, T>,\n  getItemLabel: (item: T, id: string) => string,\n): Announcements {\n  function labelFor(id: string): string {\n    const item = items[id];\n    return item !== undefined ? getItemLabel(item, id) : id;\n  }\n\n  function describeOver(overId: string): string {\n    const destColId = resolveColumnDropId(overId);\n    if (destColId !== null) {\n      const col = columns.find((c) => c.id === destColId);\n      return col ? `the ${col.title} column` : 'a column';\n    }\n\n    const col = columns.find((c) => c.itemIds.includes(overId));\n    return col ? `${labelFor(overId)}, in the ${col.title} column` : labelFor(overId);\n  }\n\n  function columnTitle(id: string): string {\n    return columns.find((c) => c.id === id)?.title ?? id;\n  }\n\n  return {\n    onDragStart({ active }) {\n      if (isColumnDragData(active.data.current)) return `Picked up column ${columnTitle(String(active.id))}.`;\n      return `Picked up card ${labelFor(String(active.id))}.`;\n    },\n    onDragOver({ active, over }) {\n      if (isColumnDragData(active.data.current)) {\n        if (!over) return `Column ${columnTitle(String(active.id))} is no longer over a droppable area.`;\n        return `Column ${columnTitle(String(active.id))} is over column ${columnTitle(String(over.id))}.`;\n      }\n      if (!over) return `Card ${labelFor(String(active.id))} is no longer over a droppable area.`;\n      return `Card ${labelFor(String(active.id))} is over ${describeOver(String(over.id))}.`;\n    },\n    onDragEnd({ active, over }) {\n      if (isColumnDragData(active.data.current)) {\n        if (!over) return `Column ${columnTitle(String(active.id))} was dropped.`;\n        return `Column ${columnTitle(String(active.id))} was dropped over column ${columnTitle(String(over.id))}.`;\n      }\n      if (!over) return `Card ${labelFor(String(active.id))} was dropped.`;\n      return `Card ${labelFor(String(active.id))} was dropped over ${describeOver(String(over.id))}.`;\n    },\n    onDragCancel({ active }) {\n      if (isColumnDragData(active.data.current)) {\n        return `Dragging cancelled. Column ${columnTitle(String(active.id))} was returned to its original position.`;\n      }\n      return `Dragging cancelled. Card ${labelFor(String(active.id))} was returned to its original position.`;\n    },\n  };\n}\n\ninterface ContainerRect {\n  container: DroppableContainer;\n  rect: ClientRect;\n}\n\nfunction collectColumnItemRects(\n  containers: DroppableContainer[],\n  droppableRects: Map<UniqueIdentifier, ClientRect>,\n  containerId: UniqueIdentifier,\n): ContainerRect[] {\n  const entries: ContainerRect[] = [];\n  for (const container of containers) {\n    if (!hasSortableData(container)) continue;\n    if (container.data.current.sortable.containerId !== containerId) continue;\n    const rect = droppableRects.get(container.id);\n    if (!rect) continue;\n    entries.push({ container, rect });\n  }\n  return entries.sort((a, b) => a.rect.top - b.rect.top);\n}\n\n/**\n * Custom keyboard coordinate getter for the board's multi-column, multi-`SortableContext`\n * layout. dnd-kit's default `sortableKeyboardCoordinates` picks the geometrically closest\n * droppable across the *entire* board — cards and column containers alike — which is unreliable\n * once cards live inside independent per-column `SortableContext`s: up/down and left/right end up\n * interchangeable depending on incidental rect positions. This instead restricts up/down to\n * reordering within the active card's own column, and left/right to moving into the adjacent\n * column (landing on the closest card there by vertical position, or the column itself when\n * empty). Requires each `KanbanColumn`'s `SortableContext` to be given an explicit `id` matching\n * its column id, so a card's `sortable.containerId` can be correlated with its `column-<id>`\n * droppable.\n */\nexport const kanbanKeyboardCoordinateGetter: KeyboardCoordinateGetter = (event, { context }) => {\n  const { active, collisionRect, droppableRects, droppableContainers } = context;\n\n  if (!active || !collisionRect || !hasSortableData(active)) return undefined;\n\n  const isVertical = event.code === KeyboardCode.Down || event.code === KeyboardCode.Up;\n  const isHorizontal = event.code === KeyboardCode.Left || event.code === KeyboardCode.Right;\n  if (!isVertical && !isHorizontal) return undefined;\n\n  event.preventDefault();\n\n  const activeContainerId = active.data.current.sortable.containerId;\n  const allContainers = droppableContainers.getEnabled();\n\n  if (isColumnDragData(active.data.current)) {\n    // Reordering a whole column: only left/right matters, moving it within the top-level\n    // column `SortableContext` (siblings share its containerId, same as cards share their\n    // own column's). Up/down has nothing to do — columns don't have a \"column above/below\".\n    if (!isHorizontal) return undefined;\n\n    const direction = event.code === KeyboardCode.Right ? 1 : -1;\n    const siblings = collectColumnItemRects(allContainers, droppableRects, activeContainerId).sort(\n      (a, b) => a.rect.left - b.rect.left,\n    );\n    const currentIndex = siblings.findIndex((s) => s.container.id === active.id);\n    if (currentIndex === -1) return undefined;\n\n    const target = siblings[currentIndex + direction];\n    if (!target) return undefined;\n\n    return { x: target.rect.left, y: collisionRect.top };\n  }\n\n  if (isVertical) {\n    const direction = event.code === KeyboardCode.Down ? 1 : -1;\n    const siblings = collectColumnItemRects(allContainers, droppableRects, activeContainerId);\n    const currentIndex = siblings.findIndex((s) => s.container.id === active.id);\n    if (currentIndex === -1) return undefined;\n\n    const target = siblings[currentIndex + direction];\n    if (!target) return undefined;\n\n    return { x: collisionRect.left, y: target.rect.top };\n  }\n\n  const direction = event.code === KeyboardCode.Right ? 1 : -1;\n\n  const columns: ContainerRect[] = [];\n  for (const container of allContainers) {\n    const columnId = resolveColumnDropId(String(container.id));\n    if (columnId === null) continue;\n    const rect = droppableRects.get(container.id);\n    if (!rect) continue;\n    columns.push({ container, rect });\n  }\n  columns.sort((a, b) => a.rect.left - b.rect.left);\n\n  const activeColumnIndex = columns.findIndex((c) => resolveColumnDropId(String(c.container.id)) === activeContainerId);\n  if (activeColumnIndex === -1) return undefined;\n\n  const targetColumn = columns[activeColumnIndex + direction];\n  if (!targetColumn) return undefined;\n\n  const targetContainerId = resolveColumnDropId(String(targetColumn.container.id)) as UniqueIdentifier;\n  const targetItems = collectColumnItemRects(allContainers, droppableRects, targetContainerId);\n\n  let targetRect = targetColumn.rect;\n  if (targetItems.length > 0) {\n    targetRect = targetItems.reduce((closest, item) =>\n      Math.abs(item.rect.top - collisionRect.top) < Math.abs(closest.rect.top - collisionRect.top) ? item : closest,\n    ).rect;\n  }\n\n  return { x: targetRect.left, y: targetRect.top };\n};\n"],"mappings":"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"}
+{"version":3,"file":"kanbanBoard.utils.mjs","names":[],"sources":["../../../../package/common/kanbanBoard/kanbanBoard.utils.ts"],"sourcesContent":["import { arrayMove, hasSortableData } from '@dnd-kit/sortable';\nimport {\n  closestCorners,\n  KeyboardCode,\n  type Announcements,\n  type ClientRect,\n  type CollisionDetection,\n  type DroppableContainer,\n  type KeyboardCoordinateGetter,\n  type UniqueIdentifier,\n} from '@dnd-kit/core';\n\nimport type { KanbanColumnDef } from './kanbanBoard.types';\n\nexport function columnsEqual(a: KanbanColumnDef[], b: KanbanColumnDef[]): boolean {\n  if (a.length !== b.length) return false;\n  return a.every((col, i) => {\n    const other = b[i];\n    return (\n      col.id === other.id &&\n      col.itemIds.length === other.itemIds.length &&\n      col.itemIds.every((itemId, j) => itemId === other.itemIds[j])\n    );\n  });\n}\n\nexport function findColumnForItem(columns: KanbanColumnDef[], itemId: string): number {\n  return columns.findIndex((col) => col.itemIds.includes(itemId));\n}\n\n/** Whether a drag's `active`/`over` participant is a whole column (vs. a card) — see `reorderableColumns`. */\nexport function isColumnDragData(data: unknown): boolean {\n  return Boolean(data && typeof data === 'object' && (data as { type?: string }).type === 'column');\n}\n\n/**\n * Reorders whole columns: moves `activeColumnId` to `overColumnId`'s position. Returns the same\n * `columns` reference, unchanged, when either id doesn't resolve to a column or they're the same\n * — callers can use that to skip a state update.\n */\nexport function moveColumn(\n  columns: KanbanColumnDef[],\n  activeColumnId: string,\n  overColumnId: string,\n): KanbanColumnDef[] {\n  const oldIndex = columns.findIndex((col) => col.id === activeColumnId);\n  const overIndex = columns.findIndex((col) => col.id === overColumnId);\n  if (oldIndex === -1 || overIndex === -1 || oldIndex === overIndex) return columns;\n\n  return arrayMove(columns, oldIndex, overIndex);\n}\n\n/**\n * Collision detection for the board's shared `DndContext`, which has to pick between two very\n * differently-scaled sets of droppables at once: individual cards / a column's own card list\n * (small, numerous) and whole columns (large, few). Plain `closestCorners` weighs every\n * registered droppable together regardless of what's actually being dragged, so while dragging a\n * column it competes against every card and card-list droppable it happens to fly over too — the\n * column-level target only wins when the pointer lands somewhere that geometrically favors it,\n * which reads as needing to \"wiggle it around\" before the right drop target lights up. This\n * restricts the candidates to only the same kind as whatever is being dragged: a column drag only\n * considers other columns, a card drag only considers cards and card lists.\n *\n * A card drag also lets the pointer pick the column, and `closestCorners` only the position within\n * it. Corners alone compare the dragged card's whole rect, so a wide card over a collapsed column\n * had its corners nearer the neighbours' cards, and landed beside the column under the pointer.\n * Without a pointer (the keyboard) or between columns, every column is a candidate as before.\n */\nexport const kanbanCollisionDetection: CollisionDetection = (args) => {\n  const draggingColumn = isColumnDragData(args.active.data.current);\n  const droppableContainers = args.droppableContainers.filter((container) =>\n    draggingColumn ? isColumnDragData(container.data.current) : !isColumnDragData(container.data.current),\n  );\n  const pointerX = args.pointerCoordinates?.x;\n  const lane =\n    draggingColumn || pointerX === undefined\n      ? undefined\n      : droppableContainers.find((container) => {\n          const rect = args.droppableRects.get(container.id);\n          return (\n            resolveColumnDropId(String(container.id)) !== null &&\n            rect &&\n            rect.left <= pointerX &&\n            pointerX <= rect.right\n          );\n        });\n  if (!lane) return closestCorners({ ...args, droppableContainers });\n\n  const laneColumnId = resolveColumnDropId(String(lane.id));\n  return closestCorners({\n    ...args,\n    droppableContainers: droppableContainers.filter(\n      (container) =>\n        container === lane ||\n        (hasSortableData(container) && container.data.current.sortable.containerId === laneColumnId),\n    ),\n  });\n};\n\n/**\n * Whether the auto-scroll may move `scroller`, an ancestor of the board such as the page, while\n * something is dragged: only toward a part of the board that is out of view. Nothing beyond the\n * board takes a drop, and a page left free to scroll carried the whole board off screen.\n */\nexport function scrollsTowardBoard(\n  scroller: { top: number; bottom: number },\n  board: { top: number; bottom: number },\n  dragged: { top: number; height: number },\n): boolean {\n  const goingDown = dragged.top + dragged.height / 2 > (scroller.top + scroller.bottom) / 2;\n  return goingDown ? board.bottom > scroller.bottom + 1 : board.top < scroller.top - 1;\n}\n\n/** Extracts the column id from a column droppable's `column-<id>` identifier, or `null` for a card id. */\nexport function resolveColumnDropId(overId: string): string | null {\n  return overId.startsWith('column-') ? overId.slice('column-'.length) : null;\n}\n\nexport interface DragGeometry {\n  /** The dragged card's current rect (translated by the drag delta), if measured. */\n  activeRect: ClientRect | null;\n  /** The rect of whatever `overId` refers to — a card, or a column's own droppable. */\n  overRect: ClientRect;\n}\n\n/**\n * Computes the columns that result from dragging `activeItemId` over `overId` (a card id, or a\n * `column-<id>` droppable id for empty column space). Returns the same `columns` reference,\n * unchanged, when the drag doesn't resolve to a valid source/destination — callers can use that\n * to skip a state update.\n *\n * `geometry` resolves cross-column drops that land on a card or gap with more than one possible\n * position (see the two branches below for what each one decides).\n */\nexport function moveItem(\n  columns: KanbanColumnDef[],\n  activeItemId: string,\n  overId: string,\n  geometry: DragGeometry,\n): KanbanColumnDef[] {\n  // Only the source/destination column(s) actually change, so only those get new object/array\n  // references — every other column keeps its exact `columns` reference. Cloning every column's\n  // `itemIds` up front (as this used to) cost O(total cards across the whole board) on *every*\n  // drag-over event, not just the couple of columns actually involved in the move.\n  const sourceColIndex = findColumnForItem(columns, activeItemId);\n  if (sourceColIndex === -1) return columns;\n\n  const destColId = resolveColumnDropId(overId);\n  const destColIndex =\n    destColId !== null ? columns.findIndex((col) => col.id === destColId) : findColumnForItem(columns, overId);\n  if (destColIndex === -1) return columns;\n\n  if (sourceColIndex === destColIndex) {\n    const col = columns[sourceColIndex];\n    const oldIndex = col.itemIds.indexOf(activeItemId);\n    if (oldIndex === -1) return columns;\n\n    if (destColId !== null) {\n      // over is the column's own droppable, not a card: nothing else claimed the collision,\n      // which happens hovering the empty gap above/below the cards, or — critically — an edge\n      // next to a disabled/pinned card with no other card nearby, since a disabled card's own\n      // droppable is excluded from collision candidates entirely. Without this branch, that\n      // case fell through to `col.itemIds.indexOf(overId)` below, which is always -1 for a\n      // `column-<id>` id (it's not a card id), silently no-op-ing instead of reordering.\n      const { activeRect, overRect } = geometry;\n      const isBelowCenter = Boolean(\n        activeRect && activeRect.top + activeRect.height / 2 > overRect.top + overRect.height / 2,\n      );\n      const targetIndex = isBelowCenter ? col.itemIds.length - 1 : 0;\n      if (targetIndex === oldIndex) return columns;\n\n      const next = [...columns];\n      next[sourceColIndex] = { ...col, itemIds: arrayMove(col.itemIds, oldIndex, targetIndex) };\n      return next;\n    }\n\n    const newIndex = col.itemIds.indexOf(overId);\n    if (newIndex === -1 || oldIndex === newIndex) return columns;\n\n    const next = [...columns];\n    next[sourceColIndex] = { ...col, itemIds: arrayMove(col.itemIds, oldIndex, newIndex) };\n    return next;\n  }\n\n  const sourceCol = columns[sourceColIndex];\n  const destCol = columns[destColIndex];\n  const destItemIds = [...destCol.itemIds];\n  const { activeRect, overRect } = geometry;\n\n  let insertAt: number;\n  if (destColId !== null) {\n    // Hovering the column's own droppable directly, rather than a specific card: the empty gap\n    // above the first card, the empty gap below the last card, or the whole area when the column\n    // has no cards at all. Comparing centers against the *container's* full-height rect is a\n    // coarse but reliable way to tell the top gap (insert at the start) from the bottom gap\n    // (append at the end) — treating every container hover as \"append\" put a card dropped just\n    // above the first item at the end of the column instead.\n    const isBelowCenter = Boolean(\n      activeRect && activeRect.top + activeRect.height / 2 > overRect.top + overRect.height / 2,\n    );\n    insertAt = isBelowCenter ? destItemIds.length : 0;\n  } else {\n    const overIndex = destItemIds.indexOf(overId);\n\n    // Only the last card's own drop zone extends past its bottom edge with nothing after it to\n    // compete for the collision, so it's the one case where the dragged card can end up \"after\"\n    // it. Requiring the dragged rect's *center* (not its top edge) to pass the hovered card's\n    // bottom edge is deliberately more forgiving than requiring the whole dragged card to clear it\n    // — that stricter version needs the user to drag a full card's height past the last item\n    // before it registers, which in practice almost never happens before the drop, silently\n    // landing the card second-to-last every time despite the live preview showing it last. A pure\n    // center-to-center comparison is too lenient in the other direction: the dragged rect's center\n    // still carries the grab offset from wherever in the source card it was originally picked up,\n    // so a low enough grab point reads as \"past\" well before the drag is visually past the card at\n    // all. Anchoring to the target's *bottom* edge (not its center) keeps that grab-offset problem\n    // from creeping back in while still being achievable in a normal drag.\n    const isLastItem = overIndex !== -1 && overIndex === destItemIds.length - 1;\n    const hasClearedItem = Boolean(\n      activeRect && activeRect.top + activeRect.height / 2 > overRect.top + overRect.height,\n    );\n    insertAt = overIndex === -1 ? destItemIds.length : isLastItem && hasClearedItem ? overIndex + 1 : overIndex;\n  }\n\n  destItemIds.splice(insertAt, 0, activeItemId);\n\n  const next = [...columns];\n  next[sourceColIndex] = { ...sourceCol, itemIds: sourceCol.itemIds.filter((id) => id !== activeItemId) };\n  next[destColIndex] = { ...destCol, itemIds: destItemIds };\n  return next;\n}\n\n/**\n * Where a drag has put the dragged card or column so far. The board keeps this rather than a copy\n * of `columns`, so a change the consumer makes mid-drag (a page appended by `onLoadMore`) still\n * shows, and is still there in what `onChange` receives on drop.\n */\nexport interface DragPlacement {\n  /** The dragged card's or column's id. */\n  id: string;\n  /** The column the card sits in, or `null` while a whole column is dragged. */\n  columnId: string | null;\n  index: number;\n}\n\n/** The position `id` holds in `columns`, as a placement to lay over a later `columns`. */\nexport function findPlacement(columns: KanbanColumnDef[], id: string, isColumn: boolean): DragPlacement | null {\n  if (isColumn) {\n    const index = columns.findIndex((col) => col.id === id);\n    return index === -1 ? null : { id, columnId: null, index };\n  }\n  const columnIndex = findColumnForItem(columns, id);\n  if (columnIndex === -1) return null;\n  const col = columns[columnIndex];\n  return { id, columnId: col.id, index: col.itemIds.indexOf(id) };\n}\n\n/**\n * Moves the dragged card or column to its placement in `columns`. Returns `columns` itself when\n * there is no placement, or when the card, the column, or its destination is no longer there.\n */\nexport function applyPlacement(columns: KanbanColumnDef[], placement: DragPlacement | null): KanbanColumnDef[] {\n  if (!placement) return columns;\n  const { id, columnId, index } = placement;\n\n  if (columnId === null) {\n    const oldIndex = columns.findIndex((col) => col.id === id);\n    return oldIndex === -1 ? columns : arrayMove(columns, oldIndex, index);\n  }\n\n  const sourceColIndex = findColumnForItem(columns, id);\n  const destColIndex = columns.findIndex((col) => col.id === columnId);\n  if (sourceColIndex === -1 || destColIndex === -1) return columns;\n\n  const next = [...columns];\n  const sourceCol = columns[sourceColIndex];\n  next[sourceColIndex] = { ...sourceCol, itemIds: sourceCol.itemIds.filter((itemId) => itemId !== id) };\n  const destItemIds = [...next[destColIndex].itemIds];\n  destItemIds.splice(index, 0, id);\n  next[destColIndex] = { ...next[destColIndex], itemIds: destItemIds };\n  return next;\n}\n\nconst FOCUS_STOP = '[data-kanban-handle], [data-kanban-card]';\n\n/**\n * Where an arrow key moves focus from a focused card or column handle while nothing is picked up.\n * It mirrors what the same keys do to a picked-up card: Up/Down within the column, Left/Right to\n * the nearest card in the next column with anything to focus, or from a handle to the next handle.\n * Returns `null` when `from` is not a card or handle, or there is nowhere to go.\n */\nexport function findArrowFocusTarget(board: HTMLElement, from: HTMLElement, key: string): HTMLElement | null {\n  if (!from.matches(FOCUS_STOP)) return null;\n  const columns = [...board.querySelectorAll<HTMLElement>(':scope > [data-kanban-column]')];\n  const columnIndex = columns.findIndex((column) => column.contains(from));\n  if (columnIndex === -1) return null;\n  const stopsIn = (column: HTMLElement) => [...column.querySelectorAll<HTMLElement>(FOCUS_STOP)];\n\n  if (key === 'ArrowUp' || key === 'ArrowDown') {\n    const stops = stopsIn(columns[columnIndex]);\n    return stops[stops.indexOf(from) + (key === 'ArrowDown' ? 1 : -1)] ?? null;\n  }\n  if (key !== 'ArrowLeft' && key !== 'ArrowRight') return null;\n\n  const direction = key === 'ArrowRight' ? 1 : -1;\n  const top = from.getBoundingClientRect().top;\n  const distance = (el: HTMLElement) => Math.abs(el.getBoundingClientRect().top - top);\n  for (let i = columnIndex + direction; i >= 0 && i < columns.length; i += direction) {\n    const stops = stopsIn(columns[i]);\n    const handle = stops.find((stop) => stop.hasAttribute('data-kanban-handle'));\n    const cards = stops.filter((stop) => stop.hasAttribute('data-kanban-card'));\n    if (handle && (from.hasAttribute('data-kanban-handle') || cards.length === 0)) return handle;\n    if (cards.length > 0) return cards.reduce((closest, card) => (distance(card) < distance(closest) ? card : closest));\n  }\n  return null;\n}\n\n/**\n * Builds screen-reader drag announcements against the columns layout as currently understood\n * (the live layout while a drag is in progress, or the settled `columns` prop otherwise).\n */\nexport function buildAnnouncements<T>(\n  columns: KanbanColumnDef[],\n  items: Record<string, T>,\n  getItemLabel: (item: T, id: string) => string,\n): Announcements {\n  function labelFor(id: string): string {\n    const item = items[id];\n    return item !== undefined ? getItemLabel(item, id) : id;\n  }\n\n  function describeOver(overId: string): string {\n    const destColId = resolveColumnDropId(overId);\n    if (destColId !== null) {\n      const col = columns.find((c) => c.id === destColId);\n      return col ? `the ${col.title} column` : 'a column';\n    }\n\n    const col = columns.find((c) => c.itemIds.includes(overId));\n    return col ? `${labelFor(overId)}, in the ${col.title} column` : labelFor(overId);\n  }\n\n  function columnTitle(id: string): string {\n    return columns.find((c) => c.id === id)?.title ?? id;\n  }\n\n  return {\n    onDragStart({ active }) {\n      if (isColumnDragData(active.data.current)) return `Picked up column ${columnTitle(String(active.id))}.`;\n      return `Picked up card ${labelFor(String(active.id))}.`;\n    },\n    onDragOver({ active, over }) {\n      if (isColumnDragData(active.data.current)) {\n        if (!over) return `Column ${columnTitle(String(active.id))} is no longer over a droppable area.`;\n        return `Column ${columnTitle(String(active.id))} is over column ${columnTitle(String(over.id))}.`;\n      }\n      if (!over) return `Card ${labelFor(String(active.id))} is no longer over a droppable area.`;\n      return `Card ${labelFor(String(active.id))} is over ${describeOver(String(over.id))}.`;\n    },\n    onDragEnd({ active, over }) {\n      if (isColumnDragData(active.data.current)) {\n        if (!over) return `Column ${columnTitle(String(active.id))} was dropped.`;\n        return `Column ${columnTitle(String(active.id))} was dropped over column ${columnTitle(String(over.id))}.`;\n      }\n      if (!over) return `Card ${labelFor(String(active.id))} was dropped.`;\n      return `Card ${labelFor(String(active.id))} was dropped over ${describeOver(String(over.id))}.`;\n    },\n    onDragCancel({ active }) {\n      if (isColumnDragData(active.data.current)) {\n        return `Dragging cancelled. Column ${columnTitle(String(active.id))} was returned to its original position.`;\n      }\n      return `Dragging cancelled. Card ${labelFor(String(active.id))} was returned to its original position.`;\n    },\n  };\n}\n\ninterface ContainerRect {\n  container: DroppableContainer;\n  rect: ClientRect;\n}\n\nfunction collectColumnItemRects(\n  containers: DroppableContainer[],\n  droppableRects: Map<UniqueIdentifier, ClientRect>,\n  containerId: UniqueIdentifier,\n): ContainerRect[] {\n  const entries: ContainerRect[] = [];\n  for (const container of containers) {\n    if (!hasSortableData(container)) continue;\n    if (container.data.current.sortable.containerId !== containerId) continue;\n    const rect = droppableRects.get(container.id);\n    if (!rect) continue;\n    entries.push({ container, rect });\n  }\n  return entries.sort((a, b) => a.rect.top - b.rect.top);\n}\n\n/**\n * Custom keyboard coordinate getter for the board's multi-column, multi-`SortableContext`\n * layout. dnd-kit's default `sortableKeyboardCoordinates` picks the geometrically closest\n * droppable across the *entire* board — cards and column containers alike — which is unreliable\n * once cards live inside independent per-column `SortableContext`s: up/down and left/right end up\n * interchangeable depending on incidental rect positions. This instead restricts up/down to\n * reordering within the active card's own column, and left/right to moving into the adjacent\n * column (landing on the closest card there by vertical position, or the column itself when\n * empty). Requires each `KanbanColumn`'s `SortableContext` to be given an explicit `id` matching\n * its column id, so a card's `sortable.containerId` can be correlated with its `column-<id>`\n * droppable.\n */\nexport const kanbanKeyboardCoordinateGetter: KeyboardCoordinateGetter = (event, { context }) => {\n  const { active, collisionRect, droppableRects, droppableContainers } = context;\n\n  if (!active || !collisionRect || !hasSortableData(active)) return undefined;\n\n  const isVertical = event.code === KeyboardCode.Down || event.code === KeyboardCode.Up;\n  const isHorizontal = event.code === KeyboardCode.Left || event.code === KeyboardCode.Right;\n  if (!isVertical && !isHorizontal) return undefined;\n\n  event.preventDefault();\n\n  const activeContainerId = active.data.current.sortable.containerId;\n  const allContainers = droppableContainers.getEnabled();\n\n  if (isColumnDragData(active.data.current)) {\n    // Reordering a whole column: only left/right matters, moving it within the top-level\n    // column `SortableContext` (siblings share its containerId, same as cards share their\n    // own column's). Up/down has nothing to do — columns don't have a \"column above/below\".\n    if (!isHorizontal) return undefined;\n\n    const direction = event.code === KeyboardCode.Right ? 1 : -1;\n    const siblings = collectColumnItemRects(allContainers, droppableRects, activeContainerId).sort(\n      (a, b) => a.rect.left - b.rect.left,\n    );\n    const currentIndex = siblings.findIndex((s) => s.container.id === active.id);\n    if (currentIndex === -1) return undefined;\n\n    const target = siblings[currentIndex + direction];\n    if (!target) return undefined;\n\n    return { x: target.rect.left, y: collisionRect.top };\n  }\n\n  if (isVertical) {\n    const direction = event.code === KeyboardCode.Down ? 1 : -1;\n    const siblings = collectColumnItemRects(allContainers, droppableRects, activeContainerId);\n    const currentIndex = siblings.findIndex((s) => s.container.id === active.id);\n    if (currentIndex === -1) return undefined;\n\n    const target = siblings[currentIndex + direction];\n    if (!target) return undefined;\n\n    return { x: collisionRect.left, y: target.rect.top };\n  }\n\n  const direction = event.code === KeyboardCode.Right ? 1 : -1;\n\n  const columns: ContainerRect[] = [];\n  for (const container of allContainers) {\n    const columnId = resolveColumnDropId(String(container.id));\n    if (columnId === null) continue;\n    const rect = droppableRects.get(container.id);\n    if (!rect) continue;\n    columns.push({ container, rect });\n  }\n  columns.sort((a, b) => a.rect.left - b.rect.left);\n\n  const activeColumnIndex = columns.findIndex((c) => resolveColumnDropId(String(c.container.id)) === activeContainerId);\n  if (activeColumnIndex === -1) return undefined;\n\n  const targetColumn = columns[activeColumnIndex + direction];\n  if (!targetColumn) return undefined;\n\n  const targetContainerId = resolveColumnDropId(String(targetColumn.container.id)) as UniqueIdentifier;\n  const targetItems = collectColumnItemRects(allContainers, droppableRects, targetContainerId);\n\n  let targetRect = targetColumn.rect;\n  if (targetItems.length > 0) {\n    targetRect = targetItems.reduce((closest, item) =>\n      Math.abs(item.rect.top - collisionRect.top) < Math.abs(closest.rect.top - collisionRect.top) ? item : closest,\n    ).rect;\n  }\n\n  return { x: targetRect.left, y: targetRect.top };\n};\n"],"mappings":"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"}

package/dist/esm/common/splitButton/splitButton.mjs

@@ -1,2 +1,2 @@
-"use client";import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import{useLabels as t}from"../configProvider/useLabels.mjs";import{ThemeColor as n}from"../themeProvider/color.types.mjs";import{ButtonSize as r,ButtonStyleType as i}from"../button/button.types.mjs";import a from"../button/button.mjs";import{PopoverAlign as o,PopoverPlacement as s}from"../popover/popover.types.mjs";import c from"../buttonGroup/buttonGroup.mjs";import l from"../menu/menu.mjs";import u from"./splitButton.module.mjs";import{useState as d}from"react";import f from"classnames";import{faChevronDown as p}from"@fortawesome/free-solid-svg-icons";import{jsx as m,jsxs as h}from"react/jsx-runtime";var g={moreActions:`More actions`};function _(_){let{children:v,onClick:y=()=>{},actions:b=[],styleType:x=i.Filled,color:S=n.Primary,size:C=r.Default,disabled:w=!1,isLoading:T=!1,align:E=o.End,className:D,style:O,classNames:k,styles:A,labels:j,...M}=e(`SplitButton`,_),N=t(`SplitButton`,j,g),[P,F]=d(!1),[I,L]=d(w);return w!==I&&(L(w),w&&F(!1)),h(c,{...M,className:f(u.splitButton,k?.root,D),style:{...O,...A?.root},children:[m(a,{styleType:x,color:S,size:C,disabled:w,isLoading:T,onClick:y,className:f(u.splitButtonPrimary,k?.primaryButton),style:A?.primaryButton,children:v}),m(l,{items:b,isOpen:P,onOpenChange:F,placement:s.Bottom,align:E,classNames:{menu:k?.menu,item:k?.menuItem},styles:{menu:A?.menu,item:A?.menuItem},children:m(a,{styleType:x,color:S,size:C,disabled:w,icon:p,"aria-label":N.moreActions,className:f(u.splitButtonTrigger,k?.triggerButton),style:A?.triggerButton})})]})}export{_ as default};
+"use client";import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import{useLabels as t}from"../configProvider/useLabels.mjs";import{ThemeColor as n}from"../themeProvider/color.types.mjs";import{ButtonSize as r,ButtonStyleType as i}from"../button/button.types.mjs";import a from"../button/button.mjs";import{PopoverAlign as o,PopoverPlacement as s}from"../popover/popover.types.mjs";import c from"../buttonGroup/buttonGroup.mjs";import l from"../menu/menu.mjs";import u from"./splitButton.module.mjs";import{useState as d}from"react";import f from"classnames";import{faChevronDown as p}from"@fortawesome/free-solid-svg-icons";import{jsx as m,jsxs as h}from"react/jsx-runtime";var g={moreActions:`More actions`};function _(_){let{children:v,onClick:y=()=>{},actions:b=[],styleType:x=i.Filled,color:S=n.Primary,size:C=r.Medium,disabled:w=!1,isLoading:T=!1,align:E=o.End,className:D,style:O,classNames:k,styles:A,labels:j,...M}=e(`SplitButton`,_),N=t(`SplitButton`,j,g),[P,F]=d(!1),[I,L]=d(w);return w!==I&&(L(w),w&&F(!1)),h(c,{...M,className:f(u.splitButton,k?.root,D),style:{...O,...A?.root},children:[m(a,{styleType:x,color:S,size:C,disabled:w,isLoading:T,onClick:y,className:f(u.splitButtonPrimary,k?.primaryButton),style:A?.primaryButton,children:v}),m(l,{items:b,isOpen:P,onOpenChange:F,placement:s.Bottom,align:E,classNames:{menu:k?.menu,item:k?.menuItem},styles:{menu:A?.menu,item:A?.menuItem},children:m(a,{styleType:x,color:S,size:C,disabled:w,icon:p,"aria-label":N.moreActions,className:f(u.splitButtonTrigger,k?.triggerButton),style:A?.triggerButton})})]})}export{_ as default};
 //# sourceMappingURL=splitButton.mjs.map

package/dist/esm/common/splitButton/splitButton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"splitButton.mjs","names":[],"sources":["../../../../package/common/splitButton/splitButton.tsx"],"sourcesContent":["import { useState } from 'react';\nimport cx from 'classnames';\nimport { faChevronDown } from '@fortawesome/free-solid-svg-icons';\n\nimport Button from '../button';\nimport { ButtonStyleType, ButtonSize } from '../button/button.types';\nimport ButtonGroup from '../buttonGroup';\nimport Menu from '../menu';\nimport { PopoverAlign, PopoverPlacement } from '../popover/popover.types';\nimport { useComponentDefaults, useLabels } from '../configProvider';\nimport type { SplitButtonLabels, SplitButtonProps } from './splitButton.types';\n\nimport styles from './splitButton.module.pcss';\nimport { ThemeColor } from '../themeProvider/color.types';\n\nconst DEFAULT_LABELS: Required<SplitButtonLabels> = {\n  moreActions: 'More actions',\n};\n\nfunction SplitButton(props: SplitButtonProps) {\n  const {\n    children,\n    onClick = () => {},\n    actions = [],\n    styleType = ButtonStyleType.Filled,\n    color = ThemeColor.Primary,\n    size = ButtonSize.Default,\n    disabled = false,\n    isLoading = false,\n    align = PopoverAlign.End,\n    className,\n    style,\n    classNames,\n    styles: slotStyles,\n    labels,\n    ...rest\n  } = useComponentDefaults('SplitButton', props);\n  const text = useLabels('SplitButton', labels, DEFAULT_LABELS);\n\n  const [isOpen, setIsOpen] = useState(false);\n\n  // Adjusting state during render (not in an effect) on a prop change is the documented React\n  // pattern for this: closing the menu as soon as `disabled` becomes true, without an extra\n  // render tick or a setState-in-effect lint violation.\n  const [prevDisabled, setPrevDisabled] = useState(disabled);\n  if (disabled !== prevDisabled) {\n    setPrevDisabled(disabled);\n    if (disabled) setIsOpen(false);\n  }\n\n  return (\n    <ButtonGroup\n      {...rest}\n      className={cx(styles.splitButton, classNames?.root, className)}\n      style={{ ...style, ...slotStyles?.root }}\n    >\n      <Button\n        styleType={styleType}\n        color={color}\n        size={size}\n        disabled={disabled}\n        isLoading={isLoading}\n        onClick={onClick}\n        className={cx(styles.splitButtonPrimary, classNames?.primaryButton)}\n        style={slotStyles?.primaryButton}\n      >\n        {children}\n      </Button>\n\n      {/* The list, its keys, its focus and its menu semantics are Menu's; this\n          component only welds a second button to the first. */}\n      <Menu\n        items={actions}\n        isOpen={isOpen}\n        onOpenChange={setIsOpen}\n        placement={PopoverPlacement.Bottom}\n        align={align}\n        classNames={{ menu: classNames?.menu, item: classNames?.menuItem }}\n        styles={{ menu: slotStyles?.menu, item: slotStyles?.menuItem }}\n      >\n        <Button\n          styleType={styleType}\n          color={color}\n          size={size}\n          disabled={disabled}\n          icon={faChevronDown}\n          aria-label={text.moreActions}\n          className={cx(styles.splitButtonTrigger, classNames?.triggerButton)}\n          style={slotStyles?.triggerButton}\n        />\n      </Menu>\n    </ButtonGroup>\n  );\n}\n\nexport default SplitButton;\n"],"mappings":"isBAeA,IAAM,EAA8C,CAClD,YAAa,cACf,EAEA,SAAS,EAAY,EAAyB,CAC5C,GAAM,CACJ,WACA,cAAgB,CAAC,EACjB,UAAU,CAAC,EACX,YAAY,EAAgB,OAC5B,QAAQ,EAAW,QACnB,OAAO,EAAW,QAClB,WAAW,GACX,YAAY,GACZ,QAAQ,EAAa,IACrB,YACA,QACA,aACA,OAAQ,EACR,SACA,GAAG,GACD,EAAqB,cAAe,CAAK,EACvC,EAAO,EAAU,cAAe,EAAQ,CAAc,EAEtD,CAAC,EAAQ,GAAa,EAAS,EAAK,EAKpC,CAAC,EAAc,GAAmB,EAAS,CAAQ,EAMzD,OALI,IAAa,IACf,EAAgB,CAAQ,EACpB,GAAU,EAAU,EAAK,GAI7B,EAAC,EAAD,CACE,GAAI,EACJ,UAAW,EAAG,EAAO,YAAa,GAAY,KAAM,CAAS,EAC7D,MAAO,CAAE,GAAG,EAAO,GAAG,GAAY,IAAK,EAHzC,SAAA,CAKE,EAAC,EAAD,CACa,YACJ,QACD,OACI,WACC,YACF,UACT,UAAW,EAAG,EAAO,mBAAoB,GAAY,aAAa,EAClE,MAAO,GAAY,cAElB,UACK,CAAA,EAIR,EAAC,EAAD,CACE,MAAO,EACC,SACR,aAAc,EACd,UAAW,EAAiB,OACrB,QACP,WAAY,CAAE,KAAM,GAAY,KAAM,KAAM,GAAY,QAAS,EACjE,OAAQ,CAAE,KAAM,GAAY,KAAM,KAAM,GAAY,QAAS,EAE7D,SAAA,EAAC,EAAD,CACa,YACJ,QACD,OACI,WACV,KAAM,EACN,aAAY,EAAK,YACjB,UAAW,EAAG,EAAO,mBAAoB,GAAY,aAAa,EAClE,MAAO,GAAY,aACpB,CAAA,CACG,CAAA,CACK,GAEjB"}
+{"version":3,"file":"splitButton.mjs","names":[],"sources":["../../../../package/common/splitButton/splitButton.tsx"],"sourcesContent":["import { useState } from 'react';\nimport cx from 'classnames';\nimport { faChevronDown } from '@fortawesome/free-solid-svg-icons';\n\nimport Button from '../button';\nimport { ButtonStyleType, ButtonSize } from '../button/button.types';\nimport ButtonGroup from '../buttonGroup';\nimport Menu from '../menu';\nimport { PopoverAlign, PopoverPlacement } from '../popover/popover.types';\nimport { useComponentDefaults, useLabels } from '../configProvider';\nimport type { SplitButtonLabels, SplitButtonProps } from './splitButton.types';\n\nimport styles from './splitButton.module.pcss';\nimport { ThemeColor } from '../themeProvider/color.types';\n\nconst DEFAULT_LABELS: Required<SplitButtonLabels> = {\n  moreActions: 'More actions',\n};\n\nfunction SplitButton(props: SplitButtonProps) {\n  const {\n    children,\n    onClick = () => {},\n    actions = [],\n    styleType = ButtonStyleType.Filled,\n    color = ThemeColor.Primary,\n    size = ButtonSize.Medium,\n    disabled = false,\n    isLoading = false,\n    align = PopoverAlign.End,\n    className,\n    style,\n    classNames,\n    styles: slotStyles,\n    labels,\n    ...rest\n  } = useComponentDefaults('SplitButton', props);\n  const text = useLabels('SplitButton', labels, DEFAULT_LABELS);\n\n  const [isOpen, setIsOpen] = useState(false);\n\n  // Adjusting state during render (not in an effect) on a prop change is the documented React\n  // pattern for this: closing the menu as soon as `disabled` becomes true, without an extra\n  // render tick or a setState-in-effect lint violation.\n  const [prevDisabled, setPrevDisabled] = useState(disabled);\n  if (disabled !== prevDisabled) {\n    setPrevDisabled(disabled);\n    if (disabled) setIsOpen(false);\n  }\n\n  return (\n    <ButtonGroup\n      {...rest}\n      className={cx(styles.splitButton, classNames?.root, className)}\n      style={{ ...style, ...slotStyles?.root }}\n    >\n      <Button\n        styleType={styleType}\n        color={color}\n        size={size}\n        disabled={disabled}\n        isLoading={isLoading}\n        onClick={onClick}\n        className={cx(styles.splitButtonPrimary, classNames?.primaryButton)}\n        style={slotStyles?.primaryButton}\n      >\n        {children}\n      </Button>\n\n      {/* The list, its keys, its focus and its menu semantics are Menu's; this\n          component only welds a second button to the first. */}\n      <Menu\n        items={actions}\n        isOpen={isOpen}\n        onOpenChange={setIsOpen}\n        placement={PopoverPlacement.Bottom}\n        align={align}\n        classNames={{ menu: classNames?.menu, item: classNames?.menuItem }}\n        styles={{ menu: slotStyles?.menu, item: slotStyles?.menuItem }}\n      >\n        <Button\n          styleType={styleType}\n          color={color}\n          size={size}\n          disabled={disabled}\n          icon={faChevronDown}\n          aria-label={text.moreActions}\n          className={cx(styles.splitButtonTrigger, classNames?.triggerButton)}\n          style={slotStyles?.triggerButton}\n        />\n      </Menu>\n    </ButtonGroup>\n  );\n}\n\nexport default SplitButton;\n"],"mappings":"isBAeA,IAAM,EAA8C,CAClD,YAAa,cACf,EAEA,SAAS,EAAY,EAAyB,CAC5C,GAAM,CACJ,WACA,cAAgB,CAAC,EACjB,UAAU,CAAC,EACX,YAAY,EAAgB,OAC5B,QAAQ,EAAW,QACnB,OAAO,EAAW,OAClB,WAAW,GACX,YAAY,GACZ,QAAQ,EAAa,IACrB,YACA,QACA,aACA,OAAQ,EACR,SACA,GAAG,GACD,EAAqB,cAAe,CAAK,EACvC,EAAO,EAAU,cAAe,EAAQ,CAAc,EAEtD,CAAC,EAAQ,GAAa,EAAS,EAAK,EAKpC,CAAC,EAAc,GAAmB,EAAS,CAAQ,EAMzD,OALI,IAAa,IACf,EAAgB,CAAQ,EACpB,GAAU,EAAU,EAAK,GAI7B,EAAC,EAAD,CACE,GAAI,EACJ,UAAW,EAAG,EAAO,YAAa,GAAY,KAAM,CAAS,EAC7D,MAAO,CAAE,GAAG,EAAO,GAAG,GAAY,IAAK,EAHzC,SAAA,CAKE,EAAC,EAAD,CACa,YACJ,QACD,OACI,WACC,YACF,UACT,UAAW,EAAG,EAAO,mBAAoB,GAAY,aAAa,EAClE,MAAO,GAAY,cAElB,UACK,CAAA,EAIR,EAAC,EAAD,CACE,MAAO,EACC,SACR,aAAc,EACd,UAAW,EAAiB,OACrB,QACP,WAAY,CAAE,KAAM,GAAY,KAAM,KAAM,GAAY,QAAS,EACjE,OAAQ,CAAE,KAAM,GAAY,KAAM,KAAM,GAAY,QAAS,EAE7D,SAAA,EAAC,EAAD,CACa,YACJ,QACD,OACI,WACV,KAAM,EACN,aAAY,EAAK,YACjB,UAAW,EAAG,EAAO,mBAAoB,GAAY,aAAa,EAClE,MAAO,GAAY,aACpB,CAAA,CACG,CAAA,CACK,GAEjB"}

package/dist/esm/common/stepper/stepper.mjs

@@ -1,2 +1,2 @@
-"use client";import{renderIcon as e}from"../utils/renderIcon.mjs";import t from"./stepper.module.mjs";import{StepperAlignment as n,StepperCollapse as r,StepperLabelPlacement as i,StepperStyleType as a}from"./stepper.types.mjs";import o,{useEffect as s,useRef as c,useState as l}from"react";import u from"classnames";import{Fragment as d,jsx as f,jsxs as p}from"react/jsx-runtime";var m={[a.Default]:t.stepperDefault,[a.Outlined]:t.stepperOutlined,[a.Dots]:t.stepperDots},h={[i.Top]:t.stepperLabelTop,[i.Bottom]:t.stepperLabelBottom,[i.Left]:t.stepperLabelLeft,[i.Right]:t.stepperLabelRight};function g(){return f(`svg`,{className:t.stepperCheckmark,strokeLinejoin:`round`,strokeLinecap:`round`,xmlns:`http://www.w3.org/2000/svg`,viewBox:`-0.2 -1.2 3.4 2`,height:`20px`,width:`20px`,children:f(`path`,{d:`M 0 0 l 1 1 l 2 -2`,strokeWidth:`0.4`,fill:`none`})})}function _({open:e,className:n,style:r,children:i}){let a=c(null),[o,d]=l(null);return s(()=>{let e=a.current;if(!e)return;let t=new ResizeObserver(()=>d(e.offsetHeight));return t.observe(e),()=>t.disconnect()},[]),f(`div`,{className:u(t.stepperContent,n),style:{...r,height:e?o??`auto`:0},"aria-hidden":!e,children:f(`div`,{ref:a,className:t.stepperContentInner,children:i})})}function v(e,t){let n=[i.Left,i.Right];return t?e&&n.includes(e)?e:i.Right:e&&!n.includes(e)?e:i.Bottom}function y({steps:i=[],currentStep:s=0,alignment:c=n.Horizontal,onStepClicked:l=null,nonLinear:y=!1,hideLabels:b=!1,styleType:x=a.Default,collapse:S=r.None,labelPlacement:C,className:w,style:T,classNames:E,styles:D,...O}){let k=c===n.Vertical,A=v(C,k);return f(`div`,{...O,className:u(t.stepper,m[x],h[A],{[t.stepperVertical]:k},E?.root,w),style:{...D?.root,...T},children:i.map((n,a)=>{let c=a<s,m=a<=s,h=!!n.error,v=!!l&&!n.disabled&&(y?a!==s:c),x=u(t.stepperEntry,{[t.stepperEntryActive]:m},{[t.stepperEntryDone]:c&&!h},{[t.stepperEntryError]:h},{[t.stepperEntryDisabled]:n.disabled},{[t.stepperClickable]:v},E?.entry),C=n.icon?e(n.icon,{className:E?.icon,style:D?.icon}):c&&!h?f(g,{}):a+1,w=f(`div`,{className:u(t.stepperEntryNumber,{[t.stepperEntryNumberDone]:c&&!h},E?.entryNumber),style:D?.entryNumber,children:C}),T=n.optional===!0?`Optional`:n.optional===!1?null:n.optional,O=!b&&p(`div`,{className:t.stepperEntryLabels,children:[f(`div`,{className:u(t.stepperEntryLabel,E?.entryLabel),style:D?.entryLabel,children:n.label}),n.description!=null&&f(`div`,{className:u(t.stepperDescription,E?.description),style:D?.description,children:n.description}),T!=null&&f(`div`,{className:u(t.stepperOptional,E?.optional),style:D?.optional,children:T})]}),A=v?{role:`button`,tabIndex:0,onClick:()=>l?.(a),onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),l?.(a))}}:{},j=e=>f(`div`,{className:x,style:D?.entry,"aria-current":a===s?`step`:void 0,"aria-invalid":h||void 0,...A,children:e}),M=a<i.length-1&&f(`div`,{className:u(t.stepperConnector,{[t.stepperConnectorFilled]:c},E?.connector),style:D?.connector});if(k){let e=a===0,o=a===i.length-1,l=S===r.None?!0:S===r.ActiveOnly?a===s:!c,h=n=>{let r=n===`lead`?e:o,i=n===`lead`?m:c;return f(`div`,{className:u(t.stepperRailSegment,{[t.stepperRailFilled]:!r&&i,[t.stepperRailHidden]:r})})},g=p(`div`,{className:t.stepperMarkerCell,children:[h(`lead`),w,h(`trail`)]});return p(`div`,{className:t.stepperStep,children:[j(p(d,{children:[g,O]})),M,n.content!=null&&!b&&f(_,{open:l,className:E?.content,style:D?.content,children:n.content})]},a)}return p(o.Fragment,{children:[j(p(d,{children:[w,O]})),M]},a)})})}export{y as default};
+"use client";import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import{useLabels as t}from"../configProvider/useLabels.mjs";import{ThemeColor as n}from"../themeProvider/color.types.mjs";import{toneProps as r,useToneCheck as i}from"../styles/tone.mjs";import{renderIcon as a}from"../utils/renderIcon.mjs";import o from"./stepper.module.mjs";import{StepperCollapse as s,StepperLabelPlacement as c,StepperOrientation as l,StepperStyleType as u}from"./stepper.types.mjs";import{useEffect as d,useRef as f,useState as p}from"react";import m from"classnames";import{Fragment as h,jsx as g,jsxs as _}from"react/jsx-runtime";var v={[u.Filled]:o.stepperFilled,[u.Outlined]:o.stepperOutlined,[u.Dots]:o.stepperDots},y={[c.Top]:o.stepperLabelTop,[c.Bottom]:o.stepperLabelBottom,[c.Left]:o.stepperLabelLeft,[c.Right]:o.stepperLabelRight},b={optional:`Optional`,completed:`Completed`,notCompleted:`Not completed`,error:`Error`},x=r(n.Error);function S(){return g(`svg`,{className:o.stepperCheckmark,strokeLinejoin:`round`,strokeLinecap:`round`,xmlns:`http://www.w3.org/2000/svg`,viewBox:`-0.2 -1.2 3.4 2`,children:g(`path`,{d:`M 0 0 l 1 1 l 2 -2`,strokeWidth:`0.4`,fill:`none`})})}function C({open:e,className:t,style:n,children:r}){let i=f(null),[a,s]=p(null);return d(()=>{let e=i.current;if(!e)return;let t=new ResizeObserver(()=>s(e.offsetHeight));return t.observe(e),()=>t.disconnect()},[]),g(`div`,{className:m(o.stepperContent,t),style:{...n,height:e?a??`auto`:0},inert:!e,children:g(`div`,{ref:i,className:o.stepperContentInner,children:r})})}function w(e,t){let n=[c.Left,c.Right];return t?e&&n.includes(e)?e:c.Right:e&&!n.includes(e)?e:c.Bottom}function T(c){let{steps:d=[],currentStep:f=0,orientation:p=l.Horizontal,onStepClicked:T=null,nonLinear:E=!1,hideLabels:D=!1,styleType:O=u.Filled,color:k=n.Primary,collapse:A=s.None,labelPlacement:j,labels:M,className:N,style:P,classNames:F,styles:I,...L}=e(`Stepper`,c),R=t(`Stepper`,M,b),z=r(k);i(`Stepper`,[k]);let B=p===l.Vertical,V=w(j,B);return g(`ol`,{...L,role:`list`,className:m(o.stepper,z.className,v[O],y[V],{[o.stepperVertical]:B},F?.root,N),style:{...z.style,...I?.root,...P},children:d.map((e,t)=>{let n=t===f,r=t<f,i=t<=f,c=!!e.error,l=!!T&&!e.disabled&&(E?!n:r),u=l||!!T&&!e.disabled&&n,p=c?R.error:r?R.completed:n?null:R.notCompleted,v=e.icon?a(e.icon,{className:F?.icon,style:I?.icon}):r&&!c?g(S,{}):t+1,y=g(`span`,{"aria-hidden":!0,className:m(o.stepperEntryNumber,c&&x.className,F?.entryNumber),style:I?.entryNumber,children:v}),b=e.optional===!0?R.optional:e.optional===!1?null:e.optional,w=_(`span`,{className:m(o.stepperEntryLabels,{[o.stepperVisuallyHidden]:D}),children:[g(`span`,{className:m(o.stepperEntryLabel,F?.entryLabel),style:I?.entryLabel,children:e.label}),e.description!=null&&_(h,{children:[` `,g(`span`,{className:m(o.stepperDescription,F?.description),style:I?.description,children:e.description})]}),b!=null&&_(h,{children:[` `,g(`span`,{className:m(o.stepperOptional,F?.optional),style:I?.optional,children:b})]}),p!=null&&_(h,{children:[` `,g(`span`,{className:o.stepperVisuallyHidden,children:p})]})]}),O=e=>{let n=e===`lead`?t===0:t===d.length-1,a=e===`lead`?i:r;return g(`span`,{className:m(o.stepperRailSegment,{[o.stepperRailFilled]:!n&&a,[o.stepperRailHidden]:n})})},k=_(h,{children:[B?_(`span`,{className:o.stepperMarkerCell,children:[O(`lead`),y,O(`trail`)]}):y,w]}),j=m(o.stepperEntry,{[o.stepperEntryReached]:i},{[o.stepperEntryDone]:r&&!c},{[o.stepperEntryError]:c},{[o.stepperEntryDisabled]:e.disabled},{[o.stepperClickable]:l},F?.entry);return _(`li`,{className:o.stepperStep,"aria-current":n&&!u?`step`:void 0,children:[u?g(`button`,{type:`button`,className:j,style:I?.entry,"aria-current":n?`step`:void 0,"aria-disabled":!l||void 0,onClick:l?()=>T?.(t):void 0,children:k}):g(`div`,{className:j,style:I?.entry,children:k}),t<d.length-1&&g(`div`,{className:m(o.stepperConnector,{[o.stepperConnectorFilled]:r},F?.connector),style:I?.connector}),B&&e.content!=null&&g(C,{open:A===s.None||(A===s.ActiveOnly?n:!r),className:F?.content,style:I?.content,children:e.content})]},t)})})}export{T as default};
 //# sourceMappingURL=stepper.mjs.map

package/dist/esm/common/stepper/stepper.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"stepper.mjs","names":[],"sources":["../../../../package/common/stepper/stepper.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport cx from 'classnames';\nimport styles from './stepper.module.pcss';\nimport {\n  StepperAlignment,\n  StepperCollapse,\n  StepperLabelPlacement,\n  StepperStyleType,\n  type StepperProps,\n  type StepperStep,\n} from './stepper.types';\nimport { renderIcon } from '../utils/renderIcon';\n\nconst STYLE_CLASS: Record<StepperStyleType, string> = {\n  [StepperStyleType.Default]: styles.stepperDefault,\n  [StepperStyleType.Outlined]: styles.stepperOutlined,\n  [StepperStyleType.Dots]: styles.stepperDots,\n};\n\nconst PLACEMENT_CLASS: Record<StepperLabelPlacement, string> = {\n  [StepperLabelPlacement.Top]: styles.stepperLabelTop,\n  [StepperLabelPlacement.Bottom]: styles.stepperLabelBottom,\n  [StepperLabelPlacement.Left]: styles.stepperLabelLeft,\n  [StepperLabelPlacement.Right]: styles.stepperLabelRight,\n};\n\nfunction Checkmark() {\n  return (\n    <svg\n      className={styles.stepperCheckmark}\n      strokeLinejoin='round'\n      strokeLinecap='round'\n      xmlns='http://www.w3.org/2000/svg'\n      viewBox='-0.2 -1.2 3.4 2'\n      height='20px'\n      width='20px'\n    >\n      <path d='M 0 0 l 1 1 l 2 -2' strokeWidth='0.4' fill='none' />\n    </svg>\n  );\n}\n\nfunction StepBody({\n  open,\n  className,\n  style,\n  children,\n}: {\n  open: boolean;\n  className?: string;\n  style?: React.CSSProperties;\n  children: React.ReactNode;\n}) {\n  const innerRef = useRef<HTMLDivElement>(null);\n  const [height, setHeight] = useState<number | null>(null);\n\n  useEffect(() => {\n    const el = innerRef.current;\n    if (!el) return;\n    const observer = new ResizeObserver(() => setHeight(el.offsetHeight));\n    observer.observe(el);\n    return () => observer.disconnect();\n  }, []);\n\n  return (\n    <div\n      className={cx(styles.stepperContent, className)}\n      style={{ ...style, height: open ? (height ?? 'auto') : 0 }}\n      aria-hidden={!open}\n    >\n      <div ref={innerRef} className={styles.stepperContentInner}>\n        {children}\n      </div>\n    </div>\n  );\n}\n\nfunction resolvePlacement(placement: StepperLabelPlacement | undefined, isVertical: boolean): StepperLabelPlacement {\n  const verticalValues = [StepperLabelPlacement.Left, StepperLabelPlacement.Right];\n  if (isVertical) {\n    return placement && verticalValues.includes(placement) ? placement : StepperLabelPlacement.Right;\n  }\n  return placement && !verticalValues.includes(placement) ? placement : StepperLabelPlacement.Bottom;\n}\n\nexport default function Stepper({\n  steps = [],\n  currentStep = 0,\n  alignment = StepperAlignment.Horizontal,\n  onStepClicked = null,\n  nonLinear = false,\n  hideLabels = false,\n  styleType = StepperStyleType.Default,\n  collapse = StepperCollapse.None,\n  labelPlacement,\n  className,\n  style,\n  classNames,\n  styles: slotStyles,\n  ...rest\n}: StepperProps) {\n  const isVertical = alignment === StepperAlignment.Vertical;\n  const placement = resolvePlacement(labelPlacement, isVertical);\n\n  return (\n    <div\n      {...rest}\n      className={cx(\n        styles.stepper,\n        STYLE_CLASS[styleType],\n        PLACEMENT_CLASS[placement],\n        { [styles.stepperVertical]: isVertical },\n        classNames?.root,\n        className,\n      )}\n      style={{ ...slotStyles?.root, ...style }}\n    >\n      {steps.map((step: StepperStep, index: number) => {\n        const isDone = index < currentStep;\n        const isActive = index <= currentStep;\n        const hasError = !!step.error;\n        // nonLinear: every enabled step except the current one is clickable.\n        // linear: only completed steps are clickable.\n        const isClickable = !!onStepClicked && !step.disabled && (nonLinear ? index !== currentStep : isDone);\n\n        const entryClassName = cx(\n          styles.stepperEntry,\n          { [styles.stepperEntryActive]: isActive },\n          { [styles.stepperEntryDone]: isDone && !hasError },\n          { [styles.stepperEntryError]: hasError },\n          { [styles.stepperEntryDisabled]: step.disabled },\n          { [styles.stepperClickable]: isClickable },\n          classNames?.entry,\n        );\n\n        const markerContent = step.icon ? (\n          renderIcon(step.icon, { className: classNames?.icon, style: slotStyles?.icon })\n        ) : isDone && !hasError ? (\n          <Checkmark />\n        ) : (\n          index + 1\n        );\n\n        const marker = (\n          <div\n            className={cx(\n              styles.stepperEntryNumber,\n              { [styles.stepperEntryNumberDone]: isDone && !hasError },\n              classNames?.entryNumber,\n            )}\n            style={slotStyles?.entryNumber}\n          >\n            {markerContent}\n          </div>\n        );\n\n        const optionalNode = step.optional === true ? 'Optional' : step.optional !== false ? step.optional : null;\n\n        const labels = !hideLabels && (\n          <div className={styles.stepperEntryLabels}>\n            <div className={cx(styles.stepperEntryLabel, classNames?.entryLabel)} style={slotStyles?.entryLabel}>\n              {step.label}\n            </div>\n            {step.description != null && (\n              <div className={cx(styles.stepperDescription, classNames?.description)} style={slotStyles?.description}>\n                {step.description}\n              </div>\n            )}\n            {optionalNode != null && (\n              <div className={cx(styles.stepperOptional, classNames?.optional)} style={slotStyles?.optional}>\n                {optionalNode}\n              </div>\n            )}\n          </div>\n        );\n\n        const interactiveProps: React.HTMLAttributes<HTMLDivElement> = isClickable\n          ? {\n              role: 'button',\n              tabIndex: 0,\n              onClick: () => onStepClicked?.(index),\n              onKeyDown: (e) => {\n                if (e.key === 'Enter' || e.key === ' ') {\n                  e.preventDefault();\n                  onStepClicked?.(index);\n                }\n              },\n            }\n          : {};\n\n        const wrapHeader = (inner: React.ReactNode) => (\n          <div\n            className={entryClassName}\n            style={slotStyles?.entry}\n            aria-current={index === currentStep ? 'step' : undefined}\n            aria-invalid={hasError || undefined}\n            {...interactiveProps}\n          >\n            {inner}\n          </div>\n        );\n\n        const connector = index < steps.length - 1 && (\n          <div\n            className={cx(styles.stepperConnector, { [styles.stepperConnectorFilled]: isDone }, classNames?.connector)}\n            style={slotStyles?.connector}\n          />\n        );\n\n        if (isVertical) {\n          const isFirst = index === 0;\n          const isLast = index === steps.length - 1;\n          const bodyOpen =\n            collapse === StepperCollapse.None\n              ? true\n              : collapse === StepperCollapse.ActiveOnly\n                ? index === currentStep\n                : !isDone;\n\n          const railSegment = (variant: 'lead' | 'trail') => {\n            const hidden = variant === 'lead' ? isFirst : isLast;\n            const filled = variant === 'lead' ? isActive : isDone;\n            return (\n              <div\n                className={cx(styles.stepperRailSegment, {\n                  [styles.stepperRailFilled]: !hidden && filled,\n                  [styles.stepperRailHidden]: hidden,\n                })}\n              />\n            );\n          };\n\n          const markerCell = (\n            <div className={styles.stepperMarkerCell}>\n              {railSegment('lead')}\n              {marker}\n              {railSegment('trail')}\n            </div>\n          );\n\n          return (\n            <div key={index} className={styles.stepperStep}>\n              {wrapHeader(\n                <>\n                  {markerCell}\n                  {labels}\n                </>,\n              )}\n              {connector}\n              {step.content != null && !hideLabels && (\n                <StepBody open={bodyOpen} className={classNames?.content} style={slotStyles?.content}>\n                  {step.content}\n                </StepBody>\n              )}\n            </div>\n          );\n        }\n\n        return (\n          <React.Fragment key={index}>\n            {wrapHeader(\n              <>\n                {marker}\n                {labels}\n              </>,\n            )}\n            {connector}\n          </React.Fragment>\n        );\n      })}\n    </div>\n  );\n}\n"],"mappings":"4XAaA,IAAM,EAAgD,EACnD,EAAiB,SAAU,EAAO,gBAClC,EAAiB,UAAW,EAAO,iBACnC,EAAiB,MAAO,EAAO,WAClC,EAEM,EAAyD,EAC5D,EAAsB,KAAM,EAAO,iBACnC,EAAsB,QAAS,EAAO,oBACtC,EAAsB,MAAO,EAAO,kBACpC,EAAsB,OAAQ,EAAO,iBACxC,EAEA,SAAS,GAAY,CACnB,OACE,EAAC,MAAD,CACE,UAAW,EAAO,iBAClB,eAAe,QACf,cAAc,QACd,MAAM,6BACN,QAAQ,kBACR,OAAO,OACP,MAAM,OAEN,SAAA,EAAC,OAAD,CAAM,EAAE,qBAAqB,YAAY,MAAM,KAAK,MAAQ,CAAA,CACzD,CAAA,CAET,CAEA,SAAS,EAAS,CAChB,OACA,YACA,QACA,YAMC,CACD,IAAM,EAAW,EAAuB,IAAI,EACtC,CAAC,EAAQ,GAAa,EAAwB,IAAI,EAUxD,OARA,MAAgB,CACd,IAAM,EAAK,EAAS,QACpB,GAAI,CAAC,EAAI,OACT,IAAM,EAAW,IAAI,mBAAqB,EAAU,EAAG,YAAY,CAAC,EAEpE,OADA,EAAS,QAAQ,CAAE,MACN,EAAS,WAAW,CACnC,EAAG,CAAC,CAAC,EAGH,EAAC,MAAD,CACE,UAAW,EAAG,EAAO,eAAgB,CAAS,EAC9C,MAAO,CAAE,GAAG,EAAO,OAAQ,EAAQ,GAAU,OAAU,CAAE,EACzD,cAAa,CAAC,EAEd,SAAA,EAAC,MAAD,CAAK,IAAK,EAAU,UAAW,EAAO,oBACnC,UACE,CAAA,CACF,CAAA,CAET,CAEA,SAAS,EAAiB,EAA8C,EAA4C,CAClH,IAAM,EAAiB,CAAC,EAAsB,KAAM,EAAsB,KAAK,EAI/E,OAHI,EACK,GAAa,EAAe,SAAS,CAAS,EAAI,EAAY,EAAsB,MAEtF,GAAa,CAAC,EAAe,SAAS,CAAS,EAAI,EAAY,EAAsB,MAC9F,CAEA,SAAwB,EAAQ,CAC9B,QAAQ,CAAC,EACT,cAAc,EACd,YAAY,EAAiB,WAC7B,gBAAgB,KAChB,YAAY,GACZ,aAAa,GACb,YAAY,EAAiB,QAC7B,WAAW,EAAgB,KAC3B,iBACA,YACA,QACA,aACA,OAAQ,EACR,GAAG,GACY,CACf,IAAM,EAAa,IAAc,EAAiB,SAC5C,EAAY,EAAiB,EAAgB,CAAU,EAE7D,OACE,EAAC,MAAD,CACE,GAAI,EACJ,UAAW,EACT,EAAO,QACP,EAAY,GACZ,EAAgB,GAChB,EAAG,EAAO,iBAAkB,CAAW,EACvC,GAAY,KACZ,CACF,EACA,MAAO,CAAE,GAAG,GAAY,KAAM,GAAG,CAAM,EAEtC,SAAA,EAAM,KAAK,EAAmB,IAAkB,CAC/C,IAAM,EAAS,EAAQ,EACjB,EAAW,GAAS,EACpB,EAAW,CAAC,CAAC,EAAK,MAGlB,EAAc,CAAC,CAAC,GAAiB,CAAC,EAAK,WAAa,EAAY,IAAU,EAAc,GAExF,EAAiB,EACrB,EAAO,aACP,EAAG,EAAO,oBAAqB,CAAS,EACxC,EAAG,EAAO,kBAAmB,GAAU,CAAC,CAAS,EACjD,EAAG,EAAO,mBAAoB,CAAS,EACvC,EAAG,EAAO,sBAAuB,EAAK,QAAS,EAC/C,EAAG,EAAO,kBAAmB,CAAY,EACzC,GAAY,KACd,EAEM,EAAgB,EAAK,KACzB,EAAW,EAAK,KAAM,CAAE,UAAW,GAAY,KAAM,MAAO,GAAY,IAAK,CAAC,EAC5E,GAAU,CAAC,EACb,EAAC,EAAD,CAAY,CAAA,EAEZ,EAAQ,EAGJ,EACJ,EAAC,MAAD,CACE,UAAW,EACT,EAAO,mBACP,EAAG,EAAO,wBAAyB,GAAU,CAAC,CAAS,EACvD,GAAY,WACd,EACA,MAAO,GAAY,YAElB,SAAA,CACE,CAAA,EAGD,EAAe,EAAK,WAAa,GAAO,WAAa,EAAK,WAAa,GAAwB,KAAhB,EAAK,SAEpF,EAAS,CAAC,GACd,EAAC,MAAD,CAAK,UAAW,EAAO,mBAAvB,SAAA,CACE,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,kBAAmB,GAAY,UAAU,EAAG,MAAO,GAAY,WACtF,SAAA,EAAK,KACH,CAAA,EACJ,EAAK,aAAe,MACnB,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,mBAAoB,GAAY,WAAW,EAAG,MAAO,GAAY,YACxF,SAAA,EAAK,WACH,CAAA,EAEN,GAAgB,MACf,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,gBAAiB,GAAY,QAAQ,EAAG,MAAO,GAAY,SAClF,SAAA,CACE,CAAA,CAEJ,IAGD,EAAyD,EAC3D,CACE,KAAM,SACN,SAAU,EACV,YAAe,IAAgB,CAAK,EACpC,UAAY,GAAM,EACZ,EAAE,MAAQ,SAAW,EAAE,MAAQ,OACjC,EAAE,eAAe,EACjB,IAAgB,CAAK,EAEzB,CACF,EACA,CAAC,EAEC,EAAc,GAClB,EAAC,MAAD,CACE,UAAW,EACX,MAAO,GAAY,MACnB,eAAc,IAAU,EAAc,OAAS,IAAA,GAC/C,eAAc,GAAY,IAAA,GAC1B,GAAI,EAEH,SAAA,CACE,CAAA,EAGD,EAAY,EAAQ,EAAM,OAAS,GACvC,EAAC,MAAD,CACE,UAAW,EAAG,EAAO,iBAAkB,EAAG,EAAO,wBAAyB,CAAO,EAAG,GAAY,SAAS,EACzG,MAAO,GAAY,SACpB,CAAA,EAGH,GAAI,EAAY,CACd,IAAM,EAAU,IAAU,EACpB,EAAS,IAAU,EAAM,OAAS,EAClC,EACJ,IAAa,EAAgB,KACzB,GACA,IAAa,EAAgB,WAC3B,IAAU,EACV,CAAC,EAEH,EAAe,GAA8B,CACjD,IAAM,EAAS,IAAY,OAAS,EAAU,EACxC,EAAS,IAAY,OAAS,EAAW,EAC/C,OACE,EAAC,MAAD,CACE,UAAW,EAAG,EAAO,mBAAoB,EACtC,EAAO,mBAAoB,CAAC,GAAU,GACtC,EAAO,mBAAoB,CAC9B,CAAC,CACF,CAAA,CAEL,EAEM,EACJ,EAAC,MAAD,CAAK,UAAW,EAAO,kBAAvB,SAAA,CACG,EAAY,MAAM,EAClB,EACA,EAAY,OAAO,CACjB,IAGP,OACE,EAAC,MAAD,CAAiB,UAAW,EAAO,YAAnC,SAAA,CACG,EACC,EAAA,EAAA,CAAA,SAAA,CACG,EACA,CACD,CAAA,CAAA,CACJ,EACC,EACA,EAAK,SAAW,MAAQ,CAAC,GACxB,EAAC,EAAD,CAAU,KAAM,EAAU,UAAW,GAAY,QAAS,MAAO,GAAY,QAC1E,SAAA,EAAK,OACE,CAAA,CAET,CAbK,EAAA,CAaL,CAET,CAEA,OACE,EAAC,EAAM,SAAP,CAAA,SAAA,CACG,EACC,EAAA,EAAA,CAAA,SAAA,CACG,EACA,CACD,CAAA,CAAA,CACJ,EACC,CACa,CAAA,EARK,CAQL,CAEpB,CAAC,CACE,CAAA,CAET"}
+{"version":3,"file":"stepper.mjs","names":[],"sources":["../../../../package/common/stepper/stepper.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport cx from 'classnames';\nimport styles from './stepper.module.pcss';\nimport {\n  StepperCollapse,\n  StepperLabelPlacement,\n  StepperOrientation,\n  StepperStyleType,\n  type StepperLabels,\n  type StepperProps,\n  type StepperStep,\n} from './stepper.types';\nimport { useComponentDefaults, useLabels } from '../configProvider';\nimport { ThemeColor } from '../themeProvider/color.types';\nimport { toneProps, useToneCheck } from '../styles/tone';\nimport { renderIcon } from '../utils/renderIcon';\n\nconst STYLE_CLASS: Record<StepperStyleType, string> = {\n  [StepperStyleType.Filled]: styles.stepperFilled,\n  [StepperStyleType.Outlined]: styles.stepperOutlined,\n  [StepperStyleType.Dots]: styles.stepperDots,\n};\n\nconst PLACEMENT_CLASS: Record<StepperLabelPlacement, string> = {\n  [StepperLabelPlacement.Top]: styles.stepperLabelTop,\n  [StepperLabelPlacement.Bottom]: styles.stepperLabelBottom,\n  [StepperLabelPlacement.Left]: styles.stepperLabelLeft,\n  [StepperLabelPlacement.Right]: styles.stepperLabelRight,\n};\n\nconst DEFAULT_LABELS: Required<StepperLabels> = {\n  optional: 'Optional',\n  completed: 'Completed',\n  notCompleted: 'Not completed',\n  error: 'Error',\n};\n\nconst ERROR_TONE = toneProps(ThemeColor.Error);\n\nfunction Checkmark() {\n  return (\n    <svg\n      className={styles.stepperCheckmark}\n      strokeLinejoin='round'\n      strokeLinecap='round'\n      xmlns='http://www.w3.org/2000/svg'\n      viewBox='-0.2 -1.2 3.4 2'\n    >\n      <path d='M 0 0 l 1 1 l 2 -2' strokeWidth='0.4' fill='none' />\n    </svg>\n  );\n}\n\nfunction StepBody({\n  open,\n  className,\n  style,\n  children,\n}: {\n  open: boolean;\n  className?: string;\n  style?: React.CSSProperties;\n  children: React.ReactNode;\n}) {\n  const innerRef = useRef<HTMLDivElement>(null);\n  const [height, setHeight] = useState<number | null>(null);\n\n  useEffect(() => {\n    const el = innerRef.current;\n    if (!el) return;\n    const observer = new ResizeObserver(() => setHeight(el.offsetHeight));\n    observer.observe(el);\n    return () => observer.disconnect();\n  }, []);\n\n  return (\n    <div\n      className={cx(styles.stepperContent, className)}\n      style={{ ...style, height: open ? (height ?? 'auto') : 0 }}\n      inert={!open}\n    >\n      <div ref={innerRef} className={styles.stepperContentInner}>\n        {children}\n      </div>\n    </div>\n  );\n}\n\nfunction resolvePlacement(placement: StepperLabelPlacement | undefined, isVertical: boolean): StepperLabelPlacement {\n  const verticalValues = [StepperLabelPlacement.Left, StepperLabelPlacement.Right];\n  if (isVertical) {\n    return placement && verticalValues.includes(placement) ? placement : StepperLabelPlacement.Right;\n  }\n  return placement && !verticalValues.includes(placement) ? placement : StepperLabelPlacement.Bottom;\n}\n\nexport default function Stepper(props: StepperProps) {\n  const {\n    steps = [],\n    currentStep = 0,\n    orientation = StepperOrientation.Horizontal,\n    onStepClicked = null,\n    nonLinear = false,\n    hideLabels = false,\n    styleType = StepperStyleType.Filled,\n    color = ThemeColor.Primary,\n    collapse = StepperCollapse.None,\n    labelPlacement,\n    labels,\n    className,\n    style,\n    classNames,\n    styles: slotStyles,\n    ...rest\n  } = useComponentDefaults('Stepper', props);\n  const text = useLabels('Stepper', labels, DEFAULT_LABELS);\n  const tone = toneProps(color);\n  useToneCheck('Stepper', [color]);\n  const isVertical = orientation === StepperOrientation.Vertical;\n  const placement = resolvePlacement(labelPlacement, isVertical);\n\n  return (\n    <ol\n      {...rest}\n      // WebKit drops the list role from a list styled `list-style: none`.\n      role='list'\n      className={cx(\n        styles.stepper,\n        tone.className,\n        STYLE_CLASS[styleType],\n        PLACEMENT_CLASS[placement],\n        { [styles.stepperVertical]: isVertical },\n        classNames?.root,\n        className,\n      )}\n      style={{ ...tone.style, ...slotStyles?.root, ...style }}\n    >\n      {steps.map((step: StepperStep, index: number) => {\n        const isCurrent = index === currentStep;\n        const isDone = index < currentStep;\n        const isReached = index <= currentStep;\n        const hasError = !!step.error;\n        // nonLinear: every enabled step except the current one is clickable.\n        // linear: only completed steps are clickable.\n        const isClickable = !!onStepClicked && !step.disabled && (nonLinear ? !isCurrent : isDone);\n        // The current step stays a button, aria-disabled rather than `disabled`: the step just\n        // activated becomes current, and swapping or disabling its button drops focus to the body.\n        const isButton = isClickable || (!!onStepClicked && !step.disabled && isCurrent);\n        const status = hasError ? text.error : isDone ? text.completed : isCurrent ? null : text.notCompleted;\n\n        const markerContent = step.icon ? (\n          renderIcon(step.icon, { className: classNames?.icon, style: slotStyles?.icon })\n        ) : isDone && !hasError ? (\n          <Checkmark />\n        ) : (\n          index + 1\n        );\n\n        // Hidden from screen readers: the list already gives the position, and the status text\n        // says what the checkmark shows.\n        const marker = (\n          <span\n            aria-hidden\n            className={cx(styles.stepperEntryNumber, hasError && ERROR_TONE.className, classNames?.entryNumber)}\n            style={slotStyles?.entryNumber}\n          >\n            {markerContent}\n          </span>\n        );\n\n        const optionalNode = step.optional === true ? text.optional : step.optional !== false ? step.optional : null;\n\n        // The {' '}s keep the parts apart in a button's accessible name (\"Account Completed\", not\n        // \"AccountCompleted\"). A flex container does not render white space, so the layout is unchanged.\n        const labelBlock = (\n          <span className={cx(styles.stepperEntryLabels, { [styles.stepperVisuallyHidden]: hideLabels })}>\n            <span className={cx(styles.stepperEntryLabel, classNames?.entryLabel)} style={slotStyles?.entryLabel}>\n              {step.label}\n            </span>\n            {step.description != null && (\n              <>\n                {' '}\n                <span\n                  className={cx(styles.stepperDescription, classNames?.description)}\n                  style={slotStyles?.description}\n                >\n                  {step.description}\n                </span>\n              </>\n            )}\n            {optionalNode != null && (\n              <>\n                {' '}\n                <span className={cx(styles.stepperOptional, classNames?.optional)} style={slotStyles?.optional}>\n                  {optionalNode}\n                </span>\n              </>\n            )}\n            {status != null && (\n              <>\n                {' '}\n                <span className={styles.stepperVisuallyHidden}>{status}</span>\n              </>\n            )}\n          </span>\n        );\n\n        const railSegment = (variant: 'lead' | 'trail') => {\n          const hidden = variant === 'lead' ? index === 0 : index === steps.length - 1;\n          const filled = variant === 'lead' ? isReached : isDone;\n          return (\n            <span\n              className={cx(styles.stepperRailSegment, {\n                [styles.stepperRailFilled]: !hidden && filled,\n                [styles.stepperRailHidden]: hidden,\n              })}\n            />\n          );\n        };\n\n        const entryContent = (\n          <>\n            {isVertical ? (\n              <span className={styles.stepperMarkerCell}>\n                {railSegment('lead')}\n                {marker}\n                {railSegment('trail')}\n              </span>\n            ) : (\n              marker\n            )}\n            {labelBlock}\n          </>\n        );\n\n        const entryClassName = cx(\n          styles.stepperEntry,\n          { [styles.stepperEntryReached]: isReached },\n          { [styles.stepperEntryDone]: isDone && !hasError },\n          { [styles.stepperEntryError]: hasError },\n          { [styles.stepperEntryDisabled]: step.disabled },\n          { [styles.stepperClickable]: isClickable },\n          classNames?.entry,\n        );\n\n        return (\n          <li key={index} className={styles.stepperStep} aria-current={isCurrent && !isButton ? 'step' : undefined}>\n            {isButton ? (\n              <button\n                type='button'\n                className={entryClassName}\n                style={slotStyles?.entry}\n                aria-current={isCurrent ? 'step' : undefined}\n                aria-disabled={!isClickable || undefined}\n                onClick={isClickable ? () => onStepClicked?.(index) : undefined}\n              >\n                {entryContent}\n              </button>\n            ) : (\n              <div className={entryClassName} style={slotStyles?.entry}>\n                {entryContent}\n              </div>\n            )}\n            {index < steps.length - 1 && (\n              <div\n                className={cx(\n                  styles.stepperConnector,\n                  { [styles.stepperConnectorFilled]: isDone },\n                  classNames?.connector,\n                )}\n                style={slotStyles?.connector}\n              />\n            )}\n            {isVertical && step.content != null && (\n              <StepBody\n                open={\n                  collapse === StepperCollapse.None || (collapse === StepperCollapse.ActiveOnly ? isCurrent : !isDone)\n                }\n                className={classNames?.content}\n                style={slotStyles?.content}\n              >\n                {step.content}\n              </StepBody>\n            )}\n          </li>\n        );\n      })}\n    </ol>\n  );\n}\n"],"mappings":"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"}