@govtechsg/sgds-web-component 3.20.0-rc.0 → 3.20.0-rc.2

package/components/Datepicker/datepicker.js

@@ -1,6 +1,6 @@
 import { css } from 'lit';
 
-var css_248z = css`:host{--datepicker-theme-color:var(--sgds-primary);--datepicker-hover-bg:var(--sgds-primary-100);--datepicker-bg:#fff;--datepicker-close-btn-bg:var(--datepicker-theme-color);--datepicker-close-btn-hover-bg:var(--sgds-primary-700);--datepicker-close-btn-color:#fff;--datepicker-selected-date-bg:var(--sgds-primary);--datepicker-selected-date-color:#fff;font-size:var(--sgds-font-size-14)}:host([menuisopen]:not([disabled]):not([readonly])) .dropdown-menu{background-color:var(--sgds-form-surface-default);display:flex;flex-direction:column;gap:var(--sgds-form-gap-sm);overflow:unset;padding:var(--sgds-form-padding-y) var(--sgds-form-padding-x);width:var(--sgds-dimension-320)}.dropdown{display:flex;height:100%}sgds-datepicker-input{--input-border-radius:var(--sgds-form-border-radius-md) 0 0 var(--sgds-form-border-radius-md);flex:1;margin-right:0}sgds-icon-button{--btn-border-radius:0 var(--sgds-form-border-radius-md) var(--sgds-form-border-radius-md) 0}.m-width-160{min-width:var(--sgds-dimension-160)}.datepicker-container{display:flex}.calendar-btn:not(.with-hint-text){align-self:center}.calendar-btn:not(.with-hint-text).with-label{align-self:end;margin-top:calc(var(--sgds-line-height-24) - var(--sgds-line-height-20))}.calendar-btn.with-hint-text.with-label{align-self:center;margin-top:calc(var(--sgds-line-height-24) - var(--sgds-line-height-20))}`;
+var css_248z = css`:host{--datepicker-theme-color:var(--sgds-primary);--datepicker-hover-bg:var(--sgds-primary-100);--datepicker-bg:#fff;--datepicker-close-btn-bg:var(--datepicker-theme-color);--datepicker-close-btn-hover-bg:var(--sgds-primary-700);--datepicker-close-btn-color:#fff;--datepicker-selected-date-bg:var(--sgds-primary);--datepicker-selected-date-color:#fff;font-size:var(--sgds-font-size-14)}:host([menuisopen]:not([disabled]):not([readonly])) .dropdown-menu{background-color:var(--sgds-form-surface-default);display:flex;flex-direction:column;gap:var(--sgds-form-gap-sm);overflow:unset;padding:var(--sgds-form-padding-y) var(--sgds-form-padding-x);width:var(--sgds-dimension-320)}.dropdown{display:flex;height:100%}sgds-datepicker-input{--input-border-radius:var(--sgds-form-border-radius-md) 0 0 var(--sgds-form-border-radius-md);flex:1;margin-right:0}sgds-icon-button{--btn-border-radius:0 var(--sgds-form-border-radius-md) var(--sgds-form-border-radius-md) 0}.m-width-160{min-width:var(--sgds-dimension-160)}`;
 
 export { css_248z as default };
 //# sourceMappingURL=datepicker.js.map

package/components/Datepicker/index.umd.min.js

