@vuu-ui/vuu-layout 0.9.2 → 0.9.3

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  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 }) => {\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) => {\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) => {\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(\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  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 }) => {\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) => {\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) => {\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(\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":";;;;;;;AAaA,MAAM,SAAY,GAAA,aAAA;AAgBX,MAAM,QAAW,GAAA,KAAA,CAAM,IAAK,CAAA,SAASA,SAAS,CAAA;AAAA,EACnD,MAAA;AAAA,EACA,KAAA;AAAA,EACA,MAAA;AAAA,EACA,SAAA;AAAA,EACA,WAAA;AAAA,EACA;AACF,CAAkB,EAAA;AAChB,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,cAAA;AAAA,IACR,GAAK,EAAA,WAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,MAAM,cAAc,MAAgB,EAAA;AACpC,EAAM,MAAA,OAAA,GAAU,OAAuB,IAAI,CAAA;AAC3C,EAAM,MAAA,OAAA,GAAU,OAAe,CAAC,CAAA;AAEhC,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAI,SAAS,KAAK,CAAA;AAE1C,EAAA,MAAM,iBAAoB,GAAA,WAAA;AAAA,IACxB,CAAC,EAAE,GAAK,EAAA,QAAA,EAAe,KAAA;AACrB,MAAM,MAAA,QAAA,GAAW,WAAW,EAAK,GAAA,CAAA;AACjC,MAAI,IAAA,MAAA,IAAU,QAAQ,WAAa,EAAA;AACjC,QAAA,MAAA,CAAO,OAAO,QAAQ,CAAA;AAAA,OACxB,MAAA,IAAW,MAAU,IAAA,GAAA,KAAQ,SAAW,EAAA;AACtC,QAAO,MAAA,CAAA,KAAA,EAAO,CAAC,QAAQ,CAAA;AAAA,OACd,MAAA,IAAA,CAAC,MAAU,IAAA,GAAA,KAAQ,WAAa,EAAA;AACzC,QAAO,MAAA,CAAA,KAAA,EAAO,CAAC,QAAQ,CAAA;AAAA,OACd,MAAA,IAAA,CAAC,MAAU,IAAA,GAAA,KAAQ,YAAc,EAAA;AAC1C,QAAA,MAAA,CAAO,OAAO,QAAQ,CAAA;AAAA;AACxB,KACF;AAAA,IACA,CAAC,MAAQ,EAAA,KAAA,EAAO,MAAM;AAAA,GACxB;AAEA,EAAA,MAAM,qBAAwB,GAAA,WAAA;AAAA,IAC5B,CAAC,GAAQ,KAAA;AACP,MAAM,MAAA,EAAE,KAAQ,GAAA,GAAA;AAChB,MAAM,MAAA,cAAA,GAAiB,GAAQ,KAAA,WAAA,IAAe,GAAQ,KAAA,YAAA;AACtD,MAAM,MAAA,YAAA,GAAe,GAAQ,KAAA,SAAA,IAAa,GAAQ,KAAA,WAAA;AAClD,MAAA,IAAK,MAAU,IAAA,YAAA,IAAkB,CAAC,MAAA,IAAU,cAAiB,EAAA;AAC3D,QAAA,WAAA,CAAY,KAAK,CAAA;AACjB,QAAA,iBAAA,CAAkB,GAAG,CAAA;AACrB,QAAA,iBAAA,CAAkB,OAAU,GAAA,iBAAA;AAAA;AAC9B,KACF;AAAA,IACA,CAAC,MAAA,EAAQ,iBAAmB,EAAA,KAAA,EAAO,WAAW;AAAA,GAChD;AAEA,EAAM,MAAA,iBAAA,GAAoB,OAAO,qBAAqB,CAAA;AACtD,EAAA,MAAM,aAAgB,GAAA,CAAC,GAAuB,KAAA,iBAAA,CAAkB,QAAQ,GAAG,CAAA;AAE3E,EAAA,MAAM,eAAkB,GAAA,WAAA;AAAA,IACtB,CAAC,CAAM,KAAA;AACL,MAAA,WAAA,CAAY,OAAU,GAAA,IAAA;AACtB,MAAA,MAAM,GAAM,GAAA,CAAA,CAAE,MAAS,GAAA,SAAA,GAAY,SAAS,CAAA;AAC5C,MAAM,MAAA,IAAA,GAAO,MAAM,OAAQ,CAAA,OAAA;AAC3B,MAAI,IAAA,GAAA,IAAO,GAAQ,KAAA,OAAA,CAAQ,OAAS,EAAA;AAClC,QAAA,MAAA,CAAO,OAAO,IAAI,CAAA;AAAA;AAEpB,MAAA,OAAA,CAAQ,OAAU,GAAA,GAAA;AAAA,KACpB;AAAA,IACA,CAAC,MAAQ,EAAA,KAAA,EAAO,MAAM;AAAA,GACxB;AAEA,EAAM,MAAA,aAAA,GAAgB,YAAY,MAAM;AACtC,IAAO,MAAA,CAAA,mBAAA,CAAoB,WAAa,EAAA,eAAA,EAAiB,KAAK,CAAA;AAC9D,IAAO,MAAA,CAAA,mBAAA,CAAoB,SAAW,EAAA,aAAA,EAAe,KAAK,CAAA;AAC1D,IAAU,SAAA,EAAA;AACV,IAAA,SAAA,CAAU,KAAK,CAAA;AACf,IAAA,OAAA,CAAQ,SAAS,KAAM,EAAA;AAAA,GACtB,EAAA,CAAC,eAAiB,EAAA,SAAA,EAAW,SAAS,CAAC,CAAA;AAE1C,EAAA,MAAM,eAAkB,GAAA,WAAA;AAAA,IACtB,CAAC,CAAM,KAAA;AACL,MAAA,OAAA,CAAQ,OAAU,GAAA,MAAA,GAAS,CAAE,CAAA,OAAA,GAAU,CAAE,CAAA,OAAA;AACzC,MAAA,WAAA,CAAY,KAAK,CAAA;AACjB,MAAO,MAAA,CAAA,gBAAA,CAAiB,WAAa,EAAA,eAAA,EAAiB,KAAK,CAAA;AAC3D,MAAO,MAAA,CAAA,gBAAA,CAAiB,SAAW,EAAA,aAAA,EAAe,KAAK,CAAA;AACvD,MAAA,CAAA,CAAE,cAAe,EAAA;AACjB,MAAA,SAAA,CAAU,IAAI,CAAA;AAAA,KAChB;AAAA,IACA,CAAC,MAAQ,EAAA,eAAA,EAAiB,aAAe,EAAA,KAAA,EAAO,aAAa,SAAS;AAAA,GACxE;AAEA,EAAA,MAAM,cAAc,MAAM;AACxB,IAAA,IAAI,YAAY,OAAS,EAAA;AACvB,MAAA,WAAA,CAAY,OAAU,GAAA,KAAA;AAAA,KACjB,MAAA;AACL,MAAA,OAAA,CAAQ,SAAS,KAAM,EAAA;AAAA;AACzB,GACF;AAEA,EAAA,MAAM,aAAa,MAAM;AACvB,IAAA,iBAAA,CAAkB,OAAU,GAAA,qBAAA;AAAA,GAC9B;AAEA,EAAM,MAAA,SAAA,GAAY,GAAG,SAAW,EAAA;AAAA,IAC9B,CAAC,CAAA,EAAG,SAAS,CAAA,OAAA,CAAS,GAAG,MAAA;AAAA,IACzB,CAAC,CAAA,EAAG,SAAS,CAAA,OAAA,CAAS,GAAG;AAAA,GAC1B,CAAA;AACD,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA;AAAA,MACA,eAAa,EAAA,IAAA;AAAA,MACb,GAAK,EAAA,OAAA;AAAA,MACL,IAAK,EAAA,WAAA;AAAA,MACL,KAAA;AAAA,MACA,MAAQ,EAAA,UAAA;AAAA,MACR,OAAS,EAAA,WAAA;AAAA,MACT,SAAW,EAAA,aAAA;AAAA,MACX,WAAa,EAAA,eAAA;AAAA,MACb,QAAU,EAAA,CAAA;AAAA,MAEV,QAAC,kBAAA,GAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,CAAA,EAAG,SAAS,CAAc,UAAA,CAAA,EAAA;AAAA;AAAA,GAC5C;AAEJ,CAAC;;;;"}

package/esm/flexbox/flexbox-utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"flexbox-utils.js","sources":["../../src/flexbox/flexbox-utils.ts"],"sourcesContent":["import { ReactElement } from \"react\";\nimport {\n  getIntrinsicSize,\n  hasUnboundedFlexStyle,\n} from \"../layout-reducer/flexUtils\";\nimport { getProp } from \"../utils\";\nimport type { BreakPoint, ContentMeta } from \"./flexboxTypes\";\n\nconst NO_INTRINSIC_SIZE: {\n  height?: number;\n  width?: number;\n} = {};\n\nexport const SPLITTER = 1;\nexport const PLACEHOLDER = 2;\n\nconst isIntrinsicallySized = (item: ContentMeta) =>\n  typeof item.intrinsicSize === \"number\";\n\nconst getBreakPointValues = (\n  breakPoints: BreakPoint[],\n  component: ReactElement\n) => {\n  const values: { [key: string]: number | undefined } = {};\n  breakPoints.forEach((breakPoint) => {\n    values[breakPoint] = getProp(component, breakPoint);\n  });\n  return values;\n};\n\nexport const gatherChildMeta = (\n  children: ReactElement[],\n  dimension: \"width\" | \"height\",\n  breakPoints?: BreakPoint[]\n) => {\n  return children.map((child, index) => {\n    const resizeable = getProp(child, \"resizeable\");\n    const { [dimension]: intrinsicSize } =\n      getIntrinsicSize(child) ?? NO_INTRINSIC_SIZE;\n    const flexOpen = hasUnboundedFlexStyle(child);\n    if (breakPoints) {\n      return {\n        index,\n        flexOpen,\n        intrinsicSize,\n        resizeable,\n        ...getBreakPointValues(breakPoints, child),\n      };\n    } else {\n      return { index, flexOpen, intrinsicSize, resizeable };\n    }\n  });\n};\n\n// Splitters are inserted AFTER the associated index, so\n// never a splitter in last position.\n// Placeholder goes before (first) OR after(last) index\nexport const findSplitterAndPlaceholderPositions = (\n  childMeta: ContentMeta[]\n) => {\n  const count = childMeta.length;\n  const allIntrinsic = childMeta.every(isIntrinsicallySized);\n  const splitterPositions = Array(count).fill(0);\n  if (allIntrinsic && count > 0) {\n    splitterPositions[0] = PLACEHOLDER;\n    splitterPositions[count - 1] = PLACEHOLDER;\n  }\n  if (count < 2) {\n    return splitterPositions;\n  } else {\n    // 1) From the left, check each item.\n    // Once we hit a resizable item, set this index and all subsequent indices,\n    // except for last, to SPLITTER\n    for (let i = 0, resizeablesLeft = 0; i < count - 1; i++) {\n      if (childMeta[i].resizeable && !resizeablesLeft) {\n        resizeablesLeft = SPLITTER;\n      }\n      splitterPositions[i] += resizeablesLeft;\n    }\n    // 2) Now check from the right. Undo splitter insertion until we reach a point\n    // where there is a resizeable to our right.\n    for (let i = count - 1; i > 0; i--) {\n      if (splitterPositions[i] & SPLITTER) {\n        splitterPositions[i] -= SPLITTER;\n      }\n      if (childMeta[i].resizeable) {\n        break;\n      }\n    }\n    return splitterPositions;\n  }\n};\n\nexport const identifyResizeParties = (\n  contentMeta: ContentMeta[],\n  idx: number\n) => {\n  const idx1 = getLeadingResizeablePos(contentMeta, idx);\n  const idx2 = getTrailingResizeablePos(contentMeta, idx);\n  const participants = idx1 !== -1 && idx2 !== -1 ? [idx1, idx2] : undefined;\n  const bystanders = identifyResizeBystanders(contentMeta, participants);\n  return [participants, bystanders];\n};\n\nfunction identifyResizeBystanders(\n  contentMeta: ContentMeta[],\n  participants?: number[]\n) {\n  if (participants) {\n    const bystanders = [];\n    for (let i = 0; i < contentMeta.length; i++) {\n      if (contentMeta[i].flexOpen && !participants.includes(i)) {\n        bystanders.push(i);\n      }\n    }\n    return bystanders;\n  }\n}\n\nfunction getLeadingResizeablePos(contentMeta: ContentMeta[], idx: number) {\n  let pos = idx,\n    resizeable = false;\n  while (pos >= 1 && !resizeable) {\n    pos = pos - 1;\n    resizeable = isResizeable(contentMeta, pos);\n  }\n  return pos;\n}\n\nfunction getTrailingResizeablePos(contentMeta: ContentMeta[], idx: number) {\n  let pos = idx,\n    resizeable = false;\n  const count = contentMeta.length;\n  while (pos < count - 1 && !resizeable) {\n    pos = pos + 1;\n    resizeable = isResizeable(contentMeta, pos);\n  }\n  return pos === count ? -1 : pos;\n}\n\nfunction isResizeable(contentMeta: ContentMeta[], idx: number): boolean {\n  const { placeholder, splitter, resizeable, intrinsicSize } = contentMeta[idx];\n  return Boolean(!splitter && !intrinsicSize && (placeholder || resizeable));\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"flexbox-utils.js","sources":["../../src/flexbox/flexbox-utils.ts"],"sourcesContent":["import { ReactElement } from \"react\";\nimport {\n  getIntrinsicSize,\n  hasUnboundedFlexStyle,\n} from \"../layout-reducer/flexUtils\";\nimport { getProp } from \"../utils\";\nimport type { BreakPoint, ContentMeta } from \"./flexboxTypes\";\n\nconst NO_INTRINSIC_SIZE: {\n  height?: number;\n  width?: number;\n} = {};\n\nexport const SPLITTER = 1;\nexport const PLACEHOLDER = 2;\n\nconst isIntrinsicallySized = (item: ContentMeta) =>\n  typeof item.intrinsicSize === \"number\";\n\nconst getBreakPointValues = (\n  breakPoints: BreakPoint[],\n  component: ReactElement\n) => {\n  const values: { [key: string]: number | undefined } = {};\n  breakPoints.forEach((breakPoint) => {\n    values[breakPoint] = getProp(component, breakPoint);\n  });\n  return values;\n};\n\nexport const gatherChildMeta = (\n  children: ReactElement[],\n  dimension: \"width\" | \"height\",\n  breakPoints?: BreakPoint[]\n) => {\n  return children.map((child, index) => {\n    const resizeable = getProp(child, \"resizeable\");\n    const { [dimension]: intrinsicSize } =\n      getIntrinsicSize(child) ?? NO_INTRINSIC_SIZE;\n    const flexOpen = hasUnboundedFlexStyle(child);\n    if (breakPoints) {\n      return {\n        index,\n        flexOpen,\n        intrinsicSize,\n        resizeable,\n        ...getBreakPointValues(breakPoints, child),\n      };\n    } else {\n      return { index, flexOpen, intrinsicSize, resizeable };\n    }\n  });\n};\n\n// Splitters are inserted AFTER the associated index, so\n// never a splitter in last position.\n// Placeholder goes before (first) OR after(last) index\nexport const findSplitterAndPlaceholderPositions = (\n  childMeta: ContentMeta[]\n) => {\n  const count = childMeta.length;\n  const allIntrinsic = childMeta.every(isIntrinsicallySized);\n  const splitterPositions = Array(count).fill(0);\n  if (allIntrinsic && count > 0) {\n    splitterPositions[0] = PLACEHOLDER;\n    splitterPositions[count - 1] = PLACEHOLDER;\n  }\n  if (count < 2) {\n    return splitterPositions;\n  } else {\n    // 1) From the left, check each item.\n    // Once we hit a resizable item, set this index and all subsequent indices,\n    // except for last, to SPLITTER\n    for (let i = 0, resizeablesLeft = 0; i < count - 1; i++) {\n      if (childMeta[i].resizeable && !resizeablesLeft) {\n        resizeablesLeft = SPLITTER;\n      }\n      splitterPositions[i] += resizeablesLeft;\n    }\n    // 2) Now check from the right. Undo splitter insertion until we reach a point\n    // where there is a resizeable to our right.\n    for (let i = count - 1; i > 0; i--) {\n      if (splitterPositions[i] & SPLITTER) {\n        splitterPositions[i] -= SPLITTER;\n      }\n      if (childMeta[i].resizeable) {\n        break;\n      }\n    }\n    return splitterPositions;\n  }\n};\n\nexport const identifyResizeParties = (\n  contentMeta: ContentMeta[],\n  idx: number\n) => {\n  const idx1 = getLeadingResizeablePos(contentMeta, idx);\n  const idx2 = getTrailingResizeablePos(contentMeta, idx);\n  const participants = idx1 !== -1 && idx2 !== -1 ? [idx1, idx2] : undefined;\n  const bystanders = identifyResizeBystanders(contentMeta, participants);\n  return [participants, bystanders];\n};\n\nfunction identifyResizeBystanders(\n  contentMeta: ContentMeta[],\n  participants?: number[]\n) {\n  if (participants) {\n    const bystanders = [];\n    for (let i = 0; i < contentMeta.length; i++) {\n      if (contentMeta[i].flexOpen && !participants.includes(i)) {\n        bystanders.push(i);\n      }\n    }\n    return bystanders;\n  }\n}\n\nfunction getLeadingResizeablePos(contentMeta: ContentMeta[], idx: number) {\n  let pos = idx,\n    resizeable = false;\n  while (pos >= 1 && !resizeable) {\n    pos = pos - 1;\n    resizeable = isResizeable(contentMeta, pos);\n  }\n  return pos;\n}\n\nfunction getTrailingResizeablePos(contentMeta: ContentMeta[], idx: number) {\n  let pos = idx,\n    resizeable = false;\n  const count = contentMeta.length;\n  while (pos < count - 1 && !resizeable) {\n    pos = pos + 1;\n    resizeable = isResizeable(contentMeta, pos);\n  }\n  return pos === count ? -1 : pos;\n}\n\nfunction isResizeable(contentMeta: ContentMeta[], idx: number): boolean {\n  const { placeholder, splitter, resizeable, intrinsicSize } = contentMeta[idx];\n  return Boolean(!splitter && !intrinsicSize && (placeholder || resizeable));\n}\n"],"names":[],"mappings":"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"}

package/esm/flexbox/useResponsiveSizing.js.map

@@ -1 +1 @@
-{"version":3,"file":"useResponsiveSizing.js","sources":["../../src/flexbox/useResponsiveSizing.ts"],"sourcesContent":["import { getUniqueId } from \"@vuu-ui/vuu-utils\";\nimport {\n  cloneElement,\n  CSSProperties,\n  isValidElement,\n  ReactElement,\n  useCallback,\n  useMemo,\n  useRef,\n} from \"react\";\nimport { gatherChildMeta } from \"./flexbox-utils\";\nimport { BreakPoint } from \"./flexboxTypes\";\n\nconst breakPoints: BreakPoint[] = [\"xs\", \"sm\", \"md\", \"lg\", \"xl\"];\n\nconst DEFAULT_COLS = 12;\n\nexport const useResponsiveSizing = ({\n  children: childrenProp,\n  cols: colsProp,\n  style,\n}: {\n  children: ReactElement[];\n  cols?: number;\n  style?: CSSProperties;\n}) => {\n  const rootRef = useRef(null);\n  const metaRef = useRef(null);\n  const contentRef = useRef<ReactElement[]>();\n  const cols = colsProp ?? DEFAULT_COLS;\n\n  const isColumn = style?.flexDirection === \"column\";\n  const dimension = isColumn ? \"height\" : \"width\";\n\n  const children = useMemo(\n    () =>\n      Array.isArray(childrenProp)\n        ? childrenProp\n        : isValidElement(childrenProp)\n          ? [childrenProp]\n          : [],\n    [childrenProp],\n  );\n\n  const buildContent = useCallback(\n    (children, dimension): [ReactElement[], any] => {\n      const childMeta = gatherChildMeta(children, dimension, breakPoints);\n      const content = [];\n      const meta = [];\n      for (let i = 0; i < children.length; i++) {\n        const child = children[i];\n        const {\n          style: { flex, ...rest },\n        } = child.props;\n        content.push(\n          cloneElement(child, {\n            key: getUniqueId(),\n            style: {\n              ...rest,\n              \"--parent-col-count\": cols,\n            },\n          }),\n        );\n        meta.push(childMeta[i]);\n      }\n      return [content, meta];\n    },\n    [cols],\n  );\n\n  useMemo(() => {\n    const [content, meta] = buildContent(children, dimension);\n    metaRef.current = meta;\n    contentRef.current = content;\n  }, [buildContent, children, dimension]);\n\n  return {\n    cols,\n    content: contentRef.current,\n    rootRef,\n  };\n};\n"],"names":["children","dimension"],"mappings":";;;;AAaA,MAAM,cAA4B,CAAC,IAAA,EAAM,IAAM,EAAA,IAAA,EAAM,MAAM,IAAI,CAAA,CAAA;AAE/D,MAAM,YAAe,GAAA,EAAA,CAAA;AAEd,MAAM,sBAAsB,CAAC;AAAA,EAClC,QAAU,EAAA,YAAA;AAAA,EACV,IAAM,EAAA,QAAA;AAAA,EACN,KAAA;AACF,CAIM,KAAA;AACJ,EAAM,MAAA,OAAA,GAAU,OAAO,IAAI,CAAA,CAAA;AAC3B,EAAM,MAAA,OAAA,GAAU,OAAO,IAAI,CAAA,CAAA;AAC3B,EAAA,MAAM,aAAa,MAAuB,EAAA,CAAA;AAC1C,EAAA,MAAM,OAAO,QAAY,IAAA,YAAA,CAAA;AAEzB,EAAM,MAAA,QAAA,GAAW,OAAO,aAAkB,KAAA,QAAA,CAAA;AAC1C,EAAM,MAAA,SAAA,GAAY,WAAW,QAAW,GAAA,OAAA,CAAA;AAExC,EAAA,MAAM,QAAW,GAAA,OAAA;AAAA,IACf,MACE,KAAA,CAAM,OAAQ,CAAA,YAAY,CACtB,GAAA,YAAA,GACA,cAAe,CAAA,YAAY,CACzB,GAAA,CAAC,YAAY,CAAA,GACb,EAAC;AAAA,IACT,CAAC,YAAY,CAAA;AAAA,GACf,CAAA;AAEA,EAAA,MAAM,YAAe,GAAA,WAAA;AAAA,IACnB,CAACA,WAAUC,UAAqC,KAAA;AAC9C,MAAA,MAAM,SAAY,GAAA,eAAA,CAAgBD,SAAUC,EAAAA,UAAAA,EAAW,WAAW,CAAA,CAAA;AAClE,MAAA,MAAM,UAAU,EAAC,CAAA;AACjB,MAAA,MAAM,OAAO,EAAC,CAAA;AACd,MAAA,KAAA,IAAS,CAAI,GAAA,CAAA,EAAG,CAAID,GAAAA,SAAAA,CAAS,QAAQ,CAAK,EAAA,EAAA;AACxC,QAAM,MAAA,KAAA,GAAQA,UAAS,CAAC,CAAA,CAAA;AACxB,QAAM,MAAA;AAAA,UACJ,KAAO,EAAA,EAAE,IAAM,EAAA,GAAG,IAAK,EAAA;AAAA,YACrB,KAAM,CAAA,KAAA,CAAA;AACV,QAAQ,OAAA,CAAA,IAAA;AAAA,UACN,aAAa,KAAO,EAAA;AAAA,YAClB,KAAK,WAAY,EAAA;AAAA,YACjB,KAAO,EAAA;AAAA,cACL,GAAG,IAAA;AAAA,cACH,oBAAsB,EAAA,IAAA;AAAA,aACxB;AAAA,WACD,CAAA;AAAA,SACH,CAAA;AACA,QAAK,IAAA,CAAA,IAAA,CAAK,SAAU,CAAA,CAAC,CAAC,CAAA,CAAA;AAAA,OACxB;AACA,MAAO,OAAA,CAAC,SAAS,IAAI,CAAA,CAAA;AAAA,KACvB;AAAA,IACA,CAAC,IAAI,CAAA;AAAA,GACP,CAAA;AAEA,EAAA,OAAA,CAAQ,MAAM;AACZ,IAAA,MAAM,CAAC,OAAS,EAAA,IAAI,CAAI,GAAA,YAAA,CAAa,UAAU,SAAS,CAAA,CAAA;AACxD,IAAA,OAAA,CAAQ,OAAU,GAAA,IAAA,CAAA;AAClB,IAAA,UAAA,CAAW,OAAU,GAAA,OAAA,CAAA;AAAA,GACpB,EAAA,CAAC,YAAc,EAAA,QAAA,EAAU,SAAS,CAAC,CAAA,CAAA;AAEtC,EAAO,OAAA;AAAA,IACL,IAAA;AAAA,IACA,SAAS,UAAW,CAAA,OAAA;AAAA,IACpB,OAAA;AAAA,GACF,CAAA;AACF;;;;"}
+{"version":3,"file":"useResponsiveSizing.js","sources":["../../src/flexbox/useResponsiveSizing.ts"],"sourcesContent":["import { getUniqueId } from \"@vuu-ui/vuu-utils\";\nimport {\n  cloneElement,\n  CSSProperties,\n  isValidElement,\n  ReactElement,\n  useCallback,\n  useMemo,\n  useRef,\n} from \"react\";\nimport { gatherChildMeta } from \"./flexbox-utils\";\nimport { BreakPoint } from \"./flexboxTypes\";\n\nconst breakPoints: BreakPoint[] = [\"xs\", \"sm\", \"md\", \"lg\", \"xl\"];\n\nconst DEFAULT_COLS = 12;\n\nexport const useResponsiveSizing = ({\n  children: childrenProp,\n  cols: colsProp,\n  style,\n}: {\n  children: ReactElement[];\n  cols?: number;\n  style?: CSSProperties;\n}) => {\n  const rootRef = useRef(null);\n  const metaRef = useRef(null);\n  const contentRef = useRef<ReactElement[]>();\n  const cols = colsProp ?? DEFAULT_COLS;\n\n  const isColumn = style?.flexDirection === \"column\";\n  const dimension = isColumn ? \"height\" : \"width\";\n\n  const children = useMemo(\n    () =>\n      Array.isArray(childrenProp)\n        ? childrenProp\n        : isValidElement(childrenProp)\n          ? [childrenProp]\n          : [],\n    [childrenProp],\n  );\n\n  const buildContent = useCallback(\n    (children, dimension): [ReactElement[], any] => {\n      const childMeta = gatherChildMeta(children, dimension, breakPoints);\n      const content = [];\n      const meta = [];\n      for (let i = 0; i < children.length; i++) {\n        const child = children[i];\n        const {\n          style: { flex, ...rest },\n        } = child.props;\n        content.push(\n          cloneElement(child, {\n            key: getUniqueId(),\n            style: {\n              ...rest,\n              \"--parent-col-count\": cols,\n            },\n          }),\n        );\n        meta.push(childMeta[i]);\n      }\n      return [content, meta];\n    },\n    [cols],\n  );\n\n  useMemo(() => {\n    const [content, meta] = buildContent(children, dimension);\n    metaRef.current = meta;\n    contentRef.current = content;\n  }, [buildContent, children, dimension]);\n\n  return {\n    cols,\n    content: contentRef.current,\n    rootRef,\n  };\n};\n"],"names":["children","dimension"],"mappings":";;;;AAaA,MAAM,cAA4B,CAAC,IAAA,EAAM,IAAM,EAAA,IAAA,EAAM,MAAM,IAAI,CAAA;AAE/D,MAAM,YAAe,GAAA,EAAA;AAEd,MAAM,sBAAsB,CAAC;AAAA,EAClC,QAAU,EAAA,YAAA;AAAA,EACV,IAAM,EAAA,QAAA;AAAA,EACN;AACF,CAIM,KAAA;AACJ,EAAM,MAAA,OAAA,GAAU,OAAO,IAAI,CAAA;AAC3B,EAAM,MAAA,OAAA,GAAU,OAAO,IAAI,CAAA;AAC3B,EAAA,MAAM,aAAa,MAAuB,EAAA;AAC1C,EAAA,MAAM,OAAO,QAAY,IAAA,YAAA;AAEzB,EAAM,MAAA,QAAA,GAAW,OAAO,aAAkB,KAAA,QAAA;AAC1C,EAAM,MAAA,SAAA,GAAY,WAAW,QAAW,GAAA,OAAA;AAExC,EAAA,MAAM,QAAW,GAAA,OAAA;AAAA,IACf,MACE,KAAA,CAAM,OAAQ,CAAA,YAAY,CACtB,GAAA,YAAA,GACA,cAAe,CAAA,YAAY,CACzB,GAAA,CAAC,YAAY,CAAA,GACb,EAAC;AAAA,IACT,CAAC,YAAY;AAAA,GACf;AAEA,EAAA,MAAM,YAAe,GAAA,WAAA;AAAA,IACnB,CAACA,WAAUC,UAAqC,KAAA;AAC9C,MAAA,MAAM,SAAY,GAAA,eAAA,CAAgBD,SAAUC,EAAAA,UAAAA,EAAW,WAAW,CAAA;AAClE,MAAA,MAAM,UAAU,EAAC;AACjB,MAAA,MAAM,OAAO,EAAC;AACd,MAAA,KAAA,IAAS,CAAI,GAAA,CAAA,EAAG,CAAID,GAAAA,SAAAA,CAAS,QAAQ,CAAK,EAAA,EAAA;AACxC,QAAM,MAAA,KAAA,GAAQA,UAAS,CAAC,CAAA;AACxB,QAAM,MAAA;AAAA,UACJ,KAAO,EAAA,EAAE,IAAM,EAAA,GAAG,IAAK;AAAA,YACrB,KAAM,CAAA,KAAA;AACV,QAAQ,OAAA,CAAA,IAAA;AAAA,UACN,aAAa,KAAO,EAAA;AAAA,YAClB,KAAK,WAAY,EAAA;AAAA,YACjB,KAAO,EAAA;AAAA,cACL,GAAG,IAAA;AAAA,cACH,oBAAsB,EAAA;AAAA;AACxB,WACD;AAAA,SACH;AACA,QAAK,IAAA,CAAA,IAAA,CAAK,SAAU,CAAA,CAAC,CAAC,CAAA;AAAA;AAExB,MAAO,OAAA,CAAC,SAAS,IAAI,CAAA;AAAA,KACvB;AAAA,IACA,CAAC,IAAI;AAAA,GACP;AAEA,EAAA,OAAA,CAAQ,MAAM;AACZ,IAAA,MAAM,CAAC,OAAS,EAAA,IAAI,CAAI,GAAA,YAAA,CAAa,UAAU,SAAS,CAAA;AACxD,IAAA,OAAA,CAAQ,OAAU,GAAA,IAAA;AAClB,IAAA,UAAA,CAAW,OAAU,GAAA,OAAA;AAAA,GACpB,EAAA,CAAC,YAAc,EAAA,QAAA,EAAU,SAAS,CAAC,CAAA;AAEtC,EAAO,OAAA;AAAA,IACL,IAAA;AAAA,IACA,SAAS,UAAW,CAAA,OAAA;AAAA,IACpB;AAAA,GACF;AACF;;;;"}

package/esm/flexbox/useSplitterResizing.js

@@ -51,6 +51,9 @@ const useSplitterResizing = ({
               }
             });
           }
