diff --git a/CHANGELOG.md b/CHANGELOG.md
index c0697b7d45..e27fca9b38 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -45,6 +45,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
    -  PR [#2544](https://github.com/microsoft/BotFramework-WebChat/pull/2544): `useAvatarForBot`, `useAvatarForUser`
    -  PR [#2547](https://github.com/microsoft/BotFramework-WebChat/pull/2547): `useEmitTypingIndicator`, `usePeformCardAction`, `usePostActivity`, `useSendEvent`, `useSendFiles`, `useSendMessage`, `useSendMessageBack`, `useSendPostBack`
    -  PR [#2548](https://github.com/microsoft/BotFramework-WebChat/pull/2548): `useDisabled`
+   -  PR [#2552](https://github.com/microsoft/BotFramework-WebChat/pull/2552): `useFocusSendBox`, `useScrollToEnd`, `useSendBoxValue`, `useSubmitSendBox`, `useTextBoxSubmit`, `useTextBoxValue`
 -  Fixes [#2597](https://github.com/microsoft/BotFramework-WebChat/issues/2597). Modify `watch` script to `start` and add `tableflip` script for throwing `node_modules`, by [@corinagum](https://github.com/corinagum) in PR [#2598](https://github.com/microsoft/BotFramework-WebChat/pull/2598)
 
 ### Fixed
diff --git a/__tests__/__image_snapshots__/chrome-docker/use-scroll-to-end-js-calling-scroll-to-end-should-scroll-to-end-1-snap.png b/__tests__/__image_snapshots__/chrome-docker/use-scroll-to-end-js-calling-scroll-to-end-should-scroll-to-end-1-snap.png
new file mode 100644
index 0000000000..590e734502
Binary files /dev/null and b/__tests__/__image_snapshots__/chrome-docker/use-scroll-to-end-js-calling-scroll-to-end-should-scroll-to-end-1-snap.png differ
diff --git a/__tests__/__image_snapshots__/chrome-docker/use-scroll-to-end-js-calling-scroll-to-end-should-scroll-to-end-2-snap.png b/__tests__/__image_snapshots__/chrome-docker/use-scroll-to-end-js-calling-scroll-to-end-should-scroll-to-end-2-snap.png
new file mode 100644
index 0000000000..1fa1739fd7
Binary files /dev/null and b/__tests__/__image_snapshots__/chrome-docker/use-scroll-to-end-js-calling-scroll-to-end-should-scroll-to-end-2-snap.png differ
diff --git a/__tests__/__image_snapshots__/chrome-docker/use-submit-send-box-js-calling-submit-send-box-should-send-the-message-in-send-box-1-snap.png b/__tests__/__image_snapshots__/chrome-docker/use-submit-send-box-js-calling-submit-send-box-should-send-the-message-in-send-box-1-snap.png
new file mode 100644
index 0000000000..0461587e99
Binary files /dev/null and b/__tests__/__image_snapshots__/chrome-docker/use-submit-send-box-js-calling-submit-send-box-should-send-the-message-in-send-box-1-snap.png differ
diff --git a/__tests__/hooks/useFocusSendBox.js b/__tests__/hooks/useFocusSendBox.js
new file mode 100644
index 0000000000..3f3eb32317
--- /dev/null
+++ b/__tests__/hooks/useFocusSendBox.js
@@ -0,0 +1,19 @@
+import { timeouts } from '../constants.json';
+
+import sendBoxTextBoxFocused from '../setup/conditions/sendBoxTextBoxFocused';
+import uiConnected from '../setup/conditions/uiConnected';
+
+// selenium-webdriver API doc:
+// https://seleniumhq.github.io/selenium/docs/api/javascript/module/selenium-webdriver/index_exports_WebDriver.html
+
+jest.setTimeout(timeouts.test);
+
+test('calling emitTypingIndicator should send a typing activity', async () => {
+  const { driver, pageObjects } = await setupWebDriver();
+
+  await driver.wait(uiConnected(), timeouts.directLine);
+
+  await pageObjects.runHook('useFocusSendBox', [], fn => fn());
+
+  await driver.wait(sendBoxTextBoxFocused(), timeouts.ui);
+});
diff --git a/__tests__/hooks/useScrollToEnd.js b/__tests__/hooks/useScrollToEnd.js
new file mode 100644
index 0000000000..0fd74f2a4c
--- /dev/null
+++ b/__tests__/hooks/useScrollToEnd.js
@@ -0,0 +1,34 @@
+import { imageSnapshotOptions, timeouts } from '../constants.json';
+
+import minNumActivitiesShown from '../setup/conditions/minNumActivitiesShown';
+import scrollToBottomButtonVisible from '../setup/conditions/scrollToBottomButtonVisible';
+import scrollToBottomCompleted from '../setup/conditions/scrollToBottomCompleted';
+import uiConnected from '../setup/conditions/uiConnected';
+
+// selenium-webdriver API doc:
+// https://seleniumhq.github.io/selenium/docs/api/javascript/module/selenium-webdriver/index_exports_WebDriver.html
+
+jest.setTimeout(timeouts.test);
+
+test('calling scrollToEnd should scroll to end', async () => {
+  const { driver, pageObjects } = await setupWebDriver();
+
+  await driver.wait(uiConnected(), timeouts.directLine);
+
+  await pageObjects.sendMessageViaSendBox('help');
+  await driver.wait(minNumActivitiesShown(2), timeouts.directLine);
+  await driver.wait(scrollToBottomCompleted(), timeouts.scrollToBottom);
+
+  await driver.executeScript(() => {
+    document.querySelector('[role="log"] > *').scrollTop = 0;
+  });
+
+  await driver.wait(scrollToBottomButtonVisible(), timeouts.ui);
+
+  expect(await driver.takeScreenshot()).toMatchImageSnapshot(imageSnapshotOptions);
+
+  await pageObjects.runHook('useScrollToEnd', [], scrollToEnd => scrollToEnd());
+  await driver.wait(scrollToBottomCompleted(), timeouts.scrollToBottom);
+
+  expect(await driver.takeScreenshot()).toMatchImageSnapshot(imageSnapshotOptions);
+});
diff --git a/__tests__/hooks/useSendBoxValue.js b/__tests__/hooks/useSendBoxValue.js
new file mode 100644
index 0000000000..0ab161c23f
--- /dev/null
+++ b/__tests__/hooks/useSendBoxValue.js
@@ -0,0 +1,26 @@
+import { timeouts } from '../constants.json';
+
+import uiConnected from '../setup/conditions/uiConnected';
+
+// selenium-webdriver API doc:
+// https://seleniumhq.github.io/selenium/docs/api/javascript/module/selenium-webdriver/index_exports_WebDriver.html
+
+jest.setTimeout(timeouts.test);
+
+test('getter should get the send box text', async () => {
+  const { driver, pageObjects } = await setupWebDriver();
+
+  await driver.wait(uiConnected(), timeouts.directLine);
+
+  await pageObjects.typeOnSendBox('Hello, World!');
+  await expect(pageObjects.runHook('useSendBoxValue', [], result => result[0])).resolves.toBe('Hello, World!');
+});
+
+test('setter should set the send box text', async () => {
+  const { driver, pageObjects } = await setupWebDriver();
+
+  await driver.wait(uiConnected(), timeouts.directLine);
+
+  await pageObjects.runHook('useSendBoxValue', [], result => result[1]('Hello, World!'));
+  await expect(pageObjects.getSendBoxText()).resolves.toBe('Hello, World!');
+});
diff --git a/__tests__/hooks/useSubmitSendBox.js b/__tests__/hooks/useSubmitSendBox.js
new file mode 100644
index 0000000000..d6a8255c28
--- /dev/null
+++ b/__tests__/hooks/useSubmitSendBox.js
@@ -0,0 +1,24 @@
+import { imageSnapshotOptions, timeouts } from '../constants.json';
+
+import minNumActivitiesShown from '../setup/conditions/minNumActivitiesShown';
+import uiConnected from '../setup/conditions/uiConnected';
+
+// selenium-webdriver API doc:
+// https://seleniumhq.github.io/selenium/docs/api/javascript/module/selenium-webdriver/index_exports_WebDriver.html
+
+jest.setTimeout(timeouts.test);
+
+test('calling submitSendBox should send the message in send box', async () => {
+  const { driver, pageObjects } = await setupWebDriver();
+
+  await driver.wait(uiConnected(), timeouts.directLine);
+
+  await pageObjects.typeOnSendBox('Hello, World!');
+  await pageObjects.runHook('useSubmitSendBox', [], submitSendBox => submitSendBox());
+
+  await driver.wait(minNumActivitiesShown(2), timeouts.directLine);
+
+  const base64PNG = await driver.takeScreenshot();
+
+  expect(base64PNG).toMatchImageSnapshot(imageSnapshotOptions);
+});
diff --git a/__tests__/hooks/useTextBox.js b/__tests__/hooks/useTextBox.js
new file mode 100644
index 0000000000..2873052478
--- /dev/null
+++ b/__tests__/hooks/useTextBox.js
@@ -0,0 +1,29 @@
+import { imageSnapshotOptions, timeouts } from '../constants.json';
+
+import minNumActivitiesShown from '../setup/conditions/minNumActivitiesShown';
+import scrollToBottomCompleted from '../setup/conditions/scrollToBottomCompleted';
+import uiConnected from '../setup/conditions/uiConnected';
+
+// selenium-webdriver API doc:
+// https://seleniumhq.github.io/selenium/docs/api/javascript/module/selenium-webdriver/index_exports_WebDriver.html
+
+jest.setTimeout(timeouts.test);
+
+// TODO: [P1] Test is temporarily disable until fully implemented
+test('calling submit should scroll to end', async () => {
+  // const { driver, pageObjects } = await setupWebDriver();
+  // await driver.wait(uiConnected(), timeouts.directLine);
+  // await pageObjects.typeOnSendBox('help');
+  // await expect(pageObjects.runHook('useTextBoxValue', [], textBoxValue => textBoxValue[0])).resolves.toBe('help');
+  // await pageObjects.clickSendButton();
+  // await driver.wait(minNumActivitiesShown(2), timeouts.directLine);
+  // await driver.wait(scrollToBottomCompleted(), timeouts.scrollToBottom);
+  // await driver.executeScript(() => {
+  //   document.querySelector('[role="log"] > *').scrollTop = 0;
+  // });
+  // expect(await driver.takeScreenshot()).toMatchImageSnapshot(imageSnapshotOptions);
+  // await pageObjects.runHook('useTextBoxValue', [], textBoxValue => textBoxValue[1]('Hello, World!'));
+  // await pageObjects.runHook('useTextBoxSubmit', [], textBoxSubmit => textBoxSubmit());
+  // await driver.wait(scrollToBottomCompleted(), timeouts.scrollToBottom);
+  // expect(await driver.takeScreenshot()).toMatchImageSnapshot(imageSnapshotOptions);
+});
diff --git a/packages/component/src/Activity/ScrollToEndButton.js b/packages/component/src/Activity/ScrollToEndButton.js
index c1130eab69..ce85b40d7d 100644
--- a/packages/component/src/Activity/ScrollToEndButton.js
+++ b/packages/component/src/Activity/ScrollToEndButton.js
@@ -4,12 +4,13 @@ import classNames from 'classnames';
 import PropTypes from 'prop-types';
 import React from 'react';
 
-import connectToWebChat from '../connectToWebChat';
 import Localize from '../Localization/Localize';
+import useScrollToEnd from '../hooks/useScrollToEnd';
 import useStyleSet from '../hooks/useStyleSet';
 
-const ScrollToEndButton = ({ className, scrollToEnd }) => {
+const ScrollToEndButton = ({ className }) => {
   const [{ scrollToEndButton: scrollToEndButtonStyleSet }] = useStyleSet();
+  const scrollToEnd = useScrollToEnd();
 
   return (
     <button className={classNames(scrollToEndButtonStyleSet + '', className + '')} onClick={scrollToEnd} type="button">
@@ -24,17 +25,14 @@ ScrollToEndButton.defaultProps = {
 
 ScrollToEndButton.propTypes = {
   className: PropTypes.string,
-  scrollToEnd: PropTypes.func.isRequired,
   styleSet: PropTypes.shape({
     scrollToEndButton: PropTypes.any.isRequired
   }).isRequired
 };
 
-const WebChatConnectedScrollToEndButton = connectToWebChat(({ scrollToEnd }) => ({ scrollToEnd }))(ScrollToEndButton);
-
 const ConnectedScrollToEndButton = props => (
   <ScrollToBottomStateContext.Consumer>
-    {({ sticky }) => !sticky && <WebChatConnectedScrollToEndButton {...props} />}
+    {({ sticky }) => !sticky && <ScrollToEndButton {...props} />}
   </ScrollToBottomStateContext.Consumer>
 );
 
diff --git a/packages/component/src/Activity/SendStatus.js b/packages/component/src/Activity/SendStatus.js
index bc35cfba43..77599a9b87 100644
--- a/packages/component/src/Activity/SendStatus.js
+++ b/packages/component/src/Activity/SendStatus.js
@@ -4,6 +4,7 @@ import React, { useCallback } from 'react';
 
 import connectToWebChat from '../connectToWebChat';
 import ScreenReaderText from '../ScreenReaderText';
+import useFocusSendBox from '../hooks/useFocusSendBox';
 import useLocalize from '../hooks/useLocalize';
 import usePostActivity from '../hooks/usePostActivity';
 import useStyleSet from '../hooks/useStyleSet';
@@ -29,8 +30,9 @@ const connectSendStatus = (...selectors) =>
     ...selectors
   );
 
-const SendStatus = ({ activity, focusSendBox }) => {
+const SendStatus = ({ activity }) => {
   const [{ sendStatus: sendStatusStyleSet }] = useStyleSet();
+  const focusSendBox = useFocusSendBox();
   const postActivity = usePostActivity();
 
   // TODO: [P4] Currently, this is the only place which use a templated string
@@ -91,10 +93,9 @@ SendStatus.propTypes = {
     channelData: PropTypes.shape({
       state: PropTypes.string
     })
-  }).isRequired,
-  focusSendBox: PropTypes.func.isRequired
+  }).isRequired
 };
 
-export default connectSendStatus(({ focusSendBox }) => ({ focusSendBox }))(SendStatus);
+export default SendStatus;
 
 export { connectSendStatus };
diff --git a/packages/component/src/Dictation.js b/packages/component/src/Dictation.js
index 17d85ae1ef..8621ce9873 100644
--- a/packages/component/src/Dictation.js
+++ b/packages/component/src/Dictation.js
@@ -8,6 +8,8 @@ import connectToWebChat from './connectToWebChat';
 import useActivities from './hooks/useActivities';
 import useDisabled from './hooks/useDisabled';
 import useLanguage from './hooks/useLanguage';
+import useSendBoxValue from './hooks/useSendBoxValue';
+import useSubmitSendBox from './hooks/useSubmitSendBox';
 
 const {
   DictateState: { DICTATING, IDLE, STARTING }
@@ -20,15 +22,15 @@ const Dictation = ({
   sendTypingIndicator,
   setDictateInterims,
   setDictateState,
-  setSendBox,
   startSpeakingActivity,
   stopDictate,
-  submitSendBox,
   webSpeechPonyfill: { SpeechGrammarList, SpeechRecognition } = {}
 }) => {
+  const [, setSendBox] = useSendBoxValue();
   const [activities] = useActivities();
   const [disabled] = useDisabled();
   const [language] = useLanguage();
+  const submitSendBox = useSubmitSendBox();
 
   const numSpeakingActivities = useMemo(() => activities.filter(({ channelData: { speak } = {} }) => speak).length, [
     activities
@@ -96,10 +98,8 @@ Dictation.propTypes = {
   sendTypingIndicator: PropTypes.bool.isRequired,
   setDictateInterims: PropTypes.func.isRequired,
   setDictateState: PropTypes.func.isRequired,
-  setSendBox: PropTypes.func.isRequired,
   startSpeakingActivity: PropTypes.func.isRequired,
   stopDictate: PropTypes.func.isRequired,
-  submitSendBox: PropTypes.func.isRequired,
   webSpeechPonyfill: PropTypes.shape({
     SpeechGrammarList: PropTypes.any.isRequired,
     SpeechRecognition: PropTypes.any.isRequired
@@ -114,10 +114,8 @@ export default connectToWebChat(
     sendTypingIndicator,
     setDictateInterims,
     setDictateState,
-    setSendBox,
     startSpeakingActivity,
     stopDictate,
-    submitSendBox,
     webSpeechPonyfill
   }) => ({
     dictateState,
@@ -126,10 +124,8 @@ export default connectToWebChat(
     sendTypingIndicator,
     setDictateInterims,
     setDictateState,
-    setSendBox,
     startSpeakingActivity,
     stopDictate,
-    submitSendBox,
     webSpeechPonyfill
   })
 )(Dictation);
diff --git a/packages/component/src/SendBox/SendButton.js b/packages/component/src/SendBox/SendButton.js
index b88f381fe1..b9dcb368b5 100644
--- a/packages/component/src/SendBox/SendButton.js
+++ b/packages/component/src/SendBox/SendButton.js
@@ -1,4 +1,3 @@
-import PropTypes from 'prop-types';
 import React from 'react';
 
 import connectToWebChat from '../connectToWebChat';
@@ -6,6 +5,7 @@ import IconButton from './IconButton';
 import SendIcon from './Assets/SendIcon';
 import useDisabled from '../hooks/useDisabled';
 import useLocalize from '../hooks/useLocalize';
+import useSubmitSendBox from '../hooks/useSubmitSendBox';
 
 const connectSendButton = (...selectors) =>
   connectToWebChat(
@@ -17,9 +17,10 @@ const connectSendButton = (...selectors) =>
     ...selectors
   );
 
-const SendButton = ({ submitSendBox }) => {
+const SendButton = () => {
   const [disabled] = useDisabled();
   const altText = useLocalize('Send');
+  const submitSendBox = useSubmitSendBox();
 
   return (
     <IconButton alt={altText} disabled={disabled} onClick={submitSendBox}>
@@ -28,10 +29,6 @@ const SendButton = ({ submitSendBox }) => {
   );
 };
 
-SendButton.propTypes = {
-  submitSendBox: PropTypes.func.isRequired
-};
-
-export default connectSendButton()(SendButton);
+export default SendButton;
 
 export { connectSendButton };
diff --git a/packages/component/src/SendBox/TextBox.js b/packages/component/src/SendBox/TextBox.js
index 00d9fcc21a..307d8730c9 100644
--- a/packages/component/src/SendBox/TextBox.js
+++ b/packages/component/src/SendBox/TextBox.js
@@ -1,14 +1,18 @@
 import { css } from 'glamor';
 import classNames from 'classnames';
 import PropTypes from 'prop-types';
-import React from 'react';
+import React, { useCallback } from 'react';
 
 import { Context as TypeFocusSinkContext } from '../Utils/TypeFocusSink';
 import connectToWebChat from '../connectToWebChat';
 import useDisabled from '../hooks/useDisabled';
+import useFocusSendBox from '../hooks/useFocusSendBox';
 import useLocalize from '../hooks/useLocalize';
+import useScrollToEnd from '../hooks/useScrollToEnd';
+import useSendBoxValue from '../hooks/useSendBoxValue';
 import useStyleOptions from '../hooks/useStyleOptions';
 import useStyleSet from '../hooks/useStyleSet';
+import useSubmitSendBox from '../hooks/useSubmitSendBox';
 
 const ROOT_CSS = css({
   display: 'flex',
@@ -56,17 +60,80 @@ const connectSendTextBox = (...selectors) =>
     ...selectors
   );
 
-const TextBox = ({ className, onChange, onKeyPress, onSubmit, value }) => {
+function useTextBoxSubmit(setFocus) {
+  const [sendBoxValue] = useSendBoxValue();
+  const focusSendBox = useFocusSendBox();
+  const scrollToEnd = useScrollToEnd();
+  const submitSendBox = useSubmitSendBox();
+
+  return useCallback(() => {
+    if (sendBoxValue) {
+      scrollToEnd();
+      submitSendBox();
+      setFocus && focusSendBox();
+    }
+  }, [focusSendBox, scrollToEnd, sendBoxValue, setFocus, submitSendBox]);
+}
+
+// TODO: [P1] Hook is temporarily not exporting until fully implemented
+function useTextBoxValue({ stopDictate }) {
+  const [value, setSendBox] = useSendBoxValue();
+
+  // TODO: [P1] Temporarily using non-hook version
+  // const stopDictate = useStopDictate();
+
+  const setter = useCallback(
+    value => {
+      setSendBox(value);
+      stopDictate();
+    },
+    [setSendBox, stopDictate]
+  );
+
+  return [value, setter];
+}
+
+const TextBox = ({ className, stopDictate }) => {
   const [{ sendBoxTextWrap }] = useStyleOptions();
   const [{ sendBoxTextArea: sendBoxTextAreaStyleSet, sendBoxTextBox: sendBoxTextBoxStyleSet }] = useStyleSet();
   const [disabled] = useDisabled();
+  const [textBoxValue, setTextBoxValue] = useTextBoxValue({ stopDictate });
+
+  const submitTextBox = useTextBoxSubmit();
   const sendBoxString = useLocalize('Sendbox');
   const typeYourMessageString = useLocalize('Type your message');
 
+  const handleChange = useCallback(({ target: { value } }) => setTextBoxValue(value), [setTextBoxValue]);
+
+  const handleKeyPress = useCallback(
+    event => {
+      const { key, shiftKey } = event;
+
+      if (key === 'Enter' && !shiftKey) {
+        event.preventDefault();
+
+        // If text box is submitted, focus on the send box
+        submitTextBox(true);
+      }
+    },
+    [submitTextBox]
+  );
+
+  const handleSubmit = useCallback(
+    event => {
+      event.preventDefault();
+
+      // Consider clearing the send box only after we received POST_ACTIVITY_PENDING
+      // E.g. if the connection is bad, sending the message essentially do nothing but just clearing the send box
+      submitTextBox();
+    },
+    [submitTextBox]
+  );
+
   return (
     <form
       className={classNames(ROOT_CSS + '', sendBoxTextAreaStyleSet + '', sendBoxTextBoxStyleSet + '', className + '')}
-      onSubmit={onSubmit}
+      onSubmit={handleSubmit}
     >
       {
         <TypeFocusSinkContext.Consumer>
@@ -76,11 +143,11 @@ const TextBox = ({ className, onChange, onKeyPress, onSubmit, value }) => {
                 aria-label={sendBoxString}
                 data-id="webchat-sendbox-input"
                 disabled={disabled}
-                onChange={onChange}
+                onChange={handleChange}
                 placeholder={typeYourMessageString}
                 ref={sendFocusRef}
                 type="text"
-                value={value}
+                value={textBoxValue}
               />
             ) : (
               <div>
@@ -88,14 +155,14 @@ const TextBox = ({ className, onChange, onKeyPress, onSubmit, value }) => {
                   aria-label={sendBoxString}
                   data-id="webchat-sendbox-input"
                   disabled={disabled}
-                  onChange={onChange}
-                  onKeyPress={onKeyPress}
+                  onChange={handleChange}
+                  onKeyPress={handleKeyPress}
                   placeholder={typeYourMessageString}
                   ref={sendFocusRef}
                   rows="1"
-                  value={value}
+                  value={textBoxValue}
                 />
-                <div>{value + '\n'}</div>
+                <div>{textBoxValue + '\n'}</div>
               </div>
             )
           }
@@ -106,18 +173,17 @@ const TextBox = ({ className, onChange, onKeyPress, onSubmit, value }) => {
 };
 
 TextBox.defaultProps = {
-  className: '',
-  value: ''
+  className: ''
 };
 
 TextBox.propTypes = {
   className: PropTypes.string,
-  onChange: PropTypes.func.isRequired,
-  onKeyPress: PropTypes.func.isRequired,
-  onSubmit: PropTypes.func.isRequired,
-  value: PropTypes.string
+  stopDictate: PropTypes.func.isRequired
 };
 
-export default connectSendTextBox()(TextBox);
+export default connectToWebChat(({ stopDictate }) => ({ stopDictate }))(TextBox);
+
+// TODO: [P1] Export useTextBoxValue when it is fully implemented
+// export { connectSendTextBox, useTextBoxSubmit, useTextBoxValue };
 
-export { connectSendTextBox };
+export { connectSendTextBox, useTextBoxSubmit };
diff --git a/packages/component/src/hooks/index.js b/packages/component/src/hooks/index.js
index 96f9271c2a..5feec41bf8 100644
--- a/packages/component/src/hooks/index.js
+++ b/packages/component/src/hooks/index.js
@@ -3,22 +3,27 @@ import useAvatarForBot from './useAvatarForBot';
 import useAvatarForUser from './useAvatarForUser';
 import useDisabled from './useDisabled';
 import useEmitTypingIndicator from './useEmitTypingIndicator';
+import useFocusSendBox from './useFocusSendBox';
 import useLanguage from './useLanguage';
 import useLocalize from './useLocalize';
 import useLocalizeDate from './useLocalizeDate';
 import usePerformCardAction from './usePerformCardAction';
 import usePostActivity from './usePostActivity';
 import useReferenceGrammarID from './useReferenceGrammarID';
+import useRenderMarkdownAsHTML from './useRenderMarkdownAsHTML';
+import useScrollToEnd from './useScrollToEnd';
+import useSendBoxValue from './useSendBoxValue';
 import useSendEvent from './useSendEvent';
 import useSendFiles from './useSendFiles';
 import useSendMessage from './useSendMessage';
 import useSendMessageBack from './useSendMessageBack';
 import useSendPostBack from './useSendPostBack';
-import useRenderMarkdownAsHTML from './useRenderMarkdownAsHTML';
 import useStyleOptions from './useStyleOptions';
 import useStyleSet from './useStyleSet';
+import useSubmitSendBox from './useSubmitSendBox';
 
 import { useSendBoxDictationStarted } from '../BasicSendBox';
+import { useTextBoxSubmit } from '../SendBox/TextBox';
 
 export {
   useActivities,
@@ -26,6 +31,7 @@ export {
   useAvatarForUser,
   useDisabled,
   useEmitTypingIndicator,
+  useFocusSendBox,
   useLanguage,
   useLocalize,
   useLocalizeDate,
@@ -33,12 +39,16 @@ export {
   usePostActivity,
   useReferenceGrammarID,
   useRenderMarkdownAsHTML,
+  useScrollToEnd,
   useSendBoxDictationStarted,
+  useSendBoxValue,
   useSendEvent,
   useSendFiles,
   useSendMessage,
   useSendMessageBack,
   useSendPostBack,
   useStyleOptions,
-  useStyleSet
+  useStyleSet,
+  useSubmitSendBox,
+  useTextBoxSubmit
 };
diff --git a/packages/component/src/hooks/useFocusSendBox.js b/packages/component/src/hooks/useFocusSendBox.js
new file mode 100644
index 0000000000..393256c138
--- /dev/null
+++ b/packages/component/src/hooks/useFocusSendBox.js
@@ -0,0 +1,7 @@
+import { useContext } from 'react';
+
+import WebChatUIContext from '../WebChatUIContext';
+
+export default function useFocusSendBox() {
+  return useContext(WebChatUIContext).focusSendBox;
+}
diff --git a/packages/component/src/hooks/useScrollToEnd.js b/packages/component/src/hooks/useScrollToEnd.js
new file mode 100644
index 0000000000..5849f1ab49
--- /dev/null
+++ b/packages/component/src/hooks/useScrollToEnd.js
@@ -0,0 +1,7 @@
+import { useContext } from 'react';
+
+import WebChatUIContext from '../WebChatUIContext';
+
+export default function useScrollToEnd() {
+  return useContext(WebChatUIContext).scrollToEnd;
+}
diff --git a/packages/component/src/hooks/useSendBoxValue.js b/packages/component/src/hooks/useSendBoxValue.js
new file mode 100644
index 0000000000..e4e200d137
--- /dev/null
+++ b/packages/component/src/hooks/useSendBoxValue.js
@@ -0,0 +1,8 @@
+import { useContext } from 'react';
+
+import { useSelector } from '../WebChatReduxContext';
+import WebChatUIContext from '../WebChatUIContext';
+
+export default function useSendBoxValue() {
+  return [useSelector(({ sendBoxValue }) => sendBoxValue), useContext(WebChatUIContext).setSendBox];
+}
diff --git a/packages/component/src/hooks/useSubmitSendBox.js b/packages/component/src/hooks/useSubmitSendBox.js
new file mode 100644
index 0000000000..53a822add2
--- /dev/null
+++ b/packages/component/src/hooks/useSubmitSendBox.js
@@ -0,0 +1,7 @@
+import { useContext } from 'react';
+
+import WebChatUIContext from '../WebChatUIContext';
+
+export default function useSubmitSendbox() {
+  return useContext(WebChatUIContext).submitSendBox;
+}