@vuu-ui/vuu-layout 0.12.2 → 0.13.1

package/esm/drag-drop/DropTarget.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropTarget.js","sources":["../../src/drag-drop/DropTarget.ts"],"sourcesContent":["import { LayoutModel, rect, rectTuple } from \"@vuu-ui/vuu-utils\";\nimport { getProps, typeOf } from \"../utils\";\nimport {\n  BoxModel,\n  getPosition,\n  Measurements,\n  Position,\n  positionValues,\n  RelativeDropPosition,\n} from \"./BoxModel\";\nimport { DragDropRect, DropPos, DropPosTab } from \"./dragDropTypes\";\nimport { DragState } from \"./DragState\";\n\nexport const isTabstrip = (dropTarget: DropTarget) =>\n  dropTarget.pos.tab &&\n  typeOf(dropTarget.component) === \"Stack\" &&\n  dropTarget.pos.position.Header;\n\nconst { north, south, east, west } = positionValues;\nconst eastwest = east + west;\nconst northsouth = north + south;\n\nexport interface DropTargetProps {\n  component: LayoutModel;\n  pos: DropPos;\n  clientRect: DragDropRect;\n  nextDropTarget: DropTarget | null;\n}\n\nexport type GuideLine = [\n  number,\n  number,\n  number,\n  number,\n  number,\n  number,\n  number,\n  number,\n];\nexport interface TargetDropOutline {\n  l: number;\n  r: number;\n  t: number;\n  b: number;\n  tabLeft?: number;\n  tabWidth?: number;\n  tabHeight?: number;\n  guideLines?: GuideLine;\n}\n\nexport class DropTarget {\n  private active: boolean;\n\n  public box: unknown;\n  public clientRect: DragDropRect;\n  public component: LayoutModel;\n  public dropRect: rectTuple | undefined;\n  public nextDropTarget: DropTarget | null;\n  public pos: DropPos;\n\n  constructor({\n    component,\n    pos,\n    clientRect /*, closeToTheEdge*/,\n    nextDropTarget,\n  }: DropTargetProps) {\n    this.component = component;\n    this.pos = pos;\n    this.clientRect = clientRect;\n    this.nextDropTarget = nextDropTarget;\n    this.active = false;\n    this.dropRect = undefined;\n  }\n\n  targetTabPos(tab: DropPosTab) {\n    const { left: tabLeft, width: tabWidth, positionRelativeToTab } = tab;\n    return positionRelativeToTab === RelativeDropPosition.BEFORE\n      ? tabLeft\n      : tabLeft + tabWidth;\n  }\n\n  /**\n   * Determine what will be rendered by the dropTargetRenderer\n   *\n   * @param {*} lineWidth\n   * @param {*} dragState\n   * @returns {l, t, r, b, tabLeft, tabWidth, tabHeight}\n   */\n  getTargetDropOutline(\n    lineWidth: number,\n    dragState?: DragState,\n  ): TargetDropOutline {\n    if (this.pos.tab) {\n      return this.getDropTabOutline(lineWidth, this.pos.tab);\n    } else if (dragState && dragState.hasIntrinsicSize()) {\n      return this.getIntrinsicDropRect(dragState);\n    } else {\n      const [l, t, r, b] = this.getDropRectOutline(\n        lineWidth,\n        dragState,\n      ) as rectTuple;\n      return { l, t, r, b };\n    }\n  }\n\n  getDropTabOutline(lineWidth: number, tab: DropPosTab): TargetDropOutline {\n    const {\n      clientRect: { top, left, right, bottom, header },\n    } = this;\n\n    const inset = 0;\n    const gap = Math.round(lineWidth / 2) + inset;\n\n    const t = Math.round(top);\n    const l = Math.round(left + gap);\n    const r = Math.round(right - gap);\n    const b = Math.round(bottom - gap);\n    const tabLeft = this.targetTabPos(tab);\n    const tabWidth = 60; // should really measure text\n    const tabHeight = (header?.bottom ?? 0) - (header?.top ?? 0);\n    return { l, t, r, b, tabLeft, tabWidth, tabHeight };\n  }\n\n  getIntrinsicDropRect(dragState: DragState): TargetDropOutline {\n    const { pos, clientRect: rect } = this;\n\n    const { x, y } = dragState;\n\n    let height = dragState.intrinsicSize?.height ?? 0;\n    let width = dragState.intrinsicSize?.height ?? 0;\n\n    if (height && height > rect.height) {\n      console.log(`DropTarget: we're going to blow the gaff`);\n      height = rect.height;\n    } else if (width && width > rect.width) {\n      console.log(`DropTarget: we're going to blow the gaff`);\n      width = rect.width;\n    }\n\n    const left = Math.min(\n      rect.right - width,\n      Math.max(rect.left, Math.round(pos.x - x.mousePct * width)),\n    );\n    const top = Math.min(\n      rect.bottom - height,\n      Math.max(rect.top, Math.round(pos.y - y.mousePct * height)),\n    );\n    const [l, t, r, b] = (this.dropRect = [\n      left,\n      top,\n      left + width,\n      top + height,\n    ]);\n\n    const guideLines: GuideLine = pos.position.EastOrWest\n      ? [l, rect.top, l, rect.bottom, r, rect.top, r, rect.bottom]\n      : [rect.left, t, rect.right, t, rect.left, b, rect.right, b];\n\n    return { l, r, t, b, guideLines };\n  }\n\n  /**\n   * @returns  [left, top, right, bottom]\n   */\n  getDropRectOutline(lineWidth: number, dragState?: DragState) {\n    const { pos, clientRect: rect } = this;\n    const { width: suggestedWidth, height: suggestedHeight, position } = pos;\n\n    const { width: intrinsicWidth, height: intrinsicHeight } =\n      dragState?.intrinsicSize ?? {};\n    const sizeHeight = intrinsicHeight ?? suggestedHeight ?? 0;\n    const sizeWidth = intrinsicWidth ?? suggestedWidth ?? 0;\n\n    this.dropRect = undefined;\n\n    const { top: t, left: l, right: r, bottom: b } = rect;\n\n    const inset = 0;\n    const gap = Math.round(lineWidth / 2) + inset;\n\n    switch (position) {\n      case Position.North:\n      case Position.Header: {\n        const halfHeight = Math.round((b - t) / 2);\n        const height = sizeHeight\n          ? Math.min(halfHeight, Math.round(sizeHeight))\n          : halfHeight;\n        return sizeWidth && l + sizeWidth < r\n          ? [l + gap, t + gap, l + sizeWidth - gap, t + gap + height] // need flex direction indicator\n          : [l + gap, t + gap, r - gap, t + gap + height];\n      }\n      case Position.West: {\n        const halfWidth = Math.round((r - l) / 2);\n        const width = sizeWidth\n          ? Math.min(halfWidth, Math.round(sizeWidth))\n          : halfWidth;\n        return sizeHeight && t + sizeHeight < b\n          ? [l + gap, t + gap, l - gap + width, t + sizeHeight + gap] // need flex direction indicator\n          : [l + gap, t + gap, l - gap + width, b - gap];\n      }\n      case Position.East: {\n        const halfWidth = Math.round((r - l) / 2);\n        const width = sizeWidth\n          ? Math.min(halfWidth, Math.round(sizeWidth))\n          : halfWidth;\n        return sizeHeight && t + sizeHeight < b\n          ? [r - gap - width, t + gap, r - gap, t + sizeHeight + gap] // need flex direction indicator\n          : [r - gap - width, t + gap, r - gap, b - gap];\n      }\n      case Position.South: {\n        const halfHeight = Math.round((b - t) / 2);\n        const height = sizeHeight\n          ? Math.min(halfHeight, Math.round(sizeHeight))\n          : halfHeight;\n\n        return sizeWidth && l + sizeWidth < r\n          ? [l + gap, b - gap - height, l + sizeWidth - gap, b - gap] // need flex direction indicator\n          : [l + gap, b - gap - height, r - gap, b - gap];\n      }\n      case Position.Centre: {\n        return [l + gap, t + gap, r - gap, b - gap];\n      }\n      default:\n        console.warn(`DropTarget does not recognize position ${position}`);\n        return null;\n    }\n  }\n\n  activate() {\n    this.active = true;\n    return this;\n  }\n\n  toArray(this: DropTarget) {\n    // eslint-disable-next-line @typescript-eslint/no-this-alias\n    let dropTarget: DropTarget | null = this;\n    const dropTargets = [dropTarget];\n    // eslint-disable-next-line no-cond-assign\n    while ((dropTarget = dropTarget.nextDropTarget)) {\n      dropTargets.push(dropTarget);\n    }\n    return dropTargets;\n  }\n\n  static getActiveDropTarget(dropTarget: DropTarget | null): DropTarget | null {\n    return dropTarget === null\n      ? null\n      : dropTarget?.active\n        ? dropTarget\n        : DropTarget.getActiveDropTarget(dropTarget.nextDropTarget);\n  }\n}\n\n// Initial entry to this method is always via the app (may be it should be *on* the app)\nexport function identifyDropTarget(\n  x: number,\n  y: number,\n  rootLayout: LayoutModel,\n  measurements: Measurements,\n  intrinsicSize?: number,\n  validDropTargets?: string[],\n) {\n  let dropTarget = null;\n\n  const allBoxesContainingPoint = BoxModel.allBoxesContainingPoint(\n    rootLayout,\n    measurements,\n    x,\n    y,\n    validDropTargets,\n  );\n\n  if (allBoxesContainingPoint.length) {\n    const [component, ...containers] = allBoxesContainingPoint;\n    const {\n      \"data-path\": dataPath,\n      path = dataPath,\n      \"data-row-placeholder\": isRowPlaceholder,\n    } = getProps(component);\n    const clientRect = measurements[path];\n    const placeholderOrientation =\n      intrinsicSize && isRowPlaceholder ? \"row\" : undefined;\n    const pos = getPosition(x, y, clientRect, placeholderOrientation);\n    const box = measurements[path];\n\n    const nextDropTarget = ([nextTarget, ...targets]: LayoutModel[]):\n      | DropTarget\n      | undefined => {\n      if (pos.position?.Header || pos.closeToTheEdge) {\n        const targetPosition = getTargetPosition(\n          nextTarget,\n          pos,\n          box,\n          measurements,\n          x,\n          y,\n        );\n        if (targetPosition) {\n          const [containerPos, clientRect] = targetPosition;\n\n          return new DropTarget({\n            component: nextTarget,\n            pos: containerPos,\n            clientRect,\n            nextDropTarget: nextDropTarget(targets) ?? null,\n          });\n        } else if (targets.length) {\n          return nextDropTarget(targets);\n        }\n      }\n    };\n    dropTarget = new DropTarget({\n      component,\n      pos,\n      clientRect,\n      nextDropTarget: nextDropTarget(containers) ?? null,\n    }).activate();\n  }\n\n  return dropTarget;\n}\n\nfunction getTargetPosition(\n  container: LayoutModel,\n  { closeToTheEdge, position }: DropPos,\n  box: rect,\n  measurements: Measurements,\n  x: number,\n  y: number,\n): [DropPos, DragDropRect] | undefined {\n  if (!container || container.type === \"LayoutContainer\") {\n    return;\n  }\n\n  const containingBox = measurements[container.props.path];\n  const closeToTop = closeToTheEdge & positionValues.north;\n  const closeToRight = closeToTheEdge & positionValues.east;\n  const closeToBottom = closeToTheEdge & positionValues.south;\n  const closeToLeft = closeToTheEdge & positionValues.west;\n\n  const atTop =\n    (closeToTop || position.Header) &&\n    Math.round(box.top) === Math.round(containingBox.top);\n  const atRight =\n    closeToRight && Math.round(box.right) === Math.round(containingBox.right);\n  const atBottom =\n    closeToBottom &&\n    Math.round(box.bottom) === Math.round(containingBox.bottom);\n  const atLeft =\n    closeToLeft && Math.round(box.left) === Math.round(containingBox.left);\n\n  if (atTop || atRight || atBottom || atLeft) {\n    const { \"data-path\": dataPath, path = dataPath } = container.props;\n    const clientRect = measurements[path];\n    const containerPos = getPosition(x, y, clientRect);\n\n    // if its a VBox and we're close to left or right ...\n    if (\n      (isVBox(container) || isTabbedContainer(container)) &&\n      closeToTheEdge & eastwest\n    ) {\n      containerPos.width = 120;\n      return [containerPos, clientRect];\n    }\n    // if it's a HBox and we're close to top or bottom ...\n    else if (\n      (isHBox(container) || isTabbedContainer(container)) &&\n      (position.Header || closeToTheEdge & northsouth)\n    ) {\n      containerPos.height = 120;\n      return [containerPos, clientRect];\n    }\n  }\n}\n\nfunction isTabbedContainer(component: LayoutModel) {\n  return typeOf(component) === \"Stack\";\n}\n\nfunction isVBox(component: LayoutModel) {\n  return (\n    typeOf(component) === \"Flexbox\" &&\n    component.props.style.flexDirection === \"column\"\n  );\n}\n\nfunction isHBox(component: LayoutModel) {\n  return (\n    typeOf(component) === \"Flexbox\" &&\n    component.props.style.flexDirection === \"row\"\n  );\n}\n"],"names":["rect","clientRect"],"mappings":"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"}
+{"version":3,"file":"DropTarget.js","sources":["../../src/drag-drop/DropTarget.ts"],"sourcesContent":["import { LayoutModel, rect, rectTuple } from \"@vuu-ui/vuu-utils\";\nimport { getProps, typeOf } from \"../utils\";\nimport {\n  BoxModel,\n  getPosition,\n  Measurements,\n  Position,\n  positionValues,\n  RelativeDropPosition,\n} from \"./BoxModel\";\nimport { DragDropRect, DropPos, DropPosTab } from \"./dragDropTypes\";\nimport { DragState } from \"./DragState\";\n\nexport const isTabstrip = (dropTarget: DropTarget) =>\n  dropTarget.pos.tab &&\n  typeOf(dropTarget.component) === \"Stack\" &&\n  dropTarget.pos.position.Header;\n\nconst { north, south, east, west } = positionValues;\nconst eastwest = east + west;\nconst northsouth = north + south;\n\nexport interface DropTargetProps {\n  component: LayoutModel;\n  pos: DropPos;\n  clientRect: DragDropRect;\n  nextDropTarget: DropTarget | null;\n}\n\nexport type GuideLine = [\n  number,\n  number,\n  number,\n  number,\n  number,\n  number,\n  number,\n  number,\n];\nexport interface TargetDropOutline {\n  l: number;\n  r: number;\n  t: number;\n  b: number;\n  tabLeft?: number;\n  tabWidth?: number;\n  tabHeight?: number;\n  guideLines?: GuideLine;\n}\n\nexport class DropTarget {\n  private active: boolean;\n\n  public box: unknown;\n  public clientRect: DragDropRect;\n  public component: LayoutModel;\n  public dropRect: rectTuple | undefined;\n  public nextDropTarget: DropTarget | null;\n  public pos: DropPos;\n\n  constructor({\n    component,\n    pos,\n    clientRect /*, closeToTheEdge*/,\n    nextDropTarget,\n  }: DropTargetProps) {\n    this.component = component;\n    this.pos = pos;\n    this.clientRect = clientRect;\n    this.nextDropTarget = nextDropTarget;\n    this.active = false;\n    this.dropRect = undefined;\n  }\n\n  targetTabPos(tab: DropPosTab) {\n    const { left: tabLeft, width: tabWidth, positionRelativeToTab } = tab;\n    return positionRelativeToTab === RelativeDropPosition.BEFORE\n      ? tabLeft\n      : tabLeft + tabWidth;\n  }\n\n  /**\n   * Determine what will be rendered by the dropTargetRenderer\n   *\n   * @param {*} lineWidth\n   * @param {*} dragState\n   * @returns {l, t, r, b, tabLeft, tabWidth, tabHeight}\n   */\n  getTargetDropOutline(\n    lineWidth: number,\n    dragState?: DragState,\n  ): TargetDropOutline {\n    if (this.pos.tab) {\n      return this.getDropTabOutline(lineWidth, this.pos.tab);\n    } else if (dragState && dragState.hasIntrinsicSize()) {\n      return this.getIntrinsicDropRect(dragState);\n    } else {\n      const [l, t, r, b] = this.getDropRectOutline(\n        lineWidth,\n        dragState,\n      ) as rectTuple;\n      return { l, t, r, b };\n    }\n  }\n\n  getDropTabOutline(lineWidth: number, tab: DropPosTab): TargetDropOutline {\n    const {\n      clientRect: { top, left, right, bottom, header },\n    } = this;\n\n    const inset = 0;\n    const gap = Math.round(lineWidth / 2) + inset;\n\n    const t = Math.round(top);\n    const l = Math.round(left + gap);\n    const r = Math.round(right - gap);\n    const b = Math.round(bottom - gap);\n    const tabLeft = this.targetTabPos(tab);\n    const tabWidth = 60; // should really measure text\n    const tabHeight = (header?.bottom ?? 0) - (header?.top ?? 0);\n    return { l, t, r, b, tabLeft, tabWidth, tabHeight };\n  }\n\n  getIntrinsicDropRect(dragState: DragState): TargetDropOutline {\n    const { pos, clientRect: rect } = this;\n\n    const { x, y } = dragState;\n\n    let height = dragState.intrinsicSize?.height ?? 0;\n    let width = dragState.intrinsicSize?.height ?? 0;\n\n    if (height && height > rect.height) {\n      console.log(`DropTarget: we're going to blow the gaff`);\n      height = rect.height;\n    } else if (width && width > rect.width) {\n      console.log(`DropTarget: we're going to blow the gaff`);\n      width = rect.width;\n    }\n\n    const left = Math.min(\n      rect.right - width,\n      Math.max(rect.left, Math.round(pos.x - x.mousePct * width)),\n    );\n    const top = Math.min(\n      rect.bottom - height,\n      Math.max(rect.top, Math.round(pos.y - y.mousePct * height)),\n    );\n    const [l, t, r, b] = (this.dropRect = [\n      left,\n      top,\n      left + width,\n      top + height,\n    ]);\n\n    const guideLines: GuideLine = pos.position.EastOrWest\n      ? [l, rect.top, l, rect.bottom, r, rect.top, r, rect.bottom]\n      : [rect.left, t, rect.right, t, rect.left, b, rect.right, b];\n\n    return { l, r, t, b, guideLines };\n  }\n\n  /**\n   * @returns  [left, top, right, bottom]\n   */\n  getDropRectOutline(lineWidth: number, dragState?: DragState) {\n    const { pos, clientRect: rect } = this;\n    const { width: suggestedWidth, height: suggestedHeight, position } = pos;\n\n    const { width: intrinsicWidth, height: intrinsicHeight } =\n      dragState?.intrinsicSize ?? {};\n    const sizeHeight = intrinsicHeight ?? suggestedHeight ?? 0;\n    const sizeWidth = intrinsicWidth ?? suggestedWidth ?? 0;\n\n    this.dropRect = undefined;\n\n    const { top: t, left: l, right: r, bottom: b } = rect;\n\n    const inset = 0;\n    const gap = Math.round(lineWidth / 2) + inset;\n\n    switch (position) {\n      case Position.North:\n      case Position.Header: {\n        const halfHeight = Math.round((b - t) / 2);\n        const height = sizeHeight\n          ? Math.min(halfHeight, Math.round(sizeHeight))\n          : halfHeight;\n        return sizeWidth && l + sizeWidth < r\n          ? [l + gap, t + gap, l + sizeWidth - gap, t + gap + height] // need flex direction indicator\n          : [l + gap, t + gap, r - gap, t + gap + height];\n      }\n      case Position.West: {\n        const halfWidth = Math.round((r - l) / 2);\n        const width = sizeWidth\n          ? Math.min(halfWidth, Math.round(sizeWidth))\n          : halfWidth;\n        return sizeHeight && t + sizeHeight < b\n          ? [l + gap, t + gap, l - gap + width, t + sizeHeight + gap] // need flex direction indicator\n          : [l + gap, t + gap, l - gap + width, b - gap];\n      }\n      case Position.East: {\n        const halfWidth = Math.round((r - l) / 2);\n        const width = sizeWidth\n          ? Math.min(halfWidth, Math.round(sizeWidth))\n          : halfWidth;\n        return sizeHeight && t + sizeHeight < b\n          ? [r - gap - width, t + gap, r - gap, t + sizeHeight + gap] // need flex direction indicator\n          : [r - gap - width, t + gap, r - gap, b - gap];\n      }\n      case Position.South: {\n        const halfHeight = Math.round((b - t) / 2);\n        const height = sizeHeight\n          ? Math.min(halfHeight, Math.round(sizeHeight))\n          : halfHeight;\n\n        return sizeWidth && l + sizeWidth < r\n          ? [l + gap, b - gap - height, l + sizeWidth - gap, b - gap] // need flex direction indicator\n          : [l + gap, b - gap - height, r - gap, b - gap];\n      }\n      case Position.Centre: {\n        return [l + gap, t + gap, r - gap, b - gap];\n      }\n      default:\n        console.warn(`DropTarget does not recognize position ${position}`);\n        return null;\n    }\n  }\n\n  activate() {\n    this.active = true;\n    return this;\n  }\n\n  toArray(this: DropTarget) {\n    // eslint-disable-next-line @typescript-eslint/no-this-alias\n    let dropTarget: DropTarget | null = this;\n    const dropTargets = [dropTarget];\n    // eslint-disable-next-line no-cond-assign\n    while ((dropTarget = dropTarget.nextDropTarget)) {\n      dropTargets.push(dropTarget);\n    }\n    return dropTargets;\n  }\n\n  static getActiveDropTarget(dropTarget: DropTarget | null): DropTarget | null {\n    return dropTarget === null\n      ? null\n      : dropTarget?.active\n        ? dropTarget\n        : DropTarget.getActiveDropTarget(dropTarget.nextDropTarget);\n  }\n}\n\n// Initial entry to this method is always via the app (may be it should be *on* the app)\nexport function identifyDropTarget(\n  x: number,\n  y: number,\n  rootLayout: LayoutModel,\n  measurements: Measurements,\n  intrinsicSize?: number,\n  validDropTargets?: string[],\n) {\n  let dropTarget = null;\n\n  const allBoxesContainingPoint = BoxModel.allBoxesContainingPoint(\n    rootLayout,\n    measurements,\n    x,\n    y,\n    validDropTargets,\n  );\n\n  if (allBoxesContainingPoint.length) {\n    const [component, ...containers] = allBoxesContainingPoint;\n    const {\n      \"data-path\": dataPath,\n      path = dataPath,\n      \"data-row-placeholder\": isRowPlaceholder,\n    } = getProps(component);\n    const clientRect = measurements[path];\n    const placeholderOrientation =\n      intrinsicSize && isRowPlaceholder ? \"row\" : undefined;\n    const pos = getPosition(x, y, clientRect, placeholderOrientation);\n    const box = measurements[path];\n\n    const nextDropTarget = ([nextTarget, ...targets]: LayoutModel[]):\n      | DropTarget\n      | undefined => {\n      if (pos.position?.Header || pos.closeToTheEdge) {\n        const targetPosition = getTargetPosition(\n          nextTarget,\n          pos,\n          box,\n          measurements,\n          x,\n          y,\n        );\n        if (targetPosition) {\n          const [containerPos, clientRect] = targetPosition;\n\n          return new DropTarget({\n            component: nextTarget,\n            pos: containerPos,\n            clientRect,\n            nextDropTarget: nextDropTarget(targets) ?? null,\n          });\n        } else if (targets.length) {\n          return nextDropTarget(targets);\n        }\n      }\n    };\n    dropTarget = new DropTarget({\n      component,\n      pos,\n      clientRect,\n      nextDropTarget: nextDropTarget(containers) ?? null,\n    }).activate();\n  }\n\n  return dropTarget;\n}\n\nfunction getTargetPosition(\n  container: LayoutModel,\n  { closeToTheEdge, position }: DropPos,\n  box: rect,\n  measurements: Measurements,\n  x: number,\n  y: number,\n): [DropPos, DragDropRect] | undefined {\n  if (!container || container.type === \"LayoutContainer\") {\n    return;\n  }\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  const containingBox = measurements[(container.props as any).path];\n  const closeToTop = closeToTheEdge & positionValues.north;\n  const closeToRight = closeToTheEdge & positionValues.east;\n  const closeToBottom = closeToTheEdge & positionValues.south;\n  const closeToLeft = closeToTheEdge & positionValues.west;\n\n  const atTop =\n    (closeToTop || position.Header) &&\n    Math.round(box.top) === Math.round(containingBox.top);\n  const atRight =\n    closeToRight && Math.round(box.right) === Math.round(containingBox.right);\n  const atBottom =\n    closeToBottom &&\n    Math.round(box.bottom) === Math.round(containingBox.bottom);\n  const atLeft =\n    closeToLeft && Math.round(box.left) === Math.round(containingBox.left);\n\n  if (atTop || atRight || atBottom || atLeft) {\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    const { \"data-path\": dataPath, path = dataPath } = container.props as any;\n    const clientRect = measurements[path];\n    const containerPos = getPosition(x, y, clientRect);\n\n    // if its a VBox and we're close to left or right ...\n    if (\n      (isVBox(container) || isTabbedContainer(container)) &&\n      closeToTheEdge & eastwest\n    ) {\n      containerPos.width = 120;\n      return [containerPos, clientRect];\n    }\n    // if it's a HBox and we're close to top or bottom ...\n    else if (\n      (isHBox(container) || isTabbedContainer(container)) &&\n      (position.Header || closeToTheEdge & northsouth)\n    ) {\n      containerPos.height = 120;\n      return [containerPos, clientRect];\n    }\n  }\n}\n\nfunction isTabbedContainer(component: LayoutModel) {\n  return typeOf(component) === \"Stack\";\n}\n\nfunction isVBox(component: LayoutModel) {\n  return (\n    typeOf(component) === \"Flexbox\" &&\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    (component.props as any).style.flexDirection === \"column\"\n  );\n}\n\nfunction isHBox(component: LayoutModel) {\n  return (\n    typeOf(component) === \"Flexbox\" &&\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    (component.props as any).style.flexDirection === \"row\"\n  );\n}\n"],"names":["rect","clientRect"],"mappings":"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"}

