@tabworthy/components 0.7.0 → 0.7.1

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.
@@ -10824,12 +10824,15 @@ const TabworthyDates = class {
10824
10824
  this.selectDate.emit(this.internalValue);
10825
10825
  }
10826
10826
  announceDateChange(newValue) {
10827
+ const newValueInIsoFormat = Array.isArray(newValue)
10828
+ ? newValue.map((date) => hooks(date, this.format).toISOString())
10829
+ : hooks(newValue, this.format).toISOString();
10827
10830
  let content = "";
10828
- if (Array.isArray(newValue)) {
10829
- if (newValue.length === 1) {
10831
+ if (Array.isArray(newValueInIsoFormat)) {
10832
+ if (newValueInIsoFormat.length === 1) {
10830
10833
  content += `${this.datesLabels.startDate} `;
10831
10834
  }
10832
- newValue.forEach((value, index) => (content += `${index === 1 ? ` ${this.datesLabels.to} ` : ""}${Intl.DateTimeFormat(this.locale, {
10835
+ newValueInIsoFormat.forEach((value, index) => (content += `${index === 1 ? ` ${this.datesLabels.to} ` : ""}${Intl.DateTimeFormat(this.locale, {
10833
10836
  weekday: "long",
10834
10837
  day: "numeric",
10835
10838
  month: "long",
@@ -10842,7 +10845,7 @@ const TabworthyDates = class {
10842
10845
  day: "numeric",
10843
10846
  month: "long",
10844
10847
  year: "numeric"
10845
- }).format(removeTimezoneOffset(new Date(newValue)));
10848
+ }).format(removeTimezoneOffset(new Date(newValueInIsoFormat)));
10846
10849
  if (content.length === 0)
10847
10850
  return;
10848
10851
  content += ` ${this.datesLabels.selected}`;
@@ -10890,7 +10893,7 @@ const TabworthyDates = class {
10890
10893
  }
10891
10894
  render() {
10892
10895
  var _a;
10893
- return (h(Host, { key: 'e8042c6411dbded3f86703ee75b43a8e75ddf621' }, h("label", { key: 'ed3a309a7f11a41122badd9549b513ea3f70c491', htmlFor: this.id ? `${this.id}-input` : undefined, class: this.getClassName("label") }, this.label), h("br", { key: '73391914e5e39af0b054cfcbab02b1d18aca452a' }), h("div", { key: '6b3394842bc2813f918f731745307ea798a483b9', class: this.getClassName("input-container") }, h("input", { key: '8a1f1ac45bbe0050cfc98063d723542a37d86ef5', disabled: this.disabledState || this.disableFreeformInput, 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: 'bbafef3a62331b26e8d0a0eb9886816d8e819085', 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: '68451bf1e8d40dd25f51a370cf745244cf1897eb', label: this.datesLabels.calendar, ref: (el) => (this.modalRef = el), onOpened: () => {
10896
+ return (h(Host, { key: '6fd878d7a0073344895525a82533925fcd24c372' }, h("label", { key: '550382a2ea99201b465fa9fd9ee90a917c5ff7e6', htmlFor: this.id ? `${this.id}-input` : undefined, class: this.getClassName("label") }, this.label), h("br", { key: 'fd6fb69543f81bef9a15157b94a25a5fa107ef70' }), h("div", { key: 'fcc9c10276e35f28435829eea17dfed27373f55c', class: this.getClassName("input-container") }, h("input", { key: '24da8c1582dc66f65a0eb6c6ab380b28bbf1c5ca', disabled: this.disabledState || this.disableFreeformInput, 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: '54cd337b5ddd3ea6aa6ecd59a8fadf2cb5b61026', 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: 'cd8bd92d251d3c2566c9da9f8039ccc2ab74750f', label: this.datesLabels.calendar, ref: (el) => (this.modalRef = el), onOpened: () => {
10894
10897
  if (!this.pickerRef)
10895
10898
  return;
10896
10899
  this.pickerRef.modalIsOpen = true;
@@ -10898,11 +10901,11 @@ const TabworthyDates = class {
10898
10901
  if (!this.pickerRef)
10899
10902
  return;
10900
10903
  this.pickerRef.modalIsOpen = false;
10901
- }, inline: this.inline }, h("tabworthy-dates-calendar", { key: '9ba747fc1bbc1481943624634090b7e8a4792d56', 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 &&
10904
+ }, inline: this.inline }, h("tabworthy-dates-calendar", { key: '929272a053e0109e34d4b2d8456064fc14093912', 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 &&
10902
10905
  ((_a = this.quickButtons) === null || _a === void 0 ? void 0 : _a.length) > 0 &&
10903
- this.chronoSupportedLocale && (h("div", { key: '302a5aca1e85df7ae68bbc416dcc62f406a46868', class: this.getClassName("quick-group"), role: "group", "aria-label": "Quick selection" }, this.quickButtons.map((buttonText) => {
10906
+ this.chronoSupportedLocale && (h("div", { key: 'aead258880c9531e3fb72111f1fd47ebfa35931a', class: this.getClassName("quick-group"), role: "group", "aria-label": "Quick selection" }, this.quickButtons.map((buttonText) => {
10904
10907
  return (h("button", { class: this.getClassName("quick-button"), onClick: this.handleQuickButtonClick, disabled: this.disabledState, type: "button" }, buttonText));
10905
- }))), this.errorState && (h("div", { key: 'c753c27a93017df169b6d603b1f8fb4e6f601a0d', class: this.getClassName("input-error"), id: this.id ? `${this.id}-error` : undefined, role: "status" }, this.errorMessage))));
10908
+ }))), this.errorState && (h("div", { key: '193fe31b36da600e9f222f2576c3bee2d4e0a427', class: this.getClassName("input-error"), id: this.id ? `${this.id}-error` : undefined, role: "status" }, this.errorMessage))));
10906
10909
  }
10907
10910
  get el() { return getElement(this); }
10908
10911
  static get watchers() { return {