@onehat/ui 0.3.234 → 0.3.236

package/package.json

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

package/src/Components/Grid/Grid.js

@@ -205,7 +205,7 @@ function GridComponent(props) {
 		isAddingRef = useRef(),
 		expandedRowsRef = useRef({}),
 		cachedDragElements = useRef(),
-		idsRef = useRef([]),
+		dragSelectionRef = useRef([]),
 		[isInited, setIsInited] = useState(false),
 		[isReady, setIsReady] = useState(false),
 		[isLoading, setIsLoading] = useState(false),
@@ -449,9 +449,8 @@ function GridComponent(props) {
 						let WhichRow = GridRow;
 						if (CURRENT_MODE === UI_MODE_WEB) { // DND is currrently web-only  TODO: implement for RN
 							// Create a method that gets an always-current copy of the selection ids
-							const ids = _.map(selection, (item) => item.id);
-							idsRef.current = ids;
-							const getIds = () => idsRef.current;
+							dragSelectionRef.current = selection;
+							const getSelection = () => dragSelectionRef.current;
 
 							// assign event handlers
 							if (canRowsReorder && isDragMode) {
@@ -461,7 +460,7 @@ function GridComponent(props) {
 								const dragIx = showHeaders ? index - 1 : index;
 								rowReorderProps.dragSourceItem = {
 									id: item.id,
-									getIds,
+									getSelection,
 									onDrag: (dragState) => {
 										onRowReorderDrag(dragState, dragIx);
 									},
@@ -474,11 +473,11 @@ function GridComponent(props) {
 									rowDragProps.isDragSource = true;
 									rowDragProps.dragSourceType = rowDragSourceType;
 									if (getRowDragSourceItem) {
-										rowDragProps.dragSourceItem = getRowDragSourceItem(item, getIds, rowDragSourceType);
+										rowDragProps.dragSourceItem = getRowDragSourceItem(item, getSelection, rowDragSourceType);
 									} else {
 										rowDragProps.dragSourceItem = {
 											id: item.id,
-											getIds,
+											getSelection,
 											type: rowDragSourceType,
 										};
 									}

package/src/Components/Hoc/withEditor.js

@@ -6,6 +6,7 @@ import {
 	EDITOR_MODE__VIEW,
 	EDITOR_MODE__ADD,
 	EDITOR_MODE__EDIT,
+	EDITOR_TYPE__SIDE,
 } from '../../Constants/Editor.js';
 import UiGlobals from '../../UiGlobals.js';
 import _ from 'lodash';
@@ -34,6 +35,7 @@ export default function withEditor(WrappedComponent, isTree = false) {
 					}
 					return 'record' + (selection[0].displayValue ? ' "' + selection[0].displayValue + '"' : '') + '?';
 				},
+				editorType,
 				onAdd,
 				onChange, // any kind of crud change
 				onDelete,
@@ -437,23 +439,28 @@ export default function withEditor(WrappedComponent, isTree = false) {
 
 				// calculateEditorMode gets called only on selection changes
 				let mode;
-				if (isIgnoreNextSelectionChange) {
-					mode = editorMode;
-					if (!canEditorViewOnly && userCanEdit) {
-						if (selection.length > 1) {
-							if (!disableEdit) {
-								// For multiple entities selected, change it to edit multiple mode
-								mode = EDITOR_MODE__EDIT;
-							}
-						} else if (selection.length === 1 && !selection[0].isDestroyed && selection[0].isPhantom) {
-							if (!disableAdd) {
-								// When a phantom entity is selected, change it to add mode.
-								mode = EDITOR_MODE__ADD;
+				if (editorType === EDITOR_TYPE__SIDE && !_.isNil(UiGlobals.isSideEditorAlwaysEditMode) && UiGlobals.isSideEditorAlwaysEditMode) {
+					// special case: side editor is always edit mode
+					mode = EDITOR_MODE__EDIT;
+				} else {
+					if (isIgnoreNextSelectionChange) {
+						mode = editorMode;
+						if (!canEditorViewOnly && userCanEdit) {
+							if (selection.length > 1) {
+								if (!disableEdit) {
+									// For multiple entities selected, change it to edit multiple mode
+									mode = EDITOR_MODE__EDIT;
+								}
+							} else if (selection.length === 1 && !selection[0].isDestroyed && selection[0].isPhantom) {
+								if (!disableAdd) {
+									// When a phantom entity is selected, change it to add mode.
+									mode = EDITOR_MODE__ADD;
+								}
 							}
 						}
+					} else {
+						mode = selection.length > 1 ? EDITOR_MODE__EDIT : EDITOR_MODE__VIEW;
 					}
-				} else {
-					mode = selection.length > 1 ? EDITOR_MODE__EDIT : EDITOR_MODE__VIEW;
 				}
 				return mode;
 			},

package/src/Components/Hoc/withInlineEditor.js

@@ -18,8 +18,23 @@ import Form from '../Form/Form.js';
 import withEditor from './withEditor.js';
 import _ from 'lodash';
 
+
+
+function withAdditionalProps(WrappedComponent) {
+	return (props) => {
+		// provide the editorType to withEditor
+		return <WrappedComponent
+					editorType={EDITOR_TYPE__INLINE}
+					{...props}
+				/>;
+	};
+}
+
+// NOTE: Effectivtly, the HOC composition is:
+// withAdditionalProps(withEditor(withWindowedEditor))
+
 export default function withInlineEditor(WrappedComponent) {
-	return withEditor((props) => {
+	return withAdditionalProps(withEditor((props) => {
 		const {
 				editorType,
 				isEditorShown = false,
@@ -147,5 +162,5 @@ export default function withInlineEditor(WrappedComponent) {
 					inlineEditor={inlineEditor}
 					isInlineEditorShown={isEditorShown}
 				/>;
-	});
+	}));
 }

package/src/Components/Hoc/withSideEditor.js

@@ -6,8 +6,21 @@ import withEditor from './withEditor.js';
 import _ from 'lodash';
 
 
+function withAdditionalProps(WrappedComponent) {
+	return (props) => {
+		// provide the editorType to withEditor
+		return <WrappedComponent
+					editorType={EDITOR_TYPE__SIDE}
+					{...props}
+				/>;
+	};
+}
+
+// NOTE: Effectivtly, the HOC composition is:
+// withAdditionalProps(withEditor(withSideEditor))
+
 export default function withSideEditor(WrappedComponent, isTree = false) {
-	return withEditor((props) => {
+	return withAdditionalProps(withEditor((props) => {
 		const {
 				Editor,
 				editorProps = {},
@@ -44,5 +57,5 @@ export default function withSideEditor(WrappedComponent, isTree = false) {
 								reference="editor"
 							/>}
 				/>;
-	});
+	}));
 }

package/src/Components/Hoc/withWindowedEditor.js

@@ -25,8 +25,24 @@ import _ from 'lodash';
 // then switch position to absolute, draggable area would be header of panel
 // const DraggableColumn = withAdditionalProps(withDraggable(Column));
 
+
+
+
+function withAdditionalProps(WrappedComponent) {
+	return (props) => {
+		// provide the editorType to withEditor
+		return <WrappedComponent
+					editorType={EDITOR_TYPE__WINDOWED}
+					{...props}
+				/>;
+	};
+}
+
+// NOTE: Effectivtly, the HOC composition is:
+// withAdditionalProps(withEditor(withWindowedEditor))
+
 export default function withWindowedEditor(WrappedComponent, isTree = false) {
-	return withEditor((props) => {
+	return withAdditionalProps(withEditor((props) => {
 		const {
 				isEditorShown = false,
 				setIsEditorShown,
@@ -65,5 +81,5 @@ export default function withWindowedEditor(WrappedComponent, isTree = false) {
 							/>
 						</Modal>}
 				</>;
-	}, isTree);
+	}, isTree));
 }