igniteui-webcomponents-inputs 4.8.1 → 5.0.0-beta.0

package/esm5/lib/{igc-date-picker-component.js → igc-x-date-picker-component.js}

@@ -5,7 +5,7 @@ import { WebComponentRenderer } from "igniteui-webcomponents-core";
 import { delegateCombine, delegateRemove } from "igniteui-webcomponents-core";
 import { TypeRegistrar } from "igniteui-webcomponents-core";
 import { RegisterElementHelper } from "igniteui-webcomponents-core";
-import { DatePicker } from './DatePicker';
+import { XDatePicker } from './XDatePicker';
 import { IgcSelectedValueChangedEventArgs } from "./igc-selected-value-changed-event-args";
 import { IgcGotFocusEventArgs } from "./igc-got-focus-event-args";
 import { IgcLostFocusEventArgs } from "./igc-lost-focus-event-args";
@@ -17,9 +17,9 @@ import { DateFormats_$type } from "./DateFormats";
 import { DayOfWeek_$type } from "./DayOfWeek";
 import { FirstWeek_$type } from "./FirstWeek";
 import { IgcHTMLElement } from "igniteui-webcomponents-core";
-var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
-    __extends(IgcDatePickerComponent, _super);
-    function IgcDatePickerComponent() {
+var IgcXDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
+    __extends(IgcXDatePickerComponent, _super);
+    function IgcXDatePickerComponent() {
         var _this = _super.call(this) || this;
         _this._disconnected = false;
         _this._settingAttributes = false;
@@ -61,7 +61,7 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         });
         return _this;
     }