package/esm/drag-drop/DropTargetRenderer.js

@@ -1,15 +1,10 @@
-import { jsx } from 'react/jsx-runtime';
-import { PopupService } from '@vuu-ui/vuu-popups';
 import { RelativeDropPosition } from './BoxModel.js';
-import { computeMenuPosition, DropMenu } from './DropMenu.js';
 
 var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-let _multiDropOptions = false;
 let _hoverDropTarget = null;
 let _shiftedTab = null;
-const onHoverDropTarget = (dropTarget) => _hoverDropTarget = dropTarget;
 const start = ([x, y]) => `M${x},${y}`;
 const point = ([x, y]) => `L${x},${y}`;
 const pathFromPoints = ([p1, ...points]) => `${start(p1)} ${points.map(point)}Z`;
@@ -77,7 +72,6 @@ class DropTargetCanvas {
     if (dragCanvas) {
       dragCanvas.style.visibility = "hidden";
     }
-    PopupService.hidePopup();
   }
   get hoverDropTarget() {
     return _hoverDropTarget;
@@ -132,13 +126,10 @@ class DropTargetCanvas {
     }
   }
   draw(dropTarget, dragState) {
-    const sameDropTarget = false;
-    const wasMultiDrop = _multiDropOptions;
     if (_hoverDropTarget !== null) {
       this.drawTarget(_hoverDropTarget);
     } else {
       {
-        _multiDropOptions = dropTarget.nextDropTarget != null;
         if (dropTarget.pos.tab) {
           moveExistingTabs(dropTarget);
         } else if (_shiftedTab) {
@@ -146,26 +137,6 @@ class DropTargetCanvas {
         }
         this.drawTarget(dropTarget, dragState);
       }
-      if (_multiDropOptions) {
-        const [left, top, orientation] = computeMenuPosition(dropTarget);
-        if (!wasMultiDrop || !sameDropTarget) {
-          const component = /* @__PURE__ */ jsx(
-            DropMenu,
-            {
-              dropTarget,
-              onHover: onHoverDropTarget,
-              orientation
-            }
-          );
-          PopupService.showPopup({
-            left,
-            top,
-            component
-          });
-        }
-      } else {
-        PopupService.hidePopup();
-      }
     }
   }
   drawTarget(dropTarget, dragState) {

package/esm/drag-drop/DropTargetRenderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropTargetRenderer.js","sources":["../../src/drag-drop/DropTargetRenderer.tsx"],"sourcesContent":["import { PopupService } from \"@vuu-ui/vuu-popups\";\nimport { RelativeDropPosition } from \"./BoxModel\";\nimport { DragDropRect } from \"./dragDropTypes\";\nimport { DragState } from \"./DragState\";\nimport { computeMenuPosition, DropMenu } from \"./DropMenu\";\nimport { DropTarget, GuideLine } from \"./DropTarget\";\n\ntype Point = [number, number];\ntype TabMode = \"full-view\" | \"tab-only\";\n\nlet _multiDropOptions = false;\nlet _hoverDropTarget: DropTarget | null = null;\nlet _shiftedTab: HTMLElement | null = null;\n\nconst onHoverDropTarget = (dropTarget: DropTarget | null) =>\n  (_hoverDropTarget = dropTarget);\n\nconst start = ([x, y]: Point) => `M${x},${y}`;\nconst point = ([x, y]: Point) => `L${x},${y}`;\nconst pathFromPoints = ([p1, ...points]: Point[]) =>\n  `${start(p1)} ${points.map(point)}Z`;\n\nconst pathFromGuideLines = (guideLines?: GuideLine) => {\n  if (guideLines) {\n    const [x1, y1, x2, y2, x3, y3, x4, y4] = guideLines;\n    return `M${x1},${y1} L${x2},${y2} M${x3},${y3} L${x4},${y4}`;\n  } else {\n    return \"\";\n  }\n};\n\nfunction insertSVGRoot() {\n  if (document.getElementById(\"hw-drag-canvas\") === null) {\n    const root = document.getElementById(\"root\");\n    const container = document.createElement(\"div\");\n    container.id = \"hw-drag-canvas\";\n    container.style.cssText = `visibility:hidden;z-index:10;position:absolute;top:0px;left:0;right:0;bottom:0;background-color:transparent`;\n    container.innerHTML = `\n      <svg width=\"100%\" height=\"100%\" style=\"position: absolute;\">\n        <path id=\"hw-drop-guides\" style=\"fill: none; stroke: rgba(0, 0, 0, 0.3);stroke-dasharray: 2 3\"/>\n        <path\n          id=\"vuu-drop-outline\"\n          style=\"fill:rgba(0,0,255,.3);stroke:none;stroke-dasharray:4 2\"\n          d=\"M300,132 L380,132 L380,100 L460,100 L460,132, L550,132 L550,350 L300,350z\">\n          <animate\n            attributeName=\"d\"\n            id=\"hw-drop-outline-animate\"\n            begin=\"indefinite\"\n            dur=\"300ms\"\n            fill=\"freeze\"\n            to=\"M255,33 L255,33,L255,1,L315,1,L315,1,L794,1,L794,164,L255,164Z\"\n          />\n        </path>\n      </svg>\n      `;\n    document.body.insertBefore(container, root);\n  }\n}\nexport default class DropTargetCanvas {\n  private currentPath: string | null = null;\n  private tabMode: TabMode | null = null;\n\n  constructor() {\n    insertSVGRoot();\n  }\n\n  prepare(dragRect: DragDropRect, tabMode: TabMode = \"full-view\") {\n    // don't do this on body\n    const dragCanvas = document.getElementById(\"hw-drag-canvas\");\n    if (dragCanvas) {\n      dragCanvas.style.visibility = \"visible\";\n    } else {\n      throw Error(\"DropTargetRenderer.prepare no drag canvas detected\");\n    }\n    document.body.classList.add(\"drawing\");\n    this.currentPath = null;\n    this.tabMode = tabMode;\n\n    const points = this.getPoints(0, 0, 0, 0);\n    // const points = this.getPoints(left, top, width, height);\n    const d = pathFromPoints(points);\n\n    const dropOutlinePath = document.getElementById(\"vuu-drop-outline\");\n    dropOutlinePath?.setAttribute(\"d\", d);\n    this.currentPath = d;\n  }\n\n  clear() {\n    // don't do this on body\n    _hoverDropTarget = null;\n    clearShiftedTab();\n    const dragCanvas = document.getElementById(\"hw-drag-canvas\");\n    if (dragCanvas) {\n      dragCanvas.style.visibility = \"hidden\";\n    }\n    PopupService.hidePopup();\n  }\n\n  get hoverDropTarget() {\n    return _hoverDropTarget;\n  }\n\n  getPoints(\n    x: number,\n    y: number,\n    width: number,\n    height: number,\n    tabLeft = 0,\n    tabWidth = 0,\n    tabHeight = 0,\n  ): Point[] {\n    const tabOnly = this.tabMode === \"tab-only\";\n    if (tabWidth === 0) {\n      return [\n        [x, y + tabHeight],\n        [x, y + tabHeight],\n        [x, y],\n        [x + tabWidth, y],\n        [x + tabWidth, y],\n        [x + width, y],\n        [x + width, y + height],\n        [x, y + height],\n      ];\n    } else if (tabOnly) {\n      const left = tabLeft;\n      return [\n        [left, y],\n        [left, y],\n        [left + tabWidth, y],\n        [left + tabWidth, y],\n        [left + tabWidth, y + tabHeight],\n        [left + tabWidth, y + tabHeight],\n        [left, y + tabHeight],\n        [left, y + tabHeight],\n      ];\n    } else if (tabLeft === 0) {\n      return [\n        [x, y + tabHeight],\n        [x, y + tabHeight],\n        [x, y],\n        [x + tabWidth, y],\n        [x + tabWidth, y + tabHeight],\n        [x + width, y + tabHeight],\n        [x + width, y + height],\n        [x, y + height],\n      ];\n    } else {\n      return [\n        [x, y + tabHeight],\n        [x + tabLeft, y + tabHeight],\n        [x + tabLeft, y],\n        [x + tabLeft, y],\n        [x + tabLeft, y + tabHeight],\n        [x + width, y + tabHeight],\n        [x + width, y + height],\n        [x, y + height],\n      ];\n    }\n  }\n\n  draw(dropTarget: DropTarget, dragState: DragState) {\n    const sameDropTarget = false;\n    const wasMultiDrop = _multiDropOptions;\n\n    if (_hoverDropTarget !== null) {\n      this.drawTarget(_hoverDropTarget);\n    } else {\n      if (sameDropTarget === false) {\n        _multiDropOptions = dropTarget.nextDropTarget != null;\n        if (dropTarget.pos.tab) {\n          moveExistingTabs(dropTarget);\n        } else if (_shiftedTab) {\n          clearShiftedTab();\n        }\n        this.drawTarget(dropTarget, dragState);\n      }\n\n      if (_multiDropOptions) {\n        const [left, top, orientation] = computeMenuPosition(dropTarget);\n        if (!wasMultiDrop || !sameDropTarget) {\n          const component = (\n            <DropMenu\n              dropTarget={dropTarget}\n              onHover={onHoverDropTarget}\n              orientation={orientation}\n            />\n          );\n          PopupService.showPopup({\n            left,\n            top,\n            component,\n          });\n        }\n      } else {\n        PopupService.hidePopup();\n      }\n    }\n  }\n\n  drawTarget(dropTarget: DropTarget, dragState?: DragState) {\n    const lineWidth = 6;\n\n    const targetDropOutline = dropTarget.getTargetDropOutline(\n      lineWidth,\n      dragState,\n    );\n\n    if (targetDropOutline) {\n      const { l, t, r, b, tabLeft, tabWidth, tabHeight, guideLines } =\n        targetDropOutline;\n      const w = r - l;\n      const h = b - t;\n\n      if (this.currentPath) {\n        const path = document.getElementById(\"vuu-drop-outline\");\n        path?.setAttribute(\"d\", this.currentPath);\n      }\n\n      const points = this.getPoints(l, t, w, h, tabLeft, tabWidth, tabHeight);\n      const path = pathFromPoints(points);\n      const animation = document.getElementById(\n        \"hw-drop-outline-animate\",\n      ) as unknown as SVGAnimateElement;\n      animation?.setAttribute(\"to\", path);\n      animation?.beginElement();\n      this.currentPath = path;\n\n      const dropGuidePath = document.getElementById(\"hw-drop-guides\");\n      dropGuidePath?.setAttribute(\"d\", pathFromGuideLines(guideLines));\n    }\n  }\n}\n\nconst cssShiftRight = \"transition:margin-left .4s ease-out;margin-left: 63px\";\nconst cssShiftBack = \"transition:margin-left .4s ease-out;margin-left: 0px\";\n\nfunction moveExistingTabs(dropTarget: DropTarget) {\n  const { AFTER, BEFORE } = RelativeDropPosition;\n  const {\n    clientRect: { Stack },\n    pos: {\n      // tab: { index: tabIndex, positionRelativeToTab }\n      tab,\n    },\n  } = dropTarget;\n\n  const { id } = dropTarget.component.props;\n  let tabEl = null;\n  // console.log(`tabPos = ${tabPos} (width=${tabWidth}) x=${x}`)\n  if (Stack && tab && tab.positionRelativeToTab !== AFTER) {\n    const tabOffset = tab.positionRelativeToTab === BEFORE ? 1 : 2;\n    const selector = `:scope .hwTabstrip > .hwTabstrip-inner > .hwTab:nth-child(${\n      tab.index + tabOffset\n    })`;\n    tabEl = document.getElementById(id)?.querySelector(selector) as HTMLElement;\n    if (tabEl) {\n      if (_shiftedTab === null || _shiftedTab !== tabEl) {\n        tabEl.style.cssText = cssShiftRight;\n        if (_shiftedTab) {\n          _shiftedTab.style.cssText = cssShiftBack;\n        }\n        _shiftedTab = tabEl;\n      }\n    } else {\n      clearShiftedTab();\n    }\n  } else if (tab?.positionRelativeToTab === BEFORE) {\n    if (_shiftedTab === null) {\n      const selector = \".vuuHeader-title\";\n      tabEl = document\n        .getElementById(id)\n        ?.querySelector(selector) as HTMLElement;\n      tabEl.style.cssText = cssShiftRight;\n      _shiftedTab = tabEl;\n    }\n  } else {\n    clearShiftedTab();\n  }\n}\n\nfunction clearShiftedTab() {\n  if (_shiftedTab) {\n    _shiftedTab.style.cssText = cssShiftBack;\n    _shiftedTab = null;\n  }\n}\n"],"names":["path"],"mappings":"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"}
+{"version":3,"file":"DropTargetRenderer.js","sources":["../../src/drag-drop/DropTargetRenderer.tsx"],"sourcesContent":["import { RelativeDropPosition } from \"./BoxModel\";\nimport { DragDropRect } from \"./dragDropTypes\";\nimport { DragState } from \"./DragState\";\nimport { DropTarget, GuideLine } from \"./DropTarget\";\n\ntype Point = [number, number];\ntype TabMode = \"full-view\" | \"tab-only\";\n\nlet _hoverDropTarget: DropTarget | null = null;\nlet _shiftedTab: HTMLElement | null = null;\n\nconst start = ([x, y]: Point) => `M${x},${y}`;\nconst point = ([x, y]: Point) => `L${x},${y}`;\nconst pathFromPoints = ([p1, ...points]: Point[]) =>\n  `${start(p1)} ${points.map(point)}Z`;\n\nconst pathFromGuideLines = (guideLines?: GuideLine) => {\n  if (guideLines) {\n    const [x1, y1, x2, y2, x3, y3, x4, y4] = guideLines;\n    return `M${x1},${y1} L${x2},${y2} M${x3},${y3} L${x4},${y4}`;\n  } else {\n    return \"\";\n  }\n};\n\nfunction insertSVGRoot() {\n  if (document.getElementById(\"hw-drag-canvas\") === null) {\n    const root = document.getElementById(\"root\");\n    const container = document.createElement(\"div\");\n    container.id = \"hw-drag-canvas\";\n    container.style.cssText = `visibility:hidden;z-index:10;position:absolute;top:0px;left:0;right:0;bottom:0;background-color:transparent`;\n    container.innerHTML = `\n      <svg width=\"100%\" height=\"100%\" style=\"position: absolute;\">\n        <path id=\"hw-drop-guides\" style=\"fill: none; stroke: rgba(0, 0, 0, 0.3);stroke-dasharray: 2 3\"/>\n        <path\n          id=\"vuu-drop-outline\"\n          style=\"fill:rgba(0,0,255,.3);stroke:none;stroke-dasharray:4 2\"\n          d=\"M300,132 L380,132 L380,100 L460,100 L460,132, L550,132 L550,350 L300,350z\">\n          <animate\n            attributeName=\"d\"\n            id=\"hw-drop-outline-animate\"\n            begin=\"indefinite\"\n            dur=\"300ms\"\n            fill=\"freeze\"\n            to=\"M255,33 L255,33,L255,1,L315,1,L315,1,L794,1,L794,164,L255,164Z\"\n          />\n        </path>\n      </svg>\n      `;\n    document.body.insertBefore(container, root);\n  }\n}\nexport default class DropTargetCanvas {\n  private currentPath: string | null = null;\n  private tabMode: TabMode | null = null;\n\n  constructor() {\n    insertSVGRoot();\n  }\n\n  prepare(dragRect: DragDropRect, tabMode: TabMode = \"full-view\") {\n    // don't do this on body\n    const dragCanvas = document.getElementById(\"hw-drag-canvas\");\n    if (dragCanvas) {\n      dragCanvas.style.visibility = \"visible\";\n    } else {\n      throw Error(\"DropTargetRenderer.prepare no drag canvas detected\");\n    }\n    document.body.classList.add(\"drawing\");\n    this.currentPath = null;\n    this.tabMode = tabMode;\n\n    const points = this.getPoints(0, 0, 0, 0);\n    // const points = this.getPoints(left, top, width, height);\n    const d = pathFromPoints(points);\n\n    const dropOutlinePath = document.getElementById(\"vuu-drop-outline\");\n    dropOutlinePath?.setAttribute(\"d\", d);\n    this.currentPath = d;\n  }\n\n  clear() {\n    // don't do this on body\n    _hoverDropTarget = null;\n    clearShiftedTab();\n    const dragCanvas = document.getElementById(\"hw-drag-canvas\");\n    if (dragCanvas) {\n      dragCanvas.style.visibility = \"hidden\";\n    }\n  }\n\n  get hoverDropTarget() {\n    return _hoverDropTarget;\n  }\n\n  getPoints(\n    x: number,\n    y: number,\n    width: number,\n    height: number,\n    tabLeft = 0,\n    tabWidth = 0,\n    tabHeight = 0,\n  ): Point[] {\n    const tabOnly = this.tabMode === \"tab-only\";\n    if (tabWidth === 0) {\n      return [\n        [x, y + tabHeight],\n        [x, y + tabHeight],\n        [x, y],\n        [x + tabWidth, y],\n        [x + tabWidth, y],\n        [x + width, y],\n        [x + width, y + height],\n        [x, y + height],\n      ];\n    } else if (tabOnly) {\n      const left = tabLeft;\n      return [\n        [left, y],\n        [left, y],\n        [left + tabWidth, y],\n        [left + tabWidth, y],\n        [left + tabWidth, y + tabHeight],\n        [left + tabWidth, y + tabHeight],\n        [left, y + tabHeight],\n        [left, y + tabHeight],\n      ];\n    } else if (tabLeft === 0) {\n      return [\n        [x, y + tabHeight],\n        [x, y + tabHeight],\n        [x, y],\n        [x + tabWidth, y],\n        [x + tabWidth, y + tabHeight],\n        [x + width, y + tabHeight],\n        [x + width, y + height],\n        [x, y + height],\n      ];\n    } else {\n      return [\n        [x, y + tabHeight],\n        [x + tabLeft, y + tabHeight],\n        [x + tabLeft, y],\n        [x + tabLeft, y],\n        [x + tabLeft, y + tabHeight],\n        [x + width, y + tabHeight],\n        [x + width, y + height],\n        [x, y + height],\n      ];\n    }\n  }\n\n  draw(dropTarget: DropTarget, dragState: DragState) {\n    const sameDropTarget = false;\n\n    if (_hoverDropTarget !== null) {\n      this.drawTarget(_hoverDropTarget);\n    } else {\n      if (sameDropTarget === false) {\n        if (dropTarget.pos.tab) {\n          moveExistingTabs(dropTarget);\n        } else if (_shiftedTab) {\n          clearShiftedTab();\n        }\n        this.drawTarget(dropTarget, dragState);\n      }\n    }\n  }\n\n  drawTarget(dropTarget: DropTarget, dragState?: DragState) {\n    const lineWidth = 6;\n\n    const targetDropOutline = dropTarget.getTargetDropOutline(\n      lineWidth,\n      dragState,\n    );\n\n    if (targetDropOutline) {\n      const { l, t, r, b, tabLeft, tabWidth, tabHeight, guideLines } =\n        targetDropOutline;\n      const w = r - l;\n      const h = b - t;\n\n      if (this.currentPath) {\n        const path = document.getElementById(\"vuu-drop-outline\");\n        path?.setAttribute(\"d\", this.currentPath);\n      }\n\n      const points = this.getPoints(l, t, w, h, tabLeft, tabWidth, tabHeight);\n      const path = pathFromPoints(points);\n      const animation = document.getElementById(\n        \"hw-drop-outline-animate\",\n      ) as unknown as SVGAnimateElement;\n      animation?.setAttribute(\"to\", path);\n      animation?.beginElement();\n      this.currentPath = path;\n\n      const dropGuidePath = document.getElementById(\"hw-drop-guides\");\n      dropGuidePath?.setAttribute(\"d\", pathFromGuideLines(guideLines));\n    }\n  }\n}\n\nconst cssShiftRight = \"transition:margin-left .4s ease-out;margin-left: 63px\";\nconst cssShiftBack = \"transition:margin-left .4s ease-out;margin-left: 0px\";\n\nfunction moveExistingTabs(dropTarget: DropTarget) {\n  const { AFTER, BEFORE } = RelativeDropPosition;\n  const {\n    clientRect: { Stack },\n    pos: {\n      // tab: { index: tabIndex, positionRelativeToTab }\n      tab,\n    },\n  } = dropTarget;\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  const { id } = dropTarget.component.props as any;\n  let tabEl = null;\n  // console.log(`tabPos = ${tabPos} (width=${tabWidth}) x=${x}`)\n  if (Stack && tab && tab.positionRelativeToTab !== AFTER) {\n    const tabOffset = tab.positionRelativeToTab === BEFORE ? 1 : 2;\n    const selector = `:scope .hwTabstrip > .hwTabstrip-inner > .hwTab:nth-child(${\n      tab.index + tabOffset\n    })`;\n    tabEl = document.getElementById(id)?.querySelector(selector) as HTMLElement;\n    if (tabEl) {\n      if (_shiftedTab === null || _shiftedTab !== tabEl) {\n        tabEl.style.cssText = cssShiftRight;\n        if (_shiftedTab) {\n          _shiftedTab.style.cssText = cssShiftBack;\n        }\n        _shiftedTab = tabEl;\n      }\n    } else {\n      clearShiftedTab();\n    }\n  } else if (tab?.positionRelativeToTab === BEFORE) {\n    if (_shiftedTab === null) {\n      const selector = \".vuuHeader-title\";\n      tabEl = document\n        .getElementById(id)\n        ?.querySelector(selector) as HTMLElement;\n      tabEl.style.cssText = cssShiftRight;\n      _shiftedTab = tabEl;\n    }\n  } else {\n    clearShiftedTab();\n  }\n}\n\nfunction clearShiftedTab() {\n  if (_shiftedTab) {\n    _shiftedTab.style.cssText = cssShiftBack;\n    _shiftedTab = null;\n  }\n}\n"],"names":["path"],"mappings":"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"}

