UNPKG

office-ui-fabric-react

Version:

Reusable React components for building experiences for Office 365.

80 lines (78 loc) 2.37 kB
"use strict"; var __extends = (this && this.__extends) || function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; var React = require('react'); var index_1 = require('../../../../index'); var DayPickerStrings = { months: [ 'January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December' ], shortMonths: [ 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec' ], days: [ 'Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday' ], shortDays: [ 'S', 'M', 'T', 'W', 'T', 'F', 'S' ], goToToday: 'Go to today', isRequiredErrorMessage: 'Start date is required.', invalidInputErrorMessage: 'Invalid date format.' }; var DatePickerInputExample = (function (_super) { __extends(DatePickerInputExample, _super); function DatePickerInputExample() { _super.call(this); this.state = { firstDayOfWeek: index_1.DayOfWeek.Sunday }; } DatePickerInputExample.prototype.render = function () { var firstDayOfWeek = this.state.firstDayOfWeek; var desc = 'This field is required. One of the support input formats is year dash month dash day.'; return (React.createElement("div", null, React.createElement("p", null, "Text input allowed by default when use keyboard navigation. Mouse click the TextField will popup DatePicker, click the TextField again will dismiss the DatePicker and allow text input."), React.createElement(index_1.DatePicker, {label: 'Start date', isRequired: true, allowTextInput: true, ariaLabel: desc, firstDayOfWeek: firstDayOfWeek, strings: DayPickerStrings, value: new Date()}))); }; return DatePickerInputExample; }(React.Component)); exports.DatePickerInputExample = DatePickerInputExample; //# sourceMappingURL=DatePicker.Input.Example.js.map