UNPKG

3.21 kBJavaScriptView Raw
1import React, { Component } from 'react';
2import PropTypes from 'prop-types';
3import { AvGroup, AvFeedback } from 'availity-reactstrap-validation';
4import { Col, FormText, Label } from 'reactstrap';
5
6import AvDate from './AvDate';
7
8const colSizes = ['xs', 'sm', 'md', 'lg', 'xl'];
9
10class 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
107AvDateField.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
125AvDateField.contextTypes = {
126 FormCtrl: PropTypes.object.isRequired,
127};
128
129AvDateField.childContextTypes = {
130 FormCtrl: PropTypes.object.isRequired,
131};
132
133export default AvDateField;