package/esm/flexbox/Splitter.js

@@ -20,7 +20,7 @@ const Splitter = React.memo(function Splitter2({
     css: splitterCss,
     window: targetWindow
   });
-  const ignoreClick = useRef();
+  const ignoreClick = useRef(void 0);
   const rootRef = useRef(null);
   const lastPos = useRef(0);
   const [active, setActive] = useState(false);

package/esm/flexbox/Splitter.js.map

@@ -1 +1 @@
-{"version":3,"file":"Splitter.js","sources":["../../src/flexbox/Splitter.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport React, {\n  HTMLAttributes,\n  KeyboardEvent,\n  MouseEventHandler,\n  useCallback,\n  useRef,\n  useState,\n} from \"react\";\n\nimport splitterCss from \"./Splitter.css\";\n\nconst classBase = \"vuuSplitter\";\n\nexport type SplitterDragStartHandler = (index: number) => void;\nexport type SplitterDragHandler = (index: number, distance: number) => void;\nexport type SplitterDragEndHandler = () => void;\n\nexport interface SplitterProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onDrag\" | \"onDragStart\"> {\n  //TODO change to alignment (vertical | horizontal)\n  column: boolean;\n  index: number;\n  onDragStart: SplitterDragStartHandler;\n  onDrag: SplitterDragHandler;\n  onDragEnd: SplitterDragEndHandler;\n}\n\nexport const Splitter = React.memo(function Splitter({\n  column,\n  index,\n  onDrag,\n  onDragEnd,\n  onDragStart,\n  style,\n}: SplitterProps) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-splitter\",\n    css: splitterCss,\n    window: targetWindow,\n  });\n\n  const ignoreClick = useRef<boolean>();\n  const rootRef = useRef<HTMLDivElement>(null);\n  const lastPos = useRef<number>(0);\n\n  const [active, setActive] = useState(false);\n\n  const handleKeyDownDrag = useCallback(\n    ({ key, shiftKey }: KeyboardEvent) => {\n      const distance = shiftKey ? 10 : 1;\n      if (column && key === \"ArrowDown\") {\n        onDrag(index, distance);\n      } else if (column && key === \"ArrowUp\") {\n        onDrag(index, -distance);\n      } else if (!column && key === \"ArrowLeft\") {\n        onDrag(index, -distance);\n      } else if (!column && key === \"ArrowRight\") {\n        onDrag(index, distance);\n      }\n    },\n    [column, index, onDrag],\n  );\n\n  const handleKeyDownInitDrag = useCallback(\n    (evt: KeyboardEvent) => {\n      const { key } = evt;\n      const horizontalMove = key === \"ArrowLeft\" || key === \"ArrowRight\";\n      const verticalMove = key === \"ArrowUp\" || key === \"ArrowDown\";\n      if ((column && verticalMove) || (!column && horizontalMove)) {\n        onDragStart(index);\n        handleKeyDownDrag(evt);\n        keyDownHandlerRef.current = handleKeyDownDrag;\n      }\n    },\n    [column, handleKeyDownDrag, index, onDragStart],\n  );\n\n  const keyDownHandlerRef = useRef(handleKeyDownInitDrag);\n  const handleKeyDown = (evt: KeyboardEvent) => keyDownHandlerRef.current(evt);\n\n  const handleMouseMove = useCallback(\n    (e: MouseEvent) => {\n      ignoreClick.current = true;\n      const pos = e[column ? \"clientY\" : \"clientX\"];\n      const diff = pos - lastPos.current;\n      if (pos && pos !== lastPos.current) {\n        onDrag(index, diff);\n      }\n      lastPos.current = pos;\n    },\n    [column, index, onDrag],\n  );\n\n  const handleMouseUp = useCallback(() => {\n    window.removeEventListener(\"mousemove\", handleMouseMove, false);\n    window.removeEventListener(\"mouseup\", handleMouseUp, false);\n    onDragEnd();\n    setActive(false);\n    rootRef.current?.focus();\n  }, [handleMouseMove, onDragEnd, setActive]);\n\n  const handleMouseDown = useCallback<MouseEventHandler>(\n    (e) => {\n      lastPos.current = column ? e.clientY : e.clientX;\n      onDragStart(index);\n      window.addEventListener(\"mousemove\", handleMouseMove, false);\n      window.addEventListener(\"mouseup\", handleMouseUp, false);\n      e.preventDefault();\n      setActive(true);\n    },\n    [column, handleMouseMove, handleMouseUp, index, onDragStart, setActive],\n  );\n\n  const handleClick = () => {\n    if (ignoreClick.current) {\n      ignoreClick.current = false;\n    } else {\n      rootRef.current?.focus();\n    }\n  };\n\n  const handleBlur = () => {\n    keyDownHandlerRef.current = handleKeyDownInitDrag;\n  };\n\n  const className = cx(classBase, {\n    [`${classBase}-active`]: active,\n    [`${classBase}-column`]: column,\n  });\n  return (\n    <div\n      className={className}\n      data-splitter\n      ref={rootRef}\n      role=\"separator\"\n      style={style}\n      onBlur={handleBlur}\n      onClick={handleClick}\n      onKeyDown={handleKeyDown}\n      onMouseDown={handleMouseDown}\n      tabIndex={0}\n    >\n      <div className={`${classBase}-grab-zone`} />\n    </div>\n  );\n});\n"],"names":["Splitter"],"mappings":"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"}
+{"version":3,"file":"Splitter.js","sources":["../../src/flexbox/Splitter.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport React, {\n  HTMLAttributes,\n  KeyboardEvent,\n  MouseEventHandler,\n  useCallback,\n  useRef,\n  useState,\n} from \"react\";\n\nimport splitterCss from \"./Splitter.css\";\n\nconst classBase = \"vuuSplitter\";\n\nexport type SplitterDragStartHandler = (index: number) => void;\nexport type SplitterDragHandler = (index: number, distance: number) => void;\nexport type SplitterDragEndHandler = () => void;\n\nexport interface SplitterProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onDrag\" | \"onDragStart\"> {\n  //TODO change to alignment (vertical | horizontal)\n  column: boolean;\n  index: number;\n  onDragStart: SplitterDragStartHandler;\n  onDrag: SplitterDragHandler;\n  onDragEnd: SplitterDragEndHandler;\n}\n\nexport const Splitter = React.memo(function Splitter({\n  column,\n  index,\n  onDrag,\n  onDragEnd,\n  onDragStart,\n  style,\n}: SplitterProps) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-splitter\",\n    css: splitterCss,\n    window: targetWindow,\n  });\n\n  const ignoreClick = useRef<boolean>(undefined);\n  const rootRef = useRef<HTMLDivElement>(null);\n  const lastPos = useRef<number>(0);\n\n  const [active, setActive] = useState(false);\n\n  const handleKeyDownDrag = useCallback(\n    ({ key, shiftKey }: KeyboardEvent) => {\n      const distance = shiftKey ? 10 : 1;\n      if (column && key === \"ArrowDown\") {\n        onDrag(index, distance);\n      } else if (column && key === \"ArrowUp\") {\n        onDrag(index, -distance);\n      } else if (!column && key === \"ArrowLeft\") {\n        onDrag(index, -distance);\n      } else if (!column && key === \"ArrowRight\") {\n        onDrag(index, distance);\n      }\n    },\n    [column, index, onDrag],\n  );\n\n  const handleKeyDownInitDrag = useCallback(\n    (evt: KeyboardEvent) => {\n      const { key } = evt;\n      const horizontalMove = key === \"ArrowLeft\" || key === \"ArrowRight\";\n      const verticalMove = key === \"ArrowUp\" || key === \"ArrowDown\";\n      if ((column && verticalMove) || (!column && horizontalMove)) {\n        onDragStart(index);\n        handleKeyDownDrag(evt);\n        keyDownHandlerRef.current = handleKeyDownDrag;\n      }\n    },\n    [column, handleKeyDownDrag, index, onDragStart],\n  );\n\n  const keyDownHandlerRef = useRef(handleKeyDownInitDrag);\n  const handleKeyDown = (evt: KeyboardEvent) => keyDownHandlerRef.current(evt);\n\n  const handleMouseMove = useCallback(\n    (e: MouseEvent) => {\n      ignoreClick.current = true;\n      const pos = e[column ? \"clientY\" : \"clientX\"];\n      const diff = pos - lastPos.current;\n      if (pos && pos !== lastPos.current) {\n        onDrag(index, diff);\n      }\n      lastPos.current = pos;\n    },\n    [column, index, onDrag],\n  );\n\n  const handleMouseUp = useCallback(() => {\n    window.removeEventListener(\"mousemove\", handleMouseMove, false);\n    window.removeEventListener(\"mouseup\", handleMouseUp, false);\n    onDragEnd();\n    setActive(false);\n    rootRef.current?.focus();\n  }, [handleMouseMove, onDragEnd, setActive]);\n\n  const handleMouseDown = useCallback<MouseEventHandler>(\n    (e) => {\n      lastPos.current = column ? e.clientY : e.clientX;\n      onDragStart(index);\n      window.addEventListener(\"mousemove\", handleMouseMove, false);\n      window.addEventListener(\"mouseup\", handleMouseUp, false);\n      e.preventDefault();\n      setActive(true);\n    },\n    [column, handleMouseMove, handleMouseUp, index, onDragStart, setActive],\n  );\n\n  const handleClick = () => {\n    if (ignoreClick.current) {\n      ignoreClick.current = false;\n    } else {\n      rootRef.current?.focus();\n    }\n  };\n\n  const handleBlur = () => {\n    keyDownHandlerRef.current = handleKeyDownInitDrag;\n  };\n\n  const className = cx(classBase, {\n    [`${classBase}-active`]: active,\n    [`${classBase}-column`]: column,\n  });\n  return (\n    <div\n      className={className}\n      data-splitter\n      ref={rootRef}\n      role=\"separator\"\n      style={style}\n      onBlur={handleBlur}\n      onClick={handleClick}\n      onKeyDown={handleKeyDown}\n      onMouseDown={handleMouseDown}\n      tabIndex={0}\n    >\n      <div className={`${classBase}-grab-zone`} />\n    </div>\n  );\n});\n"],"names":["Splitter"],"mappings":"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"}

package/esm/flexbox/useSplitterResizing.js

@@ -11,9 +11,9 @@ const useSplitterResizing = ({
   style
 }) => {
   const rootRef = useRef(null);
-  const flexElementsRef = useRef();
-  const metaRef = useRef();
-  const contentRef = useRef();
+  const flexElementsRef = useRef(void 0);
+  const metaRef = useRef(void 0);
+  const contentRef = useRef(void 0);
   const assignedKeys = useRef([]);
   const isColumn = style?.flexDirection === "column";
   const dimension = isColumn ? "height" : "width";

package/esm/flexbox/useSplitterResizing.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSplitterResizing.js","sources":["../../src/flexbox/useSplitterResizing.ts"],"sourcesContent":["import { getUniqueId } from \"@vuu-ui/vuu-utils\";\nimport React, { ReactElement, useCallback, useMemo, useRef } from \"react\";\nimport { Placeholder } from \"../placeholder\";\nimport { Splitter } from \"./Splitter\";\n\nimport {\n  findSplitterAndPlaceholderPositions,\n  gatherChildMeta,\n  identifyResizeParties,\n  PLACEHOLDER,\n  SPLITTER,\n} from \"./flexbox-utils\";\nimport {\n  ContentMeta,\n  FlexSize,\n  SplitterFactory,\n  SplitterHookProps,\n  SplitterHookResult,\n} from \"./flexboxTypes\";\n\nconst originalContentOnly = (meta: ContentMeta) =>\n  !meta.splitter && !meta.placeholder;\n\nexport const useSplitterResizing = ({\n  children: childrenProp,\n  onSplitterMoved,\n  style,\n}: SplitterHookProps): SplitterHookResult => {\n  const rootRef = useRef<HTMLDivElement>(null);\n  const flexElementsRef = useRef<HTMLDivElement[]>();\n  const metaRef = useRef<ContentMeta[]>();\n  const contentRef = useRef<ReactElement[]>();\n  const assignedKeys = useRef<string[]>([]);\n\n  const isColumn = style?.flexDirection === \"column\";\n  const dimension = isColumn ? \"height\" : \"width\";\n  const children = useMemo(\n    () =>\n      Array.isArray(childrenProp)\n        ? childrenProp\n        : React.isValidElement(childrenProp)\n          ? [childrenProp]\n          : [],\n    [childrenProp],\n  );\n\n  const handleDragStart = useCallback(\n    (index: number) => {\n      const { current: contentMeta } = metaRef;\n      if (contentMeta) {\n        const [participants, bystanders] = identifyResizeParties(\n          contentMeta,\n          index,\n        );\n        if (participants) {\n          participants.forEach((index) => {\n            const el = rootRef.current?.childNodes[index] as HTMLElement;\n            if (el) {\n              const { size, minSize } = measureElement(el, dimension);\n              contentMeta[index].currentSize = size;\n              contentMeta[index].minSize = minSize;\n            }\n          });\n          if (bystanders) {\n            bystanders.forEach((index) => {\n              const el = rootRef.current?.childNodes[index] as HTMLElement;\n              if (el) {\n                const { [dimension]: size } = el.getBoundingClientRect();\n                contentMeta[index].flexBasis = size;\n              }\n            });\n          }\n\n          if (rootRef.current) {\n            rootRef.current.classList.add(\"vuuSplitterResizing\");\n            console.log({ root: rootRef.current });\n            flexElementsRef.current = Array.from(\n              rootRef.current.querySelectorAll<HTMLDivElement>(\":scope > div\"),\n            );\n          }\n        }\n      }\n    },\n    [dimension],\n  );\n\n  const handleDrag = useCallback((idx: number, distance: number) => {\n    const { current: flexElements = [] } = flexElementsRef;\n\n    if (contentRef.current && metaRef.current) {\n      resizeElements(flexElements, metaRef.current, distance /*, dimension*/);\n    }\n  }, []);\n\n  const handleDragEnd = useCallback(() => {\n    const contentMeta = metaRef.current;\n    if (contentMeta) {\n      onSplitterMoved?.(contentMeta.filter(originalContentOnly));\n      if (rootRef.current) {\n        rootRef.current.classList.remove(\"vuuSplitterResizing\");\n      }\n    }\n    contentMeta?.forEach((meta) => {\n      meta.currentSize = undefined;\n      meta.flexBasis = undefined;\n      meta.flexOpen = false;\n    });\n  }, [onSplitterMoved]);\n\n  const createSplitter: SplitterFactory = useCallback(\n    (i) => {\n      return React.createElement(Splitter, {\n        column: isColumn,\n        index: i,\n        key: `splitter-${i}`,\n        onDrag: handleDrag,\n        onDragEnd: handleDragEnd,\n        onDragStart: handleDragStart,\n      });\n    },\n    [handleDrag, handleDragEnd, handleDragStart, isColumn],\n  );\n\n  useMemo(() => {\n    const [content, meta] = buildContent(\n      children,\n      dimension,\n      createSplitter,\n      assignedKeys.current,\n    );\n    metaRef.current = meta;\n    contentRef.current = content;\n  }, [children, createSplitter, dimension]);\n\n  return {\n    content: contentRef.current || [],\n    rootRef,\n  };\n};\n\nfunction buildContent(\n  children: ReactElement[],\n  dimension: \"width\" | \"height\",\n  createSplitter: SplitterFactory,\n  keys: string[],\n): [ReactElement[], ContentMeta[]] {\n  const childMeta = gatherChildMeta(children, dimension);\n  const splitterAndPlaceholderPositions =\n    findSplitterAndPlaceholderPositions(childMeta);\n  const content = [];\n  const meta: ContentMeta[] = [];\n  for (let i = 0; i < children.length; i++) {\n    const child = children[i];\n    if (i === 0 && splitterAndPlaceholderPositions[i] & PLACEHOLDER) {\n      content.push(createPlaceholder(i));\n      meta.push({ placeholder: true, shim: true });\n    }\n    if (child.key == null) {\n      const key = keys[i] || (keys[i] = getUniqueId());\n      content.push(React.cloneElement(child, { key }));\n    } else {\n      content.push(child);\n    }\n    meta.push(childMeta[i]);\n\n    if (i > 0 && splitterAndPlaceholderPositions[i] & PLACEHOLDER) {\n      content.push(createPlaceholder(i));\n      meta.push({ placeholder: true });\n    } else if (splitterAndPlaceholderPositions[i] & SPLITTER) {\n      content.push(createSplitter(content.length));\n      meta.push({ splitter: true });\n    }\n  }\n  return [content, meta];\n}\n\nfunction resizeElements(\n  flexElements: HTMLDivElement[],\n  contentMeta: ContentMeta[],\n  distance: number,\n) {\n  const metaUpdated = updateMeta(contentMeta, distance);\n  if (!metaUpdated) {\n    return;\n  }\n\n  flexElements.forEach((element, idx) => {\n    const meta = contentMeta[idx];\n    const { currentSize, flexOpen, flexBasis, splitter } = meta;\n    const hasCurrentSize = currentSize !== undefined;\n    if (!splitter && (hasCurrentSize || flexOpen)) {\n      const size = hasCurrentSize ? meta.currentSize : flexBasis;\n      element.style.flexBasis = `${size}px`;\n    }\n  });\n}\n\n//TODO detect cursor move beyond drag limit and suspend further resize until cursoe re-engages with splitter\nfunction updateMeta(contentMeta: ContentMeta[], distance: number) {\n  const resizeTargets: number[] = [];\n\n  contentMeta.forEach((meta, idx) => {\n    if (meta.currentSize !== undefined) {\n      resizeTargets.push(idx);\n    }\n  });\n\n  // we want the target being reduced first, this may limit the distance we can apply\n  const target1 = distance < 0 ? resizeTargets[0] : resizeTargets[1];\n\n  const { currentSize = 0, minSize = 0 } = contentMeta[target1];\n  if (currentSize === minSize) {\n    // size is already 0, we cannot go further\n    return false;\n  } else if (Math.abs(distance) > currentSize - minSize) {\n    // reduce to 0\n    const multiplier = distance < 0 ? -1 : 1;\n    distance = Math.max(0, currentSize - minSize) * multiplier;\n  }\n\n  const leadingItem = contentMeta[resizeTargets[0]] as ContentMeta;\n  const { currentSize: leadingSize = 0 } = leadingItem;\n  leadingItem.currentSize = leadingSize + distance;\n\n  const trailingItem = contentMeta[resizeTargets[1]] as ContentMeta;\n  const { currentSize: trailingSize = 0 } = trailingItem;\n  trailingItem.currentSize = trailingSize - distance;\n\n  return true;\n}\n\nfunction createPlaceholder(index: number) {\n  return React.createElement(Placeholder, {\n    shim: index === 0,\n    key: `placeholder-${index}`,\n  });\n}\n\nfunction measureElement(\n  el: HTMLElement,\n  dimension: \"width\" | \"height\",\n): FlexSize {\n  const { [dimension]: size } = el.getBoundingClientRect();\n  const style = getComputedStyle(el);\n  const minSizeVal = style.getPropertyValue(`min-${dimension}`);\n  const minSize = minSizeVal.endsWith(\"px\") ? parseInt(minSizeVal, 10) : 0;\n  return { size, minSize };\n}\n"],"names":["index"],"mappings":"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"}
+{"version":3,"file":"useSplitterResizing.js","sources":["../../src/flexbox/useSplitterResizing.ts"],"sourcesContent":["import { getUniqueId } from \"@vuu-ui/vuu-utils\";\nimport React, { ReactElement, useCallback, useMemo, useRef } from \"react\";\nimport { Placeholder } from \"../placeholder\";\nimport { Splitter } from \"./Splitter\";\n\nimport {\n  findSplitterAndPlaceholderPositions,\n  gatherChildMeta,\n  identifyResizeParties,\n  PLACEHOLDER,\n  SPLITTER,\n} from \"./flexbox-utils\";\nimport {\n  ContentMeta,\n  FlexSize,\n  SplitterFactory,\n  SplitterHookProps,\n  SplitterHookResult,\n} from \"./flexboxTypes\";\n\nconst originalContentOnly = (meta: ContentMeta) =>\n  !meta.splitter && !meta.placeholder;\n\nexport const useSplitterResizing = ({\n  children: childrenProp,\n  onSplitterMoved,\n  style,\n}: SplitterHookProps): SplitterHookResult => {\n  const rootRef = useRef<HTMLDivElement>(null);\n  const flexElementsRef = useRef<HTMLDivElement[]>(undefined);\n  const metaRef = useRef<ContentMeta[]>(undefined);\n  const contentRef = useRef<ReactElement[]>(undefined);\n  const assignedKeys = useRef<string[]>([]);\n\n  const isColumn = style?.flexDirection === \"column\";\n  const dimension = isColumn ? \"height\" : \"width\";\n  const children = useMemo(\n    () =>\n      Array.isArray(childrenProp)\n        ? childrenProp\n        : React.isValidElement(childrenProp)\n          ? [childrenProp]\n          : [],\n    [childrenProp],\n  );\n\n  const handleDragStart = useCallback(\n    (index: number) => {\n      const { current: contentMeta } = metaRef;\n      if (contentMeta) {\n        const [participants, bystanders] = identifyResizeParties(\n          contentMeta,\n          index,\n        );\n        if (participants) {\n          participants.forEach((index) => {\n            const el = rootRef.current?.childNodes[index] as HTMLElement;\n            if (el) {\n              const { size, minSize } = measureElement(el, dimension);\n              contentMeta[index].currentSize = size;\n              contentMeta[index].minSize = minSize;\n            }\n          });\n          if (bystanders) {\n            bystanders.forEach((index) => {\n              const el = rootRef.current?.childNodes[index] as HTMLElement;\n              if (el) {\n                const { [dimension]: size } = el.getBoundingClientRect();\n                contentMeta[index].flexBasis = size;\n              }\n            });\n          }\n\n          if (rootRef.current) {\n            rootRef.current.classList.add(\"vuuSplitterResizing\");\n            console.log({ root: rootRef.current });\n            flexElementsRef.current = Array.from(\n              rootRef.current.querySelectorAll<HTMLDivElement>(\":scope > div\"),\n            );\n          }\n        }\n      }\n    },\n    [dimension],\n  );\n\n  const handleDrag = useCallback((idx: number, distance: number) => {\n    const { current: flexElements = [] } = flexElementsRef;\n\n    if (contentRef.current && metaRef.current) {\n      resizeElements(flexElements, metaRef.current, distance /*, dimension*/);\n    }\n  }, []);\n\n  const handleDragEnd = useCallback(() => {\n    const contentMeta = metaRef.current;\n    if (contentMeta) {\n      onSplitterMoved?.(contentMeta.filter(originalContentOnly));\n      if (rootRef.current) {\n        rootRef.current.classList.remove(\"vuuSplitterResizing\");\n      }\n    }\n    contentMeta?.forEach((meta) => {\n      meta.currentSize = undefined;\n      meta.flexBasis = undefined;\n      meta.flexOpen = false;\n    });\n  }, [onSplitterMoved]);\n\n  const createSplitter: SplitterFactory = useCallback(\n    (i) => {\n      return React.createElement(Splitter, {\n        column: isColumn,\n        index: i,\n        key: `splitter-${i}`,\n        onDrag: handleDrag,\n        onDragEnd: handleDragEnd,\n        onDragStart: handleDragStart,\n      });\n    },\n    [handleDrag, handleDragEnd, handleDragStart, isColumn],\n  );\n\n  useMemo(() => {\n    const [content, meta] = buildContent(\n      children,\n      dimension,\n      createSplitter,\n      assignedKeys.current,\n    );\n    metaRef.current = meta;\n    contentRef.current = content;\n  }, [children, createSplitter, dimension]);\n\n  return {\n    content: contentRef.current || [],\n    rootRef,\n  };\n};\n\nfunction buildContent(\n  children: ReactElement[],\n  dimension: \"width\" | \"height\",\n  createSplitter: SplitterFactory,\n  keys: string[],\n): [ReactElement[], ContentMeta[]] {\n  const childMeta = gatherChildMeta(children, dimension);\n  const splitterAndPlaceholderPositions =\n    findSplitterAndPlaceholderPositions(childMeta);\n  const content = [];\n  const meta: ContentMeta[] = [];\n  for (let i = 0; i < children.length; i++) {\n    const child = children[i];\n    if (i === 0 && splitterAndPlaceholderPositions[i] & PLACEHOLDER) {\n      content.push(createPlaceholder(i));\n      meta.push({ placeholder: true, shim: true });\n    }\n    if (child.key == null) {\n      const key = keys[i] || (keys[i] = getUniqueId());\n      content.push(React.cloneElement(child, { key }));\n    } else {\n      content.push(child);\n    }\n    meta.push(childMeta[i]);\n\n    if (i > 0 && splitterAndPlaceholderPositions[i] & PLACEHOLDER) {\n      content.push(createPlaceholder(i));\n      meta.push({ placeholder: true });\n    } else if (splitterAndPlaceholderPositions[i] & SPLITTER) {\n      content.push(createSplitter(content.length));\n      meta.push({ splitter: true });\n    }\n  }\n  return [content, meta];\n}\n\nfunction resizeElements(\n  flexElements: HTMLDivElement[],\n  contentMeta: ContentMeta[],\n  distance: number,\n) {\n  const metaUpdated = updateMeta(contentMeta, distance);\n  if (!metaUpdated) {\n    return;\n  }\n\n  flexElements.forEach((element, idx) => {\n    const meta = contentMeta[idx];\n    const { currentSize, flexOpen, flexBasis, splitter } = meta;\n    const hasCurrentSize = currentSize !== undefined;\n    if (!splitter && (hasCurrentSize || flexOpen)) {\n      const size = hasCurrentSize ? meta.currentSize : flexBasis;\n      element.style.flexBasis = `${size}px`;\n    }\n  });\n}\n\n//TODO detect cursor move beyond drag limit and suspend further resize until cursoe re-engages with splitter\nfunction updateMeta(contentMeta: ContentMeta[], distance: number) {\n  const resizeTargets: number[] = [];\n\n  contentMeta.forEach((meta, idx) => {\n    if (meta.currentSize !== undefined) {\n      resizeTargets.push(idx);\n    }\n  });\n\n  // we want the target being reduced first, this may limit the distance we can apply\n  const target1 = distance < 0 ? resizeTargets[0] : resizeTargets[1];\n\n  const { currentSize = 0, minSize = 0 } = contentMeta[target1];\n  if (currentSize === minSize) {\n    // size is already 0, we cannot go further\n    return false;\n  } else if (Math.abs(distance) > currentSize - minSize) {\n    // reduce to 0\n    const multiplier = distance < 0 ? -1 : 1;\n    distance = Math.max(0, currentSize - minSize) * multiplier;\n  }\n\n  const leadingItem = contentMeta[resizeTargets[0]] as ContentMeta;\n  const { currentSize: leadingSize = 0 } = leadingItem;\n  leadingItem.currentSize = leadingSize + distance;\n\n  const trailingItem = contentMeta[resizeTargets[1]] as ContentMeta;\n  const { currentSize: trailingSize = 0 } = trailingItem;\n  trailingItem.currentSize = trailingSize - distance;\n\n  return true;\n}\n\nfunction createPlaceholder(index: number) {\n  return React.createElement(Placeholder, {\n    shim: index === 0,\n    key: `placeholder-${index}`,\n  });\n}\n\nfunction measureElement(\n  el: HTMLElement,\n  dimension: \"width\" | \"height\",\n): FlexSize {\n  const { [dimension]: size } = el.getBoundingClientRect();\n  const style = getComputedStyle(el);\n  const minSizeVal = style.getPropertyValue(`min-${dimension}`);\n  const minSize = minSizeVal.endsWith(\"px\") ? parseInt(minSizeVal, 10) : 0;\n  return { size, minSize };\n}\n"],"names":["index"],"mappings":"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"}