-    Object.defineProperty(IgcDatePickerComponent.prototype, "height", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "height", {
         get: function () {
             return this._height;
         },
@@ -73,7 +73,7 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "width", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "width", {
         get: function () {
             return this._width;
         },
@@ -86,26 +86,26 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         configurable: true
     });
     // supports angular themes or custom properties set in CSS
-    IgcDatePickerComponent.prototype.updateStyle = function () {
+    IgcXDatePickerComponent.prototype.updateStyle = function () {
         this._styling(this, this);
     };
-    IgcDatePickerComponent.prototype.destroy = function () {
+    IgcXDatePickerComponent.prototype.destroy = function () {
         this._datePicker.destroy();
     };
-    IgcDatePickerComponent.prototype.createImplementation = function () {
-        return new DatePicker();
+    IgcXDatePickerComponent.prototype.createImplementation = function () {
+        return new XDatePicker();
     };
-    IgcDatePickerComponent.prototype.disconnectedCallback = function () {
+    IgcXDatePickerComponent.prototype.disconnectedCallback = function () {
         this._disconnected = true;
         this._datePicker.provideContainer(null);
     };
-    IgcDatePickerComponent.prototype.connectedCallback = function () {
+    IgcXDatePickerComponent.prototype.connectedCallback = function () {
         if (this._disconnected) {
             this._disconnected = false;
             return;
         }
-        this.classList.add("ig-date-picker");
-        this.classList.add("igc-date-picker");
+        this.classList.add("ig-x-date-picker");
+        this.classList.add("igc-x-date-picker");
         var rootWrapper = this._renderer.rootWrapper;
         var rootElement = rootWrapper.getNativeElement();
         this.appendChild(rootElement);
@@ -124,16 +124,16 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         this._styling(this, this);
         this.afterContentInit();
     };
-    IgcDatePickerComponent.prototype.afterContentInit = function () {
+    IgcXDatePickerComponent.prototype.afterContentInit = function () {
         this.i.notifySizeChanged();
     };
-    IgcDatePickerComponent.prototype.attributeSynced = function (name, value) {
+    IgcXDatePickerComponent.prototype.attributeSynced = function (name, value) {
         // an attribute was set by the component renderer.
         if (name === 'name') {
             this.i.setName(value);
         }
     };
-    Object.defineProperty(IgcDatePickerComponent.prototype, "i", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "i", {
         /**
          * @hidden
          */
@@ -145,7 +145,7 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    IgcDatePickerComponent._createFromInternal = function (internal) {
+    IgcXDatePickerComponent._createFromInternal = function (internal) {
         if (!internal) {
             return null;
         }
@@ -159,10 +159,10 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         }
         return TypeRegistrar.create(externalName);
     };
-    IgcDatePickerComponent.prototype._enqueueSetAttribute = function (attrName, attrValue) {
+    IgcXDatePickerComponent.prototype._enqueueSetAttribute = function (attrName, attrValue) {
         this._queuedSetAttributes.push({ attrName: attrName, attrValue: attrValue });
     };
-    IgcDatePickerComponent.prototype._flushQueuedAttributes = function () {
+    IgcXDatePickerComponent.prototype._flushQueuedAttributes = function () {
         this._settingAttributes = true;
         for (var i = 0; i < this._queuedSetAttributes.length; i++) {
             this.setAttribute(this._queuedSetAttributes[i].attrName, this._queuedSetAttributes[i].attrValue);
@@ -170,7 +170,7 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         this._settingAttributes = false;
         this._queuedSetAttributes.length = 0;
     };
-    IgcDatePickerComponent.prototype._a = function (attrName, attrValue) {
+    IgcXDatePickerComponent.prototype._a = function (attrName, attrValue) {
         if (this._updatingFromAttribute) {
             return;
         }
@@ -187,21 +187,21 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         }
         this._settingAttributes = false;
     };
-    Object.defineProperty(IgcDatePickerComponent, "observedAttributes", {
+    Object.defineProperty(IgcXDatePickerComponent, "observedAttributes", {
         get: function () {
-            if (IgcDatePickerComponent._observedAttributesIgcDatePickerComponent == null) {
-                var names = getAllPropertyNames(IgcDatePickerComponent);
+            if (IgcXDatePickerComponent._observedAttributesIgcXDatePickerComponent == null) {
+                var names = getAllPropertyNames(IgcXDatePickerComponent);
                 for (var i = 0; i < names.length; i++) {
                     names[i] = toSpinal(names[i]);
                 }
-                IgcDatePickerComponent._observedAttributesIgcDatePickerComponent = names;
+                IgcXDatePickerComponent._observedAttributesIgcXDatePickerComponent = names;
             }
-            return IgcDatePickerComponent._observedAttributesIgcDatePickerComponent;
+            return IgcXDatePickerComponent._observedAttributesIgcXDatePickerComponent;
         },
         enumerable: false,
         configurable: true
     });
-    IgcDatePickerComponent.prototype.attributeChangedCallback = function (name, oldValue, newValue) {
+    IgcXDatePickerComponent.prototype.attributeChangedCallback = function (name, oldValue, newValue) {
         if (this._settingAttributes) {
             return;
         }
@@ -210,13 +210,13 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         this[setName] = newValue;
         this._updatingFromAttribute = false;
     };
-    IgcDatePickerComponent.register = function () {
-        if (!IgcDatePickerComponent._isElementRegistered) {
-            IgcDatePickerComponent._isElementRegistered = true;
-            RegisterElementHelper.registerElement(IgcDatePickerComponent.htmlTagName, IgcDatePickerComponent);
+    IgcXDatePickerComponent.register = function () {
+        if (!IgcXDatePickerComponent._isElementRegistered) {
+            IgcXDatePickerComponent._isElementRegistered = true;
+            RegisterElementHelper.registerElement(IgcXDatePickerComponent.htmlTagName, IgcXDatePickerComponent);
         }
     };
-    Object.defineProperty(IgcDatePickerComponent.prototype, "value", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "value", {
         /**
      * Gets or Sets the property name that contains the values.
     */
@@ -229,47 +229,47 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "today", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "today", {
         /**
          * Gets or Sets the property name that contains the values.
         */
         get: function () {
-            return this.i.ba;
+            return this.i.bb;
         },
         set: function (v) {
-            this.i.ba = v;
+            this.i.bb = v;
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "label", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "label", {
         /**
          * Gets or Sets the property name that contains the label.
         */
         get: function () {
-            return this.i.b3;
+            return this.i.b4;
         },
         set: function (v) {
-            this.i.b3 = v;
+            this.i.b4 = v;
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "labelTextColor", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "labelTextColor", {
         /**
          * Gets or sets the color to use for the text.
         */
         get: function () {
-            return brushToString(this.i.dw);
+            return brushToString(this.i.dx);
         },
         set: function (v) {
-            this.i.dw = stringToBrush(v);
-            this._a("labelTextColor", brushToString(this.i.dw));
+            this.i.dx = stringToBrush(v);
+            this._a("labelTextColor", brushToString(this.i.dx));
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "labelTextStyle", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "labelTextStyle", {
         /**
          * Gets or sets the font to use for the combobox.
         */
@@ -288,46 +288,46 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "placeholder", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "placeholder", {
         /**
          * Gets or Sets the property name that contains the placeholder.
         */
         get: function () {
-            return this.i.cb;
+            return this.i.cc;
         },
         set: function (v) {
-            this.i.cb = v;
+            this.i.cc = v;
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "minDate", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "minDate", {
         /**
          * Gets or Sets the property name that contains the MinDate.
         */
         get: function () {
-            return this.i.a9;
+            return this.i.ba;
         },
         set: function (v) {
-            this.i.a9 = v;
+            this.i.ba = v;
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "maxDate", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "maxDate", {
         /**
          * Gets or Sets the property name that contains the MaxDate.
         */
         get: function () {
-            return this.i.a8;
+            return this.i.a9;
         },
         set: function (v) {
-            this.i.a8 = v;
+            this.i.a9 = v;
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "density", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "density", {
         /**
          * Gets or sets the display density to use for the date pcicker.
         */
@@ -341,7 +341,7 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "baseTheme", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "baseTheme", {
         /**
          * Gets or sets the base built in theme to use for the date picker.
         */
@@ -355,7 +355,7 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "textStyle", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "textStyle", {
         /**
          * Gets or sets the font to use for the combobox.
         */
@@ -374,63 +374,63 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "textColor", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "textColor", {
         /**
          * Gets or Sets the text color
         */
         get: function () {
-            return brushToString(this.i.dx);
+            return brushToString(this.i.dy);
         },
         set: function (v) {
-            this.i.dx = stringToBrush(v);
-            this._a("textColor", brushToString(this.i.dx));
+            this.i.dy = stringToBrush(v);
+            this._a("textColor", brushToString(this.i.dy));
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "iconColor", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "iconColor", {
         /**
          * Gets or Sets the text color
         */
         get: function () {
-            return brushToString(this.i.dv);
+            return brushToString(this.i.dw);
         },
         set: function (v) {
-            this.i.dv = stringToBrush(v);
-            this._a("iconColor", brushToString(this.i.dv));
+            this.i.dw = stringToBrush(v);
+            this._a("iconColor", brushToString(this.i.dw));
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "showClearButton", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "showClearButton", {
         /**
          * Gets or sets the ShowClearButton property to detirmine if the clear button is shown
         */
         get: function () {
-            return this.i.az;
+            return this.i.a0;
         },
         set: function (v) {
-            this.i.az = ensureBool(v);
-            this._a("showClearButton", this.i.az);
+            this.i.a0 = ensureBool(v);
+            this._a("showClearButton", this.i.a0);
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "showTodayButton", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "showTodayButton", {
         /**
          * Gets or sets the ShowTodayButton property to detirmine if the today button is shown
         */
         get: function () {
-            return this.i.a0;
+            return this.i.a1;
         },
         set: function (v) {
-            this.i.a0 = ensureBool(v);
-            this._a("showTodayButton", this.i.a0);
+            this.i.a1 = ensureBool(v);
+            this._a("showTodayButton", this.i.a1);
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "allowTextInput", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "allowTextInput", {
         /**
          * Gets or sets the AllowTextInput property to detirmine if entering text into the input is allowed
         */
@@ -444,7 +444,7 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "openOnFocus", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "openOnFocus", {
         /**
          * Gets or sets the AllowTextInput property to detirmine if entering text into the input is allowed
         */
@@ -458,7 +458,7 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "firstDayOfWeek", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "firstDayOfWeek", {
         /**
          * Gets or sets the FirstDayOfWeek property to detirmine first day of the week
         */
@@ -472,7 +472,7 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "firstWeekOfYear", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "firstWeekOfYear", {
         /**
          * Gets or sets the FirstWeekOfYear property to detirmine first week of the year
         */
@@ -486,21 +486,21 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "showWeekNumbers", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "showWeekNumbers", {
         /**
          * Gets or sets the ShowWeekNumbers property to detirmine if the week numbers are shown
         */
         get: function () {
-            return this.i.a1;
+            return this.i.a2;
         },
         set: function (v) {
-            this.i.a1 = ensureBool(v);
-            this._a("showWeekNumbers", this.i.a1);
+            this.i.a2 = ensureBool(v);
+            this._a("showWeekNumbers", this.i.a2);
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "dateFormat", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "dateFormat", {
         /**
          * Gets or sets the date time format to use for this column. If FormatString is specificied this value is ignored.
         */
@@ -514,20 +514,20 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "formatString", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "formatString", {
         /**
          * Gets or sets the Format property to detirmine the format of the date in the input
         */
         get: function () {
-            return this.i.by;
+            return this.i.bz;
         },
         set: function (v) {
-            this.i.by = v;
+            this.i.bz = v;
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "isDisabled", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "isDisabled", {
         get: function () {
             return this.i.av;
         },
@@ -538,7 +538,7 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "isFixed", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "isFixed", {
         /**
          * Indicates that the calendar dropdown will position itself relative to the window instead of the document.
         */
@@ -552,7 +552,7 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "openAsChild", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "openAsChild", {
         /**
          * Indicates that the dropdown should open as a child of the date picker.
         */
@@ -566,33 +566,33 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "useTopLayer", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "useTopLayer", {
         /**
          * Indicates that the dropdown will place itself into the browser top layer.
         */
         get: function () {
-            return this.i.a2;
+            return this.i.a3;
         },
         set: function (v) {
-            this.i.a2 = ensureBool(v);
-            this._a("useTopLayer", this.i.a2);
+            this.i.a3 = ensureBool(v);
+            this._a("useTopLayer", this.i.a3);
         },
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "hasUserValues", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "hasUserValues", {
         get: function () {
             return this._hasUserValues;
         },
         enumerable: false,
         configurable: true
     });
-    IgcDatePickerComponent.prototype.__m = function (propertyName) {
+    IgcXDatePickerComponent.prototype.__m = function (propertyName) {
         if (!this._inStyling) {
             this._hasUserValues.add(propertyName);
         }
     };
-    IgcDatePickerComponent.prototype._styling = function (container, component, parent) {
+    IgcXDatePickerComponent.prototype._styling = function (container, component, parent) {
         if (this._inStyling) {
             return;
         }
@@ -604,7 +604,7 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         if (typeName.indexOf("Xam") === 0) {
             typeName = typeName.substring(3);
         }
-        genericPrefix = toSpinal("DatePickerComponent");
+        genericPrefix = toSpinal("XDatePickerComponent");
         var additionalPrefixes = [];
         var prefix = toSpinal(typeName);
         additionalPrefixes.push(prefix + "-");
@@ -637,26 +637,26 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         }
         this._inStyling = false;
     };
-    IgcDatePickerComponent.prototype.select = function () {
-        this.i.df();
+    IgcXDatePickerComponent.prototype.select = function () {
+        this.i.dg();
     };
     /**
      * Exports visual information about the current state of the grid.
     
     */
-    IgcDatePickerComponent.prototype.exportVisualModel = function () {
-        var iv = this.i.bf();
+    IgcXDatePickerComponent.prototype.exportVisualModel = function () {
+        var iv = this.i.bg();
         return (iv);
     };
     /**
      * Returns a serialized copy of the exported visual model
     
     */
-    IgcDatePickerComponent.prototype.exportSerializedVisualModel = function () {
-        var iv = this.i.bv();
+    IgcXDatePickerComponent.prototype.exportSerializedVisualModel = function () {
+        var iv = this.i.bw();
         return (iv);
     };
-    Object.defineProperty(IgcDatePickerComponent.prototype, "selectedValueChanged", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "selectedValueChanged", {
         /**
          * Called when date is selected.
         */
@@ -687,7 +687,7 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "gotFocus", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "gotFocus", {
         get: function () {
             return this._gotFocus;
         },
@@ -715,7 +715,7 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "lostFocus", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "lostFocus", {
         get: function () {
             return this._lostFocus;
         },
@@ -743,7 +743,7 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "keyDown", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "keyDown", {
         get: function () {
             return this._keyDown;
         },
@@ -771,7 +771,7 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "changing", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "changing", {
         get: function () {
             return this._changing;
         },
@@ -799,7 +799,7 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(IgcDatePickerComponent.prototype, "valueChange", {
+    Object.defineProperty(IgcXDatePickerComponent.prototype, "valueChange", {
         get: function () {
             return this._valueChange;
         },
@@ -827,9 +827,9 @@ var IgcDatePickerComponent = /** @class */ /*@__PURE__*/ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    IgcDatePickerComponent._observedAttributesIgcDatePickerComponent = null;
-    IgcDatePickerComponent.htmlTagName = "igc-date-picker";
-    IgcDatePickerComponent._isElementRegistered = false;
-    return IgcDatePickerComponent;
+    IgcXDatePickerComponent._observedAttributesIgcXDatePickerComponent = null;
+    IgcXDatePickerComponent.htmlTagName = "igc-x-date-picker";
+    IgcXDatePickerComponent._isElementRegistered = false;
+    return IgcXDatePickerComponent;
 }(IgcHTMLElement));
-export { IgcDatePickerComponent };
+export { IgcXDatePickerComponent };

package/esm5/lib/{igc-date-picker-module.js → igc-x-date-picker-module.js}

@@ -8,22 +8,22 @@ import { IgcXCalendarModule } from './igc-x-calendar-module';
 import { IgcXButtonModule } from './igc-x-button-module';
 import { IgcXIconModule } from './igc-x-icon-module';
 import { IgcXInputGroupModule } from './igc-x-input-group-module';
-import { IgcDatePickerComponent } from './igc-date-picker-component';
-import { DatePicker } from './DatePicker';
+import { IgcXDatePickerComponent } from './igc-x-date-picker-component';
+import { XDatePicker } from './XDatePicker';
 import { TypeRegistrar } from "igniteui-webcomponents-core";
-var IgcDatePickerModule = /** @class */ /*@__PURE__*/ (function () {
-    function IgcDatePickerModule() {
+var IgcXDatePickerModule = /** @class */ /*@__PURE__*/ (function () {
+    function IgcXDatePickerModule() {
     }
-    IgcDatePickerModule.register = function () {
+    IgcXDatePickerModule.register = function () {
         IgcXCalendarModule.register();
         IgcXButtonModule.register();
         IgcXIconModule.register();
         IgcXInputGroupModule.register();
-        IgcDatePickerComponent.register();
-        TypeRegistrar.registerCons('IgcDatePickerComponent', IgcDatePickerComponent);
-        TypeRegistrar.registerCons('IgcDatePickerComponent', IgcDatePickerComponent);
-        TypeRegistrar.register('DatePicker', DatePicker.$type);
+        IgcXDatePickerComponent.register();
+        TypeRegistrar.registerCons('IgcXDatePickerComponent', IgcXDatePickerComponent);
+        TypeRegistrar.registerCons('IgcXDatePickerComponent', IgcXDatePickerComponent);
+        TypeRegistrar.register('XDatePicker', XDatePicker.$type);
     };
-    return IgcDatePickerModule;
+    return IgcXDatePickerModule;
 }());
-export { IgcDatePickerModule };
+export { IgcXDatePickerModule };