@@ -2527,7 +2527,7 @@ class extends Ii{constructor(t){if(super(t),t.type!==Hi&&t.type!==Ei&&t.type!==$
         </div>
         ${this._renderFeedback()}
       </div>
-    `}}wr.styles=[...fr.styles,mr],t([Zi({type:String})],wr.prototype,"minDate",void 0),t([Zi({type:String})],wr.prototype,"maxDate",void 0),t([Zi({type:String,reflect:!0})],wr.prototype,"mode",void 0),t([Bi("input")],wr.prototype,"shadowInput",void 0);var yr,br,xr=re`:host{--datepicker-theme-color:var(--sgds-primary);--datepicker-hover-bg:var(--sgds-primary-100);--datepicker-bg:#fff;--datepicker-close-btn-bg:var(--datepicker-theme-color);--datepicker-close-btn-hover-bg:var(--sgds-primary-700);--datepicker-close-btn-color:#fff;--datepicker-selected-date-bg:var(--sgds-primary);--datepicker-selected-date-color:#fff;font-size:var(--sgds-font-size-14)}:host([menuisopen]:not([disabled]):not([readonly])) .dropdown-menu{background-color:var(--sgds-form-surface-default);display:flex;flex-direction:column;gap:var(--sgds-form-gap-sm);overflow:unset;padding:var(--sgds-form-padding-y) var(--sgds-form-padding-x);width:var(--sgds-dimension-320)}.dropdown{display:flex;height:100%}sgds-datepicker-input{--input-border-radius:var(--sgds-form-border-radius-md) 0 0 var(--sgds-form-border-radius-md);flex:1;margin-right:0}sgds-icon-button{--btn-border-radius:0 var(--sgds-form-border-radius-md) var(--sgds-form-border-radius-md) 0}.m-width-160{min-width:var(--sgds-dimension-160)}.datepicker-container{display:flex}.calendar-btn:not(.with-hint-text){align-self:center}.calendar-btn:not(.with-hint-text).with-label{align-self:end;margin-top:calc(var(--sgds-line-height-24) - var(--sgds-line-height-20))}.calendar-btn.with-hint-text.with-label{align-self:center;margin-top:calc(var(--sgds-line-height-24) - var(--sgds-line-height-20))}`;class _r extends(gr(Ms)){constructor(){super(),this.required=!1,this.disabled=!1,this.value="",this.initialValue=[],this.dateFormat="DD/MM/YYYY",this.minDate="",this.maxDate="",this.mode="single",this.hasFeedback=!1,this.label="",this.hintText="",this.noFlip=!1,this.drop="down",this.defaultValue="",this.invalid=!1,this.view="days",this.selectedDateRange=[],this.focusedTabIndex=3,this.initialDisplayDate=new Date,this._makeInputValueString=(t,e,i)=>{if(!t&&!e)return this.value;const a=t=>X(t,Zs[i].fnsPattern);switch(this.mode){case"single":t&&(this.value=a(t));break;case"range":t&&e&&(this.value=`${a(t)} - ${a(e)}`),t&&!e&&(this.value=`${a(t)} - ${this.dateFormat}`)}return this.value},this._dialogAriaLabels={days:"Choose date",months:"Choose month",years:"Choose year"},this.floatingOpts={placement:"bottom-end"}}isValueEmpty(){return""===this.value||"DD/MM/YYYY"===this.value||"DD/MM/YYYY - DD/MM/YYYY"===this.value}reportValidity(){return this._mixinReportValidity()}checkValidity(){return this._mixinCheckValidity()}get validity(){return this._mixinGetValidity()}get validationMessage(){return this._mixinGetValidationMessage()}async connectedCallback(){if(super.connectedCallback(),this.addEventListener("sgds-view",this._handleViewChanged),this.addEventListener("sgds-change-calendar",this._handleDateChanged),this.addEventListener("sgds-update-focus",this._handleFocusDateChanged),this.addEventListener("sgds-selectmonth",this._handleSelectMonth),this.addEventListener("sgds-selectyear",this._handleSelectYear),this.addEventListener("sgds-selectdates",this._handleSelectDatesAndClose),this.addEventListener("sgds-selectdates-input",this._handleSelectDatesInput),this.addEventListener("sgds-empty-input",this._handleEmptyInput),this.addEventListener("keydown",this._handleTab),this.addEventListener("sgds-hide",this._handleCloseMenu),this.addEventListener("sgds-show",this._handleOpenMenu),this.addEventListener("blur",this._mixinCheckValidity),this.initialValue=this.value?this.value.split(" - ").map(t=>t.trim()):this.initialValue,this.initialDisplayDate=this.displayDate||new Date,this.initialValue&&this.initialValue.length>0){const t=new RegExp(this._getDateFormatRegex()),e=this.initialValue.filter(e=>!t.test(e));if(e.length>0)return console.error("Invalid date format in initialValue:",e);{const t=this.initialValue.map(t=>Ds(Jt(t,Zs[this.dateFormat].fnsPattern,new Date)));this._handleSelectDates(t)}}else this.displayDate=this.initialDisplayDate}async firstUpdated(t){if(super.firstUpdated(t),this.menuIsOpen){const t=await this.datepickerInputAsync;await this.updateFloatingPosition();(await this.calendar).focusOnCalendar(t)}}_getDateFormatRegex(){return this.dateFormat.replace(/[.*+?^${}()|[\]\\]/g,"\\$&").replace("MM","\\d{2}").replace("DD","\\d{2}").replace("YYYY","\\d{4}").replace("/","\\/")}_handleTab(t){if(!this.menuIsOpen)return;const e=Array(4);t.shiftKey&&"Tab"===t.key?(t.preventDefault(),this.focusedTabIndex=(this.focusedTabIndex-1+e.length)%e.length):"Tab"===t.key&&(t.preventDefault(),this.focusedTabIndex=(this.focusedTabIndex+1+e.length)%e.length)}_handleValueChange(){this.emit("sgds-change-date")}async _handleCloseMenu(){if((await this.datepickerInputAsync).focus(),0===this.selectedDateRange.length)this.displayDate=this.initialDisplayDate;else{const t=this.selectedDateRange.length;this.displayDate=this.selectedDateRange[t-1];(await this.calendar)._updateFocusedDate()}}async _handleOpenMenu(){const t=await this.calendar,e=await this.datepickerInputAsync;t.focusOnCalendar(e)}_handleSelectDatesInput(t){this._handleSelectDates(t.detail)}async _handleSelectDates(t){t.sort((t,e)=>t.getTime()-e.getTime()),this.displayDate=t[0],this.focusedDate=t[0],this.selectedDateRange=t;const e=this._makeInputValueString(this.selectedDateRange[0],this.selectedDateRange[1],this.dateFormat);this.value=e;(await this.datepickerInputAsync).updateMaskValue(),this._manageInternalsValid()}async _handleSelectDatesAndClose(t){await this._handleSelectDates(t.detail),("range"===this.mode&&2===this.selectedDateRange.length||"single"===this.mode&&1===this.selectedDateRange.length)&&this.hideMenu()}_handleViewChanged(t){this.view=t.detail}_handleDateChanged(t){this.displayDate=t.detail}_handleFocusDateChanged(t){this.focusedDate=t.detail}_handleSelectMonth(t){this.displayDate=t.detail}_handleSelectYear(t){this.displayDate=t.detail}async _handleInvalidInput(){this.selectedDateRange=[],this.displayDate=this.initialDisplayDate,this.invalid=!0,this._manageInternalsBadInput()}async _handleEmptyInput(){this.required&&this._manageEmptyInput()}async _resetDatepicker(t=""){this.displayDate=this.initialDisplayDate,this.selectedDateRange=[],this.value=t,this.view="days";const e=await this.datepickerInputAsync;e.setInvalid(!1),e.destroyInputMask(),await e.applyInputMask(),this._mixinResetValidity(e),this.isValueEmpty()&&this._handleEmptyInput()}_manageInternalsBadInput(){this._mixinSetValidity({badInput:!0},"Invalid date input",this.datepickerInput)}_manageEmptyInput(){this._mixinSetValidity({valueMissing:!0},"Please fill in this field",this.datepickerInput)}_manageInternalsValid(){this._mixinSetValidity({}),this.invalid=this.datepickerInput.invalid=!1,this._mixinSetFormValue()}async _mixinResetFormControl(){this._resetDatepicker(this.defaultValue)}async _handleInputMaskChange(t){this.value=t.detail,this.isValueEmpty()&&this._resetDatepicker()}render(){return Je`
+    `}}wr.styles=[...fr.styles,mr],t([Zi({type:String})],wr.prototype,"minDate",void 0),t([Zi({type:String})],wr.prototype,"maxDate",void 0),t([Zi({type:String,reflect:!0})],wr.prototype,"mode",void 0),t([Bi("input")],wr.prototype,"shadowInput",void 0);var yr,br,xr=re`:host{--datepicker-theme-color:var(--sgds-primary);--datepicker-hover-bg:var(--sgds-primary-100);--datepicker-bg:#fff;--datepicker-close-btn-bg:var(--datepicker-theme-color);--datepicker-close-btn-hover-bg:var(--sgds-primary-700);--datepicker-close-btn-color:#fff;--datepicker-selected-date-bg:var(--sgds-primary);--datepicker-selected-date-color:#fff;font-size:var(--sgds-font-size-14)}:host([menuisopen]:not([disabled]):not([readonly])) .dropdown-menu{background-color:var(--sgds-form-surface-default);display:flex;flex-direction:column;gap:var(--sgds-form-gap-sm);overflow:unset;padding:var(--sgds-form-padding-y) var(--sgds-form-padding-x);width:var(--sgds-dimension-320)}.dropdown{display:flex;height:100%}sgds-datepicker-input{--input-border-radius:var(--sgds-form-border-radius-md) 0 0 var(--sgds-form-border-radius-md);flex:1;margin-right:0}sgds-icon-button{--btn-border-radius:0 var(--sgds-form-border-radius-md) var(--sgds-form-border-radius-md) 0}.m-width-160{min-width:var(--sgds-dimension-160)}`;class _r extends(gr(Ms)){constructor(){super(),this.required=!1,this.disabled=!1,this.noValidate=!1,this.value="",this.initialValue=[],this.dateFormat="DD/MM/YYYY",this.minDate="",this.maxDate="",this.mode="single",this.hasFeedback=!1,this.label="",this.hintText="",this.noFlip=!1,this.drop="down",this.defaultValue="",this.invalid=!1,this.view="days",this.selectedDateRange=[],this.focusedTabIndex=3,this.initialDisplayDate=new Date,this._makeInputValueString=(t,e,i)=>{if(!t&&!e)return this.value;const a=t=>X(t,Zs[i].fnsPattern);switch(this.mode){case"single":t&&(this.value=a(t));break;case"range":t&&e&&(this.value=`${a(t)} - ${a(e)}`),t&&!e&&(this.value=`${a(t)} - ${this.dateFormat}`)}return this.value},this._dialogAriaLabels={days:"Choose date",months:"Choose month",years:"Choose year"},this.floatingOpts={placement:"bottom-end"}}isValueEmpty(){return""===this.value||"DD/MM/YYYY"===this.value||"DD/MM/YYYY - DD/MM/YYYY"===this.value}reportValidity(){return this._mixinReportValidity()}checkValidity(){return this._mixinCheckValidity()}setInvalid(t){this.invalid=t,this.datepickerInput&&this.datepickerInput.setInvalid(t)}setValidity(t,e,i){return this._mixinSetValidity(t,e,i)}get validity(){return this._mixinGetValidity()}get validationMessage(){return this._mixinGetValidationMessage()}async connectedCallback(){if(super.connectedCallback(),this.addEventListener("sgds-view",this._handleViewChanged),this.addEventListener("sgds-change-calendar",this._handleDateChanged),this.addEventListener("sgds-update-focus",this._handleFocusDateChanged),this.addEventListener("sgds-selectmonth",this._handleSelectMonth),this.addEventListener("sgds-selectyear",this._handleSelectYear),this.addEventListener("sgds-selectdates",this._handleSelectDatesAndClose),this.addEventListener("sgds-selectdates-input",this._handleSelectDatesInput),this.addEventListener("sgds-empty-input",this._handleEmptyInput),this.addEventListener("keydown",this._handleTab),this.addEventListener("sgds-hide",this._handleCloseMenu),this.addEventListener("sgds-show",this._handleOpenMenu),this.addEventListener("blur",this._mixinCheckValidity),this.initialValue=this.value?this.value.split(" - ").map(t=>t.trim()):this.initialValue,this.initialDisplayDate=this.displayDate||new Date,this.initialValue&&this.initialValue.length>0){const t=new RegExp(this._getDateFormatRegex()),e=this.initialValue.filter(e=>!t.test(e));if(e.length>0)return console.error("Invalid date format in initialValue:",e);{const t=this.initialValue.map(t=>Ds(Jt(t,Zs[this.dateFormat].fnsPattern,new Date)));this._handleSelectDates(t)}}else this.displayDate=this.initialDisplayDate;(await this.datepickerInputAsync).setInvalid(this.invalid)}async firstUpdated(t){if(super.firstUpdated(t),this.menuIsOpen){const t=await this.datepickerInputAsync;await this.updateFloatingPosition();(await this.calendar).focusOnCalendar(t)}}_getDateFormatRegex(){return this.dateFormat.replace(/[.*+?^${}()|[\]\\]/g,"\\$&").replace("MM","\\d{2}").replace("DD","\\d{2}").replace("YYYY","\\d{4}").replace("/","\\/")}_handleTab(t){if(!this.menuIsOpen)return;const e=Array(4);t.shiftKey&&"Tab"===t.key?(t.preventDefault(),this.focusedTabIndex=(this.focusedTabIndex-1+e.length)%e.length):"Tab"===t.key&&(t.preventDefault(),this.focusedTabIndex=(this.focusedTabIndex+1+e.length)%e.length)}_handleValueChange(){this.emit("sgds-change-date")}async _handleCloseMenu(){if((await this.datepickerInputAsync).focus(),0===this.selectedDateRange.length)this.displayDate=this.initialDisplayDate;else{const t=this.selectedDateRange.length;this.displayDate=this.selectedDateRange[t-1];(await this.calendar)._updateFocusedDate()}}async _handleOpenMenu(){const t=await this.calendar,e=await this.datepickerInputAsync;t.focusOnCalendar(e)}_handleSelectDatesInput(t){this._handleSelectDates(t.detail)}async _handleSelectDates(t){t.sort((t,e)=>t.getTime()-e.getTime()),this.displayDate=t[0],this.focusedDate=t[0],this.selectedDateRange=t;const e=this._makeInputValueString(this.selectedDateRange[0],this.selectedDateRange[1],this.dateFormat);this.value=e;(await this.datepickerInputAsync).updateMaskValue(),this._manageInternalsValid()}async _handleSelectDatesAndClose(t){await this._handleSelectDates(t.detail),("range"===this.mode&&2===this.selectedDateRange.length||"single"===this.mode&&1===this.selectedDateRange.length)&&this.hideMenu()}_handleViewChanged(t){this.view=t.detail}_handleDateChanged(t){this.displayDate=t.detail}_handleFocusDateChanged(t){this.focusedDate=t.detail}_handleSelectMonth(t){this.displayDate=t.detail}_handleSelectYear(t){this.displayDate=t.detail}async _handleInvalidInput(){this.selectedDateRange=[],this.displayDate=this.initialDisplayDate,this._mixinShouldSkipSgdsValidation()||(this.invalid=!0,this._manageInternalsBadInput())}async _handleEmptyInput(){this.required&&this._manageEmptyInput()}async _resetDatepicker(t=""){this.displayDate=this.initialDisplayDate,this.selectedDateRange=[],this.value=t,this.view="days";const e=await this.datepickerInputAsync;e.setInvalid(this.invalid),e.destroyInputMask(),await e.applyInputMask(),this._mixinResetValidity(e),this.isValueEmpty()&&this._handleEmptyInput()}_manageInternalsBadInput(){this._mixinSetValidity({badInput:!0},"Invalid date input",this.datepickerInput)}_manageEmptyInput(){this._mixinSetValidity({valueMissing:!0},"Please fill in this field",this.datepickerInput)}_manageInternalsValid(){this._mixinShouldSkipSgdsValidation()||(this._mixinSetValidity({}),this.invalid=this.datepickerInput.invalid=!1,this._mixinSetFormValue())}async _mixinResetFormControl(){this._resetDatepicker(this.defaultValue)}async _handleInputMaskChange(t){this.value=t.detail,this.isValueEmpty()&&this._resetDatepicker()}render(){return Je`
       <div class="datepicker-container m-width-160">
         <sgds-datepicker-input
           .value=${Ri(this.value)}
@@ -2547,22 +2547,23 @@ class extends Ii{constructor(t){if(super(t),t.type!==Hi&&t.type!==Ei&&t.type!==$
           hasFeedback=${Es(this.hasFeedback?"both":void 0)}
           ?readonly=${this.readonly}
         >
+          <sgds-icon-button
+            slot="calendar-btn"
+            ${Qi(this.myDropdown)}
+            tone="neutral"
+            class=${Bs({"calendar-btn":!0,"with-hint-text":this.hintText||this.invalid,"with-label":this.label})}
+            aria-expanded="${this.menuIsOpen}"
+            aria-haspopup="dialog"
+            aria-controls=${this.dropdownMenuId}
+            @click=${()=>this.toggleMenu()}
+            ariaLabel=${this.menuIsOpen?"Close Calendar":"Open Calendar"}
+            ?disabled=${this.disabled||this.readonly}
+            ?active=${this.menuIsOpen}
+            variant="outline"
+            name="calendar"
+          >
+          </sgds-icon-button>
         </sgds-datepicker-input>
-        <sgds-icon-button
-          ${Qi(this.myDropdown)}
-          tone="neutral"
-          class=${Bs({"calendar-btn":!0,"with-hint-text":this.hintText||this.invalid,"with-label":this.label})}
-          aria-expanded="${this.menuIsOpen}"
-          aria-haspopup="dialog"
-          aria-controls=${this.dropdownMenuId}
-          @click=${()=>this.toggleMenu()}
-          ariaLabel=${this.menuIsOpen?"Close Calendar":"Open Calendar"}
-          ?disabled=${this.disabled||this.readonly}
-          ?active=${this.menuIsOpen}
-          variant="outline"
-          name="calendar"
-        >
-        </sgds-icon-button>
         <ul
           id=${this.dropdownMenuId}
           class="sgds datepicker dropdown-menu"
@@ -2590,5 +2591,5 @@ class extends Ii{constructor(t){if(super(t),t.type!==Hi&&t.type!==Ei&&t.type!==$
           ></sgds-datepicker-calendar>
         </ul>
       </div>
-    `}}_r.styles=[...Ms.styles,qs,xr],_r.dependencies={"sgds-datepicker-input":wr,"sgds-datepicker-calendar":Ks,"sgds-datepicker-header":_n,"sgds-button":Us,"sgds-icon-button":bn},t([Zi({type:Boolean,reflect:!0})],_r.prototype,"required",void 0),t([Zi({reflect:!0})],_r.prototype,"name",void 0),t([Zi({type:Boolean,reflect:!0})],_r.prototype,"disabled",void 0),t([Zi({type:String,reflect:!0})],_r.prototype,"value",void 0),t([Zi({type:Array,reflect:!0})],_r.prototype,"initialValue",void 0),t([Zi({type:String})],_r.prototype,"minDate",void 0),t([Zi({type:String})],_r.prototype,"maxDate",void 0),t([Zi({type:String,reflect:!0})],_r.prototype,"mode",void 0),t([Zi({type:String,reflect:!0})],_r.prototype,"invalidFeedback",void 0),t([Zi({type:Boolean,reflect:!0})],_r.prototype,"hasFeedback",void 0),t([Zi({reflect:!0})],_r.prototype,"label",void 0),t([Zi({reflect:!0})],_r.prototype,"hintText",void 0),t([Zi({type:Boolean,reflect:!0,state:!1})],_r.prototype,"noFlip",void 0),t([Zi({type:String,reflect:!0,state:!1})],_r.prototype,"drop",void 0),t([Zi({attribute:!1})],_r.prototype,"displayDate",void 0),t([ur()],_r.prototype,"defaultValue",void 0),t([Vi()],_r.prototype,"invalid",void 0),t([Vi()],_r.prototype,"view",void 0),t([Vi()],_r.prototype,"selectedDateRange",void 0),t([Vi()],_r.prototype,"focusedDate",void 0),t([Vi()],_r.prototype,"focusedTabIndex",void 0),t([Bi("sgds-datepicker-calendar")],_r.prototype,"calendar",void 0),t([Bi("sgds-datepicker-input")],_r.prototype,"datepickerInputAsync",void 0),t([Ai("sgds-datepicker-input")],_r.prototype,"datepickerInput",void 0),t([As("value",{waitUntilFirstUpdate:!0})],_r.prototype,"_handleValueChange",null),yr="sgds-datepicker",br=_r,customElements.get(yr)||customElements.define(yr,br)});
+    `}}_r.styles=[...Ms.styles,qs,xr],_r.dependencies={"sgds-datepicker-input":wr,"sgds-datepicker-calendar":Ks,"sgds-datepicker-header":_n,"sgds-button":Us,"sgds-icon-button":bn},t([Zi({type:Boolean,reflect:!0})],_r.prototype,"required",void 0),t([Zi({reflect:!0})],_r.prototype,"name",void 0),t([Zi({type:Boolean,reflect:!0})],_r.prototype,"disabled",void 0),t([Zi({type:Boolean,reflect:!0})],_r.prototype,"noValidate",void 0),t([Zi({type:String,reflect:!0})],_r.prototype,"value",void 0),t([Zi({type:Array,reflect:!0})],_r.prototype,"initialValue",void 0),t([Zi({type:String})],_r.prototype,"minDate",void 0),t([Zi({type:String})],_r.prototype,"maxDate",void 0),t([Zi({type:String,reflect:!0})],_r.prototype,"mode",void 0),t([Zi({type:String,reflect:!0})],_r.prototype,"invalidFeedback",void 0),t([Zi({type:Boolean,reflect:!0})],_r.prototype,"hasFeedback",void 0),t([Zi({reflect:!0})],_r.prototype,"label",void 0),t([Zi({reflect:!0})],_r.prototype,"hintText",void 0),t([Zi({type:Boolean,reflect:!0,state:!1})],_r.prototype,"noFlip",void 0),t([Zi({type:String,reflect:!0,state:!1})],_r.prototype,"drop",void 0),t([Zi({attribute:!1})],_r.prototype,"displayDate",void 0),t([ur()],_r.prototype,"defaultValue",void 0),t([Zi({type:Boolean,reflect:!0})],_r.prototype,"invalid",void 0),t([Vi()],_r.prototype,"view",void 0),t([Vi()],_r.prototype,"selectedDateRange",void 0),t([Vi()],_r.prototype,"focusedDate",void 0),t([Vi()],_r.prototype,"focusedTabIndex",void 0),t([Bi("sgds-datepicker-calendar")],_r.prototype,"calendar",void 0),t([Bi("sgds-datepicker-input")],_r.prototype,"datepickerInputAsync",void 0),t([Ai("sgds-datepicker-input")],_r.prototype,"datepickerInput",void 0),t([As("value",{waitUntilFirstUpdate:!0})],_r.prototype,"_handleValueChange",null),yr="sgds-datepicker",br=_r,customElements.get(yr)||customElements.define(yr,br)});
 //# sourceMappingURL=index.umd.min.js.map