@pnp/spfx-property-controls/lib/propertyFields/dateTimePicker/HoursComponent.js

Reusable property pane controls for SharePoint Framework solutions

import * as React from 'react';
import { TimeConvention } from './IPropertyFieldDateTimePicker';
import { Dropdown } from '@fluentui/react';
/**
 * Hours component, this renders the hours dropdown
 */
export default class HoursComponent extends React.Component {
    render() {
        // Constructs a Date type object from the initalDate string property
        const hours = [];
        for (let i = 0; i < 24; i++) {
            let digit;
            if (this.props.timeConvention === TimeConvention.Hours24) {
                // 24 hours time convention
                if (i < 10) {
                    digit = '0' + i;
                }
                else {
                    digit = i.toString();
                }
            }
            else {
                // 12 hours time convention
                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 (React.createElement(Dropdown, { disabled: this.props.disabled, label: '', options: hours, onChanged: this.props.onChange, dropdownWidth: 110 }));
    }
}
//# sourceMappingURL=HoursComponent.js.map