@dialpad/dialtone
Version:
Dialpad's Dialtone design system monorepo
149 lines (148 loc) • 4.32 kB
JavaScript
"use strict";
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
const monthYearPicker = require("./modules/month-year-picker.vue.cjs");
const calendar = require("./modules/calendar.vue.cjs");
const stack = require("../stack/stack.vue.cjs");
const common_utils = require("../../common/utils.cjs");
const _pluginVue2_normalizer = require("../../_virtual/_plugin-vue2_normalizer.cjs");
const _sfc_main = {
name: "DtDatepicker",
components: { DtStack: stack.default, MonthYearPicker: monthYearPicker.default, Calendar: calendar.default },
props: {
/**
* Label for the previous month button
*
* @type {String}
* @example 'Previous month'
*/
prevMonthLabel: {
type: String,
required: true
},
/**
* Label for the next month button
*
* @type {String}
* @example 'Next month'
*/
nextMonthLabel: {
type: String,
required: true
},
/**
* Label for the previous year button
*
* @type {String}
* @example 'Previous year'
*/
prevYearLabel: {
type: String,
required: true
},
/**
* Label for the next year button
*
* @type {String}
* @example 'Next year'
*/
nextYearLabel: {
type: String,
required: true
},
/**
* Label for the select day button
*
* @type {String}
* @example 'Select day'
*/
selectDayLabel: {
type: String,
required: true
},
/**
* Label for the change to button
*
* @type {String}
* @example 'Change to'
*/
changeToLabel: {
type: String,
required: true
},
/**
* Locale for the calendar
*
* @type {String}
*/
locale: {
type: String,
default: "en-US"
},
/**
* Selected date
*
* @type {Date}
*/
selectedDate: {
type: Date,
default: () => /* @__PURE__ */ new Date()
}
},
emits: [
/**
* Event fired when a date is selected
*
* @event selected-date
* @type {Date}
*/
"selected-date",
/**
* Event fired when user presses the esc key
*
* @event close-datepicker
*/
"close-datepicker"
],
data() {
return {
calendarDays: []
};
},
mounted() {
common_utils.warnIfUnmounted(this.$el, this.$options.name);
},
methods: {
updateCalendarDays(days) {
this.calendarDays = days;
}
}
};
var _sfc_render = function render() {
var _vm = this, _c = _vm._self._c;
return _c("dt-stack", { staticClass: "d-datepicker", attrs: { "gap": "400" } }, [_c("div", { staticClass: "d-datepicker__hd" }, [_c("month-year-picker", { ref: "monthYearPicker", attrs: { "locale": _vm.locale, "prev-month-label": _vm.prevMonthLabel, "next-month-label": _vm.nextMonthLabel, "prev-year-label": _vm.prevYearLabel, "next-year-label": _vm.nextYearLabel, "change-to-label": _vm.changeToLabel, "selected-date": _vm.selectedDate }, on: { "calendar-days": _vm.updateCalendarDays, "focus-first-day": function($event) {
return _vm.$refs.calendar.focusFirstDay();
}, "focus-last-day": function($event) {
return _vm.$refs.calendar.focusLastDay();
}, "close-datepicker": function($event) {
return _vm.$emit("close-datepicker");
} } })], 1), _c("div", { staticClass: "d-datepicker__bd" }, [_c("calendar", { ref: "calendar", attrs: { "locale": _vm.locale, "calendar-days": _vm.calendarDays, "select-day-label": _vm.selectDayLabel }, on: { "select-date": function($event) {
return _vm.$emit("selected-date", $event);
}, "focus-month-year-picker": function($event) {
return _vm.$refs.monthYearPicker.focusMonthYearPicker();
}, "close-datepicker": function($event) {
return _vm.$emit("close-datepicker");
}, "go-to-next-month": function($event) {
return _vm.$refs.monthYearPicker.goToNextMonth();
}, "go-to-prev-month": function($event) {
return _vm.$refs.monthYearPicker.goToPrevMonth();
} } })], 1)]);
};
var _sfc_staticRenderFns = [];
var __component__ = /* @__PURE__ */ _pluginVue2_normalizer.default(
_sfc_main,
_sfc_render,
_sfc_staticRenderFns
);
const datepicker = __component__.exports;
exports.default = datepicker;
//# sourceMappingURL=datepicker.vue.cjs.map