aboutsummaryrefslogtreecommitdiff
path: root/frontend/src/components/fields
diff options
context:
space:
mode:
Diffstat (limited to 'frontend/src/components/fields')
-rw-r--r--frontend/src/components/fields/ButtonField.js8
-rw-r--r--frontend/src/components/fields/CheckField.js12
-rw-r--r--frontend/src/components/fields/InputField.js20
-rw-r--r--frontend/src/components/fields/TagField.js12
-rw-r--r--frontend/src/components/fields/TextField.js10
-rw-r--r--frontend/src/components/fields/extensions/ColorField.js17
-rw-r--r--frontend/src/components/fields/extensions/NumericField.js6
7 files changed, 42 insertions, 43 deletions
diff --git a/frontend/src/components/fields/ButtonField.js b/frontend/src/components/fields/ButtonField.js
index 850f837..de747a5 100644
--- a/frontend/src/components/fields/ButtonField.js
+++ b/frontend/src/components/fields/ButtonField.js
@@ -15,11 +15,11 @@
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
-import React, {Component} from 'react';
-import './ButtonField.scss';
-import './common.scss';
+import React, {Component} from "react";
+import "./ButtonField.scss";
+import "./common.scss";
-const classNames = require('classnames');
+const classNames = require("classnames");
class ButtonField extends Component {
diff --git a/frontend/src/components/fields/CheckField.js b/frontend/src/components/fields/CheckField.js
index a0e2706..bfa1c9d 100644
--- a/frontend/src/components/fields/CheckField.js
+++ b/frontend/src/components/fields/CheckField.js
@@ -15,12 +15,12 @@
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
-import React, {Component} from 'react';
-import './CheckField.scss';
-import './common.scss';
+import React, {Component} from "react";
import {randomClassName} from "../../utils";
+import "./CheckField.scss";
+import "./common.scss";
-const classNames = require('classnames');
+const classNames = require("classnames");
class CheckField extends Component {
@@ -41,9 +41,9 @@ class CheckField extends Component {
};
return (
- <div className={classNames( "field", "check-field", {"field-checked" : checked}, {"field-small": small})}>
+ <div className={classNames("field", "check-field", {"field-checked": checked}, {"field-small": small})}>
<div className="field-input">
- <input type="checkbox" id={this.id} checked={checked} onChange={handler} />
+ <input type="checkbox" id={this.id} checked={checked} onChange={handler}/>
<label htmlFor={this.id}>{(checked ? "✓ " : "✗ ") + (name != null ? name : "")}</label>
</div>
</div>
diff --git a/frontend/src/components/fields/InputField.js b/frontend/src/components/fields/InputField.js
index 80cce3b..823989d 100644
--- a/frontend/src/components/fields/InputField.js
+++ b/frontend/src/components/fields/InputField.js
@@ -15,12 +15,12 @@
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
-import React, {Component} from 'react';
-import './InputField.scss';
-import './common.scss';
+import React, {Component} from "react";
import {randomClassName} from "../../utils";
+import "./common.scss";
+import "./InputField.scss";
-const classNames = require('classnames');
+const classNames = require("classnames");
class InputField extends Component {
@@ -59,23 +59,23 @@ class InputField extends Component {
}
return (
- <div className={classNames("field", "input-field", {"field-active" : active},
+ <div className={classNames("field", "input-field", {"field-active": active},
{"field-invalid": invalid}, {"field-small": small}, {"field-inline": inline})}>
<div className="field-wrapper">
- { name &&
+ {name &&
<div className="field-name">
<label>{name}:</label>
</div>
}
<div className="field-input">
<div className="field-value">
- { type === "file" && <label for={this.id} className={"file-label"}>
- {value.name || this.props.placeholder}</label> }
+ {type === "file" && <label for={this.id} className={"file-label"}>
+ {value.name || this.props.placeholder}</label>}
<input type={type} placeholder={this.props.placeholder} id={this.id}
aria-describedby={this.id} onChange={handler} {...inputProps}
- readOnly={this.props.readonly} />
+ readOnly={this.props.readonly}/>
</div>
- { type !== "file" && value !== "" &&
+ {type !== "file" && value !== "" &&
<div className="field-clear">
<span onClick={() => handler(null)}>del</span>
</div>
diff --git a/frontend/src/components/fields/TagField.js b/frontend/src/components/fields/TagField.js
index 89445b6..9a36da4 100644
--- a/frontend/src/components/fields/TagField.js
+++ b/frontend/src/components/fields/TagField.js
@@ -15,14 +15,14 @@
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
-import React, {Component} from 'react';
-import './TagField.scss';
-import './common.scss';
-import {randomClassName} from "../../utils";
+import React, {Component} from "react";
import ReactTags from "react-tag-autocomplete";
+import {randomClassName} from "../../utils";
+import "./common.scss";
+import "./TagField.scss";
-const classNames = require('classnames');
-const _ = require('lodash');
+const classNames = require("classnames");
+const _ = require("lodash");
class TagField extends Component {
diff --git a/frontend/src/components/fields/TextField.js b/frontend/src/components/fields/TextField.js
index 9237c0c..4dd77bd 100644
--- a/frontend/src/components/fields/TextField.js
+++ b/frontend/src/components/fields/TextField.js
@@ -15,12 +15,12 @@
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
-import React, {Component} from 'react';
-import './TextField.scss';
-import './common.scss';
+import React, {Component} from "react";
import {randomClassName} from "../../utils";
+import "./common.scss";
+import "./TextField.scss";
-const classNames = require('classnames');
+const classNames = require("classnames");
class TextField extends Component {
@@ -50,7 +50,7 @@ class TextField extends Component {
{"field-invalid": this.props.invalid}, {"field-small": this.props.small})}>
{name && <label htmlFor={this.id}>{name}:</label>}
<textarea id={this.id} placeholder={this.props.defaultValue} onChange={handler} rows={rows}
- readOnly={this.props.readonly} value={this.props.value} ref={this.props.textRef} />
+ readOnly={this.props.readonly} value={this.props.value} ref={this.props.textRef}/>
{error && <div className="field-error">error: {error}</div>}
</div>
);
diff --git a/frontend/src/components/fields/extensions/ColorField.js b/frontend/src/components/fields/extensions/ColorField.js
index f1c0caf..fd30988 100644
--- a/frontend/src/components/fields/extensions/ColorField.js
+++ b/frontend/src/components/fields/extensions/ColorField.js
@@ -15,22 +15,21 @@
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
-import React, {Component} from 'react';
+import React, {Component} from "react";
import {OverlayTrigger, Popover} from "react-bootstrap";
-import './ColorField.scss';
-import InputField from "../InputField";
import validation from "../../../validation";
+import InputField from "../InputField";
+import "./ColorField.scss";
class ColorField extends Component {
constructor(props) {
super(props);
- this.state = {
- };
+ this.state = {};
- this.colors = ["#E53935", "#D81B60", "#8E24AA", "#5E35B1", "#3949AB", "#1E88E5", "#039BE5", "#00ACC1",
- "#00897B", "#43A047", "#7CB342", "#9E9D24", "#F9A825", "#FB8C00", "#F4511E", "#6D4C41"];
+ this.colors = ["#e53935", "#d81b60", "#8e24aa", "#5e35b1", "#3949ab", "#1e88e5", "#039be5", "#00acc1",
+ "#00897b", "#43a047", "#7cb342", "#9e9d24", "#f9a825", "#fb8c00", "#f4511e", "#6d4c41"];
}
componentDidUpdate(prevProps, prevState, snapshot) {
@@ -55,7 +54,7 @@ class ColorField extends Component {
this.props.onChange(color);
}
document.body.click(); // magic to close popup
- }} />);
+ }}/>);
const popover = (
<Popover id="popover-basic">
@@ -82,7 +81,7 @@ class ColorField extends Component {
<div className="field color-field">
<div className="color-input">
<InputField {...this.props} onChange={this.onChange} invalid={this.state.invalid} name="color"
- error={null} />
+ error={null}/>
<div className="color-picker">
<OverlayTrigger trigger="click" placement="top" overlay={popover} rootClose>
<button type="button" className="picker-button" style={buttonStyles}>pick</button>
diff --git a/frontend/src/components/fields/extensions/NumericField.js b/frontend/src/components/fields/extensions/NumericField.js
index d4d027d..a6cba26 100644
--- a/frontend/src/components/fields/extensions/NumericField.js
+++ b/frontend/src/components/fields/extensions/NumericField.js
@@ -15,7 +15,7 @@
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
-import React, {Component} from 'react';
+import React, {Component} from "react";
import InputField from "../InputField";
class NumericField extends Component {
@@ -35,7 +35,7 @@ class NumericField extends Component {
}
onChange = (value) => {
- value = value.toString().replace(/[^\d]/gi, '');
+ value = value.toString().replace(/[^\d]/gi, "");
let intValue = 0;
if (value !== "") {
intValue = parseInt(value, 10);
@@ -53,7 +53,7 @@ class NumericField extends Component {
render() {
return (
<InputField {...this.props} onChange={this.onChange} defaultValue={this.props.defaultValue || "0"}
- invalid={this.state.invalid} />
+ invalid={this.state.invalid}/>
);
}