@tabworthy/components 0.3.1 → 0.3.2
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/loader.cjs.js +1 -1
- package/dist/cjs/tabworthy-components.cjs.js +1 -1
- package/dist/cjs/tabworthy-dates.cjs.entry.js +9 -10
- package/dist/cjs/tabworthy-times.cjs.entry.js +10 -4
- package/dist/collection/components/tabworthy-dates/tabworthy-dates.js +9 -10
- package/dist/collection/components/tabworthy-times/tabworthy-times.js +30 -4
- package/dist/components/tabworthy-dates.js +1 -1
- package/dist/components/tabworthy-times.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/tabworthy-components.js +1 -1
- package/dist/esm/tabworthy-dates.entry.js +9 -10
- package/dist/esm/tabworthy-times.entry.js +10 -4
- package/dist/tabworthy-components/p-28acdfa7.entry.js +1 -0
- package/dist/tabworthy-components/{p-77bd1bd4.entry.js → p-b4c87db8.entry.js} +1 -1
- package/dist/tabworthy-components/tabworthy-components.esm.js +1 -1
- package/dist/themes/dark.css +1 -1
- package/dist/themes/light.css +1 -1
- package/dist/types/components/tabworthy-times/tabworthy-times.d.ts +1 -0
- package/dist/types/components.d.ts +9 -0
- package/package.json +1 -1
- package/dist/tabworthy-components/p-170bc6ca.entry.js +0 -1
package/dist/cjs/loader.cjs.js
CHANGED
|
@@ -6,7 +6,7 @@ var appGlobals = require('./app-globals-V2Kpy_OQ.js');
|
|
|
6
6
|
const defineCustomElements = async (win, options) => {
|
|
7
7
|
if (typeof window === 'undefined') return undefined;
|
|
8
8
|
await appGlobals.globalScripts();
|
|
9
|
-
return index.bootstrapLazy([["tabworthy-times-picker.cjs",[[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}]}]]],["tabworthy-dates-calendar_2.cjs",[[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"]]]]],["tabworthy-times.cjs",[[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],"internalValue":[32],"selectedDate":[32],"selectedHours":[32],"selectedMinutes":[32],"errorState":[32],"disabledState":[32],"clearValue":[64]},null,{"value":[{"watchValue":0}],"disabled":[{"watchDisabled":0}],"hasError":[{"watchHasError":0}]}]]],["tabworthy-dates.cjs",[[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"],"formatInputOnAccept":[4,"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"],"internalValue":[32],"errorState":[32],"disabledState":[32],"parseDate":[64]},null,{"disabled":[{"watchDisabled":0}],"value":[{"watchValue":0}]}]]]], options);
|
|
9
|
+
return index.bootstrapLazy([["tabworthy-times-picker.cjs",[[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}]}]]],["tabworthy-dates-calendar_2.cjs",[[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"]]]]],["tabworthy-times.cjs",[[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":[4,"input-should-format"],"internalValue":[32],"selectedDate":[32],"selectedHours":[32],"selectedMinutes":[32],"errorState":[32],"disabledState":[32],"clearValue":[64]},null,{"value":[{"watchValue":0}],"disabled":[{"watchDisabled":0}],"hasError":[{"watchHasError":0}]}]]],["tabworthy-dates.cjs",[[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"],"formatInputOnAccept":[4,"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"],"internalValue":[32],"errorState":[32],"disabledState":[32],"parseDate":[64]},null,{"disabled":[{"watchDisabled":0}],"value":[{"watchValue":0}]}]]]], options);
|
|
10
10
|
};
|
|
11
11
|
|
|
12
12
|
exports.setNonce = index.setNonce;
|
|
@@ -19,7 +19,7 @@ var patchBrowser = () => {
|
|
|
19
19
|
|
|
20
20
|
patchBrowser().then(async (options) => {
|
|
21
21
|
await appGlobals.globalScripts();
|
|
22
|
-
return index.bootstrapLazy([["tabworthy-times-picker.cjs",[[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}]}]]],["tabworthy-dates-calendar_2.cjs",[[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"]]]]],["tabworthy-times.cjs",[[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],"internalValue":[32],"selectedDate":[32],"selectedHours":[32],"selectedMinutes":[32],"errorState":[32],"disabledState":[32],"clearValue":[64]},null,{"value":[{"watchValue":0}],"disabled":[{"watchDisabled":0}],"hasError":[{"watchHasError":0}]}]]],["tabworthy-dates.cjs",[[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"],"formatInputOnAccept":[4,"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"],"internalValue":[32],"errorState":[32],"disabledState":[32],"parseDate":[64]},null,{"disabled":[{"watchDisabled":0}],"value":[{"watchValue":0}]}]]]], options);
|
|
22
|
+
return index.bootstrapLazy([["tabworthy-times-picker.cjs",[[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}]}]]],["tabworthy-dates-calendar_2.cjs",[[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"]]]]],["tabworthy-times.cjs",[[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":[4,"input-should-format"],"internalValue":[32],"selectedDate":[32],"selectedHours":[32],"selectedMinutes":[32],"errorState":[32],"disabledState":[32],"clearValue":[64]},null,{"value":[{"watchValue":0}],"disabled":[{"watchDisabled":0}],"hasError":[{"watchHasError":0}]}]]],["tabworthy-dates.cjs",[[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"],"formatInputOnAccept":[4,"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"],"internalValue":[32],"errorState":[32],"disabledState":[32],"parseDate":[64]},null,{"disabled":[{"watchDisabled":0}],"value":[{"watchValue":0}]}]]]], options);
|
|
23
23
|
});
|
|
24
24
|
|
|
25
25
|
exports.setNonce = index.setNonce;
|
|
@@ -10547,7 +10547,8 @@ const TabworthyDates = class {
|
|
|
10547
10547
|
this.handleCalendarButtonClick = async () => {
|
|
10548
10548
|
var _a, _b, _c, _d, _e;
|
|
10549
10549
|
await customElements.whenDefined("tabworthy-dates-modal");
|
|
10550
|
-
this.calendarButtonRef &&
|
|
10550
|
+
this.calendarButtonRef &&
|
|
10551
|
+
(await ((_a = this.modalRef) === null || _a === void 0 ? void 0 : _a.setTriggerElement(this.calendarButtonRef)));
|
|
10551
10552
|
if ((await ((_b = this.modalRef) === null || _b === void 0 ? void 0 : _b.getState())) === false)
|
|
10552
10553
|
await ((_c = this.modalRef) === null || _c === void 0 ? void 0 : _c.open());
|
|
10553
10554
|
else if ((await ((_d = this.modalRef) === null || _d === void 0 ? void 0 : _d.getState())) === true)
|
|
@@ -10622,8 +10623,8 @@ const TabworthyDates = class {
|
|
|
10622
10623
|
this.errorMessage = {
|
|
10623
10624
|
invalid: this.datesLabels.invalidDateError,
|
|
10624
10625
|
rangeOutOfBounds: this.datesLabels.rangeOutOfBoundsError,
|
|
10625
|
-
minDate:
|
|
10626
|
-
maxDate:
|
|
10626
|
+
minDate: "",
|
|
10627
|
+
maxDate: ""
|
|
10627
10628
|
}[parsedRange.reason];
|
|
10628
10629
|
}
|
|
10629
10630
|
}
|
|
@@ -10870,12 +10871,12 @@ const TabworthyDates = class {
|
|
|
10870
10871
|
}
|
|
10871
10872
|
// update text input (useInputValue=false so it formats from internalValue, not from input's current text)
|
|
10872
10873
|
if (this.inputRef) {
|
|
10873
|
-
this.formatInput(
|
|
10874
|
+
this.formatInput(!!this.formatInputOnAccept, false);
|
|
10874
10875
|
}
|
|
10875
10876
|
}
|
|
10876
10877
|
render() {
|
|
10877
10878
|
var _a;
|
|
10878
|
-
return (index$1.h(index$1.Host, { key: '
|
|
10879
|
+
return (index$1.h(index$1.Host, { key: '161da7818cb74c9641e3012b6b1c32524cc4d395' }, index$1.h("label", { key: 'ae99317da0d4986f2c666e202efa98dc4f7f2574', htmlFor: this.id ? `${this.id}-input` : undefined, class: this.getClassName("label") }, this.label), index$1.h("br", { key: '1c0690f2c16cafc1256acb5a91375ed078f302b9' }), index$1.h("div", { key: '8f869d82ee208a7de309836c3df29f857caf151f', class: this.getClassName("input-container") }, index$1.h("input", { key: '14fa0600bc8537229adf19e134583ba26e76dda1', disabled: this.disabledState, id: this.id ? `${this.id}-input` : undefined, type: "text", placeholder: this.placeholder, class: this.getClassName("input"), ref: (r) => (this.inputRef = r), onChange: this.handleChange, onFocus: () => this.formatInput(false), onBlur: () => this.formatInput(true, false), "aria-describedby": this.errorState ? `${this.id}-error` : undefined, "aria-invalid": this.errorState }), !this.inline && (index$1.h("button", { key: 'd7f988423b9a50d982c0b8b057145c4948f7d2ef', type: "button", ref: (r) => (this.calendarButtonRef = r), onClick: this.handleCalendarButtonClick, class: this.getClassName("calendar-button"), disabled: this.disabledState }, this.calendarButtonContent ? (index$1.h("span", { innerHTML: this.calendarButtonContent })) : (this.datesLabels.openCalendar)))), index$1.h("tabworthy-dates-modal", { key: 'a8601ac99e61c734fff0056f8ba4f3e3241e50c5', label: this.datesLabels.calendar, ref: (el) => (this.modalRef = el), onOpened: () => {
|
|
10879
10880
|
if (!this.pickerRef)
|
|
10880
10881
|
return;
|
|
10881
10882
|
this.pickerRef.modalIsOpen = true;
|
|
@@ -10883,13 +10884,11 @@ const TabworthyDates = class {
|
|
|
10883
10884
|
if (!this.pickerRef)
|
|
10884
10885
|
return;
|
|
10885
10886
|
this.pickerRef.modalIsOpen = false;
|
|
10886
|
-
}, inline: this.inline }, index$1.h("tabworthy-dates-calendar", { key: '
|
|
10887
|
-
? this.datesCalendarLabels
|
|
10888
|
-
: undefined, ref: (el) => (this.pickerRef = el), startDate: this.startDate, firstDayOfWeek: this.firstDayOfWeek, showHiddenTitle: true, disabled: this.disabledState, showMonthStepper: this.showMonthStepper, showYearStepper: this.showYearStepper, showClearButton: this.showClearButton, showKeyboardHint: this.showKeyboardHint, showTodayButton: this.showTodayButton, disableDate: this.disableDate, minDate: this.minDate, maxDate: this.maxDate, inline: this.inline })), this.showQuickButtons &&
|
|
10887
|
+
}, inline: this.inline }, index$1.h("tabworthy-dates-calendar", { key: 'a583448ca60f4ea1bb48ff5d33ba561ca627617c', range: this.range, locale: this.locale, onSelectDate: (event) => this.handlePickerSelection(event.detail), onChangeMonth: (event) => this.handleChangedMonths(event.detail), onChangeYear: (event) => this.handleYearChange(event.detail), labels: this.datesCalendarLabels ? this.datesCalendarLabels : undefined, ref: (el) => (this.pickerRef = el), startDate: this.startDate, firstDayOfWeek: this.firstDayOfWeek, showHiddenTitle: true, disabled: this.disabledState, showMonthStepper: this.showMonthStepper, showYearStepper: this.showYearStepper, showClearButton: this.showClearButton, showKeyboardHint: this.showKeyboardHint, showTodayButton: this.showTodayButton, disableDate: this.disableDate, minDate: this.minDate, maxDate: this.maxDate, inline: this.inline })), this.showQuickButtons &&
|
|
10889
10888
|
((_a = this.quickButtons) === null || _a === void 0 ? void 0 : _a.length) > 0 &&
|
|
10890
|
-
this.chronoSupportedLocale && (index$1.h("div", { key: '
|
|
10889
|
+
this.chronoSupportedLocale && (index$1.h("div", { key: 'f9fe7671e933099a0d95b7099ee2d18ab7eb30c5', class: this.getClassName("quick-group"), role: "group", "aria-label": "Quick selection" }, this.quickButtons.map((buttonText) => {
|
|
10891
10890
|
return (index$1.h("button", { class: this.getClassName("quick-button"), onClick: this.handleQuickButtonClick, disabled: this.disabledState, type: "button" }, buttonText));
|
|
10892
|
-
}))), this.errorState && (index$1.h("div", { key: '
|
|
10891
|
+
}))), this.errorState && (index$1.h("div", { key: '632b1d3e67b6ab9b0370092b5c8222fe3bdb4d11', class: this.getClassName("input-error"), id: this.id ? `${this.id}-error` : undefined, role: "status" }, this.errorMessage))));
|
|
10893
10892
|
}
|
|
10894
10893
|
get el() { return index$1.getElement(this); }
|
|
10895
10894
|
static get watchers() { return {
|
|
@@ -61,6 +61,8 @@ const InclusiveTimes = class {
|
|
|
61
61
|
this.firstDayOfWeek = 1;
|
|
62
62
|
// Format for the value prop (input/output format). Defaults to ISO 8601 format.
|
|
63
63
|
this.format = "YYYY-MM-DDTHH:mm:ss";
|
|
64
|
+
// If true, format input on blur/accept (like dates)
|
|
65
|
+
this.inputShouldFormat = true;
|
|
64
66
|
this.selectedHours = 12;
|
|
65
67
|
this.selectedMinutes = 0;
|
|
66
68
|
this.errorState = this.hasError;
|
|
@@ -109,7 +111,9 @@ const InclusiveTimes = class {
|
|
|
109
111
|
// Can be used for month change tracking
|
|
110
112
|
};
|
|
111
113
|
this.handleInputBlur = () => {
|
|
112
|
-
this.
|
|
114
|
+
if (this.inputShouldFormat) {
|
|
115
|
+
this.formatInput();
|
|
116
|
+
}
|
|
113
117
|
};
|
|
114
118
|
this.handleInputChange = (event) => {
|
|
115
119
|
const value = event.target.value;
|
|
@@ -183,7 +187,9 @@ const InclusiveTimes = class {
|
|
|
183
187
|
this.selectDateTime.emit(formatted);
|
|
184
188
|
}
|
|
185
189
|
this.errorState = false;
|
|
186
|
-
this.
|
|
190
|
+
if (this.inputShouldFormat) {
|
|
191
|
+
this.formatInput();
|
|
192
|
+
}
|
|
187
193
|
}
|
|
188
194
|
formatInput() {
|
|
189
195
|
if (!this.internalValue)
|
|
@@ -215,7 +221,7 @@ const InclusiveTimes = class {
|
|
|
215
221
|
}
|
|
216
222
|
render() {
|
|
217
223
|
var _a;
|
|
218
|
-
return (index.h(index.Host, { key: '
|
|
224
|
+
return (index.h(index.Host, { key: 'e9ef24f7b4e7797607f4e46c3c7da892e276160c', class: this.elementClassName, "has-error": this.errorState, disabled: this.disabledState }, index.h("label", { key: '9fbc1b57f9466e2e76dc46c6fd498e525d1cc1ee', htmlFor: `${this.id}-input`, class: this.getClassName("label") }, this.label), index.h("div", { key: '2958a036e04b53761451adec9986c0305b9425af', class: this.getClassName("input-container") }, index.h("input", { key: 'bee806dc1c5630c3032fd07eadbb0100ccfea89b', id: `${this.id}-input`, ref: (r) => (this.inputRef = r), type: "text", class: this.getClassName("input"), placeholder: this.placeholder, disabled: this.disabledState, value: (_a = this.internalValue) === null || _a === void 0 ? void 0 : _a.toString(), onBlur: this.handleInputBlur, onChange: this.handleInputChange, "aria-describedby": this.errorState ? `${this.id}-error` : undefined, "aria-invalid": this.errorState }), !this.inline && (index.h("button", { key: 'c8e490c2c004d2ad096848fcc83389524c767819', type: "button", ref: (r) => (this.calendarButtonRef = r), onClick: this.handleCalendarButtonClick, class: this.getClassName("calendar-button"), disabled: this.disabledState }, this.calendarButtonContent ? (index.h("span", { innerHTML: this.calendarButtonContent })) : (this.timesLabels.openCalendar)))), index.h("tabworthy-dates-modal", { key: '1620370de6b83f1d8de49fc0c44702d2a4495c62', label: this.timesLabels.calendar, ref: (el) => (this.modalRef = el), onOpened: () => {
|
|
219
225
|
if (this.pickerRef) {
|
|
220
226
|
this.pickerRef.modalIsOpen = true;
|
|
221
227
|
}
|
|
@@ -223,7 +229,7 @@ const InclusiveTimes = class {
|
|
|
223
229
|
if (this.pickerRef) {
|
|
224
230
|
this.pickerRef.modalIsOpen = false;
|
|
225
231
|
}
|
|
226
|
-
}, inline: this.inline }, index.h("div", { key: '
|
|
232
|
+
}, inline: this.inline }, index.h("div", { key: '9521fd9f0fbdd6b1b6114fafbe6d623537fb1420', class: this.getClassName("picker-container") }, index.h("tabworthy-dates-calendar", { key: 'da204266d8c440961fffdbf58aa10cd1e5630357', range: this.range, locale: this.locale, onSelectDate: (event) => this.handlePickerSelection(event.detail), onChangeMonth: (event) => this.handleChangedMonths(event.detail), onChangeYear: (event) => this.handleYearChange(event.detail), labels: this.datesCalendarLabels, ref: (el) => (this.pickerRef = el), startDate: this.startDate, firstDayOfWeek: this.firstDayOfWeek, showHiddenTitle: true, 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 }, index.h("div", { key: 'b82af457943cdcae6f098688f7c90bda0aeed427', slot: "after-calendar", class: this.getClassName("time-section") }, index.h("tabworthy-times-picker", { key: '6800ae768ecb4796105f9d1981cc8315732a1335', hours: this.selectedHours, minutes: this.selectedMinutes, use12HourFormat: this.use12HourFormat, disabled: this.disabledState, onTimeChanged: this.handleTimeChange }))))), this.errorState && (index.h("div", { key: '648df2b385853946f5b2ae5f2f453fc8a25c1069', class: this.getClassName("input-error"), id: this.id ? `${this.id}-error` : undefined, role: "status" }, this.errorMessage))));
|
|
227
233
|
}
|
|
228
234
|
get el() { return index.getElement(this); }
|
|
229
235
|
static get watchers() { return {
|
|
@@ -76,7 +76,8 @@ export class TabworthyDates {
|
|
|
76
76
|
this.handleCalendarButtonClick = async () => {
|
|
77
77
|
var _a, _b, _c, _d, _e;
|
|
78
78
|
await customElements.whenDefined("tabworthy-dates-modal");
|
|
79
|
-
this.calendarButtonRef &&
|
|
79
|
+
this.calendarButtonRef &&
|
|
80
|
+
(await ((_a = this.modalRef) === null || _a === void 0 ? void 0 : _a.setTriggerElement(this.calendarButtonRef)));
|
|
80
81
|
if ((await ((_b = this.modalRef) === null || _b === void 0 ? void 0 : _b.getState())) === false)
|
|
81
82
|
await ((_c = this.modalRef) === null || _c === void 0 ? void 0 : _c.open());
|
|
82
83
|
else if ((await ((_d = this.modalRef) === null || _d === void 0 ? void 0 : _d.getState())) === true)
|
|
@@ -151,8 +152,8 @@ export class TabworthyDates {
|
|
|
151
152
|
this.errorMessage = {
|
|
152
153
|
invalid: this.datesLabels.invalidDateError,
|
|
153
154
|
rangeOutOfBounds: this.datesLabels.rangeOutOfBoundsError,
|
|
154
|
-
minDate:
|
|
155
|
-
maxDate:
|
|
155
|
+
minDate: "",
|
|
156
|
+
maxDate: ""
|
|
156
157
|
}[parsedRange.reason];
|
|
157
158
|
}
|
|
158
159
|
}
|
|
@@ -399,12 +400,12 @@ export class TabworthyDates {
|
|
|
399
400
|
}
|
|
400
401
|
// update text input (useInputValue=false so it formats from internalValue, not from input's current text)
|
|
401
402
|
if (this.inputRef) {
|
|
402
|
-
this.formatInput(
|
|
403
|
+
this.formatInput(!!this.formatInputOnAccept, false);
|
|
403
404
|
}
|
|
404
405
|
}
|
|
405
406
|
render() {
|
|
406
407
|
var _a;
|
|
407
|
-
return (h(Host, { key: '
|
|
408
|
+
return (h(Host, { key: '161da7818cb74c9641e3012b6b1c32524cc4d395' }, h("label", { key: 'ae99317da0d4986f2c666e202efa98dc4f7f2574', htmlFor: this.id ? `${this.id}-input` : undefined, class: this.getClassName("label") }, this.label), h("br", { key: '1c0690f2c16cafc1256acb5a91375ed078f302b9' }), h("div", { key: '8f869d82ee208a7de309836c3df29f857caf151f', class: this.getClassName("input-container") }, h("input", { key: '14fa0600bc8537229adf19e134583ba26e76dda1', disabled: this.disabledState, id: this.id ? `${this.id}-input` : undefined, type: "text", placeholder: this.placeholder, class: this.getClassName("input"), ref: (r) => (this.inputRef = r), onChange: this.handleChange, onFocus: () => this.formatInput(false), onBlur: () => this.formatInput(true, false), "aria-describedby": this.errorState ? `${this.id}-error` : undefined, "aria-invalid": this.errorState }), !this.inline && (h("button", { key: 'd7f988423b9a50d982c0b8b057145c4948f7d2ef', type: "button", ref: (r) => (this.calendarButtonRef = r), onClick: this.handleCalendarButtonClick, class: this.getClassName("calendar-button"), disabled: this.disabledState }, this.calendarButtonContent ? (h("span", { innerHTML: this.calendarButtonContent })) : (this.datesLabels.openCalendar)))), h("tabworthy-dates-modal", { key: 'a8601ac99e61c734fff0056f8ba4f3e3241e50c5', label: this.datesLabels.calendar, ref: (el) => (this.modalRef = el), onOpened: () => {
|
|
408
409
|
if (!this.pickerRef)
|
|
409
410
|
return;
|
|
410
411
|
this.pickerRef.modalIsOpen = true;
|
|
@@ -412,13 +413,11 @@ export class TabworthyDates {
|
|
|
412
413
|
if (!this.pickerRef)
|
|
413
414
|
return;
|
|
414
415
|
this.pickerRef.modalIsOpen = false;
|
|
415
|
-
}, inline: this.inline }, h("tabworthy-dates-calendar", { key: '
|
|
416
|
-
? this.datesCalendarLabels
|
|
417
|
-
: undefined, ref: (el) => (this.pickerRef = el), startDate: this.startDate, firstDayOfWeek: this.firstDayOfWeek, showHiddenTitle: true, disabled: this.disabledState, showMonthStepper: this.showMonthStepper, showYearStepper: this.showYearStepper, showClearButton: this.showClearButton, showKeyboardHint: this.showKeyboardHint, showTodayButton: this.showTodayButton, disableDate: this.disableDate, minDate: this.minDate, maxDate: this.maxDate, inline: this.inline })), this.showQuickButtons &&
|
|
416
|
+
}, inline: this.inline }, h("tabworthy-dates-calendar", { key: 'a583448ca60f4ea1bb48ff5d33ba561ca627617c', range: this.range, locale: this.locale, onSelectDate: (event) => this.handlePickerSelection(event.detail), onChangeMonth: (event) => this.handleChangedMonths(event.detail), onChangeYear: (event) => this.handleYearChange(event.detail), labels: this.datesCalendarLabels ? this.datesCalendarLabels : undefined, ref: (el) => (this.pickerRef = el), startDate: this.startDate, firstDayOfWeek: this.firstDayOfWeek, showHiddenTitle: true, disabled: this.disabledState, showMonthStepper: this.showMonthStepper, showYearStepper: this.showYearStepper, showClearButton: this.showClearButton, showKeyboardHint: this.showKeyboardHint, showTodayButton: this.showTodayButton, disableDate: this.disableDate, minDate: this.minDate, maxDate: this.maxDate, inline: this.inline })), this.showQuickButtons &&
|
|
418
417
|
((_a = this.quickButtons) === null || _a === void 0 ? void 0 : _a.length) > 0 &&
|
|
419
|
-
this.chronoSupportedLocale && (h("div", { key: '
|
|
418
|
+
this.chronoSupportedLocale && (h("div", { key: 'f9fe7671e933099a0d95b7099ee2d18ab7eb30c5', class: this.getClassName("quick-group"), role: "group", "aria-label": "Quick selection" }, this.quickButtons.map((buttonText) => {
|
|
420
419
|
return (h("button", { class: this.getClassName("quick-button"), onClick: this.handleQuickButtonClick, disabled: this.disabledState, type: "button" }, buttonText));
|
|
421
|
-
}))), this.errorState && (h("div", { key: '
|
|
420
|
+
}))), this.errorState && (h("div", { key: '632b1d3e67b6ab9b0370092b5c8222fe3bdb4d11', class: this.getClassName("input-error"), id: this.id ? `${this.id}-error` : undefined, role: "status" }, this.errorMessage))));
|
|
422
421
|
}
|
|
423
422
|
static get is() { return "tabworthy-dates"; }
|
|
424
423
|
static get encapsulation() { return "scoped"; }
|
|
@@ -54,6 +54,8 @@ export class InclusiveTimes {
|
|
|
54
54
|
this.firstDayOfWeek = 1;
|
|
55
55
|
// Format for the value prop (input/output format). Defaults to ISO 8601 format.
|
|
56
56
|
this.format = "YYYY-MM-DDTHH:mm:ss";
|
|
57
|
+
// If true, format input on blur/accept (like dates)
|
|
58
|
+
this.inputShouldFormat = true;
|
|
57
59
|
this.selectedHours = 12;
|
|
58
60
|
this.selectedMinutes = 0;
|
|
59
61
|
this.errorState = this.hasError;
|
|
@@ -102,7 +104,9 @@ export class InclusiveTimes {
|
|
|
102
104
|
// Can be used for month change tracking
|
|
103
105
|
};
|
|
104
106
|
this.handleInputBlur = () => {
|
|
105
|
-
this.
|
|
107
|
+
if (this.inputShouldFormat) {
|
|
108
|
+
this.formatInput();
|
|
109
|
+
}
|
|
106
110
|
};
|
|
107
111
|
this.handleInputChange = (event) => {
|
|
108
112
|
const value = event.target.value;
|
|
@@ -176,7 +180,9 @@ export class InclusiveTimes {
|
|
|
176
180
|
this.selectDateTime.emit(formatted);
|
|
177
181
|
}
|
|
178
182
|
this.errorState = false;
|
|
179
|
-
this.
|
|
183
|
+
if (this.inputShouldFormat) {
|
|
184
|
+
this.formatInput();
|
|
185
|
+
}
|
|
180
186
|
}
|
|
181
187
|
formatInput() {
|
|
182
188
|
if (!this.internalValue)
|
|
@@ -208,7 +214,7 @@ export class InclusiveTimes {
|
|
|
208
214
|
}
|
|
209
215
|
render() {
|
|
210
216
|
var _a;
|
|
211
|
-
return (h(Host, { key: '
|
|
217
|
+
return (h(Host, { key: 'e9ef24f7b4e7797607f4e46c3c7da892e276160c', class: this.elementClassName, "has-error": this.errorState, disabled: this.disabledState }, h("label", { key: '9fbc1b57f9466e2e76dc46c6fd498e525d1cc1ee', htmlFor: `${this.id}-input`, class: this.getClassName("label") }, this.label), h("div", { key: '2958a036e04b53761451adec9986c0305b9425af', class: this.getClassName("input-container") }, h("input", { key: 'bee806dc1c5630c3032fd07eadbb0100ccfea89b', id: `${this.id}-input`, ref: (r) => (this.inputRef = r), type: "text", class: this.getClassName("input"), placeholder: this.placeholder, disabled: this.disabledState, value: (_a = this.internalValue) === null || _a === void 0 ? void 0 : _a.toString(), onBlur: this.handleInputBlur, onChange: this.handleInputChange, "aria-describedby": this.errorState ? `${this.id}-error` : undefined, "aria-invalid": this.errorState }), !this.inline && (h("button", { key: 'c8e490c2c004d2ad096848fcc83389524c767819', type: "button", ref: (r) => (this.calendarButtonRef = r), onClick: this.handleCalendarButtonClick, class: this.getClassName("calendar-button"), disabled: this.disabledState }, this.calendarButtonContent ? (h("span", { innerHTML: this.calendarButtonContent })) : (this.timesLabels.openCalendar)))), h("tabworthy-dates-modal", { key: '1620370de6b83f1d8de49fc0c44702d2a4495c62', label: this.timesLabels.calendar, ref: (el) => (this.modalRef = el), onOpened: () => {
|
|
212
218
|
if (this.pickerRef) {
|
|
213
219
|
this.pickerRef.modalIsOpen = true;
|
|
214
220
|
}
|
|
@@ -216,7 +222,7 @@ export class InclusiveTimes {
|
|
|
216
222
|
if (this.pickerRef) {
|
|
217
223
|
this.pickerRef.modalIsOpen = false;
|
|
218
224
|
}
|
|
219
|
-
}, inline: this.inline }, h("div", { key: '
|
|
225
|
+
}, inline: this.inline }, h("div", { key: '9521fd9f0fbdd6b1b6114fafbe6d623537fb1420', class: this.getClassName("picker-container") }, h("tabworthy-dates-calendar", { key: 'da204266d8c440961fffdbf58aa10cd1e5630357', range: this.range, locale: this.locale, onSelectDate: (event) => this.handlePickerSelection(event.detail), onChangeMonth: (event) => this.handleChangedMonths(event.detail), onChangeYear: (event) => this.handleYearChange(event.detail), labels: this.datesCalendarLabels, ref: (el) => (this.pickerRef = el), startDate: this.startDate, firstDayOfWeek: this.firstDayOfWeek, showHiddenTitle: true, 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 }, h("div", { key: 'b82af457943cdcae6f098688f7c90bda0aeed427', slot: "after-calendar", class: this.getClassName("time-section") }, h("tabworthy-times-picker", { key: '6800ae768ecb4796105f9d1981cc8315732a1335', hours: this.selectedHours, minutes: this.selectedMinutes, use12HourFormat: this.use12HourFormat, disabled: this.disabledState, onTimeChanged: this.handleTimeChange }))))), this.errorState && (h("div", { key: '648df2b385853946f5b2ae5f2f453fc8a25c1069', class: this.getClassName("input-error"), id: this.id ? `${this.id}-error` : undefined, role: "status" }, this.errorMessage))));
|
|
220
226
|
}
|
|
221
227
|
static get is() { return "tabworthy-times"; }
|
|
222
228
|
static get encapsulation() { return "scoped"; }
|
|
@@ -727,6 +733,26 @@ export class InclusiveTimes {
|
|
|
727
733
|
"reflect": false,
|
|
728
734
|
"attribute": "format",
|
|
729
735
|
"defaultValue": "\"YYYY-MM-DDTHH:mm:ss\""
|
|
736
|
+
},
|
|
737
|
+
"inputShouldFormat": {
|
|
738
|
+
"type": "boolean",
|
|
739
|
+
"mutable": false,
|
|
740
|
+
"complexType": {
|
|
741
|
+
"original": "boolean",
|
|
742
|
+
"resolved": "boolean",
|
|
743
|
+
"references": {}
|
|
744
|
+
},
|
|
745
|
+
"required": false,
|
|
746
|
+
"optional": false,
|
|
747
|
+
"docs": {
|
|
748
|
+
"tags": [],
|
|
749
|
+
"text": ""
|
|
750
|
+
},
|
|
751
|
+
"getter": false,
|
|
752
|
+
"setter": false,
|
|
753
|
+
"reflect": false,
|
|
754
|
+
"attribute": "input-should-format",
|
|
755
|
+
"defaultValue": "true"
|
|
730
756
|
}
|
|
731
757
|
};
|
|
732
758
|
}
|