@tabworthy/components 0.6.0 → 0.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/tabworthy-dates-calendar_2.cjs.entry.js +13 -10
- package/dist/collection/components/tabworthy-dates-calendar/tabworthy-dates-calendar.js +13 -10
- package/dist/components/index.d.ts +12 -0
- package/dist/components/index.js +1 -1
- package/dist/components/tabworthy-dates-calendar.js +1 -1
- package/dist/components/tabworthy-dates-calendar2.js +1 -1
- package/dist/components/tabworthy-dates.js +1 -1
- package/dist/components/tabworthy-times.js +1 -1
- package/dist/esm/tabworthy-dates-calendar_2.entry.js +13 -10
- package/dist/tabworthy-components/p-e030bef8.entry.js +1 -0
- package/dist/tabworthy-components/tabworthy-components.esm.js +1 -1
- package/package.json +2 -2
- package/dist/tabworthy-components/p-92257938.entry.js +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxyCustomElement as t,HTMLElement as s,createEvent as e,h as i,Host as a,transformTag as h}from"@stencil/core/internal/client";import{h as r}from"./moment.js";import{g as o,r as n,d}from"./tabworthy-dates-calendar2.js";import{d as l}from"./tabworthy-dates-modal2.js";import{d as c}from"./tabworthy-times-picker2.js";const b={selected:"selected",openCalendar:"Open date and time picker",calendar:"date and time picker",invalidDateError:"We could not find a matching date",minDateError:"Please fill in a date after ",maxDateError:"Please fill in a date before ",rangeOutOfBoundsError:"Please enter a valid range of dates",disabledDateError:"Please choose an available date",to:"to",startDate:"Start date",timeLabel:"Time"},m=t(class extends s{constructor(t){super(),!1!==t&&this.__registerHost(),this.selectDateTime=e(this,"selectDateTime",7),this.changeYear=e(this,"changeYear",7),this.componentReady=e(this,"componentReady",7),this.range=!1,this.label="Choose a date and time",this.placeholder="",this.locale=(null===navigator||void 0===navigator?void 0:navigator.language)||"en-US",this.disabled=!1,this.startDate=o(new Date),this.referenceDate=o(new Date),this.use12HourFormat=!0,this.timesLabels=b,this.inline=!1,this.hasError=!1,this.showYearStepper=!1,this.showMonthStepper=!0,this.showClearButton=!0,this.showTodayButton=!0,this.disableDate=()=>!1,this.elementClassName="tabworthy-times",this.firstDayOfWeek=1,this.format="YYYY-MM-DDTHH:mm:ss",this.inputShouldFormat=!0,this.disableFreeformInput=!1,this.selectedHours=12,this.selectedMinutes=0,this.errorState=this.hasError,this.disabledState=this.disabled,this.errorMessage="",this.handlePickerSelection=async t=>{const s=t.split(",");if(this.range&&2===s.length){const t=n(new Date(s[0])),e=n(new Date(s[1]));this.updateValue([t,e]),this.pickerRef&&(this.pickerRef.value=[t,e])}else{const t=n(new Date(s[0]));this.updateValue(t),this.pickerRef&&(this.pickerRef.value=t)}},this.handleTimeChange=t=>{this.selectedHours=t.detail.hours,this.selectedMinutes=t.detail.minutes,this.selectedDate&&this.updateValue(this.selectedDate)},this.handleCalendarButtonClick=async()=>{this.modalRef&&(await this.modalRef.setTriggerElement(this.calendarButtonRef),await this.modalRef.open())},this.handleYearChange=t=>{this.changeYear&&this.changeYear.emit(t)},this.handleChangedMonths=()=>{},this.handleInputBlur=()=>{this.shouldInputFormat()&&this.formatInput()},this.handleInputChange=t=>{const s=r(t.target.value);s.isValid()&&(this.selectedHours=s.hours(),this.selectedMinutes=s.minutes(),this.updateValue(s.toDate()))}}shouldInputFormat(){return"string"==typeof this.inputShouldFormat?"true"===this.inputShouldFormat:!!this.inputShouldFormat}watchValue(t){this.syncFromValueProp()}watchDisabled(t){this.disabledState=t}watchHasError(t){this.errorState=t}componentDidLoad(){this.syncFromValueProp(),this.componentReady.emit(),this.id||console.error('tabworthy-times: The "id" prop is required for accessibility')}syncFromValueProp(){if(this.value){this.internalValue=this.value;const t=Array.isArray(this.value)?this.value[0]:this.value;if(t){const s=r(t,this.format);s.isValid()&&(this.selectedDate=s.toDate(),this.selectedHours=s.hours(),this.selectedMinutes=s.minutes())}}else this.internalValue=null}updateValue(t){if(Array.isArray(t)){const s=t.map((t=>{const s=r(t);return s.hours(this.selectedHours),s.minutes(this.selectedMinutes),s.seconds(0),s.format(this.format)}));this.internalValue=s,this.value=s,this.selectDateTime.emit(s)}else{const s=r(t);s.hours(this.selectedHours),s.minutes(this.selectedMinutes),s.seconds(0);const e=s.format(this.format);this.internalValue=e,this.value=e,this.selectedDate=t,this.selectDateTime.emit(e)}this.errorState=!1,this.shouldInputFormat()&&this.formatInput()}formatInput(){if(this.internalValue)if(Array.isArray(this.internalValue)){const t=this.internalValue.map((t=>r(t,this.format).format("lll"))).join(` ${this.timesLabels.to} `);this.inputRef.value=t}else this.inputRef.value=r(this.internalValue,this.format).format("lll")}getClassName(t){return`${this.elementClassName}__${t}`}async clearValue(){this.internalValue=null,this.value=void 0,this.selectedDate=void 0,this.inputRef.value="",this.pickerRef&&(this.pickerRef.value=null),this.selectDateTime.emit(void 0)}render(){var t;return i(a,{key:"f5ad31075413f2d2c14751265fdaa2845f695baa",class:this.elementClassName,"has-error":this.errorState,disabled:this.disabledState},i("label",{key:"84e8799efa652f93e6ca56ce5696729441e61319",htmlFor:this.id+"-input",class:this.getClassName("label")},this.label),i("div",{key:"cc3dc9198dbd90a2405938810aebc564b08c2ac3",class:this.getClassName("input-container")},i("input",{key:"1b63faf6d946fa9bad5198d967eb12fd12dbb02d",id:this.id+"-input",ref:t=>this.inputRef=t,type:"text",class:this.getClassName("input"),placeholder:this.placeholder,disabled:this.disabledState||this.disableFreeformInput,value:null===(t=this.internalValue)||void 0===t?void 0:""+t,onBlur:this.handleInputBlur,onChange:this.handleInputChange,"aria-describedby":this.errorState?this.id+"-error":void 0,"aria-invalid":this.errorState}),!this.inline&&i("button",{key:"a9f580d5d5c46334492b9bfef2dcd80d6808e77c",type:"button",ref:t=>this.calendarButtonRef=t,onClick:this.handleCalendarButtonClick,class:this.getClassName("calendar-button"),disabled:this.disabledState},this.calendarButtonContent?i("span",{innerHTML:this.calendarButtonContent}):this.timesLabels.openCalendar)),i("tabworthy-dates-modal",{key:"7fc50538aa0f972999867a6f7175d87bb86ef0d1",label:this.timesLabels.calendar,ref:t=>this.modalRef=t,onOpened:()=>{this.pickerRef&&(this.pickerRef.modalIsOpen=!0)},onClosed:()=>{this.pickerRef&&(this.pickerRef.modalIsOpen=!1)},inline:this.inline},i("div",{key:"014187e74184b02318dea891a36c7c0d4888f4db",class:this.getClassName("picker-container")},i("tabworthy-dates-calendar",{key:"8b35d3640cd1e7c1a30a92c090a41945c807f51f",range:this.range,locale:this.locale,onSelectDate:t=>this.handlePickerSelection(t.detail),onChangeMonth:t=>this.handleChangedMonths(t.detail),onChangeYear:t=>this.handleYearChange(t.detail),labels:this.datesCalendarLabels,ref:t=>this.pickerRef=t,startDate:this.startDate,firstDayOfWeek:this.firstDayOfWeek,showHiddenTitle:!0,disabled:this.disabledState,showMonthStepper:this.showMonthStepper,showYearStepper:this.showYearStepper,showClearButton:this.showClearButton,showTodayButton:this.showTodayButton,disableDate:this.disableDate,minDate:this.minDate,maxDate:this.maxDate,inline:this.inline},i("div",{key:"e7802bd55d717def48fd4ff0093c41bfdd3a9d37",slot:"after-calendar",class:this.getClassName("time-section")},i("tabworthy-times-picker",{key:"4c8e49f3fb82f3b8e9c914fe060b80a5aa76bafe",hours:this.selectedHours,minutes:this.selectedMinutes,use12HourFormat:this.use12HourFormat,disabled:this.disabledState,onTimeChanged:this.handleTimeChange}))))),this.errorState&&i("div",{key:"f83e3028c666e16b065da2c1f1d92c5f157acd16",class:this.getClassName("input-error"),id:this.id?this.id+"-error":void 0,role:"status"},this.errorMessage))}get el(){return this}static get watchers(){return{value:[{watchValue:0}],disabled:[{watchDisabled:0}],hasError:[{watchHasError:0}]}}},[2,"tabworthy-times",{id:[513],value:[1025],range:[4],label:[1],placeholder:[1],locale:[1],disabled:[4],minDate:[1,"min-date"],maxDate:[1,"max-date"],startDate:[1,"start-date"],referenceDate:[1,"reference-date"],use12HourFormat:[4,"use-1-2-hour-format"],timesLabels:[16],datesCalendarLabels:[16],inline:[4],hasError:[1028,"has-error"],showYearStepper:[4,"show-year-stepper"],showMonthStepper:[4,"show-month-stepper"],showClearButton:[4,"show-clear-button"],showTodayButton:[4,"show-today-button"],calendarButtonContent:[1,"calendar-button-content"],disableDate:[16],elementClassName:[1,"element-class-name"],firstDayOfWeek:[2,"first-day-of-week"],format:[1],inputShouldFormat:[8,"input-should-format"],disableFreeformInput:[4,"disable-freeform-input"],internalValue:[32],selectedDate:[32],selectedHours:[32],selectedMinutes:[32],errorState:[32],disabledState:[32],clearValue:[64]},void 0,{value:[{watchValue:0}],disabled:[{watchDisabled:0}],hasError:[{watchHasError:0}]}]),u=m,f=function(){"undefined"!=typeof customElements&&["tabworthy-times","tabworthy-dates-calendar","tabworthy-dates-modal","tabworthy-times-picker"].forEach((t=>{switch(t){case"tabworthy-times":customElements.get(h(t))||customElements.define(h(t),m);break;case"tabworthy-dates-calendar":customElements.get(h(t))||d();break;case"tabworthy-dates-modal":customElements.get(h(t))||l();break;case"tabworthy-times-picker":customElements.get(h(t))||c()}}))};export{u as TabworthyTimes,f as defineCustomElement}
|
|
1
|
+
import{proxyCustomElement as t,HTMLElement as s,createEvent as e,h as i,Host as a,transformTag as h}from"@stencil/core/internal/client";import{h as r}from"./moment.js";import{g as o,r as n,c as d}from"./tabworthy-dates-calendar2.js";import{d as l}from"./tabworthy-dates-modal2.js";import{d as c}from"./tabworthy-times-picker2.js";const b={selected:"selected",openCalendar:"Open date and time picker",calendar:"date and time picker",invalidDateError:"We could not find a matching date",minDateError:"Please fill in a date after ",maxDateError:"Please fill in a date before ",rangeOutOfBoundsError:"Please enter a valid range of dates",disabledDateError:"Please choose an available date",to:"to",startDate:"Start date",timeLabel:"Time"},m=t(class extends s{constructor(t){super(),!1!==t&&this.__registerHost(),this.selectDateTime=e(this,"selectDateTime",7),this.changeYear=e(this,"changeYear",7),this.componentReady=e(this,"componentReady",7),this.range=!1,this.label="Choose a date and time",this.placeholder="",this.locale=(null===navigator||void 0===navigator?void 0:navigator.language)||"en-US",this.disabled=!1,this.startDate=o(new Date),this.referenceDate=o(new Date),this.use12HourFormat=!0,this.timesLabels=b,this.inline=!1,this.hasError=!1,this.showYearStepper=!1,this.showMonthStepper=!0,this.showClearButton=!0,this.showTodayButton=!0,this.disableDate=()=>!1,this.elementClassName="tabworthy-times",this.firstDayOfWeek=1,this.format="YYYY-MM-DDTHH:mm:ss",this.inputShouldFormat=!0,this.disableFreeformInput=!1,this.selectedHours=12,this.selectedMinutes=0,this.errorState=this.hasError,this.disabledState=this.disabled,this.errorMessage="",this.handlePickerSelection=async t=>{const s=t.split(",");if(this.range&&2===s.length){const t=n(new Date(s[0])),e=n(new Date(s[1]));this.updateValue([t,e]),this.pickerRef&&(this.pickerRef.value=[t,e])}else{const t=n(new Date(s[0]));this.updateValue(t),this.pickerRef&&(this.pickerRef.value=t)}},this.handleTimeChange=t=>{this.selectedHours=t.detail.hours,this.selectedMinutes=t.detail.minutes,this.selectedDate&&this.updateValue(this.selectedDate)},this.handleCalendarButtonClick=async()=>{this.modalRef&&(await this.modalRef.setTriggerElement(this.calendarButtonRef),await this.modalRef.open())},this.handleYearChange=t=>{this.changeYear&&this.changeYear.emit(t)},this.handleChangedMonths=()=>{},this.handleInputBlur=()=>{this.shouldInputFormat()&&this.formatInput()},this.handleInputChange=t=>{const s=r(t.target.value);s.isValid()&&(this.selectedHours=s.hours(),this.selectedMinutes=s.minutes(),this.updateValue(s.toDate()))}}shouldInputFormat(){return"string"==typeof this.inputShouldFormat?"true"===this.inputShouldFormat:!!this.inputShouldFormat}watchValue(t){this.syncFromValueProp()}watchDisabled(t){this.disabledState=t}watchHasError(t){this.errorState=t}componentDidLoad(){this.syncFromValueProp(),this.componentReady.emit(),this.id||console.error('tabworthy-times: The "id" prop is required for accessibility')}syncFromValueProp(){if(this.value){this.internalValue=this.value;const t=Array.isArray(this.value)?this.value[0]:this.value;if(t){const s=r(t,this.format);s.isValid()&&(this.selectedDate=s.toDate(),this.selectedHours=s.hours(),this.selectedMinutes=s.minutes())}}else this.internalValue=null}updateValue(t){if(Array.isArray(t)){const s=t.map((t=>{const s=r(t);return s.hours(this.selectedHours),s.minutes(this.selectedMinutes),s.seconds(0),s.format(this.format)}));this.internalValue=s,this.value=s,this.selectDateTime.emit(s)}else{const s=r(t);s.hours(this.selectedHours),s.minutes(this.selectedMinutes),s.seconds(0);const e=s.format(this.format);this.internalValue=e,this.value=e,this.selectedDate=t,this.selectDateTime.emit(e)}this.errorState=!1,this.shouldInputFormat()&&this.formatInput()}formatInput(){if(this.internalValue)if(Array.isArray(this.internalValue)){const t=this.internalValue.map((t=>r(t,this.format).format("lll"))).join(` ${this.timesLabels.to} `);this.inputRef.value=t}else this.inputRef.value=r(this.internalValue,this.format).format("lll")}getClassName(t){return`${this.elementClassName}__${t}`}async clearValue(){this.internalValue=null,this.value=void 0,this.selectedDate=void 0,this.inputRef.value="",this.pickerRef&&(this.pickerRef.value=null),this.selectDateTime.emit(void 0)}render(){var t;return i(a,{key:"f5ad31075413f2d2c14751265fdaa2845f695baa",class:this.elementClassName,"has-error":this.errorState,disabled:this.disabledState},i("label",{key:"84e8799efa652f93e6ca56ce5696729441e61319",htmlFor:this.id+"-input",class:this.getClassName("label")},this.label),i("div",{key:"cc3dc9198dbd90a2405938810aebc564b08c2ac3",class:this.getClassName("input-container")},i("input",{key:"1b63faf6d946fa9bad5198d967eb12fd12dbb02d",id:this.id+"-input",ref:t=>this.inputRef=t,type:"text",class:this.getClassName("input"),placeholder:this.placeholder,disabled:this.disabledState||this.disableFreeformInput,value:null===(t=this.internalValue)||void 0===t?void 0:""+t,onBlur:this.handleInputBlur,onChange:this.handleInputChange,"aria-describedby":this.errorState?this.id+"-error":void 0,"aria-invalid":this.errorState}),!this.inline&&i("button",{key:"a9f580d5d5c46334492b9bfef2dcd80d6808e77c",type:"button",ref:t=>this.calendarButtonRef=t,onClick:this.handleCalendarButtonClick,class:this.getClassName("calendar-button"),disabled:this.disabledState},this.calendarButtonContent?i("span",{innerHTML:this.calendarButtonContent}):this.timesLabels.openCalendar)),i("tabworthy-dates-modal",{key:"7fc50538aa0f972999867a6f7175d87bb86ef0d1",label:this.timesLabels.calendar,ref:t=>this.modalRef=t,onOpened:()=>{this.pickerRef&&(this.pickerRef.modalIsOpen=!0)},onClosed:()=>{this.pickerRef&&(this.pickerRef.modalIsOpen=!1)},inline:this.inline},i("div",{key:"014187e74184b02318dea891a36c7c0d4888f4db",class:this.getClassName("picker-container")},i("tabworthy-dates-calendar",{key:"8b35d3640cd1e7c1a30a92c090a41945c807f51f",range:this.range,locale:this.locale,onSelectDate:t=>this.handlePickerSelection(t.detail),onChangeMonth:t=>this.handleChangedMonths(t.detail),onChangeYear:t=>this.handleYearChange(t.detail),labels:this.datesCalendarLabels,ref:t=>this.pickerRef=t,startDate:this.startDate,firstDayOfWeek:this.firstDayOfWeek,showHiddenTitle:!0,disabled:this.disabledState,showMonthStepper:this.showMonthStepper,showYearStepper:this.showYearStepper,showClearButton:this.showClearButton,showTodayButton:this.showTodayButton,disableDate:this.disableDate,minDate:this.minDate,maxDate:this.maxDate,inline:this.inline},i("div",{key:"e7802bd55d717def48fd4ff0093c41bfdd3a9d37",slot:"after-calendar",class:this.getClassName("time-section")},i("tabworthy-times-picker",{key:"4c8e49f3fb82f3b8e9c914fe060b80a5aa76bafe",hours:this.selectedHours,minutes:this.selectedMinutes,use12HourFormat:this.use12HourFormat,disabled:this.disabledState,onTimeChanged:this.handleTimeChange}))))),this.errorState&&i("div",{key:"f83e3028c666e16b065da2c1f1d92c5f157acd16",class:this.getClassName("input-error"),id:this.id?this.id+"-error":void 0,role:"status"},this.errorMessage))}get el(){return this}static get watchers(){return{value:[{watchValue:0}],disabled:[{watchDisabled:0}],hasError:[{watchHasError:0}]}}},[2,"tabworthy-times",{id:[513],value:[1025],range:[4],label:[1],placeholder:[1],locale:[1],disabled:[4],minDate:[1,"min-date"],maxDate:[1,"max-date"],startDate:[1,"start-date"],referenceDate:[1,"reference-date"],use12HourFormat:[4,"use-1-2-hour-format"],timesLabels:[16],datesCalendarLabels:[16],inline:[4],hasError:[1028,"has-error"],showYearStepper:[4,"show-year-stepper"],showMonthStepper:[4,"show-month-stepper"],showClearButton:[4,"show-clear-button"],showTodayButton:[4,"show-today-button"],calendarButtonContent:[1,"calendar-button-content"],disableDate:[16],elementClassName:[1,"element-class-name"],firstDayOfWeek:[2,"first-day-of-week"],format:[1],inputShouldFormat:[8,"input-should-format"],disableFreeformInput:[4,"disable-freeform-input"],internalValue:[32],selectedDate:[32],selectedHours:[32],selectedMinutes:[32],errorState:[32],disabledState:[32],clearValue:[64]},void 0,{value:[{watchValue:0}],disabled:[{watchDisabled:0}],hasError:[{watchHasError:0}]}]),u=m,f=function(){"undefined"!=typeof customElements&&["tabworthy-times","tabworthy-dates-calendar","tabworthy-dates-modal","tabworthy-times-picker"].forEach((t=>{switch(t){case"tabworthy-times":customElements.get(h(t))||customElements.define(h(t),m);break;case"tabworthy-dates-calendar":customElements.get(h(t))||d();break;case"tabworthy-dates-modal":customElements.get(h(t))||l();break;case"tabworthy-times-picker":customElements.get(h(t))||c()}}))};export{u as TabworthyTimes,f as defineCustomElement}
|
|
@@ -50,13 +50,13 @@ const InclusiveDatesCalendar = class {
|
|
|
50
50
|
this.updateCurrentDate(getNextMonth(this.currentDate));
|
|
51
51
|
};
|
|
52
52
|
this.nextYear = () => {
|
|
53
|
-
this.updateCurrentDate(getNextYear(this.currentDate));
|
|
53
|
+
this.updateCurrentDate(getNextYear(this.currentDate), false, true);
|
|
54
54
|
};
|
|
55
55
|
this.previousMonth = () => {
|
|
56
56
|
this.updateCurrentDate(getPreviousMonth(this.currentDate));
|
|
57
57
|
};
|
|
58
58
|
this.previousYear = () => {
|
|
59
|
-
this.updateCurrentDate(getPreviousYear(this.currentDate));
|
|
59
|
+
this.updateCurrentDate(getPreviousYear(this.currentDate), false, true);
|
|
60
60
|
};
|
|
61
61
|
this.showToday = () => {
|
|
62
62
|
this.updateCurrentDate(new Date(), true);
|
|
@@ -241,8 +241,8 @@ const InclusiveDatesCalendar = class {
|
|
|
241
241
|
((_a = this.el
|
|
242
242
|
.querySelector(`[data-date="${getISODateString(date)}"]`)) === null || _a === void 0 ? void 0 : _a.focus());
|
|
243
243
|
}
|
|
244
|
-
updateCurrentDate(date, moveFocus) {
|
|
245
|
-
var _a, _b;
|
|
244
|
+
updateCurrentDate(date, moveFocus, emitChangeYear = false) {
|
|
245
|
+
var _a, _b, _c;
|
|
246
246
|
const month = date.getMonth();
|
|
247
247
|
const year = date.getFullYear();
|
|
248
248
|
if (!dateIsWithinLowerBounds(date, this.minDate))
|
|
@@ -261,6 +261,9 @@ const InclusiveDatesCalendar = class {
|
|
|
261
261
|
if (moveFocus) {
|
|
262
262
|
this.focusDate(this.currentDate);
|
|
263
263
|
}
|
|
264
|
+
if (emitChangeYear) {
|
|
265
|
+
(_c = this.changeYear) === null || _c === void 0 ? void 0 : _c.emit({ year: getYear(date) });
|
|
266
|
+
}
|
|
264
267
|
}
|
|
265
268
|
onSelectDate(date) {
|
|
266
269
|
var _a, _b, _c, _d;
|
|
@@ -313,15 +316,15 @@ const InclusiveDatesCalendar = class {
|
|
|
313
316
|
monthIsDisabled(getNextMonth(this.currentDate).getMonth(), getNextMonth(this.currentDate).getFullYear(), this.minDate, this.maxDate)
|
|
314
317
|
}
|
|
315
318
|
};
|
|
316
|
-
return (h(Host, { key: '
|
|
319
|
+
return (h(Host, { key: 'cc8676fdeec05b5635c367353e7bb1b8c997dedd' }, h("div", { key: '4a4efc949f954772a55dad16e507a938b0308130', class: {
|
|
317
320
|
[`${this.getClassName()}-wrapper`]: true,
|
|
318
321
|
[`${this.getClassName()}-wrapper--inline`]: this.inline
|
|
319
|
-
} }, h("div", { key: '
|
|
322
|
+
} }, h("div", { key: 'de0afeccacba5e76162a4d22041f3b65983e77fe', class: {
|
|
320
323
|
[this.getClassName()]: true,
|
|
321
324
|
[`${this.getClassName()}--disabled`]: this.disabled
|
|
322
|
-
} }, h("div", { key: '
|
|
325
|
+
} }, h("div", { key: 'e8ed89a15cd32f629e559c9e9922c97816aff70c', class: this.getClassName("header") }, this.showHiddenTitle && (h("span", { key: '8a922cf4df9ee3f87a673cfaf2d04fe539305bbe', "aria-atomic": "true", "aria-live": "polite", class: "visually-hidden" }, this.getTitle())), this.showYearStepper && (h("button", { key: '225e73d3b12646781661d28057f4d9611e624c69', "aria-label": this.labels.previousYearButton, class: this.getClassName("previous-year-button"), "aria-disabled": disabled.year.prev, innerHTML: this.previousYearButtonContent || undefined, onClick: this.previousYear, type: "button" }, h("svg", { key: 'e0fd3f0d41f596b450642eb9c27c5958feb7ba30', fill: "none", height: "24", "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", stroke: "currentColor", viewBox: "0 0 24 24", width: "24" }, h("polyline", { key: '85735b11b068015e671f550639ded6193dfbab28', points: "11 17 6 12 11 7" }), h("polyline", { key: '19c3ffcbb7b98261be4b309a2bbbaa826ea1ad73', points: "18 17 13 12 18 7" })))), this.showMonthStepper && (h("button", { key: '4b687ad0f92198cb9a324b8c0d380ae0a31f2346', "aria-label": this.labels.previousMonthButton, class: this.getClassName("previous-month-button"), "aria-disabled": disabled.month.prev, innerHTML: this.previousMonthButtonContent || undefined, onClick: this.previousMonth, type: "button" }, h("svg", { key: 'a1931a36fddf8a84cc8f4d367b34b8b59d03cc09', fill: "none", height: "24", "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", stroke: "currentColor", viewBox: "0 0 24 24", width: "24" }, h("polyline", { key: 'e053a2405fb992e9eaeddf114b8da460b41ade13', points: "15 18 9 12 15 6" })))), h("span", { key: 'fbf8feee129211cf10f611c879288d76f7456c9d', class: this.getClassName("current-month") }, h("select", { key: 'ca2826280a1ab8065551fa908d40f96cc04d5464', "aria-label": this.labels.monthSelect, class: this.getClassName("month-select"), "aria-disabled": this.disabled, name: "month", onChange: this.onMonthSelect }, getMonths(this.locale).map((month, index) => {
|
|
323
326
|
return (h("option", { key: month, selected: this.currentDate.getMonth() === index, value: index + 1, disabled: monthIsDisabled(index, this.currentDate.getFullYear(), this.minDate, this.maxDate) }, month));
|
|
324
|
-
})), h("input", { key: '
|
|
327
|
+
})), h("input", { key: 'b3f5b2dabeb38734d3602ac8aaff56a7d5a49393', "aria-label": this.labels.yearSelect, class: this.getClassName("year-select"), "aria-disabled": this.disabled, max: this.maxDate ? this.maxDate.slice(0, 4) : 9999, min: this.minDate ? this.minDate.slice(0, 4) : 1, name: "year", onChange: this.onYearSelect, type: "number", value: this.currentDate.getFullYear() })), this.showMonthStepper && (h("button", { key: '9312dc20b70fbda5bd86f25b230665a8f7f75386', "aria-label": this.labels.nextMonthButton, class: this.getClassName("next-month-button"), "aria-disabled": disabled.month.next, innerHTML: this.nextMonthButtonContent || undefined, onClick: this.nextMonth, type: "button" }, h("svg", { key: '82f1f31e919a2e316941824c0b0d59c5a1852f73', fill: "none", height: "24", "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", stroke: "currentColor", viewBox: "0 0 24 24", width: "24" }, h("polyline", { key: '3365487b15f4149b5ae035ca1f1364396c133ef0', points: "9 18 15 12 9 6" })))), this.showYearStepper && (h("button", { key: 'e83b33e034ee0fbd49e8aab90e1716ada40d2f19', "aria-label": this.labels.nextYearButton, class: this.getClassName("next-year-button"), "aria-disabled": disabled.year.next, innerHTML: this.nextYearButtonContent || undefined, onClick: this.nextYear, type: "button" }, h("svg", { key: '32b65eb085653d5c62e60262fc87f59b6d105e57', fill: "none", height: "24", "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", stroke: "currentColor", viewBox: "0 0 24 24", width: "24" }, h("polyline", { key: 'eaa98641ba48a322fd7b3ac953d13104bb63aad3', points: "13 17 18 12 13 7" }), h("polyline", { key: '89b7de7ec2e24a01a808e885ac68a11c3779f9c2', points: "6 17 11 12 6 7" }))))), h("div", { key: 'a21c8a94b1ae0e5b66074d2ca956afac456f366f', class: this.getClassName("body") }, h("table", { key: '2968d8355122e3eb18de35b4c72d2404794f62e6', class: this.getClassName("calendar"), onKeyDown: this.onKeyDown, role: "grid", "aria-label": this.getTitle() }, h("thead", { key: '568a00357a3e64e692c80d90739c560513239c1d', class: this.getClassName("calendar-header") }, h("tr", { key: '4e80bf075ad630237b5ea156267a0c0d9d4f0423', class: this.getClassName("weekday-row") }, (_a = this.weekdays) === null || _a === void 0 ? void 0 : _a.map((weekday) => (h("th", { role: "columnheader", abbr: weekday[1], class: this.getClassName("weekday"), key: weekday[0], scope: "col" }, h("span", { "aria-hidden": "true" }, weekday[0]), h("span", { class: "visually-hidden" }, weekday[1])))))), h("tbody", { key: '26dfbb76ab92d065ab5f38b7135fced7738ca4a7' }, this.getCalendarRows().map((calendarRow) => {
|
|
325
328
|
const rowKey = `row-${calendarRow[0].getMonth()}-${calendarRow[0].getDate()}`;
|
|
326
329
|
return (h("tr", { class: this.getClassName("calendar-row"), key: rowKey }, calendarRow.map((day) => {
|
|
327
330
|
var _a, _b, _c;
|
|
@@ -388,8 +391,8 @@ const InclusiveDatesCalendar = class {
|
|
|
388
391
|
? 0
|
|
389
392
|
: -1 }, h(Tag, { "aria-hidden": "true" }, day.getDate()), h("span", { class: "visually-hidden" }, getScreenReaderText())));
|
|
390
393
|
})));
|
|
391
|
-
})))), showFooter && (h("div", { key: '
|
|
392
|
-
!window.matchMedia("(pointer: coarse)").matches && (h("button", { key: '
|
|
394
|
+
})))), showFooter && (h("div", { key: '102ea99b292e7a028692615c68be2e8c5720913c', class: this.getClassName("footer") }, h("div", { key: '6e1d52da734e986a9044847edd7ace16460605f2', class: this.getClassName("footer-buttons") }, this.showTodayButton && (h("button", { key: '9508eadf9835bea2e1640e6ac622665bd19da4d8', class: this.getClassName("today-button"), disabled: this.disabled, innerHTML: this.todayButtonContent || undefined, onClick: this.showToday, type: "button" }, this.labels.todayButton)), this.showClearButton && (h("button", { key: '262b926076309bc44d5b36dd64217196b4d6e8e2', class: this.getClassName("clear-button"), disabled: this.disabled, innerHTML: this.clearButtonContent || undefined, onClick: this.clear, type: "button" }, this.labels.clearButton))), this.showKeyboardHint &&
|
|
395
|
+
!window.matchMedia("(pointer: coarse)").matches && (h("button", { key: '09c974e2b246f57381e0461dbb27eb83e523812d', type: "button", onClick: () => alert("Todo: Add Keyboard helper!"), class: this.getClassName("keyboard-hint") }, h("svg", { key: '4dd5a8ce6e5c96e79adf6d8b0308b56fae5be361', xmlns: "http://www.w3.org/2000/svg", height: "1em", width: "1em", viewBox: "0 0 48 48", fill: "currentColor" }, h("path", { key: 'f3378678d6a0dc9fe7ea9ffd42dc083c3dca5ec8', d: "M7 38q-1.2 0-2.1-.925Q4 36.15 4 35V13q0-1.2.9-2.1.9-.9 2.1-.9h34q1.2 0 2.1.9.9.9.9 2.1v22q0 1.15-.9 2.075Q42.2 38 41 38Zm0-3h34V13H7v22Zm8-3.25h18v-3H15Zm-4.85-6.25h3v-3h-3Zm6.2 0h3v-3h-3Zm6.15 0h3v-3h-3Zm6.2 0h3v-3h-3Zm6.15 0h3v-3h-3Zm-24.7-6.25h3v-3h-3Zm6.2 0h3v-3h-3Zm6.15 0h3v-3h-3Zm6.2 0h3v-3h-3Zm6.15 0h3v-3h-3ZM7 35V13v22Z" })), this.labels.keyboardHint))))), h("slot", { key: 'ec9b51b9aaf6c48e643120115dbc7f418e9fb8e4', name: "after-calendar" }))));
|
|
393
396
|
}
|
|
394
397
|
get el() { return getElement(this); }
|
|
395
398
|
static get watchers() { return {
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as t,c as e,h as i,H as s,g as a}from"./p-zgp3PkTz.js";import{g as h,r as n,a as o,b as d,c as r,d as c,e as l,f as u,h as b,s as f,i as v,j as y,k as p,l as k,m as w,n as m,o as g,p as D,q as M,t as x,u as C,v as A,w as L}from"./p-BVHu5CWV.js";const T={clearButton:"Clear value",monthSelect:"Select month",nextMonthButton:"Next month",nextYearButton:"Next year",picker:"Choose date",previousMonthButton:"Previous month",previousYearButton:"Previous year",todayButton:"Show today",yearSelect:"Select year",keyboardHint:"Keyboard commands",selected:"Selected date",chooseAsStartDate:"choose as start date",chooseAsEndDate:"choose as end date"},H=class{constructor(i){t(this,i),this.selectDate=e(this,"selectDate",3),this.changeMonth=e(this,"changeMonth",3),this.changeYear=e(this,"changeYear",3),this.disabled=!1,this.modalIsOpen=!1,this.disableDate=()=>!1,this.elementClassName="tabworthy-dates-calendar",this.firstDayOfWeek=0,this.range=!1,this.labels=T,this.locale=(null===navigator||void 0===navigator?void 0:navigator.language)||"en-US",this.inline=!1,this.showClearButton=!1,this.showMonthStepper=!0,this.showTodayButton=!0,this.showYearStepper=!1,this.showKeyboardHint=!1,this.showHiddenTitle=!0,this.startDate=h(new Date),this.init=()=>{this.currentDate=this.startDate?n(new Date(this.startDate)):new Date,this.updateWeekdays()},this.nextMonth=()=>{this.updateCurrentDate(o(this.currentDate))},this.nextYear=()=>{this.updateCurrentDate(d(this.currentDate),!1,!0)},this.previousMonth=()=>{this.updateCurrentDate(r(this.currentDate))},this.previousYear=()=>{this.updateCurrentDate(c(this.currentDate),!1,!0)},this.showToday=()=>{this.updateCurrentDate(new Date,!0)},this.clear=()=>{var t;this.value=void 0,null===(t=this.selectDate)||void 0===t||t.emit(void 0)},this.onClick=t=>{if(this.disabled)return;const e=t.target.closest("[data-date]");if(!Boolean(e))return;const i=n(new Date(e.dataset.date));this.updateCurrentDate(i),this.onSelectDate(i)},this.onMonthSelect=t=>{const e=+t.target.value-1,i=new Date(this.currentDate);l(i,this.minDate,this.maxDate)&&(i.setMonth(e),this.updateCurrentDate(i))},this.onYearSelect=t=>{var e;const i=+t.target.value,s=new Date(this.currentDate);l(s,this.minDate,this.maxDate)&&(s.setFullYear(i),null===(e=this.changeYear)||void 0===e||e.emit({year:i}),this.updateCurrentDate(s))},this.onKeyDown=t=>{this.disabled||("ArrowLeft"===t.code?(t.preventDefault(),this.updateCurrentDate(u(this.currentDate),!0)):"ArrowRight"===t.code?(t.preventDefault(),this.updateCurrentDate(b(this.currentDate),!0)):"ArrowUp"===t.code?(t.preventDefault(),this.updateCurrentDate(f(this.currentDate,7),!0)):"ArrowDown"===t.code?(t.preventDefault(),this.updateCurrentDate(v(this.currentDate,7),!0)):"PageUp"===t.code?(t.preventDefault(),this.updateCurrentDate(t.shiftKey?c(this.currentDate):r(this.currentDate),!0)):"PageDown"===t.code?(t.preventDefault(),this.updateCurrentDate(t.shiftKey?d(this.currentDate):o(this.currentDate),!0)):"Home"===t.code?(t.preventDefault(),this.updateCurrentDate(y(this.currentDate),!0)):"End"===t.code?(t.preventDefault(),this.updateCurrentDate(p(this.currentDate),!0)):"Space"!==t.code&&"Enter"!==t.code||(t.preventDefault(),this.onSelectDate(this.currentDate)))},this.onMouseEnter=t=>{var e;if(this.disabled)return;const i=n(new Date(null===(e=t.target.closest("td"))||void 0===e?void 0:e.dataset.date));this.hoveredDate=i},this.onMouseLeave=()=>{this.hoveredDate=void 0}}componentWillLoad(){this.init()}watchModalIsOpen(){!0===this.modalIsOpen&&(this.moveFocusOnModalOpen=!0)}watchFirstDayOfWeek(){this.updateWeekdays()}watchLocale(){Boolean(this.locale)||(this.locale=(null===navigator||void 0===navigator?void 0:navigator.language)||"en-US"),this.updateWeekdays()}watchRange(){var t;this.value=void 0,null===(t=this.selectDate)||void 0===t||t.emit(void 0)}watchStartDate(){this.currentDate=this.startDate?n(new Date(this.startDate)):new Date}watchValue(){Boolean(this.value)&&(Array.isArray(this.value)&&this.value.length>=1?this.currentDate=this.value[0]:this.value instanceof Date&&(this.currentDate=this.value))}componentDidRender(){this.moveFocusAfterMonthChanged&&(this.focusDate(this.currentDate),this.moveFocusAfterMonthChanged=!1),this.moveFocusOnModalOpen&&setTimeout((()=>{this.focusDate(this.currentDate),this.moveFocusOnModalOpen=!1}),100)}updateWeekdays(){this.weekdays=k(this.firstDayOfWeek,this.locale)}getClassName(t){return Boolean(t)?`${this.elementClassName}__${t}`:this.elementClassName}getCalendarRows(){const t=w(this.currentDate,!0,0===this.firstDayOfWeek?7:this.firstDayOfWeek),e=[];for(let i=0;i<t.length;i+=7){const s=t.slice(i,i+7);e.push(s)}return e}getTitle(){if(Boolean(this.currentDate))return Intl.DateTimeFormat(this.locale,{month:"long",year:"numeric"}).format(this.currentDate)}focusDate(t){var e;t&&(null===(e=this.el.querySelector(`[data-date="${h(t)}"]`))||void 0===e||e.focus())}updateCurrentDate(t,e,i=!1){var s,a,h;const n=t.getMonth(),o=t.getFullYear();m(t,this.minDate)||(t=new Date(this.minDate)),g(t,this.maxDate)||(t=new Date(this.maxDate)),(n!==(null===(s=this.currentDate)||void 0===s?void 0:s.getMonth())||o!==this.currentDate.getFullYear())&&(null===(a=this.changeMonth)||void 0===a||a.emit({month:M(t),year:D(t)}),e&&(this.moveFocusAfterMonthChanged=!0)),this.currentDate=t,e&&this.focusDate(this.currentDate),i&&(null===(h=this.changeYear)||void 0===h||h.emit({year:D(t)}))}onSelectDate(t){var e,i,s,a;if(!this.disableDate(t)&&l(t,this.minDate,this.maxDate))if(this.isRangeValue(this.value)){const s=void 0===(null===(e=this.value)||void 0===e?void 0:e[0])||2===this.value.length?[t]:[this.value[0],t];2===s.length&&s[0]>s[1]&&s.reverse();const a=void 0===s[1]?[h(s[0])]:[h(s[0]),h(s[1])];this.value=s,null===(i=this.selectDate)||void 0===i||i.emit(a)}else{if((null===(s=this.value)||void 0===s?void 0:s.getTime())===t.getTime())return;this.value=t,null===(a=this.selectDate)||void 0===a||a.emit(h(t))}}isRangeValue(t){return!!this.range}render(){var t;const e=this.showTodayButton||this.showClearButton||this.showKeyboardHint,a={year:{prev:this.disabled||!!this.minDate&&new Date(this.minDate).getFullYear()>c(this.currentDate).getFullYear(),next:this.disabled||!!this.maxDate&&new Date(this.maxDate).getFullYear()<d(this.currentDate).getFullYear()},month:{prev:this.disabled||x(r(this.currentDate).getMonth(),r(this.currentDate).getFullYear(),this.minDate,this.maxDate),next:this.disabled||x(o(this.currentDate).getMonth(),o(this.currentDate).getFullYear(),this.minDate,this.maxDate)}};return i(s,{key:"cc8676fdeec05b5635c367353e7bb1b8c997dedd"},i("div",{key:"4a4efc949f954772a55dad16e507a938b0308130",class:{[`${this.getClassName()}-wrapper`]:!0,[`${this.getClassName()}-wrapper--inline`]:this.inline}},i("div",{key:"de0afeccacba5e76162a4d22041f3b65983e77fe",class:{[this.getClassName()]:!0,[`${this.getClassName()}--disabled`]:this.disabled}},i("div",{key:"e8ed89a15cd32f629e559c9e9922c97816aff70c",class:this.getClassName("header")},this.showHiddenTitle&&i("span",{key:"8a922cf4df9ee3f87a673cfaf2d04fe539305bbe","aria-atomic":"true","aria-live":"polite",class:"visually-hidden"},this.getTitle()),this.showYearStepper&&i("button",{key:"225e73d3b12646781661d28057f4d9611e624c69","aria-label":this.labels.previousYearButton,class:this.getClassName("previous-year-button"),"aria-disabled":a.year.prev,innerHTML:this.previousYearButtonContent||void 0,onClick:this.previousYear,type:"button"},i("svg",{key:"e0fd3f0d41f596b450642eb9c27c5958feb7ba30",fill:"none",height:"24","stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",stroke:"currentColor",viewBox:"0 0 24 24",width:"24"},i("polyline",{key:"85735b11b068015e671f550639ded6193dfbab28",points:"11 17 6 12 11 7"}),i("polyline",{key:"19c3ffcbb7b98261be4b309a2bbbaa826ea1ad73",points:"18 17 13 12 18 7"}))),this.showMonthStepper&&i("button",{key:"4b687ad0f92198cb9a324b8c0d380ae0a31f2346","aria-label":this.labels.previousMonthButton,class:this.getClassName("previous-month-button"),"aria-disabled":a.month.prev,innerHTML:this.previousMonthButtonContent||void 0,onClick:this.previousMonth,type:"button"},i("svg",{key:"a1931a36fddf8a84cc8f4d367b34b8b59d03cc09",fill:"none",height:"24","stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",stroke:"currentColor",viewBox:"0 0 24 24",width:"24"},i("polyline",{key:"e053a2405fb992e9eaeddf114b8da460b41ade13",points:"15 18 9 12 15 6"}))),i("span",{key:"fbf8feee129211cf10f611c879288d76f7456c9d",class:this.getClassName("current-month")},i("select",{key:"ca2826280a1ab8065551fa908d40f96cc04d5464","aria-label":this.labels.monthSelect,class:this.getClassName("month-select"),"aria-disabled":this.disabled,name:"month",onChange:this.onMonthSelect},C(this.locale).map(((t,e)=>i("option",{key:t,selected:this.currentDate.getMonth()===e,value:e+1,disabled:x(e,this.currentDate.getFullYear(),this.minDate,this.maxDate)},t)))),i("input",{key:"b3f5b2dabeb38734d3602ac8aaff56a7d5a49393","aria-label":this.labels.yearSelect,class:this.getClassName("year-select"),"aria-disabled":this.disabled,max:this.maxDate?this.maxDate.slice(0,4):9999,min:this.minDate?this.minDate.slice(0,4):1,name:"year",onChange:this.onYearSelect,type:"number",value:this.currentDate.getFullYear()})),this.showMonthStepper&&i("button",{key:"9312dc20b70fbda5bd86f25b230665a8f7f75386","aria-label":this.labels.nextMonthButton,class:this.getClassName("next-month-button"),"aria-disabled":a.month.next,innerHTML:this.nextMonthButtonContent||void 0,onClick:this.nextMonth,type:"button"},i("svg",{key:"82f1f31e919a2e316941824c0b0d59c5a1852f73",fill:"none",height:"24","stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",stroke:"currentColor",viewBox:"0 0 24 24",width:"24"},i("polyline",{key:"3365487b15f4149b5ae035ca1f1364396c133ef0",points:"9 18 15 12 9 6"}))),this.showYearStepper&&i("button",{key:"e83b33e034ee0fbd49e8aab90e1716ada40d2f19","aria-label":this.labels.nextYearButton,class:this.getClassName("next-year-button"),"aria-disabled":a.year.next,innerHTML:this.nextYearButtonContent||void 0,onClick:this.nextYear,type:"button"},i("svg",{key:"32b65eb085653d5c62e60262fc87f59b6d105e57",fill:"none",height:"24","stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",stroke:"currentColor",viewBox:"0 0 24 24",width:"24"},i("polyline",{key:"eaa98641ba48a322fd7b3ac953d13104bb63aad3",points:"13 17 18 12 13 7"}),i("polyline",{key:"89b7de7ec2e24a01a808e885ac68a11c3779f9c2",points:"6 17 11 12 6 7"})))),i("div",{key:"a21c8a94b1ae0e5b66074d2ca956afac456f366f",class:this.getClassName("body")},i("table",{key:"2968d8355122e3eb18de35b4c72d2404794f62e6",class:this.getClassName("calendar"),onKeyDown:this.onKeyDown,role:"grid","aria-label":this.getTitle()},i("thead",{key:"568a00357a3e64e692c80d90739c560513239c1d",class:this.getClassName("calendar-header")},i("tr",{key:"4e80bf075ad630237b5ea156267a0c0d9d4f0423",class:this.getClassName("weekday-row")},null===(t=this.weekdays)||void 0===t?void 0:t.map((t=>i("th",{role:"columnheader",abbr:t[1],class:this.getClassName("weekday"),key:t[0],scope:"col"},i("span",{"aria-hidden":"true"},t[0]),i("span",{class:"visually-hidden"},t[1])))))),i("tbody",{key:"26dfbb76ab92d065ab5f38b7135fced7738ca4a7"},this.getCalendarRows().map((t=>{const e=`row-${t[0].getMonth()}-${t[0].getDate()}`;return i("tr",{class:this.getClassName("calendar-row"),key:e},t.map((t=>{var e,s,a;const n=A(t,this.currentDate),o=t.getMonth()!==(null===(e=this.currentDate)||void 0===e?void 0:e.getMonth()),d=Array.isArray(this.value)?A(t,this.value[0])||this.value[1]&&l(t,h(this.value[0]),h(this.value[1])):A(t,this.value),r=this.disableDate(t)||!l(t,this.minDate,this.maxDate),c=!!this.isRangeValue(this.value)&&L(t,{from:null===(s=this.value)||void 0===s?void 0:s[0],to:(null===(a=this.value)||void 0===a?void 0:a[1])||this.hoveredDate||this.currentDate})&&!r,u=A(t,new Date),b=`cell-${t.getMonth()}-${t.getDate()}`,f={[this.getClassName("date")]:!0,[this.getClassName("date--current")]:n,[this.getClassName("date--disabled")]:r,[this.getClassName("date--overflowing")]:o,[this.getClassName("date--today")]:u,[this.getClassName("date--selected")]:d,[this.getClassName("date--in-range")]:c},v=d?"strong":u?"em":"span";return i("td",{"aria-disabled":String(r),"aria-selected":d?"true":void 0,class:f,"data-date":h(t),key:b,onClick:this.onClick,onMouseEnter:this.onMouseEnter,onMouseLeave:this.onMouseLeave,role:"gridcell",tabIndex:A(t,this.currentDate)&&!this.disabled?0:-1},i(v,{"aria-hidden":"true"},t.getDate()),i("span",{class:"visually-hidden"},(()=>{if(this.range){let e=this.value?"":`, ${this.labels.chooseAsStartDate}.`;return Array.isArray(this.value)&&(e={1:`, ${this.labels.chooseAsEndDate}.`,2:`, ${this.labels.chooseAsStartDate}.`}[this.value.length]),`${d?`${this.labels.selected}, `:""}${Intl.DateTimeFormat(this.locale,{day:"numeric",month:"long",year:"numeric"}).format(t)}${e}`}return`${d?`${this.labels.selected}, `:""}${Intl.DateTimeFormat(this.locale,{day:"numeric",month:"long",year:"numeric"}).format(t)}`})()))})))}))))),e&&i("div",{key:"102ea99b292e7a028692615c68be2e8c5720913c",class:this.getClassName("footer")},i("div",{key:"6e1d52da734e986a9044847edd7ace16460605f2",class:this.getClassName("footer-buttons")},this.showTodayButton&&i("button",{key:"9508eadf9835bea2e1640e6ac622665bd19da4d8",class:this.getClassName("today-button"),disabled:this.disabled,innerHTML:this.todayButtonContent||void 0,onClick:this.showToday,type:"button"},this.labels.todayButton),this.showClearButton&&i("button",{key:"262b926076309bc44d5b36dd64217196b4d6e8e2",class:this.getClassName("clear-button"),disabled:this.disabled,innerHTML:this.clearButtonContent||void 0,onClick:this.clear,type:"button"},this.labels.clearButton)),this.showKeyboardHint&&!window.matchMedia("(pointer: coarse)").matches&&i("button",{key:"09c974e2b246f57381e0461dbb27eb83e523812d",type:"button",onClick:()=>alert("Todo: Add Keyboard helper!"),class:this.getClassName("keyboard-hint")},i("svg",{key:"4dd5a8ce6e5c96e79adf6d8b0308b56fae5be361",xmlns:"http://www.w3.org/2000/svg",height:"1em",width:"1em",viewBox:"0 0 48 48",fill:"currentColor"},i("path",{key:"f3378678d6a0dc9fe7ea9ffd42dc083c3dca5ec8",d:"M7 38q-1.2 0-2.1-.925Q4 36.15 4 35V13q0-1.2.9-2.1.9-.9 2.1-.9h34q1.2 0 2.1.9.9.9.9 2.1v22q0 1.15-.9 2.075Q42.2 38 41 38Zm0-3h34V13H7v22Zm8-3.25h18v-3H15Zm-4.85-6.25h3v-3h-3Zm6.2 0h3v-3h-3Zm6.15 0h3v-3h-3Zm6.2 0h3v-3h-3Zm6.15 0h3v-3h-3Zm-24.7-6.25h3v-3h-3Zm6.2 0h3v-3h-3Zm6.15 0h3v-3h-3Zm6.2 0h3v-3h-3Zm6.15 0h3v-3h-3ZM7 35V13v22Z"})),this.labels.keyboardHint))),i("slot",{key:"ec9b51b9aaf6c48e643120115dbc7f418e9fb8e4",name:"after-calendar"})))}get el(){return a(this)}static get watchers(){return{modalIsOpen:[{watchModalIsOpen:0}],firstDayOfWeek:[{watchFirstDayOfWeek:0}],locale:[{watchLocale:0}],range:[{watchRange:0}],startDate:[{watchStartDate:0}],value:[{watchValue:0}]}}};function $(t,e,i,s=20,a=0){let h=[];if(a>=s)return h;const n=t=>{const h=t.assignedNodes().filter((t=>1===t.nodeType));return h.length>0?$(h[0].parentElement,e,i,s,a+1):[]},o=Array.from(t.children||[]);for(const t of o)e(t)||(i(t)&&h.push(t),null!=t.shadowRoot?h.push(...$(t.shadowRoot,e,i,s,a+1)):"SLOT"===t.tagName?h.push(...n(t)):h.push(...$(t,e,i,s,a+1)));return h}function B(t){return t.hasAttribute("hidden")||t.hasAttribute("aria-hidden")&&"false"!==t.getAttribute("aria-hidden")||"none"===t.style.display||"0"===t.style.opacity||"hidden"===t.style.visibility||"collapse"===t.style.visibility}function S(t){return"-1"!==t.getAttribute("tabindex")&&!B(t)&&!function(t){return t.hasAttribute("disabled")||t.hasAttribute("aria-disabled")&&"false"!==t.getAttribute("aria-disabled")}(t)&&(t.hasAttribute("tabindex")||(t instanceof HTMLAnchorElement||t instanceof HTMLAreaElement)&&t.hasAttribute("href")||t instanceof HTMLButtonElement||t instanceof HTMLInputElement||t instanceof HTMLTextAreaElement||t instanceof HTMLSelectElement||t instanceof HTMLIFrameElement)}H.style=".visually-hidden.sc-tabworthy-dates-calendar{position:absolute;overflow:hidden;width:1px;height:1px;white-space:nowrap;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%)}";const E=new Map,Z=document.createElement("template");Z.innerHTML='\n\t<div id="start"></div>\n\t<div id="backup"></div>\n\t<slot></slot>\n\t<div id="end"></div>\n';class W extends HTMLElement{constructor(){super(),this.debounceId=Math.random().toString(),this._focused=!1;const t=this.attachShadow({mode:"open"});t.appendChild(Z.content.cloneNode(!0)),this.$backup=t.querySelector("#backup"),this.$start=t.querySelector("#start"),this.$end=t.querySelector("#end"),this.focusLastElement=this.focusLastElement.bind(this),this.focusFirstElement=this.focusFirstElement.bind(this),this.onFocusIn=this.onFocusIn.bind(this),this.onFocusOut=this.onFocusOut.bind(this)}static get observedAttributes(){return["inactive"]}get inactive(){return this.hasAttribute("inactive")}set inactive(t){t?this.setAttribute("inactive",""):this.removeAttribute("inactive")}get focused(){return this._focused}connectedCallback(){this.$start.addEventListener("focus",this.focusLastElement),this.$end.addEventListener("focus",this.focusFirstElement),this.addEventListener("focusin",this.onFocusIn),this.addEventListener("focusout",this.onFocusOut),this.render()}disconnectedCallback(){this.$start.removeEventListener("focus",this.focusLastElement),this.$end.removeEventListener("focus",this.focusFirstElement),this.removeEventListener("focusin",this.onFocusIn),this.removeEventListener("focusout",this.onFocusOut)}attributeChangedCallback(){this.render()}focusFirstElement(){this.trapFocus()}focusLastElement(){this.trapFocus(!0)}getFocusableElements(){return $(this,B,S)}trapFocus(t){if(this.inactive)return;let e=this.getFocusableElements();e.length>0?(t?e[e.length-1].focus():e[0].focus(),this.$backup.setAttribute("tabindex","-1")):(this.$backup.setAttribute("tabindex","0"),this.$backup.focus())}onFocusIn(){this.updateFocused(!0)}onFocusOut(){this.updateFocused(!1)}updateFocused(t){!function(t,e,i){const s=E.get(i);null!=s&&window.clearTimeout(s),E.set(i,window.setTimeout((()=>{t(),E.delete(i)}),0))}((()=>{this.focused!==t&&(this._focused=t,this.render())}),0,this.debounceId)}render(){this.$start.setAttribute("tabindex",!this.focused||this.inactive?"-1":"0"),this.$end.setAttribute("tabindex",!this.focused||this.inactive?"-1":"0"),this.focused?this.setAttribute("focused",""):this.removeAttribute("focused")}}window.customElements.define("focus-trap",W);var I=new WeakMap,F=new WeakMap,O={},V=0,j=function(t){return t&&(t.host||j(t.parentNode))},R=function(t,e,i){void 0===i&&(i="data-aria-hidden");var s=Array.from(Array.isArray(t)?t:[t]),a=function(t){return"undefined"==typeof document?null:(Array.isArray(t)?t[0]:t).ownerDocument.body}(t);return a?(s.push.apply(s,Array.from(a.querySelectorAll("[aria-live]"))),function(t,e,i,s){var a=function(t,e){return e.map((function(e){if(t.contains(e))return e;var i=j(e);return i&&t.contains(i)?i:(console.error("aria-hidden",e,"in not contained inside",t,". Doing nothing"),null)})).filter((function(t){return Boolean(t)}))}(e,Array.isArray(t)?t:[t]);O[i]||(O[i]=new WeakMap);var h=O[i],n=[],o=new Set,d=new Set(a),r=function(t){t&&!o.has(t)&&(o.add(t),r(t.parentNode))};a.forEach(r);var c=function(t){t&&!d.has(t)&&Array.prototype.forEach.call(t.children,(function(t){if(o.has(t))c(t);else{var e=t.getAttribute(s),a=null!==e&&"false"!==e,d=(I.get(t)||0)+1,r=(h.get(t)||0)+1;I.set(t,d),h.set(t,r),n.push(t),1===d&&a&&F.set(t,!0),1===r&&t.setAttribute(i,"true"),a||t.setAttribute(s,"true")}}))};return c(e),o.clear(),V++,function(){n.forEach((function(t){var e=I.get(t)-1,a=h.get(t)-1;I.set(t,e),h.set(t,a),e||(F.has(t)||t.removeAttribute(s),F.delete(t)),a||t.removeAttribute(i)})),--V||(I=new WeakMap,I=new WeakMap,F=new WeakMap,O={})}}(s,a,i,"aria-hidden")):function(){return null}};const _=class{constructor(i){t(this,i),this.opened=e(this,"opened",7),this.closed=e(this,"closed",7),this.inline=!1,this.closing=!1,this.showing=this.inline||!1,this.onKeyDown=t=>{"Escape"===t.code&&this.close()}}async open(){this.inline||(this.showing=!0,this.undo=R(this.el),this.opened.emit(void 0))}async close(){this.inline||(this.showing=!1,this.closed.emit(void 0),this.undo(),this.triggerElement&&this.triggerElement.focus())}async getState(){return this.showing}async setTriggerElement(t){this.triggerElement=t}handleClick(t){this.showing&&!this.el.contains(t.target)&&this.close()}render(){return i(s,{key:"773d9edf7cf6598394c1210a1fab91af0bcb951e",showing:this.showing,ref:t=>t&&(this.el=t)},!this.inline&&this.showing&&i("div",{key:"c456932007f7ea9a9c3727d9d08fd8fbea5b8670",part:"body",onKeyDown:this.onKeyDown,role:"dialog",tabindex:-1,"aria-hidden":!this.showing,"aria-label":this.label,"aria-modal":this.showing},i("focus-trap",{key:"c1355fe48117067d62ede321afd1f90bf9bf4c22"},i("div",{key:"fbd3ec5e0e7069574f1dbd6c38b40e409b837045",part:"content"},i("slot",{key:"bad04015cc3945efbb68a52de623ee1f4b584868"})))),this.inline&&i("div",{key:"b0577b12dd1bec091de967ccd0ac297451576ad8",part:"content"},i("slot",{key:"5457a9bd5d08feac90adb2ee061d60fb5fb94657"})))}};_.style=":host::part(body){position:absolute;width:-moz-fit-content;width:fit-content;z-index:1200;margin-top:0.5rem}:host::part(backdrop){}:host::part(content){}";export{H as tabworthy_dates_calendar,_ as tabworthy_dates_modal}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as e,b as t}from"./p-zgp3PkTz.js";export{s as setNonce}from"./p-zgp3PkTz.js";import{g as a}from"./p-DQuL1Twl.js";(()=>{const t=import.meta.url,a={};return""!==t&&(a.resourcesUrl=new URL(".",t).href),e(a)})().then((async e=>(await a(),t([["p-6b1d06a7",[[2,"tabworthy-times-picker",{hours:[1026],minutes:[1026],use12HourFormat:[4,"use-1-2-hour-format"],labels:[16],labelsSrOnly:[4,"labels-sr-only"],disabled:[4],elementClassName:[1,"element-class-name"],internalHours:[32],internalMinutes:[32],period:[32]},null,{hours:[{watchHours:0}],minutes:[{watchMinutes:0}]}]]],["p-
|
|
1
|
+
import{p as e,b as t}from"./p-zgp3PkTz.js";export{s as setNonce}from"./p-zgp3PkTz.js";import{g as a}from"./p-DQuL1Twl.js";(()=>{const t=import.meta.url,a={};return""!==t&&(a.resourcesUrl=new URL(".",t).href),e(a)})().then((async e=>(await a(),t([["p-6b1d06a7",[[2,"tabworthy-times-picker",{hours:[1026],minutes:[1026],use12HourFormat:[4,"use-1-2-hour-format"],labels:[16],labelsSrOnly:[4,"labels-sr-only"],disabled:[4],elementClassName:[1,"element-class-name"],internalHours:[32],internalMinutes:[32],period:[32]},null,{hours:[{watchHours:0}],minutes:[{watchMinutes:0}]}]]],["p-e030bef8",[[262,"tabworthy-dates-calendar",{clearButtonContent:[1,"clear-button-content"],disabled:[4],modalIsOpen:[4,"modal-is-open"],disableDate:[16],elementClassName:[1,"element-class-name"],firstDayOfWeek:[2,"first-day-of-week"],range:[4],labels:[16],locale:[1],nextMonthButtonContent:[1,"next-month-button-content"],nextYearButtonContent:[1,"next-year-button-content"],previousMonthButtonContent:[1,"previous-month-button-content"],previousYearButtonContent:[1,"previous-year-button-content"],minDate:[1,"min-date"],maxDate:[1,"max-date"],inline:[4],showClearButton:[4,"show-clear-button"],showMonthStepper:[4,"show-month-stepper"],showTodayButton:[4,"show-today-button"],showYearStepper:[4,"show-year-stepper"],showKeyboardHint:[4,"show-keyboard-hint"],showHiddenTitle:[4,"show-hidden-title"],startDate:[1,"start-date"],todayButtonContent:[1,"today-button-content"],value:[1040],currentDate:[32],hoveredDate:[32],weekdays:[32]},null,{modalIsOpen:[{watchModalIsOpen:0}],firstDayOfWeek:[{watchFirstDayOfWeek:0}],locale:[{watchLocale:0}],range:[{watchRange:0}],startDate:[{watchStartDate:0}],value:[{watchValue:0}]}],[257,"tabworthy-dates-modal",{label:[1],inline:[4],closing:[32],showing:[32],open:[64],close:[64],getState:[64],setTriggerElement:[64]},[[10,"click","handleClick"]]]]],["p-a261cea6",[[2,"tabworthy-times",{id:[513],value:[1025],range:[4],label:[1],placeholder:[1],locale:[1],disabled:[4],minDate:[1,"min-date"],maxDate:[1,"max-date"],startDate:[1,"start-date"],referenceDate:[1,"reference-date"],use12HourFormat:[4,"use-1-2-hour-format"],timesLabels:[16],datesCalendarLabels:[16],inline:[4],hasError:[1028,"has-error"],showYearStepper:[4,"show-year-stepper"],showMonthStepper:[4,"show-month-stepper"],showClearButton:[4,"show-clear-button"],showTodayButton:[4,"show-today-button"],calendarButtonContent:[1,"calendar-button-content"],disableDate:[16],elementClassName:[1,"element-class-name"],firstDayOfWeek:[2,"first-day-of-week"],format:[1],inputShouldFormat:[8,"input-should-format"],disableFreeformInput:[4,"disable-freeform-input"],internalValue:[32],selectedDate:[32],selectedHours:[32],selectedMinutes:[32],errorState:[32],disabledState:[32],clearValue:[64]},null,{value:[{watchValue:0}],disabled:[{watchDisabled:0}],hasError:[{watchHasError:0}]}]]],["p-c49e980d",[[2,"tabworthy-dates",{id:[513],value:[1025],range:[4],label:[1],placeholder:[1],locale:[1],disabled:[4],minDate:[1,"min-date"],maxDate:[1,"max-date"],startDate:[1,"start-date"],referenceDate:[1,"reference-date"],useStrictDateParsing:[4,"use-strict-date-parsing"],datesLabels:[16],datesCalendarLabels:[16],inline:[4],hasError:[1028,"has-error"],nextMonthButtonContent:[1,"next-month-button-content"],nextYearButtonContent:[1,"next-year-button-content"],showYearStepper:[4,"show-year-stepper"],showMonthStepper:[4,"show-month-stepper"],showClearButton:[4,"show-clear-button"],showTodayButton:[4,"show-today-button"],inputShouldFormat:[8,"input-should-format"],showKeyboardHint:[4,"show-keyboard-hint"],disableDate:[16],elementClassName:[1,"element-class-name"],firstDayOfWeek:[2,"first-day-of-week"],format:[1],quickButtons:[16],todayButtonContent:[1,"today-button-content"],calendarButtonContent:[1,"calendar-button-content"],showQuickButtons:[4,"show-quick-buttons"],disableFreeformInput:[4,"disable-freeform-input"],internalValue:[32],errorState:[32],disabledState:[32],parseDate:[64]},null,{disabled:[{watchDisabled:0}],value:[{watchValue:0}]}]]]],e))));
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tabworthy/components",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.7.0",
|
|
4
4
|
"description": "Small, accessible datepicker and datetimepicker Web Components with natural language date input.",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -71,6 +71,7 @@
|
|
|
71
71
|
"dependencies": {
|
|
72
72
|
"@a11y/focus-trap": "^1.0.5",
|
|
73
73
|
"@react-aria/live-announcer": "^3.1.2",
|
|
74
|
+
"@stencil/core": "^4",
|
|
74
75
|
"aria-hidden": "^1.2.2",
|
|
75
76
|
"chrono-node": "^2.5.0",
|
|
76
77
|
"moment": "^2.30.1"
|
|
@@ -78,7 +79,6 @@
|
|
|
78
79
|
"devDependencies": {
|
|
79
80
|
"@changesets/changelog-github": "^0.5.2",
|
|
80
81
|
"@changesets/cli": "^2.29.8",
|
|
81
|
-
"@stencil/core": "^4",
|
|
82
82
|
"@stencil/postcss": "^2.1.0",
|
|
83
83
|
"@stencil/sass": "^3.0.0",
|
|
84
84
|
"@storybook/addon-a11y": "10.2.8",
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{r as t,c as i,h as e,H as s,g as a}from"./p-zgp3PkTz.js";import{g as h,r as n,a as o,b as d,c as r,d as c,e as l,f,h as u,s as b,i as v,j as y,k as p,l as k,m as w,n as m,o as g,p as D,q as M,t as x,u as C,v as A,w as L}from"./p-BVHu5CWV.js";const T={clearButton:"Clear value",monthSelect:"Select month",nextMonthButton:"Next month",nextYearButton:"Next year",picker:"Choose date",previousMonthButton:"Previous month",previousYearButton:"Previous year",todayButton:"Show today",yearSelect:"Select year",keyboardHint:"Keyboard commands",selected:"Selected date",chooseAsStartDate:"choose as start date",chooseAsEndDate:"choose as end date"},H=class{constructor(e){t(this,e),this.selectDate=i(this,"selectDate",3),this.changeMonth=i(this,"changeMonth",3),this.changeYear=i(this,"changeYear",3),this.disabled=!1,this.modalIsOpen=!1,this.disableDate=()=>!1,this.elementClassName="tabworthy-dates-calendar",this.firstDayOfWeek=0,this.range=!1,this.labels=T,this.locale=(null===navigator||void 0===navigator?void 0:navigator.language)||"en-US",this.inline=!1,this.showClearButton=!1,this.showMonthStepper=!0,this.showTodayButton=!0,this.showYearStepper=!1,this.showKeyboardHint=!1,this.showHiddenTitle=!0,this.startDate=h(new Date),this.init=()=>{this.currentDate=this.startDate?n(new Date(this.startDate)):new Date,this.updateWeekdays()},this.nextMonth=()=>{this.updateCurrentDate(o(this.currentDate))},this.nextYear=()=>{this.updateCurrentDate(d(this.currentDate))},this.previousMonth=()=>{this.updateCurrentDate(r(this.currentDate))},this.previousYear=()=>{this.updateCurrentDate(c(this.currentDate))},this.showToday=()=>{this.updateCurrentDate(new Date,!0)},this.clear=()=>{var t;this.value=void 0,null===(t=this.selectDate)||void 0===t||t.emit(void 0)},this.onClick=t=>{if(this.disabled)return;const i=t.target.closest("[data-date]");if(!Boolean(i))return;const e=n(new Date(i.dataset.date));this.updateCurrentDate(e),this.onSelectDate(e)},this.onMonthSelect=t=>{const i=+t.target.value-1,e=new Date(this.currentDate);l(e,this.minDate,this.maxDate)&&(e.setMonth(i),this.updateCurrentDate(e))},this.onYearSelect=t=>{var i;const e=+t.target.value,s=new Date(this.currentDate);l(s,this.minDate,this.maxDate)&&(s.setFullYear(e),null===(i=this.changeYear)||void 0===i||i.emit({year:e}),this.updateCurrentDate(s))},this.onKeyDown=t=>{this.disabled||("ArrowLeft"===t.code?(t.preventDefault(),this.updateCurrentDate(f(this.currentDate),!0)):"ArrowRight"===t.code?(t.preventDefault(),this.updateCurrentDate(u(this.currentDate),!0)):"ArrowUp"===t.code?(t.preventDefault(),this.updateCurrentDate(b(this.currentDate,7),!0)):"ArrowDown"===t.code?(t.preventDefault(),this.updateCurrentDate(v(this.currentDate,7),!0)):"PageUp"===t.code?(t.preventDefault(),this.updateCurrentDate(t.shiftKey?c(this.currentDate):r(this.currentDate),!0)):"PageDown"===t.code?(t.preventDefault(),this.updateCurrentDate(t.shiftKey?d(this.currentDate):o(this.currentDate),!0)):"Home"===t.code?(t.preventDefault(),this.updateCurrentDate(y(this.currentDate),!0)):"End"===t.code?(t.preventDefault(),this.updateCurrentDate(p(this.currentDate),!0)):"Space"!==t.code&&"Enter"!==t.code||(t.preventDefault(),this.onSelectDate(this.currentDate)))},this.onMouseEnter=t=>{var i;if(this.disabled)return;const e=n(new Date(null===(i=t.target.closest("td"))||void 0===i?void 0:i.dataset.date));this.hoveredDate=e},this.onMouseLeave=()=>{this.hoveredDate=void 0}}componentWillLoad(){this.init()}watchModalIsOpen(){!0===this.modalIsOpen&&(this.moveFocusOnModalOpen=!0)}watchFirstDayOfWeek(){this.updateWeekdays()}watchLocale(){Boolean(this.locale)||(this.locale=(null===navigator||void 0===navigator?void 0:navigator.language)||"en-US"),this.updateWeekdays()}watchRange(){var t;this.value=void 0,null===(t=this.selectDate)||void 0===t||t.emit(void 0)}watchStartDate(){this.currentDate=this.startDate?n(new Date(this.startDate)):new Date}watchValue(){Boolean(this.value)&&(Array.isArray(this.value)&&this.value.length>=1?this.currentDate=this.value[0]:this.value instanceof Date&&(this.currentDate=this.value))}componentDidRender(){this.moveFocusAfterMonthChanged&&(this.focusDate(this.currentDate),this.moveFocusAfterMonthChanged=!1),this.moveFocusOnModalOpen&&setTimeout((()=>{this.focusDate(this.currentDate),this.moveFocusOnModalOpen=!1}),100)}updateWeekdays(){this.weekdays=k(this.firstDayOfWeek,this.locale)}getClassName(t){return Boolean(t)?`${this.elementClassName}__${t}`:this.elementClassName}getCalendarRows(){const t=w(this.currentDate,!0,0===this.firstDayOfWeek?7:this.firstDayOfWeek),i=[];for(let e=0;e<t.length;e+=7){const s=t.slice(e,e+7);i.push(s)}return i}getTitle(){if(Boolean(this.currentDate))return Intl.DateTimeFormat(this.locale,{month:"long",year:"numeric"}).format(this.currentDate)}focusDate(t){var i;t&&(null===(i=this.el.querySelector(`[data-date="${h(t)}"]`))||void 0===i||i.focus())}updateCurrentDate(t,i){var e,s;const a=t.getMonth(),h=t.getFullYear();m(t,this.minDate)||(t=new Date(this.minDate)),g(t,this.maxDate)||(t=new Date(this.maxDate)),(a!==(null===(e=this.currentDate)||void 0===e?void 0:e.getMonth())||h!==this.currentDate.getFullYear())&&(null===(s=this.changeMonth)||void 0===s||s.emit({month:M(t),year:D(t)}),i&&(this.moveFocusAfterMonthChanged=!0)),this.currentDate=t,i&&this.focusDate(this.currentDate)}onSelectDate(t){var i,e,s,a;if(!this.disableDate(t)&&l(t,this.minDate,this.maxDate))if(this.isRangeValue(this.value)){const s=void 0===(null===(i=this.value)||void 0===i?void 0:i[0])||2===this.value.length?[t]:[this.value[0],t];2===s.length&&s[0]>s[1]&&s.reverse();const a=void 0===s[1]?[h(s[0])]:[h(s[0]),h(s[1])];this.value=s,null===(e=this.selectDate)||void 0===e||e.emit(a)}else{if((null===(s=this.value)||void 0===s?void 0:s.getTime())===t.getTime())return;this.value=t,null===(a=this.selectDate)||void 0===a||a.emit(h(t))}}isRangeValue(t){return!!this.range}render(){var t;const i=this.showTodayButton||this.showClearButton||this.showKeyboardHint,a={year:{prev:this.disabled||!!this.minDate&&new Date(this.minDate).getFullYear()>c(this.currentDate).getFullYear(),next:this.disabled||!!this.maxDate&&new Date(this.maxDate).getFullYear()<d(this.currentDate).getFullYear()},month:{prev:this.disabled||x(r(this.currentDate).getMonth(),r(this.currentDate).getFullYear(),this.minDate,this.maxDate),next:this.disabled||x(o(this.currentDate).getMonth(),o(this.currentDate).getFullYear(),this.minDate,this.maxDate)}};return e(s,{key:"0ca78d9d8d4d0edd2375f48f23c5d879a2c6fb44"},e("div",{key:"8ba043e2d7c70958ca73253348de57c07424c7f2",class:{[`${this.getClassName()}-wrapper`]:!0,[`${this.getClassName()}-wrapper--inline`]:this.inline}},e("div",{key:"2b6d87a26620acd162d6321add8cb52fe9c41e97",class:{[this.getClassName()]:!0,[`${this.getClassName()}--disabled`]:this.disabled}},e("div",{key:"f773d4c95f3ebf4ea79dd5e72385a1f16b6cfe87",class:this.getClassName("header")},this.showHiddenTitle&&e("span",{key:"c6249db5073485bcf479bcd1d8c9da6a8270757c","aria-atomic":"true","aria-live":"polite",class:"visually-hidden"},this.getTitle()),this.showYearStepper&&e("button",{key:"ecf43dac6e8539598c43f782fb211ff44758d58a","aria-label":this.labels.previousYearButton,class:this.getClassName("previous-year-button"),"aria-disabled":a.year.prev,innerHTML:this.previousYearButtonContent||void 0,onClick:this.previousYear,type:"button"},e("svg",{key:"7986a7b8b7a4a696c6e62bba6677f9801c6d9059",fill:"none",height:"24","stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",stroke:"currentColor",viewBox:"0 0 24 24",width:"24"},e("polyline",{key:"3a1474883ab05ef0c0376944cfc4dbfe63aa6434",points:"11 17 6 12 11 7"}),e("polyline",{key:"eb15b38a86f440e5b77723e8551e774af50c4a32",points:"18 17 13 12 18 7"}))),this.showMonthStepper&&e("button",{key:"f3a6e864f855833ae24f6b15930ff85a5939d39e","aria-label":this.labels.previousMonthButton,class:this.getClassName("previous-month-button"),"aria-disabled":a.month.prev,innerHTML:this.previousMonthButtonContent||void 0,onClick:this.previousMonth,type:"button"},e("svg",{key:"b15bc4eb6009b5872bc0d1253b5ca0e863505956",fill:"none",height:"24","stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",stroke:"currentColor",viewBox:"0 0 24 24",width:"24"},e("polyline",{key:"90d0590bdafd7b802e8967366f30411ac65aead1",points:"15 18 9 12 15 6"}))),e("span",{key:"c0a4670b7f7f71706e1b02430f08302d69e7bec4",class:this.getClassName("current-month")},e("select",{key:"d7b43fcb12387644b74403f52c3e72948d2a460d","aria-label":this.labels.monthSelect,class:this.getClassName("month-select"),"aria-disabled":this.disabled,name:"month",onChange:this.onMonthSelect},C(this.locale).map(((t,i)=>e("option",{key:t,selected:this.currentDate.getMonth()===i,value:i+1,disabled:x(i,this.currentDate.getFullYear(),this.minDate,this.maxDate)},t)))),e("input",{key:"6123f052aa28fd745ee52a37d817855a31c6a888","aria-label":this.labels.yearSelect,class:this.getClassName("year-select"),"aria-disabled":this.disabled,max:this.maxDate?this.maxDate.slice(0,4):9999,min:this.minDate?this.minDate.slice(0,4):1,name:"year",onChange:this.onYearSelect,type:"number",value:this.currentDate.getFullYear()})),this.showMonthStepper&&e("button",{key:"9a9ded70d8cfb7f61d15edc15873f1c7cc24d352","aria-label":this.labels.nextMonthButton,class:this.getClassName("next-month-button"),"aria-disabled":a.month.next,innerHTML:this.nextMonthButtonContent||void 0,onClick:this.nextMonth,type:"button"},e("svg",{key:"500969c2fd840a7131c348c4d562f3493dfddd4e",fill:"none",height:"24","stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",stroke:"currentColor",viewBox:"0 0 24 24",width:"24"},e("polyline",{key:"9e7fdecb2585366f9dc96fe32f0c83123257bd0a",points:"9 18 15 12 9 6"}))),this.showYearStepper&&e("button",{key:"7ee30553302a226836261fd21dafdfa065f831d8","aria-label":this.labels.nextYearButton,class:this.getClassName("next-year-button"),"aria-disabled":a.year.next,innerHTML:this.nextYearButtonContent||void 0,onClick:this.nextYear,type:"button"},e("svg",{key:"d3c6f21d586a2be2ef8f52419fde77c1ad4398ad",fill:"none",height:"24","stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",stroke:"currentColor",viewBox:"0 0 24 24",width:"24"},e("polyline",{key:"19da599079fab7e31a853a7f09e68d12e66c9974",points:"13 17 18 12 13 7"}),e("polyline",{key:"b23802d92bc35c3af659f86ecad9d41320cf3467",points:"6 17 11 12 6 7"})))),e("div",{key:"75b511a738d0d421828c64a88b79cdadeb3e77db",class:this.getClassName("body")},e("table",{key:"7f62f9985c99c4c19cbf320e009fbefbb436f5c2",class:this.getClassName("calendar"),onKeyDown:this.onKeyDown,role:"grid","aria-label":this.getTitle()},e("thead",{key:"6d518a1c015ee4f545278e175d9f71456b7cb525",class:this.getClassName("calendar-header")},e("tr",{key:"d5f289679c98b5ef8f67f8ccbf3999aac68a022c",class:this.getClassName("weekday-row")},null===(t=this.weekdays)||void 0===t?void 0:t.map((t=>e("th",{role:"columnheader",abbr:t[1],class:this.getClassName("weekday"),key:t[0],scope:"col"},e("span",{"aria-hidden":"true"},t[0]),e("span",{class:"visually-hidden"},t[1])))))),e("tbody",{key:"f4cf7ef148106044880c2b6c360e4319a7b31d83"},this.getCalendarRows().map((t=>{const i=`row-${t[0].getMonth()}-${t[0].getDate()}`;return e("tr",{class:this.getClassName("calendar-row"),key:i},t.map((t=>{var i,s,a;const n=A(t,this.currentDate),o=t.getMonth()!==(null===(i=this.currentDate)||void 0===i?void 0:i.getMonth()),d=Array.isArray(this.value)?A(t,this.value[0])||this.value[1]&&l(t,h(this.value[0]),h(this.value[1])):A(t,this.value),r=this.disableDate(t)||!l(t,this.minDate,this.maxDate),c=!!this.isRangeValue(this.value)&&L(t,{from:null===(s=this.value)||void 0===s?void 0:s[0],to:(null===(a=this.value)||void 0===a?void 0:a[1])||this.hoveredDate||this.currentDate})&&!r,f=A(t,new Date),u=`cell-${t.getMonth()}-${t.getDate()}`,b={[this.getClassName("date")]:!0,[this.getClassName("date--current")]:n,[this.getClassName("date--disabled")]:r,[this.getClassName("date--overflowing")]:o,[this.getClassName("date--today")]:f,[this.getClassName("date--selected")]:d,[this.getClassName("date--in-range")]:c},v=d?"strong":f?"em":"span";return e("td",{"aria-disabled":String(r),"aria-selected":d?"true":void 0,class:b,"data-date":h(t),key:u,onClick:this.onClick,onMouseEnter:this.onMouseEnter,onMouseLeave:this.onMouseLeave,role:"gridcell",tabIndex:A(t,this.currentDate)&&!this.disabled?0:-1},e(v,{"aria-hidden":"true"},t.getDate()),e("span",{class:"visually-hidden"},(()=>{if(this.range){let i=this.value?"":`, ${this.labels.chooseAsStartDate}.`;return Array.isArray(this.value)&&(i={1:`, ${this.labels.chooseAsEndDate}.`,2:`, ${this.labels.chooseAsStartDate}.`}[this.value.length]),`${d?`${this.labels.selected}, `:""}${Intl.DateTimeFormat(this.locale,{day:"numeric",month:"long",year:"numeric"}).format(t)}${i}`}return`${d?`${this.labels.selected}, `:""}${Intl.DateTimeFormat(this.locale,{day:"numeric",month:"long",year:"numeric"}).format(t)}`})()))})))}))))),i&&e("div",{key:"a34938c0321570d5a4983cb47822d12335cb5fba",class:this.getClassName("footer")},e("div",{key:"0c52dc84cb734326025e7927f94ab7d9947f89c3",class:this.getClassName("footer-buttons")},this.showTodayButton&&e("button",{key:"11d7621dc4b8ffa33b51bf4312de6f0cedcc94e9",class:this.getClassName("today-button"),disabled:this.disabled,innerHTML:this.todayButtonContent||void 0,onClick:this.showToday,type:"button"},this.labels.todayButton),this.showClearButton&&e("button",{key:"2eb6ef128169727ba993a68d270e730b600b130a",class:this.getClassName("clear-button"),disabled:this.disabled,innerHTML:this.clearButtonContent||void 0,onClick:this.clear,type:"button"},this.labels.clearButton)),this.showKeyboardHint&&!window.matchMedia("(pointer: coarse)").matches&&e("button",{key:"f2f52bf2b5de8d810dab6f3376d5b0923a2abb0c",type:"button",onClick:()=>alert("Todo: Add Keyboard helper!"),class:this.getClassName("keyboard-hint")},e("svg",{key:"1d2f5e1323af69c00c185b450a3e4ac2ed5b9f69",xmlns:"http://www.w3.org/2000/svg",height:"1em",width:"1em",viewBox:"0 0 48 48",fill:"currentColor"},e("path",{key:"d3f34347335b0e1f100b5e6346a283678daba519",d:"M7 38q-1.2 0-2.1-.925Q4 36.15 4 35V13q0-1.2.9-2.1.9-.9 2.1-.9h34q1.2 0 2.1.9.9.9.9 2.1v22q0 1.15-.9 2.075Q42.2 38 41 38Zm0-3h34V13H7v22Zm8-3.25h18v-3H15Zm-4.85-6.25h3v-3h-3Zm6.2 0h3v-3h-3Zm6.15 0h3v-3h-3Zm6.2 0h3v-3h-3Zm6.15 0h3v-3h-3Zm-24.7-6.25h3v-3h-3Zm6.2 0h3v-3h-3Zm6.15 0h3v-3h-3Zm6.2 0h3v-3h-3Zm6.15 0h3v-3h-3ZM7 35V13v22Z"})),this.labels.keyboardHint))),e("slot",{key:"fa342bcfcd2cf4cb057b33b0cc8231264e97c51c",name:"after-calendar"})))}get el(){return a(this)}static get watchers(){return{modalIsOpen:[{watchModalIsOpen:0}],firstDayOfWeek:[{watchFirstDayOfWeek:0}],locale:[{watchLocale:0}],range:[{watchRange:0}],startDate:[{watchStartDate:0}],value:[{watchValue:0}]}}};function $(t,i,e,s=20,a=0){let h=[];if(a>=s)return h;const n=t=>{const h=t.assignedNodes().filter((t=>1===t.nodeType));return h.length>0?$(h[0].parentElement,i,e,s,a+1):[]},o=Array.from(t.children||[]);for(const t of o)i(t)||(e(t)&&h.push(t),null!=t.shadowRoot?h.push(...$(t.shadowRoot,i,e,s,a+1)):"SLOT"===t.tagName?h.push(...n(t)):h.push(...$(t,i,e,s,a+1)));return h}function B(t){return t.hasAttribute("hidden")||t.hasAttribute("aria-hidden")&&"false"!==t.getAttribute("aria-hidden")||"none"===t.style.display||"0"===t.style.opacity||"hidden"===t.style.visibility||"collapse"===t.style.visibility}function S(t){return"-1"!==t.getAttribute("tabindex")&&!B(t)&&!function(t){return t.hasAttribute("disabled")||t.hasAttribute("aria-disabled")&&"false"!==t.getAttribute("aria-disabled")}(t)&&(t.hasAttribute("tabindex")||(t instanceof HTMLAnchorElement||t instanceof HTMLAreaElement)&&t.hasAttribute("href")||t instanceof HTMLButtonElement||t instanceof HTMLInputElement||t instanceof HTMLTextAreaElement||t instanceof HTMLSelectElement||t instanceof HTMLIFrameElement)}H.style=".visually-hidden.sc-tabworthy-dates-calendar{position:absolute;overflow:hidden;width:1px;height:1px;white-space:nowrap;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%)}";const E=new Map,Z=document.createElement("template");Z.innerHTML='\n\t<div id="start"></div>\n\t<div id="backup"></div>\n\t<slot></slot>\n\t<div id="end"></div>\n';class W extends HTMLElement{constructor(){super(),this.debounceId=Math.random().toString(),this._focused=!1;const t=this.attachShadow({mode:"open"});t.appendChild(Z.content.cloneNode(!0)),this.$backup=t.querySelector("#backup"),this.$start=t.querySelector("#start"),this.$end=t.querySelector("#end"),this.focusLastElement=this.focusLastElement.bind(this),this.focusFirstElement=this.focusFirstElement.bind(this),this.onFocusIn=this.onFocusIn.bind(this),this.onFocusOut=this.onFocusOut.bind(this)}static get observedAttributes(){return["inactive"]}get inactive(){return this.hasAttribute("inactive")}set inactive(t){t?this.setAttribute("inactive",""):this.removeAttribute("inactive")}get focused(){return this._focused}connectedCallback(){this.$start.addEventListener("focus",this.focusLastElement),this.$end.addEventListener("focus",this.focusFirstElement),this.addEventListener("focusin",this.onFocusIn),this.addEventListener("focusout",this.onFocusOut),this.render()}disconnectedCallback(){this.$start.removeEventListener("focus",this.focusLastElement),this.$end.removeEventListener("focus",this.focusFirstElement),this.removeEventListener("focusin",this.onFocusIn),this.removeEventListener("focusout",this.onFocusOut)}attributeChangedCallback(){this.render()}focusFirstElement(){this.trapFocus()}focusLastElement(){this.trapFocus(!0)}getFocusableElements(){return $(this,B,S)}trapFocus(t){if(this.inactive)return;let i=this.getFocusableElements();i.length>0?(t?i[i.length-1].focus():i[0].focus(),this.$backup.setAttribute("tabindex","-1")):(this.$backup.setAttribute("tabindex","0"),this.$backup.focus())}onFocusIn(){this.updateFocused(!0)}onFocusOut(){this.updateFocused(!1)}updateFocused(t){!function(t,i,e){const s=E.get(e);null!=s&&window.clearTimeout(s),E.set(e,window.setTimeout((()=>{t(),E.delete(e)}),0))}((()=>{this.focused!==t&&(this._focused=t,this.render())}),0,this.debounceId)}render(){this.$start.setAttribute("tabindex",!this.focused||this.inactive?"-1":"0"),this.$end.setAttribute("tabindex",!this.focused||this.inactive?"-1":"0"),this.focused?this.setAttribute("focused",""):this.removeAttribute("focused")}}window.customElements.define("focus-trap",W);var I=new WeakMap,F=new WeakMap,O={},V=0,j=function(t){return t&&(t.host||j(t.parentNode))},R=function(t,i,e){void 0===e&&(e="data-aria-hidden");var s=Array.from(Array.isArray(t)?t:[t]),a=function(t){return"undefined"==typeof document?null:(Array.isArray(t)?t[0]:t).ownerDocument.body}(t);return a?(s.push.apply(s,Array.from(a.querySelectorAll("[aria-live]"))),function(t,i,e,s){var a=function(t,i){return i.map((function(i){if(t.contains(i))return i;var e=j(i);return e&&t.contains(e)?e:(console.error("aria-hidden",i,"in not contained inside",t,". Doing nothing"),null)})).filter((function(t){return Boolean(t)}))}(i,Array.isArray(t)?t:[t]);O[e]||(O[e]=new WeakMap);var h=O[e],n=[],o=new Set,d=new Set(a),r=function(t){t&&!o.has(t)&&(o.add(t),r(t.parentNode))};a.forEach(r);var c=function(t){t&&!d.has(t)&&Array.prototype.forEach.call(t.children,(function(t){if(o.has(t))c(t);else{var i=t.getAttribute(s),a=null!==i&&"false"!==i,d=(I.get(t)||0)+1,r=(h.get(t)||0)+1;I.set(t,d),h.set(t,r),n.push(t),1===d&&a&&F.set(t,!0),1===r&&t.setAttribute(e,"true"),a||t.setAttribute(s,"true")}}))};return c(i),o.clear(),V++,function(){n.forEach((function(t){var i=I.get(t)-1,a=h.get(t)-1;I.set(t,i),h.set(t,a),i||(F.has(t)||t.removeAttribute(s),F.delete(t)),a||t.removeAttribute(e)})),--V||(I=new WeakMap,I=new WeakMap,F=new WeakMap,O={})}}(s,a,e,"aria-hidden")):function(){return null}};const _=class{constructor(e){t(this,e),this.opened=i(this,"opened",7),this.closed=i(this,"closed",7),this.inline=!1,this.closing=!1,this.showing=this.inline||!1,this.onKeyDown=t=>{"Escape"===t.code&&this.close()}}async open(){this.inline||(this.showing=!0,this.undo=R(this.el),this.opened.emit(void 0))}async close(){this.inline||(this.showing=!1,this.closed.emit(void 0),this.undo(),this.triggerElement&&this.triggerElement.focus())}async getState(){return this.showing}async setTriggerElement(t){this.triggerElement=t}handleClick(t){this.showing&&!this.el.contains(t.target)&&this.close()}render(){return e(s,{key:"773d9edf7cf6598394c1210a1fab91af0bcb951e",showing:this.showing,ref:t=>t&&(this.el=t)},!this.inline&&this.showing&&e("div",{key:"c456932007f7ea9a9c3727d9d08fd8fbea5b8670",part:"body",onKeyDown:this.onKeyDown,role:"dialog",tabindex:-1,"aria-hidden":!this.showing,"aria-label":this.label,"aria-modal":this.showing},e("focus-trap",{key:"c1355fe48117067d62ede321afd1f90bf9bf4c22"},e("div",{key:"fbd3ec5e0e7069574f1dbd6c38b40e409b837045",part:"content"},e("slot",{key:"bad04015cc3945efbb68a52de623ee1f4b584868"})))),this.inline&&e("div",{key:"b0577b12dd1bec091de967ccd0ac297451576ad8",part:"content"},e("slot",{key:"5457a9bd5d08feac90adb2ee061d60fb5fb94657"})))}};_.style=":host::part(body){position:absolute;width:-moz-fit-content;width:fit-content;z-index:1200;margin-top:0.5rem}:host::part(backdrop){}:host::part(content){}";export{H as tabworthy_dates_calendar,_ as tabworthy_dates_modal}
|