@vuu-ui/vuu-layout 0.13.76 → 0.13.78
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.
|
@@ -1 +1 @@
|
|
|
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":["useRef","useMemo","useCallback","identifyResizeParties","index","Splitter","gatherChildMeta","findSplitterAndPlaceholderPositions","PLACEHOLDER","getUniqueId","SPLITTER","Placeholder"],"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 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":["useRef","useMemo","useCallback","identifyResizeParties","index","Splitter","gatherChildMeta","findSplitterAndPlaceholderPositions","PLACEHOLDER","getUniqueId","SPLITTER","Placeholder"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
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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"}
|
|
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 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/package.json
CHANGED
|
@@ -1,24 +1,24 @@
|
|
|
1
1
|
{
|
|
2
|
-
"version": "0.13.
|
|
2
|
+
"version": "0.13.78",
|
|
3
3
|
"description": "VUU Layout Components",
|
|
4
4
|
"author": "heswell",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"types": "types/index.d.ts",
|
|
7
7
|
"devDependencies": {
|
|
8
|
-
"@vuu-ui/vuu-data-types": "0.13.
|
|
9
|
-
"@vuu-ui/vuu-filter-types": "0.13.
|
|
8
|
+
"@vuu-ui/vuu-data-types": "0.13.78",
|
|
9
|
+
"@vuu-ui/vuu-filter-types": "0.13.78"
|
|
10
10
|
},
|
|
11
11
|
"dependencies": {
|
|
12
12
|
"@salt-ds/core": "1.48.0",
|
|
13
13
|
"@salt-ds/styles": "0.2.1",
|
|
14
14
|
"@salt-ds/window": "0.1.1",
|
|
15
|
-
"@vuu-ui/vuu-data-react": "0.13.
|
|
16
|
-
"@vuu-ui/vuu-datatable": "0.13.
|
|
17
|
-
"@vuu-ui/vuu-filters": "0.13.
|
|
18
|
-
"@vuu-ui/vuu-popups": "0.13.
|
|
19
|
-
"@vuu-ui/vuu-table": "0.13.
|
|
20
|
-
"@vuu-ui/vuu-ui-controls": "0.13.
|
|
21
|
-
"@vuu-ui/vuu-utils": "0.13.
|
|
15
|
+
"@vuu-ui/vuu-data-react": "0.13.78",
|
|
16
|
+
"@vuu-ui/vuu-datatable": "0.13.78",
|
|
17
|
+
"@vuu-ui/vuu-filters": "0.13.78",
|
|
18
|
+
"@vuu-ui/vuu-popups": "0.13.78",
|
|
19
|
+
"@vuu-ui/vuu-table": "0.13.78",
|
|
20
|
+
"@vuu-ui/vuu-ui-controls": "0.13.78",
|
|
21
|
+
"@vuu-ui/vuu-utils": "0.13.78"
|
|
22
22
|
},
|
|
23
23
|
"peerDependencies": {
|
|
24
24
|
"clsx": "^2.0.0",
|