@onehat/ui 0.3.245 → 0.3.247

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@onehat/ui",
-	"version": "0.3.245",
+	"version": "0.3.247",
 	"description": "Base UI for OneHat apps",
 	"main": "src/index.js",
 	"type": "module",

package/src/Components/Container/Container.js

@@ -204,7 +204,7 @@ function Container(props) {
 			componentProps.setIsCollapsed = setIsNorthCollapsed || setLocalIsNorthCollapsed;
 			componentProps.onLayout = (e) => {
 				const height = parseFloat(e.nativeEvent.layout.height);
-				if (height !== northHeight) {
+				if (height && height !== northHeight) {
 					setNorthHeight(height);
 				}
 			};
@@ -228,7 +228,7 @@ function Container(props) {
 			componentProps.setIsCollapsed = setIsSouthCollapsed || setLocalIsSouthCollapsed;
 			componentProps.onLayout = (e) => {
 				const height = parseFloat(e.nativeEvent.layout.height);
-				if (height !== southHeight) {
+				if (height && height !== southHeight) {
 					setSouthHeight(height);
 				}
 			};
@@ -252,7 +252,7 @@ function Container(props) {
 			componentProps.setIsCollapsed = setIsEastCollapsed || setLocalIsEastCollapsed;
 			componentProps.onLayout = (e) => {
 				const width = parseFloat(e.nativeEvent.layout.width);
-				if (width !== eastWidth) {
+				if (width && width !== eastWidth) {
 					setEastWidth(width);
 				}
 			};
@@ -276,7 +276,7 @@ function Container(props) {
 			componentProps.setIsCollapsed = setIsWestCollapsed || setLocalIsWestCollapsed;
 			componentProps.onLayout = (e) => {
 				const width = parseFloat(e.nativeEvent.layout.width);
-				if (width !== westWidth) {
+				if (width && width !== westWidth) {
 					setWestWidth(width);
 				}
 			};

package/src/Components/Grid/Grid.js

@@ -488,6 +488,7 @@ function GridComponent(props) {
 									rowDragProps.isDropTarget = true;
 									rowDragProps.dropTargetAccept = dropTargetAccept;
 									rowDragProps.onDrop = (droppedItem) => {
+										// NOTE: item is sometimes getting destroyed, but it still as the id, so you can still use it
 										onRowDrop(item, droppedItem); // item is what it was dropped on; droppedItem is the dragSourceItem defined above
 									};
 								}
@@ -982,6 +983,9 @@ function GridComponent(props) {
 					{...flatListProps}
 				/>
 	
+	if (CURRENT_MODE === UI_MODE_WEB) {
+		grid = <ScrollView horizontal={false}>{grid}</ScrollView>; // fix scrolling bug on nested FlatLists
+	} else
 	if (CURRENT_MODE === UI_MODE_REACT_NATIVE) {
 		grid = <ScrollView flex={1} w="100%">{grid}</ScrollView>
 	}

package/src/Components/Screens/Manager.js

@@ -26,6 +26,7 @@ function ManagerScreen(props) {
 		styles = UiGlobals.styles,
 		id = props.id || props.self?.path,
 		[isRendered, setIsRendered] = useState(false),
+		[isModeSet, setIsModeSet] = useState(false),
 		[allowSideBySide, setAllowSideBySide] = useState(false),
 		[mode, setModeRaw] = useState(MODE_FULL),
 		setMode = (newMode) => {
@@ -63,6 +64,7 @@ function ManagerScreen(props) {
 					setMode(val);
 				}
 			}
+			setIsModeSet(true);
 		})();
 	}, [isRendered]);
 
@@ -81,7 +83,7 @@ function ManagerScreen(props) {
 	}
 
 	return <Column maxHeight="100vh" overflow="hidden" flex={1} w="100%" onLayout={onLayout}>
-				{isRendered && 
+				{isRendered && isModeSet &&
 					<>
 						<Row
 							h="80px"

package/src/Components/Tab/TabBar.js

@@ -70,6 +70,9 @@ function TabBar(props) {
 				}
 				return; // no change
 			}
+			if (tabs[currentTabIx].content) {
+				tabs[currentTabIx].content = null; // free up memory by clearing rendered content
+			}
 			if (useLocal) {
 				setCurrentTabIxLocal(ix);