Update layout args, imports

Use updated imports for goofy-goober.

The layout args have a separate auxiliary items shown flag for
displaying more items from left sidebar with menu layout.

packages/base/package.json

@@ -17,6 +17,7 @@
   },
   "devDependencies": {
     "@types/node": "^18.0.0",
+    "@types/react": "^18.0.33",
     "eslint": "^8.20.0",
     "eslint-config-lxsmnsyc": "^0.4.7",
     "pridepack": "2.2.1",

packages/base/src/common.ts

@@ -7,6 +7,7 @@ export enum Span {
 export type LayoutArgs = {
   span: Span;
   mainSidebarOpen: boolean;
+	auxiliaryItemsShown: boolean;
 }
 
 export { setup, extractCss } from '@tesseract-design/goofy-goober';

packages/base/src/layouts/LeftSidebarWithMenu.ts

@@ -150,7 +150,7 @@ export const SidebarMenuGroup = () => css.cx(
 );
 
 export const MoreItems = ({
-  mainSidebarOpen,
+  auxiliaryItemsShown,
 }: LayoutArgs) => css.cx(
   css`
     position: fixed;
@@ -163,7 +163,7 @@ export const MoreItems = ({
     box-sizing: border-box;
   `,
   css.dynamic({
-    left: mainSidebarOpen ? 0 : '-100%',
+    left: auxiliaryItemsShown ? 0 : '-100%',
   }),
   css.media('(min-width: 1080px)')(
     css`

packages/base/tsconfig.json

@@ -3,7 +3,7 @@
   "include": ["src", "types"],
   "compilerOptions": {
     "module": "ESNext",
-    "lib": ["ESNext"],
+    "lib": ["ESNext", "DOM"],
     "importHelpers": true,
     "declaration": true,
     "sourceMap": true,
@@ -14,7 +14,6 @@
     "noImplicitReturns": true,
     "noFallthroughCasesInSwitch": true,
     "moduleResolution": "node",
-    "jsx": "react",
     "esModuleInterop": true,
     "target": "ES2017"
   }

packages/base/yarn.lock

@@ -383,9 +383,8 @@
 
 "@tesseract-design/goofy-goober@https://code.modal.sh/tesseract-design/goofy-goober.git":
   version "0.3.0"
-  resolved "https://code.modal.sh/tesseract-design/goofy-goober.git#a2d9c7409b951ab999aa59152b8c06e5378b2834"
+  resolved "https://code.modal.sh/tesseract-design/goofy-goober.git#a51202635a21374b10681a59639b6497478a618e"
   dependencies:
-    csstype "^3.1.0"
     goober "^2.1.10"
 
 "@tsconfig/node14@^1.0.3":
@@ -420,6 +419,25 @@
   resolved "https://registry.yarnpkg.com/@types/node/-/node-18.15.11.tgz#b3b790f09cb1696cffcec605de025b088fa4225f"
   integrity sha512-E5Kwq2n4SbMzQOn6wnmBjuK9ouqlURrcZDVfbo9ftDDTFt3nk7ZKK4GMOzoYgnpQJKcxwQw+lGaBvvlMo0qN/Q==
 
+"@types/prop-types@*":
+  version "15.7.5"
+  resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.5.tgz#5f19d2b85a98e9558036f6a3cacc8819420f05cf"
+  integrity sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==
+
+"@types/react@^18.0.33":
+  version "18.0.33"
+  resolved "https://registry.yarnpkg.com/@types/react/-/react-18.0.33.tgz#a1575160cb4376787c2f5fe0312302f824baa61e"
+  integrity sha512-sHxzVxeanvQyQ1lr8NSHaj0kDzcNiGpILEVt69g9S31/7PfMvNCKLKcsHw4lYKjs3cGNJjXSP4mYzX43QlnjNA==
+  dependencies:
+    "@types/prop-types" "*"
+    "@types/scheduler" "*"
+    csstype "^3.0.2"
+
+"@types/scheduler@*":
+  version "0.16.3"
+  resolved "https://registry.yarnpkg.com/@types/scheduler/-/scheduler-0.16.3.tgz#cef09e3ec9af1d63d2a6cc5b383a737e24e6dcf5"
+  integrity sha512-5cJ8CB4yAx7BH1oMvdU0Jh9lrEXyPkar6F9G/ERswkCuvP4KQZfZkSjcMbAICCpQTN4OuZn8tz0HiKv9TGZgrQ==
+
 "@types/semver@^7.3.12":
   version "7.3.13"
   resolved "https://registry.yarnpkg.com/@types/semver/-/semver-7.3.13.tgz#da4bfd73f49bd541d28920ab0e2bf0ee80f71c91"
@@ -886,7 +904,7 @@ cssesc@^3.0.0:
   resolved "https://registry.yarnpkg.com/cssesc/-/cssesc-3.0.0.tgz#37741919903b868565e1c09ea747445cd18983ee"
   integrity sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==
 
-csstype@^3.1.0:
+csstype@^3.0.2:
   version "3.1.2"
   resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.1.2.tgz#1d4bf9d572f11c14031f0436e1c10bc1f571f50b"
   integrity sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==

packages/react/src/layouts/Basic/index.tsx

@@ -35,6 +35,7 @@ export const ContentContainer = React.forwardRef<HTMLDivElement, ContentContaine
   const args: LayoutArgs = {
     span,
     mainSidebarOpen: false,
+		auxiliaryItemsShown: false,
   };
 
   return (

packages/react/src/widgets/LeftSidebarBase/index.tsx

@@ -14,6 +14,7 @@ export const LeftSidebarBase = React.forwardRef<HTMLDivElement, LeftSidebarBaseP
   const args: LayoutArgs = {
     span,
     mainSidebarOpen: open,
+		auxiliaryItemsShown: false,
   };
 
   return (

packages/react/src/widgets/LeftSidebarWithMenuBase/index.tsx

@@ -38,6 +38,7 @@ export const LeftSidebarWithMenuBase = React.forwardRef<HTMLDivElement, LeftSide
   const args: LayoutArgs = {
     span,
     mainSidebarOpen: open,
+		auxiliaryItemsShown: moreItemsOpen,
   };
 
   const primarySidebarMenuItems = sidebarMenuItems.filter(s => !s.secondary)
@@ -88,10 +89,7 @@ export const LeftSidebarWithMenuBase = React.forwardRef<HTMLDivElement, LeftSide
               ))}
             </div>
             <div
-              className={layouts.LeftSidebarWithMenu.MoreItems({
-                span,
-                mainSidebarOpen: moreItemsOpen,
-              })}
+              className={layouts.LeftSidebarWithMenu.MoreItems(args)}
             >
               <div
                 className={layouts.LeftSidebarWithMenu.MoreItemsScroll()}

packages/react/src/widgets/TopBar/index.tsx

@@ -19,6 +19,7 @@ export const TopBar = React.forwardRef<HTMLDivElement, TopBarProps>(({
 	const args: LayoutArgs = {
 		span,
 		mainSidebarOpen: false,
+		auxiliaryItemsShown: false,
 	};
 
 	return (