package/esm/index.js

@@ -2,7 +2,6 @@ export { default as DockLayout } from './dock-layout/DockLayout.js';
 export { default as Drawer } from './dock-layout/Drawer.js';
 export { default as Component } from './Component.js';
 export { Draggable } from './drag-drop/Draggable.js';
-export { DropMenu, computeMenuPosition } from './drag-drop/DropMenu.js';
 export { DropTarget, identifyDropTarget, isTabstrip } from './drag-drop/DropTarget.js';
 export { LayoutContainer } from './LayoutContainer.js';
 export { default as Flexbox } from './flexbox/Flexbox.js';

package/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/esm/layout-provider/LayoutProvider.js

@@ -156,9 +156,10 @@ const LayoutProvider = (props) => {
           isMultiWorkspaceContainer
         );
         if (targetContainer) {
+          const { path: targetContainerPath } = targetContainer.props;
           const target = getChildProp(targetContainer);
           const newLayouts = workspaceJSON.map(
-            (ws, i) => layoutFromJson(ws, `${targetContainer.props.path}.${i}`)
+            (ws, i) => layoutFromJson(ws, `${targetContainerPath}.${i}`)
           );
           const action = target ? {
             type: LayoutActionType.REPLACE,
@@ -166,7 +167,7 @@ const LayoutProvider = (props) => {
             replacement: newLayouts
           } : {
             type: LayoutActionType.ADD,
-            path: targetContainer.props.path,
+            path: targetContainerPath,
             component: newLayouts
           };
           dispatchLayoutAction(action, true);
@@ -177,10 +178,11 @@ const LayoutProvider = (props) => {
           isWorkspaceContainer
         );
         if (targetContainer) {
+          const { path: targetContainerPath } = targetContainer.props;
           const target = getChildProp(targetContainer);
           const newLayout = layoutFromJson(
             workspaceJSON,
-            `${targetContainer.props.path}.0`
+            `${targetContainerPath}.0`
           );
           const action = target ? {
             type: LayoutActionType.REPLACE,
@@ -188,7 +190,7 @@ const LayoutProvider = (props) => {
             replacement: newLayout
           } : {
             type: LayoutActionType.ADD,
-            path: targetContainer.props.path,
+            path: targetContainerPath,
             component: newLayout
           };
           dispatchLayoutAction(action, true);

package/esm/layout-provider/LayoutProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"LayoutProvider.js","sources":["../../src/layout-provider/LayoutProvider.tsx"],"sourcesContent":["import {\n  VuuShellLocation,\n  logger,\n  usePlaceholderJSON,\n  type LayoutJSON,\n} from \"@vuu-ui/vuu-utils\";\nimport {\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type MutableRefObject,\n  type ReactElement,\n} from \"react\";\nimport {\n  LayoutActionType,\n  LayoutProps,\n  cloneElementAddLayoutProps,\n  layoutFromJson,\n  layoutQuery,\n  layoutReducer,\n  layoutToJSON,\n  type LayoutChangeHandler,\n  type LayoutChangeReason,\n  type LayoutReducerAction,\n} from \"../layout-reducer\";\nimport type { SaveAction } from \"../layout-view\";\nimport { findTarget, getChildProp, getProp, getProps, typeOf } from \"../utils\";\nimport {\n  LayoutProviderContext,\n  LayoutProviderDispatch,\n} from \"./LayoutProviderContext\";\nimport { useLayoutDragDrop } from \"./useLayoutDragDrop\";\n\nconst { info } = logger(\"LayoutProvider\");\n\nconst isWorkspaceContainer = (props: LayoutProps) =>\n  props.id === VuuShellLocation.WorkspaceContainer;\n\nconst isMultiWorkspaceContainer = (props: LayoutProps) =>\n  props.id === VuuShellLocation.MultiWorkspaceContainer;\n\nconst shouldSave = (action: LayoutReducerAction) =>\n  [\n    \"add\",\n    \"drag-drop\",\n    \"remove\",\n    \"set-title\",\n    \"splitter-resize\",\n    \"switch-tab\",\n  ].includes(action.type);\n\nconst getLayoutChangeReason = (\n  action: LayoutReducerAction | SaveAction,\n): LayoutChangeReason => {\n  switch (action.type) {\n    case \"switch-tab\":\n      if (action.id === VuuShellLocation.Workspace) {\n        return \"switch-active-layout\";\n      } else {\n        return \"switch-active-tab\";\n      }\n    case \"save\":\n      return \"save-feature-props\";\n    case \"drag-drop\":\n      return \"drag-drop-operation\";\n    case \"add\":\n      return \"add-component\";\n    case \"remove\":\n      return \"remove-component\";\n    case \"splitter-resize\":\n      return \"resize-component\";\n    case \"set-title\":\n      return \"edit-feature-title\";\n    default:\n      throw Error(\"unknown layout action\");\n  }\n};\n\nexport interface LayoutProviderProps {\n  children: ReactElement;\n  createNewChild?: (index?: number) => ReactElement;\n  workspaceJSON?: LayoutJSON | LayoutJSON[];\n  onLayoutChange?: LayoutChangeHandler;\n}\n\nexport const LayoutProviderVersion = () => {\n  const version = useLayoutProviderVersion();\n  return <div>{`Context: ${version} `}</div>;\n};\n\nconst pathToDropTarget = `#${VuuShellLocation.Workspace}.ACTIVE_CHILD`;\n\nexport const LayoutProvider = (props: LayoutProviderProps): ReactElement => {\n  const { children, createNewChild, workspaceJSON, onLayoutChange } = props;\n  const state = useRef<ReactElement | undefined>(undefined);\n  const childrenRef = useRef<ReactElement>(children);\n\n  const [, forceRefresh] = useState<unknown>(null);\n\n  const serializeState = useCallback(\n    (source: ReactElement, layoutChangeReason: LayoutChangeReason) => {\n      if (onLayoutChange) {\n        const workspaceContainer =\n          findTarget(source, isWorkspaceContainer) || state.current;\n        const isLayoutContainer =\n          typeOf(workspaceContainer) === \"LayoutContainer\";\n        const target = isLayoutContainer\n          ? getProps(workspaceContainer).children[0]\n          : workspaceContainer;\n        const serializedModel = layoutToJSON(target);\n        onLayoutChange(serializedModel, layoutChangeReason);\n      }\n    },\n    [onLayoutChange],\n  );\n\n  const dispatchLayoutAction = useCallback(\n    (action: LayoutReducerAction, suppressSave = false) => {\n      const nextState = layoutReducer(state.current as ReactElement, action);\n      if (nextState !== state.current) {\n        state.current = nextState;\n        forceRefresh({});\n        if (!suppressSave && shouldSave(action)) {\n          serializeState(nextState, getLayoutChangeReason(action));\n        }\n      }\n    },\n    [forceRefresh, serializeState],\n  );\n\n  const addComponentToWorkspace = useCallback(\n    (component: ReactElement) => {\n      dispatchLayoutAction({\n        type: \"add\",\n        path: `#${VuuShellLocation.Workspace}`,\n        component,\n      });\n    },\n    [dispatchLayoutAction],\n  );\n\n  const switchWorkspace = useCallback(\n    (idx: number) => {\n      dispatchLayoutAction({\n        type: \"switch-tab\",\n        nextIdx: idx,\n        path: `#${VuuShellLocation.MultiWorkspaceContainer}`,\n      });\n    },\n    [dispatchLayoutAction],\n  );\n\n  const showComponentInContextPanel = useCallback(\n    (\n      component: ReactElement | LayoutJSON,\n      title?: string,\n      onContextPanelClose?: () => void,\n    ) => {\n      dispatchLayoutAction({\n        type: \"set-props\",\n        path: `#${VuuShellLocation.ContextPanel}`,\n        props: {\n          expanded: true,\n          content: component,\n          onClose: onContextPanelClose,\n          title,\n        },\n      });\n    },\n    [dispatchLayoutAction],\n  );\n\n  const layoutActionDispatcher = useCallback<LayoutProviderDispatch>(\n    (action) => {\n      switch (action.type) {\n        case \"drag-start\": {\n          prepareToDragLayout(action);\n          break;\n        }\n        case \"save\": {\n          if (state.current) {\n            serializeState(state.current, getLayoutChangeReason(action));\n          }\n          break;\n        }\n        case \"query\":\n          if (action.query === \"PARENT_CONTAINER\") {\n            return layoutQuery(action.query, action.path, state.current);\n          }\n          break;\n\n        default: {\n          dispatchLayoutAction(action);\n          break;\n        }\n      }\n    },\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [dispatchLayoutAction, serializeState],\n  );\n\n  const prepareToDragLayout = useLayoutDragDrop(\n    state as MutableRefObject<ReactElement>,\n    layoutActionDispatcher,\n    pathToDropTarget,\n  );\n\n  useEffect(() => {\n    if (workspaceJSON) {\n      info?.(\"workspaceJSON changed. inject new layout into application\");\n      if (Array.isArray(workspaceJSON)) {\n        const targetContainer = findTarget(\n          state.current,\n          isMultiWorkspaceContainer,\n        ) as ReactElement;\n        if (targetContainer) {\n          const target = getChildProp(targetContainer);\n          const newLayouts = workspaceJSON.map((ws, i) =>\n            layoutFromJson(ws, `${targetContainer.props.path}.${i}`),\n          );\n          const action = target\n            ? {\n                type: LayoutActionType.REPLACE,\n                target,\n                replacement: newLayouts,\n              }\n            : {\n                type: LayoutActionType.ADD,\n                path: targetContainer.props.path,\n                component: newLayouts,\n              };\n          dispatchLayoutAction(action, true);\n        }\n      } else {\n        const targetContainer = findTarget(\n          state.current,\n          isWorkspaceContainer,\n        ) as ReactElement;\n        if (targetContainer) {\n          const target = getChildProp(targetContainer);\n          const newLayout = layoutFromJson(\n            workspaceJSON,\n            `${targetContainer.props.path}.0`,\n          );\n          const action = target\n            ? {\n                type: LayoutActionType.REPLACE,\n                target,\n                replacement: newLayout,\n              }\n            : {\n                type: LayoutActionType.ADD,\n                path: targetContainer.props.path,\n                component: newLayout,\n              };\n          dispatchLayoutAction(action, true);\n        } else if (workspaceJSON.id === getProp(state.current, \"id\")) {\n          const newLayout = layoutFromJson(workspaceJSON, \"0\");\n          const action = {\n            type: LayoutActionType.REPLACE,\n            target: state.current,\n            replacement: newLayout,\n          };\n          dispatchLayoutAction(action, true);\n        } else {\n          throw Error(\n            `LayoutProvider unable to render new workspaceJson, no valid target container. Use a valid Shell Layout Template or include a container with the standard workspace id '${VuuShellLocation.Workspace}' `,\n          );\n        }\n      }\n    }\n  }, [dispatchLayoutAction, workspaceJSON]);\n\n  if (state.current === undefined) {\n    state.current = cloneElementAddLayoutProps(children);\n  } else if (children !== childrenRef.current) {\n    state.current = cloneElementAddLayoutProps(children, state.current);\n    childrenRef.current = children;\n  }\n\n  return (\n    <LayoutProviderContext.Provider\n      value={{\n        addComponentToWorkspace,\n        createNewChild,\n        dispatchLayoutProvider: layoutActionDispatcher,\n        showComponentInContextPanel,\n        switchWorkspace,\n        version: 0,\n      }}\n    >\n      {state.current}\n    </LayoutProviderContext.Provider>\n  );\n};\n\nexport const useLayoutProviderDispatch = () => {\n  const { dispatchLayoutProvider } = useContext(LayoutProviderContext);\n  return dispatchLayoutProvider;\n};\n\nexport const useLayoutOperation = () => {\n  const {\n    addComponentToWorkspace,\n    showComponentInContextPanel,\n    switchWorkspace,\n  } = useContext(LayoutProviderContext);\n  return {\n    addComponentToWorkspace,\n    showComponentInContextPanel,\n    switchWorkspace,\n  };\n};\n\nexport const useLayoutCreateNewChild = () => {\n  const layoutPlaceholderJSON = usePlaceholderJSON();\n  const { createNewChild } = useContext(LayoutProviderContext);\n\n  const defaultCreateNewChild = useMemo(\n    () =>\n      function createNewChild() {\n        if (layoutPlaceholderJSON) {\n          const { props } = layoutPlaceholderJSON;\n          return layoutFromJson(\n            {\n              ...layoutPlaceholderJSON,\n              props: {\n                ...props,\n                resizeable: true,\n                style: {\n                  ...props?.style,\n                  flexGrow: 1,\n                  flexShrink: 0,\n                  flexBasis: 0,\n                },\n              },\n            },\n            \"0\",\n          );\n        }\n        return layoutFromJson(\n          {\n            type: \"Placeholder\",\n            props: {\n              resizeable: true,\n              style: {\n                flexGrow: 1,\n                flexShrink: 0,\n                flexBasis: 0,\n              },\n            },\n          },\n          \"0\",\n        );\n      },\n    [layoutPlaceholderJSON],\n  );\n\n  return createNewChild ?? defaultCreateNewChild;\n};\n\nexport const useLayoutProviderVersion = () => {\n  const { version } = useContext(LayoutProviderContext);\n  return version;\n};\n"],"names":["createNewChild"],"mappings":";;;;;;;;;;;;AAoCA,MAAM,EAAE,IAAA,EAAS,GAAA,MAAA,CAAO,gBAAgB,CAAA;AAExC,MAAM,oBAAuB,GAAA,CAAC,KAC5B,KAAA,KAAA,CAAM,OAAO,gBAAiB,CAAA,kBAAA;AAEhC,MAAM,yBAA4B,GAAA,CAAC,KACjC,KAAA,KAAA,CAAM,OAAO,gBAAiB,CAAA,uBAAA;AAEhC,MAAM,UAAA,GAAa,CAAC,MAClB,KAAA;AAAA,EACE,KAAA;AAAA,EACA,WAAA;AAAA,EACA,QAAA;AAAA,EACA,WAAA;AAAA,EACA,iBAAA;AAAA,EACA;AACF,CAAE,CAAA,QAAA,CAAS,OAAO,IAAI,CAAA;AAExB,MAAM,qBAAA,GAAwB,CAC5B,MACuB,KAAA;AACvB,EAAA,QAAQ,OAAO,IAAM;AAAA,IACnB,KAAK,YAAA;AACH,MAAI,IAAA,MAAA,CAAO,EAAO,KAAA,gBAAA,CAAiB,SAAW,EAAA;AAC5C,QAAO,OAAA,sBAAA;AAAA,OACF,MAAA;AACL,QAAO,OAAA,mBAAA;AAAA;AACT,IACF,KAAK,MAAA;AACH,MAAO,OAAA,oBAAA;AAAA,IACT,KAAK,WAAA;AACH,MAAO,OAAA,qBAAA;AAAA,IACT,KAAK,KAAA;AACH,MAAO,OAAA,eAAA;AAAA,IACT,KAAK,QAAA;AACH,MAAO,OAAA,kBAAA;AAAA,IACT,KAAK,iBAAA;AACH,MAAO,OAAA,kBAAA;AAAA,IACT,KAAK,WAAA;AACH,MAAO,OAAA,oBAAA;AAAA,IACT;AACE,MAAA,MAAM,MAAM,uBAAuB,CAAA;AAAA;AAEzC,CAAA;AASO,MAAM,wBAAwB,MAAM;AACzC,EAAA,MAAM,UAAU,wBAAyB,EAAA;AACzC,EAAA,uBAAQ,GAAA,CAAA,KAAA,EAAA,EAAK,QAAY,EAAA,CAAA,SAAA,EAAA,OAAO,CAAI,CAAA,CAAA,EAAA,CAAA;AACtC;AAEA,MAAM,gBAAA,GAAmB,CAAI,CAAA,EAAA,gBAAA,CAAiB,SAAS,CAAA,aAAA,CAAA;AAE1C,MAAA,cAAA,GAAiB,CAAC,KAA6C,KAAA;AAC1E,EAAA,MAAM,EAAE,QAAA,EAAU,cAAgB,EAAA,aAAA,EAAe,gBAAmB,GAAA,KAAA;AACpE,EAAM,MAAA,KAAA,GAAQ,OAAiC,KAAS,CAAA,CAAA;AACxD,EAAM,MAAA,WAAA,GAAc,OAAqB,QAAQ,CAAA;AAEjD,EAAA,MAAM,GAAG,YAAY,CAAA,GAAI,SAAkB,IAAI,CAAA;AAE/C,EAAA,MAAM,cAAiB,GAAA,WAAA;AAAA,IACrB,CAAC,QAAsB,kBAA2C,KAAA;AAChE,MAAA,IAAI,cAAgB,EAAA;AAClB,QAAA,MAAM,kBACJ,GAAA,UAAA,CAAW,MAAQ,EAAA,oBAAoB,KAAK,KAAM,CAAA,OAAA;AACpD,QAAM,MAAA,iBAAA,GACJ,MAAO,CAAA,kBAAkB,CAAM,KAAA,iBAAA;AACjC,QAAA,MAAM,SAAS,iBACX,GAAA,QAAA,CAAS,kBAAkB,CAAE,CAAA,QAAA,CAAS,CAAC,CACvC,GAAA,kBAAA;AACJ,QAAM,MAAA,eAAA,GAAkB,aAAa,MAAM,CAAA;AAC3C,QAAA,cAAA,CAAe,iBAAiB,kBAAkB,CAAA;AAAA;AACpD,KACF;AAAA,IACA,CAAC,cAAc;AAAA,GACjB;AAEA,EAAA,MAAM,oBAAuB,GAAA,WAAA;AAAA,IAC3B,CAAC,MAA6B,EAAA,YAAA,GAAe,KAAU,KAAA;AACrD,MAAA,MAAM,SAAY,GAAA,aAAA,CAAc,KAAM,CAAA,OAAA,EAAyB,MAAM,CAAA;AACrE,MAAI,IAAA,SAAA,KAAc,MAAM,OAAS,EAAA;AAC/B,QAAA,KAAA,CAAM,OAAU,GAAA,SAAA;AAChB,QAAA,YAAA,CAAa,EAAE,CAAA;AACf,QAAA,IAAI,CAAC,YAAA,IAAgB,UAAW,CAAA,MAAM,CAAG,EAAA;AACvC,UAAe,cAAA,CAAA,SAAA,EAAW,qBAAsB,CAAA,MAAM,CAAC,CAAA;AAAA;AACzD;AACF,KACF;AAAA,IACA,CAAC,cAAc,cAAc;AAAA,GAC/B;AAEA,EAAA,MAAM,uBAA0B,GAAA,WAAA;AAAA,IAC9B,CAAC,SAA4B,KAAA;AAC3B,MAAqB,oBAAA,CAAA;AAAA,QACnB,IAAM,EAAA,KAAA;AAAA,QACN,IAAA,EAAM,CAAI,CAAA,EAAA,gBAAA,CAAiB,SAAS,CAAA,CAAA;AAAA,QACpC;AAAA,OACD,CAAA;AAAA,KACH;AAAA,IACA,CAAC,oBAAoB;AAAA,GACvB;AAEA,EAAA,MAAM,eAAkB,GAAA,WAAA;AAAA,IACtB,CAAC,GAAgB,KAAA;AACf,MAAqB,oBAAA,CAAA;AAAA,QACnB,IAAM,EAAA,YAAA;AAAA,QACN,OAAS,EAAA,GAAA;AAAA,QACT,IAAA,EAAM,CAAI,CAAA,EAAA,gBAAA,CAAiB,uBAAuB,CAAA;AAAA,OACnD,CAAA;AAAA,KACH;AAAA,IACA,CAAC,oBAAoB;AAAA,GACvB;AAEA,EAAA,MAAM,2BAA8B,GAAA,WAAA;AAAA,IAClC,CACE,SACA,EAAA,KAAA,EACA,mBACG,KAAA;AACH,MAAqB,oBAAA,CAAA;AAAA,QACnB,IAAM,EAAA,WAAA;AAAA,QACN,IAAA,EAAM,CAAI,CAAA,EAAA,gBAAA,CAAiB,YAAY,CAAA,CAAA;AAAA,QACvC,KAAO,EAAA;AAAA,UACL,QAAU,EAAA,IAAA;AAAA,UACV,OAAS,EAAA,SAAA;AAAA,UACT,OAAS,EAAA,mBAAA;AAAA,UACT;AAAA;AACF,OACD,CAAA;AAAA,KACH;AAAA,IACA,CAAC,oBAAoB;AAAA,GACvB;AAEA,EAAA,MAAM,sBAAyB,GAAA,WAAA;AAAA,IAC7B,CAAC,MAAW,KAAA;AACV,MAAA,QAAQ,OAAO,IAAM;AAAA,QACnB,KAAK,YAAc,EAAA;AACjB,UAAA,mBAAA,CAAoB,MAAM,CAAA;AAC1B,UAAA;AAAA;AACF,QACA,KAAK,MAAQ,EAAA;AACX,UAAA,IAAI,MAAM,OAAS,EAAA;AACjB,YAAA,cAAA,CAAe,KAAM,CAAA,OAAA,EAAS,qBAAsB,CAAA,MAAM,CAAC,CAAA;AAAA;AAE7D,UAAA;AAAA;AACF,QACA,KAAK,OAAA;AACH,UAAI,IAAA,MAAA,CAAO,UAAU,kBAAoB,EAAA;AACvC,YAAA,OAAO,YAAY,MAAO,CAAA,KAAA,EAAO,MAAO,CAAA,IAAA,EAAM,MAAM,OAAO,CAAA;AAAA;AAE7D,UAAA;AAAA,QAEF,SAAS;AACP,UAAA,oBAAA,CAAqB,MAAM,CAAA;AAC3B,UAAA;AAAA;AACF;AACF,KACF;AAAA;AAAA,IAEA,CAAC,sBAAsB,cAAc;AAAA,GACvC;AAEA,EAAA,MAAM,mBAAsB,GAAA,iBAAA;AAAA,IAC1B,KAAA;AAAA,IACA,sBAAA;AAAA,IACA;AAAA,GACF;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,aAAe,EAAA;AACjB,MAAA,IAAA,GAAO,2DAA2D,CAAA;AAClE,MAAI,IAAA,KAAA,CAAM,OAAQ,CAAA,aAAa,CAAG,EAAA;AAChC,QAAA,MAAM,eAAkB,GAAA,UAAA;AAAA,UACtB,KAAM,CAAA,OAAA;AAAA,UACN;AAAA,SACF;AACA,QAAA,IAAI,eAAiB,EAAA;AACnB,UAAM,MAAA,MAAA,GAAS,aAAa,eAAe,CAAA;AAC3C,UAAA,MAAM,aAAa,aAAc,CAAA,GAAA;AAAA,YAAI,CAAC,EAAI,EAAA,CAAA,KACxC,cAAe,CAAA,EAAA,EAAI,CAAG,EAAA,eAAA,CAAgB,KAAM,CAAA,IAAI,CAAI,CAAA,EAAA,CAAC,CAAE,CAAA;AAAA,WACzD;AACA,UAAA,MAAM,SAAS,MACX,GAAA;AAAA,YACE,MAAM,gBAAiB,CAAA,OAAA;AAAA,YACvB,MAAA;AAAA,YACA,WAAa,EAAA;AAAA,WAEf,GAAA;AAAA,YACE,MAAM,gBAAiB,CAAA,GAAA;AAAA,YACvB,IAAA,EAAM,gBAAgB,KAAM,CAAA,IAAA;AAAA,YAC5B,SAAW,EAAA;AAAA,WACb;AACJ,UAAA,oBAAA,CAAqB,QAAQ,IAAI,CAAA;AAAA;AACnC,OACK,MAAA;AACL,QAAA,MAAM,eAAkB,GAAA,UAAA;AAAA,UACtB,KAAM,CAAA,OAAA;AAAA,UACN;AAAA,SACF;AACA,QAAA,IAAI,eAAiB,EAAA;AACnB,UAAM,MAAA,MAAA,GAAS,aAAa,eAAe,CAAA;AAC3C,UAAA,MAAM,SAAY,GAAA,cAAA;AAAA,YAChB,aAAA;AAAA,YACA,CAAA,EAAG,eAAgB,CAAA,KAAA,CAAM,IAAI,CAAA,EAAA;AAAA,WAC/B;AACA,UAAA,MAAM,SAAS,MACX,GAAA;AAAA,YACE,MAAM,gBAAiB,CAAA,OAAA;AAAA,YACvB,MAAA;AAAA,YACA,WAAa,EAAA;AAAA,WAEf,GAAA;AAAA,YACE,MAAM,gBAAiB,CAAA,GAAA;AAAA,YACvB,IAAA,EAAM,gBAAgB,KAAM,CAAA,IAAA;AAAA,YAC5B,SAAW,EAAA;AAAA,WACb;AACJ,UAAA,oBAAA,CAAqB,QAAQ,IAAI,CAAA;AAAA,mBACxB,aAAc,CAAA,EAAA,KAAO,QAAQ,KAAM,CAAA,OAAA,EAAS,IAAI,CAAG,EAAA;AAC5D,UAAM,MAAA,SAAA,GAAY,cAAe,CAAA,aAAA,EAAe,GAAG,CAAA;AACnD,UAAA,MAAM,MAAS,GAAA;AAAA,YACb,MAAM,gBAAiB,CAAA,OAAA;AAAA,YACvB,QAAQ,KAAM,CAAA,OAAA;AAAA,YACd,WAAa,EAAA;AAAA,WACf;AACA,UAAA,oBAAA,CAAqB,QAAQ,IAAI,CAAA;AAAA,SAC5B,MAAA;AACL,UAAM,MAAA,KAAA;AAAA,YACJ,CAAA,uKAAA,EAA0K,iBAAiB,SAAS,CAAA,EAAA;AAAA,WACtM;AAAA;AACF;AACF;AACF,GACC,EAAA,CAAC,oBAAsB,EAAA,aAAa,CAAC,CAAA;AAExC,EAAI,IAAA,KAAA,CAAM,YAAY,KAAW,CAAA,EAAA;AAC/B,IAAM,KAAA,CAAA,OAAA,GAAU,2BAA2B,QAAQ,CAAA;AAAA,GACrD,MAAA,IAAW,QAAa,KAAA,WAAA,CAAY,OAAS,EAAA;AAC3C,IAAA,KAAA,CAAM,OAAU,GAAA,0BAAA,CAA2B,QAAU,EAAA,KAAA,CAAM,OAAO,CAAA;AAClE,IAAA,WAAA,CAAY,OAAU,GAAA,QAAA;AAAA;AAGxB,EACE,uBAAA,GAAA;AAAA,IAAC,qBAAsB,CAAA,QAAA;AAAA,IAAtB;AAAA,MACC,KAAO,EAAA;AAAA,QACL,uBAAA;AAAA,QACA,cAAA;AAAA,QACA,sBAAwB,EAAA,sBAAA;AAAA,QACxB,2BAAA;AAAA,QACA,eAAA;AAAA,QACA,OAAS,EAAA;AAAA,OACX;AAAA,MAEC,QAAM,EAAA,KAAA,CAAA;AAAA;AAAA,GACT;AAEJ;AAEO,MAAM,4BAA4B,MAAM;AAC7C,EAAA,MAAM,EAAE,sBAAA,EAA2B,GAAA,UAAA,CAAW,qBAAqB,CAAA;AACnE,EAAO,OAAA,sBAAA;AACT;AAEO,MAAM,qBAAqB,MAAM;AACtC,EAAM,MAAA;AAAA,IACJ,uBAAA;AAAA,IACA,2BAAA;AAAA,IACA;AAAA,GACF,GAAI,WAAW,qBAAqB,CAAA;AACpC,EAAO,OAAA;AAAA,IACL,uBAAA;AAAA,IACA,2BAAA;AAAA,IACA;AAAA,GACF;AACF;AAEO,MAAM,0BAA0B,MAAM;AAC3C,EAAA,MAAM,wBAAwB,kBAAmB,EAAA;AACjD,EAAA,MAAM,EAAE,cAAA,EAAmB,GAAA,UAAA,CAAW,qBAAqB,CAAA;AAE3D,EAAA,MAAM,qBAAwB,GAAA,OAAA;AAAA,IAC5B,MACE,SAASA,eAAiB,GAAA;AACxB,MAAA,IAAI,qBAAuB,EAAA;AACzB,QAAM,MAAA,EAAE,OAAU,GAAA,qBAAA;AAClB,QAAO,OAAA,cAAA;AAAA,UACL;AAAA,YACE,GAAG,qBAAA;AAAA,YACH,KAAO,EAAA;AAAA,cACL,GAAG,KAAA;AAAA,cACH,UAAY,EAAA,IAAA;AAAA,cACZ,KAAO,EAAA;AAAA,gBACL,GAAG,KAAO,EAAA,KAAA;AAAA,gBACV,QAAU,EAAA,CAAA;AAAA,gBACV,UAAY,EAAA,CAAA;AAAA,gBACZ,SAAW,EAAA;AAAA;AACb;AACF,WACF;AAAA,UACA;AAAA,SACF;AAAA;AAEF,MAAO,OAAA,cAAA;AAAA,QACL;AAAA,UACE,IAAM,EAAA,aAAA;AAAA,UACN,KAAO,EAAA;AAAA,YACL,UAAY,EAAA,IAAA;AAAA,YACZ,KAAO,EAAA;AAAA,cACL,QAAU,EAAA,CAAA;AAAA,cACV,UAAY,EAAA,CAAA;AAAA,cACZ,SAAW,EAAA;AAAA;AACb;AACF,SACF;AAAA,QACA;AAAA,OACF;AAAA,KACF;AAAA,IACF,CAAC,qBAAqB;AAAA,GACxB;AAEA,EAAA,OAAO,cAAkB,IAAA,qBAAA;AAC3B;AAEO,MAAM,2BAA2B,MAAM;AAC5C,EAAA,MAAM,EAAE,OAAA,EAAY,GAAA,UAAA,CAAW,qBAAqB,CAAA;AACpD,EAAO,OAAA,OAAA;AACT;;;;"}
+{"version":3,"file":"LayoutProvider.js","sources":["../../src/layout-provider/LayoutProvider.tsx"],"sourcesContent":["import {\n  VuuShellLocation,\n  logger,\n  usePlaceholderJSON,\n  type LayoutJSON,\n} from \"@vuu-ui/vuu-utils\";\nimport {\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type MutableRefObject,\n  type ReactElement,\n} from \"react\";\nimport {\n  LayoutActionType,\n  LayoutProps,\n  cloneElementAddLayoutProps,\n  layoutFromJson,\n  layoutQuery,\n  layoutReducer,\n  layoutToJSON,\n  type LayoutChangeHandler,\n  type LayoutChangeReason,\n  type LayoutReducerAction,\n} from \"../layout-reducer\";\nimport type { SaveAction } from \"../layout-view\";\nimport { findTarget, getChildProp, getProp, getProps, typeOf } from \"../utils\";\nimport {\n  LayoutProviderContext,\n  LayoutProviderDispatch,\n} from \"./LayoutProviderContext\";\nimport { useLayoutDragDrop } from \"./useLayoutDragDrop\";\n\nconst { info } = logger(\"LayoutProvider\");\n\nconst isWorkspaceContainer = (props: LayoutProps) =>\n  props.id === VuuShellLocation.WorkspaceContainer;\n\nconst isMultiWorkspaceContainer = (props: LayoutProps) =>\n  props.id === VuuShellLocation.MultiWorkspaceContainer;\n\nconst shouldSave = (action: LayoutReducerAction) =>\n  [\n    \"add\",\n    \"drag-drop\",\n    \"remove\",\n    \"set-title\",\n    \"splitter-resize\",\n    \"switch-tab\",\n  ].includes(action.type);\n\nconst getLayoutChangeReason = (\n  action: LayoutReducerAction | SaveAction,\n): LayoutChangeReason => {\n  switch (action.type) {\n    case \"switch-tab\":\n      if (action.id === VuuShellLocation.Workspace) {\n        return \"switch-active-layout\";\n      } else {\n        return \"switch-active-tab\";\n      }\n    case \"save\":\n      return \"save-feature-props\";\n    case \"drag-drop\":\n      return \"drag-drop-operation\";\n    case \"add\":\n      return \"add-component\";\n    case \"remove\":\n      return \"remove-component\";\n    case \"splitter-resize\":\n      return \"resize-component\";\n    case \"set-title\":\n      return \"edit-feature-title\";\n    default:\n      throw Error(\"unknown layout action\");\n  }\n};\n\nexport interface LayoutProviderProps {\n  children: ReactElement;\n  createNewChild?: (index?: number) => ReactElement;\n  workspaceJSON?: LayoutJSON | LayoutJSON[];\n  onLayoutChange?: LayoutChangeHandler;\n}\n\nexport const LayoutProviderVersion = () => {\n  const version = useLayoutProviderVersion();\n  return <div>{`Context: ${version} `}</div>;\n};\n\nconst pathToDropTarget = `#${VuuShellLocation.Workspace}.ACTIVE_CHILD`;\n\nexport const LayoutProvider = (props: LayoutProviderProps): ReactElement => {\n  const { children, createNewChild, workspaceJSON, onLayoutChange } = props;\n  const state = useRef<ReactElement | undefined>(undefined);\n  const childrenRef = useRef<ReactElement>(children);\n\n  const [, forceRefresh] = useState<unknown>(null);\n\n  const serializeState = useCallback(\n    (source: ReactElement, layoutChangeReason: LayoutChangeReason) => {\n      if (onLayoutChange) {\n        const workspaceContainer =\n          findTarget(source, isWorkspaceContainer) || state.current;\n        const isLayoutContainer =\n          typeOf(workspaceContainer) === \"LayoutContainer\";\n        const target = isLayoutContainer\n          ? getProps(workspaceContainer).children[0]\n          : workspaceContainer;\n        const serializedModel = layoutToJSON(target);\n        onLayoutChange(serializedModel, layoutChangeReason);\n      }\n    },\n    [onLayoutChange],\n  );\n\n  const dispatchLayoutAction = useCallback(\n    (action: LayoutReducerAction, suppressSave = false) => {\n      const nextState = layoutReducer(state.current as ReactElement, action);\n      if (nextState !== state.current) {\n        state.current = nextState;\n        forceRefresh({});\n        if (!suppressSave && shouldSave(action)) {\n          serializeState(nextState, getLayoutChangeReason(action));\n        }\n      }\n    },\n    [forceRefresh, serializeState],\n  );\n\n  const addComponentToWorkspace = useCallback(\n    (component: ReactElement) => {\n      dispatchLayoutAction({\n        type: \"add\",\n        path: `#${VuuShellLocation.Workspace}`,\n        component,\n      });\n    },\n    [dispatchLayoutAction],\n  );\n\n  const switchWorkspace = useCallback(\n    (idx: number) => {\n      dispatchLayoutAction({\n        type: \"switch-tab\",\n        nextIdx: idx,\n        path: `#${VuuShellLocation.MultiWorkspaceContainer}`,\n      });\n    },\n    [dispatchLayoutAction],\n  );\n\n  const showComponentInContextPanel = useCallback(\n    (\n      component: ReactElement | LayoutJSON,\n      title?: string,\n      onContextPanelClose?: () => void,\n    ) => {\n      dispatchLayoutAction({\n        type: \"set-props\",\n        path: `#${VuuShellLocation.ContextPanel}`,\n        props: {\n          expanded: true,\n          content: component,\n          onClose: onContextPanelClose,\n          title,\n        },\n      });\n    },\n    [dispatchLayoutAction],\n  );\n\n  const layoutActionDispatcher = useCallback<LayoutProviderDispatch>(\n    (action) => {\n      switch (action.type) {\n        case \"drag-start\": {\n          prepareToDragLayout(action);\n          break;\n        }\n        case \"save\": {\n          if (state.current) {\n            serializeState(state.current, getLayoutChangeReason(action));\n          }\n          break;\n        }\n        case \"query\":\n          if (action.query === \"PARENT_CONTAINER\") {\n            return layoutQuery(action.query, action.path, state.current);\n          }\n          break;\n\n        default: {\n          dispatchLayoutAction(action);\n          break;\n        }\n      }\n    },\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [dispatchLayoutAction, serializeState],\n  );\n\n  const prepareToDragLayout = useLayoutDragDrop(\n    state as MutableRefObject<ReactElement>,\n    layoutActionDispatcher,\n    pathToDropTarget,\n  );\n\n  useEffect(() => {\n    if (workspaceJSON) {\n      info?.(\"workspaceJSON changed. inject new layout into application\");\n      if (Array.isArray(workspaceJSON)) {\n        const targetContainer = findTarget(\n          state.current,\n          isMultiWorkspaceContainer,\n        ) as ReactElement;\n        if (targetContainer) {\n          // eslint-disable-next-line @typescript-eslint/no-explicit-any\n          const { path: targetContainerPath } = targetContainer.props as any;\n          const target = getChildProp(targetContainer);\n          const newLayouts = workspaceJSON.map((ws, i) =>\n            layoutFromJson(ws, `${targetContainerPath}.${i}`),\n          );\n          const action = target\n            ? {\n                type: LayoutActionType.REPLACE,\n                target,\n                replacement: newLayouts,\n              }\n            : {\n                type: LayoutActionType.ADD,\n                path: targetContainerPath,\n                component: newLayouts,\n              };\n          dispatchLayoutAction(action, true);\n        }\n      } else {\n        const targetContainer = findTarget(\n          state.current,\n          isWorkspaceContainer,\n        ) as ReactElement;\n        if (targetContainer) {\n          // eslint-disable-next-line @typescript-eslint/no-explicit-any\n          const { path: targetContainerPath } = targetContainer.props as any;\n          const target = getChildProp(targetContainer);\n          const newLayout = layoutFromJson(\n            workspaceJSON,\n            `${targetContainerPath}.0`,\n          );\n          const action = target\n            ? {\n                type: LayoutActionType.REPLACE,\n                target,\n                replacement: newLayout,\n              }\n            : {\n                type: LayoutActionType.ADD,\n                path: targetContainerPath,\n                component: newLayout,\n              };\n          dispatchLayoutAction(action, true);\n        } else if (workspaceJSON.id === getProp(state.current, \"id\")) {\n          const newLayout = layoutFromJson(workspaceJSON, \"0\");\n          const action = {\n            type: LayoutActionType.REPLACE,\n            target: state.current,\n            replacement: newLayout,\n          };\n          dispatchLayoutAction(action, true);\n        } else {\n          throw Error(\n            `LayoutProvider unable to render new workspaceJson, no valid target container. Use a valid Shell Layout Template or include a container with the standard workspace id '${VuuShellLocation.Workspace}' `,\n          );\n        }\n      }\n    }\n  }, [dispatchLayoutAction, workspaceJSON]);\n\n  if (state.current === undefined) {\n    state.current = cloneElementAddLayoutProps(children);\n  } else if (children !== childrenRef.current) {\n    state.current = cloneElementAddLayoutProps(children, state.current);\n    childrenRef.current = children;\n  }\n\n  return (\n    <LayoutProviderContext.Provider\n      value={{\n        addComponentToWorkspace,\n        createNewChild,\n        dispatchLayoutProvider: layoutActionDispatcher,\n        showComponentInContextPanel,\n        switchWorkspace,\n        version: 0,\n      }}\n    >\n      {state.current}\n    </LayoutProviderContext.Provider>\n  );\n};\n\nexport const useLayoutProviderDispatch = () => {\n  const { dispatchLayoutProvider } = useContext(LayoutProviderContext);\n  return dispatchLayoutProvider;\n};\n\nexport const useLayoutOperation = () => {\n  const {\n    addComponentToWorkspace,\n    showComponentInContextPanel,\n    switchWorkspace,\n  } = useContext(LayoutProviderContext);\n  return {\n    addComponentToWorkspace,\n    showComponentInContextPanel,\n    switchWorkspace,\n  };\n};\n\nexport const useLayoutCreateNewChild = () => {\n  const layoutPlaceholderJSON = usePlaceholderJSON();\n  const { createNewChild } = useContext(LayoutProviderContext);\n\n  const defaultCreateNewChild = useMemo(\n    () =>\n      function createNewChild() {\n        if (layoutPlaceholderJSON) {\n          const { props } = layoutPlaceholderJSON;\n          return layoutFromJson(\n            {\n              ...layoutPlaceholderJSON,\n              props: {\n                ...props,\n                resizeable: true,\n                style: {\n                  ...props?.style,\n                  flexGrow: 1,\n                  flexShrink: 0,\n                  flexBasis: 0,\n                },\n              },\n            },\n            \"0\",\n          );\n        }\n        return layoutFromJson(\n          {\n            type: \"Placeholder\",\n            props: {\n              resizeable: true,\n              style: {\n                flexGrow: 1,\n                flexShrink: 0,\n                flexBasis: 0,\n              },\n            },\n          },\n          \"0\",\n        );\n      },\n    [layoutPlaceholderJSON],\n  );\n\n  return createNewChild ?? defaultCreateNewChild;\n};\n\nexport const useLayoutProviderVersion = () => {\n  const { version } = useContext(LayoutProviderContext);\n  return version;\n};\n"],"names":["createNewChild"],"mappings":"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"}

package/esm/layout-provider/useLayoutDragDrop.js

@@ -1,9 +1,5 @@
 import { useRef, useCallback } from 'react';
 import { Draggable } from '../drag-drop/Draggable.js';
-import 'react/jsx-runtime';
-import 'clsx';
-import '@salt-ds/styles';
-import '@salt-ds/window';
 import { followPath, resolvePath } from '../utils/pathUtils.js';
 import '../drag-drop/BoxModel.js';
 import { getIntrinsicSize } from '../layout-reducer/flexUtils.js';
@@ -36,9 +32,9 @@ const determineDragOffsets = (draggedElement) => {
   }
 };
 const useLayoutDragDrop = (rootLayoutRef, dispatch, pathToDropTarget) => {
-  const dragActionRef = useRef();
-  const dragOperationRef = useRef();
-  const draggableHTMLElementRef = useRef();
+  const dragActionRef = useRef(void 0);
+  const dragOperationRef = useRef(void 0);
+  const draggableHTMLElementRef = useRef(void 0);
   const handleDrag = useCallback((x, y) => {
     if (dragOperationRef.current && draggableHTMLElementRef.current) {
       const {