+          if (rootRef.current) {
+            rootRef.current.classList.add("vuuSplitterResizing");
+          }
         }
       }
     },
@@ -75,6 +78,9 @@ const useSplitterResizing = ({
     const contentMeta = metaRef.current;
     if (contentMeta) {
       onSplitterMoved?.(contentMeta.filter(originalContentOnly));
+      if (rootRef.current) {
+        rootRef.current.classList.remove("vuuSplitterResizing");
+      }
     }
     contentMeta?.forEach((meta) => {
       meta.currentSize = void 0;

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, {\n  ReactElement,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n} 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 metaRef = useRef<ContentMeta[]>();\n  const contentRef = useRef<ReactElement[]>();\n  const assignedKeys = useRef([]);\n  const [, forceUpdate] = useState({});\n\n  const setContent = (content: ReactElement[]) => {\n    contentRef.current = content;\n    forceUpdate({});\n  };\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) => {\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      }\n    },\n    [dimension],\n  );\n\n  const handleDrag = useCallback(\n    (idx, distance) => {\n      if (contentRef.current && metaRef.current) {\n        setContent(\n          resizeContent(\n            contentRef.current,\n            metaRef.current,\n            distance,\n            dimension,\n          ),\n        );\n      }\n    },\n    [dimension],\n  );\n\n  const handleDragEnd = useCallback(() => {\n    const contentMeta = metaRef.current;\n    if (contentMeta) {\n      onSplitterMoved?.(contentMeta.filter(originalContentOnly));\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: any[],\n): [any[], 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 resizeContent(\n  content: ReactElement[],\n  contentMeta: ContentMeta[],\n  distance: number,\n  dimension: \"width\" | \"height\",\n) {\n  const metaUpdated = updateMeta(contentMeta, distance);\n  if (!metaUpdated) {\n    return content;\n  }\n\n  return content.map((child, idx) => {\n    const meta = contentMeta[idx];\n    const { currentSize, flexOpen, flexBasis } = meta;\n    const hasCurrentSize = currentSize !== undefined;\n    if (hasCurrentSize || flexOpen) {\n      const { flexBasis: actualFlexBasis } = child.props.style || {};\n      const size = hasCurrentSize ? meta.currentSize : flexBasis;\n      if (size !== actualFlexBasis) {\n        return React.cloneElement(child, {\n          style: {\n            ...child.props.style,\n            flexBasis: size,\n            [dimension]: \"auto\",\n          },\n        });\n      } else {\n        return child;\n      }\n    } else {\n      return child;\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  } as any);\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, {\n  ReactElement,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n} 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 metaRef = useRef<ContentMeta[]>();\n  const contentRef = useRef<ReactElement[]>();\n  const assignedKeys = useRef([]);\n  const [, forceUpdate] = useState({});\n\n  const setContent = (content: ReactElement[]) => {\n    contentRef.current = content;\n    forceUpdate({});\n  };\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) => {\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          }\n        }\n      }\n    },\n    [dimension],\n  );\n\n  const handleDrag = useCallback(\n    (idx, distance) => {\n      if (contentRef.current && metaRef.current) {\n        setContent(\n          resizeContent(\n            contentRef.current,\n            metaRef.current,\n            distance,\n            dimension,\n          ),\n        );\n      }\n    },\n    [dimension],\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: any[],\n): [any[], 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 resizeContent(\n  content: ReactElement[],\n  contentMeta: ContentMeta[],\n  distance: number,\n  dimension: \"width\" | \"height\",\n) {\n  const metaUpdated = updateMeta(contentMeta, distance);\n  if (!metaUpdated) {\n    return content;\n  }\n\n  return content.map((child, idx) => {\n    const meta = contentMeta[idx];\n    const { currentSize, flexOpen, flexBasis } = meta;\n    const hasCurrentSize = currentSize !== undefined;\n    if (hasCurrentSize || flexOpen) {\n      const { flexBasis: actualFlexBasis } = child.props.style || {};\n      const size = hasCurrentSize ? meta.currentSize : flexBasis;\n      if (size !== actualFlexBasis) {\n        return React.cloneElement(child, {\n          style: {\n            ...child.props.style,\n            flexBasis: size,\n            [dimension]: \"auto\",\n          },\n        });\n      } else {\n        return child;\n      }\n    } else {\n      return child;\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  } as any);\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/layout-action.js.map

@@ -1 +1 @@
-{"version":3,"file":"layout-action.js","sources":["../src/layout-action.ts"],"sourcesContent":["export const Action = {\n  ADD: \"add\",\n  BLUR: \"blur\",\n  BLUR_SPLITTER: \"blur-splitter\",\n  DRAG_START: \"drag-start\",\n  DRAG_STARTED: \"drag-started\",\n  DRAG_DROP: \"drag-drop\",\n  FOCUS: \"focus\",\n  FOCUS_SPLITTER: \"focus-splitter\",\n  INITIALIZE: \"initialize\",\n  LAYOUT_RESIZE: \"layout-resize\",\n  MAXIMIZE: \"maximize\",\n  MINIMIZE: \"minimize\",\n  REMOVE: \"remove\",\n  REPLACE: \"replace\",\n  RESTORE: \"restore\",\n  SAVE: \"save\",\n  SPLITTER_RESIZE: \"splitter-resize\",\n};\n"],"names":[],"mappings":"AAAO,MAAM,MAAS,GAAA;AAAA,EACpB,GAAK,EAAA,KAAA;AAAA,EACL,IAAM,EAAA,MAAA;AAAA,EACN,aAAe,EAAA,eAAA;AAAA,EACf,UAAY,EAAA,YAAA;AAAA,EACZ,YAAc,EAAA,cAAA;AAAA,EACd,SAAW,EAAA,WAAA;AAAA,EACX,KAAO,EAAA,OAAA;AAAA,EACP,cAAgB,EAAA,gBAAA;AAAA,EAChB,UAAY,EAAA,YAAA;AAAA,EACZ,aAAe,EAAA,eAAA;AAAA,EACf,QAAU,EAAA,UAAA;AAAA,EACV,QAAU,EAAA,UAAA;AAAA,EACV,MAAQ,EAAA,QAAA;AAAA,EACR,OAAS,EAAA,SAAA;AAAA,EACT,OAAS,EAAA,SAAA;AAAA,EACT,IAAM,EAAA,MAAA;AAAA,EACN,eAAiB,EAAA,iBAAA;AACnB;;;;"}
+{"version":3,"file":"layout-action.js","sources":["../src/layout-action.ts"],"sourcesContent":["export const Action = {\n  ADD: \"add\",\n  BLUR: \"blur\",\n  BLUR_SPLITTER: \"blur-splitter\",\n  DRAG_START: \"drag-start\",\n  DRAG_STARTED: \"drag-started\",\n  DRAG_DROP: \"drag-drop\",\n  FOCUS: \"focus\",\n  FOCUS_SPLITTER: \"focus-splitter\",\n  INITIALIZE: \"initialize\",\n  LAYOUT_RESIZE: \"layout-resize\",\n  MAXIMIZE: \"maximize\",\n  MINIMIZE: \"minimize\",\n  REMOVE: \"remove\",\n  REPLACE: \"replace\",\n  RESTORE: \"restore\",\n  SAVE: \"save\",\n  SPLITTER_RESIZE: \"splitter-resize\",\n};\n"],"names":[],"mappings":"AAAO,MAAM,MAAS,GAAA;AAAA,EACpB,GAAK,EAAA,KAAA;AAAA,EACL,IAAM,EAAA,MAAA;AAAA,EACN,aAAe,EAAA,eAAA;AAAA,EACf,UAAY,EAAA,YAAA;AAAA,EACZ,YAAc,EAAA,cAAA;AAAA,EACd,SAAW,EAAA,WAAA;AAAA,EACX,KAAO,EAAA,OAAA;AAAA,EACP,cAAgB,EAAA,gBAAA;AAAA,EAChB,UAAY,EAAA,YAAA;AAAA,EACZ,aAAe,EAAA,eAAA;AAAA,EACf,QAAU,EAAA,UAAA;AAAA,EACV,QAAU,EAAA,UAAA;AAAA,EACV,MAAQ,EAAA,QAAA;AAAA,EACR,OAAS,EAAA,SAAA;AAAA,EACT,OAAS,EAAA,SAAA;AAAA,EACT,IAAM,EAAA,MAAA;AAAA,EACN,eAAiB,EAAA;AACnB;;;;"}

package/esm/layout-header/Header.js

@@ -1,10 +1,10 @@
 import { jsx } from 'react/jsx-runtime';
-import { EditableLabel, IconButton } from '@vuu-ui/vuu-ui-controls';
+import { IconButton, EditableLabel } from '@vuu-ui/vuu-ui-controls';
 import { useComponentCssInjection } from '@salt-ds/styles';
 import { useWindow } from '@salt-ds/window';
 import cx from 'clsx';
-import { useRef, useState, useCallback, cloneElement } from 'react';
-import { useViewDispatch } from '../layout-view-actions/ViewContext.js';
+import { cloneElement } from 'react';
+import { useHeader } from './useHeader.js';
 import headerCss from './Header.css.js';
 
 const classBase = "vuuHeader";
@@ -14,7 +14,9 @@ const Header = ({
   contributions,
   collapsed,
   closeable,
+  onCollapse,
   onEditTitle,
+  onExpand,
   orientation: orientationProp = "horizontal",
   style,
   title = "Untitled"
@@ -25,46 +27,34 @@ const Header = ({
     css: headerCss,
     window: targetWindow
   });
-  const labelFieldRef = useRef(null);
-  const [value, setValue] = useState(title);
-  const [editing, setEditing] = useState(false);
-  const viewDispatch = useViewDispatch();
-  const handleClose = (evt) => viewDispatch?.({ type: "remove" }, evt);
-  const focusTitle = useCallback(() => {
-    labelFieldRef.current?.focus();
-  }, []);
-  const handleClickEdit = useCallback(() => {
-    focusTitle();
-    setEditing((isEditing) => !isEditing);
-  }, [focusTitle]);
+  const {
+    editing,
+    focusTitle,
+    labelFieldRef,
+    onClickEdit,
+    onClose,
+    onExitEditMode,
+    onMouseDown,
+    onTitleKeyDown,
+    onToggleCollapse,
+    onToggleExpand,
+    setValue,
+    value
+  } = useHeader({
+    onCollapse,
+    onEditTitle,
+    onExpand,
+    title
+  });
   const handleButtonMouseDown = (evt) => {
     evt.stopPropagation();
   };
   const orientation = collapsed || orientationProp;
   const className = cx(classBase, classNameProp, `${classBase}-${orientation}`);
-  const handleTitleKeyDown = (evt) => {
-    if (evt.key === "Enter") {
-      setEditing(true);
-    }
-  };
-  const handleExitEditMode = (originalValue = "", finalValue = "", allowDeactivation = true, editCancelled = false) => {
-    setEditing(false);
-    if (editCancelled) {
-      setValue(originalValue);
-    } else if (finalValue !== originalValue) {
-      setValue(finalValue);
-      onEditTitle?.(finalValue);
-    }
-    if (allowDeactivation === false) {
-      labelFieldRef.current?.focus();
-    }
-  };
-  const handleMouseDown = (e) => {
-    viewDispatch?.({ type: "mousedown" }, e);
-  };
   const toolbarItems = [];
   const postTitleContributedItems = [];
   const actionButtons = [];
+  const allowCollapse = typeof collapsed === "boolean" || typeof collapsed === "string";
   contributions?.forEach((contribution, i) => {
     switch (contribution.location) {
       case "pre-title":
@@ -76,6 +66,24 @@ const Header = ({
         );
     }
   });
+  allowCollapse && toolbarItems.push(
+    /* @__PURE__ */ jsx(
+      IconButton,
+      {
+        className: cx(`${classBase}-toggle`, {
+          [`${classBase}-collapsed`]: collapsed
+        }),
+        "data-embedded": true,
+        icon: collapsed ? "chevron-open" : "chevron-down",
+        onClick: collapsed ? onToggleExpand : onToggleCollapse,
+        size: 20,
+        tabIndex: 0,
+        appearance: "transparent",
+        sentiment: "neutral"
+      },
+      "collapse-button"
+    )
+  );
   title && toolbarItems.push(
     /* @__PURE__ */ jsx(
       EditableLabel,
@@ -85,8 +93,8 @@ const Header = ({
         value,
         onChange: setValue,
         onMouseDownCapture: focusTitle,
-        onExitEditMode: handleExitEditMode,
-        onKeyDown: handleTitleKeyDown,
+        onExitEditMode,
+        onKeyDown: onTitleKeyDown,
         ref: labelFieldRef
       },
       "title"
@@ -99,7 +107,7 @@ const Header = ({
         className: `${classBase}-edit`,
         "data-embedded": true,
         icon: "edit",
-        onClick: handleClickEdit,
+        onClick: onClickEdit,
         onMouseDown: handleButtonMouseDown,
         tabIndex: 0,
         variant: "secondary"
@@ -111,11 +119,12 @@ const Header = ({
     /* @__PURE__ */ jsx(
       IconButton,
       {
+        appearance: "transparent",
         "data-embedded": true,
         icon: "close",
-        onClick: handleClose,
+        onClick: onClose,
         onMouseDown: handleButtonMouseDown,
-        variant: "secondary"
+        sentiment: "neutral"
       },
       "close"
     )
@@ -131,7 +140,7 @@ const Header = ({
     {
       className: cx("vuuToolbarProxy", className),
       style,
-      onMouseDown: handleMouseDown,
+      onMouseDown,
       children: toolbarItems
     }
   );

package/esm/layout-header/Header.js.map

@@ -1 +1 @@
-{"version":3,"file":"Header.js","sources":["../../src/layout-header/Header.tsx"],"sourcesContent":["import { EditableLabel, IconButton } from \"@vuu-ui/vuu-ui-controls\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport {\n  HTMLAttributes,\n  KeyboardEvent,\n  MouseEvent,\n  ReactElement,\n  cloneElement,\n  useCallback,\n  useRef,\n  useState,\n} from \"react\";\nimport { Contribution } from \"../layout-view\";\nimport { useViewDispatch } from \"../layout-view-actions/ViewContext\";\n\nimport headerCss from \"./Header.css\";\n\nexport interface HeaderProps extends HTMLAttributes<HTMLDivElement> {\n  allowRename?: boolean;\n  collapsed?: boolean;\n  contributions?: Contribution[];\n  expanded?: boolean;\n  closeable?: boolean;\n  onEditTitle: (value: string) => void;\n  orientation?: \"horizontal\" | \"vertical\";\n  tearOut?: boolean;\n}\n\nconst classBase = \"vuuHeader\";\n\nexport const Header = ({\n  allowRename = false,\n  className: classNameProp,\n  contributions,\n  collapsed,\n  closeable,\n  onEditTitle,\n  orientation: orientationProp = \"horizontal\",\n  style,\n  title = \"Untitled\",\n}: HeaderProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-header\",\n    css: headerCss,\n    window: targetWindow,\n  });\n\n  const labelFieldRef = useRef<HTMLDivElement>(null);\n  const [value, setValue] = useState<string>(title);\n  const [editing, setEditing] = useState<boolean>(false);\n\n  const viewDispatch = useViewDispatch();\n  const handleClose = (evt: MouseEvent) =>\n    viewDispatch?.({ type: \"remove\" }, evt);\n\n  const focusTitle = useCallback(() => {\n    labelFieldRef.current?.focus();\n  }, []);\n\n  const handleClickEdit = useCallback(() => {\n    focusTitle();\n    setEditing((isEditing) => !isEditing);\n  }, [focusTitle]);\n\n  const handleButtonMouseDown = (evt: MouseEvent) => {\n    // do not allow drag to be initiated\n    evt.stopPropagation();\n  };\n\n  const orientation = collapsed || orientationProp;\n\n  const className = cx(classBase, classNameProp, `${classBase}-${orientation}`);\n\n  const handleTitleKeyDown = (evt: KeyboardEvent<HTMLDivElement>) => {\n    if (evt.key === \"Enter\") {\n      setEditing(true);\n    }\n  };\n\n  const handleExitEditMode = (\n    originalValue = \"\",\n    finalValue = \"\",\n    allowDeactivation = true,\n    editCancelled = false,\n  ) => {\n    setEditing(false);\n    if (editCancelled) {\n      setValue(originalValue);\n    } else if (finalValue !== originalValue) {\n      setValue(finalValue);\n      onEditTitle?.(finalValue);\n    }\n    if (allowDeactivation === false) {\n      labelFieldRef.current?.focus();\n    }\n  };\n\n  const handleMouseDown = (e: MouseEvent) => {\n    viewDispatch?.({ type: \"mousedown\" }, e);\n  };\n\n  const toolbarItems: ReactElement[] = [];\n  const postTitleContributedItems: ReactElement[] = [];\n  const actionButtons: ReactElement[] = [];\n\n  contributions?.forEach((contribution, i) => {\n    switch (contribution.location) {\n      case \"pre-title\":\n        toolbarItems.push(cloneElement(contribution.content, { key: i }));\n        break;\n      default:\n        postTitleContributedItems.push(\n          cloneElement(contribution.content, { key: i }),\n        );\n    }\n  });\n\n  title &&\n    toolbarItems.push(\n      <EditableLabel\n        className={`${classBase}-title`}\n        editing={editing}\n        key=\"title\"\n        value={value}\n        onChange={setValue}\n        onMouseDownCapture={focusTitle}\n        onExitEditMode={handleExitEditMode}\n        onKeyDown={handleTitleKeyDown}\n        ref={labelFieldRef}\n      />,\n    );\n\n  allowRename &&\n    toolbarItems.push(\n      <IconButton\n        className={`${classBase}-edit`}\n        data-embedded\n        icon=\"edit\"\n        key=\"edit-button\"\n        onClick={handleClickEdit}\n        onMouseDown={handleButtonMouseDown}\n        tabIndex={0}\n        variant=\"secondary\"\n      />,\n    );\n\n  closeable &&\n    actionButtons.push(\n      <IconButton\n        data-embedded\n        icon=\"close\"\n        key=\"close\"\n        onClick={handleClose}\n        onMouseDown={handleButtonMouseDown}\n        variant=\"secondary\"\n      />,\n    );\n\n  postTitleContributedItems.length > 0 &&\n    toolbarItems.push(\n      <div data-align=\"end\" key=\"contributions\">\n        {postTitleContributedItems}\n      </div>,\n    );\n\n  actionButtons.length > 0 &&\n    toolbarItems.push(\n      <div data-align=\"end\" key=\"actions\">\n        {actionButtons}\n      </div>,\n    );\n\n  return (\n    <div\n      className={cx(\"vuuToolbarProxy\", className)}\n      style={style}\n      onMouseDown={handleMouseDown}\n    >\n      {toolbarItems}\n      {/* \n      {collapsed === false ? (\n        <ActionButton\n          aria-label=\"Minimize View\"\n          actionId=\"minimize\"\n          iconName=\"minimize\"\n          onClick={handleAction}\n          onMouseDown={handleButtonMouseDown}\n        />\n      ) : null}\n      {collapsed ? (\n        <ActionButton\n          aria-label=\"Restore View\"\n          actionId=\"restore\"\n          iconName=\"double-chevron-right\"\n          onClick={handleAction}\n          onMouseDown={handleButtonMouseDown}\n        />\n      ) : null}\n      {expanded === false ? (\n        <ActionButton\n          aria-label=\"Maximize View\"\n          actionId=\"maximize\"\n          iconName=\"maximize\"\n          onClick={handleAction}\n          onMouseDown={handleButtonMouseDown}\n        />\n      ) : null}\n      {expanded ? (\n        <ActionButton\n          aria-label=\"Restore View\"\n          actionId=\"restore\"\n          iconName=\"restore\"\n          onClick={handleAction}\n          onMouseDown={handleButtonMouseDown}\n        />\n      ) : null}\n      {tearOut ? (\n        <ActionButton\n          aria-label=\"Tear out View\"\n          actionId=\"tearout\"\n          iconName=\"tear-out\"\n          onClick={handleAction}\n          onMouseDown={handleButtonMouseDown}\n        />\n      ) : null}\n      {closeable ? (\n        <Button\n          aria-label=\"close\"\n          data-icon\n          onClick={handleClose}\n          onMouseDown={handleButtonMouseDown}\n        />\n      ) : null} */}\n    </div>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Header.js","sources":["../../src/layout-header/Header.tsx"],"sourcesContent":["import { EditableLabel, IconButton } from \"@vuu-ui/vuu-ui-controls\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport { HTMLAttributes, MouseEvent, ReactElement, cloneElement } from \"react\";\nimport { Contribution } from \"../layout-view\";\nimport { useHeader } from \"./useHeader\";\n\nimport headerCss from \"./Header.css\";\n\nexport interface HeaderProps extends HTMLAttributes<HTMLDivElement> {\n  allowRename?: boolean;\n  collapsed?: boolean;\n  contributions?: Contribution[];\n  expanded?: boolean;\n  closeable?: boolean;\n  onCollapse?: () => void;\n  onEditTitle?: (value: string) => void;\n  onExpand?: () => void;\n  orientation?: \"horizontal\" | \"vertical\";\n  tearOut?: boolean;\n}\n\nconst classBase = \"vuuHeader\";\n\nexport const Header = ({\n  allowRename = false,\n  className: classNameProp,\n  contributions,\n  collapsed,\n  closeable,\n  onCollapse,\n  onEditTitle,\n  onExpand,\n  orientation: orientationProp = \"horizontal\",\n  style,\n  title = \"Untitled\",\n}: HeaderProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-header\",\n    css: headerCss,\n    window: targetWindow,\n  });\n\n  const {\n    editing,\n    focusTitle,\n    labelFieldRef,\n    onClickEdit,\n    onClose,\n    onExitEditMode,\n    onMouseDown,\n    onTitleKeyDown,\n    onToggleCollapse,\n    onToggleExpand,\n    setValue,\n    value,\n  } = useHeader({\n    onCollapse,\n    onEditTitle,\n    onExpand,\n    title,\n  });\n\n  const handleButtonMouseDown = (evt: MouseEvent) => {\n    // do not allow drag to be initiated\n    evt.stopPropagation();\n  };\n\n  const orientation = collapsed || orientationProp;\n\n  const className = cx(classBase, classNameProp, `${classBase}-${orientation}`);\n\n  const toolbarItems: ReactElement[] = [];\n  const postTitleContributedItems: ReactElement[] = [];\n  const actionButtons: ReactElement[] = [];\n  const allowCollapse =\n    typeof collapsed === \"boolean\" || typeof collapsed === \"string\";\n\n  contributions?.forEach((contribution, i) => {\n    switch (contribution.location) {\n      case \"pre-title\":\n        toolbarItems.push(cloneElement(contribution.content, { key: i }));\n        break;\n      default:\n        postTitleContributedItems.push(\n          cloneElement(contribution.content, { key: i }),\n        );\n    }\n  });\n\n  allowCollapse &&\n    toolbarItems.push(\n      <IconButton\n        className={cx(`${classBase}-toggle`, {\n          [`${classBase}-collapsed`]: collapsed,\n        })}\n        data-embedded\n        icon={collapsed ? \"chevron-open\" : \"chevron-down\"}\n        key=\"collapse-button\"\n        onClick={collapsed ? onToggleExpand : onToggleCollapse}\n        size={20}\n        tabIndex={0}\n        appearance=\"transparent\"\n        sentiment=\"neutral\"\n      />,\n    );\n\n  title &&\n    toolbarItems.push(\n      <EditableLabel\n        className={`${classBase}-title`}\n        editing={editing}\n        key=\"title\"\n        value={value}\n        onChange={setValue}\n        onMouseDownCapture={focusTitle}\n        onExitEditMode={onExitEditMode}\n        onKeyDown={onTitleKeyDown}\n        ref={labelFieldRef}\n      />,\n    );\n\n  allowRename &&\n    toolbarItems.push(\n      <IconButton\n        className={`${classBase}-edit`}\n        data-embedded\n        icon=\"edit\"\n        key=\"edit-button\"\n        onClick={onClickEdit}\n        onMouseDown={handleButtonMouseDown}\n        tabIndex={0}\n        variant=\"secondary\"\n      />,\n    );\n\n  closeable &&\n    actionButtons.push(\n      <IconButton\n        appearance=\"transparent\"\n        data-embedded\n        icon=\"close\"\n        key=\"close\"\n        onClick={onClose}\n        onMouseDown={handleButtonMouseDown}\n        sentiment=\"neutral\"\n      />,\n    );\n\n  postTitleContributedItems.length > 0 &&\n    toolbarItems.push(\n      <div data-align=\"end\" key=\"contributions\">\n        {postTitleContributedItems}\n      </div>,\n    );\n\n  actionButtons.length > 0 &&\n    toolbarItems.push(\n      <div data-align=\"end\" key=\"actions\">\n        {actionButtons}\n      </div>,\n    );\n\n  return (\n    <div\n      className={cx(\"vuuToolbarProxy\", className)}\n      style={style}\n      onMouseDown={onMouseDown}\n    >\n      {toolbarItems}\n    </div>\n  );\n};\n"],"names":[],"mappings":"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"}

package/esm/layout-header/useHeader.js

@@ -0,0 +1,84 @@
+import { useState, useRef, useCallback } from 'react';
+import '../layout-provider/LayoutProvider.js';
+import { useViewDispatch } from '../layout-view-actions/ViewContext.js';
+import { queryClosest } from '@vuu-ui/vuu-utils';
+
+const useHeader = ({
+  onCollapse,
+  onEditTitle,
+  onExpand,
+  title
+}) => {
+  const [editing, setEditing] = useState(false);
+  const [value, setValue] = useState(title);
+  const labelFieldRef = useRef(null);
+  const viewDispatch = useViewDispatch();
+  const handleClose = useCallback(
+    (evt) => viewDispatch?.({ type: "remove" }, evt),
+    [viewDispatch]
+  );
+  const focusTitle = useCallback(() => {
+    labelFieldRef.current?.focus();
+  }, []);
+  const handleClickEdit = useCallback(() => {
+    focusTitle();
+    setEditing((isEditing) => !isEditing);
+  }, [focusTitle]);
+  const handleTitleKeyDown = (evt) => {
+    if (evt.key === "Enter") {
+      setEditing(true);
+    }
+  };
+  const handleMouseDown = useCallback(
+    (e) => {
+      const button = queryClosest(e.target, ".saltButton");
+      if (button === null) {
+        viewDispatch?.({ type: "mousedown" }, e);
+      }
+    },
+    [viewDispatch]
+  );
+  const handleExitEditMode = (originalValue = "", finalValue = "", allowDeactivation = true, editCancelled = false) => {
+    setEditing(false);
+    if (editCancelled) {
+      setValue(originalValue);
+    } else if (finalValue !== originalValue) {
+      setValue(finalValue);
+      onEditTitle?.(finalValue);
+    }
+    if (allowDeactivation === false) {
+      labelFieldRef.current?.focus();
+    }
+  };
+  const handleToggleCollapse = useCallback(
+    (e) => {
+      viewDispatch?.({ type: "collapse" }, e);
+      onCollapse?.();
+    },
+    [onCollapse, viewDispatch]
+  );
+  const handleToggleExpand = useCallback(
+    (e) => {
+      viewDispatch?.({ type: "expand" }, e);
+      onExpand?.();
+    },
+    [onExpand, viewDispatch]
+  );
+  return {
+    editing,
+    focusTitle,
+    labelFieldRef,
+    onClickEdit: handleClickEdit,
+    onClose: handleClose,
+    onExitEditMode: handleExitEditMode,
+    onMouseDown: handleMouseDown,
+    onToggleCollapse: handleToggleCollapse,
+    onToggleExpand: handleToggleExpand,
+    onTitleKeyDown: handleTitleKeyDown,
+    setValue,
+    value
+  };
+};
+
+export { useHeader };
+//# sourceMappingURL=useHeader.js.map

package/esm/layout-header/useHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useHeader.js","sources":["../../src/layout-header/useHeader.ts"],"sourcesContent":["import {\n  KeyboardEvent,\n  MouseEventHandler,\n  useCallback,\n  useRef,\n  useState,\n} from \"react\";\nimport type { HeaderProps } from \"./Header\";\nimport { useViewDispatch } from \"../layout-view-actions\";\nimport { queryClosest } from \"@vuu-ui/vuu-utils\";\n\nexport interface HeaderHookProps\n  extends Pick<HeaderProps, \"onCollapse\" | \"onEditTitle\" | \"onExpand\"> {\n  debugString?: string;\n  title: string;\n}\n\nexport const useHeader = ({\n  onCollapse,\n  onEditTitle,\n  onExpand,\n  title,\n}: HeaderHookProps) => {\n  const [editing, setEditing] = useState<boolean>(false);\n  const [value, setValue] = useState<string>(title);\n  const labelFieldRef = useRef<HTMLDivElement>(null);\n\n  const viewDispatch = useViewDispatch();\n  const handleClose = useCallback<MouseEventHandler>(\n    (evt) => viewDispatch?.({ type: \"remove\" }, evt),\n    [viewDispatch],\n  );\n\n  const focusTitle = useCallback(() => {\n    labelFieldRef.current?.focus();\n  }, []);\n\n  const handleClickEdit = useCallback(() => {\n    focusTitle();\n    setEditing((isEditing) => !isEditing);\n  }, [focusTitle]);\n\n  const handleTitleKeyDown = (evt: KeyboardEvent<HTMLDivElement>) => {\n    if (evt.key === \"Enter\") {\n      setEditing(true);\n    }\n  };\n\n  const handleMouseDown = useCallback<MouseEventHandler>(\n    (e) => {\n      const button = queryClosest(e.target, \".saltButton\");\n      if (button === null) {\n        // This is for drag start detection.\n        viewDispatch?.({ type: \"mousedown\" }, e);\n      }\n    },\n    [viewDispatch],\n  );\n\n  const handleExitEditMode = (\n    originalValue = \"\",\n    finalValue = \"\",\n    allowDeactivation = true,\n    editCancelled = false,\n  ) => {\n    setEditing(false);\n    if (editCancelled) {\n      setValue(originalValue);\n    } else if (finalValue !== originalValue) {\n      setValue(finalValue);\n      onEditTitle?.(finalValue);\n    }\n    if (allowDeactivation === false) {\n      labelFieldRef.current?.focus();\n    }\n  };\n\n  const handleToggleCollapse = useCallback<MouseEventHandler>(\n    (e) => {\n      viewDispatch?.({ type: \"collapse\" }, e);\n      onCollapse?.();\n    },\n    [onCollapse, viewDispatch],\n  );\n\n  const handleToggleExpand = useCallback<MouseEventHandler>(\n    (e) => {\n      viewDispatch?.({ type: \"expand\" }, e);\n      onExpand?.();\n    },\n    [onExpand, viewDispatch],\n  );\n\n  return {\n    editing,\n    focusTitle,\n    labelFieldRef,\n    onClickEdit: handleClickEdit,\n    onClose: handleClose,\n    onExitEditMode: handleExitEditMode,\n    onMouseDown: handleMouseDown,\n    onToggleCollapse: handleToggleCollapse,\n    onToggleExpand: handleToggleExpand,\n    onTitleKeyDown: handleTitleKeyDown,\n    setValue,\n    value,\n  };\n};\n"],"names":[],"mappings":"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"}

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, 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          serializeState(state.current, getLayoutChangeReason(action));\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":"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"}
+{"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, 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          serializeState(state.current, getLayoutChangeReason(action));\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":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"LayoutProviderContext.js","sources":["../../src/layout-provider/LayoutProviderContext.ts"],"sourcesContent":["import { createContext, Dispatch, ReactElement } from \"react\";\nimport {\n  DragStartAction,\n  LayoutReducerAction,\n  QueryAction,\n} from \"../layout-reducer\";\nimport { SaveAction } from \"../layout-view\";\nimport { LayoutJSON } from \"@vuu-ui/vuu-utils\";\n\nconst unconfiguredLayoutProviderDispatch: LayoutProviderDispatch = (action) =>\n  console.log(\n    `dispatch ${action.type}, have you forgotten to provide a LayoutProvider ?`,\n  );\nconst unconfiguredService = (message: string) => () =>\n  console.log(`${message}, have you forgotten to provide a LayoutProvider ?`);\n\nexport type LayoutProviderDispatch = Dispatch<\n  LayoutReducerAction | SaveAction | DragStartAction | QueryAction\n>;\n\nexport interface LayoutProviderContextProps {\n  addComponentToWorkspace: (component: ReactElement) => void;\n  createNewChild?: (index?: number) => ReactElement;\n  dispatchLayoutProvider: LayoutProviderDispatch;\n  showComponentInContextPanel: (\n    component: ReactElement | LayoutJSON,\n    title?: string,\n    onContextPanelClose?: () => void,\n  ) => void;\n  switchWorkspace: (idx: number) => void;\n  version: number;\n}\n\nexport const LayoutProviderContext = createContext<LayoutProviderContextProps>({\n  addComponentToWorkspace: unconfiguredService(\"addComponentToWorkspace\"),\n  dispatchLayoutProvider: unconfiguredLayoutProviderDispatch,\n  showComponentInContextPanel: unconfiguredService(\n    \"showComponentInContextPanel\",\n  ),\n  switchWorkspace: unconfiguredService(\"switchWorkspace\"),\n  version: -1,\n});\n"],"names":[],"mappings":";;AASA,MAAM,kCAAA,GAA6D,CAAC,MAAA,KAClE,OAAQ,CAAA,GAAA;AAAA,EACN,CAAA,SAAA,EAAY,OAAO,IAAI,CAAA,kDAAA,CAAA;AACzB,CAAA,CAAA;AACF,MAAM,mBAAA,GAAsB,CAAC,OAAoB,KAAA,MAC/C,QAAQ,GAAI,CAAA,CAAA,EAAG,OAAO,CAAoD,kDAAA,CAAA,CAAA,CAAA;AAmBrE,MAAM,wBAAwB,aAA0C,CAAA;AAAA,EAC7E,uBAAA,EAAyB,oBAAoB,yBAAyB,CAAA;AAAA,EACtE,sBAAwB,EAAA,kCAAA;AAAA,EACxB,2BAA6B,EAAA,mBAAA;AAAA,IAC3B,6BAAA;AAAA,GACF;AAAA,EACA,eAAA,EAAiB,oBAAoB,iBAAiB,CAAA;AAAA,EACtD,OAAS,EAAA,CAAA,CAAA;AACX,CAAC;;;;"}
+{"version":3,"file":"LayoutProviderContext.js","sources":["../../src/layout-provider/LayoutProviderContext.ts"],"sourcesContent":["import { createContext, Dispatch, ReactElement } from \"react\";\nimport {\n  DragStartAction,\n  LayoutReducerAction,\n  QueryAction,\n} from \"../layout-reducer\";\nimport { SaveAction } from \"../layout-view\";\nimport { LayoutJSON } from \"@vuu-ui/vuu-utils\";\n\nconst unconfiguredLayoutProviderDispatch: LayoutProviderDispatch = (action) =>\n  console.log(\n    `dispatch ${action.type}, have you forgotten to provide a LayoutProvider ?`,\n  );\nconst unconfiguredService = (message: string) => () =>\n  console.log(`${message}, have you forgotten to provide a LayoutProvider ?`);\n\nexport type LayoutProviderDispatch = Dispatch<\n  LayoutReducerAction | SaveAction | DragStartAction | QueryAction\n>;\n\nexport interface LayoutProviderContextProps {\n  addComponentToWorkspace: (component: ReactElement) => void;\n  createNewChild?: (index?: number) => ReactElement;\n  dispatchLayoutProvider: LayoutProviderDispatch;\n  showComponentInContextPanel: (\n    component: ReactElement | LayoutJSON,\n    title?: string,\n    onContextPanelClose?: () => void,\n  ) => void;\n  switchWorkspace: (idx: number) => void;\n  version: number;\n}\n\nexport const LayoutProviderContext = createContext<LayoutProviderContextProps>({\n  addComponentToWorkspace: unconfiguredService(\"addComponentToWorkspace\"),\n  dispatchLayoutProvider: unconfiguredLayoutProviderDispatch,\n  showComponentInContextPanel: unconfiguredService(\n    \"showComponentInContextPanel\",\n  ),\n  switchWorkspace: unconfiguredService(\"switchWorkspace\"),\n  version: -1,\n});\n"],"names":[],"mappings":";;AASA,MAAM,kCAAA,GAA6D,CAAC,MAAA,KAClE,OAAQ,CAAA,GAAA;AAAA,EACN,CAAA,SAAA,EAAY,OAAO,IAAI,CAAA,kDAAA;AACzB,CAAA;AACF,MAAM,mBAAA,GAAsB,CAAC,OAAoB,KAAA,MAC/C,QAAQ,GAAI,CAAA,CAAA,EAAG,OAAO,CAAoD,kDAAA,CAAA,CAAA;AAmBrE,MAAM,wBAAwB,aAA0C,CAAA;AAAA,EAC7E,uBAAA,EAAyB,oBAAoB,yBAAyB,CAAA;AAAA,EACtE,sBAAwB,EAAA,kCAAA;AAAA,EACxB,2BAA6B,EAAA,mBAAA;AAAA,IAC3B;AAAA,GACF;AAAA,EACA,eAAA,EAAiB,oBAAoB,iBAAiB,CAAA;AAAA,EACtD,OAAS,EAAA,CAAA;AACX,CAAC;;;;"}