}).find('Card');
-
- expect(cards).to.have.length(2);
- expect(cards.get(1).props.children.props.children).to.equal('testingHover');
- });
-
- it('renders the Title', () => {
- const title = render({ title: 'title' }).find('Title');
-
- expect(title).to.have.length(1);
- expect(title.props().title).to.equal('title');
- });
- });
});
diff --git a/js/src/ui/Form/Dropdown/dropdown.css b/js/src/ui/Form/Dropdown/dropdown.css
new file mode 100644
index 000000000..07f3e3df9
--- /dev/null
+++ b/js/src/ui/Form/Dropdown/dropdown.css
@@ -0,0 +1,21 @@
+/* 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 .
+*/
+
+.dropdown {
+ position: relative;
+ display: block;
+}
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/Form/Dropdown/index.js b/js/src/ui/Form/Dropdown/index.js
new file mode 100644
index 000000000..6673f32ef
--- /dev/null
+++ b/js/src/ui/Form/Dropdown/index.js
@@ -0,0 +1,18 @@
+/* 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 './dropdown';
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 (
+