ref(ui-components) Replace livestream input (#11997)

package-lock.json

@@ -12,7 +12,6 @@
       "dependencies": {
         "@amplitude/react-native": "2.7.0",
         "@atlaskit/dropdown-menu": "10.1.2",
-        "@atlaskit/field-text": "11.0.4",
         "@atlaskit/field-text-area": "8.0.4",
         "@atlaskit/flag": "14.1.0",
         "@atlaskit/icon": "21.2.0",
@@ -528,21 +527,6 @@
         "react": "^16.8.0"
       }
     },
-    "node_modules/@atlaskit/field-text": {
-      "version": "11.0.4",
-      "resolved": "https://registry.npmjs.org/@atlaskit/field-text/-/field-text-11.0.4.tgz",
-      "integrity": "sha512-unm6oVzrzejXnbv0gH3j/oaV4UeA+j+bT2MmsOw0hmUMy3hjd4AChqB/ob604F+iuU5ETd/I7DzoEm+brpOg2Q==",
-      "dependencies": {
-        "@atlaskit/analytics-next": "^8.0.0",
-        "@atlaskit/field-base": "^15.0.0",
-        "@atlaskit/theme": "^11.0.0",
-        "@babel/runtime": "^7.0.0"
-      },
-      "peerDependencies": {
-        "react": "^16.8.0",
-        "styled-components": "^3.2.6"
-      }
-    },
     "node_modules/@atlaskit/field-text-area": {
       "version": "8.0.4",
       "resolved": "https://registry.npmjs.org/@atlaskit/field-text-area/-/field-text-area-8.0.4.tgz",
@@ -20299,17 +20283,6 @@
         }
       }
     },
-    "@atlaskit/field-text": {
-      "version": "11.0.4",
-      "resolved": "https://registry.npmjs.org/@atlaskit/field-text/-/field-text-11.0.4.tgz",
-      "integrity": "sha512-unm6oVzrzejXnbv0gH3j/oaV4UeA+j+bT2MmsOw0hmUMy3hjd4AChqB/ob604F+iuU5ETd/I7DzoEm+brpOg2Q==",
-      "requires": {
-        "@atlaskit/analytics-next": "^8.0.0",
-        "@atlaskit/field-base": "^15.0.0",
-        "@atlaskit/theme": "^11.0.0",
-        "@babel/runtime": "^7.0.0"
-      }
-    },
     "@atlaskit/field-text-area": {
       "version": "8.0.4",
       "resolved": "https://registry.npmjs.org/@atlaskit/field-text-area/-/field-text-area-8.0.4.tgz",

package.json

@@ -17,7 +17,6 @@
   "dependencies": {
     "@amplitude/react-native": "2.7.0",
     "@atlaskit/dropdown-menu": "10.1.2",
-    "@atlaskit/field-text": "11.0.4",
     "@atlaskit/field-text-area": "8.0.4",
     "@atlaskit/flag": "14.1.0",
     "@atlaskit/icon": "21.2.0",

react/features/recording/components/LiveStream/web/StreamKeyForm.js

@@ -1,10 +1,10 @@
 // @flow
 
-import { FieldTextStateless } from '@atlaskit/field-text';
 import React from 'react';
 
 import { translate } from '../../../../base/i18n';
 import { connect } from '../../../../base/redux';
+import Input from '../../../../base/ui/components/web/Input';
 import AbstractStreamKeyForm, {
     type Props, _mapStateToProps
 } from '../AbstractStreamKeyForm';
@@ -41,18 +41,14 @@ class StreamKeyForm extends AbstractStreamKeyForm<Props> {
 
         return (
             <div className = 'stream-key-form'>
-                <FieldTextStateless
+                <Input
                     autoFocus = { true }
-                    compact = { true }
-                    isSpellCheckEnabled = { false }
                     label = { t('dialog.streamKey') }
                     name = 'streamId'
-                    okDisabled = { !value }
                     onChange = { this._onInputChange }
                     placeholder = { t('liveStreaming.enterStreamKey') }
-                    shouldFitContainer = { true }
                     type = 'text'
-                    value = { this.props.value } />
+                    value = { value } />
                 <div className = 'form-footer'>
                     <div className = 'help-container'>
                         {