@etsoo/materialui 1.2.2 → 1.2.4

package/lib/ScrollTopFab.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { CustomFabProps } from './CustomFabProps';
+import { CustomFabProps } from "./CustomFabProps";
 /**
  * Scroll to top fab
  * @returns Component

package/lib/ScrollTopFab.js

@@ -1,6 +1,6 @@
-import React from 'react';
-import { Fab, useScrollTrigger, Zoom } from '@mui/material';
-import VerticalAlignTopIcon from '@mui/icons-material/VerticalAlignTop';
+import React from "react";
+import { Fab, useScrollTrigger, Zoom } from "@mui/material";
+import VerticalAlignTopIcon from "@mui/icons-material/VerticalAlignTop";
 /**
  * Scroll to top fab
  * @returns Component
@@ -19,7 +19,7 @@ export function ScrollTopFab(props) {
     const handleClick = () => {
         target.scrollTo({ top: 0 });
     };
-    return (React.createElement(Zoom, { in: trigger },
+    return trigger ? (React.createElement(Zoom, { in: trigger },
         React.createElement(Fab, { color: color, size: size, title: title, onClick: handleClick },
-            React.createElement(VerticalAlignTopIcon, null))));
+            React.createElement(VerticalAlignTopIcon, null)))) : (React.createElement(React.Fragment, null));
 }

package/lib/SearchBar.js

@@ -244,7 +244,7 @@ export function SearchBar(props) {
                 React.createElement(IconButton, { title: labels.more, size: "medium", sx: { height: "40px" }, onClick: handleMore },
                     React.createElement(MoreHorizIcon, null)),
                 React.createElement(Button, { variant: "contained", size: "medium", ref: resetButtonRef, onClick: handleReset }, labels.reset))),
-        hasMoreItems && (React.createElement(Drawer, { anchor: "right", sx: { minWidth: "250px" }, ModalProps: {
+        hasMoreItems && (React.createElement(Drawer, { anchor: "right", sx: { minWidth: "180px" }, ModalProps: {
                 keepMounted: true
             }, open: open, onClose: () => updateOpen(false) },
             React.createElement("form", { onChange: moreFormChange, ref: (form) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@etsoo/materialui",
-  "version": "1.2.2",
+  "version": "1.2.4",
   "description": "TypeScript Material-UI Implementation",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
@@ -50,10 +50,10 @@
     "@emotion/css": "^11.10.6",
     "@emotion/react": "^11.10.6",
     "@emotion/styled": "^11.10.6",
-    "@etsoo/appscript": "^1.3.91",
+    "@etsoo/appscript": "^1.3.92",
     "@etsoo/notificationbase": "^1.1.24",
     "@etsoo/react": "^1.6.67",
-    "@etsoo/shared": "^1.2.0",
+    "@etsoo/shared": "^1.2.1",
     "@mui/icons-material": "^5.11.16",
     "@mui/material": "^5.12.0",
     "@mui/x-data-grid": "^6.2.0",

package/src/ScrollTopFab.tsx

@@ -1,34 +1,36 @@
-import React from 'react';
-import { Fab, useScrollTrigger, Zoom } from '@mui/material';
-import VerticalAlignTopIcon from '@mui/icons-material/VerticalAlignTop';
-import { CustomFabProps } from './CustomFabProps';
+import React from "react";
+import { Fab, useScrollTrigger, Zoom } from "@mui/material";
+import VerticalAlignTopIcon from "@mui/icons-material/VerticalAlignTop";
+import { CustomFabProps } from "./CustomFabProps";
 
 /**
  * Scroll to top fab
  * @returns Component
  */
 export function ScrollTopFab(props: CustomFabProps) {
-    // Destruct
-    const { color, size, target, title } = props;
+  // Destruct
+  const { color, size, target, title } = props;
 
-    // Scroll trigger
-    const trigger = useScrollTrigger({
-        target,
-        disableHysteresis: true,
-        threshold: 120
-    });
+  // Scroll trigger
+  const trigger = useScrollTrigger({
+    target,
+    disableHysteresis: true,
+    threshold: 120
+  });
 
-    // Icon click handler
-    // behavior: 'smooth'
-    const handleClick = () => {
-        target.scrollTo({ top: 0 });
-    };
+  // Icon click handler
+  // behavior: 'smooth'
+  const handleClick = () => {
+    target.scrollTo({ top: 0 });
+  };
 
-    return (
-        <Zoom in={trigger}>
-            <Fab color={color} size={size} title={title} onClick={handleClick}>
-                <VerticalAlignTopIcon />
-            </Fab>
-        </Zoom>
-    );
+  return trigger ? (
+    <Zoom in={trigger}>
+      <Fab color={color} size={size} title={title} onClick={handleClick}>
+        <VerticalAlignTopIcon />
+      </Fab>
+    </Zoom>
+  ) : (
+    <React.Fragment />
+  );
 }

package/src/SearchBar.tsx

@@ -357,7 +357,7 @@ export function SearchBar(props: SearchBarProps) {
       {hasMoreItems && (
         <Drawer
           anchor="right"
-          sx={{ minWidth: "250px" }}
+          sx={{ minWidth: "180px" }}
           ModalProps={{
             keepMounted: true
           }}