1 | import React, { Component } from 'react';
|
2 | import PropTypes from 'prop-types';
|
3 | import { AvGroup, AvFeedback } from 'availity-reactstrap-validation';
|
4 | import { Col, FormText, Label } from 'reactstrap';
|
5 |
|
6 | import AvDate from './AvDate';
|
7 |
|
8 | const colSizes = ['xs', 'sm', 'md', 'lg', 'xl'];
|
9 |
|
10 | class AvDateField extends Component {
|
11 | getChildContext() {
|
12 | this.FormCtrl = { ...this.context.FormCtrl };
|
13 | const registerValidator = this.FormCtrl.register;
|
14 | this.FormCtrl.register = (input, updater = input && input.forceUpdate) => {
|
15 | registerValidator(input, () => {
|
16 | this.forceUpdate();
|
17 | if (updater) updater();
|
18 | });
|
19 | };
|
20 | return {
|
21 | FormCtrl: this.FormCtrl,
|
22 | };
|
23 | }
|
24 |
|
25 | render() {
|
26 | let row = false;
|
27 | const col = {};
|
28 | const labelCol = {};
|
29 | const {
|
30 | helpMessage,
|
31 | label,
|
32 | labelHidden,
|
33 | inputClass,
|
34 | labelClass,
|
35 | children,
|
36 | id = this.props.name,
|
37 | size,
|
38 | disabled,
|
39 | readOnly,
|
40 | grid,
|
41 | labelAttrs,
|
42 | groupAttrs,
|
43 | ...attributes
|
44 | } = this.props;
|
45 |
|
46 | if (grid) {
|
47 | colSizes.forEach(colSize => {
|
48 | if (grid[colSize]) {
|
49 | row = true;
|
50 | const sizeNum = parseInt(grid[colSize], 10);
|
51 | col[colSize] = sizeNum;
|
52 | labelCol[colSize] = 12 - sizeNum;
|
53 | }
|
54 | });
|
55 | }
|
56 |
|
57 | const input = (
|
58 | <AvDate
|
59 | id={id}
|
60 | className={inputClass}
|
61 | size={size}
|
62 | disabled={disabled}
|
63 | readOnly={readOnly}
|
64 | {...attributes}
|
65 | >
|
66 | {children}
|
67 | </AvDate>
|
68 | );
|
69 |
|
70 | const validation = this.context.FormCtrl.getInputState(this.props.name);
|
71 |
|
72 | const feedback = validation.errorMessage ? (
|
73 | <AvFeedback className="d-block">{validation.errorMessage}</AvFeedback>
|
74 | ) : null;
|
75 | const help = helpMessage ? <FormText>{helpMessage}</FormText> : null;
|
76 |
|
77 | return (
|
78 | <AvGroup disabled={disabled} row={row} {...groupAttrs}>
|
79 | {label && (
|
80 | <Label
|
81 | for={id}
|
82 | className={labelClass}
|
83 | hidden={labelHidden}
|
84 | size={size}
|
85 | {...labelCol}
|
86 | {...labelAttrs}
|
87 | >
|
88 | {label}
|
89 | </Label>
|
90 | )}
|
91 | {row ? (
|
92 | <Col {...col}>
|
93 | {input}
|
94 | {feedback}
|
95 | {help}
|
96 | </Col>
|
97 | ) : (
|
98 | input
|
99 | )}
|
100 | {!row && feedback}
|
101 | {!row && help}
|
102 | </AvGroup>
|
103 | );
|
104 | }
|
105 | }
|
106 |
|
107 | AvDateField.propTypes = {
|
108 | label: PropTypes.node,
|
109 | labelHidden: PropTypes.bool,
|
110 | disabled: PropTypes.bool,
|
111 | readOnly: PropTypes.bool,
|
112 | id: PropTypes.string,
|
113 | inputClass: PropTypes.string,
|
114 | labelClass: PropTypes.string,
|
115 | helpMessage: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
|
116 | errorMessage: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
|
117 | labelAttrs: PropTypes.object,
|
118 | groupAttrs: PropTypes.object,
|
119 | grid: PropTypes.object,
|
120 | children: PropTypes.node,
|
121 | name: PropTypes.string.isRequired,
|
122 | size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
123 | };
|
124 |
|
125 | AvDateField.contextTypes = {
|
126 | FormCtrl: PropTypes.object.isRequired,
|
127 | };
|
128 |
|
129 | AvDateField.childContextTypes = {
|
130 | FormCtrl: PropTypes.object.isRequired,
|
131 | };
|
132 |
|
133 | export default AvDateField;
|