@ukic/canary-web-components 2.0.0-canary.9 → 3.0.0-canary.1

package/dist/components/ic-date-input2.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { i as isEmptyString, s as stringEnumToArray, g as getInputDescribedByText, r as removeFormResetListener, a as addFormResetListener, o as onComponentRequiredPropUndefined, b as isNumeric, I as IcInformationStatus, d as renderHiddenInput, e as IcThemeForegroundEnum, f as IcDayNames, h as IcDateInputMonths } from './helpers2.js';
+import { a as isEmptyString, s as stringEnumToArray, h as getInputDescribedByText, j as removeFormResetListener, k as addFormResetListener, o as onComponentRequiredPropUndefined, l as isNumeric, m as IcInformationStatus, n as renderHiddenInput, I as IcThemeForegroundEnum, q as IcDayNames, t as IcDateInputMonths } from './helpers2.js';
 import { d as defineCustomElement$8 } from './ic-button2.js';
 import { d as defineCustomElement$7 } from './ic-input-component-container2.js';
 import { d as defineCustomElement$6 } from './ic-input-container2.js';
@@ -151,7 +151,7 @@ const Calendar = `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20"
   <path d="M16.6667 2.50004H15.8334V0.833374H14.1667V2.50004H5.83342V0.833374H4.16675V2.50004H3.33341C2.41675 2.50004 1.66675 3.25004 1.66675 4.16671V17.5C1.66675 18.4167 2.41675 19.1667 3.33341 19.1667H16.6667C17.5834 19.1667 18.3334 18.4167 18.3334 17.5V4.16671C18.3334 3.25004 17.5834 2.50004 16.6667 2.50004ZM16.6667 17.5H3.33341V6.66671H16.6667V17.5Z" fill="currentColor"/>
 </svg>`;
 
