diff --git a/js/src/ui/Dropdown/dropdown.js b/js/src/ui/Dropdown/dropdown.js
deleted file mode 100644
index 85808b7a5..000000000
--- a/js/src/ui/Dropdown/dropdown.js
+++ /dev/null
@@ -1,87 +0,0 @@
-// Copyright 2015-2017 Parity Technologies (UK) Ltd.
-// This file is part of Parity.
-
-// Parity is free software: you can redistribute it and/or modify
-// it under the terms of the GNU General Public License as published by
-// the Free Software Foundation, either version 3 of the License, or
-// (at your option) any later version.
-
-// Parity is distributed in the hope that it will be useful,
-// but WITHOUT ANY WARRANTY; without even the implied warranty of
-// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
-// GNU General Public License for more details.
-
-// You should have received a copy of the GNU General Public License
-// along with Parity. If not, see .
-
-/** USAGE:
- Options = [
- {
- text: 'Jenny Hess',
- value: 'Jenny Hess',
- image: { avatar: true, src: '/assets/images/avatar/small/jenny.jpg' },
- },
- ...
- ]
-
-
-**/
-
-import React, { PropTypes } from 'react';
-import { Dropdown as SemanticDropdown } from 'semantic-ui-react';
-
-import styles from './dropdown.css';
-
-export default function Dropdown ({ defaultValue, disabled, fullWidth, fluid, hint, icon, name, onBlur, onChange, onClick, onClose, onFocus, options, placeholder, scrolling, search, selection, text, value }) {
- return (
-
- );
-}
-
-Dropdown.propTypes = {
- defaultValue: PropTypes.number, // Initial value via index.
- disabled: PropTypes.bool, // A disabled dropdown menu or item does not allow user interaction.
- fullWidth: PropTypes.bool, // A dropdown can take the full width of its parent.
- fluid: PropTypes.bool, // A dropdown can take the full width of its parent.
- icon: PropTypes.any, // Shorthand for Icon.
- name: PropTypes.func, // Name of the hidden input which holds the value.
- onBlur: PropTypes.func, // Called on blur.
- onChange: PropTypes.func, // Called when the user attempts to change the value.
- onClick: PropTypes.func, // Called on click.
- onClose: PropTypes.func, // Called on close.
- onFocus: PropTypes.func, // Called on focus.
- options: PropTypes.any, // Array of Dropdown.Item props e.g. `{ text: '', value: '' }`
- hint: PropTypes.string, // Placeholder text.
- placeholder: PropTypes.string, // Placeholder text.
- scrolling: PropTypes.bool, // A dropdown can have its menu scroll.
- search: PropTypes.bool, // A selection dropdown can allow a user to search through a large list of choices.
- selection: PropTypes.any, // A dropdown can be used to select between choices in a form.
- text: PropTypes.string, // The text displayed in the dropdown, usually for the active item.
- value: PropTypes.any // Current value. Creates a controlled component.
-};
-
-Dropdown.defaultProps = {
- disabled: false,
- fluid: true,
- search: true,
- selection: true
-};
diff --git a/js/src/ui/Dropdown/dropdown.css b/js/src/ui/Form/Dropdown/dropdown.css
similarity index 100%
rename from js/src/ui/Dropdown/dropdown.css
rename to js/src/ui/Form/Dropdown/dropdown.css
diff --git a/js/src/ui/Form/Dropdown/dropdown.js b/js/src/ui/Form/Dropdown/dropdown.js
new file mode 100644
index 000000000..be3710bd7
--- /dev/null
+++ b/js/src/ui/Form/Dropdown/dropdown.js
@@ -0,0 +1,54 @@
+// Copyright 2015-2017 Parity Technologies (UK) Ltd.
+// This file is part of Parity.
+
+// Parity is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+
+// Parity is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU General Public License for more details.
+
+// You should have received a copy of the GNU General Public License
+// along with Parity. If not, see .
+
+import React, { PropTypes } from 'react';
+import { Dropdown as SemanticDropdown } from 'semantic-ui-react';
+
+import LabelComponent from '../labelComponent';
+
+import styles from './dropdown.css';
+
+// FIXME: Currently does not display the selected icon alongside
+export default function Dropdown ({ className, disabled = false, fullWidth = true, hint, label, onChange, options, value }) {
+ return (
+
+
+
+ );
+}
+
+Dropdown.propTypes = {
+ className: PropTypes.string,
+ disabled: PropTypes.bool, // A disabled dropdown menu or item does not allow user interaction.
+ fullWidth: PropTypes.bool, // A dropdown can take the full width of its parent.
+ hint: PropTypes.string, // Placeholder text.
+ label: PropTypes.node,
+ name: PropTypes.func, // Name of the hidden input which holds the value.
+ onChange: PropTypes.func, // Called when the user attempts to change the value.
+ options: PropTypes.any, // Array of Dropdown.Item props e.g. `{ text: '', value: '' }`
+ value: PropTypes.any // Current value. Creates a controlled component.
+};
diff --git a/js/src/ui/Dropdown/index.js b/js/src/ui/Form/Dropdown/index.js
similarity index 100%
rename from js/src/ui/Dropdown/index.js
rename to js/src/ui/Form/Dropdown/index.js
diff --git a/js/src/ui/Form/LabelComponent/index.js b/js/src/ui/Form/LabelComponent/index.js
new file mode 100644
index 000000000..df586f3e8
--- /dev/null
+++ b/js/src/ui/Form/LabelComponent/index.js
@@ -0,0 +1,17 @@
+// Copyright 2015-2017 Parity Technologies (UK) Ltd.
+// This file is part of Parity.
+
+// Parity is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+
+// Parity is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU General Public License for more details.
+
+// You should have received a copy of the GNU General Public License
+// along with Parity. If not, see .
+
+export default from './labelComponent';
diff --git a/js/src/ui/Form/LabelComponent/labelComponent.css b/js/src/ui/Form/LabelComponent/labelComponent.css
new file mode 100644
index 000000000..b10a55213
--- /dev/null
+++ b/js/src/ui/Form/LabelComponent/labelComponent.css
@@ -0,0 +1,24 @@
+/* Copyright 2015-2017 Parity Technologies (UK) Ltd.
+/* This file is part of Parity.
+/*
+/* Parity is free software: you can redistribute it and/or modify
+/* it under the terms of the GNU General Public License as published by
+/* the Free Software Foundation, either version 3 of the License, or
+/* (at your option) any later version.
+/*
+/* Parity is distributed in the hope that it will be useful,
+/* but WITHOUT ANY WARRANTY; without even the implied warranty of
+/* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+/* GNU General Public License for more details.
+/*
+/* You should have received a copy of the GNU General Public License
+/* along with Parity. If not, see .
+*/
+
+.container {
+ .label {
+ color: rgba(0, 0, 0, 0.3);
+ pointer-events: none;
+ user-select: none;
+ }
+}
diff --git a/js/src/ui/Form/LabelComponent/labelComponent.js b/js/src/ui/Form/LabelComponent/labelComponent.js
new file mode 100644
index 000000000..47dca7e80
--- /dev/null
+++ b/js/src/ui/Form/LabelComponent/labelComponent.js
@@ -0,0 +1,44 @@
+// Copyright 2015-2017 Parity Technologies (UK) Ltd.
+// This file is part of Parity.
+
+// Parity is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+
+// Parity is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU General Public License for more details.
+
+// You should have received a copy of the GNU General Public License
+// along with Parity. If not, see .
+
+import React, { PropTypes } from 'react';
+
+import styles from './labelComponent.css';
+
+export default function LabelComponent ({ children, label }) {
+ return (
+