office-ui-fabric-react/lib-amd/demo/pages/DatePickerPage/examples/DatePicker.Basic.Example.tsx.js

Reusable React components for building experiences for Office 365.

define([], function() { return "import * as React from 'react';\nimport {\n  DatePicker,\n  DayOfWeek,\n  Dropdown,\n  IDropdownOption\n} from '../../../../index';\n\nconst DayPickerStrings = {\n  months: [\n    'January',\n    'February',\n    'March',\n    'April',\n    'May',\n    'June',\n    'July',\n    'August',\n    'September',\n    'October',\n    'November',\n    'December'\n  ],\n\n  shortMonths: [\n    'Jan',\n    'Feb',\n    'Mar',\n    'Apr',\n    'May',\n    'Jun',\n    'Jul',\n    'Aug',\n    'Sep',\n    'Oct',\n    'Nov',\n    'Dec'\n  ],\n\n  days: [\n    'Sunday',\n    'Monday',\n    'Tuesday',\n    'Wednesday',\n    'Thursday',\n    'Friday',\n    'Saturday'\n  ],\n\n  shortDays: [\n    'S',\n    'M',\n    'T',\n    'W',\n    'T',\n    'F',\n    'S'\n  ],\n\n  goToToday: 'Go to today'\n};\n\nexport interface IDatePickerBasicExampleState {\n  firstDayOfWeek?: DayOfWeek;\n}\n\nexport class DatePickerBasicExample extends React.Component<any, IDatePickerBasicExampleState> {\n  public constructor() {\n    super();\n\n    this.state = {\n      firstDayOfWeek: DayOfWeek.Sunday\n    };\n  }\n\n  public render() {\n    let { firstDayOfWeek } = this.state;\n\n    return (\n      <div>\n        <DatePicker firstDayOfWeek={ firstDayOfWeek } strings={ DayPickerStrings } placeholder='Select a date...' />\n        <Dropdown\n          label='Select the first day of the week'\n          options={ [\n            {\n              text: 'Sunday',\n              key: DayOfWeek[DayOfWeek.Sunday]\n            },\n            {\n              text: 'Monday',\n              key: DayOfWeek[DayOfWeek.Monday]\n            },\n            {\n              text: 'Tuesday',\n              key: DayOfWeek[DayOfWeek.Tuesday]\n            },\n            {\n              text: 'Wednesday',\n              key: DayOfWeek[DayOfWeek.Wednesday]\n            },\n            {\n              text: 'Thursday',\n              key: DayOfWeek[DayOfWeek.Thursday]\n            },\n            {\n              text: 'Friday',\n              key: DayOfWeek[DayOfWeek.Friday]\n            },\n            {\n              text: 'Saturday',\n              key: DayOfWeek[DayOfWeek.Saturday]\n            }\n          ] }\n          selectedKey={ DayOfWeek[firstDayOfWeek] }\n          onChanged={ this._onDropdownChanged.bind(this) }\n          />\n      </div>\n    );\n  }\n\n  private _onDropdownChanged(option: IDropdownOption) {\n    this.setState({\n      firstDayOfWeek: DayOfWeek[option.key]\n    });\n  }\n}\n"; });