mirror of
https://github.com/strapi/strapi.git
synced 2025-09-25 16:29:34 +00:00
Merge branch 'master' into fix/welcome-dashboard
This commit is contained in:
commit
4a8ab72a55
@ -185,7 +185,7 @@ export default FooPage;
|
||||
|
||||
***
|
||||
|
||||
## Input
|
||||
## InputsIndex
|
||||
|
||||
Strapi provides a built-in input library which includes :
|
||||
- All kind of inputs
|
||||
@ -193,7 +193,6 @@ Strapi provides a built-in input library which includes :
|
||||
- Error highlight
|
||||
- i18n
|
||||
|
||||
> This component is likely to be deprecated in favor of InputsWithIndex
|
||||
|
||||
### Usage
|
||||
|
||||
@ -202,6 +201,7 @@ Strapi provides a built-in input library which includes :
|
||||
| `addon` | string | no | Allows to add a string addon in your input, based on [Bootstrap](https://v4-alpha.getbootstrap.com/components/input-group/#basic-example). Ex: `<Input {...this.props} addon="@" />` |
|
||||
| `addRequiredInputDesign` | bool | no | Allows to add an asterix on the input. Ex: `<Input {...this.props} addRequiredInputDesign />` |
|
||||
| `customBootstrapClass` | string | no | Allows to override the input bootstrap col system. Ex: `<Input {...this.props} customBootstrapClass="col-md-6 offset-md-6 pull-md-6" />` |
|
||||
| customInputs | Object | no | Allows to add a new input type |
|
||||
| `deactivateErrorHighlight` | bool | no | Prevents from displaying error highlight in the input: Ex: `<Input {...this.props} deactivateErrorHighlight />` |
|
||||
| `didCheckErrors` | bool | no | Use this props to display errors after submitting a form. Ex: `<Input {...this.props} didCheckErrors={this.state.error} />` |
|
||||
| `disabled` | bool | no | Disable the input. Ex: `<Input {...this.props} disabled />` |
|
||||
@ -228,7 +228,15 @@ Strapi provides a built-in input library which includes :
|
||||
import React from 'react';
|
||||
// Make sure you don't have a component called Input inside your ./components folder
|
||||
// It will import the one in your components folder instead.
|
||||
import Input from 'components/Input';
|
||||
import Input from 'components/InputsIndex';
|
||||
|
||||
const CustomInput = (props) => {
|
||||
return (
|
||||
<div>
|
||||
Some custom input
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
class FooPage extends React.Component {
|
||||
constructor(props) {
|
||||
@ -256,17 +264,32 @@ class FooPage extends React.Component {
|
||||
}
|
||||
|
||||
render() {
|
||||
const inputs = [
|
||||
{
|
||||
label: 'This is a string input',
|
||||
name: 'foo',
|
||||
type: 'string',
|
||||
validations: { required: true },
|
||||
value: this.state.data.foo,
|
||||
},
|
||||
{
|
||||
label: 'This is a custom input',
|
||||
name: 'custom',
|
||||
type: 'newType',
|
||||
validations: {},
|
||||
value: '',
|
||||
}
|
||||
]
|
||||
return (
|
||||
<div className={styles.fooPage}>
|
||||
{inputs.map(input => (
|
||||
<Input
|
||||
type="string"
|
||||
value={this.state.data.foo}
|
||||
label="This is a string input"
|
||||
name="foo"
|
||||
onChange={this.handleChange}
|
||||
validations={{ required: true }}
|
||||
key={input.name}
|
||||
didCheckErrors={this.state.error}
|
||||
onChange={this.handleChange}
|
||||
{...input}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@ -6,7 +6,7 @@
|
||||
/* eslint-disable react/require-default-props */
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { isEmpty } from 'lodash';
|
||||
import { isEmpty, merge } from 'lodash';
|
||||
import Loadable from 'react-loadable';
|
||||
// Design
|
||||
import InputAddonWithErrors from 'components/InputAddonWithErrors';
|
||||
@ -65,6 +65,8 @@ function InputsIndex(props) {
|
||||
inputValue = props.value || '';
|
||||
}
|
||||
|
||||
merge(inputs, props.customInputs);
|
||||
|
||||
const Input = inputs[type] ? inputs[type] : DefaultInputError;
|
||||
|
||||
return <Input {...props} value={inputValue} />;
|
||||
@ -76,6 +78,7 @@ DefaultInputError.propTypes = {
|
||||
|
||||
InputsIndex.defaultProps = {
|
||||
addon: false,
|
||||
customInputs: {},
|
||||
};
|
||||
|
||||
InputsIndex.propTypes = {
|
||||
@ -83,6 +86,7 @@ InputsIndex.propTypes = {
|
||||
PropTypes.bool,
|
||||
PropTypes.string,
|
||||
]),
|
||||
customInputs: PropTypes.object,
|
||||
type: PropTypes.string.isRequired,
|
||||
value: PropTypes.any,
|
||||
};
|
||||
|
@ -32,6 +32,14 @@
|
||||
"policies": []
|
||||
}
|
||||
},
|
||||
{
|
||||
"method": "GET",
|
||||
"path": "/files/count",
|
||||
"handler": "Upload.count",
|
||||
"config": {
|
||||
"policies": []
|
||||
}
|
||||
},
|
||||
{
|
||||
"method": "GET",
|
||||
"path": "/files",
|
||||
@ -48,14 +56,6 @@
|
||||
"policies": []
|
||||
}
|
||||
},
|
||||
{
|
||||
"method": "GET",
|
||||
"path": "/files/count",
|
||||
"handler": "Upload.count",
|
||||
"config": {
|
||||
"policies": []
|
||||
}
|
||||
},
|
||||
{
|
||||
"method": "GET",
|
||||
"path": "/search/:id",
|
||||
|
Loading…
x
Reference in New Issue
Block a user