Current Dev State

static/js/ketcher2/script/ui/component/atom.jsx

@@ -0,0 +1,41 @@
+/****************************************************************************
+ * Copyright 2017 EPAM Systems
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ ***************************************************************************/
+
+import { h } from 'preact';
+/** @jsx h */
+import element from '../../chem/element';
+
+const metPrefix = ['alkali', 'alkaline-earth', 'transition',
+				   'post-transition']; // 'lanthanide', 'actinide'
+
+function atomClass(el) {
+	let own = `atom-${el.label.toLowerCase()}`;
+	let type = metPrefix.indexOf(el.type) >= 0 ? `${el.type} metal` :
+		(el.type || 'unknown-props');
+	return [own, type, el.state || 'unknown-state', el.origin];
+}
+
+function Atom({el, shortcut, className, ...props}) {
+	return (
+		<button title={shortcut ? `${el.title} (${shortcut})` : el.title}
+				className={[...atomClass(el), className].join(' ')}
+				value={element.map[el.label]} {...props}>
+		  {el.label}
+		</button>
+	);
+}
+
+export default Atom;