@vuu-ui/vuu-layout 0.13.13 → 0.13.15
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.map +1 -1
- package/cjs/LayoutContainer.js.map +1 -1
- package/cjs/dock-layout/DockLayout.js.map +1 -1
- package/cjs/dock-layout/Drawer.js.map +1 -1
- package/cjs/drag-drop/BoxModel.js.map +1 -1
- package/cjs/drag-drop/DragState.js.map +1 -1
- package/cjs/drag-drop/Draggable.js.map +1 -1
- package/cjs/drag-drop/DropTarget.js.map +1 -1
- package/cjs/drag-drop/DropTargetRenderer.js.map +1 -1
- package/cjs/flexbox/Flexbox.js.map +1 -1
- package/cjs/flexbox/FlexboxLayout.js.map +1 -1
- package/cjs/flexbox/Splitter.js.map +1 -1
- package/cjs/flexbox/flexbox-utils.js.map +1 -1
- package/cjs/flexbox/useSplitterResizing.js.map +1 -1
- package/cjs/layout-action.js.map +1 -1
- package/cjs/layout-header/Header.js.map +1 -1
- package/cjs/layout-header/useHeader.js.map +1 -1
- package/cjs/layout-provider/LayoutProvider.js.map +1 -1
- package/cjs/layout-provider/LayoutProviderContext.js.map +1 -1
- package/cjs/layout-provider/useLayoutDragDrop.js.map +1 -1
- package/cjs/layout-reducer/flexUtils.js.map +1 -1
- package/cjs/layout-reducer/insert-layout-element.js.map +1 -1
- package/cjs/layout-reducer/layout-reducer.js.map +1 -1
- package/cjs/layout-reducer/layoutTypes.js.map +1 -1
- package/cjs/layout-reducer/layoutUtils.js.map +1 -1
- package/cjs/layout-reducer/move-layout-element.js.map +1 -1
- package/cjs/layout-reducer/remove-layout-element.js.map +1 -1
- package/cjs/layout-reducer/replace-layout-element.js.map +1 -1
- package/cjs/layout-reducer/resize-flex-children.js.map +1 -1
- package/cjs/layout-reducer/wrap-layout-element.js.map +1 -1
- package/cjs/layout-view/View.js.map +1 -1
- package/cjs/layout-view/useView.js.map +1 -1
- package/cjs/layout-view/useViewBroadcastChannel.js.map +1 -1
- package/cjs/layout-view/useViewResize.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.map +1 -1
- package/cjs/placeholder/LayoutStartPanel.js.map +1 -1
- package/cjs/placeholder/Placeholder.js.map +1 -1
- package/cjs/responsive/useResizeObserver.js.map +1 -1
- package/cjs/responsive/utils.js.map +1 -1
- package/cjs/stack/Stack.js.map +1 -1
- package/cjs/stack/StackLayout.js.map +1 -1
- package/cjs/use-persistent-state.js.map +1 -1
- package/cjs/utils/pathUtils.js.map +1 -1
- package/cjs/utils/propUtils.js.map +1 -1
- package/cjs/utils/refUtils.js.map +1 -1
- package/cjs/utils/styleUtils.js.map +1 -1
- package/cjs/utils/typeOf.js.map +1 -1
- package/esm/Component.js.map +1 -1
- package/esm/LayoutContainer.js.map +1 -1
- package/esm/dock-layout/DockLayout.js.map +1 -1
- package/esm/dock-layout/Drawer.js.map +1 -1
- package/esm/drag-drop/BoxModel.js.map +1 -1
- package/esm/drag-drop/DragState.js.map +1 -1
- package/esm/drag-drop/Draggable.js.map +1 -1
- package/esm/drag-drop/DropTarget.js.map +1 -1
- package/esm/drag-drop/DropTargetRenderer.js.map +1 -1
- package/esm/flexbox/Flexbox.js.map +1 -1
- package/esm/flexbox/FlexboxLayout.js.map +1 -1
- package/esm/flexbox/Splitter.js.map +1 -1
- package/esm/flexbox/flexbox-utils.js.map +1 -1
- package/esm/flexbox/useSplitterResizing.js.map +1 -1
- package/esm/layout-action.js.map +1 -1
- package/esm/layout-header/Header.js.map +1 -1
- package/esm/layout-header/useHeader.js.map +1 -1
- package/esm/layout-provider/LayoutProvider.js.map +1 -1
- package/esm/layout-provider/LayoutProviderContext.js.map +1 -1
- package/esm/layout-provider/useLayoutDragDrop.js.map +1 -1
- package/esm/layout-reducer/flexUtils.js.map +1 -1
- package/esm/layout-reducer/insert-layout-element.js.map +1 -1
- package/esm/layout-reducer/layout-reducer.js.map +1 -1
- package/esm/layout-reducer/layoutTypes.js.map +1 -1
- package/esm/layout-reducer/layoutUtils.js.map +1 -1
- package/esm/layout-reducer/move-layout-element.js.map +1 -1
- package/esm/layout-reducer/remove-layout-element.js.map +1 -1
- package/esm/layout-reducer/replace-layout-element.js.map +1 -1
- package/esm/layout-reducer/resize-flex-children.js.map +1 -1
- package/esm/layout-reducer/wrap-layout-element.js.map +1 -1
- package/esm/layout-view/View.js.map +1 -1
- package/esm/layout-view/useView.js.map +1 -1
- package/esm/layout-view/useViewBroadcastChannel.js.map +1 -1
- package/esm/layout-view/useViewResize.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.map +1 -1
- package/esm/placeholder/LayoutStartPanel.js.map +1 -1
- package/esm/placeholder/Placeholder.js.map +1 -1
- package/esm/responsive/useResizeObserver.js.map +1 -1
- package/esm/responsive/utils.js.map +1 -1
- package/esm/stack/Stack.js.map +1 -1
- package/esm/stack/StackLayout.js.map +1 -1
- package/esm/use-persistent-state.js.map +1 -1
- package/esm/utils/pathUtils.js.map +1 -1
- package/esm/utils/propUtils.js.map +1 -1
- package/esm/utils/refUtils.js.map +1 -1
- package/esm/utils/styleUtils.js.map +1 -1
- package/esm/utils/typeOf.js.map +1 -1
- package/package.json +9 -9
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useSplitterResizing.js","sources":["../../src/flexbox/useSplitterResizing.ts"],"sourcesContent":["import { getUniqueId } from \"@vuu-ui/vuu-utils\";\nimport React, { ReactElement, useCallback, useMemo, useRef } from \"react\";\nimport { Placeholder } from \"../placeholder\";\nimport { Splitter } from \"./Splitter\";\n\nimport {\n findSplitterAndPlaceholderPositions,\n gatherChildMeta,\n identifyResizeParties,\n PLACEHOLDER,\n SPLITTER,\n} from \"./flexbox-utils\";\nimport {\n ContentMeta,\n FlexSize,\n SplitterFactory,\n SplitterHookProps,\n SplitterHookResult,\n} from \"./flexboxTypes\";\n\nconst originalContentOnly = (meta: ContentMeta) =>\n !meta.splitter && !meta.placeholder;\n\nexport const useSplitterResizing = ({\n children: childrenProp,\n onSplitterMoved,\n style,\n}: SplitterHookProps): SplitterHookResult => {\n const rootRef = useRef<HTMLDivElement>(null);\n const flexElementsRef = useRef<HTMLDivElement[]>(undefined);\n const metaRef = useRef<ContentMeta[]>(undefined);\n const contentRef = useRef<ReactElement[]>(undefined);\n const assignedKeys = useRef<string[]>([]);\n\n const isColumn = style?.flexDirection === \"column\";\n const dimension = isColumn ? \"height\" : \"width\";\n const children = useMemo(\n () =>\n Array.isArray(childrenProp)\n ? childrenProp\n : React.isValidElement(childrenProp)\n ? [childrenProp]\n : [],\n [childrenProp],\n );\n\n const handleDragStart = useCallback(\n (index: number) => {\n const { current: contentMeta } = metaRef;\n if (contentMeta) {\n const [participants, bystanders] = identifyResizeParties(\n contentMeta,\n index,\n );\n if (participants) {\n participants.forEach((index) => {\n const el = rootRef.current?.childNodes[index] as HTMLElement;\n if (el) {\n const { size, minSize } = measureElement(el, dimension);\n contentMeta[index].currentSize = size;\n contentMeta[index].minSize = minSize;\n }\n });\n if (bystanders) {\n bystanders.forEach((index) => {\n const el = rootRef.current?.childNodes[index] as HTMLElement;\n if (el) {\n const { [dimension]: size } = el.getBoundingClientRect();\n contentMeta[index].flexBasis = size;\n }\n });\n }\n\n if (rootRef.current) {\n rootRef.current.classList.add(\"vuuSplitterResizing\");\n console.log({ root: rootRef.current });\n flexElementsRef.current = Array.from(\n rootRef.current.querySelectorAll<HTMLDivElement>(\":scope > div\"),\n );\n }\n }\n }\n },\n [dimension],\n );\n\n const handleDrag = useCallback((idx: number, distance: number) => {\n const { current: flexElements = [] } = flexElementsRef;\n\n if (contentRef.current && metaRef.current) {\n resizeElements(flexElements, metaRef.current, distance /*, dimension*/);\n }\n }, []);\n\n const handleDragEnd = useCallback(() => {\n const contentMeta = metaRef.current;\n if (contentMeta) {\n onSplitterMoved?.(contentMeta.filter(originalContentOnly));\n if (rootRef.current) {\n rootRef.current.classList.remove(\"vuuSplitterResizing\");\n }\n }\n contentMeta?.forEach((meta) => {\n meta.currentSize = undefined;\n meta.flexBasis = undefined;\n meta.flexOpen = false;\n });\n }, [onSplitterMoved]);\n\n const createSplitter: SplitterFactory = useCallback(\n (i) => {\n return React.createElement(Splitter, {\n column: isColumn,\n index: i,\n key: `splitter-${i}`,\n onDrag: handleDrag,\n onDragEnd: handleDragEnd,\n onDragStart: handleDragStart,\n });\n },\n [handleDrag, handleDragEnd, handleDragStart, isColumn],\n );\n\n useMemo(() => {\n const [content, meta] = buildContent(\n children,\n dimension,\n createSplitter,\n assignedKeys.current,\n );\n metaRef.current = meta;\n contentRef.current = content;\n }, [children, createSplitter, dimension]);\n\n return {\n content: contentRef.current || [],\n rootRef,\n };\n};\n\nfunction buildContent(\n children: ReactElement[],\n dimension: \"width\" | \"height\",\n createSplitter: SplitterFactory,\n keys: string[],\n): [ReactElement[], ContentMeta[]] {\n const childMeta = gatherChildMeta(children, dimension);\n const splitterAndPlaceholderPositions =\n findSplitterAndPlaceholderPositions(childMeta);\n const content = [];\n const meta: ContentMeta[] = [];\n for (let i = 0; i < children.length; i++) {\n const child = children[i];\n if (i === 0 && splitterAndPlaceholderPositions[i] & PLACEHOLDER) {\n content.push(createPlaceholder(i));\n meta.push({ placeholder: true, shim: true });\n }\n if (child.key == null) {\n const key = keys[i] || (keys[i] = getUniqueId());\n content.push(React.cloneElement(child, { key }));\n } else {\n content.push(child);\n }\n meta.push(childMeta[i]);\n\n if (i > 0 && splitterAndPlaceholderPositions[i] & PLACEHOLDER) {\n content.push(createPlaceholder(i));\n meta.push({ placeholder: true });\n } else if (splitterAndPlaceholderPositions[i] & SPLITTER) {\n content.push(createSplitter(content.length));\n meta.push({ splitter: true });\n }\n }\n return [content, meta];\n}\n\nfunction resizeElements(\n flexElements: HTMLDivElement[],\n contentMeta: ContentMeta[],\n distance: number,\n) {\n const metaUpdated = updateMeta(contentMeta, distance);\n if (!metaUpdated) {\n return;\n }\n\n flexElements.forEach((element, idx) => {\n const meta = contentMeta[idx];\n const { currentSize, flexOpen, flexBasis, splitter } = meta;\n const hasCurrentSize = currentSize !== undefined;\n if (!splitter && (hasCurrentSize || flexOpen)) {\n const size = hasCurrentSize ? meta.currentSize : flexBasis;\n element.style.flexBasis = `${size}px`;\n }\n });\n}\n\n//TODO detect cursor move beyond drag limit and suspend further resize until cursoe re-engages with splitter\nfunction updateMeta(contentMeta: ContentMeta[], distance: number) {\n const resizeTargets: number[] = [];\n\n contentMeta.forEach((meta, idx) => {\n if (meta.currentSize !== undefined) {\n resizeTargets.push(idx);\n }\n });\n\n // we want the target being reduced first, this may limit the distance we can apply\n const target1 = distance < 0 ? resizeTargets[0] : resizeTargets[1];\n\n const { currentSize = 0, minSize = 0 } = contentMeta[target1];\n if (currentSize === minSize) {\n // size is already 0, we cannot go further\n return false;\n } else if (Math.abs(distance) > currentSize - minSize) {\n // reduce to 0\n const multiplier = distance < 0 ? -1 : 1;\n distance = Math.max(0, currentSize - minSize) * multiplier;\n }\n\n const leadingItem = contentMeta[resizeTargets[0]] as ContentMeta;\n const { currentSize: leadingSize = 0 } = leadingItem;\n leadingItem.currentSize = leadingSize + distance;\n\n const trailingItem = contentMeta[resizeTargets[1]] as ContentMeta;\n const { currentSize: trailingSize = 0 } = trailingItem;\n trailingItem.currentSize = trailingSize - distance;\n\n return true;\n}\n\nfunction createPlaceholder(index: number) {\n return React.createElement(Placeholder, {\n shim: index === 0,\n key: `placeholder-${index}`,\n });\n}\n\nfunction measureElement(\n el: HTMLElement,\n dimension: \"width\" | \"height\",\n): FlexSize {\n const { [dimension]: size } = el.getBoundingClientRect();\n const style = getComputedStyle(el);\n const minSizeVal = style.getPropertyValue(`min-${dimension}`);\n const minSize = minSizeVal.endsWith(\"px\") ? parseInt(minSizeVal, 10) : 0;\n return { size, minSize };\n}\n"],"names":["index"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"useSplitterResizing.js","sources":["../../../../packages/vuu-layout/src/flexbox/useSplitterResizing.ts"],"sourcesContent":["import { getUniqueId } from \"@vuu-ui/vuu-utils\";\nimport React, { ReactElement, useCallback, useMemo, useRef } from \"react\";\nimport { Placeholder } from \"../placeholder\";\nimport { Splitter } from \"./Splitter\";\n\nimport {\n findSplitterAndPlaceholderPositions,\n gatherChildMeta,\n identifyResizeParties,\n PLACEHOLDER,\n SPLITTER,\n} from \"./flexbox-utils\";\nimport {\n ContentMeta,\n FlexSize,\n SplitterFactory,\n SplitterHookProps,\n SplitterHookResult,\n} from \"./flexboxTypes\";\n\nconst originalContentOnly = (meta: ContentMeta) =>\n !meta.splitter && !meta.placeholder;\n\nexport const useSplitterResizing = ({\n children: childrenProp,\n onSplitterMoved,\n style,\n}: SplitterHookProps): SplitterHookResult => {\n const rootRef = useRef<HTMLDivElement>(null);\n const flexElementsRef = useRef<HTMLDivElement[]>(undefined);\n const metaRef = useRef<ContentMeta[]>(undefined);\n const contentRef = useRef<ReactElement[]>(undefined);\n const assignedKeys = useRef<string[]>([]);\n\n const isColumn = style?.flexDirection === \"column\";\n const dimension = isColumn ? \"height\" : \"width\";\n const children = useMemo(\n () =>\n Array.isArray(childrenProp)\n ? childrenProp\n : React.isValidElement(childrenProp)\n ? [childrenProp]\n : [],\n [childrenProp],\n );\n\n const handleDragStart = useCallback(\n (index: number) => {\n const { current: contentMeta } = metaRef;\n if (contentMeta) {\n const [participants, bystanders] = identifyResizeParties(\n contentMeta,\n index,\n );\n if (participants) {\n participants.forEach((index) => {\n const el = rootRef.current?.childNodes[index] as HTMLElement;\n if (el) {\n const { size, minSize } = measureElement(el, dimension);\n contentMeta[index].currentSize = size;\n contentMeta[index].minSize = minSize;\n }\n });\n if (bystanders) {\n bystanders.forEach((index) => {\n const el = rootRef.current?.childNodes[index] as HTMLElement;\n if (el) {\n const { [dimension]: size } = el.getBoundingClientRect();\n contentMeta[index].flexBasis = size;\n }\n });\n }\n\n if (rootRef.current) {\n rootRef.current.classList.add(\"vuuSplitterResizing\");\n console.log({ root: rootRef.current });\n flexElementsRef.current = Array.from(\n rootRef.current.querySelectorAll<HTMLDivElement>(\":scope > div\"),\n );\n }\n }\n }\n },\n [dimension],\n );\n\n const handleDrag = useCallback((idx: number, distance: number) => {\n const { current: flexElements = [] } = flexElementsRef;\n\n if (contentRef.current && metaRef.current) {\n resizeElements(flexElements, metaRef.current, distance /*, dimension*/);\n }\n }, []);\n\n const handleDragEnd = useCallback(() => {\n const contentMeta = metaRef.current;\n if (contentMeta) {\n onSplitterMoved?.(contentMeta.filter(originalContentOnly));\n if (rootRef.current) {\n rootRef.current.classList.remove(\"vuuSplitterResizing\");\n }\n }\n contentMeta?.forEach((meta) => {\n meta.currentSize = undefined;\n meta.flexBasis = undefined;\n meta.flexOpen = false;\n });\n }, [onSplitterMoved]);\n\n const createSplitter: SplitterFactory = useCallback(\n (i) => {\n return React.createElement(Splitter, {\n column: isColumn,\n index: i,\n key: `splitter-${i}`,\n onDrag: handleDrag,\n onDragEnd: handleDragEnd,\n onDragStart: handleDragStart,\n });\n },\n [handleDrag, handleDragEnd, handleDragStart, isColumn],\n );\n\n useMemo(() => {\n const [content, meta] = buildContent(\n children,\n dimension,\n createSplitter,\n assignedKeys.current,\n );\n metaRef.current = meta;\n contentRef.current = content;\n }, [children, createSplitter, dimension]);\n\n return {\n content: contentRef.current || [],\n rootRef,\n };\n};\n\nfunction buildContent(\n children: ReactElement[],\n dimension: \"width\" | \"height\",\n createSplitter: SplitterFactory,\n keys: string[],\n): [ReactElement[], ContentMeta[]] {\n const childMeta = gatherChildMeta(children, dimension);\n const splitterAndPlaceholderPositions =\n findSplitterAndPlaceholderPositions(childMeta);\n const content = [];\n const meta: ContentMeta[] = [];\n for (let i = 0; i < children.length; i++) {\n const child = children[i];\n if (i === 0 && splitterAndPlaceholderPositions[i] & PLACEHOLDER) {\n content.push(createPlaceholder(i));\n meta.push({ placeholder: true, shim: true });\n }\n if (child.key == null) {\n const key = keys[i] || (keys[i] = getUniqueId());\n content.push(React.cloneElement(child, { key }));\n } else {\n content.push(child);\n }\n meta.push(childMeta[i]);\n\n if (i > 0 && splitterAndPlaceholderPositions[i] & PLACEHOLDER) {\n content.push(createPlaceholder(i));\n meta.push({ placeholder: true });\n } else if (splitterAndPlaceholderPositions[i] & SPLITTER) {\n content.push(createSplitter(content.length));\n meta.push({ splitter: true });\n }\n }\n return [content, meta];\n}\n\nfunction resizeElements(\n flexElements: HTMLDivElement[],\n contentMeta: ContentMeta[],\n distance: number,\n) {\n const metaUpdated = updateMeta(contentMeta, distance);\n if (!metaUpdated) {\n return;\n }\n\n flexElements.forEach((element, idx) => {\n const meta = contentMeta[idx];\n const { currentSize, flexOpen, flexBasis, splitter } = meta;\n const hasCurrentSize = currentSize !== undefined;\n if (!splitter && (hasCurrentSize || flexOpen)) {\n const size = hasCurrentSize ? meta.currentSize : flexBasis;\n element.style.flexBasis = `${size}px`;\n }\n });\n}\n\n//TODO detect cursor move beyond drag limit and suspend further resize until cursoe re-engages with splitter\nfunction updateMeta(contentMeta: ContentMeta[], distance: number) {\n const resizeTargets: number[] = [];\n\n contentMeta.forEach((meta, idx) => {\n if (meta.currentSize !== undefined) {\n resizeTargets.push(idx);\n }\n });\n\n // we want the target being reduced first, this may limit the distance we can apply\n const target1 = distance < 0 ? resizeTargets[0] : resizeTargets[1];\n\n const { currentSize = 0, minSize = 0 } = contentMeta[target1];\n if (currentSize === minSize) {\n // size is already 0, we cannot go further\n return false;\n } else if (Math.abs(distance) > currentSize - minSize) {\n // reduce to 0\n const multiplier = distance < 0 ? -1 : 1;\n distance = Math.max(0, currentSize - minSize) * multiplier;\n }\n\n const leadingItem = contentMeta[resizeTargets[0]] as ContentMeta;\n const { currentSize: leadingSize = 0 } = leadingItem;\n leadingItem.currentSize = leadingSize + distance;\n\n const trailingItem = contentMeta[resizeTargets[1]] as ContentMeta;\n const { currentSize: trailingSize = 0 } = trailingItem;\n trailingItem.currentSize = trailingSize - distance;\n\n return true;\n}\n\nfunction createPlaceholder(index: number) {\n return React.createElement(Placeholder, {\n shim: index === 0,\n key: `placeholder-${index}`,\n });\n}\n\nfunction measureElement(\n el: HTMLElement,\n dimension: \"width\" | \"height\",\n): FlexSize {\n const { [dimension]: size } = el.getBoundingClientRect();\n const style = getComputedStyle(el);\n const minSizeVal = style.getPropertyValue(`min-${dimension}`);\n const minSize = minSizeVal.endsWith(\"px\") ? parseInt(minSizeVal, 10) : 0;\n return { size, minSize };\n}\n"],"names":["index"],"mappings":"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"}
|
package/esm/layout-action.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"layout-action.js","sources":["
|
|
1
|
+
{"version":3,"file":"layout-action.js","sources":["../../../packages/vuu-layout/src/layout-action.ts"],"sourcesContent":["export const Action = {\n ADD: \"add\",\n BLUR: \"blur\",\n BLUR_SPLITTER: \"blur-splitter\",\n DRAG_START: \"drag-start\",\n DRAG_STARTED: \"drag-started\",\n DRAG_DROP: \"drag-drop\",\n FOCUS: \"focus\",\n FOCUS_SPLITTER: \"focus-splitter\",\n INITIALIZE: \"initialize\",\n LAYOUT_RESIZE: \"layout-resize\",\n MAXIMIZE: \"maximize\",\n MINIMIZE: \"minimize\",\n REMOVE: \"remove\",\n REPLACE: \"replace\",\n RESTORE: \"restore\",\n SAVE: \"save\",\n SPLITTER_RESIZE: \"splitter-resize\",\n};\n"],"names":[],"mappings":"AAAO,MAAM,MAAS,GAAA;AAAA,EACpB,GAAK,EAAA,KAAA;AAAA,EACL,IAAM,EAAA,MAAA;AAAA,EACN,aAAe,EAAA,eAAA;AAAA,EACf,UAAY,EAAA,YAAA;AAAA,EACZ,YAAc,EAAA,cAAA;AAAA,EACd,SAAW,EAAA,WAAA;AAAA,EACX,KAAO,EAAA,OAAA;AAAA,EACP,cAAgB,EAAA,gBAAA;AAAA,EAChB,UAAY,EAAA,YAAA;AAAA,EACZ,aAAe,EAAA,eAAA;AAAA,EACf,QAAU,EAAA,UAAA;AAAA,EACV,QAAU,EAAA,UAAA;AAAA,EACV,MAAQ,EAAA,QAAA;AAAA,EACR,OAAS,EAAA,SAAA;AAAA,EACT,OAAS,EAAA,SAAA;AAAA,EACT,IAAM,EAAA,MAAA;AAAA,EACN,eAAiB,EAAA;AACnB;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Header.js","sources":["
|
|
1
|
+
{"version":3,"file":"Header.js","sources":["../../../../packages/vuu-layout/src/layout-header/Header.tsx"],"sourcesContent":["import { EditableLabel, IconButton } from \"@vuu-ui/vuu-ui-controls\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport { HTMLAttributes, MouseEvent, ReactElement, cloneElement } from \"react\";\nimport { Contribution } from \"../layout-view\";\nimport { useHeader } from \"./useHeader\";\n\nimport headerCss from \"./Header.css\";\n\nexport interface HeaderProps extends HTMLAttributes<HTMLDivElement> {\n allowRename?: boolean;\n collapsed?: boolean;\n contributions?: Contribution[];\n expanded?: boolean;\n closeable?: boolean;\n onCollapse?: () => void;\n onEditTitle?: (value: string) => void;\n onExpand?: () => void;\n orientation?: \"horizontal\" | \"vertical\";\n tearOut?: boolean;\n}\n\nconst classBase = \"vuuHeader\";\n\nexport const Header = ({\n allowRename = false,\n className: classNameProp,\n contributions,\n collapsed,\n closeable,\n onCollapse,\n onEditTitle,\n onExpand,\n orientation: orientationProp = \"horizontal\",\n style,\n title = \"Untitled\",\n}: HeaderProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-header\",\n css: headerCss,\n window: targetWindow,\n });\n\n const {\n editing,\n focusTitle,\n labelFieldRef,\n onClickEdit,\n onClose,\n onExitEditMode,\n onMouseDown,\n onTitleKeyDown,\n onToggleCollapse,\n onToggleExpand,\n setValue,\n value,\n } = useHeader({\n onCollapse,\n onEditTitle,\n onExpand,\n title,\n });\n\n const handleButtonMouseDown = (evt: MouseEvent) => {\n // do not allow drag to be initiated\n evt.stopPropagation();\n };\n\n const orientation = collapsed || orientationProp;\n\n const className = cx(classBase, classNameProp, `${classBase}-${orientation}`);\n\n const toolbarItems: ReactElement[] = [];\n const postTitleContributedItems: ReactElement[] = [];\n const actionButtons: ReactElement[] = [];\n const allowCollapse =\n typeof collapsed === \"boolean\" || typeof collapsed === \"string\";\n\n contributions?.forEach((contribution, i) => {\n switch (contribution.location) {\n case \"pre-title\":\n toolbarItems.push(cloneElement(contribution.content, { key: i }));\n break;\n default:\n postTitleContributedItems.push(\n cloneElement(contribution.content, { key: i }),\n );\n }\n });\n\n allowCollapse &&\n toolbarItems.push(\n <IconButton\n className={cx(`${classBase}-toggle`, {\n [`${classBase}-collapsed`]: collapsed,\n })}\n data-embedded\n icon={collapsed ? \"chevron-open\" : \"chevron-down\"}\n key=\"collapse-button\"\n onClick={collapsed ? onToggleExpand : onToggleCollapse}\n size={20}\n tabIndex={0}\n appearance=\"transparent\"\n sentiment=\"neutral\"\n />,\n );\n\n title &&\n toolbarItems.push(\n <EditableLabel\n className={`${classBase}-title`}\n editing={editing}\n key=\"title\"\n value={value}\n onChange={setValue}\n onMouseDownCapture={focusTitle}\n onExitEditMode={onExitEditMode}\n onKeyDown={onTitleKeyDown}\n ref={labelFieldRef}\n />,\n );\n\n allowRename &&\n toolbarItems.push(\n <IconButton\n className={`${classBase}-edit`}\n data-embedded\n icon=\"edit\"\n key=\"edit-button\"\n onClick={onClickEdit}\n onMouseDown={handleButtonMouseDown}\n tabIndex={0}\n variant=\"secondary\"\n />,\n );\n\n closeable &&\n actionButtons.push(\n <IconButton\n appearance=\"transparent\"\n data-embedded\n icon=\"close\"\n key=\"close\"\n onClick={onClose}\n onMouseDown={handleButtonMouseDown}\n sentiment=\"neutral\"\n />,\n );\n\n postTitleContributedItems.length > 0 &&\n toolbarItems.push(\n <div data-align=\"end\" key=\"contributions\">\n {postTitleContributedItems}\n </div>,\n );\n\n actionButtons.length > 0 &&\n toolbarItems.push(\n <div data-align=\"end\" key=\"actions\">\n {actionButtons}\n </div>,\n );\n\n return (\n <div\n className={cx(\"vuuToolbarProxy\", className)}\n style={style}\n onMouseDown={onMouseDown}\n >\n {toolbarItems}\n </div>\n );\n};\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useHeader.js","sources":["
|
|
1
|
+
{"version":3,"file":"useHeader.js","sources":["../../../../packages/vuu-layout/src/layout-header/useHeader.ts"],"sourcesContent":["import {\n KeyboardEvent,\n MouseEventHandler,\n useCallback,\n useRef,\n useState,\n} from \"react\";\nimport type { HeaderProps } from \"./Header\";\nimport { useViewDispatch } from \"../layout-view-actions\";\nimport { queryClosest } from \"@vuu-ui/vuu-utils\";\n\nexport interface HeaderHookProps\n extends Pick<HeaderProps, \"onCollapse\" | \"onEditTitle\" | \"onExpand\"> {\n debugString?: string;\n title: string;\n}\n\nexport const useHeader = ({\n onCollapse,\n onEditTitle,\n onExpand,\n title,\n}: HeaderHookProps) => {\n const [editing, setEditing] = useState<boolean>(false);\n const [value, setValue] = useState<string>(title);\n const labelFieldRef = useRef<HTMLDivElement>(null);\n\n const viewDispatch = useViewDispatch();\n const handleClose = useCallback<MouseEventHandler>(\n (evt) => viewDispatch?.({ type: \"remove\" }, evt),\n [viewDispatch],\n );\n\n const focusTitle = useCallback(() => {\n labelFieldRef.current?.focus();\n }, []);\n\n const handleClickEdit = useCallback(() => {\n focusTitle();\n setEditing((isEditing) => !isEditing);\n }, [focusTitle]);\n\n const handleTitleKeyDown = (evt: KeyboardEvent<HTMLDivElement>) => {\n if (evt.key === \"Enter\") {\n setEditing(true);\n }\n };\n\n const handleMouseDown = useCallback<MouseEventHandler>(\n (e) => {\n const button = queryClosest(e.target, \".saltButton\");\n if (button === null) {\n // This is for drag start detection.\n viewDispatch?.({ type: \"mousedown\" }, e);\n }\n },\n [viewDispatch],\n );\n\n const handleExitEditMode = (\n originalValue = \"\",\n finalValue = \"\",\n allowDeactivation = true,\n editCancelled = false,\n ) => {\n setEditing(false);\n if (editCancelled) {\n setValue(originalValue);\n } else if (finalValue !== originalValue) {\n setValue(finalValue);\n onEditTitle?.(finalValue);\n }\n if (allowDeactivation === false) {\n labelFieldRef.current?.focus();\n }\n };\n\n const handleToggleCollapse = useCallback<MouseEventHandler>(\n (e) => {\n viewDispatch?.({ type: \"collapse\" }, e);\n onCollapse?.();\n },\n [onCollapse, viewDispatch],\n );\n\n const handleToggleExpand = useCallback<MouseEventHandler>(\n (e) => {\n viewDispatch?.({ type: \"expand\" }, e);\n onExpand?.();\n },\n [onExpand, viewDispatch],\n );\n\n return {\n editing,\n focusTitle,\n labelFieldRef,\n onClickEdit: handleClickEdit,\n onClose: handleClose,\n onExitEditMode: handleExitEditMode,\n onMouseDown: handleMouseDown,\n onToggleCollapse: handleToggleCollapse,\n onToggleExpand: handleToggleExpand,\n onTitleKeyDown: handleTitleKeyDown,\n setValue,\n value,\n };\n};\n"],"names":[],"mappings":";;;;;AAiBO,MAAM,YAAY,CAAC;AAAA,EACxB,UAAA;AAAA,EACA,WAAA;AAAA,EACA,QAAA;AAAA,EACA;AACF,CAAuB,KAAA;AACrB,EAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAI,SAAkB,KAAK,CAAA;AACrD,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAI,SAAiB,KAAK,CAAA;AAChD,EAAM,MAAA,aAAA,GAAgB,OAAuB,IAAI,CAAA;AAEjD,EAAA,MAAM,eAAe,eAAgB,EAAA;AACrC,EAAA,MAAM,WAAc,GAAA,WAAA;AAAA,IAClB,CAAC,GAAQ,KAAA,YAAA,GAAe,EAAE,IAAM,EAAA,QAAA,IAAY,GAAG,CAAA;AAAA,IAC/C,CAAC,YAAY;AAAA,GACf;AAEA,EAAM,MAAA,UAAA,GAAa,YAAY,MAAM;AACnC,IAAA,aAAA,CAAc,SAAS,KAAM,EAAA;AAAA,GAC/B,EAAG,EAAE,CAAA;AAEL,EAAM,MAAA,eAAA,GAAkB,YAAY,MAAM;AACxC,IAAW,UAAA,EAAA;AACX,IAAW,UAAA,CAAA,CAAC,SAAc,KAAA,CAAC,SAAS,CAAA;AAAA,GACtC,EAAG,CAAC,UAAU,CAAC,CAAA;AAEf,EAAM,MAAA,kBAAA,GAAqB,CAAC,GAAuC,KAAA;AACjE,IAAI,IAAA,GAAA,CAAI,QAAQ,OAAS,EAAA;AACvB,MAAA,UAAA,CAAW,IAAI,CAAA;AAAA;AACjB,GACF;AAEA,EAAA,MAAM,eAAkB,GAAA,WAAA;AAAA,IACtB,CAAC,CAAM,KAAA;AACL,MAAA,MAAM,MAAS,GAAA,YAAA,CAAa,CAAE,CAAA,MAAA,EAAQ,aAAa,CAAA;AACnD,MAAA,IAAI,WAAW,IAAM,EAAA;AAEnB,QAAA,YAAA,GAAe,EAAE,IAAA,EAAM,WAAY,EAAA,EAAG,CAAC,CAAA;AAAA;AACzC,KACF;AAAA,IACA,CAAC,YAAY;AAAA,GACf;AAEA,EAAM,MAAA,kBAAA,GAAqB,CACzB,aAAgB,GAAA,EAAA,EAChB,aAAa,EACb,EAAA,iBAAA,GAAoB,IACpB,EAAA,aAAA,GAAgB,KACb,KAAA;AACH,IAAA,UAAA,CAAW,KAAK,CAAA;AAChB,IAAA,IAAI,aAAe,EAAA;AACjB,MAAA,QAAA,CAAS,aAAa,CAAA;AAAA,KACxB,MAAA,IAAW,eAAe,aAAe,EAAA;AACvC,MAAA,QAAA,CAAS,UAAU,CAAA;AACnB,MAAA,WAAA,GAAc,UAAU,CAAA;AAAA;AAE1B,IAAA,IAAI,sBAAsB,KAAO,EAAA;AAC/B,MAAA,aAAA,CAAc,SAAS,KAAM,EAAA;AAAA;AAC/B,GACF;AAEA,EAAA,MAAM,oBAAuB,GAAA,WAAA;AAAA,IAC3B,CAAC,CAAM,KAAA;AACL,MAAA,YAAA,GAAe,EAAE,IAAA,EAAM,UAAW,EAAA,EAAG,CAAC,CAAA;AACtC,MAAa,UAAA,IAAA;AAAA,KACf;AAAA,IACA,CAAC,YAAY,YAAY;AAAA,GAC3B;AAEA,EAAA,MAAM,kBAAqB,GAAA,WAAA;AAAA,IACzB,CAAC,CAAM,KAAA;AACL,MAAA,YAAA,GAAe,EAAE,IAAA,EAAM,QAAS,EAAA,EAAG,CAAC,CAAA;AACpC,MAAW,QAAA,IAAA;AAAA,KACb;AAAA,IACA,CAAC,UAAU,YAAY;AAAA,GACzB;AAEA,EAAO,OAAA;AAAA,IACL,OAAA;AAAA,IACA,UAAA;AAAA,IACA,aAAA;AAAA,IACA,WAAa,EAAA,eAAA;AAAA,IACb,OAAS,EAAA,WAAA;AAAA,IACT,cAAgB,EAAA,kBAAA;AAAA,IAChB,WAAa,EAAA,eAAA;AAAA,IACb,gBAAkB,EAAA,oBAAA;AAAA,IAClB,cAAgB,EAAA,kBAAA;AAAA,IAChB,cAAgB,EAAA,kBAAA;AAAA,IAChB,QAAA;AAAA,IACA;AAAA,GACF;AACF;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LayoutProvider.js","sources":["../../src/layout-provider/LayoutProvider.tsx"],"sourcesContent":["import {\n VuuShellLocation,\n logger,\n usePlaceholderJSON,\n type LayoutJSON,\n} from \"@vuu-ui/vuu-utils\";\nimport {\n RefObject,\n useCallback,\n useContext,\n useEffect,\n useMemo,\n useRef,\n useState,\n type ReactElement,\n} from \"react\";\nimport {\n LayoutActionType,\n LayoutProps,\n cloneElementAddLayoutProps,\n layoutFromJson,\n layoutQuery,\n layoutReducer,\n layoutToJSON,\n type LayoutChangeHandler,\n type LayoutChangeReason,\n type LayoutReducerAction,\n} from \"../layout-reducer\";\nimport type { SaveAction } from \"../layout-view\";\nimport { findTarget, getChildProp, getProp, getProps, typeOf } from \"../utils\";\nimport {\n LayoutProviderContext,\n LayoutProviderDispatch,\n} from \"./LayoutProviderContext\";\nimport { useLayoutDragDrop } from \"./useLayoutDragDrop\";\n\nconst { info } = logger(\"LayoutProvider\");\n\nconst isWorkspaceContainer = (props: LayoutProps) =>\n props.id === VuuShellLocation.WorkspaceContainer;\n\nconst isMultiWorkspaceContainer = (props: LayoutProps) =>\n props.id === VuuShellLocation.MultiWorkspaceContainer;\n\nconst shouldSave = (action: LayoutReducerAction) =>\n [\n \"add\",\n \"drag-drop\",\n \"remove\",\n \"set-title\",\n \"splitter-resize\",\n \"switch-tab\",\n ].includes(action.type);\n\nconst getLayoutChangeReason = (\n action: LayoutReducerAction | SaveAction,\n): LayoutChangeReason => {\n switch (action.type) {\n case \"switch-tab\":\n if (action.id === VuuShellLocation.Workspace) {\n return \"switch-active-layout\";\n } else {\n return \"switch-active-tab\";\n }\n case \"save\":\n return \"save-feature-props\";\n case \"drag-drop\":\n return \"drag-drop-operation\";\n case \"add\":\n return \"add-component\";\n case \"remove\":\n return \"remove-component\";\n case \"splitter-resize\":\n return \"resize-component\";\n case \"set-title\":\n return \"edit-feature-title\";\n default:\n throw Error(\"unknown layout action\");\n }\n};\n\nexport interface LayoutProviderProps {\n children: ReactElement;\n createNewChild?: (index?: number) => ReactElement;\n workspaceJSON?: LayoutJSON | LayoutJSON[];\n onLayoutChange?: LayoutChangeHandler;\n}\n\nexport const LayoutProviderVersion = () => {\n const version = useLayoutProviderVersion();\n return <div>{`Context: ${version} `}</div>;\n};\n\nconst pathToDropTarget = `#${VuuShellLocation.Workspace}.ACTIVE_CHILD`;\n\nexport const LayoutProvider = (props: LayoutProviderProps): ReactElement => {\n const { children, createNewChild, workspaceJSON, onLayoutChange } = props;\n const state = useRef<ReactElement | undefined>(undefined);\n const childrenRef = useRef<ReactElement>(children);\n\n const [, forceRefresh] = useState<unknown>(null);\n\n const serializeState = useCallback(\n (source: ReactElement, layoutChangeReason: LayoutChangeReason) => {\n if (onLayoutChange) {\n const workspaceContainer =\n findTarget(source, isWorkspaceContainer) || state.current;\n const isLayoutContainer =\n typeOf(workspaceContainer) === \"LayoutContainer\";\n const target = isLayoutContainer\n ? getProps(workspaceContainer).children[0]\n : workspaceContainer;\n const serializedModel = layoutToJSON(target);\n onLayoutChange(serializedModel, layoutChangeReason);\n }\n },\n [onLayoutChange],\n );\n\n const dispatchLayoutAction = useCallback(\n (action: LayoutReducerAction, suppressSave = false) => {\n const nextState = layoutReducer(state.current as ReactElement, action);\n if (nextState !== state.current) {\n state.current = nextState;\n forceRefresh({});\n if (!suppressSave && shouldSave(action)) {\n serializeState(nextState, getLayoutChangeReason(action));\n }\n }\n },\n [forceRefresh, serializeState],\n );\n\n const addComponentToWorkspace = useCallback(\n (component: ReactElement) => {\n dispatchLayoutAction({\n type: \"add\",\n path: `#${VuuShellLocation.Workspace}`,\n component,\n });\n },\n [dispatchLayoutAction],\n );\n\n const switchWorkspace = useCallback(\n (idx: number) => {\n dispatchLayoutAction({\n type: \"switch-tab\",\n nextIdx: idx,\n path: `#${VuuShellLocation.MultiWorkspaceContainer}`,\n });\n },\n [dispatchLayoutAction],\n );\n\n const showComponentInContextPanel = useCallback(\n (\n component: ReactElement | LayoutJSON,\n title?: string,\n onContextPanelClose?: () => void,\n ) => {\n dispatchLayoutAction({\n type: \"set-props\",\n path: `#${VuuShellLocation.ContextPanel}`,\n props: {\n expanded: true,\n content: component,\n onClose: onContextPanelClose,\n title,\n },\n });\n },\n [dispatchLayoutAction],\n );\n\n const layoutActionDispatcher = useCallback<LayoutProviderDispatch>(\n (action) => {\n switch (action.type) {\n case \"drag-start\": {\n prepareToDragLayout(action);\n break;\n }\n case \"save\": {\n if (state.current) {\n serializeState(state.current, getLayoutChangeReason(action));\n }\n break;\n }\n case \"query\":\n if (action.query === \"PARENT_CONTAINER\") {\n return layoutQuery(action.query, action.path, state.current);\n }\n break;\n\n default: {\n dispatchLayoutAction(action);\n break;\n }\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [dispatchLayoutAction, serializeState],\n );\n\n const prepareToDragLayout = useLayoutDragDrop(\n state as RefObject<ReactElement>,\n layoutActionDispatcher,\n pathToDropTarget,\n );\n\n useEffect(() => {\n if (workspaceJSON) {\n info?.(\"workspaceJSON changed. inject new layout into application\");\n if (Array.isArray(workspaceJSON)) {\n const targetContainer = findTarget(\n state.current,\n isMultiWorkspaceContainer,\n ) as ReactElement;\n if (targetContainer) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const { path: targetContainerPath } = targetContainer.props as any;\n const target = getChildProp(targetContainer);\n const newLayouts = workspaceJSON.map((ws, i) =>\n layoutFromJson(ws, `${targetContainerPath}.${i}`),\n );\n const action = target\n ? {\n type: LayoutActionType.REPLACE,\n target,\n replacement: newLayouts,\n }\n : {\n type: LayoutActionType.ADD,\n path: targetContainerPath,\n component: newLayouts,\n };\n dispatchLayoutAction(action, true);\n }\n } else {\n const targetContainer = findTarget(\n state.current,\n isWorkspaceContainer,\n ) as ReactElement;\n if (targetContainer) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const { path: targetContainerPath } = targetContainer.props as any;\n const target = getChildProp(targetContainer);\n const newLayout = layoutFromJson(\n workspaceJSON,\n `${targetContainerPath}.0`,\n );\n const action = target\n ? {\n type: LayoutActionType.REPLACE,\n target,\n replacement: newLayout,\n }\n : {\n type: LayoutActionType.ADD,\n path: targetContainerPath,\n component: newLayout,\n };\n dispatchLayoutAction(action, true);\n } else if (workspaceJSON.id === getProp(state.current, \"id\")) {\n const newLayout = layoutFromJson(workspaceJSON, \"0\");\n const action = {\n type: LayoutActionType.REPLACE,\n target: state.current,\n replacement: newLayout,\n };\n dispatchLayoutAction(action, true);\n } else {\n throw Error(\n `LayoutProvider unable to render new workspaceJson, no valid target container. Use a valid Shell Layout Template or include a container with the standard workspace id '${VuuShellLocation.Workspace}' `,\n );\n }\n }\n }\n }, [dispatchLayoutAction, workspaceJSON]);\n\n if (state.current === undefined) {\n state.current = cloneElementAddLayoutProps(children);\n } else if (children !== childrenRef.current) {\n state.current = cloneElementAddLayoutProps(children, state.current);\n childrenRef.current = children;\n }\n\n return (\n <LayoutProviderContext.Provider\n value={{\n addComponentToWorkspace,\n createNewChild,\n dispatchLayoutProvider: layoutActionDispatcher,\n showComponentInContextPanel,\n switchWorkspace,\n version: 0,\n }}\n >\n {state.current}\n </LayoutProviderContext.Provider>\n );\n};\n\nexport const useLayoutProviderDispatch = () => {\n const { dispatchLayoutProvider } = useContext(LayoutProviderContext);\n return dispatchLayoutProvider;\n};\n\nexport const useLayoutOperation = () => {\n const {\n addComponentToWorkspace,\n showComponentInContextPanel,\n switchWorkspace,\n } = useContext(LayoutProviderContext);\n return {\n addComponentToWorkspace,\n showComponentInContextPanel,\n switchWorkspace,\n };\n};\n\nexport const useLayoutCreateNewChild = () => {\n const layoutPlaceholderJSON = usePlaceholderJSON();\n const { createNewChild } = useContext(LayoutProviderContext);\n\n const defaultCreateNewChild = useMemo(\n () =>\n function createNewChild() {\n if (layoutPlaceholderJSON) {\n const { props } = layoutPlaceholderJSON;\n return layoutFromJson(\n {\n ...layoutPlaceholderJSON,\n props: {\n ...props,\n resizeable: true,\n style: {\n ...props?.style,\n flexGrow: 1,\n flexShrink: 0,\n flexBasis: 0,\n },\n },\n },\n \"0\",\n );\n }\n return layoutFromJson(\n {\n type: \"Placeholder\",\n props: {\n resizeable: true,\n style: {\n flexGrow: 1,\n flexShrink: 0,\n flexBasis: 0,\n },\n },\n },\n \"0\",\n );\n },\n [layoutPlaceholderJSON],\n );\n\n return createNewChild ?? defaultCreateNewChild;\n};\n\nexport const useLayoutProviderVersion = () => {\n const { version } = useContext(LayoutProviderContext);\n return version;\n};\n"],"names":["createNewChild"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"LayoutProvider.js","sources":["../../../../packages/vuu-layout/src/layout-provider/LayoutProvider.tsx"],"sourcesContent":["import {\n VuuShellLocation,\n logger,\n usePlaceholderJSON,\n type LayoutJSON,\n} from \"@vuu-ui/vuu-utils\";\nimport {\n RefObject,\n useCallback,\n useContext,\n useEffect,\n useMemo,\n useRef,\n useState,\n type ReactElement,\n} from \"react\";\nimport {\n LayoutActionType,\n LayoutProps,\n cloneElementAddLayoutProps,\n layoutFromJson,\n layoutQuery,\n layoutReducer,\n layoutToJSON,\n type LayoutChangeHandler,\n type LayoutChangeReason,\n type LayoutReducerAction,\n} from \"../layout-reducer\";\nimport type { SaveAction } from \"../layout-view\";\nimport { findTarget, getChildProp, getProp, getProps, typeOf } from \"../utils\";\nimport {\n LayoutProviderContext,\n LayoutProviderDispatch,\n} from \"./LayoutProviderContext\";\nimport { useLayoutDragDrop } from \"./useLayoutDragDrop\";\n\nconst { info } = logger(\"LayoutProvider\");\n\nconst isWorkspaceContainer = (props: LayoutProps) =>\n props.id === VuuShellLocation.WorkspaceContainer;\n\nconst isMultiWorkspaceContainer = (props: LayoutProps) =>\n props.id === VuuShellLocation.MultiWorkspaceContainer;\n\nconst shouldSave = (action: LayoutReducerAction) =>\n [\n \"add\",\n \"drag-drop\",\n \"remove\",\n \"set-title\",\n \"splitter-resize\",\n \"switch-tab\",\n ].includes(action.type);\n\nconst getLayoutChangeReason = (\n action: LayoutReducerAction | SaveAction,\n): LayoutChangeReason => {\n switch (action.type) {\n case \"switch-tab\":\n if (action.id === VuuShellLocation.Workspace) {\n return \"switch-active-layout\";\n } else {\n return \"switch-active-tab\";\n }\n case \"save\":\n return \"save-feature-props\";\n case \"drag-drop\":\n return \"drag-drop-operation\";\n case \"add\":\n return \"add-component\";\n case \"remove\":\n return \"remove-component\";\n case \"splitter-resize\":\n return \"resize-component\";\n case \"set-title\":\n return \"edit-feature-title\";\n default:\n throw Error(\"unknown layout action\");\n }\n};\n\nexport interface LayoutProviderProps {\n children: ReactElement;\n createNewChild?: (index?: number) => ReactElement;\n workspaceJSON?: LayoutJSON | LayoutJSON[];\n onLayoutChange?: LayoutChangeHandler;\n}\n\nexport const LayoutProviderVersion = () => {\n const version = useLayoutProviderVersion();\n return <div>{`Context: ${version} `}</div>;\n};\n\nconst pathToDropTarget = `#${VuuShellLocation.Workspace}.ACTIVE_CHILD`;\n\nexport const LayoutProvider = (props: LayoutProviderProps): ReactElement => {\n const { children, createNewChild, workspaceJSON, onLayoutChange } = props;\n const state = useRef<ReactElement | undefined>(undefined);\n const childrenRef = useRef<ReactElement>(children);\n\n const [, forceRefresh] = useState<unknown>(null);\n\n const serializeState = useCallback(\n (source: ReactElement, layoutChangeReason: LayoutChangeReason) => {\n if (onLayoutChange) {\n const workspaceContainer =\n findTarget(source, isWorkspaceContainer) || state.current;\n const isLayoutContainer =\n typeOf(workspaceContainer) === \"LayoutContainer\";\n const target = isLayoutContainer\n ? getProps(workspaceContainer).children[0]\n : workspaceContainer;\n const serializedModel = layoutToJSON(target);\n onLayoutChange(serializedModel, layoutChangeReason);\n }\n },\n [onLayoutChange],\n );\n\n const dispatchLayoutAction = useCallback(\n (action: LayoutReducerAction, suppressSave = false) => {\n const nextState = layoutReducer(state.current as ReactElement, action);\n if (nextState !== state.current) {\n state.current = nextState;\n forceRefresh({});\n if (!suppressSave && shouldSave(action)) {\n serializeState(nextState, getLayoutChangeReason(action));\n }\n }\n },\n [forceRefresh, serializeState],\n );\n\n const addComponentToWorkspace = useCallback(\n (component: ReactElement) => {\n dispatchLayoutAction({\n type: \"add\",\n path: `#${VuuShellLocation.Workspace}`,\n component,\n });\n },\n [dispatchLayoutAction],\n );\n\n const switchWorkspace = useCallback(\n (idx: number) => {\n dispatchLayoutAction({\n type: \"switch-tab\",\n nextIdx: idx,\n path: `#${VuuShellLocation.MultiWorkspaceContainer}`,\n });\n },\n [dispatchLayoutAction],\n );\n\n const showComponentInContextPanel = useCallback(\n (\n component: ReactElement | LayoutJSON,\n title?: string,\n onContextPanelClose?: () => void,\n ) => {\n dispatchLayoutAction({\n type: \"set-props\",\n path: `#${VuuShellLocation.ContextPanel}`,\n props: {\n expanded: true,\n content: component,\n onClose: onContextPanelClose,\n title,\n },\n });\n },\n [dispatchLayoutAction],\n );\n\n const layoutActionDispatcher = useCallback<LayoutProviderDispatch>(\n (action) => {\n switch (action.type) {\n case \"drag-start\": {\n prepareToDragLayout(action);\n break;\n }\n case \"save\": {\n if (state.current) {\n serializeState(state.current, getLayoutChangeReason(action));\n }\n break;\n }\n case \"query\":\n if (action.query === \"PARENT_CONTAINER\") {\n return layoutQuery(action.query, action.path, state.current);\n }\n break;\n\n default: {\n dispatchLayoutAction(action);\n break;\n }\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [dispatchLayoutAction, serializeState],\n );\n\n const prepareToDragLayout = useLayoutDragDrop(\n state as RefObject<ReactElement>,\n layoutActionDispatcher,\n pathToDropTarget,\n );\n\n useEffect(() => {\n if (workspaceJSON) {\n info?.(\"workspaceJSON changed. inject new layout into application\");\n if (Array.isArray(workspaceJSON)) {\n const targetContainer = findTarget(\n state.current,\n isMultiWorkspaceContainer,\n ) as ReactElement;\n if (targetContainer) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const { path: targetContainerPath } = targetContainer.props as any;\n const target = getChildProp(targetContainer);\n const newLayouts = workspaceJSON.map((ws, i) =>\n layoutFromJson(ws, `${targetContainerPath}.${i}`),\n );\n const action = target\n ? {\n type: LayoutActionType.REPLACE,\n target,\n replacement: newLayouts,\n }\n : {\n type: LayoutActionType.ADD,\n path: targetContainerPath,\n component: newLayouts,\n };\n dispatchLayoutAction(action, true);\n }\n } else {\n const targetContainer = findTarget(\n state.current,\n isWorkspaceContainer,\n ) as ReactElement;\n if (targetContainer) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const { path: targetContainerPath } = targetContainer.props as any;\n const target = getChildProp(targetContainer);\n const newLayout = layoutFromJson(\n workspaceJSON,\n `${targetContainerPath}.0`,\n );\n const action = target\n ? {\n type: LayoutActionType.REPLACE,\n target,\n replacement: newLayout,\n }\n : {\n type: LayoutActionType.ADD,\n path: targetContainerPath,\n component: newLayout,\n };\n dispatchLayoutAction(action, true);\n } else if (workspaceJSON.id === getProp(state.current, \"id\")) {\n const newLayout = layoutFromJson(workspaceJSON, \"0\");\n const action = {\n type: LayoutActionType.REPLACE,\n target: state.current,\n replacement: newLayout,\n };\n dispatchLayoutAction(action, true);\n } else {\n throw Error(\n `LayoutProvider unable to render new workspaceJson, no valid target container. Use a valid Shell Layout Template or include a container with the standard workspace id '${VuuShellLocation.Workspace}' `,\n );\n }\n }\n }\n }, [dispatchLayoutAction, workspaceJSON]);\n\n if (state.current === undefined) {\n state.current = cloneElementAddLayoutProps(children);\n } else if (children !== childrenRef.current) {\n state.current = cloneElementAddLayoutProps(children, state.current);\n childrenRef.current = children;\n }\n\n return (\n <LayoutProviderContext.Provider\n value={{\n addComponentToWorkspace,\n createNewChild,\n dispatchLayoutProvider: layoutActionDispatcher,\n showComponentInContextPanel,\n switchWorkspace,\n version: 0,\n }}\n >\n {state.current}\n </LayoutProviderContext.Provider>\n );\n};\n\nexport const useLayoutProviderDispatch = () => {\n const { dispatchLayoutProvider } = useContext(LayoutProviderContext);\n return dispatchLayoutProvider;\n};\n\nexport const useLayoutOperation = () => {\n const {\n addComponentToWorkspace,\n showComponentInContextPanel,\n switchWorkspace,\n } = useContext(LayoutProviderContext);\n return {\n addComponentToWorkspace,\n showComponentInContextPanel,\n switchWorkspace,\n };\n};\n\nexport const useLayoutCreateNewChild = () => {\n const layoutPlaceholderJSON = usePlaceholderJSON();\n const { createNewChild } = useContext(LayoutProviderContext);\n\n const defaultCreateNewChild = useMemo(\n () =>\n function createNewChild() {\n if (layoutPlaceholderJSON) {\n const { props } = layoutPlaceholderJSON;\n return layoutFromJson(\n {\n ...layoutPlaceholderJSON,\n props: {\n ...props,\n resizeable: true,\n style: {\n ...props?.style,\n flexGrow: 1,\n flexShrink: 0,\n flexBasis: 0,\n },\n },\n },\n \"0\",\n );\n }\n return layoutFromJson(\n {\n type: \"Placeholder\",\n props: {\n resizeable: true,\n style: {\n flexGrow: 1,\n flexShrink: 0,\n flexBasis: 0,\n },\n },\n },\n \"0\",\n );\n },\n [layoutPlaceholderJSON],\n );\n\n return createNewChild ?? defaultCreateNewChild;\n};\n\nexport const useLayoutProviderVersion = () => {\n const { version } = useContext(LayoutProviderContext);\n return version;\n};\n"],"names":["createNewChild"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LayoutProviderContext.js","sources":["
|
|
1
|
+
{"version":3,"file":"LayoutProviderContext.js","sources":["../../../../packages/vuu-layout/src/layout-provider/LayoutProviderContext.ts"],"sourcesContent":["import { createContext, Dispatch, ReactElement } from \"react\";\nimport {\n DragStartAction,\n LayoutReducerAction,\n QueryAction,\n} from \"../layout-reducer\";\nimport { SaveAction } from \"../layout-view\";\nimport { LayoutJSON } from \"@vuu-ui/vuu-utils\";\n\nconst unconfiguredLayoutProviderDispatch: LayoutProviderDispatch = (action) =>\n console.log(\n `dispatch ${action.type}, have you forgotten to provide a LayoutProvider ?`,\n );\n\nconst unconfiguredService = (message: string) => () =>\n console.log(`${message}, have you forgotten to provide a LayoutProvider ?`);\n\nconst MissingLayoutContextPanel = unconfiguredService(\n \"showComponentInContextPanel\",\n);\n\nexport const isUnconfiguredProperty = (property: unknown): boolean =>\n property === MissingLayoutContextPanel;\n\nexport type LayoutProviderDispatch = Dispatch<\n LayoutReducerAction | SaveAction | DragStartAction | QueryAction\n>;\n\nexport interface LayoutProviderContextProps {\n addComponentToWorkspace: (component: ReactElement) => void;\n createNewChild?: (index?: number) => ReactElement;\n dispatchLayoutProvider: LayoutProviderDispatch;\n showComponentInContextPanel: (\n component: ReactElement | LayoutJSON,\n title?: string,\n onContextPanelClose?: () => void,\n ) => void;\n switchWorkspace: (idx: number) => void;\n version: number;\n}\n\nexport const LayoutProviderContext = createContext<LayoutProviderContextProps>({\n addComponentToWorkspace: unconfiguredService(\"addComponentToWorkspace\"),\n dispatchLayoutProvider: unconfiguredLayoutProviderDispatch,\n showComponentInContextPanel: MissingLayoutContextPanel,\n switchWorkspace: unconfiguredService(\"switchWorkspace\"),\n version: -1,\n});\n"],"names":[],"mappings":";;AASA,MAAM,kCAAA,GAA6D,CAAC,MAAA,KAClE,OAAQ,CAAA,GAAA;AAAA,EACN,CAAA,SAAA,EAAY,OAAO,IAAI,CAAA,kDAAA;AACzB,CAAA;AAEF,MAAM,mBAAA,GAAsB,CAAC,OAAoB,KAAA,MAC/C,QAAQ,GAAI,CAAA,CAAA,EAAG,OAAO,CAAoD,kDAAA,CAAA,CAAA;AAE5E,MAAM,yBAA4B,GAAA,mBAAA;AAAA,EAChC;AACF,CAAA;AAEa,MAAA,sBAAA,GAAyB,CAAC,QAAA,KACrC,QAAa,KAAA;AAmBR,MAAM,wBAAwB,aAA0C,CAAA;AAAA,EAC7E,uBAAA,EAAyB,oBAAoB,yBAAyB,CAAA;AAAA,EACtE,sBAAwB,EAAA,kCAAA;AAAA,EACxB,2BAA6B,EAAA,yBAAA;AAAA,EAC7B,eAAA,EAAiB,oBAAoB,iBAAiB,CAAA;AAAA,EACtD,OAAS,EAAA,CAAA;AACX,CAAC;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useLayoutDragDrop.js","sources":["../../src/layout-provider/useLayoutDragDrop.ts"],"sourcesContent":["import { MutableRefObject, ReactElement, useCallback, useRef } from \"react\";\nimport {\n DragDropRect,\n DragEndCallback,\n Draggable,\n DragInstructions,\n DragMoveCallback,\n} from \"../drag-drop\";\nimport { DragStartAction } from \"../layout-reducer\";\nimport { getIntrinsicSize } from \"../layout-reducer/flexUtils\";\nimport { followPath, resolvePath } from \"../utils\";\nimport { LayoutProviderDispatch } from \"./LayoutProviderContext\";\n\nconst NO_INSTRUCTIONS = {} as DragInstructions;\nconst NO_OFFSETS: [number, number] = [0, 0];\n\ninterface CurrentDragAction extends Omit<DragStartAction, \"evt\" | \"type\"> {\n dragContainerPath: string;\n}\n\ninterface DragOperation {\n payload: ReactElement;\n originalCSS: string;\n dragRect: unknown;\n dragInstructions: DragInstructions;\n dragOffsets: [number, number];\n targetPosition: { left: number; top: number };\n}\n\nconst getDragElement = (\n rect: DragDropRect,\n id: string,\n dragElement?: HTMLElement,\n): [HTMLElement, string, number, number] => {\n const wrapper = document.createElement(\"div\");\n wrapper.className = \"vuuSimpleDraggableWrapper\";\n wrapper.classList.add(\n \"vuuSimpleDraggableWrapper\",\n \"salt-theme\",\n \"salt-density-medium\",\n );\n wrapper.dataset.dragging = \"true\";\n\n const div = dragElement ?? document.createElement(\"div\");\n div.id = id;\n\n wrapper.appendChild(div);\n document.body.appendChild(wrapper);\n const cssText = `top:${rect.top}px;left:${rect.left}px;width:${rect.width}px;height:${rect.height}px;`;\n return [wrapper, cssText, rect.left, rect.top];\n};\n\nconst determineDragOffsets = (\n draggedElement: HTMLElement,\n): [number, number] => {\n const { offsetParent } = draggedElement;\n if (offsetParent === null) {\n return NO_OFFSETS;\n } else {\n const { left: offsetLeft, top: offsetTop } =\n offsetParent.getBoundingClientRect();\n return [offsetLeft, offsetTop];\n }\n};\n\nexport const useLayoutDragDrop = (\n rootLayoutRef: MutableRefObject<ReactElement>,\n dispatch: LayoutProviderDispatch,\n pathToDropTarget?: string,\n) => {\n const dragActionRef = useRef<CurrentDragAction>(undefined);\n const dragOperationRef = useRef<DragOperation>(undefined);\n const draggableHTMLElementRef = useRef<HTMLElement>(undefined);\n\n const handleDrag = useCallback<DragMoveCallback>((x, y) => {\n if (dragOperationRef.current && draggableHTMLElementRef.current) {\n const {\n dragOffsets: [offsetX, offsetY],\n targetPosition,\n } = dragOperationRef.current;\n const left = typeof x === \"number\" ? x - offsetX : targetPosition.left;\n const top = typeof y === \"number\" ? y - offsetY : targetPosition.top;\n if (left !== targetPosition.left || top !== targetPosition.top) {\n dragOperationRef.current.targetPosition.left = left;\n dragOperationRef.current.targetPosition.top = top;\n draggableHTMLElementRef.current.style.top = top + \"px\";\n draggableHTMLElementRef.current.style.left = left + \"px\";\n }\n }\n }, []);\n\n const handleDrop: DragEndCallback = useCallback(\n (dropTarget) => {\n if (dragOperationRef.current) {\n const {\n dragInstructions,\n payload: draggedReactElement,\n originalCSS,\n } = dragOperationRef.current;\n\n if (dropTarget) {\n dispatch({\n type: \"drag-drop\",\n draggedReactElement,\n dragInstructions,\n dropTarget,\n });\n }\n\n if (draggableHTMLElementRef.current) {\n if (!dropTarget && dragInstructions.DriftHomeIfNoDropTarget) {\n console.log(\"drift back to start\");\n document.body.removeChild(draggableHTMLElementRef.current);\n } else if (dragInstructions.RemoveDraggableOnDragEnd) {\n document.body.removeChild(draggableHTMLElementRef.current);\n } else {\n draggableHTMLElementRef.current.style.cssText = originalCSS;\n delete draggableHTMLElementRef.current.dataset.dragging;\n }\n }\n\n dragActionRef.current = undefined;\n dragOperationRef.current = undefined;\n draggableHTMLElementRef.current = undefined;\n }\n },\n [dispatch],\n );\n\n const handleDragStart = useCallback(\n (evt: MouseEvent) => {\n if (dragActionRef.current) {\n const {\n payload: component,\n dragContainerPath,\n dragElement,\n dragRect,\n instructions = NO_INSTRUCTIONS,\n path,\n } = dragActionRef.current;\n const { current: rootLayout } = rootLayoutRef;\n const dragPos = { x: evt.clientX, y: evt.clientY };\n const dragPayload = component ?? followPath(rootLayout, path, true);\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const { id: dragPayloadId } = dragPayload.props as any;\n const intrinsicSize = getIntrinsicSize(dragPayload);\n let originalCSS = \"\",\n dragCSS = \"\",\n dragTransform = \"\";\n\n let dragStartLeft = -1;\n let dragStartTop = -1;\n let dragOffsets: [number, number] = NO_OFFSETS;\n\n let element = document.getElementById(dragPayloadId);\n\n if (element === null) {\n [element, dragCSS, dragStartLeft, dragStartTop] = getDragElement(\n dragRect,\n dragPayloadId,\n dragElement,\n );\n } else {\n dragOffsets = determineDragOffsets(element);\n const [offsetLeft, offsetTop] = dragOffsets;\n const { width, height, left, top } = element.getBoundingClientRect();\n dragStartLeft = left - offsetLeft;\n dragStartTop = top - offsetTop;\n dragCSS = `width:${width}px;height:${height}px;left:${dragStartLeft}px;top:${dragStartTop}px;z-index: 100;background-color:#ccc;opacity: 0.6;`;\n element.dataset.dragging = \"true\";\n originalCSS = element.style.cssText;\n }\n\n dragTransform = Draggable.initDrag(\n rootLayoutRef.current,\n dragContainerPath,\n dragRect,\n dragPos,\n {\n drag: handleDrag,\n drop: handleDrop,\n },\n intrinsicSize,\n // dropTargets\n );\n\n element.style.cssText = dragCSS + dragTransform;\n draggableHTMLElementRef.current = element;\n\n dragOperationRef.current = {\n payload: dragPayload,\n originalCSS,\n dragRect,\n dragOffsets,\n dragInstructions: instructions,\n targetPosition: { left: dragStartLeft, top: dragStartTop },\n };\n }\n },\n [handleDrag, handleDrop, rootLayoutRef],\n );\n\n const prepareToDrag = useCallback(\n (action: DragStartAction) => {\n const { evt, ...options } = action;\n try {\n dragActionRef.current = {\n ...options,\n dragContainerPath: resolvePath(\n rootLayoutRef.current,\n pathToDropTarget,\n ),\n };\n Draggable.handleMousedown(evt, handleDragStart, options.instructions);\n } catch (err) {\n console.warn(\n `[useLayoutDragDrop] path ${pathToDropTarget} not resolved, the application layout does not have the required elements to support drag drop`,\n );\n }\n },\n [handleDragStart, pathToDropTarget, rootLayoutRef],\n );\n\n return prepareToDrag;\n};\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"useLayoutDragDrop.js","sources":["../../../../packages/vuu-layout/src/layout-provider/useLayoutDragDrop.ts"],"sourcesContent":["import { MutableRefObject, ReactElement, useCallback, useRef } from \"react\";\nimport {\n DragDropRect,\n DragEndCallback,\n Draggable,\n DragInstructions,\n DragMoveCallback,\n} from \"../drag-drop\";\nimport { DragStartAction } from \"../layout-reducer\";\nimport { getIntrinsicSize } from \"../layout-reducer/flexUtils\";\nimport { followPath, resolvePath } from \"../utils\";\nimport { LayoutProviderDispatch } from \"./LayoutProviderContext\";\n\nconst NO_INSTRUCTIONS = {} as DragInstructions;\nconst NO_OFFSETS: [number, number] = [0, 0];\n\ninterface CurrentDragAction extends Omit<DragStartAction, \"evt\" | \"type\"> {\n dragContainerPath: string;\n}\n\ninterface DragOperation {\n payload: ReactElement;\n originalCSS: string;\n dragRect: unknown;\n dragInstructions: DragInstructions;\n dragOffsets: [number, number];\n targetPosition: { left: number; top: number };\n}\n\nconst getDragElement = (\n rect: DragDropRect,\n id: string,\n dragElement?: HTMLElement,\n): [HTMLElement, string, number, number] => {\n const wrapper = document.createElement(\"div\");\n wrapper.className = \"vuuSimpleDraggableWrapper\";\n wrapper.classList.add(\n \"vuuSimpleDraggableWrapper\",\n \"salt-theme\",\n \"salt-density-medium\",\n );\n wrapper.dataset.dragging = \"true\";\n\n const div = dragElement ?? document.createElement(\"div\");\n div.id = id;\n\n wrapper.appendChild(div);\n document.body.appendChild(wrapper);\n const cssText = `top:${rect.top}px;left:${rect.left}px;width:${rect.width}px;height:${rect.height}px;`;\n return [wrapper, cssText, rect.left, rect.top];\n};\n\nconst determineDragOffsets = (\n draggedElement: HTMLElement,\n): [number, number] => {\n const { offsetParent } = draggedElement;\n if (offsetParent === null) {\n return NO_OFFSETS;\n } else {\n const { left: offsetLeft, top: offsetTop } =\n offsetParent.getBoundingClientRect();\n return [offsetLeft, offsetTop];\n }\n};\n\nexport const useLayoutDragDrop = (\n rootLayoutRef: MutableRefObject<ReactElement>,\n dispatch: LayoutProviderDispatch,\n pathToDropTarget?: string,\n) => {\n const dragActionRef = useRef<CurrentDragAction>(undefined);\n const dragOperationRef = useRef<DragOperation>(undefined);\n const draggableHTMLElementRef = useRef<HTMLElement>(undefined);\n\n const handleDrag = useCallback<DragMoveCallback>((x, y) => {\n if (dragOperationRef.current && draggableHTMLElementRef.current) {\n const {\n dragOffsets: [offsetX, offsetY],\n targetPosition,\n } = dragOperationRef.current;\n const left = typeof x === \"number\" ? x - offsetX : targetPosition.left;\n const top = typeof y === \"number\" ? y - offsetY : targetPosition.top;\n if (left !== targetPosition.left || top !== targetPosition.top) {\n dragOperationRef.current.targetPosition.left = left;\n dragOperationRef.current.targetPosition.top = top;\n draggableHTMLElementRef.current.style.top = top + \"px\";\n draggableHTMLElementRef.current.style.left = left + \"px\";\n }\n }\n }, []);\n\n const handleDrop: DragEndCallback = useCallback(\n (dropTarget) => {\n if (dragOperationRef.current) {\n const {\n dragInstructions,\n payload: draggedReactElement,\n originalCSS,\n } = dragOperationRef.current;\n\n if (dropTarget) {\n dispatch({\n type: \"drag-drop\",\n draggedReactElement,\n dragInstructions,\n dropTarget,\n });\n }\n\n if (draggableHTMLElementRef.current) {\n if (!dropTarget && dragInstructions.DriftHomeIfNoDropTarget) {\n console.log(\"drift back to start\");\n document.body.removeChild(draggableHTMLElementRef.current);\n } else if (dragInstructions.RemoveDraggableOnDragEnd) {\n document.body.removeChild(draggableHTMLElementRef.current);\n } else {\n draggableHTMLElementRef.current.style.cssText = originalCSS;\n delete draggableHTMLElementRef.current.dataset.dragging;\n }\n }\n\n dragActionRef.current = undefined;\n dragOperationRef.current = undefined;\n draggableHTMLElementRef.current = undefined;\n }\n },\n [dispatch],\n );\n\n const handleDragStart = useCallback(\n (evt: MouseEvent) => {\n if (dragActionRef.current) {\n const {\n payload: component,\n dragContainerPath,\n dragElement,\n dragRect,\n instructions = NO_INSTRUCTIONS,\n path,\n } = dragActionRef.current;\n const { current: rootLayout } = rootLayoutRef;\n const dragPos = { x: evt.clientX, y: evt.clientY };\n const dragPayload = component ?? followPath(rootLayout, path, true);\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const { id: dragPayloadId } = dragPayload.props as any;\n const intrinsicSize = getIntrinsicSize(dragPayload);\n let originalCSS = \"\",\n dragCSS = \"\",\n dragTransform = \"\";\n\n let dragStartLeft = -1;\n let dragStartTop = -1;\n let dragOffsets: [number, number] = NO_OFFSETS;\n\n let element = document.getElementById(dragPayloadId);\n\n if (element === null) {\n [element, dragCSS, dragStartLeft, dragStartTop] = getDragElement(\n dragRect,\n dragPayloadId,\n dragElement,\n );\n } else {\n dragOffsets = determineDragOffsets(element);\n const [offsetLeft, offsetTop] = dragOffsets;\n const { width, height, left, top } = element.getBoundingClientRect();\n dragStartLeft = left - offsetLeft;\n dragStartTop = top - offsetTop;\n dragCSS = `width:${width}px;height:${height}px;left:${dragStartLeft}px;top:${dragStartTop}px;z-index: 100;background-color:#ccc;opacity: 0.6;`;\n element.dataset.dragging = \"true\";\n originalCSS = element.style.cssText;\n }\n\n dragTransform = Draggable.initDrag(\n rootLayoutRef.current,\n dragContainerPath,\n dragRect,\n dragPos,\n {\n drag: handleDrag,\n drop: handleDrop,\n },\n intrinsicSize,\n // dropTargets\n );\n\n element.style.cssText = dragCSS + dragTransform;\n draggableHTMLElementRef.current = element;\n\n dragOperationRef.current = {\n payload: dragPayload,\n originalCSS,\n dragRect,\n dragOffsets,\n dragInstructions: instructions,\n targetPosition: { left: dragStartLeft, top: dragStartTop },\n };\n }\n },\n [handleDrag, handleDrop, rootLayoutRef],\n );\n\n const prepareToDrag = useCallback(\n (action: DragStartAction) => {\n const { evt, ...options } = action;\n try {\n dragActionRef.current = {\n ...options,\n dragContainerPath: resolvePath(\n rootLayoutRef.current,\n pathToDropTarget,\n ),\n };\n Draggable.handleMousedown(evt, handleDragStart, options.instructions);\n } catch (err) {\n console.warn(\n `[useLayoutDragDrop] path ${pathToDropTarget} not resolved, the application layout does not have the required elements to support drag drop`,\n );\n }\n },\n [handleDragStart, pathToDropTarget, rootLayoutRef],\n );\n\n return prepareToDrag;\n};\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
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 } =\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n component.props as any;\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\n } = component.props as any;\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\n component.props as any;\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\n } = component.props as any;\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
|
+
{"version":3,"file":"flexUtils.js","sources":["../../../../packages/vuu-layout/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 } =\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n component.props as any;\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\n } = component.props as any;\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\n component.props as any;\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\n } = component.props as any;\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 +1 @@
|
|
|
1
|
-
{"version":3,"file":"insert-layout-element.js","sources":["../../src/layout-reducer/insert-layout-element.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { LayoutModel, rectTuple, uuid } from \"@vuu-ui/vuu-utils\";\nimport React, { ReactElement } from \"react\";\nimport { DropPos } from \"../drag-drop\";\nimport { DropTarget } from \"../drag-drop/DropTarget\";\nimport { getProp, getProps, nextStep, resetPath, typeOf } from \"../utils\";\nimport {\n createPlaceHolder,\n flexDirection,\n getFlexDimensions,\n getFlexOrIntrinsicStyle,\n getIntrinsicSize,\n wrapIntrinsicSizeComponentWithFlexbox,\n} from \"./flexUtils\";\nimport {\n LayoutProps,\n getDefaultTabLabel,\n getManagedDimension,\n} from \"./layoutUtils\";\n\ntype insertionPosition = \"before\" | \"after\";\n\nexport function getInsertTabBeforeAfter(stack: LayoutModel, pos: DropPos) {\n const { children: tabs } = stack.props as any;\n const tabCount = tabs.length;\n const { index = -1, positionRelativeToTab = \"after\" } = pos.tab || {};\n return index === -1 || index >= tabCount\n ? [tabs[tabCount - 1], \"after\"]\n : [tabs[index] ?? null, positionRelativeToTab];\n}\n\nexport function insertIntoContainer(\n container: ReactElement,\n targetContainer: ReactElement,\n newComponent: ReactElement | ReactElement[],\n): ReactElement {\n const {\n active: containerActive,\n children: containerChildren = [],\n path: containerPath,\n } = getProps(container) as LayoutProps;\n\n const existingComponentPath = getProp(targetContainer, \"path\");\n const { idx, finalStep } = nextStep(\n // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n containerPath!,\n existingComponentPath,\n true,\n );\n const [insertedIdx, children] = finalStep\n ? insertIntoChildren(container, containerChildren, newComponent)\n : [\n containerActive,\n containerChildren?.map((child, index) =>\n index === idx\n ? (insertIntoContainer(\n child,\n targetContainer,\n newComponent,\n ) as ReactElement)\n : child,\n ),\n ];\n const active =\n typeOf(container) === \"Stack\"\n ? Array.isArray(insertedIdx)\n ? (insertedIdx[0] as number)\n : insertedIdx\n : containerActive;\n\n return React.cloneElement(container, { active } as any, children);\n}\n\nconst getDefaultTitle = (\n containerType: string | undefined,\n component: ReactElement,\n index: number,\n existingLabels: string[],\n) =>\n containerType === \"Stack\"\n ? getDefaultTabLabel(component, index, existingLabels)\n : undefined;\n\nconst getChildrenTitles = (children: ReactElement[]) =>\n children.map((child) => (child.props as any).title);\n\nfunction insertIntoChildren(\n container: ReactElement,\n containerChildren: ReactElement[],\n newComponent: ReactElement | ReactElement[],\n): [number, ReactElement[]] {\n if (Array.isArray(newComponent)) {\n const [firstChild, ...rest] = newComponent;\n let [idx, children] = insertIntoChildren(\n container,\n containerChildren,\n firstChild,\n );\n for (const child of rest) {\n [, children] = insertIntoChildren(container, children, child);\n }\n return [idx, children];\n }\n\n const containerPath = getProp(container, \"path\");\n const count = containerChildren?.length;\n\n const {\n id = uuid(),\n title = getDefaultTitle(\n typeOf(container),\n newComponent,\n count ?? 0,\n getChildrenTitles(containerChildren),\n ),\n } = getProps(newComponent);\n\n if (count) {\n return [\n count,\n containerChildren.concat(\n resetPath(newComponent, `${containerPath}.${count}`, {\n id,\n key: id,\n title,\n }),\n ),\n ];\n } else {\n return [0, [resetPath(newComponent, `${containerPath}.0`, { id, title })]];\n }\n}\n\nexport function insertBesideChild(\n container: ReactElement,\n existingComponent: any,\n newComponent: any,\n insertionPosition: insertionPosition,\n pos?: DropPos,\n clientRect?: any,\n dropRect?: any,\n): ReactElement {\n const {\n active: containerActive,\n children: containerChildren,\n path: containerPath,\n } = getProps(container);\n\n const existingComponentPath = getProp(existingComponent, \"path\");\n const { idx, finalStep } = nextStep(containerPath, existingComponentPath);\n const [insertedIdx, children] = finalStep\n ? updateChildren(\n container,\n containerChildren,\n idx,\n newComponent,\n insertionPosition,\n // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n pos!,\n clientRect,\n dropRect,\n )\n : [\n containerActive,\n containerChildren.map((child: ReactElement, index: number) =>\n index === idx\n ? insertBesideChild(\n child,\n existingComponent,\n newComponent,\n insertionPosition,\n pos,\n clientRect,\n dropRect,\n )\n : child,\n ),\n ];\n\n const active = typeOf(container) === \"Stack\" ? insertedIdx : containerActive;\n return React.cloneElement(container, { active } as any, children);\n}\n\nfunction updateChildren(\n container: LayoutModel,\n containerChildren: ReactElement[],\n idx: number,\n newComponent: ReactElement,\n insertionPosition: insertionPosition,\n pos: DropPos,\n clientRect: DropTarget[\"clientRect\"],\n dropRect: DropTarget[\"dropRect\"],\n) {\n const intrinsicSize = getIntrinsicSize(newComponent);\n if (intrinsicSize?.width && intrinsicSize?.height) {\n return insertIntrinsicSizedComponent(\n container,\n containerChildren,\n idx,\n newComponent,\n insertionPosition,\n clientRect,\n // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n dropRect!,\n );\n } else {\n return insertFlexComponent(\n container,\n containerChildren,\n idx,\n newComponent,\n insertionPosition,\n pos?.width || pos?.height,\n clientRect,\n );\n }\n}\n\nconst getLeadingPlaceholderSize = (\n flexDirection: flexDirection,\n insertionPosition: insertionPosition,\n { top, right, bottom, left }: DropTarget[\"clientRect\"],\n [rectLeft, rectTop, rectRight, rectBottom]: rectTuple,\n) => {\n if (flexDirection === \"column\" && insertionPosition === \"before\") {\n return rectTop - top;\n } else if (flexDirection === \"column\") {\n return bottom - rectBottom;\n } else if (flexDirection === \"row\" && insertionPosition === \"before\") {\n return rectLeft - left;\n } else if (flexDirection === \"row\") {\n return right - rectRight;\n }\n};\n\nfunction insertIntrinsicSizedComponent(\n container: LayoutModel,\n containerChildren: ReactElement[],\n idx: number,\n newComponent: ReactElement,\n insertionPosition: insertionPosition,\n clientRect: DropTarget[\"clientRect\"],\n dropRect: rectTuple,\n) {\n const {\n style: { flexDirection },\n } = getProps(container);\n const [dimension, crossDimension, contraDirection] =\n getFlexDimensions(flexDirection);\n const { [crossDimension]: intrinsicCrossSize, [dimension]: intrinsicSize } =\n getIntrinsicSize(newComponent) as { height: number; width: number };\n const path = getProp(containerChildren[idx], \"path\");\n\n const placeholderSize = getLeadingPlaceholderSize(\n flexDirection,\n insertionPosition,\n clientRect,\n dropRect,\n );\n\n const [itemToInsert, size] =\n intrinsicCrossSize < clientRect[crossDimension]\n ? [\n wrapIntrinsicSizeComponentWithFlexbox(\n newComponent,\n contraDirection,\n path,\n clientRect,\n dropRect,\n ),\n intrinsicSize,\n ]\n : [newComponent, undefined];\n\n const placeholder = placeholderSize\n ? createPlaceHolder(path, placeholderSize, { flexGrow: 0, flexShrink: 0 })\n : undefined;\n\n if (intrinsicCrossSize > clientRect[crossDimension]) {\n containerChildren = containerChildren.map((child) => {\n if (getProp(child, \"placeholder\")) {\n return child;\n } else {\n const { [crossDimension]: intrinsicCrossChildSize } = getIntrinsicSize(\n child,\n ) as {\n height: number;\n width: number;\n };\n if (\n intrinsicCrossChildSize &&\n intrinsicCrossChildSize < intrinsicCrossSize\n ) {\n return wrapIntrinsicSizeComponentWithFlexbox(\n child,\n contraDirection,\n getProp(child, \"path\"),\n );\n } else {\n return child;\n }\n }\n });\n }\n\n return insertFlexComponent(\n container,\n containerChildren,\n idx,\n itemToInsert,\n insertionPosition,\n size,\n clientRect,\n placeholder,\n );\n}\n\nfunction insertFlexComponent(\n container: LayoutModel,\n containerChildren: ReactElement[],\n idx: number,\n newComponent: ReactElement,\n insertionPosition: \"before\" | \"after\",\n size: number | undefined,\n targetRect: DropTarget[\"clientRect\"],\n placeholder?: ReactElement,\n) {\n const containerPath = getProp(container, \"path\");\n let insertedIdx = 0;\n const children =\n !containerChildren || containerChildren.length === 0\n ? [newComponent]\n : containerChildren\n .reduce<ReactElement[]>((arr, child, i) => {\n if (idx === i) {\n const [existingComponent, insertedComponent] =\n getStyledComponents(container, child, newComponent, targetRect);\n if (insertionPosition === \"before\") {\n if (placeholder) {\n arr.push(placeholder, insertedComponent, existingComponent);\n } else {\n arr.push(insertedComponent, existingComponent);\n }\n } else {\n if (placeholder) {\n arr.push(existingComponent, insertedComponent, placeholder);\n } else {\n arr.push(existingComponent, insertedComponent);\n }\n }\n insertedIdx = arr.indexOf(insertedComponent);\n } else {\n arr.push(child);\n }\n return arr;\n }, [])\n .map((child, i) =>\n i < insertedIdx ? child : resetPath(child, `${containerPath}.${i}`),\n );\n\n return [insertedIdx, children];\n}\n\nfunction getStyledComponents(\n container: LayoutModel,\n existingComponent: ReactElement,\n newComponent: ReactElement,\n targetRect: DropTarget[\"clientRect\"],\n): [ReactElement, ReactElement] {\n const id = uuid();\n let { version = 0 } = getProps(newComponent);\n version += 1;\n if (typeOf(container) === \"Flexbox\") {\n const { style: containerStyle } = container.props as any;\n const [dim] = getManagedDimension(containerStyle);\n const splitterSize = 6;\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n const size = { [dim]: (targetRect[dim] - splitterSize) / 2 };\n const existingComponentStyle = getFlexOrIntrinsicStyle(\n existingComponent,\n dim,\n size,\n );\n const newComponentStyle = getFlexOrIntrinsicStyle(newComponent, dim, size);\n\n return [\n React.cloneElement(existingComponent, {\n style: existingComponentStyle,\n } as any),\n React.cloneElement(newComponent, {\n id,\n version,\n style: newComponentStyle,\n } as any),\n ];\n } else {\n const {\n style: { left: _1, top: _2, flex: _3, ...style } = {\n left: undefined,\n top: undefined,\n flex: undefined,\n },\n } = getProps(newComponent);\n return [\n existingComponent,\n React.cloneElement(newComponent, {\n id,\n version,\n style: { ...style, flex: \"1 1 0px\" },\n } as any),\n ];\n }\n}\n"],"names":["flexDirection"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"insert-layout-element.js","sources":["../../../../packages/vuu-layout/src/layout-reducer/insert-layout-element.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { LayoutModel, rectTuple, uuid } from \"@vuu-ui/vuu-utils\";\nimport React, { ReactElement } from \"react\";\nimport { DropPos } from \"../drag-drop\";\nimport { DropTarget } from \"../drag-drop/DropTarget\";\nimport { getProp, getProps, nextStep, resetPath, typeOf } from \"../utils\";\nimport {\n createPlaceHolder,\n flexDirection,\n getFlexDimensions,\n getFlexOrIntrinsicStyle,\n getIntrinsicSize,\n wrapIntrinsicSizeComponentWithFlexbox,\n} from \"./flexUtils\";\nimport {\n LayoutProps,\n getDefaultTabLabel,\n getManagedDimension,\n} from \"./layoutUtils\";\n\ntype insertionPosition = \"before\" | \"after\";\n\nexport function getInsertTabBeforeAfter(stack: LayoutModel, pos: DropPos) {\n const { children: tabs } = stack.props as any;\n const tabCount = tabs.length;\n const { index = -1, positionRelativeToTab = \"after\" } = pos.tab || {};\n return index === -1 || index >= tabCount\n ? [tabs[tabCount - 1], \"after\"]\n : [tabs[index] ?? null, positionRelativeToTab];\n}\n\nexport function insertIntoContainer(\n container: ReactElement,\n targetContainer: ReactElement,\n newComponent: ReactElement | ReactElement[],\n): ReactElement {\n const {\n active: containerActive,\n children: containerChildren = [],\n path: containerPath,\n } = getProps(container) as LayoutProps;\n\n const existingComponentPath = getProp(targetContainer, \"path\");\n const { idx, finalStep } = nextStep(\n // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n containerPath!,\n existingComponentPath,\n true,\n );\n const [insertedIdx, children] = finalStep\n ? insertIntoChildren(container, containerChildren, newComponent)\n : [\n containerActive,\n containerChildren?.map((child, index) =>\n index === idx\n ? (insertIntoContainer(\n child,\n targetContainer,\n newComponent,\n ) as ReactElement)\n : child,\n ),\n ];\n const active =\n typeOf(container) === \"Stack\"\n ? Array.isArray(insertedIdx)\n ? (insertedIdx[0] as number)\n : insertedIdx\n : containerActive;\n\n return React.cloneElement(container, { active } as any, children);\n}\n\nconst getDefaultTitle = (\n containerType: string | undefined,\n component: ReactElement,\n index: number,\n existingLabels: string[],\n) =>\n containerType === \"Stack\"\n ? getDefaultTabLabel(component, index, existingLabels)\n : undefined;\n\nconst getChildrenTitles = (children: ReactElement[]) =>\n children.map((child) => (child.props as any).title);\n\nfunction insertIntoChildren(\n container: ReactElement,\n containerChildren: ReactElement[],\n newComponent: ReactElement | ReactElement[],\n): [number, ReactElement[]] {\n if (Array.isArray(newComponent)) {\n const [firstChild, ...rest] = newComponent;\n let [idx, children] = insertIntoChildren(\n container,\n containerChildren,\n firstChild,\n );\n for (const child of rest) {\n [, children] = insertIntoChildren(container, children, child);\n }\n return [idx, children];\n }\n\n const containerPath = getProp(container, \"path\");\n const count = containerChildren?.length;\n\n const {\n id = uuid(),\n title = getDefaultTitle(\n typeOf(container),\n newComponent,\n count ?? 0,\n getChildrenTitles(containerChildren),\n ),\n } = getProps(newComponent);\n\n if (count) {\n return [\n count,\n containerChildren.concat(\n resetPath(newComponent, `${containerPath}.${count}`, {\n id,\n key: id,\n title,\n }),\n ),\n ];\n } else {\n return [0, [resetPath(newComponent, `${containerPath}.0`, { id, title })]];\n }\n}\n\nexport function insertBesideChild(\n container: ReactElement,\n existingComponent: any,\n newComponent: any,\n insertionPosition: insertionPosition,\n pos?: DropPos,\n clientRect?: any,\n dropRect?: any,\n): ReactElement {\n const {\n active: containerActive,\n children: containerChildren,\n path: containerPath,\n } = getProps(container);\n\n const existingComponentPath = getProp(existingComponent, \"path\");\n const { idx, finalStep } = nextStep(containerPath, existingComponentPath);\n const [insertedIdx, children] = finalStep\n ? updateChildren(\n container,\n containerChildren,\n idx,\n newComponent,\n insertionPosition,\n // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n pos!,\n clientRect,\n dropRect,\n )\n : [\n containerActive,\n containerChildren.map((child: ReactElement, index: number) =>\n index === idx\n ? insertBesideChild(\n child,\n existingComponent,\n newComponent,\n insertionPosition,\n pos,\n clientRect,\n dropRect,\n )\n : child,\n ),\n ];\n\n const active = typeOf(container) === \"Stack\" ? insertedIdx : containerActive;\n return React.cloneElement(container, { active } as any, children);\n}\n\nfunction updateChildren(\n container: LayoutModel,\n containerChildren: ReactElement[],\n idx: number,\n newComponent: ReactElement,\n insertionPosition: insertionPosition,\n pos: DropPos,\n clientRect: DropTarget[\"clientRect\"],\n dropRect: DropTarget[\"dropRect\"],\n) {\n const intrinsicSize = getIntrinsicSize(newComponent);\n if (intrinsicSize?.width && intrinsicSize?.height) {\n return insertIntrinsicSizedComponent(\n container,\n containerChildren,\n idx,\n newComponent,\n insertionPosition,\n clientRect,\n // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n dropRect!,\n );\n } else {\n return insertFlexComponent(\n container,\n containerChildren,\n idx,\n newComponent,\n insertionPosition,\n pos?.width || pos?.height,\n clientRect,\n );\n }\n}\n\nconst getLeadingPlaceholderSize = (\n flexDirection: flexDirection,\n insertionPosition: insertionPosition,\n { top, right, bottom, left }: DropTarget[\"clientRect\"],\n [rectLeft, rectTop, rectRight, rectBottom]: rectTuple,\n) => {\n if (flexDirection === \"column\" && insertionPosition === \"before\") {\n return rectTop - top;\n } else if (flexDirection === \"column\") {\n return bottom - rectBottom;\n } else if (flexDirection === \"row\" && insertionPosition === \"before\") {\n return rectLeft - left;\n } else if (flexDirection === \"row\") {\n return right - rectRight;\n }\n};\n\nfunction insertIntrinsicSizedComponent(\n container: LayoutModel,\n containerChildren: ReactElement[],\n idx: number,\n newComponent: ReactElement,\n insertionPosition: insertionPosition,\n clientRect: DropTarget[\"clientRect\"],\n dropRect: rectTuple,\n) {\n const {\n style: { flexDirection },\n } = getProps(container);\n const [dimension, crossDimension, contraDirection] =\n getFlexDimensions(flexDirection);\n const { [crossDimension]: intrinsicCrossSize, [dimension]: intrinsicSize } =\n getIntrinsicSize(newComponent) as { height: number; width: number };\n const path = getProp(containerChildren[idx], \"path\");\n\n const placeholderSize = getLeadingPlaceholderSize(\n flexDirection,\n insertionPosition,\n clientRect,\n dropRect,\n );\n\n const [itemToInsert, size] =\n intrinsicCrossSize < clientRect[crossDimension]\n ? [\n wrapIntrinsicSizeComponentWithFlexbox(\n newComponent,\n contraDirection,\n path,\n clientRect,\n dropRect,\n ),\n intrinsicSize,\n ]\n : [newComponent, undefined];\n\n const placeholder = placeholderSize\n ? createPlaceHolder(path, placeholderSize, { flexGrow: 0, flexShrink: 0 })\n : undefined;\n\n if (intrinsicCrossSize > clientRect[crossDimension]) {\n containerChildren = containerChildren.map((child) => {\n if (getProp(child, \"placeholder\")) {\n return child;\n } else {\n const { [crossDimension]: intrinsicCrossChildSize } = getIntrinsicSize(\n child,\n ) as {\n height: number;\n width: number;\n };\n if (\n intrinsicCrossChildSize &&\n intrinsicCrossChildSize < intrinsicCrossSize\n ) {\n return wrapIntrinsicSizeComponentWithFlexbox(\n child,\n contraDirection,\n getProp(child, \"path\"),\n );\n } else {\n return child;\n }\n }\n });\n }\n\n return insertFlexComponent(\n container,\n containerChildren,\n idx,\n itemToInsert,\n insertionPosition,\n size,\n clientRect,\n placeholder,\n );\n}\n\nfunction insertFlexComponent(\n container: LayoutModel,\n containerChildren: ReactElement[],\n idx: number,\n newComponent: ReactElement,\n insertionPosition: \"before\" | \"after\",\n size: number | undefined,\n targetRect: DropTarget[\"clientRect\"],\n placeholder?: ReactElement,\n) {\n const containerPath = getProp(container, \"path\");\n let insertedIdx = 0;\n const children =\n !containerChildren || containerChildren.length === 0\n ? [newComponent]\n : containerChildren\n .reduce<ReactElement[]>((arr, child, i) => {\n if (idx === i) {\n const [existingComponent, insertedComponent] =\n getStyledComponents(container, child, newComponent, targetRect);\n if (insertionPosition === \"before\") {\n if (placeholder) {\n arr.push(placeholder, insertedComponent, existingComponent);\n } else {\n arr.push(insertedComponent, existingComponent);\n }\n } else {\n if (placeholder) {\n arr.push(existingComponent, insertedComponent, placeholder);\n } else {\n arr.push(existingComponent, insertedComponent);\n }\n }\n insertedIdx = arr.indexOf(insertedComponent);\n } else {\n arr.push(child);\n }\n return arr;\n }, [])\n .map((child, i) =>\n i < insertedIdx ? child : resetPath(child, `${containerPath}.${i}`),\n );\n\n return [insertedIdx, children];\n}\n\nfunction getStyledComponents(\n container: LayoutModel,\n existingComponent: ReactElement,\n newComponent: ReactElement,\n targetRect: DropTarget[\"clientRect\"],\n): [ReactElement, ReactElement] {\n const id = uuid();\n let { version = 0 } = getProps(newComponent);\n version += 1;\n if (typeOf(container) === \"Flexbox\") {\n const { style: containerStyle } = container.props as any;\n const [dim] = getManagedDimension(containerStyle);\n const splitterSize = 6;\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n const size = { [dim]: (targetRect[dim] - splitterSize) / 2 };\n const existingComponentStyle = getFlexOrIntrinsicStyle(\n existingComponent,\n dim,\n size,\n );\n const newComponentStyle = getFlexOrIntrinsicStyle(newComponent, dim, size);\n\n return [\n React.cloneElement(existingComponent, {\n style: existingComponentStyle,\n } as any),\n React.cloneElement(newComponent, {\n id,\n version,\n style: newComponentStyle,\n } as any),\n ];\n } else {\n const {\n style: { left: _1, top: _2, flex: _3, ...style } = {\n left: undefined,\n top: undefined,\n flex: undefined,\n },\n } = getProps(newComponent);\n return [\n existingComponent,\n React.cloneElement(newComponent, {\n id,\n version,\n style: { ...style, flex: \"1 1 0px\" },\n } as any),\n ];\n }\n}\n"],"names":["flexDirection"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
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 CollapseAction,\n DragDropAction,\n ExpandAction,\n LayoutActionType,\n LayoutReducerAction,\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 \"collapse\":\n case \"expand\":\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 = (\n state: ReactElement,\n { path, type }: CollapseAction | ExpandAction,\n) => {\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\n newComponent as any,\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const { style } = container.props as any;\n return typeOf(container) === \"Flexbox\" && style.flexDirection === \"column\";\n};\n\nconst isTerrace = (container: ReactElement) => {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const { style } = container.props as any;\n return typeOf(container) === \"Flexbox\" && style.flexDirection !== \"column\";\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAwCa,MAAA,aAAA,GAAgB,CAC3B,KAAA,EACA,MACiB,KAAA;AACjB,EAAA,QAAQ,OAAO,IAAM;AAAA,IACnB,KAAK,gBAAiB,CAAA,GAAA;AACpB,MAAO,OAAA,QAAA,CAAS,OAAO,MAAM,CAAA;AAAA,IAC/B,KAAK,gBAAiB,CAAA,SAAA;AACpB,MAAO,OAAA,QAAA,CAAS,OAAO,MAAM,CAAA;AAAA,IAC/B,KAAK,UAAA;AAAA,IACL,KAAK,QAAA;AACH,MAAO,OAAA,aAAA,CAAc,OAAO,MAAM,CAAA;AAAA,IACpC,KAAK,gBAAiB,CAAA,MAAA;AACpB,MAAO,OAAA,WAAA,CAAY,OAAO,MAAM,CAAA;AAAA,IAClC,KAAK,gBAAiB,CAAA,OAAA;AACpB,MAAO,OAAA,YAAA,CAAa,OAAO,MAAM,CAAA;AAAA,IACnC,KAAK,gBAAiB,CAAA,QAAA;AACpB,MAAO,OAAA,OAAA,CAAQ,OAAO,MAAM,CAAA;AAAA,IAC9B,KAAK,gBAAiB,CAAA,SAAA;AACpB,MAAO,OAAA,QAAA,CAAS,OAAO,MAAM,CAAA;AAAA,IAC/B,KAAK,gBAAiB,CAAA,SAAA;AACpB,MAAA,OAAO,QAAQ,KAAO,EAAA;AAAA,QACpB,IAAM,EAAA,UAAA;AAAA,QACN,MAAM,MAAO,CAAA,IAAA;AAAA,QACb,QAAU,EAAA,OAAA;AAAA,QACV,WAAW,MAAO,CAAA;AAAA,OACnB,CAAA;AAAA,IACH,KAAK,gBAAiB,CAAA,eAAA;AACpB,MAAO,OAAA,kBAAA,CAAmB,OAAO,MAAM,CAAA;AAAA,IACzC,KAAK,gBAAiB,CAAA,aAAA;AACpB,MAAO,OAAA,eAAA,CAAgB,OAAO,MAAM,CAAA;AAAA,IACtC,KAAK,gBAAiB,CAAA,UAAA;AACpB,MAAO,OAAA,SAAA,CAAU,OAAO,MAAM,CAAA;AAAA,IAChC,KAAK,gBAAiB,CAAA,UAAA;AACpB,MAAO,OAAA,SAAA,CAAU,OAAO,MAAM,CAAA;AAAA,IAChC;AACE,MAAO,OAAA,KAAA;AAAA;AAEb;AAEA,MAAM,YAAY,CAAC,KAAA,EAAqB,EAAE,IAAA,EAAM,SAA+B,KAAA;AAC7E,EAAA,MAAM,MAAS,GAAA,UAAA,CAAW,KAAO,EAAA,IAAA,EAAM,IAAI,CAAA;AAE3C,EAAM,MAAA,WAAA,GAAc,KAAM,CAAA,YAAA,CAAkB,MAAQ,EAAA;AAAA,IAClD,MAAQ,EAAA;AAAA,GACT,CAAA;AACD,EAAO,OAAA,SAAA,CAAU,KAAO,EAAA,MAAA,EAAQ,WAAW,CAAA;AAC7C,CAAA;AAEA,MAAM,UAAU,CACd,KAAA,EACA,EAAE,IAAM,EAAA,QAAA,EAAU,WACf,KAAA;AACH,EAAA,MAAM,MAAS,GAAA,UAAA,CAAW,KAAO,EAAA,IAAA,EAAM,IAAI,CAAA;AAC3C,EAAM,MAAA,WAAA,GAAc,KAAM,CAAA,YAAA,CAAa,MAAQ,EAAA;AAAA,IAC7C,CAAC,QAAQ,GAAG;AAAA,GACb,CAAA;AACD,EAAO,OAAA,SAAA,CAAU,KAAO,EAAA,MAAA,EAAQ,WAAW,CAAA;AAC7C,CAAA;AAEA,MAAM,WAAW,CAAC,KAAA,EAAqB,EAAE,IAAA,EAAM,OAA4B,KAAA;AACzE,EAAA,MAAM,MAAS,GAAA,UAAA,CAAW,KAAO,EAAA,IAAA,EAAM,IAAI,CAAA;AAC3C,EAAA,MAAM,WAAc,GAAA,KAAA,CAAM,YAAa,CAAA,MAAA,EAAQ,KAAK,CAAA;AACpD,EAAO,OAAA,SAAA,CAAU,KAAO,EAAA,MAAA,EAAQ,WAAW,CAAA;AAC7C,CAAA;AAEA,MAAM,gBAAgB,CACpB,KAAA,EACA,EAAE,IAAA,EAAM,MACL,KAAA;AACH,EAAA,IAAI,IAAM,EAAA;AACR,IAAA,MAAM,MAAS,GAAA,UAAA,CAAW,KAAO,EAAA,IAAA,EAAM,IAAI,CAAA;AAC3C,IAAA,OAAO,SAAU,CAAA,KAAA,EAAO,MAAQ,EAAA,MAAA,EAAQ,IAAI,CAAA;AAAA,GACvC,MAAA;AACL,IAAO,OAAA,KAAA;AAAA;AAEX,CAAA;AAEA,MAAM,QAAA,GAAW,CACf,UAAA,EACA,MACiB,KAAA;AACjB,EAAM,MAAA;AAAA,IACJ,mBAAqB,EAAA,YAAA;AAAA,IACrB,gBAAA;AAAA,IACA;AAAA,GACE,GAAA,MAAA;AACJ,EAAA,MAAM,oBAAoB,UAAW,CAAA,SAAA;AACrC,EAAM,MAAA,EAAE,KAAQ,GAAA,UAAA;AAChB,EAAA,MAAM,sBACJ,GAAK,EAAA,QAAA,EAAU,MAAU,IAAA,MAAA,CAAO,iBAAiB,CAAM,KAAA,OAAA;AACzD,EAAA,MAAM,EAAE,EAAA,EAAI,OAAQ,EAAA,GAAI,SAAS,YAAY,CAAA;AAC7C,EAAM,MAAA,aAAA,GAAgB,iBAAiB,YAAY,CAAA;AACnD,EAAI,IAAA,aAAA;AACJ,EAAA,IAAI,mBAAqB,EAAA;AACvB,IAAM,MAAA,CAAC,SAAW,EAAA,iBAAiB,CAAI,GAAA,uBAAA;AAAA;AAAA,MAErC,iBAAA;AAAA,MACA;AAAA,KACF;AACA,IAAA,IAAI,cAAc,KAAW,CAAA,EAAA;AAC3B,MAAgB,aAAA,GAAA,mBAAA;AAAA,QACd,UAAA;AAAA,QACA,iBAAA;AAAA,QACA;AAAA,OACF;AAAA,KACK,MAAA;AACL,MAAgB,aAAA,GAAA,iBAAA;AAAA,QACd,UAAA;AAAA,QACA,SAAA;AAAA,QACA,YAAA;AAAA,QACA;AAAA,OACF;AAAA;AACF,GACS,MAAA,IAAA,CAAC,aAAiB,IAAA,GAAA,EAAK,UAAU,MAAQ,EAAA;AAClD,IAAgB,aAAA,GAAA,aAAA;AAAA,MACd,UAAA;AAAA,MACA,iBAAA;AAAA;AAAA,MAEA;AAAA,KACF;AAAA,GACK,MAAA;AACL,IAAgB,aAAA,GAAA,uBAAA;AAAA,MACd,UAAA;AAAA,MACA,UAAA;AAAA,MACA;AAAA,KACF;AAAA;AAGF,EAAA,IAAI,iBAAiB,WAAa,EAAA;AAChC,IAAO,OAAA,aAAA;AAAA;AAGT,EAAA,MAAM,WAAc,GAAA,UAAA;AAAA,IAClB,aAAA;AAAA,IACA,CAAC,KAAuB,KAAA,KAAA,CAAM,EAAO,KAAA,EAAA,IAAM,MAAM,OAAY,KAAA;AAAA,GAC/D;AACA,EAAM,MAAA,SAAA,GAAY,OAAQ,CAAA,WAAA,EAAa,MAAM,CAAA;AAC7C,EAAA,OAAO,YAAY,aAAe,EAAA,EAAE,MAAM,SAAW,EAAA,IAAA,EAAM,UAAU,CAAA;AACvE,CAAA;AAEA,MAAM,WAAW,CACf,UAAA,EACA,EAAE,IAAM,EAAA,aAAA,EAAe,WACpB,KAAA;AACH,EAAO,OAAA,mBAAA;AAAA,IACL,UAAA;AAAA,IACA,UAAA,CAAW,YAAY,aAAa,CAAA;AAAA,IACpC;AAAA,GACF;AACF,CAAA;AAEA,MAAM,uBAA0B,GAAA,CAC9B,UACA,EAAA,UAAA,EACA,YACiB,KAAA;AACjB,EAAA,MAAM,EAAE,SAAA,EAAW,GAAK,EAAA,UAAA,EAAY,UAAa,GAAA,UAAA;AACjD,EAAA,MAAM,iBAAoB,GAAA,SAAA;AAE1B,EAAM,MAAA,qBAAA,GAAwB,OAAQ,CAAA,iBAAA,EAAmB,MAAM,CAAA;AAE/D,EAAA,IAAI,0BAA0B,KAAO,EAAA;AACnC,IAAO,OAAA,IAAA;AAAA,MACL,UAAA;AAAA,MACA,iBAAA;AAAA,MACA,YAAA;AAAA,MACA;AAAA,KACF;AAAA;AAGF,EAAA,MAAM,eAAkB,GAAA,kBAAA;AAAA,IACtB,UAAA;AAAA,IACA;AAAA,GACF;AAEA,EAAI,IAAA,YAAA,CAAa,GAAK,EAAA,eAAe,CAAG,EAAA;AACtC,IAAA,MAAM,iBAAoB,GAAA,GAAA,CAAI,QAAS,CAAA,WAAA,GAAc,OAAU,GAAA,QAAA;AAC/D,IAAO,OAAA,iBAAA;AAAA,MACL,UAAA;AAAA,MACA,iBAAA;AAAA,MACA,YAAA;AAAA,MACA,iBAAA;AAAA,MACA,GAAA;AAAA,MACA,UAAA;AAAA,MACA;AAAA,KACF;AAAA;AAGF,EAAA,IAAI,CAAC,YAAA,CAAa,GAAK,EAAA,eAAe,CAAG,EAAA;AACvC,IAAO,OAAA,IAAA;AAAA,MACL,UAAA;AAAA,MACA,iBAAA;AAAA,MACA,YAAA;AAAA,MACA,GAAA;AAAA,MACA,UAAA;AAAA,MACA;AAAA,KACF;AAAA;AAGF,EAAA,IAAI,WAAY,CAAA,MAAA,CAAO,eAAe,CAAW,CAAG,EAAA;AAClD,IAAA,OAAO,IAAK,CAAA,UAAA,EAAY,iBAAmB,EAAA,YAAA,EAAc,GAAG,CAAA;AAAA;AAG9D,EAAA,MAAM,KAAM,CAAA,CAAA,oCAAA,EAAuC,GAAI,CAAA,QAAQ,CAAE,CAAA,CAAA;AACnE,CAAA;AAEA,MAAM,YAAA,GAAe,CAAC,GAAA,EAAc,SAA4B,KAAA;AAC9D,EAAI,IAAA,GAAA,CAAI,SAAS,MAAQ,EAAA;AACvB,IAAA,OAAO,SAAU,CAAA,SAAS,CAAK,IAAA,OAAA,CAAQ,SAAS,CAAA;AAAA;AAGlD,EAAO,OAAA,GAAA,CAAI,QAAS,CAAA,YAAA,GAChB,OAAQ,CAAA,SAAS,CACjB,GAAA,GAAA,CAAI,QAAS,CAAA,UAAA,GACX,SAAU,CAAA,SAAS,CACnB,GAAA,KAAA;AACR,CAAA;AAEA,MAAM,OAAA,GAAU,CAAC,SAA4B,KAAA;AAE3C,EAAM,MAAA,EAAE,KAAM,EAAA,GAAI,SAAU,CAAA,KAAA;AAC5B,EAAA,OAAO,MAAO,CAAA,SAAS,CAAM,KAAA,SAAA,IAAa,MAAM,aAAkB,KAAA,QAAA;AACpE,CAAA;AAEA,MAAM,SAAA,GAAY,CAAC,SAA4B,KAAA;AAE7C,EAAM,MAAA,EAAE,KAAM,EAAA,GAAI,SAAU,CAAA,KAAA;AAC5B,EAAA,OAAO,MAAO,CAAA,SAAS,CAAM,KAAA,SAAA,IAAa,MAAM,aAAkB,KAAA,QAAA;AACpE,CAAA;;;;"}
|
|
1
|
+
{"version":3,"file":"layout-reducer.js","sources":["../../../../packages/vuu-layout/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 CollapseAction,\n DragDropAction,\n ExpandAction,\n LayoutActionType,\n LayoutReducerAction,\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 \"collapse\":\n case \"expand\":\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 = (\n state: ReactElement,\n { path, type }: CollapseAction | ExpandAction,\n) => {\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\n newComponent as any,\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const { style } = container.props as any;\n return typeOf(container) === \"Flexbox\" && style.flexDirection === \"column\";\n};\n\nconst isTerrace = (container: ReactElement) => {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const { style } = container.props as any;\n return typeOf(container) === \"Flexbox\" && style.flexDirection !== \"column\";\n};\n"],"names":[],"mappings":"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"}
|