0.12.3

package.json

@@ -1,7 +1,7 @@
 {
   "private": false,
   "name": "bluelib",
-  "version": "0.12.2",
+  "version": "0.12.3",
   "license": "AGPL-3.0-or-later",
   "source": "src/index.js",
   "main": "dist/index.js",

src/components/Layout/HButton.js

@@ -1,12 +1,22 @@
 import style from './HButton.less';
+import {concatClass} from "../../index";
 
 export default function (props) {
+	let validityClass = null;
+	if(props.validity === true) {
+		validityClass = style.valid;
+	}
+	else if(props.validity === false) {
+		validityClass = style.invalid;
+	}
+
+
 	return (
 		<label className={style.label}>
 			<div className={style.text}>{props.label}</div>
 			<button
 				onClick={props.disabled ? null : props.onClick}
-				className={style.button}
+				className={concatClass(style.button, validityClass)}
 				disabled={props.disabled}
 			>
 				{props.children}

src/components/Layout/HButton.less

@@ -19,3 +19,11 @@
     margin-left: 4px;
     flex-grow: 2;
 }
+
+.valid {
+    border: 1px solid @lime !important;
+}
+
+.invalid {
+    border: 1px solid @red !important;
+}

src/components/Layout/HInput.js

@@ -1,10 +1,19 @@
 import style from './HInput.less';
+import {concatClass} from "../../index";
 
 export default function (props) {
+	let validityClass = null;
+	if(props.validity === true) {
+		validityClass = style.valid;
+	}
+	else if(props.validity === false) {
+		validityClass = style.invalid;
+	}
+
 	return (
 		<label className={style.label}>
 			<div className={style.text}>{props.label}</div>
-			<input className={style.input} type={props.type} value={props.value}
+			<input className={concatClass(style.input, validityClass)} type={props.type} value={props.value}
 				   onChange={props.onChange} disabled={props.disabled} name={props.name}/>
 		</label>
 	);

src/components/Layout/HInput.less

@@ -19,3 +19,11 @@
     margin-left: 4px;
     flex-grow: 2;
 }
+
+.valid {
+    border: 1px solid @lime !important;
+}
+
+.invalid {
+    border: 1px solid @red !important;
+}