666 lines
27 KiB
JavaScript
666 lines
27 KiB
JavaScript
import {
|
|
h as t,
|
|
r as e,
|
|
c as a,
|
|
H as i,
|
|
g as o
|
|
} from "/offeduadvc/visitEdu/usr/datapicker/index-a3afd6e1.js";
|
|
const d = /^(\d{4}).(\d{2}).(\d{2})$/;
|
|
var r;
|
|
|
|
function s(t, e, a) {
|
|
var i = parseInt(a, 10),
|
|
o = parseInt(e, 10),
|
|
d = parseInt(t, 10);
|
|
if (Number.isInteger(d) && Number.isInteger(o) && Number.isInteger(i) && o > 0 && o <= 12 && i > 0 && i <= 31 && d > 0) return new Date(d, o - 1, i)
|
|
}
|
|
|
|
function n(t) {
|
|
if (!t) return;
|
|
const e = t.match(d);
|
|
return e ? s(e[1], e[2], e[3]) : void 0
|
|
}
|
|
|
|
function l(t) {
|
|
if (!t) return "";
|
|
var e = t.getDate().toString(10),
|
|
a = (t.getMonth() + 1).toString(10),
|
|
i = t.getFullYear().toString(10);
|
|
return t.getDate() < 10 && (e = `0${e}`), t.getMonth() < 9 && (a = `0${a}`), `${i}.${a}.${e}`
|
|
}
|
|
|
|
function u(t, e) {
|
|
return null != t && null != e && c(t, e) && t.getDate() === e.getDate()
|
|
}
|
|
|
|
function c(t, e) {
|
|
return null != t && null != e && t.getFullYear() === e.getFullYear() && t.getMonth() === e.getMonth()
|
|
}
|
|
|
|
function h(t, e) {
|
|
var a = new Date(t);
|
|
return a.setDate(a.getDate() + e), a
|
|
}
|
|
|
|
function p(t, e = r.Monday) {
|
|
var a = new Date(t),
|
|
i = a.getDay(),
|
|
o = (i < e ? 7 : 0) + i - e;
|
|
return a.setDate(a.getDate() - o), a
|
|
}
|
|
|
|
function b(t, e = r.Monday) {
|
|
var a = new Date(t),
|
|
i = a.getDay(),
|
|
o = 6 + (i < e ? -7 : 0) - (i - e);
|
|
return a.setDate(a.getDate() + o), a
|
|
}
|
|
|
|
function _(t) {
|
|
return new Date(t.getFullYear(), t.getMonth(), 1)
|
|
}
|
|
|
|
function m(t) {
|
|
return new Date(t.getFullYear(), t.getMonth() + 1, 0)
|
|
}
|
|
|
|
function v(t, e) {
|
|
const a = new Date(t);
|
|
return a.setMonth(e), a
|
|
}
|
|
|
|
function f(t, e) {
|
|
const a = new Date(t);
|
|
return a.setFullYear(e), a
|
|
}
|
|
|
|
function g(t, e, a) {
|
|
return x(t, e, a) === t
|
|
}
|
|
|
|
function x(t, e, a) {
|
|
const i = t.getTime();
|
|
return e && e instanceof Date && i < e.getTime() ? e : a && a instanceof Date && i > a.getTime() ? a : t
|
|
}
|
|
|
|
function y() {
|
|
return Math.random().toString(16).slice(-4)
|
|
}
|
|
|
|
function w(t) {
|
|
return `${t}-${y()}${y()}-${y()}-${y()}-${y()}-${y()}${y()}${y()}`
|
|
}! function (t) {
|
|
t[t.Sunday = 0] = "Sunday", t[t.Monday = 1] = "Monday", t[t.Tuesday = 2] = "Tuesday", t[t.Wednesday = 3] = "Wednesday", t[t.Thursday = 4] = "Thursday", t[t.Friday = 5] = "Friday", t[t.Saturday = 6] = "Saturday"
|
|
}(r || (r = {}));
|
|
const k = ({
|
|
onClick: e,
|
|
dateFormatter: a,
|
|
localization: i,
|
|
name: o,
|
|
formattedValue: d,
|
|
valueAsDate: r,
|
|
value: s,
|
|
identifier: n,
|
|
disabled: l,
|
|
required: u,
|
|
role: c,
|
|
buttonRef: h,
|
|
inputRef: p,
|
|
onInput: b,
|
|
onBlur: _,
|
|
onFocus: m
|
|
}) => t("div", {
|
|
class: "duet-date__input-wrapper"
|
|
}, t("input", {
|
|
class: "duet-date__input",
|
|
value: s,
|
|
placeholder: i.placeholder,
|
|
id: n,
|
|
disabled: l,
|
|
role: c,
|
|
required: !!u || void 0,
|
|
"aria-autocomplete": "none",
|
|
onInput: b,
|
|
onFocus: m,
|
|
onBlur: _,
|
|
autoComplete: "off",
|
|
ref: p
|
|
}), t("input", {
|
|
type: "hidden",
|
|
name: o,
|
|
value: s
|
|
}), t("button", {
|
|
class: "duet-date__toggle",
|
|
onClick: e,
|
|
disabled: l,
|
|
ref: h,
|
|
type: "button"
|
|
}, t("span", {
|
|
class: "duet-date__toggle-icon"
|
|
}, t("svg", {
|
|
"aria-hidden": "true",
|
|
height: "24",
|
|
viewBox: "0 0 21 21",
|
|
width: "24",
|
|
xmlns: "http://www.w3.org/2000/svg"
|
|
}, t("g", {
|
|
fill: "none",
|
|
"fill-rule": "evenodd",
|
|
transform: "translate(2 2)"
|
|
}, t("path", {
|
|
d: "m2.5.5h12c1.1045695 0 2 .8954305 2 2v12c0 1.1045695-.8954305 2-2 2h-12c-1.1045695 0-2-.8954305-2-2v-12c0-1.1045695.8954305-2 2-2z",
|
|
stroke: "currentColor",
|
|
"stroke-linecap": "round",
|
|
"stroke-linejoin": "round"
|
|
}), t("path", {
|
|
d: "m.5 4.5h16",
|
|
stroke: "currentColor",
|
|
"stroke-linecap": "round",
|
|
"stroke-linejoin": "round"
|
|
}), t("g", {
|
|
fill: "currentColor"
|
|
}, t("circle", {
|
|
cx: "8.5",
|
|
cy: "8.5",
|
|
r: "1"
|
|
}), t("circle", {
|
|
cx: "4.5",
|
|
cy: "8.5",
|
|
r: "1"
|
|
}), t("circle", {
|
|
cx: "12.5",
|
|
cy: "8.5",
|
|
r: "1"
|
|
}), t("circle", {
|
|
cx: "8.5",
|
|
cy: "12.5",
|
|
r: "1"
|
|
}), t("circle", {
|
|
cx: "4.5",
|
|
cy: "12.5",
|
|
r: "1"
|
|
}), t("circle", {
|
|
cx: "12.5",
|
|
cy: "12.5",
|
|
r: "1"
|
|
}))))), t("span", {
|
|
class: "duet-date__vhidden"
|
|
}, i.buttonLabel, r && t("span", null, ", ", i.selectedDateMessage, " ", a.format(r))))),
|
|
D = ({
|
|
focusedDay: e,
|
|
today: a,
|
|
day: i,
|
|
onDaySelect: o,
|
|
onKeyboardNavigation: d,
|
|
focusedDayRef: r,
|
|
disabled: s,
|
|
inRange: n,
|
|
isSelected: l,
|
|
dateFormatter: h
|
|
}) => {
|
|
const p = u(i, a),
|
|
b = c(i, e),
|
|
_ = u(i, e),
|
|
m = !n;
|
|
return t("button", {
|
|
class: {
|
|
"duet-date__day": !0, "is-outside": m, "is-today": p, "is-month": b, "is-disabled": s
|
|
},
|
|
tabIndex: _ ? 0 : -1,
|
|
onClick: function (t) {
|
|
o(t, i)
|
|
},
|
|
onKeyDown: d,
|
|
"aria-disabled": s ? "true" : void 0,
|
|
disabled: m,
|
|
type: "button",
|
|
"aria-pressed": l ? "true" : "false",
|
|
"title":h.format(i),
|
|
ref: t => {
|
|
_ && t && r && r(t)
|
|
}
|
|
}, t("span", {
|
|
"aria-hidden": "true"
|
|
}, i.getDate()), t("span", {
|
|
class: "duet-date__vhidden"
|
|
}/*, h.format(i)*/))
|
|
},
|
|
z = ({
|
|
selectedDate: e,
|
|
focusedDate: a,
|
|
labelledById: i,
|
|
localization: o,
|
|
firstDayOfWeek: d,
|
|
min: s,
|
|
max: n,
|
|
dateFormatter: l,
|
|
isDateDisabled: c,
|
|
onDateSelect: v,
|
|
onKeyboardNavigation: f,
|
|
focusedDayRef: x
|
|
}) => {
|
|
const y = new Date,
|
|
w = function (t, e = r.Monday) {
|
|
return function (t, e) {
|
|
const a = [];
|
|
let i = t;
|
|
for (; !u(i, e);) a.push(i), i = h(i, 1);
|
|
return a.push(i), a
|
|
}(p(_(t), e), b(m(t), e))
|
|
}(a, d);
|
|
|
|
/*mt = this.focusedDay.getMonth(),
|
|
yt = this.focusedDay.getFullYear();*/
|
|
|
|
return t("table", {
|
|
class: "duet-date__table",
|
|
"aria-labelledby": i
|
|
},t("caption"),
|
|
t("thead", null, t("tr", null, (z = d, M = e => t("th", {
|
|
class: "duet-date__table-header",
|
|
scope: "col"
|
|
}, t("span", {
|
|
"aria-hidden": "true"
|
|
}, e.substr(0, 2)), t("span", {
|
|
class: "duet-date__vhidden"
|
|
})), (k = o.dayNames).map(((t, e) => M(k[(e + z) % k.length])))))), t("tbody", null, function (t) {
|
|
const e = [];
|
|
for (let a = 0; a < t.length; a += 7) e.push(t.slice(a, a + 7));
|
|
return e
|
|
}(w).map((i => t("tr", {
|
|
class: "duet-date__row"
|
|
}, i.map((i => t("td", {
|
|
class: "duet-date__cell"
|
|
}, t(D, {
|
|
day: i,
|
|
today: y,
|
|
focusedDay: a,
|
|
isSelected: u(i, e),
|
|
disabled: c(i),
|
|
inRange: g(i, s, n),
|
|
onDaySelect: v,
|
|
dateFormatter: l,
|
|
onKeyboardNavigation: f,
|
|
focusedDayRef: x
|
|
})))))))));
|
|
var k, z, M
|
|
},
|
|
M = {
|
|
buttonLabel: "Choose date",
|
|
placeholder: "YYYY-MM-DD",
|
|
selectedDateMessage: "Selected date is",
|
|
prevMonthLabel: "Previous month",
|
|
nextMonthLabel: "Next month",
|
|
monthSelectLabel: "Month",
|
|
yearSelectLabel: "Year",
|
|
closeLabel: "Close window",
|
|
calendarHeading: "Choose a date",
|
|
dayNames: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
|
|
monthNames: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
|
|
monthNamesShort: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
|
|
locale: "en-GB"
|
|
},
|
|
C = {
|
|
parse: n,
|
|
format: l
|
|
},
|
|
F = /[^0-9\.\/\-]+/g,
|
|
L = class {
|
|
constructor(t) {
|
|
e(this, t), this.duetChange = a(this, "duetChange", 7), this.duetBlur = a(this, "duetBlur", 7), this.duetFocus = a(this, "duetFocus", 7), this.duetOpen = a(this, "duetOpen", 7), this.duetClose = a(this, "duetClose", 7), this.monthSelectId = w("DuetDateMonth"), this.yearSelectId = w("DuetDateYear"), this.dialogLabelId = w("DuetDateLabel"), this.initialTouchX = null, this.initialTouchY = null, this.activeFocus = !1, this.focusedDay = new Date, this.open = !1, this.name = "date", this.identifier = "", this.disabled = !1, this.direction = "right", this.required = !1, this.value = "", this.min = "", this.max = "", this.firstDayOfWeek = r.Monday, this.localization = M, this.dateAdapter = C, this.isDateDisabled = () => !1, this.enableActiveFocus = () => {
|
|
this.activeFocus = !0
|
|
}, this.disableActiveFocus = () => {
|
|
this.activeFocus = !1
|
|
}, this.toggleOpen = t => {
|
|
t.preventDefault(), this.open ? this.hide(!1) : this.show();
|
|
}, this.handleEscKey = t => {
|
|
27 === t.keyCode && this.hide()
|
|
}, this.handleBlur = t => {
|
|
t.stopPropagation(), this.duetBlur.emit({
|
|
component: "duet-date-picker"
|
|
})
|
|
}, this.handleFocus = t => {
|
|
t.stopPropagation(), this.duetFocus.emit({
|
|
component: "duet-date-picker"
|
|
})
|
|
}, this.handleTouchStart = t => {
|
|
const e = t.changedTouches[0];
|
|
this.initialTouchX = e.pageX, this.initialTouchY = e.pageY
|
|
}, this.handleTouchMove = t => {
|
|
t.preventDefault()
|
|
}, this.handleTouchEnd = t => {
|
|
const e = t.changedTouches[0],
|
|
a = e.pageX - this.initialTouchX,
|
|
i = e.pageY - this.initialTouchY,
|
|
o = Math.abs(a) >= 70 && Math.abs(i) <= 70,
|
|
d = Math.abs(i) >= 70 && Math.abs(a) <= 70 && i > 0;
|
|
o ? this.addMonths(a < 0 ? 1 : -1) : d && (this.hide(!1), t.preventDefault()), this.initialTouchY = null, this.initialTouchX = null
|
|
}, this.handleNextMonthClick = t => {
|
|
t.preventDefault(), this.addMonths(1)
|
|
}, this.handlePreviousMonthClick = t => {
|
|
t.preventDefault(), this.addMonths(-1)
|
|
}, this.handleFirstFocusableKeydown = t => {
|
|
9 === t.keyCode && t.shiftKey && (this.focusedDayNode.focus(), t.preventDefault())
|
|
}, this.handleKeyboardNavigation = t => {
|
|
if (9 === t.keyCode && !t.shiftKey) return t.preventDefault(), void this.firstFocusableElement.focus();
|
|
var e = !0;
|
|
switch (t.keyCode) {
|
|
case 39:
|
|
this.addDays(1);
|
|
break;
|
|
case 37:
|
|
this.addDays(-1);
|
|
break;
|
|
case 40:
|
|
this.addDays(7);
|
|
break;
|
|
case 38:
|
|
this.addDays(-7);
|
|
break;
|
|
case 33:
|
|
t.shiftKey ? this.addYears(-1) : this.addMonths(-1);
|
|
break;
|
|
case 34:
|
|
t.shiftKey ? this.addYears(1) : this.addMonths(1);
|
|
break;
|
|
case 36:
|
|
this.startOfWeek();
|
|
break;
|
|
case 35:
|
|
this.endOfWeek();
|
|
break;
|
|
default:
|
|
e = !1
|
|
}
|
|
e && (t.preventDefault(), this.enableActiveFocus())
|
|
}, this.handleDaySelect = (t, e) => {
|
|
const a = g(e, n(this.min), n(this.max)),
|
|
i = !this.isDateDisabled(e);
|
|
a && i ? (this.setValue(e), this.hide()) : this.setFocusedDay(e)
|
|
}, this.handleMonthSelect = t => {
|
|
this.setMonth(parseInt(t.target.value, 10))
|
|
}, this.handleYearSelect = t => {
|
|
this.setYear(parseInt(t.target.value, 10))
|
|
}, this.handleInputChange = () => {
|
|
const t = this.datePickerInput;
|
|
! function (t, e) {
|
|
const a = t.value,
|
|
i = t.selectionStart,
|
|
o = a.slice(0, i),
|
|
d = a.slice(i, a.length),
|
|
r = o.replace(e, ""),
|
|
s = r + d.replace(e, ""),
|
|
n = r.length;
|
|
t.value = s, t.selectionStart = t.selectionEnd = n
|
|
}(t, F);
|
|
const e = this.dateAdapter.parse(t.value, s);
|
|
(e || "" === t.value) && this.setValue(e)
|
|
}, this.processFocusedDayNode = t => {
|
|
this.focusedDayNode = t, this.activeFocus && this.open && setTimeout((() => t.focus()), 0);
|
|
}
|
|
}
|
|
connectedCallback() {
|
|
this.createDateFormatters()
|
|
}
|
|
createDateFormatters() {
|
|
this.dateFormatShort = new Intl.DateTimeFormat(this.localization.locale, {
|
|
day: "numeric",
|
|
month: "long"
|
|
}), this.dateFormatLong = new Intl.DateTimeFormat(this.localization.locale, {
|
|
day: "numeric",
|
|
month: "long",
|
|
year: "numeric"
|
|
})
|
|
}
|
|
handleDocumentClick(t) {
|
|
this.open && t.composedPath().every((t => t !== this.dialogWrapperNode && t !== this.datePickerButton)) && this.hide(!1)
|
|
}
|
|
async setFocus() {
|
|
return this.datePickerInput.focus()
|
|
}
|
|
async show() {
|
|
this.open = !0, this.duetOpen.emit({
|
|
component: "duet-date-picker"
|
|
}), this.setFocusedDay(n(this.value) || new Date), clearTimeout(this.focusTimeoutId), this.focusTimeoutId = setTimeout((() => this.monthSelectNode.focus()), 300);
|
|
$(this.dialogWrapperNode).find("caption").text(this.focusedDay.getFullYear()+"년 " + Number(this.focusedDay.getMonth()+1)+"월 달력입니다.");
|
|
}
|
|
async hide(t = !0) {
|
|
this.open = !1, this.duetClose.emit({
|
|
component: "duet-date-picker"
|
|
}), clearTimeout(this.focusTimeoutId), t && setTimeout((() => this.datePickerButton.focus()), 0)
|
|
}
|
|
addDays(t) {
|
|
this.setFocusedDay(h(this.focusedDay, t))
|
|
}
|
|
addMonths(t) {
|
|
this.setMonth(this.focusedDay.getMonth() + t)
|
|
}
|
|
addYears(t) {
|
|
this.setYear(this.focusedDay.getFullYear() + t)
|
|
}
|
|
startOfWeek() {
|
|
this.setFocusedDay(p(this.focusedDay, this.firstDayOfWeek))
|
|
}
|
|
endOfWeek() {
|
|
this.setFocusedDay(b(this.focusedDay, this.firstDayOfWeek))
|
|
}
|
|
setMonth(t) {
|
|
const e = v(_(this.focusedDay), t),
|
|
a = m(e),
|
|
i = v(this.focusedDay, t);
|
|
this.setFocusedDay(x(i, e, a))
|
|
}
|
|
setYear(t) {
|
|
const e = f(_(this.focusedDay), t),
|
|
a = m(e),
|
|
i = f(this.focusedDay, t);
|
|
this.setFocusedDay(x(i, e, a))
|
|
}
|
|
setFocusedDay(t) {
|
|
this.focusedDay = x(t, n(this.min), n(this.max))
|
|
}
|
|
setValue(t) {
|
|
this.value = l(t), this.duetChange.emit({
|
|
component: "duet-date-picker",
|
|
value: this.value,
|
|
valueAsDate: t
|
|
})
|
|
}
|
|
render() {
|
|
const e = n(this.value),
|
|
a = e && this.dateAdapter.format(e),
|
|
o = (e || this.focusedDay).getFullYear(),
|
|
d = this.focusedDay.getMonth(),
|
|
r = this.focusedDay.getFullYear(),
|
|
s = n(this.min),
|
|
l = n(this.max),
|
|
u = null != s && s.getMonth() === d && s.getFullYear() === r,
|
|
c = null != l && l.getMonth() === d && l.getFullYear() === r,
|
|
h = s ? s.getFullYear() : o - 10,
|
|
p = l ? l.getFullYear() : o + 10;
|
|
return t(i, null, t("div", {
|
|
class: "duet-date"
|
|
}, t(k, {
|
|
dateFormatter: this.dateFormatLong,
|
|
value: this.value,
|
|
valueAsDate: e,
|
|
formattedValue: a,
|
|
onInput: this.handleInputChange,
|
|
onBlur: this.handleBlur,
|
|
onFocus: this.handleFocus,
|
|
onClick: this.toggleOpen,
|
|
name: this.name,
|
|
disabled: this.disabled,
|
|
role: this.role,
|
|
required: this.required,
|
|
identifier: this.identifier,
|
|
localization: this.localization,
|
|
buttonRef: t => this.datePickerButton = t,
|
|
inputRef: t => this.datePickerInput = t
|
|
}), t("div", {
|
|
class: {
|
|
"duet-date__dialog": !0, "is-left": "left" === this.direction, "is-active": this.open
|
|
},
|
|
role: "dialog",
|
|
"aria-modal": "true",
|
|
"aria-hidden": this.open ? "false" : "true",
|
|
"aria-labelledby": this.dialogLabelId,
|
|
onTouchMove: this.handleTouchMove,
|
|
onTouchStart: this.handleTouchStart,
|
|
onTouchEnd: this.handleTouchEnd
|
|
}, t("div", {
|
|
class: "duet-date__dialog-content",
|
|
onKeyDown: this.handleEscKey,
|
|
ref: t => this.dialogWrapperNode = t
|
|
}, t("div", {
|
|
class: "duet-date__mobile",
|
|
onFocusin: this.disableActiveFocus
|
|
}, t("label", {
|
|
class: "duet-date__mobile-heading"
|
|
}, this.localization.calendarHeading), t("button", {
|
|
class: "duet-date__close",
|
|
ref: t => this.firstFocusableElement = t,
|
|
onKeyDown: this.handleFirstFocusableKeydown,
|
|
onClick: () => this.hide(),
|
|
type: "button",
|
|
"title" : this.localization.closeLabel
|
|
}, t("svg", {
|
|
"aria-hidden": "true",
|
|
fill: "currentColor",
|
|
xmlns: "http://www.w3.org/2000/svg",
|
|
width: "16",
|
|
height: "16",
|
|
viewBox: "0 0 24 24"
|
|
}, t("path", {
|
|
d: "M0 0h24v24H0V0z",
|
|
fill: "none"
|
|
}), t("path", {
|
|
d: "M18.3 5.71c-.39-.39-1.02-.39-1.41 0L12 10.59 7.11 5.7c-.39-.39-1.02-.39-1.41 0-.39.39-.39 1.02 0 1.41L10.59 12 5.7 16.89c-.39.39-.39 1.02 0 1.41.39.39 1.02.39 1.41 0L12 13.41l4.89 4.89c.39.39 1.02.39 1.41 0 .39-.39.39-1.02 0-1.41L13.41 12l4.89-4.89c.38-.38.38-1.02 0-1.4z"
|
|
})), t("span", {
|
|
class: "duet-date__vhidden"
|
|
}))), t("div", {
|
|
class: "duet-date__header",
|
|
onFocusin: this.disableActiveFocus
|
|
}, t("div", null, /*t("h2", {
|
|
id: this.dialogLabelId,
|
|
class: "duet-date__vhidden",
|
|
"aria-live": "polite",
|
|
"aria-atomic": "true"
|
|
}, this.localization.monthNames[d], " ", this.focusedDay.getFullYear()),*/ t("label", {
|
|
htmlFor: this.monthSelectId,
|
|
class: "duet-date__vhidden",
|
|
}), t("div", {
|
|
class: "duet-date__select"
|
|
}, t("select", {
|
|
id: this.monthSelectId,
|
|
class: "duet-date__select--month",
|
|
"title": this.localization.monthSelectLabel,
|
|
ref: t => this.monthSelectNode = t,
|
|
onChange: this.handleMonthSelect
|
|
}, this.localization.monthNames.map(((e, a) => t("option", {
|
|
key: e,
|
|
value: a,
|
|
selected: a === d,
|
|
disabled: !g(new Date(r, a, 1), s ? _(s) : null, l ? m(l) : null)
|
|
}, e)))), t("div", {
|
|
class: "duet-date__select-label",
|
|
"aria-hidden": "true"
|
|
}, t("span", null, this.localization.monthNamesShort[d]), t("svg", {
|
|
fill: "currentColor",
|
|
xmlns: "http://www.w3.org/2000/svg",
|
|
width: "16",
|
|
height: "16",
|
|
viewBox: "0 0 24 24"
|
|
}, t("path", {
|
|
d: "M8.12 9.29L12 13.17l3.88-3.88c.39-.39 1.02-.39 1.41 0 .39.39.39 1.02 0 1.41l-4.59 4.59c-.39.39-1.02.39-1.41 0L6.7 10.7c-.39-.39-.39-1.02 0-1.41.39-.38 1.03-.39 1.42 0z"
|
|
})))), t("label", {
|
|
htmlFor: this.yearSelectId,
|
|
class: "duet-date__vhidden"
|
|
}), t("div", {
|
|
class: "duet-date__select"
|
|
}, t("select", {
|
|
id: this.yearSelectId,
|
|
class: "duet-date__select--year",
|
|
onChange: this.handleYearSelect,
|
|
"title":this.localization.yearSelectLabel
|
|
}, function (t, e) {
|
|
for (var a = [], i = t; i <= e; i++) a.push(i);
|
|
return a
|
|
}(h, p).map((e => t("option", {
|
|
key: e,
|
|
selected: e === r
|
|
}, e)))), t("div", {
|
|
class: "duet-date__select-label",
|
|
"aria-hidden": "true"
|
|
}, t("span", null, this.focusedDay.getFullYear()), t("svg", {
|
|
fill: "currentColor",
|
|
xmlns: "http://www.w3.org/2000/svg",
|
|
width: "16",
|
|
height: "16",
|
|
viewBox: "0 0 24 24"
|
|
}, t("path", {
|
|
d: "M8.12 9.29L12 13.17l3.88-3.88c.39-.39 1.02-.39 1.41 0 .39.39.39 1.02 0 1.41l-4.59 4.59c-.39.39-1.02.39-1.41 0L6.7 10.7c-.39-.39-.39-1.02 0-1.41.39-.38 1.03-.39 1.42 0z"
|
|
}))))), t("div", {
|
|
class: "duet-date__nav"
|
|
}, t("button", {
|
|
class: "duet-date__prev",
|
|
onClick: this.handlePreviousMonthClick,
|
|
disabled: u,
|
|
type: "button",
|
|
"title":this.localization.prevMonthLabel,
|
|
}, t("svg", {
|
|
"aria-hidden": "true",
|
|
fill: "currentColor",
|
|
xmlns: "http://www.w3.org/2000/svg",
|
|
width: "21",
|
|
height: "21",
|
|
viewBox: "0 0 24 24"
|
|
}, t("path", {
|
|
d: "M14.71 15.88L10.83 12l3.88-3.88c.39-.39.39-1.02 0-1.41-.39-.39-1.02-.39-1.41 0L8.71 11.3c-.39.39-.39 1.02 0 1.41l4.59 4.59c.39.39 1.02.39 1.41 0 .38-.39.39-1.03 0-1.42z"
|
|
})), t("span", {
|
|
class: "duet-date__vhidden"
|
|
})), t("button", {
|
|
class: "duet-date__next",
|
|
onClick: this.handleNextMonthClick,
|
|
disabled: c,
|
|
type: "button",
|
|
"title":this.localization.nextMonthLabel,
|
|
}, t("svg", {
|
|
"aria-hidden": "true",
|
|
fill: "currentColor",
|
|
xmlns: "http://www.w3.org/2000/svg",
|
|
width: "21",
|
|
height: "21",
|
|
viewBox: "0 0 24 24"
|
|
}, t("path", {
|
|
d: "M9.29 15.88L13.17 12 9.29 8.12c-.39-.39-.39-1.02 0-1.41.39-.39 1.02-.39 1.41 0l4.59 4.59c.39.39.39 1.02 0 1.41L10.7 17.3c-.39.39-1.02.39-1.41 0-.38-.39-.39-1.03 0-1.42z"
|
|
})), t("span", {
|
|
class: "duet-date__vhidden"
|
|
})))), t(z, {
|
|
dateFormatter: this.dateFormatShort,
|
|
selectedDate: e,
|
|
focusedDate: this.focusedDay,
|
|
onDateSelect: this.handleDaySelect,
|
|
onKeyboardNavigation: this.handleKeyboardNavigation,
|
|
labelledById: this.dialogLabelId,
|
|
localization: this.localization,
|
|
firstDayOfWeek: this.firstDayOfWeek,
|
|
focusedDayRef: this.processFocusedDayNode,
|
|
min: s,
|
|
max: l,
|
|
isDateDisabled: this.isDateDisabled
|
|
})))))
|
|
}
|
|
get element() {
|
|
return o(this)
|
|
}
|
|
static get watchers() {
|
|
return {
|
|
localization: ["createDateFormatters"]
|
|
}
|
|
}
|
|
};
|
|
L.style = '.duet-date *,.duet-date *::before,.duet-date *::after{box-sizing:border-box;margin:0;width:auto}.duet-date{box-sizing:border-box;color:var(--duet-color-text);display:block;font-family:var(--duet-font);margin:0;position:relative;text-align:left;width:100%}.duet-date__input{-webkit-appearance:none;appearance:none;background:var(--duet-color-surface);border:1px solid var(--duet-color-border, var(--duet-color-text));border-radius:var(--duet-radius);color:var(--duet-color-text);float:none;font-family:var(--duet-font);font-size:100%;line-height:normal;padding:14px 60px 14px 14px;width:100%}.duet-date__input:focus{border-color:var(--duet-color-primary);box-shadow:0 0 0 1px var(--duet-color-primary);outline:0}.duet-date__input::-webkit-input-placeholder{color:var(--duet-color-placeholder);opacity:1}.duet-date__input:-moz-placeholder{color:var(--duet-color-placeholder);opacity:1}.duet-date__input:-ms-input-placeholder{color:var(--duet-color-placeholder)}.duet-date__input-wrapper{position:relative;width:100%}.duet-date__toggle{-moz-appearance:none;-webkit-appearance:none;-webkit-user-select:none;align-items:center;appearance:none;background:var(--duet-color-button);border:0;border-radius:0;border-bottom-right-radius:var(--duet-radius);border-top-right-radius:var(--duet-radius);box-shadow:inset 1px 0 0 rgba(0, 0, 0, 0.1);color:var(--duet-color-text);cursor:pointer;display:flex;height:calc(100% - 2px);justify-content:center;padding:0;position:absolute;right:1px;top:1px;user-select:none;width:48px;z-index:2}.duet-date__toggle:focus{box-shadow:0 0 0 2px var(--duet-color-primary);outline:0}.duet-date__toggle-icon{display:flex;flex-basis:100%;justify-content:center;align-items:center}.duet-date__dialog{display:flex;left:0;min-width:320px;opacity:0;position:absolute;top:100%;transform:scale(0.96) translateZ(0) translateY(-20px);transform-origin:top right;transition:transform 300ms ease, opacity 300ms ease, visibility 300ms ease;visibility:hidden;width:100%;will-change:transform, opacity, visibility;z-index:var(--duet-z-index)}@media (max-width: 35.9375em){.duet-date__dialog{background:var(--duet-color-overlay);bottom:0;position:fixed;right:0;top:0;transform:translateZ(0);transform-origin:bottom center}}.duet-date__dialog.is-left{left:auto;right:0;width:auto}.duet-date__dialog.is-active{opacity:1;transform:scale(1.0001) translateZ(0) translateY(0);visibility:visible}.duet-date__dialog-content{background:var(--duet-color-surface);border:1px solid rgba(0, 0, 0, 0.1);border-radius:var(--duet-radius);box-shadow:0 4px 10px 0 rgba(0, 0, 0, 0.1);margin-left:auto;margin-top:8px;max-width:310px;min-width:290px;padding:16px 16px 20px;position:relative;transform:none;width:100%;z-index:var(--duet-z-index)}@media (max-width: 35.9375em){.duet-date__dialog-content{border:0;border-radius:0;border-top-left-radius:var(--duet-radius);border-top-right-radius:var(--duet-radius);bottom:0;left:0;margin:0;max-width:none;min-height:26em;opacity:0;padding:0 8% 20px;position:absolute;transform:translateZ(0) translateY(100%);transition:transform 400ms ease, opacity 400ms ease, visibility 400ms ease;visibility:hidden;will-change:transform, opacity, visibility}.is-active .duet-date__dialog-content{opacity:1;transform:translateZ(0) translateY(0);visibility:visible}}.duet-date__table{border-collapse:collapse;border-spacing:0;color:var(--duet-color-text);font-size:1rem;font-weight:var(--duet-font-normal);line-height:1.25;text-align:center;width:100%}.duet-date__table-header{font-size:0.75rem;font-weight:var(--duet-font-bold);letter-spacing:1px;line-height:1.25;padding-bottom:8px;text-decoration:none;text-transform:uppercase}.duet-date__cell{text-align:center}.duet-date__day{-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;border-radius:50%;color:var(--duet-color-text);cursor:pointer;display:inline-block;font-family:var(--duet-font);font-size:0.875rem;font-variant-numeric:tabular-nums;font-weight:var(--duet-font-normal);height:36px;line-height:1.25;padding:0 0 1px;position:relative;text-align:center;vertical-align:middle;width:36px;z-index:1}.duet-date__day.is-today{box-shadow:0 0 0 1px var(--duet-color-primary);position:relative;z-index:200}.duet-date__day:hover::before,.duet-date__day.is-today::before{background:var(--duet-color-primary);border-radius:50%;bottom:0;content:"";left:0;opacity:0.06;position:absolute;right:0;top:0}.duet-date__day[aria-pressed=true],.duet-date__day:focus{background:var(--duet-color-primary);box-shadow:none;color:var(--duet-color-text-active);outline:0}.duet-date__day:active{background:var(--duet-color-primary);box-shadow:0 0 5px var(--duet-color-primary);color:var(--duet-color-text-active);z-index:200}.duet-date__day:focus{box-shadow:0 0 5px var(--duet-color-primary);z-index:200}.duet-date__day:not(.is-month){box-shadow:none}.duet-date__day:not(.is-month),.duet-date__day[aria-disabled=true]{background:transparent;color:var(--duet-color-text);cursor:default;opacity:0.5}.duet-date__day[aria-disabled=true].is-today{box-shadow:0 0 0 1px var(--duet-color-primary)}.duet-date__day[aria-disabled=true].is-today:focus{box-shadow:0 0 5px var(--duet-color-primary);background:var(--duet-color-primary);color:var(--duet-color-text-active)}.duet-date__day[aria-disabled=true]:not(.is-today)::before{display:none}.duet-date__day.is-outside{background:var(--duet-color-button);box-shadow:none;color:var(--duet-color-text);cursor:default;opacity:0.6;pointer-events:none}.duet-date__day.is-outside::before{display:none}.duet-date__header{align-items:center;display:flex;justify-content:space-between;margin-bottom:16px;width:100%}.duet-date__nav{white-space:nowrap}.duet-date__prev,.duet-date__next{-moz-appearance:none;-webkit-appearance:none;align-items:center;appearance:none;background:var(--duet-color-button);border:0;border-radius:50%;color:var(--duet-color-text);cursor:pointer;display:inline-flex;height:32px;justify-content:center;margin-left:8px;padding:0;transition:background-color 300ms ease;width:32px}@media (max-width: 35.9375em){.duet-date__prev,.duet-date__next{height:40px;width:40px}}.duet-date__prev:focus,.duet-date__next:focus{box-shadow:0 0 0 2px var(--duet-color-primary);outline:0}.duet-date__prev:active:focus,.duet-date__next:active:focus{box-shadow:none}.duet-date__prev:disabled,.duet-date__next:disabled{cursor:default;opacity:0.5}.duet-date__prev svg,.duet-date__next svg{margin:0 auto}.duet-date__select{display:inline-flex;margin-top:4px;position:relative}.duet-date__select span{margin-right:4px}.duet-date__select select{cursor:pointer;font-size:1rem;height:100%;left:0;opacity:0;position:absolute;top:0;width:100%;z-index:2}.duet-date__select select:focus+.duet-date__select-label{box-shadow:0 0 0 2px var(--duet-color-primary)}.duet-date__select-label{align-items:center;border-radius:var(--duet-radius);color:var(--duet-color-text);display:flex;font-size:1.25rem;font-weight:var(--duet-font-bold);line-height:1.25;padding:0 4px 0 8px;pointer-events:none;position:relative;width:100%;z-index:1}.duet-date__select-label svg{width:16px;height:16px}.duet-date__mobile{align-items:center;border-bottom:1px solid rgba(0, 0, 0, 0.12);display:flex;justify-content:space-between;margin-bottom:20px;margin-left:-10%;overflow:hidden;padding:12px 20px;position:relative;text-overflow:ellipsis;white-space:nowrap;width:120%}@media (min-width: 36em){.duet-date__mobile{border:0;margin:0;overflow:visible;padding:0;position:absolute;right:-8px;top:-8px;width:auto}}.duet-date__mobile-heading{display:inline-block;font-weight:var(--duet-font-bold);max-width:84%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (min-width: 36em){.duet-date__mobile-heading{display:none}}.duet-date__close{-webkit-appearance:none;align-items:center;appearance:none;background:var(--duet-color-button);border:0;border-radius:50%;color:var(--duet-color-text);cursor:pointer;display:flex;height:24px;justify-content:center;padding:0;width:24px}@media (min-width: 36em){.duet-date__close{opacity:0}}.duet-date__close:focus{box-shadow:0 0 0 2px var(--duet-color-primary);outline:none}@media (min-width: 36em){.duet-date__close:focus{opacity:1}}.duet-date__close svg{margin:0 auto}.duet-date__vhidden{border:0;clip:rect(1px, 1px, 1px, 1px);height:1px;overflow:hidden;padding:0;position:absolute;top:0;width:1px}';
|
|
export {
|
|
L as duet_date_picker
|
|
} |