Storybook fixes

aeagle · aeagle · commit b85ce4902353 · 2020-08-13T21:36:20.000+01:00
diff --git a/.babelrc b/.babelrc
diff --git a/.storybook/main.js b/.storybook/main.js
@@ -1,8 +1,8 @@
 const path = require("path");
 
 module.exports = {
-	stories: ["../src/**/*.stories.(mdx|tsx)"],
-	addons: ["@storybook/preset-typescript", "@storybook/addon-actions", "@storybook/addon-links", "@storybook/addon-docs/preset"],
+	stories: ["./../**/*.stories.@(mdx|tsx)"],
+	addons: ["@storybook/addon-actions", "@storybook/addon-links", "@storybook/addon-docs/preset"],
 	webpackFinal: async (config, { configType }) => {
 		if (process.env.NODE === "production") {
 			config.output.publicPath = "/react-spaces/docs";
diff --git a/@types/global.d.ts b/@types/global.d.ts
@@ -3,7 +3,7 @@ export {};
 declare global {
 	namespace jest {
 		interface Expect {
-			<T = any>(actual: T, message: String): Matchers<T>;
+			<T = any, R = any>(actual: T, message: String): Matchers<T, R>;
 		}
 	}
 }
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -31,14 +31,12 @@
 	},
 	"devDependencies": {
 		"@babel/core": "^7.5.5",
-		"@babel/preset-react": "^7.8.3",
-		"@storybook/addon-actions": "^5.3.14",
-		"@storybook/addon-docs": "^5.3.14",
-		"@storybook/addon-knobs": "^5.3.14",
-		"@storybook/addon-links": "^5.3.14",
-		"@storybook/addons": "^5.3.14",
-		"@storybook/preset-typescript": "^2.1.0",
-		"@storybook/react": "^5.3.14",
+		"@storybook/addon-actions": "^6.0.5",
+		"@storybook/addon-docs": "^6.0.5",
+		"@storybook/addon-knobs": "^6.0.5",
+		"@storybook/addon-links": "^6.0.5",
+		"@storybook/addons": "^6.0.5",
+		"@storybook/react": "^6.0.5",
 		"@testing-library/jest-dom": "^5.5.0",
 		"@testing-library/react": "^10.0.3",
 		"@types/jest": "^24.0.15",
@@ -53,7 +51,7 @@
 		"cssstyle": "^2.3.0",
 		"jest": "^25.4.0",
 		"jest-expect-message": "^1.0.2",
-		"node-sass": "^4.13.1",
+		"node-sass": "^4.14.1",
 		"prettier": "^1.19.1",
 		"react": "^16.13.1",
 		"react-docgen-typescript-loader": "^3.7.0",
diff --git a/src/components/stories/00-docs/00-Intro.stories.mdx b/src/components/stories/00-docs/00-Intro.stories.mdx
@@ -3,7 +3,7 @@ import { CommonHeader } from "../Utils";
 
 <CommonHeader />
 
-<Meta title="React Spaces|Introduction" />
+<Meta title="React Spaces/Introduction" />
 
 ## Introduction
 
diff --git a/src/components/stories/00-docs/01-GettingStarted.stories.mdx b/src/components/stories/00-docs/01-GettingStarted.stories.mdx
@@ -4,7 +4,7 @@ import { CenterType, ViewPort, Fixed, Top, Right, LeftResizable, BottomResizable
 
 <CommonHeader />
 
-<Meta title="React Spaces|Getting started" />
+<Meta title="React Spaces/Getting started" />
 
 ## Getting started
 
diff --git a/src/components/stories/00-docs/02-UsefulProperties.stories.mdx b/src/components/stories/00-docs/02-UsefulProperties.stories.mdx
@@ -3,7 +3,7 @@ import { CommonHeader, PropsTable, StandardProps } from "../Utils";
 
 <CommonHeader />
 
-<Meta title="React Spaces|Useful properties" />
+<Meta title="React Spaces/Useful properties" />
 
 ## Useful properties
 
diff --git a/src/components/stories/00-docs/03-UsefulEvents.stories.mdx b/src/components/stories/00-docs/03-UsefulEvents.stories.mdx
@@ -3,7 +3,7 @@ import { CommonHeader } from "../Utils";
 
 <CommonHeader />
 
-<Meta title="React Spaces|Useful events" />
+<Meta title="React Spaces/Useful events" />
 
 ## Useful events
 
diff --git a/src/components/stories/00-docs/04-ChangeHistory.stories.mdx b/src/components/stories/00-docs/04-ChangeHistory.stories.mdx
@@ -3,7 +3,7 @@ import { CommonHeader } from "../Utils";
 
 <CommonHeader />
 
-<Meta title="React Spaces|Change history" />
+<Meta title="React Spaces/Change history" />
 
 ## Change history
 
diff --git a/src/components/stories/01-examples/00-Anchored.stories.mdx b/src/components/stories/01-examples/00-Anchored.stories.mdx
@@ -6,7 +6,7 @@ import { CommonHeader } from "../Utils";
 
 <CommonHeader />
 
-<Meta title="Basic examples|Anchored" />
+<Meta title="Basic examples/Anchored" />
 
 ## Anchored spaces
 
diff --git a/src/components/stories/01-examples/01-Nested.stories.mdx b/src/components/stories/01-examples/01-Nested.stories.mdx
@@ -6,7 +6,7 @@ import { CommonHeader } from "../Utils";
 
 <CommonHeader />
 
-<Meta title="Basic examples|Nested" />
+<Meta title="Basic examples/Nested" />
 
 ## Nested spaces
 
diff --git a/src/components/stories/01-examples/02-Stacked.stories.mdx b/src/components/stories/01-examples/02-Stacked.stories.mdx
@@ -6,7 +6,7 @@ import { CommonHeader } from "../Utils";
 
 <CommonHeader />
 
-<Meta title="Basic examples|Stacked" />
+<Meta title="Basic examples/Stacked" />
 
 ## Stacked
 
diff --git a/src/components/stories/01-examples/03-ControllerSize.stories.mdx b/src/components/stories/01-examples/03-ControllerSize.stories.mdx
@@ -7,7 +7,7 @@ import { CommonHeader } from "../Utils";
 
 <CommonHeader />
 
-<Meta title="Basic examples|Resize events" />
+<Meta title="Basic examples/Resize events" />
 
 ## Resizable space with state controlled size
 
diff --git a/src/components/stories/02-components/Bottom.stories.mdx b/src/components/stories/02-components/Bottom.stories.mdx
@@ -6,7 +6,7 @@ import { CommonHeader, PropsTable, StandardProps, AnchoredProps } from "../Utils
 
 <CommonHeader />
 
-<Meta title="Components|Bottom" component={Bottom} />
+<Meta title="Components/Bottom" component={Bottom} />
 
 ## Bottom
 
diff --git a/src/components/stories/02-components/BottomResizable.stories.mdx b/src/components/stories/02-components/BottomResizable.stories.mdx
@@ -7,7 +7,7 @@ import { CommonHeader, PropsTable, StandardProps, AnchoredProps, ResizableProps
 
 <CommonHeader />
 
-<Meta title="Components|BottomResizable" component={BottomResizable} />
+<Meta title="Components/BottomResizable" component={BottomResizable} />
 
 ## BottomResizable
 
diff --git a/src/components/stories/02-components/Centered.stories.mdx b/src/components/stories/02-components/Centered.stories.mdx
@@ -6,7 +6,7 @@ import { CommonHeader } from "../Utils";
 
 <CommonHeader />
 
-<Meta title="Components|Centered" component={Centered} />
+<Meta title="Components/Centered" component={Centered} />
 
 ## Centered
 
diff --git a/src/components/stories/02-components/CenteredVertically.stories.mdx b/src/components/stories/02-components/CenteredVertically.stories.mdx
@@ -6,7 +6,7 @@ import { CommonHeader } from "../Utils";
 
 <CommonHeader />
 
-<Meta title="Components|CenteredVertically" component={CenteredVertically} />
+<Meta title="Components/CenteredVertically" component={CenteredVertically} />
 
 ## CenteredVertically
 
diff --git a/src/components/stories/02-components/Custom.stories.mdx b/src/components/stories/02-components/Custom.stories.mdx
@@ -6,7 +6,7 @@ import { CommonHeader, PropsTable, PropsHeader, Prop, StandardProps } from "../U
 
 <CommonHeader />
 
-<Meta title="Components|Custom" component={Custom} />
+<Meta title="Components/Custom" component={Custom} />
 
 ## Custom
 
diff --git a/src/components/stories/02-components/Experimental.stories.mdx b/src/components/stories/02-components/Experimental.stories.mdx
@@ -1,7 +1,7 @@
 import { Meta, Story, Preview, Props } from "@storybook/addon-docs/blocks";
 import { DemoExperimental } from "../Utils";
 
-<Meta title="Experimental|Store" />
+<Meta title="Experimental/Store" />
 
 <Preview>
 	<Story name="Experimental spaces using global store">
diff --git a/src/components/stories/02-components/Fill.stories.mdx b/src/components/stories/02-components/Fill.stories.mdx
@@ -6,7 +6,7 @@ import { CommonHeader, PropsTable, StandardProps } from "../Utils";
 
 <CommonHeader />
 
-<Meta title="Components|Fill" component={Fill} />
+<Meta title="Components/Fill" component={Fill} />
 
 ## Fill
 
diff --git a/src/components/stories/02-components/Fixed.stories.mdx b/src/components/stories/02-components/Fixed.stories.mdx
@@ -6,7 +6,7 @@ import { CommonHeader, PropsTable, PropsHeader, Prop } from "../Utils";
 
 <CommonHeader />
 
-<Meta title="Components|Fixed" component={Fixed} />
+<Meta title="Components/Fixed" component={Fixed} />
 
 ## Fixed
 
diff --git a/src/components/stories/02-components/Layer.stories.mdx b/src/components/stories/02-components/Layer.stories.mdx
@@ -6,7 +6,7 @@ import { CommonHeader, description, PropsTable, Prop } from "../Utils";
 
 <CommonHeader />
 
-<Meta title="Components|Layer" component={Layer} />
+<Meta title="Components/Layer" component={Layer} />
 
 ## Layer
 
diff --git a/src/components/stories/02-components/Left.stories.mdx b/src/components/stories/02-components/Left.stories.mdx
@@ -6,7 +6,7 @@ import { CommonHeader, PropsTable, StandardProps, AnchoredProps } from "../Utils
 
 <CommonHeader />
 
-<Meta title="Components|Left" component={Left} />
+<Meta title="Components/Left" component={Left} />
 
 ## Left
 
diff --git a/src/components/stories/02-components/LeftResizable.stories.mdx b/src/components/stories/02-components/LeftResizable.stories.mdx
@@ -7,7 +7,7 @@ import { CommonHeader, PropsTable, StandardProps, AnchoredProps, ResizableProps
 
 <CommonHeader />
 
-<Meta title="Components|LeftResizable" component={LeftResizable} />
+<Meta title="Components/LeftResizable" component={LeftResizable} />
 
 ## LeftResizable
 
diff --git a/src/components/stories/02-components/Positioned.stories.mdx b/src/components/stories/02-components/Positioned.stories.mdx
@@ -7,7 +7,7 @@ import { CommonHeader, PropsTable, PropsHeader, Prop, StandardProps } from "../U
 
 <CommonHeader />
 
-<Meta title="Components|Positioned" component={Positioned} />
+<Meta title="Components/Positioned" component={Positioned} />
 
 ## Positioned
 
diff --git a/src/components/stories/02-components/Right.stories.mdx b/src/components/stories/02-components/Right.stories.mdx
@@ -6,7 +6,7 @@ import { CommonHeader, PropsTable, StandardProps, AnchoredProps } from "../Utils
 
 <CommonHeader />
 
-<Meta title="Components|Right" component={Right} />
+<Meta title="Components/Right" component={Right} />
 
 ## Right
 
diff --git a/src/components/stories/02-components/RightResizable.stories.mdx b/src/components/stories/02-components/RightResizable.stories.mdx
@@ -7,7 +7,7 @@ import { CommonHeader, PropsTable, StandardProps, AnchoredProps, ResizableProps
 
 <CommonHeader />
 
-<Meta title="Components|RightResizable" component={RightResizable} />
+<Meta title="Components/RightResizable" component={RightResizable} />
 
 ## RightResizable
 
diff --git a/src/components/stories/02-components/Top.stories.mdx b/src/components/stories/02-components/Top.stories.mdx
@@ -6,7 +6,7 @@ import { CommonHeader, PropsTable, StandardProps, AnchoredProps } from "../Utils
 
 <CommonHeader />
 
-<Meta title="Components|Top" component={Top} />
+<Meta title="Components/Top" component={Top} />
 
 ## Top
 
diff --git a/src/components/stories/02-components/TopResizable.stories.mdx b/src/components/stories/02-components/TopResizable.stories.mdx
@@ -7,7 +7,7 @@ import { CommonHeader, PropsTable, StandardProps, AnchoredProps, ResizableProps
 
 <CommonHeader />
 
-<Meta title="Components|TopResizable" component={TopResizable} />
+<Meta title="Components/TopResizable" component={TopResizable} />
 
 ## TopResizable
 
diff --git a/src/components/stories/02-components/ViewPort.stories.mdx b/src/components/stories/02-components/ViewPort.stories.mdx
@@ -6,7 +6,7 @@ import { CommonHeader, PropsTable, PropsHeader, Prop } from "../Utils";
 
 <CommonHeader />
 
-<Meta title="Components|ViewPort" component={ViewPort} />
+<Meta title="Components/ViewPort" component={ViewPort} />
 
 ## ViewPort
 
diff --git a/src/core-resizing.ts b/src/core-resizing.ts
@@ -2,7 +2,7 @@ import { SyntheticEvent } from "react";
 import { ISpaceDefinition, ISize, ResizeType, Orientation, ISpaceStore } from "./core-types";
 import { throttle, coalesce } from "./core-utils";
 
-const RESIZE_THROTTLE = 5;
+const RESIZE_THROTTLE = 0;
 
 export enum MoveEvent {
 	Mouse = "mousemove",
@@ -99,7 +99,7 @@ export function createResize(store: ISpaceStore) {
 				lastY = newCoords.y;
 				e.preventDefault();
 
-				throttle(resize, RESIZE_THROTTLE)(lastX, lastY);
+				throttle((x, y) => window.requestAnimationFrame(() => resize(x, y)), RESIZE_THROTTLE)(lastX, lastY);
 			};
 
 			const removeListener = () => {

Original file line number	Diff line number	Diff line change
`@@ -3,7 +3,7 @@ export {};`
`3`	`3`	`declare global {`
`4`	`4`	`namespace jest {`
`5`	`5`	`interface Expect {`
`6`		`- <T = any>(actual: T, message: String): Matchers<T>;`
	`6`	`+ <T = any, R = any>(actual: T, message: String): Matchers<T, R>;`
`7`	`7`	`}`
`8`	`8`	`}`
`9`	`9`	`}`