Auto Hide on Mobile too

src/apps/chat/AppChat.tsx

@@ -108,21 +108,18 @@ const composerOpenSx: SxProps = {
   // mt: '-1px',
   // enables the composer to be compressed
   ...composerCompressorMixinSx,
-};
+} as const;
 
 const composerOpenMobileSx: SxProps = {
   zIndex: 21, // allocates the surface, possibly enables shadow if we like
-  // backgroundColor: themeBgAppChatComposer, // inlined in the Composer
-  transition: 'background-color 0.5s ease-out',
-  borderTop: `1px solid`,
-  borderTopColor: 'rgba(var(--joy-palette-neutral-mainChannel, 99 107 116) / 0.4)',
   pt: 0.5, // have some breathing room
   // boxShadow: '0px -1px 8px -2px rgba(0, 0, 0, 0.4)',
-};
+  ...composerOpenSx,
+} as const;
 
-const composerClosedSx: SxProps = {
-  display: 'none',
-};
+// const composerClosedSx: SxProps = {
+//   display: 'none',
+// };
 
 
 export function AppChat() {
@@ -775,7 +772,7 @@ export function AppChat() {
     </Box>
 
     {/* Hover zone for auto-hide */}
-    {composerAutoHide.isHidden && <Box {...composerAutoHide.detectorProps} />}
+    {!isMobile && composerAutoHide.isHidden && <Box {...composerAutoHide.detectorProps} />}
 
     {/* Diagrams */}
     {!!diagramConfig && (

src/apps/chat/components/composer/useComposerAutoHide.tsx

@@ -54,7 +54,7 @@ export function useComposerAutoHide(forceHide: boolean, isContentful: boolean, _
   const [isFocused, setIsFocused] = React.useState(false);
   const [isHovering, setIsHovering] = React.useState(false);
   const [forceShowUntil, setForceShowUntil] = React.useState<number>(0);
-  console.log('useComposerAutoHide', { forceHide, isContentful, _isMobile, isAutoHidden, isFocused, isHovering, forceShowUntil });
+
   // external state
   const autoHideEnabled = useUXLabsStore((state) => !_isMobile && state.labsAutoHideComposer);