@onehat/ui 0.4.30 → 0.4.32

package/package.json

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

package/src/Components/Form/Field/Combo/Combo.js

@@ -65,6 +65,7 @@ export function ComboComponent(props) {
 			onGridAdd, // to hook into when menu adds (ComboEditor only)
 			onGridSave, // to hook into when menu saves (ComboEditor only)
 			onGridDelete, // to hook into when menu deletes (ComboEditor only)
+			onSubmit, // when Combo is used in a Tag, call this when the user submits the Combo value (i.e. presses Enter or clicks a row)
 			newEntityDisplayProperty,
 			testID,
 
@@ -252,6 +253,9 @@ export function ComboComponent(props) {
 					if (id !== value) {
 						setValue(id);
 					}
+					if (onSubmit) {
+						onSubmit(id);
+					}
 					hideMenu();
 					break;
 				case 'ArrowDown':
@@ -815,6 +819,9 @@ export function ComboComponent(props) {
 							hideMenu();
 							onInputFocus();
 						}
+						if (onSubmit) {
+							onSubmit(id);
+						}
 					}}
 					reference="grid"
 					parent={self}

package/src/Components/Form/Field/Tag/Tag.js

@@ -50,13 +50,6 @@ function TagComponent(props) {
 		} = props,
 		styles = UiGlobals.styles,
 		valueRef = useRef(value),
