@onehat/ui 0.3.118 → 0.3.121

package/package.json

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

package/src/Components/Hoc/withFilters.js

@@ -44,6 +44,7 @@ export default function withFilters(WrappedComponent) {
 				customFilters = [], // of shape: { title, type, field, value, getRepoFilters(value) }
 				minFilters = 3,
 				maxFilters = 6,
+				onFilterChange,
 
 				// withData
 				Repository,
@@ -192,6 +193,9 @@ export default function withFilters(WrappedComponent) {
 					if (save && id) {
 						setSaved(id + '-filters', filters);
 					}
+					if (onFilterChange) {
+						onFilterChange(filters);
+					}
 				},
 				onFilterChangeValue = (field, value) => {
 					// handler for when a filter value changes

package/src/Components/Toolbar/Pagination.js

@@ -20,6 +20,7 @@ export default function Pagination(props) {
 			minimize = false,
 			disablePageSize = false,
 			showMoreOnly = false,
+			showPagination = true, // everything except reloadBtn
 
 			// withComponent
 			self,
@@ -61,14 +62,16 @@ export default function Pagination(props) {
 			isDisabled = false;
 		if (showMoreOnly) {
 			isDisabled = (pageEnd === total);
-			items.push(<Button
-							key="showMore"
-							parent={self}
-							reference="showMoreBtn"
-							onPress={() => Repository.showMore()}
-							isDisabled={isDisabled}
-							tooltip="Show More"
-						>Show More</Button>);
+			if (showPagination) {
+				items.push(<Button
+								key="showMore"
+								parent={self}
+								reference="showMoreBtn"
+								onPress={() => Repository.showMore()}
+								isDisabled={isDisabled}
+								tooltip="Show More"
+							>Show More</Button>);
+			}
 			if (!Repository.isLocal) {
 				items.push(<IconButton
 								key="reload"
@@ -83,70 +86,73 @@ export default function Pagination(props) {
 			}
 		} else {
 			isDisabled = page === 1;
-			items.push(<IconButton
-							key="first"
-							parent={self}
-							reference="firstPageBtn"
-							{...iconButtonProps}
-							isDisabled={isDisabled}
-							icon={<Icon as={AnglesLeft} {...iconProps} color={isDisabled ? 'disabled' : 'trueGray.600'} />}
-							onPress={() => Repository.setPage(1)}
-							tooltip="First Page"
-						/>);
-			items.push(<IconButton
-							key="prev"
-							parent={self}
-							reference="prevPageBtn"
-							{...iconButtonProps}
-							isDisabled={isDisabled}
-							icon={<Icon as={AngleLeft} {...iconProps} color={isDisabled ? 'disabled' : 'trueGray.600'} />}
-							onPress={() => Repository.prevPage()}
-							tooltip="Previous Page"
-						/>);
-			if (!minimize) {
-				items.push(<Row
-								key="pageSelector"
-								mx={3}
-								justifyContent="center"
-								alignItems="center"
-							>
-								<Text mr={2}>Page</Text>
-								<Input
-									parent={self}
-									reference="pageInput"
-									keyboardType="numeric"
-									value={page?.toString()}
-									onChangeValue={(value) => Repository.setPage(value)}
-									maxValue={totalPages}
-									isDisabled={totalPages === 1}
-									w={10}
-									tooltip="Set Page"
-								/>
-								<Text ml={2}>of {totalPages}</Text>
-							</Row>);
+			if (showPagination) {
+				items.push(<IconButton
+								key="first"
+								parent={self}
+								reference="firstPageBtn"
+								{...iconButtonProps}
+								isDisabled={isDisabled}
+								icon={<Icon as={AnglesLeft} {...iconProps} color={isDisabled ? 'disabled' : 'trueGray.600'} />}
+								onPress={() => Repository.setPage(1)}
+								tooltip="First Page"
+							/>);
+				items.push(<IconButton
+								key="prev"
+								parent={self}
+								reference="prevPageBtn"
+								{...iconButtonProps}
+								isDisabled={isDisabled}
+								icon={<Icon as={AngleLeft} {...iconProps} color={isDisabled ? 'disabled' : 'trueGray.600'} />}
+								onPress={() => Repository.prevPage()}
+								tooltip="Previous Page"
+							/>);
+				if (!minimize) {
+					items.push(<Row
+									key="pageSelector"
+									mx={3}
+									justifyContent="center"
+									alignItems="center"
+								>
+									<Text mr={2}>Page</Text>
+									<Input
+										parent={self}
+										reference="pageInput"
+										keyboardType="numeric"
+										value={page?.toString()}
+										onChangeValue={(value) => Repository.setPage(value)}
+										maxValue={totalPages}
+										isDisabled={totalPages === 1}
+										w={10}
+										tooltip="Set Page"
+									/>
+									<Text ml={2}>of {totalPages}</Text>
+								</Row>);
+				}
+
+				isDisabled = page === totalPages || totalPages <= 1;
+				items.push(<IconButton
+								key="next"
+								parent={self}
+								reference="nextPageBtn"
+								{...iconButtonProps}
+								isDisabled={isDisabled}
+								icon={<Icon as={AngleRight} {...iconProps} color={isDisabled ? 'disabled' : 'trueGray.600'} />}
+								onPress={() => Repository.nextPage()}
+								tooltip="Next Page"
+							/>);
+				items.push(<IconButton
+								key="last"
+								parent={self}
+								reference="lastPageBtn"
+								{...iconButtonProps}
+								isDisabled={isDisabled}
+								icon={<Icon as={AnglesRight} {...iconProps} color={isDisabled ? 'disabled' : 'trueGray.600'} />}
+								onPress={() => Repository.setPage(totalPages)}
+								tooltip="Last Page"
+							/>);
 			}
-	
-			isDisabled = page === totalPages || totalPages <= 1;
-			items.push(<IconButton
-							key="next"
-							parent={self}
-							reference="nextPageBtn"
-							{...iconButtonProps}
-							isDisabled={isDisabled}
-							icon={<Icon as={AngleRight} {...iconProps} color={isDisabled ? 'disabled' : 'trueGray.600'} />}
-							onPress={() => Repository.nextPage()}
-							tooltip="Next Page"
-						/>);
-			items.push(<IconButton
-							key="last"
-							parent={self}
-							reference="lastPageBtn"
-							{...iconButtonProps}
-							isDisabled={isDisabled}
-							icon={<Icon as={AnglesRight} {...iconProps} color={isDisabled ? 'disabled' : 'trueGray.600'} />}
-							onPress={() => Repository.setPage(totalPages)}
-							tooltip="Last Page"
-						/>);
+
 			if (!Repository.isLocal) {
 				items.push(<IconButton
 								key="reload"
@@ -158,10 +164,10 @@ export default function Pagination(props) {
 								tooltip="Reload"
 							/>);
 			}
-			if (!minimize && !disablePageSize) {
+			if (showPagination && !minimize && !disablePageSize) {
 				items.push(<PageSizeCombo key="pageSize" pageSize={pageSize} Repository={Repository} />);
 			}
-			if (!minimize) {
+			if (showPagination && !minimize) {
 				let pageSpan = `${pageStart} – ${pageEnd}`;
 				if (pageStart === pageEnd) {
 					pageSpan = pageStart;
@@ -181,6 +187,7 @@ export default function Pagination(props) {
 				</Row>;
 	}, [
 		// Repository,
+		showPagination,
 		page,
 		pageSize,
 		total,

package/src/Components/Toolbar/PaginationToolbar.js

@@ -49,7 +49,7 @@ export default function PaginationToolbar(props) {
 				w="100%"
 				onLayout={(e) => onLayout(e)}
 			>
-				{showPagination && <Pagination {...propsToPass} w={toolbarItems.length ? null : '100%'} minimize={minimize} disablePageSize={disablePageSize} />}
+				<Pagination {...propsToPass} showPagination={showPagination} w={toolbarItems.length ? null : '100%'} minimize={minimize} disablePageSize={disablePageSize} />
 				{toolbarItems.length ? <Row flex={1} {...toolbarProps}>{toolbarItems}</Row> : null}
 			</Toolbar>;
 };

package/src/Components/Viewer/Viewer.js

@@ -87,6 +87,9 @@ function Viewer(props) {
 			if (type?.match && type.match(/Combo$/) && Repository?.isRemote && !Repository?.isLoaded) {
 				editorTypeProps.autoLoad = true;
 			}
+			if (type.match(/(Tag|TagEditor)$/)) {
+				editorTypeProps.isViewOnly = true;
+			}
 			const Element = getComponentFromType(type);
 			let children;