text: import * as tslib_1 from "tslib";
  import * as React from 'react';
  import { ComponentPage, ExampleCard, PropertiesTableSet, PageMarkdown, } from '@uifabric/example-app-base';
  import { DateRangeType, DayOfWeek } from 'office-ui-fabric-react/lib/Calendar';
  import { CalendarButtonExample } from './examples/Calendar.Button.Example';
  import { CalendarInlineExample } from './examples/Calendar.Inline.Example';
  import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
  import { CalendarStatus } from './Calendar.checklist';
  import { addMonths, addYears } from '../../utilities/dateMath/DateMath';
  var CalendarButtonExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx');
  var CalendarInlineExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx');
  var CalendarPage = /** @class */ (function (_super) {
      tslib_1.__extends(CalendarPage, _super);
      function CalendarPage() {
          return _super !== null && _super.apply(this, arguments) || this;
      }
      CalendarPage.prototype.render = function () {
          var today = new Date(Date.now());
          return (React.createElement(ComponentPage, { title: 'Calendar', componentName: 'CalendarExample', componentUrl: 'https://github.com/OfficeDev/office-ui-fabric-react/tree/master/packages/office-ui-fabric-react/src/components/Calendar', exampleCards: React.createElement("div", null,
                  React.createElement(ExampleCard, { title: 'Inline Calendar', code: CalendarInlineExampleCode },
                      React.createElement(CalendarInlineExample, { isMonthPickerVisible: false, dateRangeType: DateRangeType.Day, autoNavigateOnSelection: false, showGoToToday: true })),
                  React.createElement(ExampleCard, { title: 'Inline Calendar with overlayed month picker when header is clicked', code: CalendarInlineExampleCode },
                      React.createElement(CalendarInlineExample, { showMonthPickerAsOverlay: true, highlightCurrentMonth: false, highlightSelectedMonth: true, dateRangeType: DateRangeType.Day, autoNavigateOnSelection: false, showGoToToday: false })),
                  React.createElement(ExampleCard, { title: 'Inline Calendar with month picker', code: CalendarInlineExampleCode },
                      React.createElement(CalendarInlineExample, { dateRangeType: DateRangeType.Day, autoNavigateOnSelection: false, highlightCurrentMonth: false, highlightSelectedMonth: true, showGoToToday: true })),
                  React.createElement(ExampleCard, { title: 'Inline Calendar with week selection', code: CalendarInlineExampleCode },
                      React.createElement(CalendarInlineExample, { dateRangeType: DateRangeType.Week, autoNavigateOnSelection: true, highlightCurrentMonth: false, highlightSelectedMonth: true, showGoToToday: true, showNavigateButtons: true })),
                  React.createElement(ExampleCard, { title: 'Inline Calendar with month selection', code: CalendarInlineExampleCode },
                      React.createElement(CalendarInlineExample, { dateRangeType: DateRangeType.Month, autoNavigateOnSelection: true, highlightCurrentMonth: false, highlightSelectedMonth: true, showGoToToday: true, showNavigateButtons: true })),
                  React.createElement(ExampleCard, { title: 'Inline Calendar with week numbers', code: CalendarInlineExampleCode },
                      React.createElement(CalendarInlineExample, { isMonthPickerVisible: false, dateRangeType: DateRangeType.Day, autoNavigateOnSelection: false, showGoToToday: true, showWeekNumbers: true })),
                  React.createElement(ExampleCard, { title: 'Inline Calendar with 6 weeks display by default', code: CalendarInlineExampleCode },
                      React.createElement(CalendarInlineExample, { isMonthPickerVisible: false, dateRangeType: DateRangeType.Day, autoNavigateOnSelection: false, showGoToToday: true, showSixWeeksByDefault: true })),
                  React.createElement(ExampleCard, { title: 'Inline Calendar with month picker and no day picker', code: CalendarInlineExampleCode },
                      React.createElement(CalendarInlineExample, { dateRangeType: DateRangeType.Month, autoNavigateOnSelection: false, showGoToToday: true, highlightCurrentMonth: false, highlightSelectedMonth: true, isDayPickerVisible: false })),
                  React.createElement(ExampleCard, { title: 'Inline Calendar with date boundary (minDate, maxDate)', code: CalendarInlineExampleCode },
                      React.createElement(CalendarInlineExample, { dateRangeType: DateRangeType.Day, autoNavigateOnSelection: true, highlightCurrentMonth: false, highlightSelectedMonth: true, showGoToToday: false, minDate: addMonths(today, -1), maxDate: addYears(today, 1) })),
                  React.createElement(ExampleCard, { title: 'Calendar with selectableDays = [Tuesday, Wednesday, Friday, Saturday] provided, first day of week = Monday', code: CalendarButtonExampleCode },
                      React.createElement(CalendarInlineExample, { dateRangeType: DateRangeType.WorkWeek, firstDayOfWeek: DayOfWeek.Monday, autoNavigateOnSelection: true, highlightCurrentMonth: false, highlightSelectedMonth: true, showGoToToday: true, workWeekDays: [DayOfWeek.Tuesday, DayOfWeek.Saturday, DayOfWeek.Wednesday, DayOfWeek.Friday] })),
                  React.createElement(ExampleCard, { title: 'Calendar launched from a button', code: CalendarButtonExampleCode },
                      React.createElement(CalendarButtonExample, { highlightCurrentMonth: true })),
                  React.createElement(ExampleCard, { title: 'Month picker launched from a button', code: CalendarButtonExampleCode },
                      React.createElement(CalendarButtonExample, { isDayPickerVisible: false, highlightCurrentMonth: false, highlightSelectedMonth: true, buttonString: 'Click for Month Picker' })),
                  React.createElement(ExampleCard, { title: 'Calendar with overlayed month picker launched from a button', code: CalendarButtonExampleCode },
                      React.createElement(CalendarButtonExample, { showMonthPickerAsOverlay: true, highlightCurrentMonth: false, highlightSelectedMonth: true, buttonString: 'Click for Overlayed Day Picker and Month Picker' }))), propertiesTables: React.createElement(PropertiesTableSet, { sources: [
                      require('!raw-loader!office-ui-fabric-react/src/components/Calendar/Calendar.types.ts')
                  ] }), overview: React.createElement(PageMarkdown, null, require('!raw-loader!office-ui-fabric-react/src/components/Calendar/docs/CalendarOverview.md')), bestPractices: React.createElement("div", null), dos: React.createElement(PageMarkdown, null, require('!raw-loader!office-ui-fabric-react/src/components/Calendar/docs/CalendarDos.md')), donts: React.createElement(PageMarkdown, null, require('!raw-loader!office-ui-fabric-react/src/components/Calendar/docs/CalendarDonts.md')), isHeaderVisible: this.props.isHeaderVisible, componentStatus: React.createElement(ComponentStatus, tslib_1.__assign({}, CalendarStatus)) }));
      };
      return CalendarPage;
  }(React.Component));
  export { CalendarPage };
  //# sourceMappingURL=CalendarPage.js.map