diff --git a/awx/ui/src/components/CodeEditor/VariablesInput.js b/awx/ui/src/components/CodeEditor/VariablesInput.js
deleted file mode 100644
index 72a5999cb0..0000000000
--- a/awx/ui/src/components/CodeEditor/VariablesInput.js
+++ /dev/null
@@ -1,104 +0,0 @@
-import React, { useState } from 'react';
-import { string, func, bool, number } from 'prop-types';
-import { Split, SplitItem } from '@patternfly/react-core';
-import styled from 'styled-components';
-import { yamlToJson, jsonToYaml, isJsonString } from 'util/yaml';
-import MultiButtonToggle from '../MultiButtonToggle';
-import CodeEditor from './CodeEditor';
-import { JSON_MODE, YAML_MODE } from './constants';
-
-function formatJson(jsonString) {
-  return JSON.stringify(JSON.parse(jsonString), null, 2);
-}
-
-const SplitItemRight = styled(SplitItem)`
-  margin-bottom: 5px;
-`;
-
-function VariablesInput(props) {
-  const { id, label, readOnly, rows, error, onError, className, name } = props;
-  /* eslint-disable react/destructuring-assignment */
-  const defaultValue = isJsonString(props.value)
-    ? formatJson(props.value)
-    : props.value;
-  const [value, setValue] = useState(defaultValue);
-  const [mode, setMode] = useState(isJsonString(value) ? JSON_MODE : YAML_MODE);
-  const isControlled = !!props.onChange;
-  /* eslint-enable react/destructuring-assignment */
-
-  const onChange = (newValue) => {
-    if (isControlled) {
-      props.onChange(newValue);
-    }
-    setValue(newValue);
-  };
-
-  return (
-    <div className={`pf-c-form__group ${className || ''}`}>
-      <Split hasGutter>
-        <SplitItem>
-          <label htmlFor={id} className="pf-c-form__label">
-            {label}
-          </label>
-        </SplitItem>
-        <SplitItemRight>
-          <MultiButtonToggle
-            buttons={[
-              [YAML_MODE, 'YAML'],
-              [JSON_MODE, 'JSON'],
-            ]}
-            value={mode}
-            onChange={(newMode) => {
-              try {
-                if (mode === JSON_MODE) {
-                  onChange(jsonToYaml(value));
-                } else {
-                  onChange(yamlToJson(value));
-                }
-                setMode(newMode);
-              } catch (err) {
-                onError(err.message);
-              }
-            }}
-            name={name}
-          />
-        </SplitItemRight>
-      </Split>
-      <CodeEditor
-        mode={mode}
-        readOnly={readOnly}
-        value={value}
-        onChange={onChange}
-        rows={rows}
-        hasErrors={!!error}
-      />
-      {error ? (
-        <div className="pf-c-form__helper-text pf-m-error" aria-live="polite">
-          {error}
-        </div>
-      ) : null}
-    </div>
-  );
-}
-VariablesInput.propTypes = {
-  id: string.isRequired,
-  label: string.isRequired,
-  value: string.isRequired,
-  readOnly: bool,
-  error: string,
-  rows: number,
-  onChange: func,
-  onError: func,
-  name: string.isRequired,
-};
-VariablesInput.defaultProps = {
-  readOnly: false,
-  onChange: null,
-  rows: 6,
-  error: null,
-  onError: () => {},
-};
-
-export default styled(VariablesInput)`
-  --pf-c-form__label--FontSize: var(--pf-global--FontSize--sm);
-`;
diff --git a/awx/ui/src/components/CodeEditor/index.js b/awx/ui/src/components/CodeEditor/index.js
index 99c41c07b3..0339137c29 100644
--- a/awx/ui/src/components/CodeEditor/index.js
+++ b/awx/ui/src/components/CodeEditor/index.js
@@ -3,5 +3,4 @@ import CodeEditor from './CodeEditor';
 export default CodeEditor;
 export { default as CodeEditorField } from './CodeEditorField';
 export { default as VariablesDetail } from './VariablesDetail';
-export { default as VariablesInput } from './VariablesInput';
 export { default as VariablesField } from './VariablesField';