@@ -8,6 +8,7 @@ import HelperTextBlock from '../helper-text-block/helper-text-block';
8
8
const TimePickerBase = ( {
9
9
WrapperProps,
10
10
input,
11
+ initialLoad,
11
12
enhnancedOnBlur,
12
13
enhancedOnChange,
13
14
finalValue,
@@ -19,42 +20,70 @@ const TimePickerBase = ({
19
20
selectFormat,
20
21
selectTimezone,
21
22
...rest
22
- } ) => (
23
- < div { ...WrapperProps } >
24
- < CarbonTimePicker
25
- { ...input }
26
- { ...( enhnancedOnBlur && { onBlur : enhnancedOnBlur } ) }
27
- { ...( enhancedOnChange && { onChange : ( e ) => enhancedOnChange ( e . target . value ) } ) }
28
- onBlur = { enhnancedOnBlur }
29
- value = { finalValue }
30
- key = { input . name }
31
- id = { input . name }
32
- invalid = { Boolean ( invalid ) }
33
- invalidText = { invalid || '' }
34
- { ...rest }
35
- >
36
- { twelveHoursFormat && (
37
- < TimePickerSelect labelText = "Period" id = { `${ rest . id || input . name } -12h` } onChange = { ( { target : { value } } ) => selectFormat ( value ) } >
38
- < SelectItem value = "AM" text = "AM" />
39
- < SelectItem value = "PM" text = "PM" />
40
- </ TimePickerSelect >
41
- ) }
42
- { timezones && (
43
- < TimePickerSelect labelText = "Timezone" id = { `${ rest . id || input . name } -timezones` } onChange = { ( { target : { value } } ) => selectTimezone ( value ) } >
44
- { timezones . map ( ( { showAs, ...tz } ) => (
45
- < SelectItem key = { tz . value } text = { tz . label } { ...tz } />
46
- ) ) }
47
- </ TimePickerSelect >
48
- ) }
49
- </ CarbonTimePicker >
50
- < HelperTextBlock helperText = { ! invalid && helperText } warnText = { warnText } />
51
- </ div >
52
- ) ;
23
+ } ) => {
24
+ let defaultFormat ;
25
+ if ( initialLoad === false ) {
26
+ if ( input . value ) {
27
+ const date = new Date ( input . value ) ;
28
+ if ( date . getHours ( ) >= 12 ) {
29
+ defaultFormat = 'PM' ;
30
+ }
31
+ }
32
+ }
33
+
34
+ return (
35
+ < div { ...WrapperProps } >
36
+ < CarbonTimePicker
37
+ { ...input }
38
+ { ...( enhnancedOnBlur && { onBlur : enhnancedOnBlur } ) }
39
+ { ...( enhancedOnChange && { onChange : ( e ) => enhancedOnChange ( e . target . value ) } ) }
40
+ onBlur = { enhnancedOnBlur }
41
+ value = { finalValue }
42
+ key = { input . name }
43
+ id = { input . name }
44
+ invalid = { Boolean ( invalid ) }
45
+ invalidText = { invalid || '' }
46
+ { ...rest }
47
+ >
48
+ { twelveHoursFormat && defaultFormat === 'PM' && (
49
+ < TimePickerSelect
50
+ labelText = "Period"
51
+ defaultValue = { 'PM' }
52
+ id = { `${ rest . id || input . name } -12h` }
53
+ onChange = { ( { target : { value } } ) => selectFormat ( value ) }
54
+ >
55
+ < SelectItem value = "AM" text = "AM" />
56
+ < SelectItem value = "PM" text = "PM" />
57
+ </ TimePickerSelect >
58
+ ) }
59
+ { twelveHoursFormat && defaultFormat === undefined && (
60
+ < TimePickerSelect labelText = "Period" id = { `${ rest . id || input . name } -12h` } onChange = { ( { target : { value } } ) => selectFormat ( value ) } >
61
+ < SelectItem value = "AM" text = "AM" />
62
+ < SelectItem value = "PM" text = "PM" />
63
+ </ TimePickerSelect >
64
+ ) }
65
+ { timezones && (
66
+ < TimePickerSelect
67
+ labelText = "Timezone"
68
+ id = { `${ rest . id || input . name } -timezones` }
69
+ onChange = { ( { target : { value } } ) => selectTimezone ( value ) }
70
+ >
71
+ { timezones . map ( ( { showAs, ...tz } ) => (
72
+ < SelectItem key = { tz . value } text = { tz . label } { ...tz } />
73
+ ) ) }
74
+ </ TimePickerSelect >
75
+ ) }
76
+ </ CarbonTimePicker >
77
+ < HelperTextBlock helperText = { ! invalid && helperText } warnText = { warnText } />
78
+ </ div >
79
+ ) ;
80
+ } ;
53
81
54
82
TimePickerBase . propTypes = {
55
83
isDisabled : PropTypes . bool ,
56
84
isReadOnly : PropTypes . bool ,
57
85
isRequired : PropTypes . bool ,
86
+ initialLoad : PropTypes . bool ,
58
87
label : PropTypes . node ,
59
88
labelText : PropTypes . node ,
60
89
description : PropTypes . node ,
@@ -69,6 +98,7 @@ TimePickerBase.propTypes = {
69
98
WrapperProps : PropTypes . object ,
70
99
input : PropTypes . shape ( {
71
100
name : PropTypes . string ,
101
+ value : PropTypes . oneOf ( PropTypes . string , PropTypes . date ) ,
72
102
} ) . isRequired ,
73
103
enhnancedOnBlur : PropTypes . func ,
74
104
enhancedOnChange : PropTypes . func ,
0 commit comments