@onehat/ui 0.4.71 → 0.4.72

package/src/Components/Hoc/withDnd.js

@@ -18,8 +18,8 @@ import {
 
 export function withDragSource(WrappedComponent) {
 	return forwardRef((props, ref) => {
-		
-		if (!props.isDragSource) {
+
+		if (!props.isDragSource || props.alreadyHasDragSource) {
 			return <WrappedComponent {...props} ref={ref} />;
 		}
 
@@ -37,6 +37,7 @@ export function withDragSource(WrappedComponent) {
 				dragOptions = null,
 				dropEffect = null,
 				// onDrag,
+				onDragStart = null,
 				onDragEnd = null,
 				canDrag = null,
 				isDragging = null,
@@ -63,10 +64,15 @@ export function withDragSource(WrappedComponent) {
 
 				return {
 					type: dragSourceType, // Required. This must be either a string or a symbol. Only the drop targets registered for the same type will react to this item.
-					item: {
-						...dragSourceItem,
-						getDragProxy,
-					}, // Required (object or function).
+					item: () => { // Required (object or function). If a function, it runs only once at the start of a drag.
+						if (dragSourceItem.onDragStart) {
+							dragSourceItem.onDragStart();
+						}
+						return {
+							...dragSourceItem,
+							getDragProxy,
+						};
+					},
 						// When an object, it is a plain JavaScript object describing the data being dragged. This is the only information available to the drop targets about the drag source so it's important to pick the minimal data they need to know. You may be tempted to put a complex reference here, but you should try very hard to avoid doing this because it couples the drag sources and drop targets. It's a good idea to use something like { id }.
 						// When a function, it is fired at the beginning of the drag operation and returns an object representing the drag operation (see first bullet). If null is returned, the drag operation is cancelled.
 					previewOptions: dragPreviewOptions, // Optional. A plain JavaScript object describing drag preview options.
@@ -119,6 +125,7 @@ export function withDragSource(WrappedComponent) {
 
 		return <WrappedComponent
 					{...props}
+					alreadyHasDragSource={true}
 					ref={ref}
 					canDrag={stateCanDrag}
 					isDragging={stateIsDragging}
@@ -133,7 +140,7 @@ export function withDragSource(WrappedComponent) {
 export function withDropTarget(WrappedComponent) {
 	return forwardRef((props, ref) => {
 
-		if (!props.isDropTarget) {
+		if (!props.isDropTarget || props.alreadyHasDropTarget) {
 			return <WrappedComponent {...props} ref={ref} />;
 		}
 
@@ -197,8 +204,9 @@ export function withDropTarget(WrappedComponent) {
 		dropTargetRef(localTargetRef); // register DOM node with react-dnd
 
 		return <WrappedComponent
-					canDrop={stateCanDrop}
+					alreadyHasDropTarget={true}
 					ref={ref}
+					canDrop={stateCanDrop}
 					isOver={isOver}
 					dropTargetRef={localTargetRef}
 					draggedItem={draggedItem} // Pass the dragged item

package/src/Components/Hoc/withDraggable.js

@@ -23,7 +23,7 @@ import getComponentFromType from '../../Functions/getComponentFromType.js';
 export default function withDraggable(WrappedComponent) {
 	return forwardRef((props, ref) => {
 
-		if (!props.isDraggable) {
+		if (!props.isDraggable || props.alreadyHasDraggable) {
 			return <WrappedComponent {...props} ref={ref} />;
 		}
 
@@ -237,7 +237,11 @@ export default function withDraggable(WrappedComponent) {
 							{...draggableProps}
 						>
 							<div ref={nodeRef} className="nsResize">
-								<WrappedComponent {...propsToPass} ref={ref} />
+								<WrappedComponent
+									{...propsToPass}
+									alreadyHasDraggable={true}
+									ref={ref}
+								/>
 							</div>
 						</Draggable>;
 			} else if (mode === HORIZONTAL) {
@@ -252,7 +256,11 @@ export default function withDraggable(WrappedComponent) {
 							{...draggableProps}
 						>
 							<div ref={nodeRef} className="ewResize" style={{ height: '100%', }}>
-								<WrappedComponent {...propsToPass} ref={ref} />
+								<WrappedComponent
+									{...propsToPass}
+									alreadyHasDraggable={true}
+									ref={ref}
+								/>
 							</div>
 						</Draggable>;
 			}
@@ -268,14 +276,22 @@ export default function withDraggable(WrappedComponent) {
 						nodeRef={nodeRef}
 						{...draggableProps}
 					>
-						<WrappedComponent {...propsToPass} ref={nodeRef} />
+						<WrappedComponent
+							{...propsToPass}
+							alreadyHasDraggable={true}
+							ref={nodeRef}
+						/>
 					</Draggable>;
 		} else if (CURRENT_MODE === UI_MODE_NATIVE) {
 
 			// NOT YET IMPLEMENTED
 			// Really need to replace most of this, as much of it is web-centric.
 
-			return <WrappedComponent {...propsToPass} ref={ref} />; // TEMP
+			return <WrappedComponent
+						{...propsToPass}
+						alreadyHasDraggable={true}
+						ref={ref}
+					/>;
 
 		}
 	});

package/src/Components/Hoc/withEditor.js

@@ -21,7 +21,7 @@ import _ from 'lodash';
 export default function withEditor(WrappedComponent, isTree = false) {
 	return forwardRef((props, ref) => {
 
-		if (props.disableWithEditor) {
+		if (props.disableWithEditor || props.alreadyHasWithEditor) {
 			return <WrappedComponent {...props} ref={ref} isTree={isTree} />;
 		}
 
@@ -702,6 +702,7 @@ export default function withEditor(WrappedComponent, isTree = false) {
 					{...props}
 					ref={ref}
 					disableWithEditor={false}
+					alreadyHasWithEditor={true}
 					currentRecord={currentRecord}
 					setCurrentRecord={setCurrentRecord}
 					isEditorShown={isEditorShown}

package/src/Components/Hoc/withEvents.js

@@ -2,9 +2,19 @@ import { forwardRef } from 'react';
 
 export default function withEvents(WrappedComponent) {
 	return forwardRef((props, ref) => {
+
+		if (props.alreadyHasWithEvents) {
+			return <WrappedComponent {...props} ref={ref} />;
+		}
+		
 		const {
 				onEvent,
 			} = props;
-		return <WrappedComponent fireEvent={onEvent} {...props} ref={ref} />;
+		return <WrappedComponent
+					{...props}
+					alreadyHasWithEvents={true}
+					ref={ref}
+					fireEvent={onEvent}
+				/>;
 	});
 }

package/src/Components/Hoc/withFilters.js

@@ -42,7 +42,7 @@ const isWindows = Platform.OS === 'windows';
 export default function withFilters(WrappedComponent) {
 	return forwardRef((props, ref) => {
 
-		if (!props.useFilters) {
+		if (!props.useFilters || props.alreadyHasWithFilters) {
 			return <WrappedComponent {...props} ref={ref} />;
 		}
 
@@ -695,7 +695,12 @@ export default function withFilters(WrappedComponent) {
 							</HStack>}
 					</Toolbar>;
 		
-		return <WrappedComponent {...props} topToolbar={toolbar} ref={ref} />;
+		return <WrappedComponent
+					{...props}
+					ref={ref}
+					alreadyHasWithFilters={true}
+					topToolbar={toolbar}
+				/>;
 
 	});
 }

package/src/Components/Hoc/withModal.js

@@ -19,7 +19,7 @@ import _ from 'lodash';
 export default function withModal(WrappedComponent) {
 	return forwardRef((props, ref) => {
 
-		if (props.disableWithModal || props.showModal) {
+		if (props.disableWithModal || props.alreadyHasWithModal) {
 			return <WrappedComponent {...props} ref={ref} />;
 		}
 
@@ -180,12 +180,13 @@ export default function withModal(WrappedComponent) {
 					<WrappedComponent
 						{...props}
 						disableWithModal={false}
+						alreadyHasWithModal={true}
+						ref={ref}
 						showModal={showModal}
 						hideModal={onCancel || hideModal}
 						updateModalBody={updateModalBody}
 						isModalShown={isModalShown}
 						whichModal={whichModal}
-						ref={ref}
 					/>
 					{isModalShown && 
 						<Modal

package/src/Components/Hoc/withPdfButtons.js

@@ -22,7 +22,7 @@ export default function withPdfButtons(WrappedComponent) {
 		if (props.canUser && !props.canUser(VIEW)) { // permissions
 			showButtons = false;
 		}
-		if (!showButtons) {
+		if (!showButtons || props.alreadyHasWithPdfButtons) {
 			// bypass everything.
 			// If we don't do this, we get an infinite recursion with Form
 			// because this HOC wraps Form and uses Form itself.
@@ -384,9 +384,10 @@ export default function withPdfButtons(WrappedComponent) {
 	
 		return <WrappedComponent
 					{...props}
+					ref={ref}
+					alreadyHasWithPdfButtons={true}
 					additionalEditButtons={additionalEditButtons}
 					additionalViewButtons={additionalViewButtons}
-					ref={ref}
 				/>;
 	}));
 }

package/src/Components/Hoc/withPermissions.js

@@ -97,7 +97,7 @@ export function canUser(permission, modelToCheck = null) {
 export default function withPermissions(WrappedComponent, forceUsePermissions = false) {
 	return forwardRef((props, ref) => {
 
-		if (!props.usePermissions && !forceUsePermissions) {
+		if ((!props.usePermissions && !forceUsePermissions) || props.alreadyHasWithPermissions) {
 			return <WrappedComponent {...props} ref={ref} />;
 		}
 
@@ -126,9 +126,10 @@ export default function withPermissions(WrappedComponent, forceUsePermissions =
 
 		return <WrappedComponent
 					{...props}
+					alreadyHasWithPermissions={true}
+					ref={ref}
 					canUser={canUserDecorator}
 					showPermissionsError={showPermissionsError}
-					ref={ref}
 				/>;
 	});
 }

package/src/Components/Hoc/withPresetButtons.js

@@ -41,7 +41,7 @@ const presetButtons = [
 export default function withPresetButtons(WrappedComponent, isGrid = false) {
 	return forwardRef((props, ref) => {
 
-		if (props.disablePresetButtons) {
+		if (props.disablePresetButtons || props.alreadyHasWithPresetButtons) {
 			// bypass everything
 			return <WrappedComponent {...props} ref={ref} />;
 		}
@@ -433,8 +433,9 @@ export default function withPresetButtons(WrappedComponent, isGrid = false) {
 
 		return <WrappedComponent
 					{...propsToPass}
-					ref={ref}
 					disablePresetButtons={false}
+					alreadyHasWithPresetButtons={true}
+					ref={ref}
 					contextMenuItems={[
 						...localContextMenuItems,
 						...contextMenuItems,

package/src/Components/Hoc/withSelection.js

@@ -12,14 +12,7 @@ import _ from 'lodash';
 export default function withSelection(WrappedComponent) {
 	return forwardRef((props, ref) => {
 
-		if (props.disableWithSelection) {
-			return <WrappedComponent {...props} ref={ref} />;
-		}
-
-		if (props.setSelection) {
-			// bypass everything, since we're already using withSelection() in hierarchy.
-			// For example, Combo has withSelection(), and intenally it uses Grid which also has withSelection(),
-			// but we only need it defined once for the whole thing.
+		if (props.disableWithSelection || props.alreadyHasWithSelection) {
 			return <WrappedComponent {...props} ref={ref} />;
 		}
 
@@ -427,6 +420,7 @@ export default function withSelection(WrappedComponent) {
 					{...props}
 					ref={ref}
 					disableWithSelection={false}
+					alreadyHasWithSelection={true}
 					selection={getSelection()}
 					getSelection={getSelection}
 					setSelection={setSelection}

package/src/Components/Hoc/withToast.js

@@ -13,7 +13,7 @@ import _ from 'lodash';
 export default function withToast(WrappedComponent) {
 	return forwardRef((props, ref) => {
 
-		if (props.disableWithToast || props.showToast) {
+		if (props.disableWithToast || props.alreadyHasWithToast) {
 			return <WrappedComponent {...props} ref={ref} />;
 		}
 
@@ -80,8 +80,10 @@ export default function withToast(WrappedComponent) {
 		
 		return <WrappedComponent
 					{...props}
-					showToast={showToast}
+					alreadyHasWithToast={true}
+					disableWithToast={false}
 					ref={ref}
+					showToast={showToast}
 				/>;
 	});
 }

package/src/Components/Hoc/withTooltip.js

@@ -7,6 +7,11 @@ import _ from 'lodash';
 
 export default function withTooltip(WrappedComponent) {
 	return forwardRef((props, ref) => {
+
+		if (props.alreadyHasWithTooltip) {
+			return <WrappedComponent {...props} ref={ref} />;
+		}
+		
 		const {
 				tooltip,
 				tooltipPlacement = 'bottom',
@@ -16,7 +21,11 @@ export default function withTooltip(WrappedComponent) {
 				...propsToPass
 			} = props;
 		
-		let component = <WrappedComponent {...propsToPass} ref={ref} />;
+		let component = <WrappedComponent
+							{...propsToPass}
+							alreadyHasWithTooltip={true}
+							ref={ref}
+						/>;
 
 		if (tooltip || !_.isEmpty(_tooltip)) {
 			component = <Tooltip

package/src/Components/Hoc/withValue.js

@@ -9,14 +9,7 @@ import _ from 'lodash';
 export default function withValue(WrappedComponent) {
 	return forwardRef((props, ref) => {
 
-		if (props.disableWithValue) {
-			return <WrappedComponent {...props} ref={ref} />;
-		}
-
-		if (props.setValue) {
-			// bypass everything, since we're already using withValue() in hierarchy.
-			// For example, Combo has withValue(), and intenally it uses Input which also has withValue(),
-			// but we only need it defined once for the whole thing.
+		if (props.disableWithValue || props.alreadyHasWithValue) {
 			return <WrappedComponent {...props} ref={ref} />;
 		}
 
@@ -143,8 +136,9 @@ export default function withValue(WrappedComponent) {
 
 		return <WrappedComponent
 					{...props}
-					ref={ref}
 					disableWithValue={false}
+					alreadyHasWithValue={true}
+					ref={ref}
 					value={convertedValue}
 					setValue={setValueRef.current}
 					onChangeSelection={onChangeSelection}

package/src/Components/Messages/GlobalModals.js

@@ -0,0 +1,47 @@
+
+import { useSelector, useDispatch, } from 'react-redux';
+import {
+	selectIsWaitModalShown,
+	selectAlertMessage,
+	selectDebugMessage,
+	selectInfoMessage,
+	selectWaitMessage,
+	setAlertMessage,
+	setDebugMessage,
+	setInfoMessage,
+} from '@src/models/Slices/DebugSlice';
+import WaitMessage from './WaitMessage';
+import ErrorMessage from './ErrorMessage';
+
+
+
+export default function GlobalModals() {
+	const
+		dispatch = useDispatch(),
+		isWaitModalShown = useSelector(selectIsWaitModalShown),
+		alertMessage = useSelector(selectAlertMessage),
+		debugMessage = useSelector(selectDebugMessage),
+		infoMessage = useSelector(selectInfoMessage),
+		waitMessage = useSelector(selectWaitMessage);
+
+	return <>
+				{isWaitModalShown && <WaitMessage text={waitMessage} />}
+				{!isWaitModalShown && alertMessage && 
+					<ErrorMessage
+						text={alertMessage}
+						onOk={() => dispatch(setAlertMessage(null))}
+					/>}
+				{!isWaitModalShown && debugMessage && 
+					<ErrorMessage
+						text={debugMessage}
+						color="green"
+						onOk={() => dispatch(setDebugMessage(null))}
+					/>}
+				{!isWaitModalShown && infoMessage && 
+					<ErrorMessage
+						text={infoMessage}
+						color="#000"
+						onOk={() => dispatch(setInfoMessage(null))}
+					/>}
+			</>;
+}

package/src/Components/Tree/Tree.js

@@ -1088,17 +1088,26 @@ function TreeComponent(props) {
 											id: item.id,
 											item,
 											getSelection,
+											isInSelection,
 											type: nodeDragSourceType,
+											onDragStart: () => {
+												if (!isInSelection(item)) { // get updated isSelected (will be stale if using one in closure)
+													// reset the selection to just this one node if it's not already selected
+													setSelection([item]);
+												}
+											},
 										};
 
 										// Prevent root nodes from being dragged, and use custom logic if provided
 										nodeDragProps.canDrag = (monitor) => {
 											const currentSelection = getSelection();
 											
-											// Check if any selected node is a root node (can't drag root nodes)
-											const hasRootNode = currentSelection.some(node => node.isRoot);
-											if (hasRootNode) {
-												return false;
+											if (isInSelection(item)) {
+												// make sure root node is not selected (can't drag root nodes)
+												const hasRootNode = currentSelection.some(node => node.isRoot);
+												if (hasRootNode) {
+													return false;
+												}
 											}
 											
 											// Use custom drag validation if provided
@@ -1118,7 +1127,7 @@ function TreeComponent(props) {
 										// Add drag preview rendering
 										nodeDragProps.getDragProxy = getCustomDragProxy ? 
 											(dragItem) => getCustomDragProxy(item, getSelection()) :
-											null; // Let GlobalDragProxy handle the default case
+											null; // let GlobalDragProxy handle the default case
 
 										const dropTargetAccept = 'internal';
 										nodeDragProps.isDropTarget = true;
@@ -1178,15 +1187,22 @@ function TreeComponent(props) {
 											nodeDragProps.isDragSource = !item.isRoot; // Root nodes cannot be dragged
 											nodeDragProps.dragSourceType = nodeDragSourceType;
 											if (getNodeDragSourceItem) {
-												nodeDragProps.dragSourceItem = getNodeDragSourceItem(item, getSelection, nodeDragSourceType);
+												nodeDragProps.dragSourceItem = getNodeDragSourceItem(item, getSelection, isInSelection, nodeDragSourceType);
 											} else {
 												nodeDragProps.dragSourceItem = {
 													id: item.id,
 													item,
 													getSelection,
+													isInSelection,
 													type: nodeDragSourceType,
 												};
 											}
+											nodeDragProps.dragSourceItem.onDragStart = () => {
+												if (!isInSelection(item)) { // get updated isSelected (will be stale if using one in closure)
+													// reset the selection to just this one node if it's not already selected
+													setSelection([item]);
+												}
+											};
 											if (canNodeMoveExternally) {
 												nodeDragProps.canDrag = canNodeMoveExternally;
 											}

package/src/Components/Tree/TreeNode.js

@@ -16,7 +16,7 @@ import UiGlobals from '../../UiGlobals.js';
 import withDraggable from '../Hoc/withDraggable.js';
 import IconButton from '../Buttons/IconButton.js';
 import { withDragSource, withDropTarget } from '../Hoc/withDnd.js';
-import TreeNodeDragHandle from './TreeNodeDragHandle.js';
+import RowHandle from '../Grid/RowHandle.js';
 import testProps from '../../Functions/testProps.js';
 import ChevronRight from '../Icons/ChevronRight.js';
 import ChevronDown from '../Icons/ChevronDown.js';
@@ -40,11 +40,13 @@ export default function TreeNode(props) {
 			nodeProps = {},
 			onToggle,
 			bg,
+			isDraggable,
 			isDragSource,
 			isHovered,
 			isHighlighted,
 			isOver,
 			isSelected,
+			showSelectHandle,
 			canDrop,
 			draggedItem,
 			validateDrop, // same as canDrop (for visual feedback)
@@ -144,19 +146,21 @@ export default function TreeNode(props) {
 						backgroundColor: bg,
 					}}
 					ref={(element) => {
-						// Attach both drag and drop refs to the same element
-						if (dragSourceRef && typeof dragSourceRef === 'function') {
-							dragSourceRef(element);
-						}
 						if (dropTargetRef && dropTargetRef.current !== undefined) {
 							// dropTargetRef is a ref object, not a callback
 							dropTargetRef.current = element;
 						}
 					}}
 				>
-					{isPhantom && <Box t={0} l={0} className="absolute bg-[#f00] h-[2px] w-[2px]" />}
+					{isPhantom && <Box className="absolute t-0 l-0 bg-[#f00] h-[2px] w-[2px]" />}
 					
-					{isDragSource && <TreeNodeDragHandle />}
+					{(isDragSource || showSelectHandle) &&
+						<RowHandle
+							ref={dragSourceRef}
+							isDragSource={isDragSource}
+							isDraggable={isDraggable}
+							showSelectHandle={showSelectHandle}
+						/>}
 
 					{hasChildren && <IconButton
 										{...testProps('expandBtn')}
@@ -180,12 +184,8 @@ export default function TreeNode(props) {
 									'flex',
 									'flex-1',
 									'text-ellipsis',
-									'select-none',
 									styles.TREE_NODE_CLASSNAME,
 								)}
-								style={{
-									userSelect: 'none',
-								}}
 							>{text}</TextNative>}
 
 					{content}

package/src/Components/Tree/TreeNodeDragHandle.js

@@ -1,3 +1,4 @@
+import { forwardRef } from 'react';
 import {
 	Icon,
 	VStack,
@@ -6,11 +7,11 @@ import clsx from 'clsx';
 import styles from '../../Styles/StyleSheets.js';
 import GripVertical from '../Icons/GripVertical.js';
 
-function TreeNodeDragHandle(props) {
+const TreeNodeDragHandle = forwardRef(function(props, ref) {
 	let className = clsx(
 		'TreeNodeDragHandle',
 		'h-full',
-		'w-[14px]',
+		'w-[17px]',
 		'px-[2px]',
 		'border-l-2',
 		'items-center',
@@ -21,14 +22,17 @@ function TreeNodeDragHandle(props) {
 		className += ' ' + props.className;
 	}
 	return <VStack
+				{...props}
+				ref={ref}
 				style={styles.ewResize}
 				className={className}
 			>
 				<Icon
 					as={GripVertical}
 					size="xs"
-					className="handle w-full h-full text-[#ccc]" />
+					className="handle w-full h-full text-[#ccc]"
+				/>
 			</VStack>;
-}
+});
 
 export default TreeNodeDragHandle;

package/src/Components/Viewer/MeterTypeText.js

@@ -2,6 +2,13 @@ import {
 	TextNative,
 } from '@project-components/Gluestack';
 import clsx from 'clsx';
+import {
+	METER_TYPES__HOURS,
+	METER_TYPES__MILES,
+	METER_TYPES__HOURS_TEXT,
+	METER_TYPES__MILES_TEXT,
+} from '../../Constants/MeterTypes';
+
 import UiGlobals from '../../UiGlobals';
 
 export default function MeterTypeText(props) {
@@ -17,8 +24,21 @@ export default function MeterTypeText(props) {
 	if (props.className) {
 		className += ' ' + props.className;
 	}
+	let meterType = '';
+	switch(props.value) {
+		case METER_TYPES__HOURS:
+			meterType = METER_TYPES__HOURS_TEXT;
+			break;
+		case METER_TYPES__MILES:
+			meterType = METER_TYPES__MILES_TEXT;
+			break;
+		default:
+			meterType = 'unknown';
+			break;
+	}
+	
 	return <TextNative
 				{...props}
 				className={className}
-			>{props.value ? 'Time (hrs)' : 'Distance (mi/km)'}</TextNative>;
+			>{meterType}</TextNative>;
 };

package/src/Constants/MeterTypes.js

@@ -1,2 +1,4 @@
 export const METER_TYPES__HOURS = 1;
 export const METER_TYPES__MILES = 2;
+export const METER_TYPES__HOURS_TEXT = 'Time (hrs)';
+export const METER_TYPES__MILES_TEXT = 'Distance (mi/km)';

package/src/Functions/addIconProps.js

@@ -0,0 +1,46 @@
+
+import clsx from 'clsx';
+import {
+	UI_MODE_WEB,
+	UI_MODE_NATIVE,
+	CURRENT_MODE,
+} from '../Constants/UiModes.js';
+import _ from 'lodash';
+
+export default function addIconProps(iconProps = {}) {
+
+	iconProps = _.cloneDeep(iconProps); // avoid mutating the original props, as they may be submitted to multiple components
+
+	iconProps.className = clsx(
+		'Icon',
+		iconProps.className,
+	);
+
+	if (CURRENT_MODE === UI_MODE_WEB) {
+		return iconProps;
+	}
+
+	// native only
+
+	// marginx
+	iconProps.style = {
+		marginHorizontal: 8,
+		...iconProps.style,
+	};
+
+	// On native, react-native-svg ignores className and will only size the icon based on 
+	// explicit width / height props (or size if the wrapper supports it).
+	// If no size set, it falls back to the full intrinsic viewBox size, so we need to ensure we set a default size.
+	// If you want to override the size, pass width and height props to the icon.
+	if (iconProps.width || iconProps.height) {
+		return iconProps;
+	}
+	const nativeDefaults = {
+		width: 24,
+		height: 24,
+	};
+	return {
+		...nativeDefaults,
+		...iconProps,
+	};
+}