Added onResizeStart and onResizeEnd storybook actions on resizable spaces

Author: aeagle

src/components/stories/02-components/BottomResizable.stories.mdx

@@ -30,7 +30,7 @@ Anchored resizable space on the bottom edge of it's parent.
 <Preview>
 	<Story name="Default (px)">
 		<ViewPort>
-			<BottomResizable style={green} size={300} trackSize={true}>
+			<BottomResizable style={green} size={300} trackSize={true} onResizeStart={action('onResizeStart')} onResizeEnd={action('onResizeEnd')}>
 				{description("Bottom resizable")}
 			</BottomResizable>
 		</ViewPort>
@@ -42,7 +42,7 @@ Anchored resizable space on the bottom edge of it's parent.
 <Preview>
 	<Story name="With resize constraints">
 		<ViewPort>
-			<BottomResizable style={green} size={300} trackSize={true} minimumSize={150} maximumSize={450}>
+			<BottomResizable style={green} size={300} trackSize={true} minimumSize={150} maximumSize={450} onResizeStart={action('onResizeStart')} onResizeEnd={action('onResizeEnd')}>
 				{description("Bottom resizable")}
 			</BottomResizable>
 		</ViewPort>
@@ -54,7 +54,7 @@ Anchored resizable space on the bottom edge of it's parent.
 <Preview>
 	<Story name="Scrollable">
 		<ViewPort>
-			<BottomResizable style={green} size={300} scrollable={true}>
+			<BottomResizable style={green} size={300} scrollable={true} onResizeStart={action('onResizeStart')} onResizeEnd={action('onResizeEnd')}>
 				{lorem}
 			</BottomResizable>
 		</ViewPort>

src/components/stories/02-components/LeftResizable.stories.mdx

@@ -30,7 +30,7 @@ Anchored resizable space on the left edge of it's parent.
 <Preview>
 	<Story name="Default (px)">
 		<ViewPort>
-			<LeftResizable style={green} size={300} trackSize={true}>
+			<LeftResizable style={green} size={300} trackSize={true} onResizeStart={action('onResizeStart')} onResizeEnd={action('onResizeEnd')}>
 				{description("Left resizable")}
 			</LeftResizable>
 		</ViewPort>
@@ -42,7 +42,7 @@ Anchored resizable space on the left edge of it's parent.
 <Preview>
 	<Story name="With resize constraints">
 		<ViewPort>
-			<LeftResizable style={green} size={300} trackSize={true} minimumSize={150} maximumSize={450}>
+			<LeftResizable style={green} size={300} trackSize={true} minimumSize={150} maximumSize={450} onResizeStart={action('onResizeStart')} onResizeEnd={action('onResizeEnd')}>
 				{description("Left resizable")}
 			</LeftResizable>
 		</ViewPort>
@@ -54,7 +54,7 @@ Anchored resizable space on the left edge of it's parent.
 <Preview>
 	<Story name="Scrollable">
 		<ViewPort>
-			<LeftResizable style={green} size={300} scrollable={true}>
+			<LeftResizable style={green} size={300} scrollable={true} onResizeStart={action('onResizeStart')} onResizeEnd={action('onResizeEnd')}>
 				{lorem}
 			</LeftResizable>
 		</ViewPort>

src/components/stories/02-components/RightResizable.stories.mdx

@@ -30,7 +30,7 @@ Anchored resizable space on the right edge of it's parent.
 <Preview>
 	<Story name="Default (px)">
 		<ViewPort>
-			<RightResizable style={green} size={300} trackSize={true}>
+			<RightResizable style={green} size={300} trackSize={true} onResizeStart={action('onResizeStart')} onResizeEnd={action('onResizeEnd')}>
 				{description("Right resizable")}
 			</RightResizable>
 		</ViewPort>
@@ -42,7 +42,7 @@ Anchored resizable space on the right edge of it's parent.
 <Preview>
 	<Story name="With resize constraints">
 		<ViewPort>
-			<RightResizable style={green} size={300} trackSize={true} minimumSize={150} maximumSize={450}>
+			<RightResizable style={green} size={300} trackSize={true} minimumSize={150} maximumSize={450} onResizeStart={action('onResizeStart')} onResizeEnd={action('onResizeEnd')}>
 				{description("Right resizable")}
 			</RightResizable>
 		</ViewPort>
@@ -54,7 +54,7 @@ Anchored resizable space on the right edge of it's parent.
 <Preview>
 	<Story name="Scrollable">
 		<ViewPort>
-			<RightResizable style={green} size={300} scrollable={true}>
+			<RightResizable style={green} size={300} scrollable={true} onResizeStart={action('onResizeStart')} onResizeEnd={action('onResizeEnd')}>
 				{lorem}
 			</RightResizable>
 		</ViewPort>

src/components/stories/02-components/TopResizable.stories.mdx

@@ -30,7 +30,7 @@ Anchored resizable space on the top edge of it's parent.
 <Preview>
 	<Story name="Default (px)">
 		<ViewPort>
-			<TopResizable style={green} size={300} trackSize={true}>
+			<TopResizable style={green} size={300} trackSize={true} onResizeStart={action('onResizeStart')} onResizeEnd={action('onResizeEnd')}>
 				{description("Top resizable")}
 			</TopResizable>
 		</ViewPort>
@@ -42,7 +42,7 @@ Anchored resizable space on the top edge of it's parent.
 <Preview>
 	<Story name="With resize constraints">
 		<ViewPort>
-			<TopResizable style={green} size={300} trackSize={true} minimumSize={150} maximumSize={450}>
+			<TopResizable style={green} size={300} trackSize={true} minimumSize={150} maximumSize={450} onResizeStart={action('onResizeStart')} onResizeEnd={action('onResizeEnd')}>
 				{description("Top resizable")}
 			</TopResizable>
 		</ViewPort>
@@ -54,7 +54,7 @@ Anchored resizable space on the top edge of it's parent.
 <Preview>
 	<Story name="Scrollable">
 		<ViewPort>
-			<TopResizable style={green} size={300} scrollable={true}>
+			<TopResizable style={green} size={300} scrollable={true} onResizeStart={action('onResizeStart')} onResizeEnd={action('onResizeEnd')}>
 				{lorem}
 			</TopResizable>
 		</ViewPort>