-const icDateInputCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}input{border:0;height:100%;padding:0;outline:none;background:none;-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none}ic-input-component-container{cursor:text}ic-input-component-container,ic-input-component-container:hover{color:var(--ic-color-tertiary-text)}.focus-indicator{padding:var(--ic-space-xxxs) var(--ic-space-xs);align-items:center}.day-input{width:1.438rem}.month-input{width:1.813rem}.year-input,.year-input.fit-to-value{width:2.313rem}.fit-to-value{width:1.25rem}.sr-only{position:absolute;left:-9999px}.input-container{width:100%;display:flex;justify-content:space-between;align-items:center;position:relative}.action-buttons{display:flex;align-items:center}.show-calendar-button-wrapper{display:flex;justify-content:center;align-items:center}.clear-button,.calendar-button{border-radius:var(--ic-border-radius);transition:box-shadow var(--ic-easing-transition),\n    border-radius var(--ic-easing-transition);margin:0}.clear-button.hidden{display:none}.clear-button:focus,.calendar-button:focus,.clear-button:active,.calendar-button:active{background-color:var(--ic-focus-blue) !important;box-shadow:inset 0 0 0 0.125rem var(--ic-focus-glow) !important;border-radius:0.25rem}.clear-button:focus,.calendar-button:focus,.clear-button:active *,.calendar-button:active *{fill:var(--ic-architectural-white)}.divider{margin:0 var(--ic-space-xxs);width:var(--ic-space-1px);background-color:var(--ic-architectural-400);border-radius:var(--ic-space-1px)}.divider.small{height:var(--ic-space-md)}.divider.default{height:calc(var(--ic-space-sm) + var(--ic-space-xs))}.divider.large{height:var(--ic-space-lg)}";
+const icDateInputCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}input{border:0;height:100%;padding:0;outline:none;background:none;-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none}ic-input-component-container{cursor:text}ic-input-component-container,ic-input-component-container:hover{color:var(--ic-color-tertiary-text)}ic-input-component-container .focus-indicator{padding:var(--ic-space-xxxs) var(--ic-space-xs);align-items:center}.day-input{width:1.438rem}.month-input{width:1.813rem}.year-input,.year-input.fit-to-value{width:2.313rem}.fit-to-value{width:1.25rem}.sr-only{position:absolute;left:-9999px}.input-container{width:100%;display:flex;justify-content:space-between;align-items:center;position:relative}.action-buttons{display:flex;align-items:center}.show-calendar-button-wrapper{display:flex;justify-content:center;align-items:center}.clear-button,.calendar-button{border-radius:var(--ic-border-radius);transition:box-shadow var(--ic-easing-transition),\n    border-radius var(--ic-easing-transition);margin:0}.clear-button.hidden{display:none}.clear-button:focus,.calendar-button:focus,.clear-button:active,.calendar-button:active{background-color:var(--ic-focus-blue) !important;box-shadow:inset 0 0 0 0.125rem var(--ic-focus-glow) !important;border-radius:0.25rem}.clear-button:focus,.calendar-button:focus,.clear-button:active *,.calendar-button:active *{fill:var(--ic-architectural-white)}.divider{margin:0 var(--ic-space-xxs);width:var(--ic-space-1px);background-color:var(--ic-architectural-400);border-radius:var(--ic-space-1px)}.divider.small{height:var(--ic-space-md)}.divider.medium{height:calc(var(--ic-space-sm) + var(--ic-space-xs))}.divider.large{height:var(--ic-space-lg)}";
 
 let inputIds = 0;
 const DateInput = /*@__PURE__*/ proxyCustomElement(class DateInput extends HTMLElement {
@@ -182,6 +182,7 @@ const DateInput = /*@__PURE__*/ proxyCustomElement(class DateInput extends HTMLE
         this.KEYBOARD_EVENT_OBJECT_STRING = "[object KeyboardEvent]";
         this.MAX_DAY = 31;
         this.MAX_MONTH = 12;
+        this.previousEmittedDate = undefined;
         this.previousSelectedDate = null;
         this.selectedDate = null;
         this.setInputPasteValue = (input, pastedValue) => {
@@ -426,7 +427,7 @@ const DateInput = /*@__PURE__*/ proxyCustomElement(class DateInput extends HTMLE
         this.handleDateChange = (force) => {
             // Prevent icChange being emitted when each individual input is changed
             // This method is used within componentWillUpdate instead of using @Watch('value');
-            if (force || this.selectedDate !== this.previousSelectedDate) {
+            if (force || !dateMatches(this.selectedDate, this.previousSelectedDate)) {
                 if (this.value) {
                     this.inputsInOrder.forEach((input) => {
                         input.classList.add(this.FIT_TO_VALUE);
@@ -436,7 +437,7 @@ const DateInput = /*@__PURE__*/ proxyCustomElement(class DateInput extends HTMLE
                     this.setValueAndEmitChange(this.selectedDate);
                     this.notifyScreenReaderSelectedDate();
                 }
-                else {
+                else if (!(this.selectedDate === null && this.previousSelectedDate === null)) {
                     this.setValueAndEmitChange(null);
                     this.selectedDateInfoEl.textContent = "";
                 }
@@ -567,7 +568,7 @@ const DateInput = /*@__PURE__*/ proxyCustomElement(class DateInput extends HTMLE
                 this.selectedDate = null;
             }
             if (!(this.isValidDay && this.isValidMonth && this.isValidDate)) {
-                this.invalidDateText = "Please enter a valid date.";
+                this.invalidDateText = this.invalidDateMessage;
             }
             else if (this.isDisabledDate && this.selectedDate !== null) {
                 if (this.isBeforeMin) {
@@ -808,7 +809,8 @@ const DateInput = /*@__PURE__*/ proxyCustomElement(class DateInput extends HTMLE
             this.icBlur.emit({ value: this.selectedDate });
         };
         this.handleHostFocus = () => {
-            if (this.el.shadowRoot.activeElement.id.match(/(day|month|year)-input$/)) {
+            var _a;
+            if ((_a = this.el.shadowRoot.activeElement) === null || _a === void 0 ? void 0 : _a.id.match(/(day|month|year)-input$/)) {
                 this.removeLabelledBy = false;
             }
             else {
@@ -901,25 +903,21 @@ const DateInput = /*@__PURE__*/ proxyCustomElement(class DateInput extends HTMLE
                 this.setPreventInput(input, false);
             });
             this.isDateSetFromKeyboardEvent = false;
-            this.setValueAndEmitChange(null);
             this.setValidationMessage();
             this.handleDateChange(true);
             this.inputsInOrder[0].focus();
         };
         this.handleCalendarOpen = (ev) => {
+            var _a, _b;
             ev.stopImmediatePropagation();
-            this.calendarButtonEl.shadowRoot
-                .querySelector("ic-tooltip")
-                .displayTooltip(false);
+            (_a = this.calendarButtonEl) === null || _a === void 0 ? void 0 : _a.shadowRoot.querySelector("ic-tooltip").displayTooltip(false);
             this.calendarButtonClicked.emit({ value: this.selectedDate });
-            this.calendarButtonEl.shadowRoot
-                .querySelector("ic-tooltip")
-                .displayTooltip(false);
+            (_b = this.calendarButtonEl) === null || _b === void 0 ? void 0 : _b.shadowRoot.querySelector("ic-tooltip").displayTooltip(false);
             this.isDateSetFromKeyboardEvent = false;
         };
         this.setValueAndEmitChange = (value) => {
-            if (this.value !== value) {
-                this.icChange.emit({ value: value });
+            if (!dateMatches(new Date(this.value), value)) {
+                this.emitIcChange(value);
                 this.value = value;
             }
         };
@@ -934,13 +932,21 @@ const DateInput = /*@__PURE__*/ proxyCustomElement(class DateInput extends HTMLE
             this.clearButtonFocused = true;
         };
         this.handleClearBlur = (ev) => {
+            var _a;
             this.clearButtonFocused = false;
-            if (ev.relatedTarget.id.match(/(day|year)-input$/)) {
+            if ((_a = ev.relatedTarget) === null || _a === void 0 ? void 0 : _a.id.match(/(day|year)-input$/)) {
                 this.removeLabelledBy = false;
                 return;
             }
             this.removeLabelledBy = true;
         };
+        this.emitIcChange = (d) => {
+            if (!(d === null && this.previousEmittedDate === null) &&
+                !dateMatches(d, this.previousEmittedDate)) {
+                this.previousEmittedDate = d;
+                this.icChange.emit({ value: d });
+            }
+        };
         this.day = "";
         this.invalidDateText = undefined;
         this.maxDate = undefined;
@@ -959,7 +965,9 @@ const DateInput = /*@__PURE__*/ proxyCustomElement(class DateInput extends HTMLE
         this.disablePast = false;
         this.disablePastMessage = "Dates in the past are not allowed. Please select a date in the future.";
         this.helperText = undefined;
+        this.hideHelperText = false;
         this.inputId = `ic-date-input-${inputIds++}`;
+        this.invalidDateMessage = "Please enter a valid date.";
         this.label = undefined;
         this.max = "";
         this.min = "";
@@ -967,11 +975,17 @@ const DateInput = /*@__PURE__*/ proxyCustomElement(class DateInput extends HTMLE
         this.required = false;
         this.showCalendarButton = false;
         this.showClearButton = true;
-        this.size = "default";
+        this.size = "medium";
         this.value = "";
         this.validationStatus = "";
         this.validationText = "";
     }
+    watchDisableFutureHandler() {
+        this.watchMaxHandler();
+    }
+    watchDisablePastHandler() {
+        this.watchMinHandler();
+    }
     watchMaxHandler() {
         if (this.disableFuture) {
             this.maxDate = new Date();
@@ -988,18 +1002,39 @@ const DateInput = /*@__PURE__*/ proxyCustomElement(class DateInput extends HTMLE
             this.minDate = createDate(this.min, this.dateFormat);
         }
     }
+    watchRequiredHandler() {
+        // Prevent asterisk being read out after the label by screen reader (by applying aria-hidden)
+        // Needed because label is included in 'aria-labelledby' instead of using 'aria-label'
+        const labelEl = this.el.shadowRoot.querySelector("label");
+        if (this.required) {
+            const asteriskSpan = document.createElement("span");
+            asteriskSpan.setAttribute("id", "asterisk-span");
+            asteriskSpan.setAttribute("aria-hidden", "true");
+            asteriskSpan.textContent = " *";
+            labelEl === null || labelEl === void 0 ? void 0 : labelEl.appendChild(asteriskSpan);
+        }
+        else {
+            const asteriskSpan = this.el.shadowRoot.querySelector("#asterisk-span");
+            if (asteriskSpan) {
+                asteriskSpan.remove();
+            }
+        }
+    }
     disconnectedCallback() {
         removeFormResetListener(this.el, this.handleFormReset);
     }
     componentWillLoad() {
         this.defaultHelperText = `Use format ${this.dateFormat}`;
-        if (isEmptyString(this.helperText)) {
+        if (isEmptyString(this.helperText))
             this.helperText = this.defaultHelperText;
-        }
         this.watchMinHandler();
         this.watchMaxHandler();
         if (this.value) {
             this.setDate(this.value);
+            this.previousEmittedDate = this.selectedDate;
+        }
+        else {
+            this.previousEmittedDate = null;
         }
         this.screenReaderInfoId = `${this.inputId}-screen-reader-info`;
         this.assistiveHintId = `${this.inputId}-assistive-hint`;
@@ -1024,20 +1059,13 @@ const DateInput = /*@__PURE__*/ proxyCustomElement(class DateInput extends HTMLE
             input.addEventListener("focus", this.handleFocus);
             input.addEventListener("blur", this.handleBlur);
         });
-        // Prevent asterisk being read out after the label by screen reader (by applying aria-hidden)
-        // Needed because label is included in 'aria-labelledby' instead of using 'aria-label'
-        const labelEl = this.el.shadowRoot.querySelector("label");
-        if (this.required) {
-            const asteriskSpan = document.createElement("span");
-            asteriskSpan.setAttribute("aria-hidden", "true");
-            asteriskSpan.textContent = " *";
-            labelEl === null || labelEl === void 0 ? void 0 : labelEl.appendChild(asteriskSpan);
-        }
+        this.watchRequiredHandler();
     }
     componentWillUpdate() {
-        if (!this.isDateSetFromKeyboardEvent) {
+        if (isEmptyString(this.helperText))
+            this.helperText = this.defaultHelperText;
+        if (!this.isDateSetFromKeyboardEvent)
             this.setDate(this.value);
-        }
         this.setAriaInvalid(this.isValidDay, this.isValidMonth, this.isValidDate, this.isDisabledDate);
         this.handleDateChange(false);
         this.isDateSetFromKeyboardEvent = false;
@@ -1070,6 +1098,12 @@ const DateInput = /*@__PURE__*/ proxyCustomElement(class DateInput extends HTMLE
     async setDisableDays(days) {
         this.disableDays = days;
     }
+    /**
+     * @internal Used to enable other components to invoke an IcChange event from the input.
+     */
+    async triggerIcChange(d) {
+        this.emitIcChange(d);
+    }
     removeAriaLabelledBy() {
         this.inputCompContainerEl.removeAttribute(this.ARIA_LABELLED_BY);
     }
@@ -1176,7 +1210,7 @@ const DateInput = /*@__PURE__*/ proxyCustomElement(class DateInput extends HTMLE
         }
     }
     render() {
-        const { inputId, label, disabled, helperText, showClearButton, showCalendarButton, size, } = this;
+        const { inputId, label, disabled, helperText, hideHelperText, showClearButton, showCalendarButton, size, } = this;
         const hasCustomValidation = !isEmptyString(this.validationStatus) &&
             !isEmptyString(this.validationText);
         const validationStatus = hasCustomValidation
@@ -1186,7 +1220,7 @@ const DateInput = /*@__PURE__*/ proxyCustomElement(class DateInput extends HTMLE
                 : "";
         const assistiveHint = `Type or use the up and down arrow keys to change the values for the ${this.getDescOfInputsOrder()}.`;
         renderHiddenInput(true, this.el, this.name, this.convertToDate(this.year, this.month, this.day), this.disabled);
-        return (h(Host, { onBlur: this.handleHostBlur, onFocus: this.handleHostFocus }, h("ic-input-container", { disabled: disabled }, h("ic-input-label", { for: inputId, label: label, helperText: helperText, disabled: disabled }), h("span", { id: this.screenReaderInfoId, class: "sr-only", "aria-hidden": "true" }, this.getScreenReaderInfo(validationStatus), `${this.defaultHelperText}.`), h("span", { id: this.assistiveHintId, class: "sr-only", "aria-hidden": "true" }, assistiveHint), h("span", { id: "live-region", "aria-live": "assertive", class: "sr-only" }), h("ic-input-component-container", { id: inputId, ref: (el) => (this.inputCompContainerEl = el), disabled: disabled, validationStatus: validationStatus, size: size, role: "group" }, h("div", { class: "input-container" }, h("div", { class: "date-inputs" }, this.getInputsInOrder()[0], "/", this.getInputsInOrder()[1], "/", this.getInputsInOrder()[2]), h("div", { class: "action-buttons" }, showClearButton && (h("ic-button", { id: "clear-button", "aria-label": "Clear input", class: {
+        return (h(Host, { onBlur: this.handleHostBlur, onFocus: this.handleHostFocus }, h("ic-input-container", { disabled: disabled }, h("ic-input-label", { for: inputId, label: label, helperText: !hideHelperText ? helperText : null, disabled: disabled }), h("span", { id: this.screenReaderInfoId, class: "sr-only", "aria-hidden": "true" }, this.getScreenReaderInfo(validationStatus), hideHelperText && `${helperText}\n`, `${this.defaultHelperText}.`), h("span", { id: this.assistiveHintId, class: "sr-only", "aria-hidden": "true" }, assistiveHint), h("span", { id: "live-region", "aria-live": "assertive", class: "sr-only" }), h("ic-input-component-container", { id: inputId, ref: (el) => (this.inputCompContainerEl = el), disabled: disabled, validationStatus: validationStatus, size: size, role: "group" }, h("div", { class: "input-container" }, h("div", { class: "date-inputs" }, this.getInputsInOrder()[0], "/", this.getInputsInOrder()[1], "/", this.getInputsInOrder()[2]), h("div", { class: "action-buttons" }, showClearButton && (h("ic-button", { id: "clear-button", "aria-label": "Clear input", class: {
                 ["clear-button"]: true,
                 ["hidden"]: isEmptyString(this.day) &&
                     isEmptyString(this.month) &&
@@ -1200,8 +1234,11 @@ const DateInput = /*@__PURE__*/ proxyCustomElement(class DateInput extends HTMLE
     static get delegatesFocus() { return true; }
     get el() { return this; }
     static get watchers() { return {
+        "disableFuture": ["watchDisableFutureHandler"],
+        "disablePast": ["watchDisablePastHandler"],
         "max": ["watchMaxHandler"],
-        "min": ["watchMinHandler"]
+        "min": ["watchMinHandler"],
+        "required": ["watchRequiredHandler"]
     }; }
     static get style() { return icDateInputCss; }
 }, [17, "ic-date-input", {
@@ -1214,7 +1251,9 @@ const DateInput = /*@__PURE__*/ proxyCustomElement(class DateInput extends HTMLE
         "disablePast": [4, "disable-past"],
         "disablePastMessage": [1, "disable-past-message"],
         "helperText": [1025, "helper-text"],
+        "hideHelperText": [4, "hide-helper-text"],
         "inputId": [1, "input-id"],
+        "invalidDateMessage": [1, "invalid-date-message"],
         "label": [1],
         "max": [1],
         "min": [1],
@@ -1237,10 +1276,14 @@ const DateInput = /*@__PURE__*/ proxyCustomElement(class DateInput extends HTMLE
         "removeLabelledBy": [32],
         "getDate": [64],
         "setCalendarFocus": [64],
-        "setDisableDays": [64]
+        "setDisableDays": [64],
+        "triggerIcChange": [64]
     }, undefined, {
+        "disableFuture": ["watchDisableFutureHandler"],
+        "disablePast": ["watchDisablePastHandler"],
         "max": ["watchMaxHandler"],
-        "min": ["watchMinHandler"]
+        "min": ["watchMinHandler"],
+        "required": ["watchRequiredHandler"]
     }]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {
@@ -1296,6 +1339,6 @@ function defineCustomElement() {
     } });
 }
 
-export { DateInput as D, dateInRange as a, getMonthStart as b, getWeekStart as c, defineCustomElement as d, getWeekEnd as e, dateMatches as f, getMonthEnd as g, clampDate as h, createDate as i, yearInRange as y };
+export { DateInput as D, dateInRange as a, getMonthStart as b, dateMatches as c, defineCustomElement as d, getWeekStart as e, getWeekEnd as f, getMonthEnd as g, clampDate as h, createDate as i, yearInRange as y };
 
 //# sourceMappingURL=ic-date-input2.js.map