[default-layout] Various improvements

packages/@sanity/default-layout/.eslintrc

@@ -1,7 +1,8 @@
 {
   "extends": ["../../../.eslintrc.js"],
   "rules": {
-    "@typescript-eslint/explicit-function-return-type": 0,
-    "@typescript-eslint/no-use-before-define": 0
+    "@typescript-eslint/explicit-function-return-type": "off",
+    "@typescript-eslint/no-use-before-define": "off",
+    "react/require-default-props": "off"
   }
 }

packages/@sanity/default-layout/sanity.json

@@ -16,7 +16,7 @@
     {
       "implements": "part:@sanity/default-layout/tool-switcher",
       "name": "part:@sanity/default-layout/default-tool-switcher",
-      "path": "navbar/toolMenu/ToolSwitcher"
+      "path": "navbar/toolMenu/ToolMenu"
     },
     {
       "name": "part:@sanity/default-layout/sidecar",

packages/@sanity/default-layout/src/@types/parts.d.ts

@@ -1,3 +1,5 @@
+/* eslint-disable import/export */
+
 // import {Observable} from 'rxjs'
 type Observable<T> = any
 
@@ -123,26 +125,12 @@ declare module 'part:@sanity/components/click-outside' {
   export * from '@sanity/components/src/clickOutside'
 }
 
+declare module 'part:@sanity/components/buttons/default-style'
 declare module 'part:@sanity/components/buttons/default' {
-  const DefaultButton: React.ComponentClass<{
-    kind?: 'simple' | 'secondary'
-    color?: 'primary' | 'success' | 'danger' | 'white' | 'warning'
-    onBlur?: () => void
-    onClick?: () => void
-    children?: React.ReactNode
-    inverted?: boolean
-    icon?: React.ComponentType<{}>
-    loading?: boolean
-    className?: string
-    disabled?: boolean
-    tabIndex?: number
-    padding?: 'large' | 'default' | 'small' | 'none'
-    bleed?: boolean
-    selected?: boolean
-    size?: 'extra-small' | 'small' | 'medium' | 'large' | 'extra-large'
-  }>
-
-  export default DefaultButton
+  export {default} from '@sanity/components/src/buttons/DefaultButton'
+}
+declare module 'part:@sanity/components/buttons/state' {
+  export {default} from '@sanity/components/src/buttons/StateButton'
 }
 
 declare module 'part:@sanity/components/dialogs/fullscreen' {
@@ -187,14 +175,6 @@ declare module 'part:@sanity/base/users-icon' {
   export default UserIcon
 }
 
-declare module 'part:@sanity/components/buttons/fab' {
-  const Fab: React.ComponentType<{
-    colored: boolean
-    onClick: (event: React.MouseEvent<HTMLButtonElement>) => void
-  }>
-  export default Fab
-}
-
 declare module 'part:@sanity/default-layout/branding-style' {
   const styles: {[key: string]: string}
   export default styles
@@ -310,9 +290,9 @@ declare module 'part:@sanity/base/util/draft-utils' {
   export const getPublishedId: (str: string) => string
 }
 
+declare module 'part:@sanity/components/loading/spinner-style'
 declare module 'part:@sanity/components/loading/spinner' {
-  const Spinner: React.ComponentType<{center: boolean; message: string}>
-  export default Spinner
+  export {default} from '@sanity/components/src/loading/Spinner'
 }
 
 declare module 'part:@sanity/base/search' {
@@ -392,13 +372,11 @@ declare module 'part:@sanity/components/dialogs/fullscreen-message' {
 }
 
 declare module 'part:@sanity/components/popover' {
-  // export const Portal: ComponentType<{}>
-  export const Popover: any
+  export * from '@sanity/components/src/popover'
 }
 
 declare module 'part:@sanity/components/tooltip' {
-  // export const Portal: ComponentType<{}>
-  export const Tooltip: any
+  export * from '@sanity/components/src/tooltip'
 }
 
 declare module 'part:@sanity/base/util/document-action-utils' {
@@ -420,6 +398,11 @@ declare module 'part:@sanity/base/error-icon' {
   export default ErrorIcon
 }
 
+declare module 'part:@sanity/base/spinner-icon' {
+  const SpinnerIcon: React.ComponentType<{}>
+  export default SpinnerIcon
+}
+
 declare module 'part:@sanity/base/warning-icon' {
   const WarningIcon: React.ComponentType<{}>
   export default WarningIcon

packages/@sanity/default-layout/src/DefaultLayout.css

@@ -12,7 +12,9 @@
 
 .root {
   box-sizing: border-box;
-  min-height: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
 
   @nest &::before {
     content: '';
@@ -36,8 +38,6 @@
 
   @media (--screen-medium) {
     overflow: hidden;
-    display: flex;
-    flex-direction: column;
     width: 100%;
     height: 100%;
   }
@@ -68,12 +68,8 @@
 }
 
 .toolContainer {
-  box-sizing: border-box;
   position: relative;
-  max-width: 100%;
-  min-height: 0;
-  flex-grow: 1;
-  display: block;
+  height: 100%;
   margin-top: 0;
   margin-left: env(safe-area-inset-left);
   margin-right: env(safe-area-inset-right);
@@ -88,9 +84,8 @@
 }
 
 .mainArea {
-  flex-grow: 1;
+  flex: 1;
   min-height: 0;
-  display: flex;
 
   @nest .root.isOverlayVisible & {
     overflow: hidden;

packages/@sanity/default-layout/src/DefaultLayout.tsx

@@ -7,7 +7,7 @@ import userStore from 'part:@sanity/base/user'
 import Sidecar from './addons/Sidecar'
 import RenderTool from './main/RenderTool'
 import ActionModal from './navbar/actionButton/ActionModal'
-import SideMenu from './navbar/drawer/SideMenu'
+import SideMenu from './navbar/sideMenu/SideMenu'
 import NavbarContainer from './navbar/NavbarContainer'
 import {SchemaErrorReporter} from './schemaErrors/SchemaErrorReporter'
 import getNewDocumentModalActions from './util/getNewDocumentModalActions'