import * as React from 'react' ; import { IHoursComponentProps } from './IPropertyFieldDateTimePickerHost' ; import { TimeConvention } from './IPropertyFieldDateTimePicker' ; import { Dropdown , IDropdownOption } from 'office-ui-fabric-react/lib/components/Dropdown' ; /**
 * Hours component, this renders the hours dropdown
 */ export default class HoursComponent extends React . Component < IHoursComponentProps , { } > { public render ( ) { let hours = [ ] ; for ( let i = 0 ; i < 24 ; i ++ ) { let digit ; if ( this . props . timeConvention === TimeConvention . Hours24 ) { if ( i < 10 ) { digit = '0' + i ; } else { digit = i . toString ( ) ; } } else { if ( i === 0 ) { digit = '12 am' ; } else if ( i < 12 ) { digit = i + ' am' ; } else { if ( i === 12 ) { digit = '12 pm' ; } else { digit = ( i % 12 ) + ' pm' ; } } } let selected = false ; if ( i === this . props . value ) { selected = true ; } hours . push ( { key : i , text : digit , isSelected : selected } ) ; } return ( < Dropdown disabled = { this . props . disabled } label = '' options = { hours } onChanged = { this . props . onChange } dropdownWidth = { 110 } / > ) ; } }