diff --git a/src/CustomFileInput.js b/src/CustomFileInput.js
index 0cbf54b82..9ac4bc3f8 100644
--- a/src/CustomFileInput.js
+++ b/src/CustomFileInput.js
@@ -13,99 +13,113 @@ const propTypes = {
htmlFor: PropTypes.string,
cssModule: PropTypes.object,
onChange: PropTypes.func,
- children: PropTypes.oneOfType([PropTypes.node, PropTypes.array, PropTypes.func]),
+ children: PropTypes.oneOfType([
+ PropTypes.node,
+ PropTypes.array,
+ PropTypes.func
+ ]),
innerRef: PropTypes.oneOfType([
PropTypes.object,
PropTypes.string,
- PropTypes.func,
+ PropTypes.func
])
};
class CustomFileInput extends React.Component {
- constructor(props) {
- super(props);
+ constructor(props) {
+ super(props);
- this.state = {
- files:null,
- };
+ this.state = {
+ files: null
+ };
- this.onChange = this.onChange.bind(this);
- }
-
- onChange(e) {
- let input = e.target;
- let {onChange} = this.props;
- let files = this.getSelectedFiles(input);
+ this.onChange = this.onChange.bind(this);
+ }
- if (typeof(onChange) === 'function') {
- onChange(...arguments);
- }
+ onChange(e) {
+ let input = e.target;
+ let { onChange } = this.props;
+ let files = this.getSelectedFiles(input);
- this.setState({files})
+ if (typeof onChange === "function") {
+ onChange(...arguments);
}
- getSelectedFiles(input) {
- let {multiple} = this.props;
+ this.setState({ files });
+ }
- if (multiple && input.files) {
- let files = [].slice.call(input.files);
+ getSelectedFiles(input) {
+ let { multiple } = this.props;
- return files.map(file => file.name).join(', ');
- }
+ if (multiple && input.files) {
+ let files = [].slice.call(input.files);
- if (input.value.indexOf('fakepath') !== -1) {
- let parts = input.value.split('\\');
+ return files.map(file => file.name).join(", ");
+ }
- return parts[parts.length - 1];
- }
+ if (input.value.indexOf("fakepath") !== -1) {
+ let parts = input.value.split("\\");
- return input.value;
+ return parts[parts.length - 1];
}
- render() {
- const {
- className,
- label,
- valid,
- invalid,
- cssModule,
- children,
- bsSize,
- innerRef,
- htmlFor,
- type,
- onChange,
- dataBrowse,
- ...attributes
- } = this.props;
-
- const customClass = mapToCssModules(
- classNames(
- className,
- `custom-file`,
- ),
- cssModule
- );
-
- const validationClassNames = mapToCssModules(
- classNames(
- invalid && 'is-invalid',
- valid && 'is-valid',
- ),
- cssModule
- );
-
- const labelHtmlFor = htmlFor || attributes.id;
- const {files} = this.state;
-
- return (
-
-
-
- {children}
-
- );
- }
+ return input.value;
+ }
+
+ render() {
+ const {
+ className,
+ label,
+ valid,
+ invalid,
+ cssModule,
+ children,
+ bsSize,
+ innerRef,
+ htmlFor,
+ type,
+ onChange,
+ dataBrowse,
+ hidden,
+ ...attributes
+ } = this.props;
+
+ const customClass = mapToCssModules(
+ classNames(className, `custom-file`),
+ cssModule
+ );
+
+ const validationClassNames = mapToCssModules(
+ classNames(invalid && "is-invalid", valid && "is-valid"),
+ cssModule
+ );
+
+ const labelHtmlFor = htmlFor || attributes.id;
+ const { files } = this.state;
+
+ return (
+
+
+
+ {children}
+
+ );
+ }
}
CustomFileInput.propTypes = propTypes;
diff --git a/src/CustomInput.js b/src/CustomInput.js
index 705b78901..a1d58789c 100644
--- a/src/CustomInput.js
+++ b/src/CustomInput.js
@@ -16,11 +16,7 @@ const propTypes = {
htmlFor: PropTypes.string,
cssModule: PropTypes.object,
children: PropTypes.oneOfType([PropTypes.node, PropTypes.array, PropTypes.func]),
- innerRef: PropTypes.oneOfType([
- PropTypes.object,
- PropTypes.string,
- PropTypes.func,
- ])
+ innerRef: PropTypes.oneOfType([PropTypes.object, PropTypes.string, PropTypes.func])
};
function CustomInput(props) {
@@ -40,51 +36,71 @@ function CustomInput(props) {
const type = attributes.type;
- const customClass = mapToCssModules(classNames(
- className,
- `custom-${type}`,
- bsSize ? `custom-${type}-${bsSize}` : false,
- ), cssModule);
+ const customClass = mapToCssModules(
+ classNames(className, `custom-${type}`, bsSize ? `custom-${type}-${bsSize}` : false),
+ cssModule
+ );
- const validationClassNames = mapToCssModules(classNames(
- invalid && 'is-invalid',
- valid && 'is-valid',
- ), cssModule);
+ const validationClassNames = mapToCssModules(
+ classNames(invalid && "is-invalid", valid && "is-valid"),
+ cssModule
+ );
const labelHtmlFor = htmlFor || attributes.id;
- if (type === 'select') {
+ if (type === "select") {
const { type, ...rest } = attributes;
- return ;
- }
-
- if (type === 'file') {
return (
-
+
);
}
- if (type !== 'checkbox' && type !== 'radio' && type !== 'switch') {
- return ;
+ if (type === "file") {
+ return ;
+ }
+
+ if (type !== "checkbox" && type !== "radio" && type !== "switch") {
+ return (
+
+ );
}
const wrapperClasses = classNames(
customClass,
- mapToCssModules(classNames(
- 'custom-control',
- { 'custom-control-inline': inline }
- ), cssModule)
+ mapToCssModules(
+ classNames("custom-control", { "custom-control-inline": inline }),
+ cssModule
+ )
);
+ const { hidden, ...rest } = attributes;
return (
-
+
-
+
{children}
);