"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var React = require("react");
var Dropdown_1 = require("office-ui-fabric-react/lib-commonjs/Dropdown");
var date_time_1 = require("@uifabric/date-time");
require("./DatePicker.Examples.scss");
var DatePickerWeekNumbersExample = /** @class */ (function (_super) {
    tslib_1.__extends(DatePickerWeekNumbersExample, _super);
    function DatePickerWeekNumbersExample(props) {
        var _this = _super.call(this, props) || this;
        _this._onDropdownChange = function (event, option) {
            _this.setState({
                firstDayOfWeek: option.key,
            });
        };
        _this.state = {
            firstDayOfWeek: date_time_1.DayOfWeek.Monday,
        };
        return _this;
    }
    DatePickerWeekNumbersExample.prototype.render = function () {
        var firstDayOfWeek = this.state.firstDayOfWeek;
        return (React.createElement("div", { className: "docs-DatePickerExample" },
            React.createElement(date_time_1.DatePicker, { firstDayOfWeek: firstDayOfWeek, strings: date_time_1.defaultDayPickerStrings, showWeekNumbers: true, firstWeekOfYear: 1, showMonthPickerAsOverlay: true, placeholder: "Select a date...", ariaLabel: "Select a date" }),
            React.createElement(Dropdown_1.Dropdown, { label: "Select the first day of the week", options: [
                    {
                        text: 'Sunday',
                        key: date_time_1.DayOfWeek.Sunday,
                    },
                    {
                        text: 'Monday',
                        key: date_time_1.DayOfWeek.Monday,
                    },
                    {
                        text: 'Tuesday',
                        key: date_time_1.DayOfWeek.Tuesday,
                    },
                    {
                        text: 'Wednesday',
                        key: date_time_1.DayOfWeek.Wednesday,
                    },
                    {
                        text: 'Thursday',
                        key: date_time_1.DayOfWeek.Thursday,
                    },
                    {
                        text: 'Friday',
                        key: date_time_1.DayOfWeek.Friday,
                    },
                    {
                        text: 'Saturday',
                        key: date_time_1.DayOfWeek.Saturday,
                    },
                ], selectedKey: firstDayOfWeek, onChange: this._onDropdownChange })));
    };
    return DatePickerWeekNumbersExample;
}(React.Component));
exports.DatePickerWeekNumbersExample = DatePickerWeekNumbersExample;
//# sourceMappingURL=DatePicker.WeekNumbers.Example.js.map