@ncino/web-components 13.10.0 → 13.10.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.
@@ -1,4 +1,4 @@
1
- import{property as h}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{state as d}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.js";import{customElement as f}from"../../../../utils/decorators/custom-element-decorator.js";import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as D}from"../../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/lit-html.js";import"../../../../node_modules/.pnpm/lit-element@4.2.2/node_modules/lit-element/lit-element.js";import{createRef as u,ref as p}from"../../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/ref.js";import{msg as g}from"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/init/install.js";import{localized as _}from"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/internal/localized-decorator.js";import"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/init/runtime.js";import{ifDefined as m}from"../../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/if-defined.js";import{autoUpdate as v,computePosition as y}from"../../../../node_modules/.pnpm/@floating-ui_dom@1.7.5/node_modules/@floating-ui/dom/dist/floating-ui.dom.js";import I from"../../../../packages/web-components/src/components/input/gator/input-date/input-date.gator.scss.js";import{NgcInputText as T}from"../input-text/input-text.gator.js";import{NgcErrorEvent as b,NgcErrorReason as k}from"../../../../utils/error-utils.js";import"../../../icon-button/gator/icon-button.gator.js";import"../../../date-picker/base/gator/datepicker.gator.js";import{unsafeCSS as E}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";var S=Object.defineProperty,x=Object.getOwnPropertyDescriptor,V=Object.getPrototypeOf,R=Reflect.get,l=(t,e,a,i)=>{for(var r=i>1?void 0:i?x(e,a):e,n=t.length-1,o;n>=0;n--)(o=t[n])&&(r=(i?o(e,a,r):o(r))||r);return i&&r&&S(e,a,r),r},$=(t,e,a)=>R(V(t),a,e),N=(t=>(t.INVALID_FORMAT="invalid-format",t.LESS_THAN_MIN_DATE="less-than-min-date",t.GREATER_THAN_MAX_DATE="greater-than-max-date",t.OUTSIDE_RANGE="outside-range",t.INVALID_START_DATE="invalid-start-date",t.INVALID_END_DATE="invalid-end-date",t))(N||{});let s=class extends T{constructor(){super(...arguments),this.locale=navigator.language,this.sundayStart=!1,this.range=!1,this.startDateLabel="Start Date",this.endDateLabel="End Date",this.maskInput=!1,this.autoAddDateSeparators=!1,this._value="",this.datepickerRef=u(),this.datepickerTriggerRef=u(),this.startInputRef=u(),this.endInputRef=u(),this.groupRef=u(),this.dateValue=null,this._dateSeparator="/",this._messageInvalidFormat="Invalid date. Please provide a valid date with format {0}.",this._messageLessThanMinDate="Date must be after {0}.",this._messageGreaterThanMaxDate="Date must be before {0}.",this._messageOutsideRange="Date must be between {0} and {1}.",this._messageInvalidStartDate="{0} must come before {1}: {2}.",this._messageInvalidEndDate="{0} must come after {1}: {2}.",this._dateTimeOptions={year:"numeric",month:"2-digit",day:"2-digit"},this._datePickerVisible=!1,this._startDate=null,this._endDate=null,this._maskPattern="",this._dateString=""}connectedCallback(){super.connectedCallback(),this.endIcon="calendar"}updated(t){if(super.updated(t),t.has("locale")){(this.locale===void 0||this.locale==="")&&(this.locale=navigator.language),this.setLocaleDateFormat();const a=this.coerceValuePropToDate(this.value)??(this.dateValue instanceof Date&&!isNaN(this.dateValue.getTime())?this.dateValue:null);this._value=a?a.toLocaleDateString(this.locale,this._dateTimeOptions):""}if(t.has("value")&&this.syncInternalStateFromDate(this.coerceValuePropToDate(this.value)),t.has("dateValue"))if(this.dateValue&&this.dateValue instanceof Date&&!isNaN(this.dateValue.getTime())){const e=this.dateValue.toLocaleDateString(this.locale,this._dateTimeOptions);this._dateString=e,this.maskInput&&this.maskDate(e)}else this.dateValue===null&&(this._dateString="",this._maskPattern="");if(t.has("startDate")&&(this.startDate&&this.startDate instanceof Date&&!isNaN(this.startDate.getTime())?(this._startDate=this.startDate,this._startDateInputValue=this.startDate.toLocaleDateString(this.locale,this._dateTimeOptions)):(this._startDate=null,this._startDateInputValue="")),t.has("endDate")&&(this.endDate&&this.endDate instanceof Date&&!isNaN(this.endDate.getTime())?(this._endDate=this.endDate,this._endDateInputValue=this.endDate.toLocaleDateString(this.locale,this._dateTimeOptions)):(this._endDate=null,this._endDateInputValue="")),t.has("maskInput")&&this.value&&this.value instanceof Date&&!isNaN(this.value.getTime())){const e=this.value.toLocaleDateString(this.locale,this._dateTimeOptions);this._dateString=e,this.maskInput?(this.maskDate(e),this._value=this._maskPattern):this._value=e}if(t.has("autoAddDateSeparators")&&this.autoAddDateSeparators){const e=this.coerceValuePropToDate(this.value);this._value=e?e.toLocaleDateString(this.locale,this._dateTimeOptions):""}}render(){return D` ${this.range?this.rangeMarkup:super.render()} ${this.datepickerMarkup} `}get endIconMarkup(){return this.calendarIconMarkup}get calendarIconMarkup(){return D`
1
+ import{property as h}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";import{state as d}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.js";import{customElement as f}from"../../../../utils/decorators/custom-element-decorator.js";import"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";import{html as D}from"../../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/lit-html.js";import"../../../../node_modules/.pnpm/lit-element@4.2.2/node_modules/lit-element/lit-element.js";import{createRef as u,ref as p}from"../../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/ref.js";import{msg as g}from"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/init/install.js";import{localized as _}from"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/internal/localized-decorator.js";import"../../../../node_modules/.pnpm/@lit_localize@0.12.2/node_modules/@lit/localize/init/runtime.js";import{ifDefined as m}from"../../../../node_modules/.pnpm/lit-html@3.3.2/node_modules/lit-html/directives/if-defined.js";import{autoUpdate as v,computePosition as y}from"../../../../node_modules/.pnpm/@floating-ui_dom@1.7.5/node_modules/@floating-ui/dom/dist/floating-ui.dom.js";import I from"../../../../packages/web-components/src/components/input/gator/input-date/input-date.gator.scss.js";import{NgcInputText as T}from"../input-text/input-text.gator.js";import{NgcErrorEvent as b,NgcErrorReason as k}from"../../../../utils/error-utils.js";import"../../../icon-button/gator/icon-button.gator.js";import"../../../date-picker/base/gator/datepicker.gator.js";import{unsafeCSS as E}from"../../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";var S=Object.defineProperty,x=Object.getOwnPropertyDescriptor,R=Object.getPrototypeOf,V=Reflect.get,l=(t,e,a,i)=>{for(var n=i>1?void 0:i?x(e,a):e,s=t.length-1,o;s>=0;s--)(o=t[s])&&(n=(i?o(e,a,n):o(n))||n);return i&&n&&S(e,a,n),n},$=(t,e,a)=>V(R(t),a,e),N=(t=>(t.INVALID_FORMAT="invalid-format",t.LESS_THAN_MIN_DATE="less-than-min-date",t.GREATER_THAN_MAX_DATE="greater-than-max-date",t.OUTSIDE_RANGE="outside-range",t.INVALID_START_DATE="invalid-start-date",t.INVALID_END_DATE="invalid-end-date",t))(N||{});let r=class extends T{constructor(){super(...arguments),this.locale=navigator.language,this.sundayStart=!1,this.range=!1,this.startDateLabel="Start Date",this.endDateLabel="End Date",this.maskInput=!1,this.autoAddDateSeparators=!1,this._value="",this.datepickerRef=u(),this.datepickerTriggerRef=u(),this.startInputRef=u(),this.endInputRef=u(),this.groupRef=u(),this.dateValue=null,this._dateSeparator="/",this._messageInvalidFormat="Invalid date. Please provide a valid date with format {0}.",this._messageLessThanMinDate="Date must be after {0}.",this._messageGreaterThanMaxDate="Date must be before {0}.",this._messageOutsideRange="Date must be between {0} and {1}.",this._messageInvalidStartDate="{0} must come before {1}: {2}.",this._messageInvalidEndDate="{0} must come after {1}: {2}.",this._dateTimeOptions={year:"numeric",month:"2-digit",day:"2-digit"},this._datePickerVisible=!1,this._startDate=null,this._endDate=null,this._maskPattern="",this._dateString=""}connectedCallback(){super.connectedCallback(),this.endIcon="calendar"}updated(t){if(super.updated(t),t.has("locale")){(this.locale===void 0||this.locale==="")&&(this.locale=navigator.language),this.setLocaleDateFormat();const a=this.coerceValuePropToDate(this.value)??(this.dateValue instanceof Date&&!isNaN(this.dateValue.getTime())?this.dateValue:null);this._value=a?a.toLocaleDateString(this.locale,this._dateTimeOptions):""}if(t.has("value")&&this.syncInternalStateFromDate(this.coerceValuePropToDate(this.value)),t.has("dateValue"))if(this.dateValue&&this.dateValue instanceof Date&&!isNaN(this.dateValue.getTime())){const e=this.dateValue.toLocaleDateString(this.locale,this._dateTimeOptions);this._dateString=e,this.maskInput&&this.maskDate(e)}else this.dateValue===null&&(this._dateString="",this._maskPattern="");if(t.has("startDate")&&(this.startDate&&this.startDate instanceof Date&&!isNaN(this.startDate.getTime())?(this._startDate=this.startDate,this._startDateInputValue=this.startDate.toLocaleDateString(this.locale,this._dateTimeOptions)):(this._startDate=null,this._startDateInputValue="")),t.has("endDate")&&(this.endDate&&this.endDate instanceof Date&&!isNaN(this.endDate.getTime())?(this._endDate=this.endDate,this._endDateInputValue=this.endDate.toLocaleDateString(this.locale,this._dateTimeOptions)):(this._endDate=null,this._endDateInputValue="")),t.has("maskInput")&&this.value&&this.value instanceof Date&&!isNaN(this.value.getTime())){const e=this.value.toLocaleDateString(this.locale,this._dateTimeOptions);this._dateString=e,this.maskInput?(this.maskDate(e),this._value=this._maskPattern):this._value=e}if(t.has("autoAddDateSeparators")&&this.autoAddDateSeparators){const e=this.coerceValuePropToDate(this.value);this._value=e?e.toLocaleDateString(this.locale,this._dateTimeOptions):""}}render(){return D` ${this.range?this.rangeMarkup:super.render()} ${this.datepickerMarkup} `}get endIconMarkup(){return this.calendarIconMarkup}get calendarIconMarkup(){return D`
2
2
  <ngc-icon-button
3
3
  slot="end-slot"
4
4
  ${p(this.datepickerTriggerRef)}
@@ -61,4 +61,4 @@ import{property as h}from"../../../../node_modules/.pnpm/@lit_reactive-element@2
61
61
  </div>
62
62
  ${this.bottomText}
63
63
  </div>
64
- `}setStartDate(t,e,a){this.errorText||(a?this.startInputRef.value.errorText=a:this.startInputRef.value.errorText=""),this._startDate=t,this._startDateInputValue=e}setEndDate(t,e,a){this.errorText||(a?this.endInputRef.value.errorText=a:this.endInputRef.value.errorText=""),this._endDate=t,this._endDateInputValue=e}get datepickerStartDate(){if(this._startDate instanceof Date&&!isNaN(this._startDate.getTime()))return this._startDate}get datepickerEndDate(){if(this._endDate instanceof Date&&!isNaN(this._endDate.getTime()))return this._endDate}handleRangeInputEvent(t,e){t.preventDefault(),t.stopPropagation();const a=t.detail.value;this.validateDate(e,a),this.dispatchEvent(new CustomEvent("input",this.rangeEventData))}handleRangeChangeEvent(t,e){t.preventDefault(),t.stopPropagation();const a=t.detail.value;this.validateDate(e,a),this.dispatchEvent(new CustomEvent("change",this.rangeEventData))}get rangeEventData(){return{bubbles:!0,composed:!0,detail:{startDate:this._startDate,endDate:this._endDate,value:this.dateRangeTextValue}}}get dateRangeTextValue(){const t=this._startDate instanceof Date?this._startDate.toLocaleDateString(this.locale,this._dateTimeOptions):"",e=this._endDate instanceof Date?this._endDate.toLocaleDateString(this.locale,this._dateTimeOptions):"";return`${t} - ${e}`}handleDatepickerRangeChange(t){!t.detail.startDate&&!t.detail.endDate&&this.closeDatepicker(),t.detail.startDate!==this._startDate&&(this._startDate=t.detail.startDate,this._startDateInputValue=t.detail.startDate?new Intl.DateTimeFormat(this.locale,this._dateTimeOptions).format(t.detail.startDate):""),t.detail.endDate!==this.endDate&&(this._endDate=t.detail.endDate,this._endDateInputValue=t.detail.endDate?new Intl.DateTimeFormat(this.locale,this._dateTimeOptions).format(t.detail.endDate):""),this.errorText||(this.endInputRef.value.errorText="",this.startInputRef.value.errorText=""),this.dispatchEvent(new CustomEvent("change",this.rangeEventData))}syncInternalStateFromDate(t){if(t&&!isNaN(t.getTime())){this.dateValue=t;const e=t.toLocaleDateString(this.locale,this._dateTimeOptions);this._dateString=e,this.maskInput&&this.maskDate(e),this.maskInput?this._value=this._maskPattern:this._value=e}else this._dateString="",this._maskPattern="",this.dateValue=null,this._value=""}coerceValuePropToDate(t){if(t==null)return null;if(t instanceof Date)return isNaN(t.getTime())?null:t;if(typeof t=="string"){const e=t.trim();if(e==="")return null;const a=this.tryParseIsoDateOnly(e);if(a)return a;const i=this.getDateValueFromLocalizedDateString(e);return i instanceof Date&&!isNaN(i.getTime())?i:null}if(typeof t=="number"&&Number.isFinite(t)){const e=new Date(t);return isNaN(e.getTime())?null:e}return null}tryParseIsoDateOnly(t){const e=/^(\d{4})-(\d{2})-(\d{2})(?:[Tt]|$)/.exec(t);if(!e)return null;const a=Number(e[1]),i=Number(e[2])-1,r=Number(e[3]),n=new Date(a,i,r);return n.getFullYear()!==a||n.getMonth()!==i||n.getDate()!==r?null:n}validateDate(t,e){let a=this.getDateValueFromLocalizedDateString(e),i=null;typeof a=="number"&&isNaN(a)&&(i=this.handleError("invalid-format")),a&&typeof a=="object"&&(this.minDate&&a<this.minDate&&(i=this.handleError("less-than-min-date")),this.maxDate&&a>this.maxDate&&(i=this.handleError("greater-than-max-date")),this.minDate&&this.maxDate&&(a<this.minDate||a>this.maxDate)&&(i=this.handleError("outside-range")),this.range&&(this._startDate&&a<this._startDate&&(i=this.handleError("invalid-end-date")),this._endDate&&a>this._endDate&&(i=this.handleError("invalid-start-date")))),t(a,i)}setLocaleDateFormat(){const t=new Intl.DateTimeFormat(this.locale).formatToParts(new Date("12/31/1999")),e=t.find(o=>o.type==="literal")?.value,a={day:"dd",month:"mm",year:"yyyy"},i={day:"([1-9]|0[1-9]|[12][0-9]|3[01])",month:"([1-9]|0[1-9]|1[0-2])",year:"\\d{4}"},r=new Map,n=new Map;t.forEach((o,c)=>{a[o.type]&&(r.set(c,a[o.type]),n.set(c,i[o.type]))}),this._dateSeparator=e||"/",this._localizedDateRegex=new RegExp(`^${Array.from(n.values()).join(this._dateSeparator)}$`),this.localizedExpectedDateFormat=Array.from(r.values()).join(this._dateSeparator),this._placeholder=this.localizedExpectedDateFormat}getDatePartsFromLocalizedDateString(t){const e=t.split(this._dateSeparator),a=this.localizedExpectedDateFormat?.split(this._dateSeparator)||[],i=a.findIndex(o=>o.toLowerCase().includes("y")),r=a.findIndex(o=>o.toLowerCase().includes("m")),n=a.findIndex(o=>o.toLowerCase().includes("d"));return{year:parseInt(e[i]),month:parseInt(e[r])-1,day:parseInt(e[n])}}getDateValueFromLocalizedDateString(t){if(!t||t==="")return null;if(!this._localizedDateRegex?.test(t))return NaN;const{year:a,month:i,day:r}=this.getDatePartsFromLocalizedDateString(t),n=new Date(a,i,r);return isNaN(n.getTime())?NaN:n}maskDate(t){const{year:e}=this.getDatePartsFromLocalizedDateString(t);this.localizedExpectedDateFormat&&(this._maskPattern=this.localizedExpectedDateFormat?.toLowerCase().replace("yyyy",e.toString()).replace("mm","XX").replace("dd","XX"))}autoFormatDate(t){if(!this.autoAddDateSeparators||!this.localizedExpectedDateFormat)return;const e=t.value.replace(/[^\d]/g,"").split(""),a=this.localizedExpectedDateFormat.split(this._dateSeparator).map(n=>n.length);let i=[];a.forEach(n=>{i.push(e.slice(0,n).reduce((o,c)=>o+c,"")),e.splice(0,n)}),i=i.filter(n=>n!=="");let r=i.join(this._dateSeparator);i.length<a.length&&i[i.length-1].length==a[a.length-1]&&(r+=this._dateSeparator),t.value!==r&&(t.value=r)}toggleVisibility(){this._datePickerVisible=!this._datePickerVisible,this._datePickerVisible&&(this.assignPosition(),this.datepickerRef.value?.shiftFocusToCalendarGrid())}assignPosition(){const t=this.range?this.endInputRef.value?.controlRef.value:this.controlRef.value;!this.datepickerRef||!this.datepickerRef.value||!t||(this._cleanup=v(t,this.datepickerRef.value,async()=>{if(!this.datepickerRef||!this.datepickerRef.value||!t)return;const{x:e,y:a,placement:i}=await y(t,this.datepickerRef.value,{placement:"bottom-end"});let r=i.includes("bottom")?4:-4;Object.assign(this.datepickerRef.value.style,{left:`${e}px`,top:`${a+r}px`})}))}handleError(t){switch(this.dispatchEvent(new b({errorReason:k.VALIDATION,component:{errorReason:t}})),t){case"invalid-format":return this._messageInvalidFormat.replace("{0}",this.localizedExpectedDateFormat);case"less-than-min-date":return this._messageLessThanMinDate.replace("{0}",this.minDate?.toLocaleDateString(this.locale,this._dateTimeOptions)||"");case"greater-than-max-date":return this._messageGreaterThanMaxDate.replace("{0}",this.maxDate?.toLocaleDateString(this.locale,this._dateTimeOptions)||"");case"outside-range":return this._messageOutsideRange.replace("{0}",this.minDate?.toLocaleDateString(this.locale,this._dateTimeOptions)||"").replace("{1}",this.maxDate?.toLocaleDateString(this.locale,this._dateTimeOptions)||"");case"invalid-start-date":return this._messageInvalidStartDate.replace("{0}",this.startDateLabel||"").replace("{1}",this.endDateLabel||"").replace("{2}",this._endDateInputValue||"");case"invalid-end-date":return this._messageInvalidEndDate.replace("{0}",this.endDateLabel||"").replace("{1}",this.startDateLabel||"").replace("{2}",this._startDateInputValue||"");default:return null}}};s.styles=[...$(s,s,"styles"),E(I)];l([h({type:Date})],s.prototype,"value",2);l([h({type:String,attribute:"locale"})],s.prototype,"locale",2);l([h({type:Date,attribute:"min-date"})],s.prototype,"minDate",2);l([h({type:Date,attribute:"max-date"})],s.prototype,"maxDate",2);l([h({type:Boolean,attribute:"sunday-start"})],s.prototype,"sundayStart",2);l([h({type:Boolean,attribute:"range"})],s.prototype,"range",2);l([h({type:Date,attribute:"start-date"})],s.prototype,"startDate",2);l([h({type:Date,attribute:"end-date"})],s.prototype,"endDate",2);l([h({type:String,attribute:"start-date-label"})],s.prototype,"startDateLabel",2);l([h({type:String,attribute:"end-date-label"})],s.prototype,"endDateLabel",2);l([h({type:Boolean,attribute:"mask-input"})],s.prototype,"maskInput",2);l([h({type:Boolean,attribute:"auto-add-date-separators"})],s.prototype,"autoAddDateSeparators",2);l([d()],s.prototype,"dateValue",2);l([d()],s.prototype,"_datePickerVisible",2);l([d()],s.prototype,"_startDate",2);l([d()],s.prototype,"_endDate",2);l([d()],s.prototype,"_startDateInputValue",2);l([d()],s.prototype,"_endDateInputValue",2);l([d()],s.prototype,"_maskPattern",2);l([d()],s.prototype,"_dateString",2);s=l([f("ngc-input-date"),_()],s);export{N as DateValidationError,s as NgcInputDate};
64
+ `}setStartDate(t,e,a){this.errorText||(a?this.startInputRef.value.errorText=a:this.startInputRef.value.errorText=""),this._startDate=t,this._startDateInputValue=e}setEndDate(t,e,a){this.errorText||(a?this.endInputRef.value.errorText=a:this.endInputRef.value.errorText=""),this._endDate=t,this._endDateInputValue=e}get datepickerStartDate(){if(this._startDate instanceof Date&&!isNaN(this._startDate.getTime()))return this._startDate}get datepickerEndDate(){if(this._endDate instanceof Date&&!isNaN(this._endDate.getTime()))return this._endDate}handleRangeInputEvent(t,e){t.preventDefault(),t.stopPropagation();const a=t.detail.value;this.validateDate(e,a),this.dispatchEvent(new CustomEvent("input",this.rangeEventData))}handleRangeChangeEvent(t,e){t.preventDefault(),t.stopPropagation();const a=t.detail.value;this.validateDate(e,a),this.dispatchEvent(new CustomEvent("change",this.rangeEventData))}get rangeEventData(){return{bubbles:!0,composed:!0,detail:{startDate:this._startDate,endDate:this._endDate,value:this.dateRangeTextValue}}}get dateRangeTextValue(){const t=this._startDate instanceof Date?this._startDate.toLocaleDateString(this.locale,this._dateTimeOptions):"",e=this._endDate instanceof Date?this._endDate.toLocaleDateString(this.locale,this._dateTimeOptions):"";return`${t} - ${e}`}handleDatepickerRangeChange(t){!t.detail.startDate&&!t.detail.endDate&&this.closeDatepicker(),t.detail.startDate!==this._startDate&&(this._startDate=t.detail.startDate,this._startDateInputValue=t.detail.startDate?new Intl.DateTimeFormat(this.locale,this._dateTimeOptions).format(t.detail.startDate):""),t.detail.endDate!==this.endDate&&(this._endDate=t.detail.endDate,this._endDateInputValue=t.detail.endDate?new Intl.DateTimeFormat(this.locale,this._dateTimeOptions).format(t.detail.endDate):""),this.errorText||(this.endInputRef.value.errorText="",this.startInputRef.value.errorText=""),this.dispatchEvent(new CustomEvent("change",this.rangeEventData))}syncInternalStateFromDate(t){if(t&&!isNaN(t.getTime())){this.dateValue=t;const e=t.toLocaleDateString(this.locale,this._dateTimeOptions);this._dateString=e,this.maskInput&&this.maskDate(e),this.maskInput?this._value=this._maskPattern:this._value=e}else this._dateString="",this._maskPattern="",this.dateValue=null,this._value=""}coerceValuePropToDate(t){if(t==null)return null;if(t instanceof Date)return isNaN(t.getTime())?null:t;if(typeof t=="string"){const e=t.trim();if(e==="")return null;const a=this.tryParseIsoDateOnly(e);if(a)return a;const i=this.getDateValueFromLocalizedDateString(e);return i instanceof Date&&!isNaN(i.getTime())?i:null}if(typeof t=="number"&&Number.isFinite(t)){const e=new Date(t);return isNaN(e.getTime())?null:e}return null}tryParseIsoDateOnly(t){const e=/^(\d{4})-(\d{2})-(\d{2})(?:[Tt]|$)/.exec(t);if(!e)return null;const a=Number(e[1]),i=Number(e[2])-1,n=Number(e[3]),s=new Date(a,i,n);return s.getFullYear()!==a||s.getMonth()!==i||s.getDate()!==n?null:s}validateDate(t,e){let a=this.getDateValueFromLocalizedDateString(e),i=null;typeof a=="number"&&isNaN(a)&&(i=this.handleError("invalid-format")),a&&typeof a=="object"&&(this.minDate&&a<this.minDate&&(i=this.handleError("less-than-min-date")),this.maxDate&&a>this.maxDate&&(i=this.handleError("greater-than-max-date")),this.minDate&&this.maxDate&&(a<this.minDate||a>this.maxDate)&&(i=this.handleError("outside-range")),this.range&&(this._startDate&&a<this._startDate&&(i=this.handleError("invalid-end-date")),this._endDate&&a>this._endDate&&(i=this.handleError("invalid-start-date")))),t(a,i)}setLocaleDateFormat(){const t=new Intl.DateTimeFormat(this.locale).formatToParts(new Date("12/31/1999")),e=t.find(o=>o.type==="literal")?.value,a={day:"dd",month:"mm",year:"yyyy"},i={day:"([1-9]|0[1-9]|[12][0-9]|3[01])",month:"([1-9]|0[1-9]|1[0-2])",year:"\\d{4}"},n=new Map,s=new Map;t.forEach((o,c)=>{a[o.type]&&(n.set(c,a[o.type]),s.set(c,i[o.type]))}),this._dateSeparator=e||"/",this._localizedDateRegex=new RegExp(`^${Array.from(s.values()).join(this._dateSeparator)}$`),this.localizedExpectedDateFormat=Array.from(n.values()).join(this._dateSeparator),this._placeholder=this.localizedExpectedDateFormat}getDatePartsFromLocalizedDateString(t){const e=t.split(this._dateSeparator),a=this.localizedExpectedDateFormat?.split(this._dateSeparator)||[],i=a.findIndex(o=>o.toLowerCase().includes("y")),n=a.findIndex(o=>o.toLowerCase().includes("m")),s=a.findIndex(o=>o.toLowerCase().includes("d"));return{year:parseInt(e[i]),month:parseInt(e[n])-1,day:parseInt(e[s])}}getDateValueFromLocalizedDateString(t){if(!t||t==="")return null;if(!this._localizedDateRegex?.test(t))return NaN;const{year:a,month:i,day:n}=this.getDatePartsFromLocalizedDateString(t),s=new Date(a,i,n);return isNaN(s.getTime())?NaN:s}maskDate(t){const{year:e}=this.getDatePartsFromLocalizedDateString(t);this.localizedExpectedDateFormat&&(this._maskPattern=this.localizedExpectedDateFormat?.toLowerCase().replace("yyyy",e.toString()).replace("mm","XX").replace("dd","XX"))}autoFormatDate(t){if(!this.autoAddDateSeparators||!this.localizedExpectedDateFormat)return;const e=t.value.replace(/[^\d]/g,"").split(""),a=this.localizedExpectedDateFormat.split(this._dateSeparator).map(s=>s.length);let i=[];a.forEach(s=>{i.push(e.slice(0,s).reduce((o,c)=>o+c,"")),e.splice(0,s)}),i=i.filter(s=>s!=="");let n=i.join(this._dateSeparator);i.length<a.length&&i[i.length-1].length==a[a.length-1]&&(n+=this._dateSeparator),t.value!==n&&(t.value=n)}toggleVisibility(){this._datePickerVisible=!this._datePickerVisible,this._datePickerVisible&&(this.assignPosition(),this.datepickerRef.value?.shiftFocusToCalendarGrid())}assignPosition(){const t=this.range?this.endInputRef.value?.controlRef.value:this.controlRef.value;!this.datepickerRef||!this.datepickerRef.value||!t||(this._cleanup=v(t,this.datepickerRef.value,async()=>{if(!this.datepickerRef||!this.datepickerRef.value||!t)return;const{x:e,y:a,placement:i}=await y(t,this.datepickerRef.value,{placement:"bottom-end",strategy:"fixed"});let n=i.includes("bottom")?4:-4;const s={left:`${e}px`,top:`${a+n}px`};this.range&&this.groupRef.value&&(s.width=`${this.groupRef.value.getBoundingClientRect().width}px`),Object.assign(this.datepickerRef.value.style,s)}))}handleError(t){switch(this.dispatchEvent(new b({errorReason:k.VALIDATION,component:{errorReason:t}})),t){case"invalid-format":return this._messageInvalidFormat.replace("{0}",this.localizedExpectedDateFormat);case"less-than-min-date":return this._messageLessThanMinDate.replace("{0}",this.minDate?.toLocaleDateString(this.locale,this._dateTimeOptions)||"");case"greater-than-max-date":return this._messageGreaterThanMaxDate.replace("{0}",this.maxDate?.toLocaleDateString(this.locale,this._dateTimeOptions)||"");case"outside-range":return this._messageOutsideRange.replace("{0}",this.minDate?.toLocaleDateString(this.locale,this._dateTimeOptions)||"").replace("{1}",this.maxDate?.toLocaleDateString(this.locale,this._dateTimeOptions)||"");case"invalid-start-date":return this._messageInvalidStartDate.replace("{0}",this.startDateLabel||"").replace("{1}",this.endDateLabel||"").replace("{2}",this._endDateInputValue||"");case"invalid-end-date":return this._messageInvalidEndDate.replace("{0}",this.endDateLabel||"").replace("{1}",this.startDateLabel||"").replace("{2}",this._startDateInputValue||"");default:return null}}};r.styles=[...$(r,r,"styles"),E(I)];l([h({type:Date})],r.prototype,"value",2);l([h({type:String,attribute:"locale"})],r.prototype,"locale",2);l([h({type:Date,attribute:"min-date"})],r.prototype,"minDate",2);l([h({type:Date,attribute:"max-date"})],r.prototype,"maxDate",2);l([h({type:Boolean,attribute:"sunday-start"})],r.prototype,"sundayStart",2);l([h({type:Boolean,attribute:"range"})],r.prototype,"range",2);l([h({type:Date,attribute:"start-date"})],r.prototype,"startDate",2);l([h({type:Date,attribute:"end-date"})],r.prototype,"endDate",2);l([h({type:String,attribute:"start-date-label"})],r.prototype,"startDateLabel",2);l([h({type:String,attribute:"end-date-label"})],r.prototype,"endDateLabel",2);l([h({type:Boolean,attribute:"mask-input"})],r.prototype,"maskInput",2);l([h({type:Boolean,attribute:"auto-add-date-separators"})],r.prototype,"autoAddDateSeparators",2);l([d()],r.prototype,"dateValue",2);l([d()],r.prototype,"_datePickerVisible",2);l([d()],r.prototype,"_startDate",2);l([d()],r.prototype,"_endDate",2);l([d()],r.prototype,"_startDateInputValue",2);l([d()],r.prototype,"_endDateInputValue",2);l([d()],r.prototype,"_maskPattern",2);l([d()],r.prototype,"_dateString",2);r=l([f("ngc-input-date"),_()],r);export{N as DateValidationError,r as NgcInputDate};
@@ -1 +1 @@
1
- const t=":root,:host{position:relative}.datepicker{position:absolute;top:0;left:0;display:none;z-index:1;width:var(--ngc-datepicker-width, 20rem)}.datepicker-visible{display:flex}.datepicker[range]{width:100%}.gator-input-date-range{display:flex;flex-direction:row;justify-content:space-between;gap:var(--spacing-8);align-items:start;margin-top:var(--spacing-5)}.gator-input-date-range ngc-input-text{--ngc-input-label-font-size: var(--font-size-body-3);--ngc-input-label-line-height: var(--line-height-body-3);width:100%}@media(max-width:400px){.gator-input-date-range{flex-direction:column;gap:0}}[disabled]{--ngc-icon-button-disabled-color: #BFBFBF}ngc-input-text[error-text]{--ngc-help-text-display: none}";export{t as default};
1
+ const t=":root,:host{position:relative}.datepicker{position:fixed;top:0;left:0;display:none;z-index:1;width:var(--ngc-datepicker-width, 20rem)}.datepicker-visible{display:flex}.gator-input-date-range{display:flex;flex-direction:row;justify-content:space-between;gap:var(--spacing-8);align-items:start;margin-top:var(--spacing-5)}.gator-input-date-range ngc-input-text{--ngc-input-label-font-size: var(--font-size-body-3);--ngc-input-label-line-height: var(--line-height-body-3);width:100%}@media(max-width:400px){.gator-input-date-range{flex-direction:column;gap:0}}[disabled]{--ngc-icon-button-disabled-color: #BFBFBF}ngc-input-text[error-text]{--ngc-help-text-display: none}";export{t as default};
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@ncino/web-components",
3
3
  "author": "nCino",
4
- "version": "13.10.0",
4
+ "version": "13.10.1",
5
5
  "license": "(c) Copyright 2023 nCino, Inc., all rights reserved",
6
6
  "publishConfig": {
7
7
  "registry": "https://registry.npmjs.org/"
@@ -100,10 +100,10 @@
100
100
  "vite-plugin-static-copy": "^3.3.0",
101
101
  "vitest": "^4.1.0",
102
102
  "yaml-eslint-parser": "^2.0.0",
103
- "@ncino/styles": "13.10.0"
103
+ "@ncino/styles": "13.10.1"
104
104
  },
105
105
  "peerDependencies": {
106
- "@ncino/styles": "13.10.0"
106
+ "@ncino/styles": "13.10.1"
107
107
  },
108
108
  "bugs": {
109
109
  "url": "https://github.com/ncino/force-sdk-web-components/issues"
package/web-types.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
3
3
  "name": "@ncino/web-components",
4
- "version": "13.9.2",
4
+ "version": "13.10.0",
5
5
  "description-markup": "markdown",
6
6
  "contributions": {
7
7
  "html": {