@nyaruka/temba-components 0.129.0 → 0.129.1

package/CHANGELOG.md

@@ -4,8 +4,14 @@ All notable changes to this project will be documented in this file. Dates are d
 
 Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
+#### [v0.129.1](https://github.com/nyaruka/temba-components/compare/v0.129.0...v0.129.1)
+
+- Fix formatting for range dates [`#590`](https://github.com/nyaruka/temba-components/pull/590)
+
 #### [v0.129.0](https://github.com/nyaruka/temba-components/compare/v0.128.0...v0.129.0)
 
+> 24 June 2025
+
 - Smarter monthly paging [`#589`](https://github.com/nyaruka/temba-components/pull/589)
 - Add horizontal chart option [`#588`](https://github.com/nyaruka/temba-components/pull/588)
 - Add date range component [`#587`](https://github.com/nyaruka/temba-components/pull/587)

package/dist/temba-components.js

@@ -9042,7 +9042,7 @@ var GE=function(){if("undefined"!=typeof window){if(window.devicePixelRatio)retu
         </temba-select>
         <div></div>
       </div>
-    </div>`}}t([ue({type:String})],IA.prototype,"chartType",void 0),t([ue({type:Boolean})],IA.prototype,"horizontal",void 0),t([ue({type:String})],IA.prototype,"url",void 0),t([ue({type:String})],IA.prototype,"start",void 0),t([ue({type:String})],IA.prototype,"end",void 0),t([ue({type:String})],IA.prototype,"header",void 0),t([ue({type:Boolean})],IA.prototype,"other",void 0),t([ue({type:Object})],IA.prototype,"data",void 0),t([pe()],IA.prototype,"datasets",void 0),t([ue({type:Number})],IA.prototype,"maxSplits",void 0),t([ue({type:String,attribute:"splits"})],IA.prototype,"splitNames",void 0),t([ue({type:String})],IA.prototype,"xType",void 0),t([ue({type:Number})],IA.prototype,"xMaxTicks",void 0),t([ue({type:String})],IA.prototype,"yType",void 0),t([ue({type:String})],IA.prototype,"xFormat",void 0),t([ue({type:Number})],IA.prototype,"maxChartHeight",void 0),t([ue({type:Boolean})],IA.prototype,"hideOther",void 0),t([pe()],IA.prototype,"splits",void 0),t([ue({type:String})],IA.prototype,"dataname",void 0),t([ue({type:Boolean})],IA.prototype,"single",void 0),t([ue({type:Boolean})],IA.prototype,"legend",void 0),t([ue({type:Boolean})],IA.prototype,"config",void 0),t([ue({type:Boolean})],IA.prototype,"showAll",void 0),t([ue({type:Number})],IA.prototype,"colorIndex",void 0),t([pe()],IA.prototype,"showConfig",void 0),t([ue({type:String})],IA.prototype,"palette",void 0),t([ue({type:Number})],IA.prototype,"opacity",void 0),t([ue({type:Number})],IA.prototype,"seriesBorderRadius",void 0),t([ue({type:Number})],IA.prototype,"seriesBorderWidth",void 0),t([ue({type:Boolean,attribute:"percent"})],IA.prototype,"showPercent",void 0);class LA extends ge{constructor(){super(...arguments),this.startDate="",this.endDate="",this.editingStart=!1,this.editingEnd=!1,this.selectedRange="",this.minDate="2012-01-01",this.maxDate=Ys.now().toISODate()}handleStartClick(){this.editingStart=!0}handleEndClick(){this.editingEnd=!0}setRange(t){const e=Ys.now().toISODate();let i="";"W"===t?i=Ys.now().minus({days:6}).toISODate():"M"===t?i=Ys.now().minus({months:1}).plus({days:1}).toISODate():"Y"===t?i=Ys.now().minus({years:1}).plus({days:1}).toISODate():"ALL"===t&&(i=this.minDate||"2012-01-01"),this.startDate=i,this.endDate=e,this.selectedRange=t,this.editingStart=!1,this.editingEnd=!1,this.fireCustomEvent(Oe.DateRangeChanged,{start:this.startDate,end:this.endDate,range:this.selectedRange})}setValidRange(t,e){let i=e;i<this.minDate&&(i=this.minDate),i>this.maxDate&&(i=this.maxDate);const n=Ys.fromISO("start"===t?i:this.startDate),o=Ys.fromISO("end"===t?i:this.endDate);n.isValid&&o.isValid&&(n>o?"start"===t?(this.startDate=i,this.endDate=n.toISODate()):(this.endDate=i,this.startDate=o.toISODate()):"start"===t?this.startDate=i:this.endDate=i,this.fireCustomEvent(Oe.DateRangeChanged,{start:this.startDate,end:this.endDate,range:this.selectedRange}))}canNavigatePrevious(){if("ALL"===this.selectedRange)return!1;const t=Ys.fromISO(this.startDate);let e;if("W"===this.selectedRange)e=t.minus({weeks:1});else if("M"===this.selectedRange)e=t.minus({months:1});else if("Y"===this.selectedRange)e=t.minus({years:1});else{if(""!==this.selectedRange)return!1;{const i=this.getCustomRangeInterval();if("days"===i.type)e=t.minus({days:i.amount});else if("months"===i.type)e=t.minus({months:i.amount});else{if("years"!==i.type)return!1;e=t.minus({years:i.amount})}}}return e.toISODate()>=this.minDate}canNavigateNext(){if("ALL"===this.selectedRange)return!1;const t=Ys.fromISO(this.endDate);let e;if("W"===this.selectedRange)e=t.plus({weeks:1});else if("M"===this.selectedRange)e=t.plus({months:1});else if("Y"===this.selectedRange)e=t.plus({years:1});else{if(""!==this.selectedRange)return!1;{const i=this.getCustomRangeInterval();if("days"===i.type)e=t.plus({days:i.amount});else if("months"===i.type)e=t.plus({months:i.amount});else{if("years"!==i.type)return!1;e=t.plus({years:i.amount})}}}return e.toISODate()<=this.maxDate}getCustomRangeInterval(){const t=Ys.fromISO(this.startDate),e=Ys.fromISO(this.endDate);if(!t.isValid||!e.isValid)return{type:"days",amount:1};const i=e.day===e.daysInMonth;if(1===t.day&&i){if(t.month===e.month&&t.year===e.year)return{type:"months",amount:1};const i=t.startOf("month"),n=e.endOf("month").diff(i,"months").months+1;if(n>0&&Number.isInteger(n))return{type:"months",amount:Math.round(n)}}if(1===t.month&&1===t.day&&12===e.month&&31===e.day){if(t.year===e.year)return{type:"years",amount:1};const i=e.year-t.year+1;if(i>0)return{type:"years",amount:i}}const n=e.diff(t,"days").days+1;return{type:"days",amount:Math.max(1,Math.round(n))}}navigatePrevious(){if(!this.canNavigatePrevious())return;const t=Ys.fromISO(this.startDate),e=Ys.fromISO(this.endDate);let i,n;if("W"===this.selectedRange)i=t.minus({weeks:1}),n=e.minus({weeks:1});else if("M"===this.selectedRange){const o=this.getCustomRangeInterval();"months"===o.type?(i=t.minus({months:1}).startOf("month"),n=i.plus({months:o.amount}).minus({days:1}).endOf("day")):(i=t.minus({months:1}),n=e.minus({months:1}))}else if("Y"===this.selectedRange)i=t.minus({years:1}),n=e.minus({years:1});else{if(""!==this.selectedRange)return;{const o=this.getCustomRangeInterval();if("days"===o.type)i=t.minus({days:o.amount}),n=e.minus({days:o.amount});else if("months"===o.type)i=t.minus({months:o.amount}).startOf("month"),n=i.plus({months:o.amount}).minus({days:1}).endOf("day");else{if("years"!==o.type)return;i=t.minus({years:o.amount}),n=e.minus({years:o.amount})}}}const o=Ys.fromISO(this.minDate),s=Ys.fromISO(this.maxDate),r=i<o?this.minDate:i.toISODate(),a=n>s?this.maxDate:n.toISODate();this.startDate=r,this.endDate=a,this.fireCustomEvent(Oe.DateRangeChanged,{start:this.startDate,end:this.endDate,range:this.selectedRange})}navigateNext(){if(!this.canNavigateNext())return;const t=Ys.fromISO(this.startDate),e=Ys.fromISO(this.endDate);let i,n;if("W"===this.selectedRange)i=t.plus({weeks:1}),n=e.plus({weeks:1});else if("M"===this.selectedRange){const o=this.getCustomRangeInterval();"months"===o.type?(i=t.plus({months:1}).startOf("month"),n=i.plus({months:o.amount}).minus({days:1}).endOf("day")):(i=t.plus({months:1}),n=e.plus({months:1}))}else if("Y"===this.selectedRange)i=t.plus({years:1}),n=e.plus({years:1});else{if(""!==this.selectedRange)return;{const o=this.getCustomRangeInterval();if("days"===o.type)i=t.plus({days:o.amount}),n=e.plus({days:o.amount});else if("months"===o.type)i=t.plus({months:o.amount}).startOf("month"),n=i.plus({months:o.amount}).minus({days:1}).endOf("day");else{if("years"!==o.type)return;i=t.plus({years:o.amount}),n=e.plus({years:o.amount})}}}const o=Ys.fromISO(this.minDate),s=Ys.fromISO(this.maxDate),r=i<o?this.minDate:i.toISODate(),a=n>s?this.maxDate:n.toISODate();this.startDate=r,this.endDate=a,this.fireCustomEvent(Oe.DateRangeChanged,{start:this.startDate,end:this.endDate,range:this.selectedRange})}getNavigationLabel(t){const e=this.getCustomRangeInterval(),i=e.amount;return`${"previous"===t?"Previous":"Next"} ${i} ${"days"===e.type?1===i?"day":"days":"months"===e.type?1===i?"month":"months":1===i?"year":"years"}`}updated(t){super.updated(t),(t.has("startDate")&&t.has("endDate")&&!this.startDate||!this.endDate)&&this.setRange("M"),t.has("editingStart")&&this.editingStart&&setTimeout((()=>{var t;const e=null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector("temba-datepicker.start-picker");e&&e.handleClicked()}),0),t.has("editingEnd")&&this.editingEnd&&setTimeout((()=>{var t;const e=null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector("temba-datepicker.end-picker");e&&e.handleClicked()}),0)}render(){return U`
+    </div>`}}t([ue({type:String})],IA.prototype,"chartType",void 0),t([ue({type:Boolean})],IA.prototype,"horizontal",void 0),t([ue({type:String})],IA.prototype,"url",void 0),t([ue({type:String})],IA.prototype,"start",void 0),t([ue({type:String})],IA.prototype,"end",void 0),t([ue({type:String})],IA.prototype,"header",void 0),t([ue({type:Boolean})],IA.prototype,"other",void 0),t([ue({type:Object})],IA.prototype,"data",void 0),t([pe()],IA.prototype,"datasets",void 0),t([ue({type:Number})],IA.prototype,"maxSplits",void 0),t([ue({type:String,attribute:"splits"})],IA.prototype,"splitNames",void 0),t([ue({type:String})],IA.prototype,"xType",void 0),t([ue({type:Number})],IA.prototype,"xMaxTicks",void 0),t([ue({type:String})],IA.prototype,"yType",void 0),t([ue({type:String})],IA.prototype,"xFormat",void 0),t([ue({type:Number})],IA.prototype,"maxChartHeight",void 0),t([ue({type:Boolean})],IA.prototype,"hideOther",void 0),t([pe()],IA.prototype,"splits",void 0),t([ue({type:String})],IA.prototype,"dataname",void 0),t([ue({type:Boolean})],IA.prototype,"single",void 0),t([ue({type:Boolean})],IA.prototype,"legend",void 0),t([ue({type:Boolean})],IA.prototype,"config",void 0),t([ue({type:Boolean})],IA.prototype,"showAll",void 0),t([ue({type:Number})],IA.prototype,"colorIndex",void 0),t([pe()],IA.prototype,"showConfig",void 0),t([ue({type:String})],IA.prototype,"palette",void 0),t([ue({type:Number})],IA.prototype,"opacity",void 0),t([ue({type:Number})],IA.prototype,"seriesBorderRadius",void 0),t([ue({type:Number})],IA.prototype,"seriesBorderWidth",void 0),t([ue({type:Boolean,attribute:"percent"})],IA.prototype,"showPercent",void 0);class LA extends ge{constructor(){super(...arguments),this.startDate="",this.endDate="",this.editingStart=!1,this.editingEnd=!1,this.selectedRange="",this.minDate="2012-01-01",this.maxDate=Ys.now().toISODate()}handleStartClick(){this.editingStart=!0}handleEndClick(){this.editingEnd=!0}setRange(t){const e=Ys.now().toISODate();let i="";"W"===t?i=Ys.now().minus({days:6}).toISODate():"M"===t?i=Ys.now().minus({months:1}).plus({days:1}).toISODate():"Y"===t?i=Ys.now().minus({years:1}).plus({days:1}).toISODate():"ALL"===t&&(i=this.minDate||"2012-01-01"),this.startDate=i,this.endDate=e,this.selectedRange=t,this.editingStart=!1,this.editingEnd=!1,this.fireCustomEvent(Oe.DateRangeChanged,{start:this.startDate,end:this.endDate,range:this.selectedRange})}setValidRange(t,e){let i=e;i<this.minDate&&(i=this.minDate),i>this.maxDate&&(i=this.maxDate);const n=Ys.fromISO("start"===t?i:this.startDate),o=Ys.fromISO("end"===t?i:this.endDate);n.isValid&&o.isValid&&(n>o?"start"===t?(this.startDate=i,this.endDate=n.toISODate()):(this.endDate=i,this.startDate=o.toISODate()):"start"===t?this.startDate=i:this.endDate=i,this.fireCustomEvent(Oe.DateRangeChanged,{start:this.startDate,end:this.endDate,range:this.selectedRange}))}canNavigatePrevious(){if("ALL"===this.selectedRange)return!1;const t=Ys.fromISO(this.startDate);let e;if("W"===this.selectedRange)e=t.minus({weeks:1});else if("M"===this.selectedRange)e=t.minus({months:1});else if("Y"===this.selectedRange)e=t.minus({years:1});else{if(""!==this.selectedRange)return!1;{const i=this.getCustomRangeInterval();if("days"===i.type)e=t.minus({days:i.amount});else if("months"===i.type)e=t.minus({months:i.amount});else{if("years"!==i.type)return!1;e=t.minus({years:i.amount})}}}return e.toISODate()>=this.minDate}canNavigateNext(){if("ALL"===this.selectedRange)return!1;const t=Ys.fromISO(this.endDate);let e;if("W"===this.selectedRange)e=t.plus({weeks:1});else if("M"===this.selectedRange)e=t.plus({months:1});else if("Y"===this.selectedRange)e=t.plus({years:1});else{if(""!==this.selectedRange)return!1;{const i=this.getCustomRangeInterval();if("days"===i.type)e=t.plus({days:i.amount});else if("months"===i.type)e=t.plus({months:i.amount});else{if("years"!==i.type)return!1;e=t.plus({years:i.amount})}}}return e.toISODate()<=this.maxDate}getCustomRangeInterval(){const t=Ys.fromISO(this.startDate),e=Ys.fromISO(this.endDate);if(!t.isValid||!e.isValid)return{type:"days",amount:1};const i=e.day===e.daysInMonth;if(1===t.day&&i){if(t.month===e.month&&t.year===e.year)return{type:"months",amount:1};const i=t.startOf("month"),n=e.endOf("month").diff(i,"months").months+1;if(n>0&&Number.isInteger(n))return{type:"months",amount:Math.round(n)}}if(1===t.month&&1===t.day&&12===e.month&&31===e.day){if(t.year===e.year)return{type:"years",amount:1};const i=e.year-t.year+1;if(i>0)return{type:"years",amount:i}}const n=e.diff(t,"days").days+1;return{type:"days",amount:Math.max(1,Math.round(n))}}navigatePrevious(){if(!this.canNavigatePrevious())return;const t=Ys.fromISO(this.startDate),e=Ys.fromISO(this.endDate);let i,n;if("W"===this.selectedRange)i=t.minus({weeks:1}),n=e.minus({weeks:1});else if("M"===this.selectedRange){const o=this.getCustomRangeInterval();"months"===o.type?(i=t.minus({months:1}).startOf("month"),n=i.plus({months:o.amount}).minus({days:1}).endOf("day")):(i=t.minus({months:1}),n=e.minus({months:1}))}else if("Y"===this.selectedRange)i=t.minus({years:1}),n=e.minus({years:1});else{if(""!==this.selectedRange)return;{const o=this.getCustomRangeInterval();if("days"===o.type)i=t.minus({days:o.amount}),n=e.minus({days:o.amount});else if("months"===o.type)i=t.minus({months:o.amount}).startOf("month"),n=i.plus({months:o.amount}).minus({days:1}).endOf("day");else{if("years"!==o.type)return;i=t.minus({years:o.amount}),n=e.minus({years:o.amount})}}}const o=Ys.fromISO(this.minDate),s=Ys.fromISO(this.maxDate),r=i<o?this.minDate:i.toISODate(),a=n>s?this.maxDate:n.toISODate();this.startDate=r,this.endDate=a,this.fireCustomEvent(Oe.DateRangeChanged,{start:this.startDate,end:this.endDate,range:this.selectedRange})}navigateNext(){if(!this.canNavigateNext())return;const t=Ys.fromISO(this.startDate),e=Ys.fromISO(this.endDate);let i,n;if("W"===this.selectedRange)i=t.plus({weeks:1}),n=e.plus({weeks:1});else if("M"===this.selectedRange){const o=this.getCustomRangeInterval();"months"===o.type?(i=t.plus({months:1}).startOf("month"),n=i.plus({months:o.amount}).minus({days:1}).endOf("day")):(i=t.plus({months:1}),n=e.plus({months:1}))}else if("Y"===this.selectedRange)i=t.plus({years:1}),n=e.plus({years:1});else{if(""!==this.selectedRange)return;{const o=this.getCustomRangeInterval();if("days"===o.type)i=t.plus({days:o.amount}),n=e.plus({days:o.amount});else if("months"===o.type)i=t.plus({months:o.amount}).startOf("month"),n=i.plus({months:o.amount}).minus({days:1}).endOf("day");else{if("years"!==o.type)return;i=t.plus({years:o.amount}),n=e.plus({years:o.amount})}}}const o=Ys.fromISO(this.minDate),s=Ys.fromISO(this.maxDate),r=i<o?this.minDate:i.toISODate(),a=n>s?this.maxDate:n.toISODate();this.startDate=r,this.endDate=a,this.fireCustomEvent(Oe.DateRangeChanged,{start:this.startDate,end:this.endDate,range:this.selectedRange})}getNavigationLabel(t){const e=this.getCustomRangeInterval(),i=e.amount;return`${"previous"===t?"Previous":"Next"} ${i} ${"days"===e.type?1===i?"day":"days":"months"===e.type?1===i?"month":"months":1===i?"year":"years"}`}updated(t){super.updated(t),(t.has("startDate")&&t.has("endDate")&&!this.startDate||!this.endDate)&&this.setRange("M"),t.has("editingStart")&&this.editingStart&&setTimeout((()=>{var t;const e=null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector("temba-datepicker.start-picker");e&&e.handleClicked()}),0),t.has("editingEnd")&&this.editingEnd&&setTimeout((()=>{var t;const e=null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector("temba-datepicker.end-picker");e&&e.handleClicked()}),0)}formatDateForDisplay(t){if(!t)return"";const e=Ys.fromISO(t);return e.isValid?e.toLocaleString():t}render(){return U`
       <div class="range-container">
         ${this.editingStart?U`<temba-datepicker
               class="start-picker"
@@ -9052,7 +9052,7 @@ var GE=function(){if("undefined"!=typeof window){if(window.devicePixelRatio)retu
               @change=${t=>{const e=t.target.value;this.setValidRange("start",e),this.editingStart=!1,this.selectedRange=""}}
               @blur=${()=>this.editingStart=!1}
             ></temba-datepicker>`:U`<span class="date-display" @click=${this.handleStartClick}
-              >${this.startDate||"Start date"}</span
+              >${this.formatDateForDisplay(this.startDate)||"Start date"}</span
             >`}
         <span> - </span>
         ${this.editingEnd?U`<temba-datepicker
@@ -9063,7 +9063,7 @@ var GE=function(){if("undefined"!=typeof window){if(window.devicePixelRatio)retu
               @change=${t=>{const e=t.target.value;this.setValidRange("end",e),this.editingEnd=!1,this.selectedRange=""}}
               @blur=${()=>this.editingEnd=!1}
             ></temba-datepicker>`:U`<span class="date-display" @click=${this.handleEndClick}
-              >${this.endDate||"End date"}</span
+              >${this.formatDateForDisplay(this.endDate)||"End date"}</span
             >`}
         <div class="navigation-container">
           <button