-		ignoreNextComboValueChangeRef = useRef(false),
-		getIgnoreNextComboValueChange = () => {
-			return ignoreNextComboValueChangeRef.current;
-		},
-		setIgnoreNextComboValueChange = (bool) => {
-			ignoreNextComboValueChangeRef.current = bool;
-		},
 		onView = async (item, e) => {
 			const
 				id = item.id,
@@ -91,14 +84,9 @@ function TagComponent(props) {
 			});
 		},
 		clearComboValue = () => {
-			setIgnoreNextComboValueChange(true); // we're clearing out the value of the underlying Combo, so ignore it when this combo submits the new value change
 			self.children.combo.setValue(null);
 		},
 		onChangeComboValue = (comboValue) => {
-			if (getIgnoreNextComboValueChange()) {
-				setIgnoreNextComboValueChange(false);
-				return;
-			}
 
 			if (_.isNil(comboValue)) {
 				// NOTE: We *shouldn't* get here, but for some unknown reason, we *were* getting here on rare occasions.
@@ -309,21 +297,22 @@ function TagComponent(props) {
 			>
 				<HStack className={valueBoxesClassName}>{valueBoxes}</HStack>
 				
-				{!isViewOnly && <WhichCombo
-									Repository={props.Repository}
-									Editor={props.Editor}
-									onChangeValue={onChangeComboValue}
-									parent={self}
-									reference="combo"
-									isInTag={true}
-									onGridAdd={onGridAdd}
-									onGridSave={onGridSave}
-									onGridDelete={onGridDelete}
-									tooltip={tooltip}
-									usePermissions={props.usePermissions}
-									{..._combo}
-									className={comboClassName}
-								/>}
+				{!isViewOnly && 
+					<WhichCombo
+						Repository={props.Repository}
+						Editor={props.Editor}
+						onSubmit={onChangeComboValue}
+						parent={self}
+						reference="combo"
+						isInTag={true}
+						onGridAdd={onGridAdd}
+						onGridSave={onGridSave}
+						onGridDelete={onGridDelete}
+						tooltip={tooltip}
+						usePermissions={props.usePermissions}
+						{..._combo}
+						className={comboClassName}
+					/>}
 			</VStackNative>;
 	
 }

package/src/Components/Hoc/withPresetButtons.js

@@ -72,7 +72,8 @@ export default function withPresetButtons(WrappedComponent, isGrid = false) {
 				disableCopy = !isGrid,
 				disableDuplicate = !isEditor,
 				disablePrint = !isGrid,
-
+				protectedValues, // records with these values cannot be edited or deleted
+			
 				// withAlert
 				showInfo,
 
@@ -178,6 +179,25 @@ export default function withPresetButtons(WrappedComponent, isGrid = false) {
 				}
 				return isDisabled;
 			},
+			isNoSelectorSelected = () => {
+				return selectorId && !selectorSelected;
+			},
+			isEmptySelection = () => {
+				return _.isEmpty(selection);
+			},
+			isMultiSelection = () => {
+				return _.isArray(selection) && selection.length > 1;
+			},
+			isProtectedValue = () => {
+				if (!protectedValues) {
+					return false;
+				}
+				const value = selection[0]?.id;
+				if (_.isNil(value)) {
+					return false;
+				}
+				return inArray(value, protectedValues);
+			},
 			getPresetButtonProps = (type) => {
 				let key,
 					text,
@@ -190,10 +210,9 @@ export default function withPresetButtons(WrappedComponent, isGrid = false) {
 						text = 'Add';
 						handler = (parent, e) => onAdd();
 						icon = Plus;
-						if (selectorId && !selectorSelected) {
-							isDisabled = true;
-						}
-						if (isTree && _.isEmpty(selection)) {
+						if (isNoSelectorSelected() ||
+							(isTree && isEmptySelection())
+						) {
 							isDisabled = true;
 						}
 						break;
@@ -202,13 +221,12 @@ export default function withPresetButtons(WrappedComponent, isGrid = false) {
 						text = 'Edit';
 						handler = (parent, e) => onEdit();
 						icon = Edit;
-						if (selectorId && !selectorSelected) {
-							isDisabled = true;
-						}
-						if (_.isEmpty(selection) || (_.isArray(selection) && selection.length > 1)) {
-							isDisabled = true;
-						}
-						if (canRecordBeEdited && !canRecordBeEdited(selection)) {
+						if (isNoSelectorSelected() ||
+							isEmptySelection() ||
+							isMultiSelection() ||
+							isProtectedValue() ||
+							(canRecordBeEdited && !canRecordBeEdited(selection))
+						) {
 							isDisabled = true;
 						}
 						break;
@@ -218,13 +236,12 @@ export default function withPresetButtons(WrappedComponent, isGrid = false) {
 						handler = onDelete;
 						handler = (parent, e) => onDelete();
 						icon = Trash;
-						if (selectorId && !selectorSelected) {
-							isDisabled = true;
-						}
-						if (_.isEmpty(selection) || (_.isArray(selection) && selection.length > 1)) {
-							isDisabled = true;
-						}
-						if (canRecordBeDeleted && !canRecordBeDeleted(selection)) {
+						if (isNoSelectorSelected() ||
+							isEmptySelection() ||
+							isMultiSelection() ||
+							isProtectedValue() ||
+							(canRecordBeEdited && !canRecordBeEdited(selection))
+						) {
 							isDisabled = true;
 						}
 						if (isTree) {
@@ -240,10 +257,10 @@ export default function withPresetButtons(WrappedComponent, isGrid = false) {
 						handler = (parent, e) => onView();
 						icon = Eye;
 						isDisabled = !selection.length || selection.length !== 1;
-						if (selectorId && !selectorSelected) {
-							isDisabled = true;
-						}
-						if (_.isEmpty(selection) || selection.length > 1) {
+						if (isNoSelectorSelected() ||
+							isEmptySelection() ||
+							isMultiSelection()
+						) {
 							isDisabled = true;
 						}
 						break;
@@ -253,10 +270,9 @@ export default function withPresetButtons(WrappedComponent, isGrid = false) {
 						handler = (parent, e) => onCopyToClipboard();
 						icon = Clipboard;
 						isDisabled = !selection.length;
-						if (selectorId && !selectorSelected) {
-							isDisabled = true;
-						}
-						if (_.isEmpty(selection)) {
+						if (isNoSelectorSelected() ||
+							isEmptySelection()
+						) {
 							isDisabled = true;
 						}
 						break;
@@ -266,13 +282,11 @@ export default function withPresetButtons(WrappedComponent, isGrid = false) {
 						handler = (parent, e) => onDuplicate();
 						icon = Duplicate;
 						isDisabled = !selection.length || selection.length !== 1;
-						if (selectorId && !selectorSelected) {
-							isDisabled = true;
-						}
-						if (_.isEmpty(selection) || selection.length > 1) {
-							isDisabled = true;
-						}
-						if (canRecordBeDuplicated && !canRecordBeDuplicated(selection)) {
+						if (isNoSelectorSelected() ||
+							isEmptySelection() ||
+							isMultiSelection() ||
+							(canRecordBeDuplicated && !canRecordBeDuplicated(selection))
+						) {
 							isDisabled = true;
 						}
 						break;

package/src/Components/Hoc/withValue.js

@@ -20,8 +20,7 @@ export default function withValue(WrappedComponent) {
 			return <WrappedComponent {...props} ref={ref} />;
 		}
 
-		const
-			{
+		const {
 				onChangeValue,
 				value,
 				startingValue = null,