@vuu-ui/vuu-layout 0.8.57 → 0.8.59
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/Component.js +2 -2
- package/cjs/Component.js.map +1 -1
- package/cjs/DraggableLayout.js +3 -3
- package/cjs/DraggableLayout.js.map +1 -1
- package/cjs/dock-layout/DockLayout.js +5 -4
- package/cjs/dock-layout/DockLayout.js.map +1 -1
- package/cjs/drag-drop/BoxModel.js +4 -5
- package/cjs/drag-drop/BoxModel.js.map +1 -1
- package/cjs/drag-drop/DropTarget.js +1 -0
- package/cjs/drag-drop/DropTarget.js.map +1 -1
- package/cjs/flexbox/FlexboxLayout.js +2 -2
- package/cjs/flexbox/FlexboxLayout.js.map +1 -1
- package/cjs/flexbox/FluidGridLayout.js +2 -2
- package/cjs/flexbox/FluidGridLayout.js.map +1 -1
- package/cjs/flexbox/flexbox-utils.js +1 -0
- package/cjs/flexbox/flexbox-utils.js.map +1 -1
- package/cjs/index.js +0 -6
- package/cjs/index.js.map +1 -1
- package/cjs/layout-provider/LayoutProvider.js.map +1 -1
- package/cjs/layout-reducer/flexUtils.js +2 -2
- package/cjs/layout-reducer/flexUtils.js.map +1 -1
- package/cjs/layout-reducer/layout-reducer.js +2 -2
- package/cjs/layout-reducer/layout-reducer.js.map +1 -1
- package/cjs/layout-reducer/layoutUtils.js +3 -4
- package/cjs/layout-reducer/layoutUtils.js.map +1 -1
- package/cjs/layout-reducer/wrap-layout-element.js +1 -2
- package/cjs/layout-reducer/wrap-layout-element.js.map +1 -1
- package/cjs/layout-view/View.js +1 -2
- package/cjs/layout-view/View.js.map +1 -1
- package/cjs/layout-view-actions/ViewContext.js.map +1 -1
- package/cjs/layout-view-actions/useViewActionDispatcher.js.map +1 -1
- package/cjs/palette/Palette.js +3 -4
- package/cjs/palette/Palette.js.map +1 -1
- package/cjs/placeholder/Placeholder.js +2 -2
- package/cjs/placeholder/Placeholder.js.map +1 -1
- package/cjs/stack/StackLayout.js +3 -4
- package/cjs/stack/StackLayout.js.map +1 -1
- package/cjs/utils/pathUtils.js +5 -5
- package/cjs/utils/pathUtils.js.map +1 -1
- package/esm/Component.js +2 -2
- package/esm/Component.js.map +1 -1
- package/esm/DraggableLayout.js +2 -2
- package/esm/DraggableLayout.js.map +1 -1
- package/esm/dock-layout/DockLayout.js +5 -4
- package/esm/dock-layout/DockLayout.js.map +1 -1
- package/esm/drag-drop/BoxModel.js +1 -2
- package/esm/drag-drop/BoxModel.js.map +1 -1
- package/esm/drag-drop/DropTarget.js +1 -0
- package/esm/drag-drop/DropTarget.js.map +1 -1
- package/esm/flexbox/FlexboxLayout.js +1 -1
- package/esm/flexbox/FlexboxLayout.js.map +1 -1
- package/esm/flexbox/FluidGridLayout.js +1 -1
- package/esm/flexbox/FluidGridLayout.js.map +1 -1
- package/esm/flexbox/flexbox-utils.js +1 -0
- package/esm/flexbox/flexbox-utils.js.map +1 -1
- package/esm/index.js +0 -1
- package/esm/index.js.map +1 -1
- package/esm/layout-provider/LayoutProvider.js.map +1 -1
- package/esm/layout-reducer/flexUtils.js +3 -3
- package/esm/layout-reducer/flexUtils.js.map +1 -1
- package/esm/layout-reducer/layout-reducer.js +1 -1
- package/esm/layout-reducer/layout-reducer.js.map +1 -1
- package/esm/layout-reducer/layoutUtils.js +2 -3
- package/esm/layout-reducer/layoutUtils.js.map +1 -1
- package/esm/layout-reducer/wrap-layout-element.js +2 -3
- package/esm/layout-reducer/wrap-layout-element.js.map +1 -1
- package/esm/layout-view/View.js +1 -2
- package/esm/layout-view/View.js.map +1 -1
- package/esm/layout-view-actions/ViewContext.js.map +1 -1
- package/esm/layout-view-actions/useViewActionDispatcher.js.map +1 -1
- package/esm/palette/Palette.js +2 -3
- package/esm/palette/Palette.js.map +1 -1
- package/esm/placeholder/Placeholder.js +2 -2
- package/esm/placeholder/Placeholder.js.map +1 -1
- package/esm/stack/StackLayout.js +3 -4
- package/esm/stack/StackLayout.js.map +1 -1
- package/esm/utils/pathUtils.js +1 -1
- package/esm/utils/pathUtils.js.map +1 -1
- package/package.json +10 -10
- package/types/Component.d.ts +1 -2
- package/types/dock-layout/DockLayout.d.ts +2 -4
- package/types/flexbox/FluidGridLayout.d.ts +1 -1
- package/types/index.d.ts +0 -1
- package/types/layout-provider/LayoutProvider.d.ts +1 -1
- package/types/layout-reducer/layoutUtils.d.ts +8 -4
- package/types/layout-view-actions/ViewContext.d.ts +1 -1
- package/cjs/registry/ComponentRegistry.js +0 -27
- package/cjs/registry/ComponentRegistry.js.map +0 -1
- package/esm/registry/ComponentRegistry.js +0 -21
- package/esm/registry/ComponentRegistry.js.map +0 -1
- package/types/registry/ComponentRegistry.d.ts +0 -13
- package/types/registry/index.d.ts +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropTarget.js","sources":["../../src/drag-drop/DropTarget.ts"],"sourcesContent":["import { rect, rectTuple } from \"@vuu-ui/vuu-utils\";\nimport { LayoutModel } from \"../layout-reducer\";\nimport { getProps, typeOf } from \"../utils\";\nimport {\n BoxModel,\n getPosition,\n Measurements,\n Position,\n positionValues,\n RelativeDropPosition,\n} from \"./BoxModel\";\nimport { DragDropRect, DropPos, DropPosTab } from \"./dragDropTypes\";\nimport { DragState } from \"./DragState\";\n\nexport const isTabstrip = (dropTarget: DropTarget) =>\n dropTarget.pos.tab &&\n typeOf(dropTarget.component) === \"Stack\" &&\n dropTarget.pos.position.Header;\n\nconst { north, south, east, west } = positionValues;\nconst eastwest = east + west;\nconst northsouth = north + south;\n\nexport interface DropTargetProps {\n component: LayoutModel;\n pos: DropPos;\n clientRect: DragDropRect;\n nextDropTarget: DropTarget | null;\n}\n\nexport type GuideLine = [\n number,\n number,\n number,\n number,\n number,\n number,\n number,\n number\n];\nexport interface TargetDropOutline {\n l: number;\n r: number;\n t: number;\n b: number;\n tabLeft?: number;\n tabWidth?: number;\n tabHeight?: number;\n guideLines?: GuideLine;\n}\n\nexport class DropTarget {\n private active: boolean;\n\n public box: unknown;\n public clientRect: DragDropRect;\n public component: LayoutModel;\n public dropRect: rectTuple | undefined;\n public nextDropTarget: DropTarget | null;\n public pos: DropPos;\n\n constructor({\n component,\n pos,\n clientRect /*, closeToTheEdge*/,\n nextDropTarget,\n }: DropTargetProps) {\n this.component = component;\n this.pos = pos;\n this.clientRect = clientRect;\n this.nextDropTarget = nextDropTarget;\n this.active = false;\n this.dropRect = undefined;\n }\n\n targetTabPos(tab: DropPosTab) {\n const { left: tabLeft, width: tabWidth, positionRelativeToTab } = tab;\n return positionRelativeToTab === RelativeDropPosition.BEFORE\n ? tabLeft\n : tabLeft + tabWidth;\n }\n\n /**\n * Determine what will be rendered by the dropTargetRenderer\n *\n * @param {*} lineWidth\n * @param {*} dragState\n * @returns {l, t, r, b, tabLeft, tabWidth, tabHeight}\n */\n getTargetDropOutline(\n lineWidth: number,\n dragState?: DragState\n ): TargetDropOutline {\n if (this.pos.tab) {\n return this.getDropTabOutline(lineWidth, this.pos.tab);\n } else if (dragState && dragState.hasIntrinsicSize()) {\n return this.getIntrinsicDropRect(dragState);\n } else {\n const [l, t, r, b] = this.getDropRectOutline(\n lineWidth,\n dragState\n ) as rectTuple;\n return { l, t, r, b };\n }\n }\n\n getDropTabOutline(lineWidth: number, tab: DropPosTab): TargetDropOutline {\n const {\n clientRect: { top, left, right, bottom, header },\n } = this;\n\n const inset = 0;\n const gap = Math.round(lineWidth / 2) + inset;\n\n const t = Math.round(top);\n const l = Math.round(left + gap);\n const r = Math.round(right - gap);\n const b = Math.round(bottom - gap);\n const tabLeft = this.targetTabPos(tab);\n const tabWidth = 60; // should really measure text\n const tabHeight = (header?.bottom ?? 0) - (header?.top ?? 0);\n return { l, t, r, b, tabLeft, tabWidth, tabHeight };\n }\n\n getIntrinsicDropRect(dragState: DragState): TargetDropOutline {\n const { pos, clientRect: rect } = this;\n\n const { x, y } = dragState;\n\n let height = dragState.intrinsicSize?.height ?? 0;\n let width = dragState.intrinsicSize?.height ?? 0;\n\n if (height && height > rect.height) {\n console.log(`DropTarget: we're going to blow the gaff`);\n height = rect.height;\n } else if (width && width > rect.width) {\n console.log(`DropTarget: we're going to blow the gaff`);\n width = rect.width;\n }\n\n const left = Math.min(\n rect.right - width,\n Math.max(rect.left, Math.round(pos.x - x.mousePct * width))\n );\n const top = Math.min(\n rect.bottom - height,\n Math.max(rect.top, Math.round(pos.y - y.mousePct * height))\n );\n const [l, t, r, b] = (this.dropRect = [\n left,\n top,\n left + width,\n top + height,\n ]);\n\n const guideLines: GuideLine = pos.position.EastOrWest\n ? [l, rect.top, l, rect.bottom, r, rect.top, r, rect.bottom]\n : [rect.left, t, rect.right, t, rect.left, b, rect.right, b];\n\n return { l, r, t, b, guideLines };\n }\n\n /**\n * @returns [left, top, right, bottom]\n */\n getDropRectOutline(lineWidth: number, dragState?: DragState) {\n const { pos, clientRect: rect } = this;\n const { width: suggestedWidth, height: suggestedHeight, position } = pos;\n\n const { width: intrinsicWidth, height: intrinsicHeight } =\n dragState?.intrinsicSize ?? {};\n const sizeHeight = intrinsicHeight ?? suggestedHeight ?? 0;\n const sizeWidth = intrinsicWidth ?? suggestedWidth ?? 0;\n\n this.dropRect = undefined;\n\n const { top: t, left: l, right: r, bottom: b } = rect;\n\n const inset = 0;\n const gap = Math.round(lineWidth / 2) + inset;\n\n switch (position) {\n case Position.North:\n case Position.Header: {\n const halfHeight = Math.round((b - t) / 2);\n const height = sizeHeight\n ? Math.min(halfHeight, Math.round(sizeHeight))\n : halfHeight;\n return sizeWidth && l + sizeWidth < r\n ? [l + gap, t + gap, l + sizeWidth - gap, t + gap + height] // need flex direction indicator\n : [l + gap, t + gap, r - gap, t + gap + height];\n }\n case Position.West: {\n const halfWidth = Math.round((r - l) / 2);\n const width = sizeWidth\n ? Math.min(halfWidth, Math.round(sizeWidth))\n : halfWidth;\n return sizeHeight && t + sizeHeight < b\n ? [l + gap, t + gap, l - gap + width, t + sizeHeight + gap] // need flex direction indicator\n : [l + gap, t + gap, l - gap + width, b - gap];\n }\n case Position.East: {\n const halfWidth = Math.round((r - l) / 2);\n const width = sizeWidth\n ? Math.min(halfWidth, Math.round(sizeWidth))\n : halfWidth;\n return sizeHeight && t + sizeHeight < b\n ? [r - gap - width, t + gap, r - gap, t + sizeHeight + gap] // need flex direction indicator\n : [r - gap - width, t + gap, r - gap, b - gap];\n }\n case Position.South: {\n const halfHeight = Math.round((b - t) / 2);\n const height = sizeHeight\n ? Math.min(halfHeight, Math.round(sizeHeight))\n : halfHeight;\n\n return sizeWidth && l + sizeWidth < r\n ? [l + gap, b - gap - height, l + sizeWidth - gap, b - gap] // need flex direction indicator\n : [l + gap, b - gap - height, r - gap, b - gap];\n }\n case Position.Centre: {\n return [l + gap, t + gap, r - gap, b - gap];\n }\n default:\n console.warn(`DropTarget does not recognize position ${position}`);\n return null;\n }\n }\n\n activate() {\n this.active = true;\n return this;\n }\n\n toArray(this: DropTarget) {\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n let dropTarget: DropTarget | null = this;\n const dropTargets = [dropTarget];\n // eslint-disable-next-line no-cond-assign\n while ((dropTarget = dropTarget.nextDropTarget)) {\n dropTargets.push(dropTarget);\n }\n return dropTargets;\n }\n\n static getActiveDropTarget(dropTarget: DropTarget | null): DropTarget | null {\n return dropTarget === null\n ? null\n : dropTarget?.active\n ? dropTarget\n : DropTarget.getActiveDropTarget(dropTarget.nextDropTarget);\n }\n}\n\n// Initial entry to this method is always via the app (may be it should be *on* the app)\nexport function identifyDropTarget(\n x: number,\n y: number,\n rootLayout: LayoutModel,\n measurements: Measurements,\n intrinsicSize?: number,\n validDropTargets?: string[]\n) {\n let dropTarget = null;\n\n const allBoxesContainingPoint = BoxModel.allBoxesContainingPoint(\n rootLayout,\n measurements,\n x,\n y,\n validDropTargets\n );\n\n if (allBoxesContainingPoint.length) {\n const [component, ...containers] = allBoxesContainingPoint;\n const {\n \"data-path\": dataPath,\n path = dataPath,\n \"data-row-placeholder\": isRowPlaceholder,\n } = getProps(component);\n const clientRect = measurements[path];\n const placeholderOrientation =\n intrinsicSize && isRowPlaceholder ? \"row\" : undefined;\n const pos = getPosition(x, y, clientRect, placeholderOrientation);\n const box = measurements[path];\n\n const nextDropTarget = ([nextTarget, ...targets]: LayoutModel[]):\n | DropTarget\n | undefined => {\n if (pos.position?.Header || pos.closeToTheEdge) {\n const targetPosition = getTargetPosition(\n nextTarget,\n pos,\n box,\n measurements,\n x,\n y\n );\n if (targetPosition) {\n const [containerPos, clientRect] = targetPosition;\n\n return new DropTarget({\n component: nextTarget,\n pos: containerPos,\n clientRect,\n nextDropTarget: nextDropTarget(targets) ?? null,\n });\n } else if (targets.length) {\n return nextDropTarget(targets);\n }\n }\n };\n dropTarget = new DropTarget({\n component,\n pos,\n clientRect,\n nextDropTarget: nextDropTarget(containers) ?? null,\n }).activate();\n }\n\n return dropTarget;\n}\n\nfunction getTargetPosition(\n container: LayoutModel,\n { closeToTheEdge, position }: DropPos,\n box: rect,\n measurements: Measurements,\n x: number,\n y: number\n): [DropPos, DragDropRect] | undefined {\n if (!container || container.type === \"DraggableLayout\") {\n return;\n }\n\n const containingBox = measurements[container.props.path];\n const closeToTop = closeToTheEdge & positionValues.north;\n const closeToRight = closeToTheEdge & positionValues.east;\n const closeToBottom = closeToTheEdge & positionValues.south;\n const closeToLeft = closeToTheEdge & positionValues.west;\n\n const atTop =\n (closeToTop || position.Header) &&\n Math.round(box.top) === Math.round(containingBox.top);\n const atRight =\n closeToRight && Math.round(box.right) === Math.round(containingBox.right);\n const atBottom =\n closeToBottom &&\n Math.round(box.bottom) === Math.round(containingBox.bottom);\n const atLeft =\n closeToLeft && Math.round(box.left) === Math.round(containingBox.left);\n\n if (atTop || atRight || atBottom || atLeft) {\n const { \"data-path\": dataPath, path = dataPath } = container.props;\n const clientRect = measurements[path];\n const containerPos = getPosition(x, y, clientRect);\n\n // if its a VBox and we're close to left or right ...\n if (\n (isVBox(container) || isTabbedContainer(container)) &&\n closeToTheEdge & eastwest\n ) {\n containerPos.width = 120;\n return [containerPos, clientRect];\n }\n // if it's a HBox and we're close to top or bottom ...\n else if (\n (isHBox(container) || isTabbedContainer(container)) &&\n (position.Header || closeToTheEdge & northsouth)\n ) {\n containerPos.height = 120;\n return [containerPos, clientRect];\n }\n }\n}\n\nfunction isTabbedContainer(component: LayoutModel) {\n return typeOf(component) === \"Stack\";\n}\n\nfunction isVBox(component: LayoutModel) {\n return (\n typeOf(component) === \"Flexbox\" &&\n component.props.style.flexDirection === \"column\"\n );\n}\n\nfunction isHBox(component: LayoutModel) {\n return (\n typeOf(component) === \"Flexbox\" &&\n component.props.style.flexDirection === \"row\"\n );\n}\n"],"names":["rect","clientRect"],"mappings":";;;;;AAcO,MAAM,UAAa,GAAA,CAAC,UACzB,KAAA,UAAA,CAAW,GAAI,CAAA,GAAA,IACf,MAAO,CAAA,UAAA,CAAW,SAAS,CAAA,KAAM,OACjC,IAAA,UAAA,CAAW,IAAI,QAAS,CAAA,OAAA;AAE1B,MAAM,EAAE,KAAA,EAAO,KAAO,EAAA,IAAA,EAAM,MAAS,GAAA,cAAA,CAAA;AACrC,MAAM,WAAW,IAAO,GAAA,IAAA,CAAA;AACxB,MAAM,aAAa,KAAQ,GAAA,KAAA,CAAA;AA8BpB,MAAM,UAAW,CAAA;AAAA,EAUtB,WAAY,CAAA;AAAA,IACV,SAAA;AAAA,IACA,GAAA;AAAA,IACA,UAAA;AAAA,IACA,cAAA;AAAA,GACkB,EAAA;AAClB,IAAA,IAAA,CAAK,SAAY,GAAA,SAAA,CAAA;AACjB,IAAA,IAAA,CAAK,GAAM,GAAA,GAAA,CAAA;AACX,IAAA,IAAA,CAAK,UAAa,GAAA,UAAA,CAAA;AAClB,IAAA,IAAA,CAAK,cAAiB,GAAA,cAAA,CAAA;AACtB,IAAA,IAAA,CAAK,MAAS,GAAA,KAAA,CAAA;AACd,IAAA,IAAA,CAAK,QAAW,GAAA,KAAA,CAAA,CAAA;AAAA,GAClB;AAAA,EAEA,aAAa,GAAiB,EAAA;AAC5B,IAAA,MAAM,EAAE,IAAM,EAAA,OAAA,EAAS,KAAO,EAAA,QAAA,EAAU,uBAA0B,GAAA,GAAA,CAAA;AAClE,IAAA,OAAO,qBAA0B,KAAA,oBAAA,CAAqB,MAClD,GAAA,OAAA,GACA,OAAU,GAAA,QAAA,CAAA;AAAA,GAChB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASA,oBAAA,CACE,WACA,SACmB,EAAA;AACnB,IAAI,IAAA,IAAA,CAAK,IAAI,GAAK,EAAA;AAChB,MAAA,OAAO,IAAK,CAAA,iBAAA,CAAkB,SAAW,EAAA,IAAA,CAAK,IAAI,GAAG,CAAA,CAAA;AAAA,KAC5C,MAAA,IAAA,SAAA,IAAa,SAAU,CAAA,gBAAA,EAAoB,EAAA;AACpD,MAAO,OAAA,IAAA,CAAK,qBAAqB,SAAS,CAAA,CAAA;AAAA,KACrC,MAAA;AACL,MAAA,MAAM,CAAC,CAAG,EAAA,CAAA,EAAG,CAAG,EAAA,CAAC,IAAI,IAAK,CAAA,kBAAA;AAAA,QACxB,SAAA;AAAA,QACA,SAAA;AAAA,OACF,CAAA;AACA,MAAA,OAAO,EAAE,CAAA,EAAG,CAAG,EAAA,CAAA,EAAG,CAAE,EAAA,CAAA;AAAA,KACtB;AAAA,GACF;AAAA,EAEA,iBAAA,CAAkB,WAAmB,GAAoC,EAAA;AACvE,IAAM,MAAA;AAAA,MACJ,YAAY,EAAE,GAAA,EAAK,IAAM,EAAA,KAAA,EAAO,QAAQ,MAAO,EAAA;AAAA,KAC7C,GAAA,IAAA,CAAA;AAEJ,IAAA,MAAM,KAAQ,GAAA,CAAA,CAAA;AACd,IAAA,MAAM,GAAM,GAAA,IAAA,CAAK,KAAM,CAAA,SAAA,GAAY,CAAC,CAAI,GAAA,KAAA,CAAA;AAExC,IAAM,MAAA,CAAA,GAAI,IAAK,CAAA,KAAA,CAAM,GAAG,CAAA,CAAA;AACxB,IAAA,MAAM,CAAI,GAAA,IAAA,CAAK,KAAM,CAAA,IAAA,GAAO,GAAG,CAAA,CAAA;AAC/B,IAAA,MAAM,CAAI,GAAA,IAAA,CAAK,KAAM,CAAA,KAAA,GAAQ,GAAG,CAAA,CAAA;AAChC,IAAA,MAAM,CAAI,GAAA,IAAA,CAAK,KAAM,CAAA,MAAA,GAAS,GAAG,CAAA,CAAA;AACjC,IAAM,MAAA,OAAA,GAAU,IAAK,CAAA,YAAA,CAAa,GAAG,CAAA,CAAA;AACrC,IAAA,MAAM,QAAW,GAAA,EAAA,CAAA;AACjB,IAAA,MAAM,SAAa,GAAA,CAAA,MAAA,EAAQ,MAAU,IAAA,CAAA,KAAM,QAAQ,GAAO,IAAA,CAAA,CAAA,CAAA;AAC1D,IAAA,OAAO,EAAE,CAAG,EAAA,CAAA,EAAG,GAAG,CAAG,EAAA,OAAA,EAAS,UAAU,SAAU,EAAA,CAAA;AAAA,GACpD;AAAA,EAEA,qBAAqB,SAAyC,EAAA;AAC5D,IAAA,MAAM,EAAE,GAAA,EAAK,UAAYA,EAAAA,KAAAA,EAAS,GAAA,IAAA,CAAA;AAElC,IAAM,MAAA,EAAE,CAAG,EAAA,CAAA,EAAM,GAAA,SAAA,CAAA;AAEjB,IAAI,IAAA,MAAA,GAAS,SAAU,CAAA,aAAA,EAAe,MAAU,IAAA,CAAA,CAAA;AAChD,IAAI,IAAA,KAAA,GAAQ,SAAU,CAAA,aAAA,EAAe,MAAU,IAAA,CAAA,CAAA;AAE/C,IAAI,IAAA,MAAA,IAAU,MAASA,GAAAA,KAAAA,CAAK,MAAQ,EAAA;AAClC,MAAA,OAAA,CAAQ,IAAI,CAA0C,wCAAA,CAAA,CAAA,CAAA;AACtD,MAAA,MAAA,GAASA,KAAK,CAAA,MAAA,CAAA;AAAA,KACL,MAAA,IAAA,KAAA,IAAS,KAAQA,GAAAA,KAAAA,CAAK,KAAO,EAAA;AACtC,MAAA,OAAA,CAAQ,IAAI,CAA0C,wCAAA,CAAA,CAAA,CAAA;AACtD,MAAA,KAAA,GAAQA,KAAK,CAAA,KAAA,CAAA;AAAA,KACf;AAEA,IAAA,MAAM,OAAO,IAAK,CAAA,GAAA;AAAA,MAChBA,MAAK,KAAQ,GAAA,KAAA;AAAA,MACb,IAAA,CAAK,GAAIA,CAAAA,KAAAA,CAAK,IAAM,EAAA,IAAA,CAAK,KAAM,CAAA,GAAA,CAAI,CAAI,GAAA,CAAA,CAAE,QAAW,GAAA,KAAK,CAAC,CAAA;AAAA,KAC5D,CAAA;AACA,IAAA,MAAM,MAAM,IAAK,CAAA,GAAA;AAAA,MACfA,MAAK,MAAS,GAAA,MAAA;AAAA,MACd,IAAA,CAAK,GAAIA,CAAAA,KAAAA,CAAK,GAAK,EAAA,IAAA,CAAK,KAAM,CAAA,GAAA,CAAI,CAAI,GAAA,CAAA,CAAE,QAAW,GAAA,MAAM,CAAC,CAAA;AAAA,KAC5D,CAAA;AACA,IAAA,MAAM,CAAC,CAAG,EAAA,CAAA,EAAG,GAAG,CAAC,CAAA,GAAK,KAAK,QAAW,GAAA;AAAA,MACpC,IAAA;AAAA,MACA,GAAA;AAAA,MACA,IAAO,GAAA,KAAA;AAAA,MACP,GAAM,GAAA,MAAA;AAAA,KACR,CAAA;AAEA,IAAA,MAAM,UAAwB,GAAA,GAAA,CAAI,QAAS,CAAA,UAAA,GACvC,CAAC,CAAA,EAAGA,KAAK,CAAA,GAAA,EAAK,CAAGA,EAAAA,KAAAA,CAAK,MAAQ,EAAA,CAAA,EAAGA,MAAK,GAAK,EAAA,CAAA,EAAGA,KAAK,CAAA,MAAM,CACzD,GAAA,CAACA,KAAK,CAAA,IAAA,EAAM,CAAGA,EAAAA,KAAAA,CAAK,KAAO,EAAA,CAAA,EAAGA,KAAK,CAAA,IAAA,EAAM,CAAGA,EAAAA,KAAAA,CAAK,OAAO,CAAC,CAAA,CAAA;AAE7D,IAAA,OAAO,EAAE,CAAA,EAAG,CAAG,EAAA,CAAA,EAAG,GAAG,UAAW,EAAA,CAAA;AAAA,GAClC;AAAA;AAAA;AAAA;AAAA,EAKA,kBAAA,CAAmB,WAAmB,SAAuB,EAAA;AAC3D,IAAA,MAAM,EAAE,GAAA,EAAK,UAAYA,EAAAA,KAAAA,EAAS,GAAA,IAAA,CAAA;AAClC,IAAA,MAAM,EAAE,KAAO,EAAA,cAAA,EAAgB,MAAQ,EAAA,eAAA,EAAiB,UAAa,GAAA,GAAA,CAAA;AAErE,IAAM,MAAA,EAAE,OAAO,cAAgB,EAAA,MAAA,EAAQ,iBACrC,GAAA,SAAA,EAAW,iBAAiB,EAAC,CAAA;AAC/B,IAAM,MAAA,UAAA,GAAa,mBAAmB,eAAmB,IAAA,CAAA,CAAA;AACzD,IAAM,MAAA,SAAA,GAAY,kBAAkB,cAAkB,IAAA,CAAA,CAAA;AAEtD,IAAA,IAAA,CAAK,QAAW,GAAA,KAAA,CAAA,CAAA;AAEhB,IAAM,MAAA,EAAE,KAAK,CAAG,EAAA,IAAA,EAAM,GAAG,KAAO,EAAA,CAAA,EAAG,MAAQ,EAAA,CAAA,EAAMA,GAAAA,KAAAA,CAAAA;AAEjD,IAAA,MAAM,KAAQ,GAAA,CAAA,CAAA;AACd,IAAA,MAAM,GAAM,GAAA,IAAA,CAAK,KAAM,CAAA,SAAA,GAAY,CAAC,CAAI,GAAA,KAAA,CAAA;AAExC,IAAA,QAAQ,QAAU;AAAA,MAChB,KAAK,QAAS,CAAA,KAAA,CAAA;AAAA,MACd,KAAK,SAAS,MAAQ,EAAA;AACpB,QAAA,MAAM,UAAa,GAAA,IAAA,CAAK,KAAO,CAAA,CAAA,CAAA,GAAI,KAAK,CAAC,CAAA,CAAA;AACzC,QAAM,MAAA,MAAA,GAAS,aACX,IAAK,CAAA,GAAA,CAAI,YAAY,IAAK,CAAA,KAAA,CAAM,UAAU,CAAC,CAC3C,GAAA,UAAA,CAAA;AACJ,QAAO,OAAA,SAAA,IAAa,CAAI,GAAA,SAAA,GAAY,CAChC,GAAA,CAAC,IAAI,GAAK,EAAA,CAAA,GAAI,GAAK,EAAA,CAAA,GAAI,SAAY,GAAA,GAAA,EAAK,IAAI,GAAM,GAAA,MAAM,CACxD,GAAA,CAAC,CAAI,GAAA,GAAA,EAAK,CAAI,GAAA,GAAA,EAAK,CAAI,GAAA,GAAA,EAAK,CAAI,GAAA,GAAA,GAAM,MAAM,CAAA,CAAA;AAAA,OAClD;AAAA,MACA,KAAK,SAAS,IAAM,EAAA;AAClB,QAAA,MAAM,SAAY,GAAA,IAAA,CAAK,KAAO,CAAA,CAAA,CAAA,GAAI,KAAK,CAAC,CAAA,CAAA;AACxC,QAAM,MAAA,KAAA,GAAQ,YACV,IAAK,CAAA,GAAA,CAAI,WAAW,IAAK,CAAA,KAAA,CAAM,SAAS,CAAC,CACzC,GAAA,SAAA,CAAA;AACJ,QAAO,OAAA,UAAA,IAAc,CAAI,GAAA,UAAA,GAAa,CAClC,GAAA,CAAC,IAAI,GAAK,EAAA,CAAA,GAAI,GAAK,EAAA,CAAA,GAAI,GAAM,GAAA,KAAA,EAAO,IAAI,UAAa,GAAA,GAAG,CACxD,GAAA,CAAC,CAAI,GAAA,GAAA,EAAK,CAAI,GAAA,GAAA,EAAK,CAAI,GAAA,GAAA,GAAM,KAAO,EAAA,CAAA,GAAI,GAAG,CAAA,CAAA;AAAA,OACjD;AAAA,MACA,KAAK,SAAS,IAAM,EAAA;AAClB,QAAA,MAAM,SAAY,GAAA,IAAA,CAAK,KAAO,CAAA,CAAA,CAAA,GAAI,KAAK,CAAC,CAAA,CAAA;AACxC,QAAM,MAAA,KAAA,GAAQ,YACV,IAAK,CAAA,GAAA,CAAI,WAAW,IAAK,CAAA,KAAA,CAAM,SAAS,CAAC,CACzC,GAAA,SAAA,CAAA;AACJ,QAAO,OAAA,UAAA,IAAc,CAAI,GAAA,UAAA,GAAa,CAClC,GAAA,CAAC,IAAI,GAAM,GAAA,KAAA,EAAO,CAAI,GAAA,GAAA,EAAK,CAAI,GAAA,GAAA,EAAK,IAAI,UAAa,GAAA,GAAG,CACxD,GAAA,CAAC,CAAI,GAAA,GAAA,GAAM,KAAO,EAAA,CAAA,GAAI,GAAK,EAAA,CAAA,GAAI,GAAK,EAAA,CAAA,GAAI,GAAG,CAAA,CAAA;AAAA,OACjD;AAAA,MACA,KAAK,SAAS,KAAO,EAAA;AACnB,QAAA,MAAM,UAAa,GAAA,IAAA,CAAK,KAAO,CAAA,CAAA,CAAA,GAAI,KAAK,CAAC,CAAA,CAAA;AACzC,QAAM,MAAA,MAAA,GAAS,aACX,IAAK,CAAA,GAAA,CAAI,YAAY,IAAK,CAAA,KAAA,CAAM,UAAU,CAAC,CAC3C,GAAA,UAAA,CAAA;AAEJ,QAAO,OAAA,SAAA,IAAa,CAAI,GAAA,SAAA,GAAY,CAChC,GAAA,CAAC,IAAI,GAAK,EAAA,CAAA,GAAI,GAAM,GAAA,MAAA,EAAQ,CAAI,GAAA,SAAA,GAAY,KAAK,CAAI,GAAA,GAAG,CACxD,GAAA,CAAC,CAAI,GAAA,GAAA,EAAK,CAAI,GAAA,GAAA,GAAM,MAAQ,EAAA,CAAA,GAAI,GAAK,EAAA,CAAA,GAAI,GAAG,CAAA,CAAA;AAAA,OAClD;AAAA,MACA,KAAK,SAAS,MAAQ,EAAA;AACpB,QAAO,OAAA,CAAC,IAAI,GAAK,EAAA,CAAA,GAAI,KAAK,CAAI,GAAA,GAAA,EAAK,IAAI,GAAG,CAAA,CAAA;AAAA,OAC5C;AAAA,MACA;AACE,QAAQ,OAAA,CAAA,IAAA,CAAK,CAA0C,uCAAA,EAAA,QAAQ,CAAE,CAAA,CAAA,CAAA;AACjE,QAAO,OAAA,IAAA,CAAA;AAAA,KACX;AAAA,GACF;AAAA,EAEA,QAAW,GAAA;AACT,IAAA,IAAA,CAAK,MAAS,GAAA,IAAA,CAAA;AACd,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AAAA,EAEA,OAA0B,GAAA;AAExB,IAAA,IAAI,UAAgC,GAAA,IAAA,CAAA;AACpC,IAAM,MAAA,WAAA,GAAc,CAAC,UAAU,CAAA,CAAA;AAE/B,IAAQ,OAAA,UAAA,GAAa,WAAW,cAAiB,EAAA;AAC/C,MAAA,WAAA,CAAY,KAAK,UAAU,CAAA,CAAA;AAAA,KAC7B;AACA,IAAO,OAAA,WAAA,CAAA;AAAA,GACT;AAAA,EAEA,OAAO,oBAAoB,UAAkD,EAAA;AAC3E,IAAO,OAAA,UAAA,KAAe,OAClB,IACA,GAAA,UAAA,EAAY,SACZ,UACA,GAAA,UAAA,CAAW,mBAAoB,CAAA,UAAA,CAAW,cAAc,CAAA,CAAA;AAAA,GAC9D;AACF,CAAA;AAGO,SAAS,mBACd,CACA,EAAA,CAAA,EACA,UACA,EAAA,YAAA,EACA,eACA,gBACA,EAAA;AACA,EAAA,IAAI,UAAa,GAAA,IAAA,CAAA;AAEjB,EAAA,MAAM,0BAA0B,QAAS,CAAA,uBAAA;AAAA,IACvC,UAAA;AAAA,IACA,YAAA;AAAA,IACA,CAAA;AAAA,IACA,CAAA;AAAA,IACA,gBAAA;AAAA,GACF,CAAA;AAEA,EAAA,IAAI,wBAAwB,MAAQ,EAAA;AAClC,IAAA,MAAM,CAAC,SAAA,EAAW,GAAG,UAAU,CAAI,GAAA,uBAAA,CAAA;AACnC,IAAM,MAAA;AAAA,MACJ,WAAa,EAAA,QAAA;AAAA,MACb,IAAO,GAAA,QAAA;AAAA,MACP,sBAAwB,EAAA,gBAAA;AAAA,KAC1B,GAAI,SAAS,SAAS,CAAA,CAAA;AACtB,IAAM,MAAA,UAAA,GAAa,aAAa,IAAI,CAAA,CAAA;AACpC,IAAM,MAAA,sBAAA,GACJ,aAAiB,IAAA,gBAAA,GAAmB,KAAQ,GAAA,KAAA,CAAA,CAAA;AAC9C,IAAA,MAAM,GAAM,GAAA,WAAA,CAAY,CAAG,EAAA,CAAA,EAAG,YAAY,sBAAsB,CAAA,CAAA;AAChE,IAAM,MAAA,GAAA,GAAM,aAAa,IAAI,CAAA,CAAA;AAE7B,IAAA,MAAM,cAAiB,GAAA,CAAC,CAAC,UAAA,EAAe,UAAO,CAE9B,KAAA;AACf,MAAA,IAAI,GAAI,CAAA,QAAA,EAAU,MAAU,IAAA,GAAA,CAAI,cAAgB,EAAA;AAC9C,QAAA,MAAM,cAAiB,GAAA,iBAAA;AAAA,UACrB,UAAA;AAAA,UACA,GAAA;AAAA,UACA,GAAA;AAAA,UACA,YAAA;AAAA,UACA,CAAA;AAAA,UACA,CAAA;AAAA,SACF,CAAA;AACA,QAAA,IAAI,cAAgB,EAAA;AAClB,UAAM,MAAA,CAAC,YAAcC,EAAAA,WAAU,CAAI,GAAA,cAAA,CAAA;AAEnC,UAAA,OAAO,IAAI,UAAW,CAAA;AAAA,YACpB,SAAW,EAAA,UAAA;AAAA,YACX,GAAK,EAAA,YAAA;AAAA,YACL,UAAAA,EAAAA,WAAAA;AAAA,YACA,cAAA,EAAgB,cAAe,CAAA,OAAO,CAAK,IAAA,IAAA;AAAA,WAC5C,CAAA,CAAA;AAAA,SACH,MAAA,IAAW,QAAQ,MAAQ,EAAA;AACzB,UAAA,OAAO,eAAe,OAAO,CAAA,CAAA;AAAA,SAC/B;AAAA,OACF;AAAA,KACF,CAAA;AACA,IAAA,UAAA,GAAa,IAAI,UAAW,CAAA;AAAA,MAC1B,SAAA;AAAA,MACA,GAAA;AAAA,MACA,UAAA;AAAA,MACA,cAAA,EAAgB,cAAe,CAAA,UAAU,CAAK,IAAA,IAAA;AAAA,KAC/C,EAAE,QAAS,EAAA,CAAA;AAAA,GACd;AAEA,EAAO,OAAA,UAAA,CAAA;AACT,CAAA;AAEA,SAAS,iBAAA,CACP,WACA,EAAE,cAAA,EAAgB,UAClB,EAAA,GAAA,EACA,YACA,EAAA,CAAA,EACA,CACqC,EAAA;AACrC,EAAA,IAAI,CAAC,SAAA,IAAa,SAAU,CAAA,IAAA,KAAS,iBAAmB,EAAA;AACtD,IAAA,OAAA;AAAA,GACF;AAEA,EAAA,MAAM,aAAgB,GAAA,YAAA,CAAa,SAAU,CAAA,KAAA,CAAM,IAAI,CAAA,CAAA;AACvD,EAAM,MAAA,UAAA,GAAa,iBAAiB,cAAe,CAAA,KAAA,CAAA;AACnD,EAAM,MAAA,YAAA,GAAe,iBAAiB,cAAe,CAAA,IAAA,CAAA;AACrD,EAAM,MAAA,aAAA,GAAgB,iBAAiB,cAAe,CAAA,KAAA,CAAA;AACtD,EAAM,MAAA,WAAA,GAAc,iBAAiB,cAAe,CAAA,IAAA,CAAA;AAEpD,EAAA,MAAM,KACH,GAAA,CAAA,UAAA,IAAc,QAAS,CAAA,MAAA,KACxB,IAAK,CAAA,KAAA,CAAM,GAAI,CAAA,GAAG,CAAM,KAAA,IAAA,CAAK,KAAM,CAAA,aAAA,CAAc,GAAG,CAAA,CAAA;AACtD,EAAM,MAAA,OAAA,GACJ,YAAgB,IAAA,IAAA,CAAK,KAAM,CAAA,GAAA,CAAI,KAAK,CAAM,KAAA,IAAA,CAAK,KAAM,CAAA,aAAA,CAAc,KAAK,CAAA,CAAA;AAC1E,EAAM,MAAA,QAAA,GACJ,aACA,IAAA,IAAA,CAAK,KAAM,CAAA,GAAA,CAAI,MAAM,CAAM,KAAA,IAAA,CAAK,KAAM,CAAA,aAAA,CAAc,MAAM,CAAA,CAAA;AAC5D,EAAM,MAAA,MAAA,GACJ,WAAe,IAAA,IAAA,CAAK,KAAM,CAAA,GAAA,CAAI,IAAI,CAAM,KAAA,IAAA,CAAK,KAAM,CAAA,aAAA,CAAc,IAAI,CAAA,CAAA;AAEvE,EAAI,IAAA,KAAA,IAAS,OAAW,IAAA,QAAA,IAAY,MAAQ,EAAA;AAC1C,IAAA,MAAM,EAAE,WAAa,EAAA,QAAA,EAAU,IAAO,GAAA,QAAA,KAAa,SAAU,CAAA,KAAA,CAAA;AAC7D,IAAM,MAAA,UAAA,GAAa,aAAa,IAAI,CAAA,CAAA;AACpC,IAAA,MAAM,YAAe,GAAA,WAAA,CAAY,CAAG,EAAA,CAAA,EAAG,UAAU,CAAA,CAAA;AAGjD,IAAA,IAAA,CACG,OAAO,SAAS,CAAA,IAAK,kBAAkB,SAAS,CAAA,KACjD,iBAAiB,QACjB,EAAA;AACA,MAAA,YAAA,CAAa,KAAQ,GAAA,GAAA,CAAA;AACrB,MAAO,OAAA,CAAC,cAAc,UAAU,CAAA,CAAA;AAAA,KAClC,MAAA,IAAA,CAGG,MAAO,CAAA,SAAS,CAAK,IAAA,iBAAA,CAAkB,SAAS,CAChD,MAAA,QAAA,CAAS,MAAU,IAAA,cAAA,GAAiB,UACrC,CAAA,EAAA;AACA,MAAA,YAAA,CAAa,MAAS,GAAA,GAAA,CAAA;AACtB,MAAO,OAAA,CAAC,cAAc,UAAU,CAAA,CAAA;AAAA,KAClC;AAAA,GACF;AACF,CAAA;AAEA,SAAS,kBAAkB,SAAwB,EAAA;AACjD,EAAO,OAAA,MAAA,CAAO,SAAS,CAAM,KAAA,OAAA,CAAA;AAC/B,CAAA;AAEA,SAAS,OAAO,SAAwB,EAAA;AACtC,EAAA,OACE,OAAO,SAAS,CAAA,KAAM,aACtB,SAAU,CAAA,KAAA,CAAM,MAAM,aAAkB,KAAA,QAAA,CAAA;AAE5C,CAAA;AAEA,SAAS,OAAO,SAAwB,EAAA;AACtC,EAAA,OACE,OAAO,SAAS,CAAA,KAAM,aACtB,SAAU,CAAA,KAAA,CAAM,MAAM,aAAkB,KAAA,KAAA,CAAA;AAE5C;;;;"}
|
|
1
|
+
{"version":3,"file":"DropTarget.js","sources":["../../src/drag-drop/DropTarget.ts"],"sourcesContent":["import { rect, rectTuple } from \"@vuu-ui/vuu-utils\";\nimport { LayoutModel } from \"../layout-reducer\";\nimport { getProps, typeOf } from \"../utils\";\nimport {\n BoxModel,\n getPosition,\n Measurements,\n Position,\n positionValues,\n RelativeDropPosition,\n} from \"./BoxModel\";\nimport { DragDropRect, DropPos, DropPosTab } from \"./dragDropTypes\";\nimport { DragState } from \"./DragState\";\n\nexport const isTabstrip = (dropTarget: DropTarget) =>\n dropTarget.pos.tab &&\n typeOf(dropTarget.component) === \"Stack\" &&\n dropTarget.pos.position.Header;\n\nconst { north, south, east, west } = positionValues;\nconst eastwest = east + west;\nconst northsouth = north + south;\n\nexport interface DropTargetProps {\n component: LayoutModel;\n pos: DropPos;\n clientRect: DragDropRect;\n nextDropTarget: DropTarget | null;\n}\n\nexport type GuideLine = [\n number,\n number,\n number,\n number,\n number,\n number,\n number,\n number\n];\nexport interface TargetDropOutline {\n l: number;\n r: number;\n t: number;\n b: number;\n tabLeft?: number;\n tabWidth?: number;\n tabHeight?: number;\n guideLines?: GuideLine;\n}\n\nexport class DropTarget {\n private active: boolean;\n\n public box: unknown;\n public clientRect: DragDropRect;\n public component: LayoutModel;\n public dropRect: rectTuple | undefined;\n public nextDropTarget: DropTarget | null;\n public pos: DropPos;\n\n constructor({\n component,\n pos,\n clientRect /*, closeToTheEdge*/,\n nextDropTarget,\n }: DropTargetProps) {\n this.component = component;\n this.pos = pos;\n this.clientRect = clientRect;\n this.nextDropTarget = nextDropTarget;\n this.active = false;\n this.dropRect = undefined;\n }\n\n targetTabPos(tab: DropPosTab) {\n const { left: tabLeft, width: tabWidth, positionRelativeToTab } = tab;\n return positionRelativeToTab === RelativeDropPosition.BEFORE\n ? tabLeft\n : tabLeft + tabWidth;\n }\n\n /**\n * Determine what will be rendered by the dropTargetRenderer\n *\n * @param {*} lineWidth\n * @param {*} dragState\n * @returns {l, t, r, b, tabLeft, tabWidth, tabHeight}\n */\n getTargetDropOutline(\n lineWidth: number,\n dragState?: DragState\n ): TargetDropOutline {\n if (this.pos.tab) {\n return this.getDropTabOutline(lineWidth, this.pos.tab);\n } else if (dragState && dragState.hasIntrinsicSize()) {\n return this.getIntrinsicDropRect(dragState);\n } else {\n const [l, t, r, b] = this.getDropRectOutline(\n lineWidth,\n dragState\n ) as rectTuple;\n return { l, t, r, b };\n }\n }\n\n getDropTabOutline(lineWidth: number, tab: DropPosTab): TargetDropOutline {\n const {\n clientRect: { top, left, right, bottom, header },\n } = this;\n\n const inset = 0;\n const gap = Math.round(lineWidth / 2) + inset;\n\n const t = Math.round(top);\n const l = Math.round(left + gap);\n const r = Math.round(right - gap);\n const b = Math.round(bottom - gap);\n const tabLeft = this.targetTabPos(tab);\n const tabWidth = 60; // should really measure text\n const tabHeight = (header?.bottom ?? 0) - (header?.top ?? 0);\n return { l, t, r, b, tabLeft, tabWidth, tabHeight };\n }\n\n getIntrinsicDropRect(dragState: DragState): TargetDropOutline {\n const { pos, clientRect: rect } = this;\n\n const { x, y } = dragState;\n\n let height = dragState.intrinsicSize?.height ?? 0;\n let width = dragState.intrinsicSize?.height ?? 0;\n\n if (height && height > rect.height) {\n console.log(`DropTarget: we're going to blow the gaff`);\n height = rect.height;\n } else if (width && width > rect.width) {\n console.log(`DropTarget: we're going to blow the gaff`);\n width = rect.width;\n }\n\n const left = Math.min(\n rect.right - width,\n Math.max(rect.left, Math.round(pos.x - x.mousePct * width))\n );\n const top = Math.min(\n rect.bottom - height,\n Math.max(rect.top, Math.round(pos.y - y.mousePct * height))\n );\n const [l, t, r, b] = (this.dropRect = [\n left,\n top,\n left + width,\n top + height,\n ]);\n\n const guideLines: GuideLine = pos.position.EastOrWest\n ? [l, rect.top, l, rect.bottom, r, rect.top, r, rect.bottom]\n : [rect.left, t, rect.right, t, rect.left, b, rect.right, b];\n\n return { l, r, t, b, guideLines };\n }\n\n /**\n * @returns [left, top, right, bottom]\n */\n getDropRectOutline(lineWidth: number, dragState?: DragState) {\n const { pos, clientRect: rect } = this;\n const { width: suggestedWidth, height: suggestedHeight, position } = pos;\n\n const { width: intrinsicWidth, height: intrinsicHeight } =\n dragState?.intrinsicSize ?? {};\n const sizeHeight = intrinsicHeight ?? suggestedHeight ?? 0;\n const sizeWidth = intrinsicWidth ?? suggestedWidth ?? 0;\n\n this.dropRect = undefined;\n\n const { top: t, left: l, right: r, bottom: b } = rect;\n\n const inset = 0;\n const gap = Math.round(lineWidth / 2) + inset;\n\n switch (position) {\n case Position.North:\n case Position.Header: {\n const halfHeight = Math.round((b - t) / 2);\n const height = sizeHeight\n ? Math.min(halfHeight, Math.round(sizeHeight))\n : halfHeight;\n return sizeWidth && l + sizeWidth < r\n ? [l + gap, t + gap, l + sizeWidth - gap, t + gap + height] // need flex direction indicator\n : [l + gap, t + gap, r - gap, t + gap + height];\n }\n case Position.West: {\n const halfWidth = Math.round((r - l) / 2);\n const width = sizeWidth\n ? Math.min(halfWidth, Math.round(sizeWidth))\n : halfWidth;\n return sizeHeight && t + sizeHeight < b\n ? [l + gap, t + gap, l - gap + width, t + sizeHeight + gap] // need flex direction indicator\n : [l + gap, t + gap, l - gap + width, b - gap];\n }\n case Position.East: {\n const halfWidth = Math.round((r - l) / 2);\n const width = sizeWidth\n ? Math.min(halfWidth, Math.round(sizeWidth))\n : halfWidth;\n return sizeHeight && t + sizeHeight < b\n ? [r - gap - width, t + gap, r - gap, t + sizeHeight + gap] // need flex direction indicator\n : [r - gap - width, t + gap, r - gap, b - gap];\n }\n case Position.South: {\n const halfHeight = Math.round((b - t) / 2);\n const height = sizeHeight\n ? Math.min(halfHeight, Math.round(sizeHeight))\n : halfHeight;\n\n return sizeWidth && l + sizeWidth < r\n ? [l + gap, b - gap - height, l + sizeWidth - gap, b - gap] // need flex direction indicator\n : [l + gap, b - gap - height, r - gap, b - gap];\n }\n case Position.Centre: {\n return [l + gap, t + gap, r - gap, b - gap];\n }\n default:\n console.warn(`DropTarget does not recognize position ${position}`);\n return null;\n }\n }\n\n activate() {\n this.active = true;\n return this;\n }\n\n toArray(this: DropTarget) {\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n let dropTarget: DropTarget | null = this;\n const dropTargets = [dropTarget];\n // eslint-disable-next-line no-cond-assign\n while ((dropTarget = dropTarget.nextDropTarget)) {\n dropTargets.push(dropTarget);\n }\n return dropTargets;\n }\n\n static getActiveDropTarget(dropTarget: DropTarget | null): DropTarget | null {\n return dropTarget === null\n ? null\n : dropTarget?.active\n ? dropTarget\n : DropTarget.getActiveDropTarget(dropTarget.nextDropTarget);\n }\n}\n\n// Initial entry to this method is always via the app (may be it should be *on* the app)\nexport function identifyDropTarget(\n x: number,\n y: number,\n rootLayout: LayoutModel,\n measurements: Measurements,\n intrinsicSize?: number,\n validDropTargets?: string[]\n) {\n let dropTarget = null;\n\n const allBoxesContainingPoint = BoxModel.allBoxesContainingPoint(\n rootLayout,\n measurements,\n x,\n y,\n validDropTargets\n );\n\n if (allBoxesContainingPoint.length) {\n const [component, ...containers] = allBoxesContainingPoint;\n const {\n \"data-path\": dataPath,\n path = dataPath,\n \"data-row-placeholder\": isRowPlaceholder,\n } = getProps(component);\n const clientRect = measurements[path];\n const placeholderOrientation =\n intrinsicSize && isRowPlaceholder ? \"row\" : undefined;\n const pos = getPosition(x, y, clientRect, placeholderOrientation);\n const box = measurements[path];\n\n const nextDropTarget = ([nextTarget, ...targets]: LayoutModel[]):\n | DropTarget\n | undefined => {\n if (pos.position?.Header || pos.closeToTheEdge) {\n const targetPosition = getTargetPosition(\n nextTarget,\n pos,\n box,\n measurements,\n x,\n y\n );\n if (targetPosition) {\n const [containerPos, clientRect] = targetPosition;\n\n return new DropTarget({\n component: nextTarget,\n pos: containerPos,\n clientRect,\n nextDropTarget: nextDropTarget(targets) ?? null,\n });\n } else if (targets.length) {\n return nextDropTarget(targets);\n }\n }\n };\n dropTarget = new DropTarget({\n component,\n pos,\n clientRect,\n nextDropTarget: nextDropTarget(containers) ?? null,\n }).activate();\n }\n\n return dropTarget;\n}\n\nfunction getTargetPosition(\n container: LayoutModel,\n { closeToTheEdge, position }: DropPos,\n box: rect,\n measurements: Measurements,\n x: number,\n y: number\n): [DropPos, DragDropRect] | undefined {\n if (!container || container.type === \"DraggableLayout\") {\n return;\n }\n\n const containingBox = measurements[container.props.path];\n const closeToTop = closeToTheEdge & positionValues.north;\n const closeToRight = closeToTheEdge & positionValues.east;\n const closeToBottom = closeToTheEdge & positionValues.south;\n const closeToLeft = closeToTheEdge & positionValues.west;\n\n const atTop =\n (closeToTop || position.Header) &&\n Math.round(box.top) === Math.round(containingBox.top);\n const atRight =\n closeToRight && Math.round(box.right) === Math.round(containingBox.right);\n const atBottom =\n closeToBottom &&\n Math.round(box.bottom) === Math.round(containingBox.bottom);\n const atLeft =\n closeToLeft && Math.round(box.left) === Math.round(containingBox.left);\n\n if (atTop || atRight || atBottom || atLeft) {\n const { \"data-path\": dataPath, path = dataPath } = container.props;\n const clientRect = measurements[path];\n const containerPos = getPosition(x, y, clientRect);\n\n // if its a VBox and we're close to left or right ...\n if (\n (isVBox(container) || isTabbedContainer(container)) &&\n closeToTheEdge & eastwest\n ) {\n containerPos.width = 120;\n return [containerPos, clientRect];\n }\n // if it's a HBox and we're close to top or bottom ...\n else if (\n (isHBox(container) || isTabbedContainer(container)) &&\n (position.Header || closeToTheEdge & northsouth)\n ) {\n containerPos.height = 120;\n return [containerPos, clientRect];\n }\n }\n}\n\nfunction isTabbedContainer(component: LayoutModel) {\n return typeOf(component) === \"Stack\";\n}\n\nfunction isVBox(component: LayoutModel) {\n return (\n typeOf(component) === \"Flexbox\" &&\n component.props.style.flexDirection === \"column\"\n );\n}\n\nfunction isHBox(component: LayoutModel) {\n return (\n typeOf(component) === \"Flexbox\" &&\n component.props.style.flexDirection === \"row\"\n );\n}\n"],"names":["rect","clientRect"],"mappings":"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"}
|
|
@@ -3,7 +3,7 @@ import { useCallback } from 'react';
|
|
|
3
3
|
import { Action } from '../layout-action.js';
|
|
4
4
|
import { useLayoutProviderDispatch } from '../layout-provider/LayoutProvider.js';
|
|
5
5
|
import '../layout-provider/LayoutProviderContext.js';
|
|
6
|
-
import { registerComponent } from '
|
|
6
|
+
import { registerComponent } from '@vuu-ui/vuu-utils';
|
|
7
7
|
import Flexbox from './Flexbox.js';
|
|
8
8
|
|
|
9
9
|
const FlexboxLayout = function FlexboxLayout2(props) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FlexboxLayout.js","sources":["../../src/flexbox/FlexboxLayout.tsx"],"sourcesContent":["import { useCallback } from \"react\";\nimport { Action } from \"../layout-action\";\nimport { useLayoutProviderDispatch } from \"../layout-provider\";\nimport { SplitterResizeAction } from \"../layout-reducer\";\nimport { registerComponent } from \"
|
|
1
|
+
{"version":3,"file":"FlexboxLayout.js","sources":["../../src/flexbox/FlexboxLayout.tsx"],"sourcesContent":["import { useCallback } from \"react\";\nimport { Action } from \"../layout-action\";\nimport { useLayoutProviderDispatch } from \"../layout-provider\";\nimport { SplitterResizeAction } from \"../layout-reducer\";\nimport { registerComponent } from \"@vuu-ui/vuu-utils\";\nimport Flexbox from \"./Flexbox\";\nimport { FlexboxLayoutProps } from \"./flexboxTypes\";\n\nexport const FlexboxLayout = function FlexboxLayout(props: FlexboxLayoutProps) {\n const { path } = props;\n const dispatch = useLayoutProviderDispatch();\n\n const handleSplitterMoved = useCallback(\n (sizes) => {\n dispatch({\n type: Action.SPLITTER_RESIZE,\n path,\n sizes,\n } as SplitterResizeAction);\n },\n [dispatch, path]\n );\n\n return <Flexbox {...props} onSplitterMoved={handleSplitterMoved} />;\n};\nFlexboxLayout.displayName = \"Flexbox\";\n\nregisterComponent(\"Flexbox\", FlexboxLayout, \"container\");\n"],"names":["FlexboxLayout"],"mappings":";;;;;;;;AAQa,MAAA,aAAA,GAAgB,SAASA,cAAAA,CAAc,KAA2B,EAAA;AAC7E,EAAM,MAAA,EAAE,MAAS,GAAA,KAAA,CAAA;AACjB,EAAA,MAAM,WAAW,yBAA0B,EAAA,CAAA;AAE3C,EAAA,MAAM,mBAAsB,GAAA,WAAA;AAAA,IAC1B,CAAC,KAAU,KAAA;AACT,MAAS,QAAA,CAAA;AAAA,QACP,MAAM,MAAO,CAAA,eAAA;AAAA,QACb,IAAA;AAAA,QACA,KAAA;AAAA,OACuB,CAAA,CAAA;AAAA,KAC3B;AAAA,IACA,CAAC,UAAU,IAAI,CAAA;AAAA,GACjB,CAAA;AAEA,EAAA,uBAAQ,GAAA,CAAA,OAAA,EAAA,EAAS,GAAG,KAAA,EAAO,iBAAiB,mBAAqB,EAAA,CAAA,CAAA;AACnE,EAAA;AACA,aAAA,CAAc,WAAc,GAAA,SAAA,CAAA;AAE5B,iBAAkB,CAAA,SAAA,EAAW,eAAe,WAAW,CAAA;;;;"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { registerComponent } from '
|
|
2
|
+
import { registerComponent } from '@vuu-ui/vuu-utils';
|
|
3
3
|
import { FluidGrid } from './FluidGrid.js';
|
|
4
4
|
|
|
5
5
|
const FluidGridLayout = function FluidGridLayout2(props) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FluidGridLayout.js","sources":["../../src/flexbox/FluidGridLayout.tsx"],"sourcesContent":["import { registerComponent } from
|
|
1
|
+
{"version":3,"file":"FluidGridLayout.js","sources":["../../src/flexbox/FluidGridLayout.tsx"],"sourcesContent":["import { registerComponent } from \"@vuu-ui/vuu-utils\";\nimport { FluidGrid, FluidGridProps } from \"./FluidGrid\";\n\nexport const FluidGridLayout = function FluidGridLayout(props: FluidGridProps) {\n return <FluidGrid {...props} />;\n};\nFluidGridLayout.displayName = \"FluidGrid\";\n\nregisterComponent(\"FluidGrid\", FluidGridLayout, \"container\");\n"],"names":["FluidGridLayout"],"mappings":";;;;AAGa,MAAA,eAAA,GAAkB,SAASA,gBAAAA,CAAgB,KAAuB,EAAA;AAC7E,EAAO,uBAAA,GAAA,CAAC,SAAW,EAAA,EAAA,GAAG,KAAO,EAAA,CAAA,CAAA;AAC/B,EAAA;AACA,eAAA,CAAgB,WAAc,GAAA,WAAA,CAAA;AAE9B,iBAAkB,CAAA,WAAA,EAAa,iBAAiB,WAAW,CAAA;;;;"}
|
|
@@ -1 +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":"
|
|
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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"}
|
package/esm/index.js
CHANGED
|
@@ -22,7 +22,6 @@ export { useViewActionDispatcher } from './layout-view-actions/useViewActionDisp
|
|
|
22
22
|
export { ViewContext, useViewContext, useViewDispatch } from './layout-view-actions/ViewContext.js';
|
|
23
23
|
export { Palette, PaletteItem } from './palette/Palette.js';
|
|
24
24
|
export { Placeholder } from './placeholder/Placeholder.js';
|
|
25
|
-
export { ComponentRegistry, isContainer, isLayoutComponent, isView, registerComponent } from './registry/ComponentRegistry.js';
|
|
26
25
|
export { useBreakpoints } from './responsive/use-breakpoints.js';
|
|
27
26
|
export { HeightOnly, WidthHeight, WidthOnly, resizeObserver, useResizeObserver } from './responsive/useResizeObserver.js';
|
|
28
27
|
export { extractResponsiveProps, isResponsiveAttribute } from './responsive/utils.js';
|
package/esm/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LayoutProvider.js","sources":["../../src/layout-provider/LayoutProvider.tsx"],"sourcesContent":["import {\n MutableRefObject,\n ReactElement,\n useCallback,\n useContext,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport {\n LayoutActionType,\n LayoutChangeHandler,\n LayoutChangeReason,\n layoutFromJson,\n LayoutJSON,\n layoutQuery,\n layoutReducer,\n LayoutReducerAction,\n layoutToJSON,\n processLayoutElement,\n SaveAction,\n} from \"../layout-reducer\";\nimport { findTarget, getChildProp, getProp, getProps, typeOf } from \"../utils\";\nimport {\n LayoutProviderContext,\n LayoutProviderDispatch,\n} from \"./LayoutProviderContext\";\nimport { useLayoutDragDrop } from \"./useLayoutDragDrop\";\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst withDropTarget = (props: any) => props.dropTarget;\nconst shouldSave = (action: LayoutReducerAction) =>\n [\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 // TODO how can we make this more robust, shouldn't rely on 'main-tabs'\n if (action.id === \"main-tabs\") {\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 \"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 pathToDropTarget?: string;\n layout?: LayoutJSON;\n onLayoutChange?: LayoutChangeHandler;\n}\n\nexport const LayoutProviderVersion = () => {\n const version = useLayoutProviderVersion();\n return <div>{`Context: ${version} `}</div>;\n};\n\nexport const LayoutProvider = (props: LayoutProviderProps): ReactElement => {\n const { children, createNewChild, pathToDropTarget, layout, onLayoutChange } =\n 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 targetContainer =\n findTarget(source, withDropTarget) || state.current;\n const isDraggableLayout = typeOf(targetContainer) === \"DraggableLayout\";\n const target = isDraggableLayout\n ? getProps(targetContainer).children[0]\n : targetContainer;\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 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 (layout) {\n const targetContainer = findTarget(\n state.current as never,\n withDropTarget\n ) as ReactElement;\n if (targetContainer) {\n const target = getChildProp(targetContainer);\n const newLayout = layoutFromJson(\n layout,\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 (layout.id === getProp(state.current, \"id\")) {\n const newLayout = layoutFromJson(layout, \"0\");\n const action = {\n type: LayoutActionType.REPLACE,\n target: state.current,\n replacement: newLayout,\n };\n dispatchLayoutAction(action, true);\n }\n }\n }, [dispatchLayoutAction, layout]);\n\n if (state.current === undefined) {\n state.current = processLayoutElement(children);\n } else if (children !== childrenRef.current) {\n state.current = processLayoutElement(children, state.current);\n childrenRef.current = children;\n }\n\n return (\n <LayoutProviderContext.Provider\n value={{\n createNewChild,\n dispatchLayoutProvider: layoutActionDispatcher,\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 useLayoutCreateNewChild = () => {\n const { createNewChild } = useContext(LayoutProviderContext);\n return createNewChild;\n};\n\nexport const useLayoutProviderVersion = () => {\n const { version } = useContext(LayoutProviderContext);\n return version;\n};\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"LayoutProvider.js","sources":["../../src/layout-provider/LayoutProvider.tsx"],"sourcesContent":["import {\n MutableRefObject,\n ReactElement,\n useCallback,\n useContext,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport {\n LayoutActionType,\n layoutFromJson,\n layoutQuery,\n layoutReducer,\n layoutToJSON,\n processLayoutElement,\n type LayoutChangeHandler,\n type LayoutChangeReason,\n type LayoutJSON,\n type LayoutReducerAction,\n type SaveAction,\n} from \"../layout-reducer\";\nimport { findTarget, getChildProp, getProp, getProps, typeOf } from \"../utils\";\nimport {\n LayoutProviderContext,\n LayoutProviderDispatch,\n} from \"./LayoutProviderContext\";\nimport { useLayoutDragDrop } from \"./useLayoutDragDrop\";\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst withDropTarget = (props: any) => props.dropTarget;\nconst shouldSave = (action: LayoutReducerAction) =>\n [\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 // TODO how can we make this more robust, shouldn't rely on 'main-tabs'\n if (action.id === \"main-tabs\") {\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 \"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 pathToDropTarget?: string;\n layout?: LayoutJSON;\n onLayoutChange?: LayoutChangeHandler;\n}\n\nexport const LayoutProviderVersion = () => {\n const version = useLayoutProviderVersion();\n return <div>{`Context: ${version} `}</div>;\n};\n\nexport const LayoutProvider = (props: LayoutProviderProps): ReactElement => {\n const { children, createNewChild, pathToDropTarget, layout, onLayoutChange } =\n 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 targetContainer =\n findTarget(source, withDropTarget) || state.current;\n const isDraggableLayout = typeOf(targetContainer) === \"DraggableLayout\";\n const target = isDraggableLayout\n ? getProps(targetContainer).children[0]\n : targetContainer;\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 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 (layout) {\n const targetContainer = findTarget(\n state.current as never,\n withDropTarget\n ) as ReactElement;\n if (targetContainer) {\n const target = getChildProp(targetContainer);\n const newLayout = layoutFromJson(\n layout,\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 (layout.id === getProp(state.current, \"id\")) {\n const newLayout = layoutFromJson(layout, \"0\");\n const action = {\n type: LayoutActionType.REPLACE,\n target: state.current,\n replacement: newLayout,\n };\n dispatchLayoutAction(action, true);\n }\n }\n }, [dispatchLayoutAction, layout]);\n\n if (state.current === undefined) {\n state.current = processLayoutElement(children);\n } else if (children !== childrenRef.current) {\n state.current = processLayoutElement(children, state.current);\n childrenRef.current = children;\n }\n\n return (\n <LayoutProviderContext.Provider\n value={{\n createNewChild,\n dispatchLayoutProvider: layoutActionDispatcher,\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 useLayoutCreateNewChild = () => {\n const { createNewChild } = useContext(LayoutProviderContext);\n return createNewChild;\n};\n\nexport const useLayoutProviderVersion = () => {\n const { version } = useContext(LayoutProviderContext);\n return version;\n};\n"],"names":[],"mappings":"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"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import { uuid } from '@vuu-ui/vuu-utils';
|
|
1
|
+
import { uuid, getLayoutComponent } from '@vuu-ui/vuu-utils';
|
|
2
2
|
import React from 'react';
|
|
3
|
-
import { ComponentRegistry } from '../registry/ComponentRegistry.js';
|
|
4
3
|
import { resetPath } from '../utils/pathUtils.js';
|
|
5
4
|
import { getProps } from '../utils/propUtils.js';
|
|
6
5
|
|
|
@@ -174,8 +173,9 @@ function createFlexbox(flexDirection, props, children, path) {
|
|
|
174
173
|
const { flexFill, style, resizeable = true } = props;
|
|
175
174
|
const { flexBasis = flexFill ? void 0 : "auto" } = style;
|
|
176
175
|
const flex = getFlexValue(flexBasis, flexFill);
|
|
176
|
+
const FlexboxLayout = getLayoutComponent("Flexbox");
|
|
177
177
|
return React.createElement(
|
|
178
|
-
|
|
178
|
+
FlexboxLayout,
|
|
179
179
|
{
|
|
180
180
|
id,
|
|
181
181
|
key: id,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"flexUtils.js","sources":["../../src/layout-reducer/flexUtils.ts"],"sourcesContent":["import { dimension, rect, rectTuple, uuid } from \"@vuu-ui/vuu-utils\";\nimport React, { CSSProperties, ReactElement, ReactNode } from \"react\";\nimport { DropPos } from \"../drag-drop/dragDropTypes\";\nimport { ComponentRegistry } from \"../registry/ComponentRegistry\";\nimport { getProps, resetPath } from \"../utils\";\nconst placeHolderProps = { \"data-placeholder\": true, \"data-resizeable\": true };\n\nconst NO_STYLE = {};\nconst auto = \"auto\";\nconst defaultFlexStyle = {\n flexBasis: 0,\n flexGrow: 1,\n flexShrink: 1,\n height: auto,\n width: auto,\n};\n\nconst CROSS_DIMENSION = {\n height: \"width\",\n width: \"height\",\n};\n\nexport type flexDirection = \"row\" | \"column\";\n\ntype contraDimension = dimension;\ntype flexDimensionTuple = [dimension, contraDimension, flexDirection];\nexport type position = {\n height?: number;\n width?: number;\n};\n\nexport const getFlexDimensions = (flexDirection: flexDirection = \"row\") => {\n if (flexDirection === \"row\") {\n return [\"width\", \"height\", \"column\"] as flexDimensionTuple;\n } else {\n return [\"height\", \"width\", \"row\"] as flexDimensionTuple;\n }\n};\n\nconst isPercentageSize = (value: string | number) =>\n typeof value === \"string\" && value.endsWith(\"%\");\n\nexport const getIntrinsicSize = (\n component: ReactElement\n): { height?: number; width?: number } | undefined => {\n const { style: { width = auto, height = auto } = NO_STYLE } = component.props;\n\n const numHeight = typeof height === \"number\";\n const numWidth = typeof width === \"number\";\n\n if (numHeight && numWidth) {\n return { height, width };\n } else if (numHeight) {\n return { height };\n } else if (numWidth) {\n return { width };\n } else {\n return undefined;\n }\n};\n\nexport function getFlexStyle(\n component: ReactElement,\n dimension: dimension,\n pos?: DropPos\n) {\n const crossDimension = CROSS_DIMENSION[dimension];\n const {\n style: {\n [crossDimension]: intrinsicCrossSize = auto,\n ...intrinsicStyles\n } = NO_STYLE,\n } = component.props;\n\n if (pos && pos[dimension]) {\n return {\n ...intrinsicStyles,\n ...defaultFlexStyle,\n flexBasis: pos[dimension],\n flexGrow: 0,\n flexShrink: 0,\n };\n } else {\n return {\n ...intrinsicStyles,\n ...defaultFlexStyle,\n [crossDimension]: intrinsicCrossSize,\n };\n }\n}\n\nexport function hasUnboundedFlexStyle(component: ReactElement) {\n const { style: { flex, flexGrow, flexShrink, flexBasis } = NO_STYLE } =\n component.props;\n if (typeof flex === \"number\") {\n return true;\n }\n if (flexBasis === 0 && flexGrow === 1 && flexShrink === 1) {\n return true;\n }\n if (typeof flexBasis === \"number\") {\n return false;\n }\n return true;\n}\n\nexport function getFlexOrIntrinsicStyle(\n component: ReactElement,\n dimension: dimension,\n pos: position\n) {\n const crossDimension = CROSS_DIMENSION[dimension];\n const {\n style: {\n [dimension]: intrinsicSize = auto,\n [crossDimension]: intrinsicCrossSize = auto,\n ...intrinsicStyles\n } = NO_STYLE,\n } = component.props;\n\n if (intrinsicSize !== auto) {\n if (isPercentageSize(intrinsicSize)) {\n return {\n flexBasis: 0,\n flexGrow: 1,\n flexShrink: 1,\n [dimension]: undefined,\n [crossDimension]: intrinsicCrossSize,\n };\n }\n return {\n flexBasis: intrinsicSize,\n flexGrow: 0,\n flexShrink: 0,\n [dimension]: intrinsicSize,\n [crossDimension]: intrinsicCrossSize,\n };\n }\n if (pos && pos[dimension]) {\n return {\n ...intrinsicStyles,\n ...defaultFlexStyle,\n flexBasis: pos[dimension],\n flexGrow: 0,\n flexShrink: 0,\n };\n }\n return {\n ...intrinsicStyles,\n [crossDimension]: intrinsicCrossSize,\n };\n}\n\nexport function wrapIntrinsicSizeComponentWithFlexbox(\n component: ReactElement,\n flexDirection: flexDirection,\n path: string,\n clientRect?: rect,\n dropRect?: rectTuple\n) {\n const wrappedChildren = [];\n let pathIndex = 0;\n let endPlaceholder;\n\n if (clientRect && dropRect) {\n let startPlaceholder;\n const [dropLeft, dropTop, dropRight, dropBottom] = dropRect;\n [startPlaceholder, endPlaceholder] =\n flexDirection === \"column\"\n ? [dropTop - clientRect.top, clientRect.bottom - dropBottom]\n : [dropLeft - clientRect.left, clientRect.right - dropRight];\n\n if (startPlaceholder) {\n wrappedChildren.push(\n createPlaceHolder(`${path}.${pathIndex++}`, startPlaceholder, {\n flexGrow: 0,\n flexShrink: 0,\n })\n );\n }\n } else {\n endPlaceholder = true;\n }\n\n const { version = 0, style } = getProps(component);\n\n wrappedChildren.push(\n resetPath(component, `${path}.${pathIndex++}`, {\n version: version + 1,\n style: {\n ...style,\n flexBasis: \"auto\",\n flexGrow: 0,\n flexShrink: 0,\n },\n })\n );\n\n if (endPlaceholder) {\n wrappedChildren.push(\n createPlaceHolder(`${path}.${pathIndex++}`, 0, undefined, {\n [`data-${flexDirection}-placeholder`]: true,\n })\n );\n }\n\n return createFlexbox(\n flexDirection,\n { resizeable: false, style: { flexBasis: \"auto\" } },\n wrappedChildren,\n path\n );\n}\n\nconst getFlexValue = (\n flexBasis: number,\n flexFill: boolean\n): number | undefined => {\n if (flexFill) {\n return undefined;\n }\n return flexBasis === 0 ? 1 : 0;\n};\n\nexport function createFlexbox(\n flexDirection: flexDirection,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n props: any,\n children: ReactNode,\n path: string\n) {\n const id = uuid();\n const { flexFill, style, resizeable = true } = props;\n const { flexBasis = flexFill ? undefined : \"auto\" } = style;\n const flex = getFlexValue(flexBasis, flexFill);\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n return React.createElement<any>(\n ComponentRegistry.Flexbox,\n {\n id,\n key: id,\n path,\n flexFill,\n style: {\n ...style,\n flexDirection,\n flexBasis,\n flexGrow: flex,\n flexShrink: flex,\n },\n resizeable,\n },\n children\n );\n}\n\nconst baseStyle = { flexGrow: 1, flexShrink: 1 };\n\nexport function createPlaceHolder(\n path: string,\n size: number,\n style?: CSSProperties,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n props?: any\n) {\n const id = uuid();\n return React.createElement(\"div\", {\n ...placeHolderProps,\n ...props,\n \"data-path\": path,\n id,\n key: id,\n style: { ...baseStyle, ...style, flexBasis: size },\n });\n}\n"],"names":["dimension"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"flexUtils.js","sources":["../../src/layout-reducer/flexUtils.ts"],"sourcesContent":["import {\n dimension,\n getLayoutComponent,\n rect,\n rectTuple,\n uuid,\n} from \"@vuu-ui/vuu-utils\";\nimport React, { CSSProperties, ReactElement, ReactNode } from \"react\";\nimport { DropPos } from \"../drag-drop/dragDropTypes\";\nimport { getProps, resetPath } from \"../utils\";\nconst placeHolderProps = { \"data-placeholder\": true, \"data-resizeable\": true };\n\nconst NO_STYLE = {};\nconst auto = \"auto\";\nconst defaultFlexStyle = {\n flexBasis: 0,\n flexGrow: 1,\n flexShrink: 1,\n height: auto,\n width: auto,\n};\n\nconst CROSS_DIMENSION = {\n height: \"width\",\n width: \"height\",\n};\n\nexport type flexDirection = \"row\" | \"column\";\n\ntype contraDimension = dimension;\ntype flexDimensionTuple = [dimension, contraDimension, flexDirection];\nexport type position = {\n height?: number;\n width?: number;\n};\n\nexport const getFlexDimensions = (flexDirection: flexDirection = \"row\") => {\n if (flexDirection === \"row\") {\n return [\"width\", \"height\", \"column\"] as flexDimensionTuple;\n } else {\n return [\"height\", \"width\", \"row\"] as flexDimensionTuple;\n }\n};\n\nconst isPercentageSize = (value: string | number) =>\n typeof value === \"string\" && value.endsWith(\"%\");\n\nexport const getIntrinsicSize = (\n component: ReactElement\n): { height?: number; width?: number } | undefined => {\n const { style: { width = auto, height = auto } = NO_STYLE } = component.props;\n\n const numHeight = typeof height === \"number\";\n const numWidth = typeof width === \"number\";\n\n if (numHeight && numWidth) {\n return { height, width };\n } else if (numHeight) {\n return { height };\n } else if (numWidth) {\n return { width };\n } else {\n return undefined;\n }\n};\n\nexport function getFlexStyle(\n component: ReactElement,\n dimension: dimension,\n pos?: DropPos\n) {\n const crossDimension = CROSS_DIMENSION[dimension];\n const {\n style: {\n [crossDimension]: intrinsicCrossSize = auto,\n ...intrinsicStyles\n } = NO_STYLE,\n } = component.props;\n\n if (pos && pos[dimension]) {\n return {\n ...intrinsicStyles,\n ...defaultFlexStyle,\n flexBasis: pos[dimension],\n flexGrow: 0,\n flexShrink: 0,\n };\n } else {\n return {\n ...intrinsicStyles,\n ...defaultFlexStyle,\n [crossDimension]: intrinsicCrossSize,\n };\n }\n}\n\nexport function hasUnboundedFlexStyle(component: ReactElement) {\n const { style: { flex, flexGrow, flexShrink, flexBasis } = NO_STYLE } =\n component.props;\n if (typeof flex === \"number\") {\n return true;\n }\n if (flexBasis === 0 && flexGrow === 1 && flexShrink === 1) {\n return true;\n }\n if (typeof flexBasis === \"number\") {\n return false;\n }\n return true;\n}\n\nexport function getFlexOrIntrinsicStyle(\n component: ReactElement,\n dimension: dimension,\n pos: position\n) {\n const crossDimension = CROSS_DIMENSION[dimension];\n const {\n style: {\n [dimension]: intrinsicSize = auto,\n [crossDimension]: intrinsicCrossSize = auto,\n ...intrinsicStyles\n } = NO_STYLE,\n } = component.props;\n\n if (intrinsicSize !== auto) {\n if (isPercentageSize(intrinsicSize)) {\n return {\n flexBasis: 0,\n flexGrow: 1,\n flexShrink: 1,\n [dimension]: undefined,\n [crossDimension]: intrinsicCrossSize,\n };\n }\n return {\n flexBasis: intrinsicSize,\n flexGrow: 0,\n flexShrink: 0,\n [dimension]: intrinsicSize,\n [crossDimension]: intrinsicCrossSize,\n };\n }\n if (pos && pos[dimension]) {\n return {\n ...intrinsicStyles,\n ...defaultFlexStyle,\n flexBasis: pos[dimension],\n flexGrow: 0,\n flexShrink: 0,\n };\n }\n return {\n ...intrinsicStyles,\n [crossDimension]: intrinsicCrossSize,\n };\n}\n\nexport function wrapIntrinsicSizeComponentWithFlexbox(\n component: ReactElement,\n flexDirection: flexDirection,\n path: string,\n clientRect?: rect,\n dropRect?: rectTuple\n) {\n const wrappedChildren = [];\n let pathIndex = 0;\n let endPlaceholder;\n\n if (clientRect && dropRect) {\n let startPlaceholder;\n const [dropLeft, dropTop, dropRight, dropBottom] = dropRect;\n [startPlaceholder, endPlaceholder] =\n flexDirection === \"column\"\n ? [dropTop - clientRect.top, clientRect.bottom - dropBottom]\n : [dropLeft - clientRect.left, clientRect.right - dropRight];\n\n if (startPlaceholder) {\n wrappedChildren.push(\n createPlaceHolder(`${path}.${pathIndex++}`, startPlaceholder, {\n flexGrow: 0,\n flexShrink: 0,\n })\n );\n }\n } else {\n endPlaceholder = true;\n }\n\n const { version = 0, style } = getProps(component);\n\n wrappedChildren.push(\n resetPath(component, `${path}.${pathIndex++}`, {\n version: version + 1,\n style: {\n ...style,\n flexBasis: \"auto\",\n flexGrow: 0,\n flexShrink: 0,\n },\n })\n );\n\n if (endPlaceholder) {\n wrappedChildren.push(\n createPlaceHolder(`${path}.${pathIndex++}`, 0, undefined, {\n [`data-${flexDirection}-placeholder`]: true,\n })\n );\n }\n\n return createFlexbox(\n flexDirection,\n { resizeable: false, style: { flexBasis: \"auto\" } },\n wrappedChildren,\n path\n );\n}\n\nconst getFlexValue = (\n flexBasis: number,\n flexFill: boolean\n): number | undefined => {\n if (flexFill) {\n return undefined;\n }\n return flexBasis === 0 ? 1 : 0;\n};\n\nexport function createFlexbox(\n flexDirection: flexDirection,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n props: any,\n children: ReactNode,\n path: string\n) {\n const id = uuid();\n const { flexFill, style, resizeable = true } = props;\n const { flexBasis = flexFill ? undefined : \"auto\" } = style;\n const flex = getFlexValue(flexBasis, flexFill);\n // A direct import triggers a circular ref chain\n const FlexboxLayout = getLayoutComponent(\"Flexbox\");\n return React.createElement(\n FlexboxLayout,\n {\n id,\n key: id,\n path,\n flexFill,\n style: {\n ...style,\n flexDirection,\n flexBasis,\n flexGrow: flex,\n flexShrink: flex,\n },\n resizeable,\n },\n children\n );\n}\n\nconst baseStyle = { flexGrow: 1, flexShrink: 1 };\n\nexport function createPlaceHolder(\n path: string,\n size: number,\n style?: CSSProperties,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n props?: any\n) {\n const id = uuid();\n return React.createElement(\"div\", {\n ...placeHolderProps,\n ...props,\n \"data-path\": path,\n id,\n key: id,\n style: { ...baseStyle, ...style, flexBasis: size },\n });\n}\n"],"names":["dimension"],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
+
import { isContainer } from '@vuu-ui/vuu-utils';
|
|
1
2
|
import React from 'react';
|
|
2
|
-
import { isContainer } from '../registry/ComponentRegistry.js';
|
|
3
3
|
import { followPath, findTarget, followPathToParent } from '../utils/pathUtils.js';
|
|
4
4
|
import { getProps, getProp } from '../utils/propUtils.js';
|
|
5
5
|
import { typeOf } from '../utils/typeOf.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"layout-reducer.js","sources":["../../src/layout-reducer/layout-reducer.ts"],"sourcesContent":["import React, { ReactElement } from \"react\";\nimport { DropPos } from \"../drag-drop/dragDropTypes\";\nimport { DropTarget } from \"../drag-drop/DropTarget\";\nimport { isContainer } from \"../registry/ComponentRegistry\";\nimport {\n findTarget,\n followPath,\n followPathToParent,\n getProp,\n getProps,\n typeOf,\n} from \"../utils\";\nimport { getIntrinsicSize } from \"./flexUtils\";\nimport {\n getInsertTabBeforeAfter,\n insertBesideChild,\n insertIntoContainer,\n} from \"./insert-layout-element\";\nimport { moveChild } from \"./move-layout-element\";\nimport {\n AddAction,\n DragDropAction,\n LayoutActionType,\n LayoutReducerAction,\n MaximizeAction,\n SetPropAction,\n SetPropsAction,\n SwitchTabAction,\n} from \"./layoutTypes\";\nimport { LayoutProps } from \"./layoutUtils\";\nimport { removeChild } from \"./remove-layout-element\";\nimport {\n replaceChild,\n swapChild,\n _replaceChild,\n} from \"./replace-layout-element\";\nimport { resizeFlexChild, resizeFlexChildren } from \"./resize-flex-children\";\nimport { wrap } from \"./wrap-layout-element\";\n\nexport const layoutReducer = (\n state: ReactElement,\n action: LayoutReducerAction\n): ReactElement => {\n switch (action.type) {\n case LayoutActionType.ADD:\n return addChild(state, action);\n case LayoutActionType.DRAG_DROP:\n return dragDrop(state, action);\n case LayoutActionType.MAXIMIZE:\n return setChildProps(state, action);\n case LayoutActionType.REMOVE:\n return removeChild(state, action);\n case LayoutActionType.REPLACE:\n return replaceChild(state, action);\n case LayoutActionType.SET_PROP:\n return setProp(state, action);\n case LayoutActionType.SET_PROPS:\n return setProps(state, action);\n case LayoutActionType.SET_TITLE:\n return setProp(state, {\n type: \"set-prop\",\n path: action.path,\n propName: \"title\",\n propValue: action.title,\n });\n case LayoutActionType.SPLITTER_RESIZE:\n return resizeFlexChildren(state, action);\n case LayoutActionType.LAYOUT_RESIZE:\n return resizeFlexChild(state, action);\n case LayoutActionType.SWITCH_TAB:\n return switchTab(state, action);\n case LayoutActionType.MOVE_CHILD:\n return moveChild(state, action);\n default:\n return state;\n }\n};\n\nconst switchTab = (state: ReactElement, { path, nextIdx }: SwitchTabAction) => {\n const target = followPath(state, path, true);\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const replacement = React.cloneElement<any>(target, {\n active: nextIdx,\n });\n return swapChild(state, target, replacement);\n};\n\nconst setProp = (\n state: ReactElement,\n { path, propName, propValue }: SetPropAction\n) => {\n const target = followPath(state, path, true);\n const replacement = React.cloneElement(target, {\n [propName]: propValue,\n });\n return swapChild(state, target, replacement);\n};\n\nconst setProps = (state: ReactElement, { path, props }: SetPropsAction) => {\n const target = followPath(state, path, true);\n const replacement = React.cloneElement(target, props);\n return swapChild(state, target, replacement);\n};\n\nconst setChildProps = (state: ReactElement, { path, type }: MaximizeAction) => {\n if (path) {\n const target = followPath(state, path, true);\n return swapChild(state, target, target, type);\n } else {\n return state;\n }\n};\n\nconst dragDrop = (\n layoutRoot: ReactElement,\n action: DragDropAction\n): ReactElement => {\n const {\n draggedReactElement: newComponent,\n dragInstructions,\n dropTarget,\n } = action;\n const existingComponent = dropTarget.component as ReactElement;\n const { pos } = dropTarget;\n const destinationTabstrip =\n pos?.position?.Header && typeOf(existingComponent) === \"Stack\";\n const { id, version } = getProps(newComponent);\n const intrinsicSize = getIntrinsicSize(newComponent);\n let newLayoutRoot: ReactElement;\n if (destinationTabstrip) {\n const [targetTab, insertionPosition] = getInsertTabBeforeAfter(\n // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n existingComponent!,\n pos\n );\n if (targetTab === undefined) {\n newLayoutRoot = insertIntoContainer(\n layoutRoot,\n existingComponent,\n newComponent\n );\n } else {\n newLayoutRoot = insertBesideChild(\n layoutRoot,\n targetTab,\n newComponent,\n insertionPosition\n );\n }\n } else if (!intrinsicSize && pos?.position?.Centre) {\n newLayoutRoot = _replaceChild(\n layoutRoot,\n existingComponent as ReactElement,\n newComponent\n );\n } else {\n newLayoutRoot = dropLayoutIntoContainer(\n layoutRoot,\n dropTarget as DropTarget,\n newComponent\n );\n }\n\n if (dragInstructions.DoNotRemove) {\n return newLayoutRoot;\n }\n\n const finalTarget = findTarget(\n newLayoutRoot,\n (props: LayoutProps) => props.id === id && props.version === version\n ) as ReactElement;\n const finalPath = getProp(finalTarget, \"path\");\n return removeChild(newLayoutRoot, { path: finalPath, type: \"remove\" });\n};\n\nconst addChild = (\n layoutRoot: ReactElement,\n { path: containerPath, component }: AddAction\n) => {\n return insertIntoContainer(\n layoutRoot,\n followPath(layoutRoot, containerPath) as ReactElement,\n component\n );\n};\n\nconst dropLayoutIntoContainer = (\n layoutRoot: ReactElement,\n dropTarget: DropTarget,\n newComponent: ReactElement\n): ReactElement => {\n const { component, pos, clientRect, dropRect } = dropTarget;\n const existingComponent = component as ReactElement;\n\n const existingComponentPath = getProp(existingComponent, \"path\");\n\n if (existingComponentPath === \"0.0\") {\n return wrap(\n layoutRoot,\n existingComponent as ReactElement,\n newComponent,\n pos\n );\n }\n\n const targetContainer = followPathToParent(\n layoutRoot,\n existingComponentPath\n ) as ReactElement;\n\n if (withTheGrain(pos, targetContainer)) {\n const insertionPosition = pos.position.SouthOrEast ? \"after\" : \"before\";\n return insertBesideChild(\n layoutRoot,\n existingComponent,\n newComponent,\n insertionPosition,\n pos,\n clientRect,\n dropRect\n );\n }\n\n if (!withTheGrain(pos, targetContainer)) {\n return wrap(\n layoutRoot,\n existingComponent,\n newComponent,\n pos,\n clientRect,\n dropRect\n );\n }\n\n if (isContainer(typeOf(targetContainer) as string)) {\n return wrap(layoutRoot, existingComponent, newComponent, pos);\n }\n\n throw Error(`no support right now for position = ${pos.position}`);\n};\n\nconst withTheGrain = (pos: DropPos, container: ReactElement) => {\n if (pos.position.Centre) {\n return isTerrace(container) || isTower(container);\n }\n\n return pos.position.NorthOrSouth\n ? isTower(container)\n : pos.position.EastOrWest\n ? isTerrace(container)\n : false;\n};\n\nconst isTower = (container: ReactElement) => {\n return (\n typeOf(container) === \"Flexbox\" &&\n container.props.style.flexDirection === \"column\"\n );\n};\n\nconst isTerrace = (container: ReactElement) => {\n return (\n typeOf(container) === \"Flexbox\" &&\n container.props.style.flexDirection !== \"column\"\n );\n};\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"layout-reducer.js","sources":["../../src/layout-reducer/layout-reducer.ts"],"sourcesContent":["import { isContainer } from \"@vuu-ui/vuu-utils\";\nimport React, { ReactElement } from \"react\";\nimport { DropPos } from \"../drag-drop/dragDropTypes\";\nimport { DropTarget } from \"../drag-drop/DropTarget\";\nimport {\n findTarget,\n followPath,\n followPathToParent,\n getProp,\n getProps,\n typeOf,\n} from \"../utils\";\nimport { getIntrinsicSize } from \"./flexUtils\";\nimport {\n getInsertTabBeforeAfter,\n insertBesideChild,\n insertIntoContainer,\n} from \"./insert-layout-element\";\nimport { moveChild } from \"./move-layout-element\";\nimport {\n AddAction,\n DragDropAction,\n LayoutActionType,\n LayoutReducerAction,\n MaximizeAction,\n SetPropAction,\n SetPropsAction,\n SwitchTabAction,\n} from \"./layoutTypes\";\nimport { LayoutProps } from \"./layoutUtils\";\nimport { removeChild } from \"./remove-layout-element\";\nimport {\n replaceChild,\n swapChild,\n _replaceChild,\n} from \"./replace-layout-element\";\nimport { resizeFlexChild, resizeFlexChildren } from \"./resize-flex-children\";\nimport { wrap } from \"./wrap-layout-element\";\n\nexport const layoutReducer = (\n state: ReactElement,\n action: LayoutReducerAction\n): ReactElement => {\n switch (action.type) {\n case LayoutActionType.ADD:\n return addChild(state, action);\n case LayoutActionType.DRAG_DROP:\n return dragDrop(state, action);\n case LayoutActionType.MAXIMIZE:\n return setChildProps(state, action);\n case LayoutActionType.REMOVE:\n return removeChild(state, action);\n case LayoutActionType.REPLACE:\n return replaceChild(state, action);\n case LayoutActionType.SET_PROP:\n return setProp(state, action);\n case LayoutActionType.SET_PROPS:\n return setProps(state, action);\n case LayoutActionType.SET_TITLE:\n return setProp(state, {\n type: \"set-prop\",\n path: action.path,\n propName: \"title\",\n propValue: action.title,\n });\n case LayoutActionType.SPLITTER_RESIZE:\n return resizeFlexChildren(state, action);\n case LayoutActionType.LAYOUT_RESIZE:\n return resizeFlexChild(state, action);\n case LayoutActionType.SWITCH_TAB:\n return switchTab(state, action);\n case LayoutActionType.MOVE_CHILD:\n return moveChild(state, action);\n default:\n return state;\n }\n};\n\nconst switchTab = (state: ReactElement, { path, nextIdx }: SwitchTabAction) => {\n const target = followPath(state, path, true);\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const replacement = React.cloneElement<any>(target, {\n active: nextIdx,\n });\n return swapChild(state, target, replacement);\n};\n\nconst setProp = (\n state: ReactElement,\n { path, propName, propValue }: SetPropAction\n) => {\n const target = followPath(state, path, true);\n const replacement = React.cloneElement(target, {\n [propName]: propValue,\n });\n return swapChild(state, target, replacement);\n};\n\nconst setProps = (state: ReactElement, { path, props }: SetPropsAction) => {\n const target = followPath(state, path, true);\n const replacement = React.cloneElement(target, props);\n return swapChild(state, target, replacement);\n};\n\nconst setChildProps = (state: ReactElement, { path, type }: MaximizeAction) => {\n if (path) {\n const target = followPath(state, path, true);\n return swapChild(state, target, target, type);\n } else {\n return state;\n }\n};\n\nconst dragDrop = (\n layoutRoot: ReactElement,\n action: DragDropAction\n): ReactElement => {\n const {\n draggedReactElement: newComponent,\n dragInstructions,\n dropTarget,\n } = action;\n const existingComponent = dropTarget.component as ReactElement;\n const { pos } = dropTarget;\n const destinationTabstrip =\n pos?.position?.Header && typeOf(existingComponent) === \"Stack\";\n const { id, version } = getProps(newComponent);\n const intrinsicSize = getIntrinsicSize(newComponent);\n let newLayoutRoot: ReactElement;\n if (destinationTabstrip) {\n const [targetTab, insertionPosition] = getInsertTabBeforeAfter(\n // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n existingComponent!,\n pos\n );\n if (targetTab === undefined) {\n newLayoutRoot = insertIntoContainer(\n layoutRoot,\n existingComponent,\n newComponent\n );\n } else {\n newLayoutRoot = insertBesideChild(\n layoutRoot,\n targetTab,\n newComponent,\n insertionPosition\n );\n }\n } else if (!intrinsicSize && pos?.position?.Centre) {\n newLayoutRoot = _replaceChild(\n layoutRoot,\n existingComponent as ReactElement,\n newComponent\n );\n } else {\n newLayoutRoot = dropLayoutIntoContainer(\n layoutRoot,\n dropTarget as DropTarget,\n newComponent\n );\n }\n\n if (dragInstructions.DoNotRemove) {\n return newLayoutRoot;\n }\n\n const finalTarget = findTarget(\n newLayoutRoot,\n (props: LayoutProps) => props.id === id && props.version === version\n ) as ReactElement;\n const finalPath = getProp(finalTarget, \"path\");\n return removeChild(newLayoutRoot, { path: finalPath, type: \"remove\" });\n};\n\nconst addChild = (\n layoutRoot: ReactElement,\n { path: containerPath, component }: AddAction\n) => {\n return insertIntoContainer(\n layoutRoot,\n followPath(layoutRoot, containerPath) as ReactElement,\n component\n );\n};\n\nconst dropLayoutIntoContainer = (\n layoutRoot: ReactElement,\n dropTarget: DropTarget,\n newComponent: ReactElement\n): ReactElement => {\n const { component, pos, clientRect, dropRect } = dropTarget;\n const existingComponent = component as ReactElement;\n\n const existingComponentPath = getProp(existingComponent, \"path\");\n\n if (existingComponentPath === \"0.0\") {\n return wrap(\n layoutRoot,\n existingComponent as ReactElement,\n newComponent,\n pos\n );\n }\n\n const targetContainer = followPathToParent(\n layoutRoot,\n existingComponentPath\n ) as ReactElement;\n\n if (withTheGrain(pos, targetContainer)) {\n const insertionPosition = pos.position.SouthOrEast ? \"after\" : \"before\";\n return insertBesideChild(\n layoutRoot,\n existingComponent,\n newComponent,\n insertionPosition,\n pos,\n clientRect,\n dropRect\n );\n }\n\n if (!withTheGrain(pos, targetContainer)) {\n return wrap(\n layoutRoot,\n existingComponent,\n newComponent,\n pos,\n clientRect,\n dropRect\n );\n }\n\n if (isContainer(typeOf(targetContainer) as string)) {\n return wrap(layoutRoot, existingComponent, newComponent, pos);\n }\n\n throw Error(`no support right now for position = ${pos.position}`);\n};\n\nconst withTheGrain = (pos: DropPos, container: ReactElement) => {\n if (pos.position.Centre) {\n return isTerrace(container) || isTower(container);\n }\n\n return pos.position.NorthOrSouth\n ? isTower(container)\n : pos.position.EastOrWest\n ? isTerrace(container)\n : false;\n};\n\nconst isTower = (container: ReactElement) => {\n return (\n typeOf(container) === \"Flexbox\" &&\n container.props.style.flexDirection === \"column\"\n );\n};\n\nconst isTerrace = (container: ReactElement) => {\n return (\n typeOf(container) === \"Flexbox\" &&\n container.props.style.flexDirection !== \"column\"\n );\n};\n"],"names":[],"mappings":"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"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import { uuid } from '@vuu-ui/vuu-utils';
|
|
1
|
+
import { isContainer, getLayoutComponent, uuid, isLayoutComponent } from '@vuu-ui/vuu-utils';
|
|
2
2
|
import React, { cloneElement } from 'react';
|
|
3
|
-
import { isContainer, ComponentRegistry, isLayoutComponent } from '../registry/ComponentRegistry.js';
|
|
4
3
|
import { setPersistentState, hasPersistentState, getPersistentState } from '../use-persistent-state.js';
|
|
5
4
|
import { followPathToParent } from '../utils/pathUtils.js';
|
|
6
5
|
import { getProps } from '../utils/propUtils.js';
|
|
@@ -123,7 +122,7 @@ const getStyle = (type, props, parentType) => {
|
|
|
123
122
|
return style;
|
|
124
123
|
};
|
|
125
124
|
function layoutFromJson({ id = uuid(), type, children, props, state }, path) {
|
|
126
|
-
const componentType = type.match(/^[a-z]/) ? type :
|
|
125
|
+
const componentType = type.match(/^[a-z]/) ? type : getLayoutComponent(type);
|
|
127
126
|
if (componentType === void 0) {
|
|
128
127
|
throw Error(
|
|
129
128
|
`layoutUtils unable to create component from JSON, unknown type ${type}`
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"layoutUtils.js","sources":["../../src/layout-reducer/layoutUtils.ts"],"sourcesContent":["import { dimension, uuid } from \"@vuu-ui/vuu-utils\";\nimport React, { cloneElement, CSSProperties, ReactElement } from \"react\";\nimport {\n ComponentWithId,\n ComponentRegistry,\n isContainer,\n isLayoutComponent,\n} from \"../registry/ComponentRegistry\";\nimport { TabLabelFactory } from \"../stack\";\nimport {\n getPersistentState,\n hasPersistentState,\n setPersistentState,\n} from \"../use-persistent-state\";\nimport { expandFlex, followPathToParent, getProps, typeOf } from \"../utils\";\nimport { LayoutJSON, LayoutModel, layoutType } from \"./layoutTypes\";\n\nexport const getManagedDimension = (\n style: CSSProperties\n): [dimension, dimension] =>\n style.flexDirection === \"column\" ? [\"height\", \"width\"] : [\"width\", \"height\"];\n\nconst theKidHasNoStyle: CSSProperties = {};\n\nexport const applyLayoutProps = (component: ReactElement, path = \"0\") => {\n const [layoutProps, children] = getChildLayoutProps(\n typeOf(component) as string,\n component.props,\n path\n );\n return React.cloneElement(component, layoutProps, children);\n};\n\nexport interface LayoutProps extends ComponentWithId {\n active?: number;\n \"data-path\"?: string;\n children?: ReactElement[];\n column?: any;\n dropTarget?: any;\n key: string;\n layout?: any;\n path?: string;\n resizeable?: boolean;\n style: CSSProperties;\n type?: string;\n version?: number;\n}\n\n/**\n * parse the declarative JSX and clone adding layout attributes\n */\nexport const processLayoutElement = (\n layoutElement: ReactElement,\n previousLayout?: ReactElement\n): ReactElement => {\n const type = typeOf(layoutElement) as string;\n const [layoutProps, children] = getChildLayoutProps(\n type,\n layoutElement.props,\n \"0\",\n undefined,\n previousLayout\n );\n return cloneElement(layoutElement, layoutProps, children);\n};\n\nexport const applyLayout = (\n type: layoutType,\n props: LayoutProps,\n previousLayout?: LayoutModel\n): LayoutModel => {\n const [layoutProps, children] = getChildLayoutProps(\n type,\n props,\n \"0\",\n undefined,\n previousLayout\n );\n return {\n ...props,\n ...layoutProps,\n type,\n children,\n };\n};\n\nfunction getLayoutProps(\n type: string,\n props: LayoutProps,\n path = \"0\",\n parentType: string | null = null,\n previousLayout?: LayoutModel\n): LayoutProps {\n const {\n active: prevActive = 0,\n \"data-path\": dataPath,\n path: prevPath = dataPath,\n id: prevId,\n style: prevStyle,\n } = getProps(previousLayout);\n\n const prevMatch = typeOf(previousLayout) === type && path === prevPath;\n const id = prevMatch ? prevId : props.id ?? uuid();\n const active = type === \"Stack\" ? props.active ?? prevActive : undefined;\n\n const key = id;\n const style = prevMatch ? prevStyle : getStyle(type, props, parentType);\n return isLayoutComponent(type)\n ? { id, key, path, style, type, active }\n : { id, key, style, \"data-path\": path };\n}\n\nfunction getChildLayoutProps(\n type: string,\n props: LayoutProps,\n path: string,\n parentType: string | null = null,\n previousLayout?: LayoutModel\n): [LayoutProps, ReactElement[]] {\n const layoutProps = getLayoutProps(\n type,\n props,\n path,\n parentType,\n previousLayout\n );\n\n if (props.layout && !previousLayout) {\n return [layoutProps, [layoutFromJson(props.layout, `${path}.0`)]];\n }\n\n const previousChildren =\n (previousLayout as any)?.children ?? previousLayout?.props?.children;\n const hasDynamicChildren = props.dropTarget && previousChildren;\n const children = hasDynamicChildren\n ? previousChildren\n : getLayoutChildren(type, props.children, path, previousChildren);\n return [layoutProps, children];\n}\n\nfunction getLayoutChildren(\n type: string,\n children?: ReactElement[],\n path = \"0\",\n previousChildren?: ReactElement[]\n) {\n const kids = Array.isArray(children)\n ? children\n : React.isValidElement(children)\n ? [children]\n : [];\n return isContainer(type)\n ? kids.map((child, i) => {\n const childType = typeOf(child) as string;\n const previousType = typeOf(previousChildren?.[i]);\n\n if (!previousType || childType === previousType) {\n const [layoutProps, children] = getChildLayoutProps(\n childType,\n child.props,\n `${path}.${i}`,\n type,\n previousChildren?.[i]\n );\n return React.cloneElement(child, layoutProps, children);\n }\n\n return previousChildren?.[i];\n })\n : children;\n}\n\nconst getStyle = (\n type: string,\n props: LayoutProps,\n parentType?: string | null\n) => {\n let { style = theKidHasNoStyle } = props;\n if (type === \"Flexbox\") {\n style = {\n flexDirection: props.column ? \"column\" : \"row\",\n ...style,\n display: \"flex\",\n };\n }\n\n if (style.flex) {\n const { flex, ...otherStyles } = style;\n style = {\n ...otherStyles,\n ...expandFlex(typeof flex === \"number\" ? flex : 0),\n };\n } else if (parentType === \"Stack\") {\n style = {\n ...style,\n ...expandFlex(1),\n };\n } else if (\n parentType === \"Flexbox\" &&\n (style.width || style.height) &&\n style.flexBasis === undefined\n ) {\n style = {\n ...style,\n flexBasis: \"auto\",\n flexGrow: 0,\n flexShrink: 0,\n };\n }\n\n return style;\n};\n\nexport function layoutFromJson(\n { id = uuid(), type, children, props, state }: LayoutJSON,\n path: string\n): ReactElement {\n const componentType = type.match(/^[a-z]/) ? type : ComponentRegistry[type];\n\n if (componentType === undefined) {\n throw Error(\n `layoutUtils unable to create component from JSON, unknown type ${type}`\n );\n }\n\n if (state) {\n setPersistentState(id, state);\n }\n\n return React.createElement(\n componentType,\n {\n id,\n ...props,\n key: id,\n path,\n },\n children\n ? children.map((child, i) => layoutFromJson(child, `${path}.${i}`))\n : undefined\n );\n}\n\nexport function layoutToJSON(component: ReactElement) {\n return componentToJson(component);\n}\n\nexport function componentToJson(component: ReactElement): LayoutJSON {\n const type = typeOf(component) as string;\n const { id, children, type: _omit, ...props } = getProps(component);\n\n const state = hasPersistentState(id) ? getPersistentState(id) : undefined;\n\n return {\n id,\n type,\n props: serializeProps(props as LayoutProps),\n state,\n children: React.Children.map(children, componentToJson),\n };\n}\n\nexport function serializeProps(props?: LayoutProps) {\n if (props) {\n const { path, ...otherProps } = props;\n const result: { [key: string]: any } = {};\n for (const [key, value] of Object.entries(otherProps)) {\n result[key] = serializeValue(value);\n }\n return result;\n }\n}\n\nfunction serializeValue(value: unknown): any {\n if (\n typeof value === \"string\" ||\n typeof value === \"number\" ||\n typeof value === \"boolean\"\n ) {\n return value;\n } else if (Array.isArray(value)) {\n return value.map(serializeValue);\n } else if (typeof value === \"object\" && value !== null) {\n const result: { [key: string]: any } = {};\n for (const [k, v] of Object.entries(value)) {\n result[k] = serializeValue(v);\n }\n return result;\n }\n}\n\n// This is experimental and the only query we support to start off with is\n// PARENT_CONTAINER\nexport type LayoutQuery = \"PARENT_CONTAINER\";\n\nexport const layoutQuery = (\n query: LayoutQuery,\n path?: string,\n layoutRoot?: ReactElement\n) => {\n if (path && layoutRoot) {\n const parentElement = followPathToParent(layoutRoot, path);\n if (parentElement) {\n const { id: parentContainerId } = getProps(parentElement);\n const parentContainerType = typeOf(parentElement);\n return {\n parentContainerId,\n parentContainerType,\n };\n }\n return {\n parentContainerType: \"Stack\",\n parentContainerId: \"blah\",\n };\n }\n};\n\nexport const getDefaultTabLabel: TabLabelFactory = (\n component,\n tabIndex,\n existingLabels = []\n): string => {\n let label = component.props?.title ?? component.props?.[\"data-tab-title\"];\n if (label) {\n return label;\n } else {\n let count = tabIndex;\n do {\n label = `Tab ${++count}`;\n } while (existingLabels.includes(label));\n return label;\n }\n};\n"],"names":["children"],"mappings":";;;;;;;;;AAiBO,MAAM,mBAAsB,GAAA,CACjC,KAEA,KAAA,KAAA,CAAM,aAAkB,KAAA,QAAA,GAAW,CAAC,QAAA,EAAU,OAAO,CAAA,GAAI,CAAC,OAAA,EAAS,QAAQ,EAAA;AAE7E,MAAM,mBAAkC,EAAC,CAAA;AAElC,MAAM,gBAAmB,GAAA,CAAC,SAAyB,EAAA,IAAA,GAAO,GAAQ,KAAA;AACvE,EAAM,MAAA,CAAC,WAAa,EAAA,QAAQ,CAAI,GAAA,mBAAA;AAAA,IAC9B,OAAO,SAAS,CAAA;AAAA,IAChB,SAAU,CAAA,KAAA;AAAA,IACV,IAAA;AAAA,GACF,CAAA;AACA,EAAA,OAAO,KAAM,CAAA,YAAA,CAAa,SAAW,EAAA,WAAA,EAAa,QAAQ,CAAA,CAAA;AAC5D,EAAA;AAoBa,MAAA,oBAAA,GAAuB,CAClC,aAAA,EACA,cACiB,KAAA;AACjB,EAAM,MAAA,IAAA,GAAO,OAAO,aAAa,CAAA,CAAA;AACjC,EAAM,MAAA,CAAC,WAAa,EAAA,QAAQ,CAAI,GAAA,mBAAA;AAAA,IAC9B,IAAA;AAAA,IACA,aAAc,CAAA,KAAA;AAAA,IACd,GAAA;AAAA,IACA,KAAA,CAAA;AAAA,IACA,cAAA;AAAA,GACF,CAAA;AACA,EAAO,OAAA,YAAA,CAAa,aAAe,EAAA,WAAA,EAAa,QAAQ,CAAA,CAAA;AAC1D,EAAA;AAEO,MAAM,WAAc,GAAA,CACzB,IACA,EAAA,KAAA,EACA,cACgB,KAAA;AAChB,EAAM,MAAA,CAAC,WAAa,EAAA,QAAQ,CAAI,GAAA,mBAAA;AAAA,IAC9B,IAAA;AAAA,IACA,KAAA;AAAA,IACA,GAAA;AAAA,IACA,KAAA,CAAA;AAAA,IACA,cAAA;AAAA,GACF,CAAA;AACA,EAAO,OAAA;AAAA,IACL,GAAG,KAAA;AAAA,IACH,GAAG,WAAA;AAAA,IACH,IAAA;AAAA,IACA,QAAA;AAAA,GACF,CAAA;AACF,EAAA;AAEA,SAAS,eACP,IACA,EAAA,KAAA,EACA,OAAO,GACP,EAAA,UAAA,GAA4B,MAC5B,cACa,EAAA;AACb,EAAM,MAAA;AAAA,IACJ,QAAQ,UAAa,GAAA,CAAA;AAAA,IACrB,WAAa,EAAA,QAAA;AAAA,IACb,MAAM,QAAW,GAAA,QAAA;AAAA,IACjB,EAAI,EAAA,MAAA;AAAA,IACJ,KAAO,EAAA,SAAA;AAAA,GACT,GAAI,SAAS,cAAc,CAAA,CAAA;AAE3B,EAAA,MAAM,SAAY,GAAA,MAAA,CAAO,cAAc,CAAA,KAAM,QAAQ,IAAS,KAAA,QAAA,CAAA;AAC9D,EAAA,MAAM,EAAK,GAAA,SAAA,GAAY,MAAS,GAAA,KAAA,CAAM,MAAM,IAAK,EAAA,CAAA;AACjD,EAAA,MAAM,MAAS,GAAA,IAAA,KAAS,OAAU,GAAA,KAAA,CAAM,UAAU,UAAa,GAAA,KAAA,CAAA,CAAA;AAE/D,EAAA,MAAM,GAAM,GAAA,EAAA,CAAA;AACZ,EAAA,MAAM,QAAQ,SAAY,GAAA,SAAA,GAAY,QAAS,CAAA,IAAA,EAAM,OAAO,UAAU,CAAA,CAAA;AACtE,EAAA,OAAO,kBAAkB,IAAI,CAAA,GACzB,EAAE,EAAA,EAAI,KAAK,IAAM,EAAA,KAAA,EAAO,IAAM,EAAA,MAAA,KAC9B,EAAE,EAAA,EAAI,GAAK,EAAA,KAAA,EAAO,aAAa,IAAK,EAAA,CAAA;AAC1C,CAAA;AAEA,SAAS,oBACP,IACA,EAAA,KAAA,EACA,IACA,EAAA,UAAA,GAA4B,MAC5B,cAC+B,EAAA;AAC/B,EAAA,MAAM,WAAc,GAAA,cAAA;AAAA,IAClB,IAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAA;AAAA,IACA,UAAA;AAAA,IACA,cAAA;AAAA,GACF,CAAA;AAEA,EAAI,IAAA,KAAA,CAAM,MAAU,IAAA,CAAC,cAAgB,EAAA;AACnC,IAAO,OAAA,CAAC,WAAa,EAAA,CAAC,cAAe,CAAA,KAAA,CAAM,QAAQ,CAAG,EAAA,IAAI,CAAI,EAAA,CAAA,CAAC,CAAC,CAAA,CAAA;AAAA,GAClE;AAEA,EAAA,MAAM,gBACH,GAAA,cAAA,EAAwB,QAAY,IAAA,cAAA,EAAgB,KAAO,EAAA,QAAA,CAAA;AAC9D,EAAM,MAAA,kBAAA,GAAqB,MAAM,UAAc,IAAA,gBAAA,CAAA;AAC/C,EAAM,MAAA,QAAA,GAAW,qBACb,gBACA,GAAA,iBAAA,CAAkB,MAAM,KAAM,CAAA,QAAA,EAAU,MAAM,gBAAgB,CAAA,CAAA;AAClE,EAAO,OAAA,CAAC,aAAa,QAAQ,CAAA,CAAA;AAC/B,CAAA;AAEA,SAAS,iBACP,CAAA,IAAA,EACA,QACA,EAAA,IAAA,GAAO,KACP,gBACA,EAAA;AACA,EAAA,MAAM,IAAO,GAAA,KAAA,CAAM,OAAQ,CAAA,QAAQ,CAC/B,GAAA,QAAA,GACA,KAAM,CAAA,cAAA,CAAe,QAAQ,CAAA,GAC7B,CAAC,QAAQ,IACT,EAAC,CAAA;AACL,EAAA,OAAO,YAAY,IAAI,CAAA,GACnB,KAAK,GAAI,CAAA,CAAC,OAAO,CAAM,KAAA;AACrB,IAAM,MAAA,SAAA,GAAY,OAAO,KAAK,CAAA,CAAA;AAC9B,IAAA,MAAM,YAAe,GAAA,MAAA,CAAO,gBAAmB,GAAA,CAAC,CAAC,CAAA,CAAA;AAEjD,IAAI,IAAA,CAAC,YAAgB,IAAA,SAAA,KAAc,YAAc,EAAA;AAC/C,MAAM,MAAA,CAAC,WAAaA,EAAAA,SAAQ,CAAI,GAAA,mBAAA;AAAA,QAC9B,SAAA;AAAA,QACA,KAAM,CAAA,KAAA;AAAA,QACN,CAAA,EAAG,IAAI,CAAA,CAAA,EAAI,CAAC,CAAA,CAAA;AAAA,QACZ,IAAA;AAAA,QACA,mBAAmB,CAAC,CAAA;AAAA,OACtB,CAAA;AACA,MAAA,OAAO,KAAM,CAAA,YAAA,CAAa,KAAO,EAAA,WAAA,EAAaA,SAAQ,CAAA,CAAA;AAAA,KACxD;AAEA,IAAA,OAAO,mBAAmB,CAAC,CAAA,CAAA;AAAA,GAC5B,CACD,GAAA,QAAA,CAAA;AACN,CAAA;AAEA,MAAM,QAAW,GAAA,CACf,IACA,EAAA,KAAA,EACA,UACG,KAAA;AACH,EAAI,IAAA,EAAE,KAAQ,GAAA,gBAAA,EAAqB,GAAA,KAAA,CAAA;AACnC,EAAA,IAAI,SAAS,SAAW,EAAA;AACtB,IAAQ,KAAA,GAAA;AAAA,MACN,aAAA,EAAe,KAAM,CAAA,MAAA,GAAS,QAAW,GAAA,KAAA;AAAA,MACzC,GAAG,KAAA;AAAA,MACH,OAAS,EAAA,MAAA;AAAA,KACX,CAAA;AAAA,GACF;AAEA,EAAA,IAAI,MAAM,IAAM,EAAA;AACd,IAAA,MAAM,EAAE,IAAA,EAAM,GAAG,WAAA,EAAgB,GAAA,KAAA,CAAA;AACjC,IAAQ,KAAA,GAAA;AAAA,MACN,GAAG,WAAA;AAAA,MACH,GAAG,UAAW,CAAA,OAAO,IAAS,KAAA,QAAA,GAAW,OAAO,CAAC,CAAA;AAAA,KACnD,CAAA;AAAA,GACF,MAAA,IAAW,eAAe,OAAS,EAAA;AACjC,IAAQ,KAAA,GAAA;AAAA,MACN,GAAG,KAAA;AAAA,MACH,GAAG,WAAW,CAAC,CAAA;AAAA,KACjB,CAAA;AAAA,GACF,MAAA,IACE,eAAe,SACd,KAAA,KAAA,CAAM,SAAS,KAAM,CAAA,MAAA,CAAA,IACtB,KAAM,CAAA,SAAA,KAAc,KACpB,CAAA,EAAA;AACA,IAAQ,KAAA,GAAA;AAAA,MACN,GAAG,KAAA;AAAA,MACH,SAAW,EAAA,MAAA;AAAA,MACX,QAAU,EAAA,CAAA;AAAA,MACV,UAAY,EAAA,CAAA;AAAA,KACd,CAAA;AAAA,GACF;AAEA,EAAO,OAAA,KAAA,CAAA;AACT,CAAA,CAAA;AAEgB,SAAA,cAAA,CACd,EAAE,EAAA,GAAK,IAAK,EAAA,EAAG,MAAM,QAAU,EAAA,KAAA,EAAO,KAAM,EAAA,EAC5C,IACc,EAAA;AACd,EAAA,MAAM,gBAAgB,IAAK,CAAA,KAAA,CAAM,QAAQ,CAAI,GAAA,IAAA,GAAO,kBAAkB,IAAI,CAAA,CAAA;AAE1E,EAAA,IAAI,kBAAkB,KAAW,CAAA,EAAA;AAC/B,IAAM,MAAA,KAAA;AAAA,MACJ,kEAAkE,IAAI,CAAA,CAAA;AAAA,KACxE,CAAA;AAAA,GACF;AAEA,EAAA,IAAI,KAAO,EAAA;AACT,IAAA,kBAAA,CAAmB,IAAI,KAAK,CAAA,CAAA;AAAA,GAC9B;AAEA,EAAA,OAAO,KAAM,CAAA,aAAA;AAAA,IACX,aAAA;AAAA,IACA;AAAA,MACE,EAAA;AAAA,MACA,GAAG,KAAA;AAAA,MACH,GAAK,EAAA,EAAA;AAAA,MACL,IAAA;AAAA,KACF;AAAA,IACA,QACI,GAAA,QAAA,CAAS,GAAI,CAAA,CAAC,OAAO,CAAM,KAAA,cAAA,CAAe,KAAO,EAAA,CAAA,EAAG,IAAI,CAAA,CAAA,EAAI,CAAC,CAAA,CAAE,CAAC,CAChE,GAAA,KAAA,CAAA;AAAA,GACN,CAAA;AACF,CAAA;AAEO,SAAS,aAAa,SAAyB,EAAA;AACpD,EAAA,OAAO,gBAAgB,SAAS,CAAA,CAAA;AAClC,CAAA;AAEO,SAAS,gBAAgB,SAAqC,EAAA;AACnE,EAAM,MAAA,IAAA,GAAO,OAAO,SAAS,CAAA,CAAA;AAC7B,EAAM,MAAA,EAAE,IAAI,QAAU,EAAA,IAAA,EAAM,OAAO,GAAG,KAAA,EAAU,GAAA,QAAA,CAAS,SAAS,CAAA,CAAA;AAElE,EAAA,MAAM,QAAQ,kBAAmB,CAAA,EAAE,CAAI,GAAA,kBAAA,CAAmB,EAAE,CAAI,GAAA,KAAA,CAAA,CAAA;AAEhE,EAAO,OAAA;AAAA,IACL,EAAA;AAAA,IACA,IAAA;AAAA,IACA,KAAA,EAAO,eAAe,KAAoB,CAAA;AAAA,IAC1C,KAAA;AAAA,IACA,QAAU,EAAA,KAAA,CAAM,QAAS,CAAA,GAAA,CAAI,UAAU,eAAe,CAAA;AAAA,GACxD,CAAA;AACF,CAAA;AAEO,SAAS,eAAe,KAAqB,EAAA;AAClD,EAAA,IAAI,KAAO,EAAA;AACT,IAAA,MAAM,EAAE,IAAA,EAAM,GAAG,UAAA,EAAe,GAAA,KAAA,CAAA;AAChC,IAAA,MAAM,SAAiC,EAAC,CAAA;AACxC,IAAA,KAAA,MAAW,CAAC,GAAK,EAAA,KAAK,KAAK,MAAO,CAAA,OAAA,CAAQ,UAAU,CAAG,EAAA;AACrD,MAAO,MAAA,CAAA,GAAG,CAAI,GAAA,cAAA,CAAe,KAAK,CAAA,CAAA;AAAA,KACpC;AACA,IAAO,OAAA,MAAA,CAAA;AAAA,GACT;AACF,CAAA;AAEA,SAAS,eAAe,KAAqB,EAAA;AAC3C,EACE,IAAA,OAAO,UAAU,QACjB,IAAA,OAAO,UAAU,QACjB,IAAA,OAAO,UAAU,SACjB,EAAA;AACA,IAAO,OAAA,KAAA,CAAA;AAAA,GACE,MAAA,IAAA,KAAA,CAAM,OAAQ,CAAA,KAAK,CAAG,EAAA;AAC/B,IAAO,OAAA,KAAA,CAAM,IAAI,cAAc,CAAA,CAAA;AAAA,GACtB,MAAA,IAAA,OAAO,KAAU,KAAA,QAAA,IAAY,UAAU,IAAM,EAAA;AACtD,IAAA,MAAM,SAAiC,EAAC,CAAA;AACxC,IAAA,KAAA,MAAW,CAAC,CAAG,EAAA,CAAC,KAAK,MAAO,CAAA,OAAA,CAAQ,KAAK,CAAG,EAAA;AAC1C,MAAO,MAAA,CAAA,CAAC,CAAI,GAAA,cAAA,CAAe,CAAC,CAAA,CAAA;AAAA,KAC9B;AACA,IAAO,OAAA,MAAA,CAAA;AAAA,GACT;AACF,CAAA;AAMO,MAAM,WAAc,GAAA,CACzB,KACA,EAAA,IAAA,EACA,UACG,KAAA;AACH,EAAA,IAAI,QAAQ,UAAY,EAAA;AACtB,IAAM,MAAA,aAAA,GAAgB,kBAAmB,CAAA,UAAA,EAAY,IAAI,CAAA,CAAA;AACzD,IAAA,IAAI,aAAe,EAAA;AACjB,MAAA,MAAM,EAAE,EAAA,EAAI,iBAAkB,EAAA,GAAI,SAAS,aAAa,CAAA,CAAA;AACxD,MAAM,MAAA,mBAAA,GAAsB,OAAO,aAAa,CAAA,CAAA;AAChD,MAAO,OAAA;AAAA,QACL,iBAAA;AAAA,QACA,mBAAA;AAAA,OACF,CAAA;AAAA,KACF;AACA,IAAO,OAAA;AAAA,MACL,mBAAqB,EAAA,OAAA;AAAA,MACrB,iBAAmB,EAAA,MAAA;AAAA,KACrB,CAAA;AAAA,GACF;AACF,EAAA;AAEO,MAAM,qBAAsC,CACjD,SAAA,EACA,QACA,EAAA,cAAA,GAAiB,EACN,KAAA;AACX,EAAA,IAAI,QAAQ,SAAU,CAAA,KAAA,EAAO,KAAS,IAAA,SAAA,CAAU,QAAQ,gBAAgB,CAAA,CAAA;AACxE,EAAA,IAAI,KAAO,EAAA;AACT,IAAO,OAAA,KAAA,CAAA;AAAA,GACF,MAAA;AACL,IAAA,IAAI,KAAQ,GAAA,QAAA,CAAA;AACZ,IAAG,GAAA;AACD,MAAQ,KAAA,GAAA,CAAA,IAAA,EAAO,EAAE,KAAK,CAAA,CAAA,CAAA;AAAA,KACxB,QAAS,cAAe,CAAA,QAAA,CAAS,KAAK,CAAA,EAAA;AACtC,IAAO,OAAA,KAAA,CAAA;AAAA,GACT;AACF;;;;"}
|
|
1
|
+
{"version":3,"file":"layoutUtils.js","sources":["../../src/layout-reducer/layoutUtils.ts"],"sourcesContent":["import {\n dimension,\n getLayoutComponent,\n isContainer,\n isLayoutComponent,\n uuid,\n} from \"@vuu-ui/vuu-utils\";\nimport React, { cloneElement, CSSProperties, ReactElement } from \"react\";\nimport { TabLabelFactory } from \"../stack\";\nimport {\n getPersistentState,\n hasPersistentState,\n setPersistentState,\n} from \"../use-persistent-state\";\nimport { expandFlex, followPathToParent, getProps, typeOf } from \"../utils\";\nimport { LayoutJSON, LayoutModel, layoutType } from \"./layoutTypes\";\n\ninterface ComponentWithId {\n id: string;\n [key: string]: unknown;\n}\n\nexport const getManagedDimension = (\n style: CSSProperties\n): [dimension, dimension] =>\n style.flexDirection === \"column\" ? [\"height\", \"width\"] : [\"width\", \"height\"];\n\nconst theKidHasNoStyle: CSSProperties = {};\n\nexport const applyLayoutProps = (component: ReactElement, path = \"0\") => {\n const [layoutProps, children] = getChildLayoutProps(\n typeOf(component) as string,\n component.props,\n path\n );\n return React.cloneElement(component, layoutProps, children);\n};\n\nexport interface LayoutProps extends ComponentWithId {\n active?: number;\n \"data-path\"?: string;\n children?: ReactElement[];\n column?: boolean;\n dropTarget?: boolean;\n key: string;\n layout?: LayoutJSON;\n path?: string;\n resizeable?: boolean;\n style: CSSProperties;\n type?: string;\n version?: number;\n}\n\n/**\n * parse the declarative JSX and clone adding layout attributes\n */\nexport const processLayoutElement = (\n layoutElement: ReactElement,\n previousLayout?: ReactElement\n): ReactElement => {\n const type = typeOf(layoutElement) as string;\n const [layoutProps, children] = getChildLayoutProps(\n type,\n layoutElement.props,\n \"0\",\n undefined,\n previousLayout\n );\n return cloneElement(layoutElement, layoutProps, children);\n};\n\nexport const applyLayout = (\n type: layoutType,\n props: LayoutProps,\n previousLayout?: LayoutModel\n): LayoutModel => {\n const [layoutProps, children] = getChildLayoutProps(\n type,\n props,\n \"0\",\n undefined,\n previousLayout\n );\n return {\n ...props,\n ...layoutProps,\n type,\n children,\n };\n};\n\nfunction getLayoutProps(\n type: string,\n props: LayoutProps,\n path = \"0\",\n parentType: string | null = null,\n previousLayout?: LayoutModel\n): LayoutProps {\n const {\n active: prevActive = 0,\n \"data-path\": dataPath,\n path: prevPath = dataPath,\n id: prevId,\n style: prevStyle,\n } = getProps(previousLayout);\n\n const prevMatch = typeOf(previousLayout) === type && path === prevPath;\n const id = prevMatch ? prevId : props.id ?? uuid();\n const active = type === \"Stack\" ? props.active ?? prevActive : undefined;\n\n const key = id;\n const style = prevMatch ? prevStyle : getStyle(type, props, parentType);\n return isLayoutComponent(type)\n ? { id, key, path, style, type, active }\n : { id, key, style, \"data-path\": path };\n}\n\nfunction getChildLayoutProps(\n type: string,\n props: LayoutProps,\n path: string,\n parentType: string | null = null,\n previousLayout?: LayoutModel\n): [LayoutProps, ReactElement[]] {\n const layoutProps = getLayoutProps(\n type,\n props,\n path,\n parentType,\n previousLayout\n );\n\n if (props.layout && !previousLayout) {\n return [layoutProps, [layoutFromJson(props.layout, `${path}.0`)]];\n }\n\n const previousChildren =\n (previousLayout as any)?.children ?? previousLayout?.props?.children;\n const hasDynamicChildren = props.dropTarget && previousChildren;\n const children = hasDynamicChildren\n ? previousChildren\n : getLayoutChildren(type, props.children, path, previousChildren);\n return [layoutProps, children];\n}\n\nfunction getLayoutChildren(\n type: string,\n children?: ReactElement[],\n path = \"0\",\n previousChildren?: ReactElement[]\n) {\n const kids = Array.isArray(children)\n ? children\n : React.isValidElement(children)\n ? [children]\n : [];\n return isContainer(type)\n ? kids.map((child, i) => {\n const childType = typeOf(child) as string;\n const previousType = typeOf(previousChildren?.[i]);\n\n if (!previousType || childType === previousType) {\n const [layoutProps, children] = getChildLayoutProps(\n childType,\n child.props,\n `${path}.${i}`,\n type,\n previousChildren?.[i]\n );\n return React.cloneElement(child, layoutProps, children);\n }\n\n return previousChildren?.[i];\n })\n : children;\n}\n\nconst getStyle = (\n type: string,\n props: LayoutProps,\n parentType?: string | null\n) => {\n let { style = theKidHasNoStyle } = props;\n if (type === \"Flexbox\") {\n style = {\n flexDirection: props.column ? \"column\" : \"row\",\n ...style,\n display: \"flex\",\n };\n }\n\n if (style.flex) {\n const { flex, ...otherStyles } = style;\n style = {\n ...otherStyles,\n ...expandFlex(typeof flex === \"number\" ? flex : 0),\n };\n } else if (parentType === \"Stack\") {\n style = {\n ...style,\n ...expandFlex(1),\n };\n } else if (\n parentType === \"Flexbox\" &&\n (style.width || style.height) &&\n style.flexBasis === undefined\n ) {\n style = {\n ...style,\n flexBasis: \"auto\",\n flexGrow: 0,\n flexShrink: 0,\n };\n }\n\n return style;\n};\n\nexport function layoutFromJson(\n { id = uuid(), type, children, props, state }: LayoutJSON,\n path: string\n): ReactElement {\n const componentType = type.match(/^[a-z]/) ? type : getLayoutComponent(type);\n\n if (componentType === undefined) {\n throw Error(\n `layoutUtils unable to create component from JSON, unknown type ${type}`\n );\n }\n\n if (state) {\n setPersistentState(id, state);\n }\n\n return React.createElement(\n componentType,\n {\n id,\n ...props,\n key: id,\n path,\n },\n children\n ? children.map((child, i) => layoutFromJson(child, `${path}.${i}`))\n : undefined\n );\n}\n\nexport function layoutToJSON(component: ReactElement) {\n return componentToJson(component);\n}\n\nexport function componentToJson(component: ReactElement): LayoutJSON {\n const type = typeOf(component) as string;\n const { id, children, type: _omit, ...props } = getProps(component);\n\n const state = hasPersistentState(id) ? getPersistentState(id) : undefined;\n\n return {\n id,\n type,\n props: serializeProps(props as LayoutProps),\n state,\n children: React.Children.map(children, componentToJson),\n };\n}\n\nexport function serializeProps(props?: LayoutProps) {\n if (props) {\n const { path, ...otherProps } = props;\n const result: { [key: string]: any } = {};\n for (const [key, value] of Object.entries(otherProps)) {\n result[key] = serializeValue(value);\n }\n return result;\n }\n}\n\nfunction serializeValue(value: unknown): any {\n if (\n typeof value === \"string\" ||\n typeof value === \"number\" ||\n typeof value === \"boolean\"\n ) {\n return value;\n } else if (Array.isArray(value)) {\n return value.map(serializeValue);\n } else if (typeof value === \"object\" && value !== null) {\n const result: { [key: string]: any } = {};\n for (const [k, v] of Object.entries(value)) {\n result[k] = serializeValue(v);\n }\n return result;\n }\n}\n\n// This is experimental and the only query we support to start off with is\n// PARENT_CONTAINER\nexport type LayoutQuery = \"PARENT_CONTAINER\";\n\nexport const layoutQuery = (\n query: LayoutQuery,\n path?: string,\n layoutRoot?: ReactElement\n) => {\n if (path && layoutRoot) {\n const parentElement = followPathToParent(layoutRoot, path);\n if (parentElement) {\n const { id: parentContainerId } = getProps(parentElement);\n const parentContainerType = typeOf(parentElement);\n return {\n parentContainerId,\n parentContainerType,\n };\n }\n return {\n parentContainerType: \"Stack\",\n parentContainerId: \"blah\",\n };\n }\n};\n\nexport const getDefaultTabLabel: TabLabelFactory = (\n component,\n tabIndex,\n existingLabels = []\n): string => {\n let label = component.props?.title ?? component.props?.[\"data-tab-title\"];\n if (label) {\n return label;\n } else {\n let count = tabIndex;\n do {\n label = `Tab ${++count}`;\n } while (existingLabels.includes(label));\n return label;\n }\n};\n"],"names":["children"],"mappings":"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"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import { uuid } from '@vuu-ui/vuu-utils';
|
|
1
|
+
import { uuid, getLayoutComponent } from '@vuu-ui/vuu-utils';
|
|
2
2
|
import React from 'react';
|
|
3
|
-
import { ComponentRegistry } from '../registry/ComponentRegistry.js';
|
|
4
3
|
import { nextStep, resetPath } from '../utils/pathUtils.js';
|
|
5
4
|
import { getProps, getProp } from '../utils/propUtils.js';
|
|
6
5
|
import { typeOf } from '../utils/typeOf.js';
|
|
@@ -93,7 +92,7 @@ function wrapFlexComponent(container, containerChildren, existingComponent, newC
|
|
|
93
92
|
} : void 0;
|
|
94
93
|
const id = uuid();
|
|
95
94
|
const wrapper = React.createElement(
|
|
96
|
-
|
|
95
|
+
getLayoutComponent(type),
|
|
97
96
|
{
|
|
98
97
|
active,
|
|
99
98
|
id,
|