@onehat/ui 0.3.30 → 0.3.31

package/package.json

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

package/src/Components/Buttons/SquareButton.js

@@ -0,0 +1,58 @@
+import React from 'react';
+import {
+	Icon,
+	Pressable,
+	Text,
+} from 'native-base';
+import UiGlobals from '../../UiGlobals.js';
+
+export default function SquareButton(props) {
+	const {
+			text,
+			isActive = false,
+			disableInteractions = false,
+			...propsToPass
+		} = props,
+		styles = UiGlobals.styles,
+		color = isActive ? '#fff' : '#000';
+	const propsIcon = props._icon || {};
+	let icon = props.icon;
+	if (!icon) {
+		throw Error('icon missing');
+	}
+	if (!text) {
+		throw Error('text missing');
+	}
+	
+	if (React.isValidElement(icon)) {
+		if (!_.isEmpty(propsIcon)) {
+			icon = React.cloneElement(icon, {...propsIcon});
+		}
+	} else {
+		icon = <Icon as={icon} {...propsIcon} />;
+	}
+
+	const
+		hoverProps = {},
+		pressedProps = {};
+	if (!disableInteractions) {
+		hoverProps.bg = styles.ICON_BUTTON_BG_HOVER;
+		pressedProps.bg = styles.ICON_BUTTON_BG_PRESSED;
+	}
+	
+	return <Pressable
+				borderRadius="md"
+				flexDirection="column"
+				justifyContent="center"
+				alignItems="center"
+				p={2}
+				{...propsToPass}
+				bg={isActive ? '#56a6f8' : '#fff'}
+				_hover={hoverProps}
+				_pressed={pressedProps}
+			>
+				<Icon as={icon} color={color} size="xl" />
+				<Text fontSize={20} color={color}>{text}</Text>
+			</Pressable>;
+}
+

package/src/Components/Hoc/withPdfButton.js

@@ -46,27 +46,34 @@ export default function withPdfButton(WrappedComponent) {
 				const modalItems = _.map(_.cloneDeep(items), (item, ix) => buildNextLayer(item, ix, columnDefaults)); // clone, as we don't want to alter the item by reference
 
 				if (!_.isEmpty(ancillaryItems)) {
+					const
+						ancillaryItemsClone = _.cloneDeep(ancillaryItems),
+						items = [];
+					_.each(ancillaryItemsClone, (ancillaryItem) => { // clone, as we don't want to alter the item by reference
+						let name;
+						if (ancillaryItem.model) {
+							name = Inflector.underscore(ancillaryItem.model);
+						} else {
+							name = ancillaryItem.title;
+						}
+						if (!inArray(name, ['Photos', 'Videos', 'Files'])) {
+							return;
+						}
+						name = 'ancillary___' + name;
+						items.push({
+							title: ancillaryItem.title,
+							label: ancillaryItem.title,
+							name,
+							type: 'Checkbox',
+						});
+					});
 					modalItems.push({
 						type: 'FieldSet',
 						title: 'Ancillary Items',
 						defaults: {
 							labelWidth: '90%',
 						},
-						items: _.map(_.cloneDeep(ancillaryItems), (ancillaryItem) => { // clone, as we don't want to alter the item by reference
-							let name;
-							if (ancillaryItem.model) {
-								name = Inflector.underscore(ancillaryItem.model);
-							} else {
-								name = ancillaryItem.title;
-							}
-							name = 'ancillary___' + name;
-							return {
-								title: ancillaryItem.title,
-								label: ancillaryItem.title,
-								name,
-								type: 'Checkbox',
-							};
-						}),
+						items,
 						showToggleAllCheckbox: true,
 						isCollapsible: false,
 					});

package/src/Components/Hoc/withPresetButtons.js

@@ -35,6 +35,9 @@ export default function withPresetButtons(WrappedComponent, isGrid = false) {
 				contextMenuItems,
 				additionalToolbarButtons,
 				onChangeColumnsConfig,
+				verifyCanEdit,
+				verifyCanDelete,
+				verifyCanDuplicate,
 				...propsToPass
 			} = props,
 			{
@@ -146,6 +149,9 @@ export default function withPresetButtons(WrappedComponent, isGrid = false) {
 						if (_.isEmpty(selection) || (_.isArray(selection) && selection.length > 1)) {
 							isDisabled = true;
 						}
+						if (verifyCanEdit && !verifyCanEdit(selection)) {
+							isDisabled = true;
+						}
 						break;
 					case 'delete':
 						text = 'Delete';
@@ -157,6 +163,9 @@ export default function withPresetButtons(WrappedComponent, isGrid = false) {
 						if (_.isEmpty(selection) || (_.isArray(selection) && selection.length > 1)) {
 							isDisabled = true;
 						}
+						if (verifyCanDelete && !verifyCanDelete(selection)) {
+							isDisabled = true;
+						}
 						break;
 					case 'view':
 						text = 'View';
@@ -193,6 +202,9 @@ export default function withPresetButtons(WrappedComponent, isGrid = false) {
 						if (_.isEmpty(selection) || selection.length > 1) {
 							isDisabled = true;
 						}
+						if (verifyCanDuplicate && !verifyCanDuplicate(selection)) {
+							isDisabled = true;
+						}
 						break;
 					// case 'print':
 					// 	text = 'Print';

package/src/Components/Viewer/Viewer.js

@@ -109,6 +109,7 @@ function Viewer(props) {
 			
 			let element = <Element
 								value={value}
+								isEditable={false}
 								{...propsToPass}
 							/>;
 			if (label) {

package/src/Components/index.js

@@ -37,6 +37,7 @@ import Panel from './Panel/Panel.js';
 // import Picker from '../Components/Panel/Picker.js';
 import PlusMinusButton from './Buttons/PlusMinusButton.js';
 import RadioGroup from './Form/Field/RadioGroup/RadioGroup.js';
+import SquareButton from './Buttons/SquareButton.js';
 import TabPanel from './Panel/TabPanel.js';
 import Tag from './Form/Field/Combo/Tag.js';
 import TagViewer from './Viewer/TagViewer.js';
@@ -88,6 +89,7 @@ const components = {
 	// Picker,
 	PlusMinusButton,
 	RadioGroup,
+	SquareButton,
 	TabPanel,
 	Tag,
 	TagViewer,