@esri/calcite-components 1.0.0-beta.79 → 1.0.0-beta.82

package/dist/collection/components/color-picker/interfaces.js

@@ -1,5 +1,6 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
+ * v1.0.0-beta.82
  */
 export {};

package/dist/collection/components/color-picker/resources.js

@@ -1,6 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
+ * v1.0.0-beta.82
  */
 import Color from "color";
 export const CSS = {

package/dist/collection/components/color-picker/utils.js

@@ -1,6 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
+ * v1.0.0-beta.82
  */
 export function rgbToHex(color) {
   const { r, g, b } = color;

package/dist/collection/components/color-picker-hex-input/color-picker-hex-input.js

@@ -1,9 +1,10 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
+ * v1.0.0-beta.82
  */
 import { Component, Element, Event, h, Listen, Method, Prop, State, Watch } from "@stencil/core";
-import { hexChar, hexToRGB, isLonghandHex, isValidHex, normalizeHex, rgbToHex } from "../color-picker/utils";
+import { hexChar, isLonghandHex, isValidHex, normalizeHex, rgbToHex } from "../color-picker/utils";
 import Color from "color";
 import { CSS } from "./resources";
 import { focusElement } from "../../utils/dom";
@@ -55,32 +56,13 @@ export class ColorPickerHexInput {
           : this.formatForInternalInput(rgbToHex(this.internalColor.object()));
     };
     this.onInputChange = () => {
-      const inputValue = this.inputNode.value;
-      let value;
-      if (inputValue) {
-        const hex = inputValue;
-        const color = hexToRGB(`#${hex}`);
-        if (!color) {
-          return;
-        }
-        value = normalizeHex(hex);
-      }
-      else if (this.allowEmpty) {
-        value = null;
-      }
-      this.value = value;
-      this.calciteColorPickerHexInputChange.emit();
+      this.internalSetValue(this.inputNode.value, this.value);
     };
     /**
      * The last valid/selected color. Used as a fallback if an invalid hex code is entered.
      */
     this.internalColor = DEFAULT_COLOR;
     this.previousNonNullValue = this.value;
-    //--------------------------------------------------------------------------
-    //
-    //  Private Methods
-    //
-    //--------------------------------------------------------------------------
     this.storeInputRef = (node) => {
       this.inputNode = node;
     };
@@ -95,38 +77,16 @@ export class ColorPickerHexInput {
     if (value) {
       const normalized = normalizeHex(value);
       if (isValidHex(normalized)) {
-        this.internalColor = Color(normalized);
-        this.value = normalized;
+        this.internalSetValue(normalized, normalized, false);
       }
       return;
     }
     if (allowEmpty) {
-      this.internalColor = null;
-      this.value = null;
+      this.internalSetValue(null, null, false);
     }
   }
   handleValueChange(value, oldValue) {
-    if (value) {
-      const normalized = normalizeHex(value);
-      if (isValidHex(normalized)) {
-        const { internalColor } = this;
-        const changed = !internalColor || normalized !== normalizeHex(internalColor.hex());
-        this.internalColor = Color(normalized);
-        this.previousNonNullValue = normalized;
-        this.value = normalized;
-        if (changed) {
-          this.calciteColorPickerHexInputChange.emit();
-        }
-        return;
-      }
-    }
-    else if (this.allowEmpty) {
-      this.internalColor = null;
-      this.value = null;
-      this.calciteColorPickerHexInputChange.emit();
-      return;
-    }
-    this.value = oldValue;
+    this.internalSetValue(value, oldValue, false);
   }
   // using @Listen as a workaround for VDOM listener not firing
   onInputKeyDown(event) {
@@ -138,15 +98,16 @@ export class ColorPickerHexInput {
       return;
     }
     const isNudgeKey = key === "ArrowDown" || key === "ArrowUp";
+    const oldValue = this.value;
     if (isNudgeKey) {
       if (!value) {
-        this.value = this.previousNonNullValue;
+        this.internalSetValue(this.previousNonNullValue, oldValue);
         event.preventDefault();
         return;
       }
       const direction = key === "ArrowUp" ? 1 : -1;
       const bump = shiftKey ? 10 : 1;
-      this.value = normalizeHex(this.nudgeRGBChannels(internalColor, bump * direction).hex());
+      this.internalSetValue(normalizeHex(this.nudgeRGBChannels(internalColor, bump * direction).hex()), oldValue);
       event.preventDefault();
       return;
     }
@@ -166,7 +127,7 @@ export class ColorPickerHexInput {
     const { intlHex, value } = this;
     const hexInputValue = this.formatForInternalInput(value);
     return (h("div", { class: CSS.container },
-      h("calcite-input", { class: CSS.input, label: intlHex, maxLength: 6, onCalciteInputBlur: this.onCalciteInputBlur, onCalciteInputChange: this.onInputChange, prefixText: "#", ref: this.storeInputRef, scale: this.scale, value: hexInputValue }),
+      h("calcite-input", { class: CSS.input, label: intlHex, maxLength: 6, onCalciteInputBlur: this.onCalciteInputBlur, onCalciteInputChange: this.onInputChange, onKeyDown: this.handleKeyDown, prefixText: "#", ref: this.storeInputRef, scale: this.scale, value: hexInputValue }),
       hexInputValue ? (h("calcite-color-picker-swatch", { active: true, class: CSS.preview, color: `#${hexInputValue}`, scale: this.scale })) : null));
   }
   //--------------------------------------------------------------------------
@@ -178,12 +139,47 @@ export class ColorPickerHexInput {
   async setFocus() {
     focusElement(this.inputNode);
   }
+  //--------------------------------------------------------------------------
+  //
+  //  Private Methods
+  //
+  //--------------------------------------------------------------------------
+  internalSetValue(value, oldValue, emit = true) {
+    if (value) {
+      const normalized = normalizeHex(value);
+      if (isValidHex(normalized)) {
+        const { internalColor } = this;
+        const changed = !internalColor || normalized !== normalizeHex(internalColor.hex());
+        this.internalColor = Color(normalized);
+        this.previousNonNullValue = normalized;
+        this.value = normalized;
+        if (changed && emit) {
+          this.calciteColorPickerHexInputChange.emit();
+        }
+        return;
+      }
+    }
+    else if (this.allowEmpty) {
+      this.internalColor = null;
+      this.value = null;
+      if (emit) {
+        this.calciteColorPickerHexInputChange.emit();
+      }
+      return;
+    }
+    this.value = oldValue;
+  }
   formatForInternalInput(hex) {
     return hex ? hex.replace("#", "") : "";
   }
   nudgeRGBChannels(color, amount) {
     return Color.rgb(color.array().map((channel) => channel + amount));
   }
+  handleKeyDown(event) {
+    if (event.key === "Enter") {
+      event.preventDefault();
+    }
+  }
   static get is() { return "calcite-color-picker-hex-input"; }
   static get encapsulation() { return "shadow"; }
   static get originalStyleUrls() { return {

package/dist/collection/components/color-picker-hex-input/resources.js

@@ -1,6 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
+ * v1.0.0-beta.82
  */
 export const CSS = {
   container: "container",

package/dist/collection/components/color-picker-swatch/color-picker-swatch.js

@@ -1,6 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
+ * v1.0.0-beta.82
  */
 import { Component, Element, h, Prop, Watch } from "@stencil/core";
 import Color from "color";

package/dist/collection/components/color-picker-swatch/resources.js

@@ -1,6 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
+ * v1.0.0-beta.82
  */
 export const CSS = {
   swatch: "swatch",

package/dist/collection/components/combobox/combobox.js

@@ -1,18 +1,20 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
+ * v1.0.0-beta.82
  */
 import { Component, h, Prop, State, Listen, Event, Element, Method, Watch, Host } from "@stencil/core";
 import { filter } from "../../utils/filter";
 import { debounce } from "lodash-es";
-import { createPopper, updatePopper, CSS as PopperCSS, popperMenuFlipPlacements, defaultMenuPlacement } from "../../utils/popper";
+import { createPopper, updatePopper, CSS as PopperCSS, popperMenuComputedPlacements, defaultMenuPlacement, filterComputedPlacements } from "../../utils/popper";
 import { guid } from "../../utils/guid";
 import { ComboboxChildSelector, ComboboxItem, ComboboxItemGroup, TEXT } from "./resources";
 import { getItemAncestors, getItemChildren, hasActiveChildren } from "./utils";
 import { connectLabel, disconnectLabel, getLabelText } from "../../utils/label";
-import { afterConnectDefaultValueSet, connectForm, disconnectForm, HiddenFormInputSlot } from "../../utils/form";
+import { afterConnectDefaultValueSet, connectForm, disconnectForm, HiddenFormInputSlot, submitForm } from "../../utils/form";
 import { createObserver } from "../../utils/observers";
 import { updateHostInteraction } from "../../utils/interactive";
+import { toAriaBoolean } from "../../utils/dom";
 const isGroup = (el) => el.tagName === ComboboxItemGroup;
 const itemUidPrefix = "combobox-item-";
 const chipUidPrefix = "combobox-chip-";
@@ -57,11 +59,6 @@ export class Combobox {
      * @default "Remove tag"
      */
     this.intlRemoveTag = TEXT.removeTag;
-    //--------------------------------------------------------------------------
-    //
-    //  Private State/Props
-    //
-    //--------------------------------------------------------------------------
     this.internalValueChangeFlag = false;
     this.items = [];
     this.groupItems = [];
@@ -83,8 +80,14 @@ export class Combobox {
     //  Private Methods
     //
     // --------------------------------------------------------------------------
+    this.setFilteredPlacements = () => {
+      const { el, flipPlacements } = this;
+      this.filteredFlipPlacements = flipPlacements
+        ? filterComputedPlacements(flipPlacements, el)
+        : null;
+    };
     this.getValue = () => {
-      const items = this.selectedItems.map((item) => item === null || item === void 0 ? void 0 : item.value.toString());
+      const items = this.selectedItems.map((item) => { var _a; return (_a = item === null || item === void 0 ? void 0 : item.value) === null || _a === void 0 ? void 0 : _a.toString(); });
       return (items === null || items === void 0 ? void 0 : items.length) ? (items.length > 1 ? items : items[0]) : "";
     };
     this.onLabelClick = () => {
@@ -100,8 +103,9 @@ export class Combobox {
             this.addCustomChip(this.text, true);
             event.preventDefault();
           }
-          else {
+          else if (this.active) {
             this.active = false;
+            event.preventDefault();
           }
           break;
         case "ArrowLeft":
@@ -111,22 +115,47 @@ export class Combobox {
           this.nextChip();
           break;
         case "ArrowUp":
-          event.preventDefault();
-          this.active = true;
           this.shiftActiveItemIndex(-1);
+          if (!this.comboboxInViewport()) {
+            this.el.scrollIntoView();
+          }
           break;
         case "ArrowDown":
-          event.preventDefault();
-          this.active = true;
+          if (!this.active) {
+            event.preventDefault();
+            this.active = true;
+          }
           this.shiftActiveItemIndex(1);
+          if (!this.comboboxInViewport()) {
+            this.el.scrollIntoView();
+          }
+          break;
+        case " ":
+          if (!this.textInput.value) {
+            event.preventDefault();
+            this.active = true;
+            this.shiftActiveItemIndex(1);
+          }
           break;
         case "Home":
-          this.active = true;
+          if (this.active) {
+            event.preventDefault();
+          }
           this.updateActiveItemIndex(0);
+          this.scrollToActiveItem();
+          if (!this.comboboxInViewport()) {
+            this.el.scrollIntoView();
+          }
           break;
         case "End":
-          this.active = true;
+          if (this.active) {
+            event.preventDefault();
+          }
           this.updateActiveItemIndex(this.visibleItems.length - 1);
+          this.scrollToActiveItem();
+          if (!this.comboboxInViewport()) {
+            this.el.scrollIntoView();
+          }
           break;
         case "Escape":
           this.active = false;
@@ -141,6 +170,9 @@ export class Combobox {
           else if (this.allowCustomValues && this.text) {
             this.addCustomChip(this.text, true);
           }
+          else if (!event.defaultPrevented) {
+            submitForm(this);
+          }
           break;
         case "Delete":
         case "Backspace":
@@ -151,11 +183,6 @@ export class Combobox {
             this.removeLastChip();
           }
           break;
-        default:
-          if (!this.active) {
-            this.setFocus();
-          }
-          break;
       }
     };
     this.toggleCloseEnd = () => {
@@ -189,10 +216,12 @@ export class Combobox {
       }
       this.calciteComboboxChipDismiss.emit(event.detail);
     };
-    this.setFocusClick = (event) => {
+    this.clickHandler = (event) => {
       if (event.composedPath().some((node) => node.tagName === "CALCITE-CHIP")) {
         return;
       }
+      this.active = !this.active;
+      this.updateActiveItemIndex(0);
       this.setFocus();
     };
     this.setInactiveIfNotContained = (event) => {
@@ -200,7 +229,7 @@ export class Combobox {
       if (!this.active || composedPath.includes(this.el) || composedPath.includes(this.referenceEl)) {
         return;
       }
-      if (this.allowCustomValues && this.text) {
+      if (this.allowCustomValues && this.text.trim().length) {
         this.addCustomChip(this.text);
       }
       if (this.selectionMode === "single") {
@@ -235,7 +264,7 @@ export class Combobox {
       const find = (item, filteredData) => item &&
         filteredData.some(({ label, value }) => {
           if (isGroup(item)) {
-            return value === item.label || value === item.label;
+            return value === item.label;
           }
           return (value === item.textLabel ||
             value === item.value ||
@@ -280,9 +309,19 @@ export class Combobox {
         this.setMaxScrollerHeight();
       }
     };
+    this.scrollToActiveItem = () => {
+      const activeItem = this.visibleItems[this.activeItemIndex];
+      const height = this.calculateSingleItemHeight(activeItem);
+      const { offsetHeight, scrollTop } = this.listContainerEl;
+      if (offsetHeight + scrollTop < activeItem.offsetTop + height) {
+        this.listContainerEl.scrollTop = activeItem.offsetTop - offsetHeight + height;
+      }
+      else if (activeItem.offsetTop < scrollTop) {
+        this.listContainerEl.scrollTop = activeItem.offsetTop;
+      }
+    };
     this.comboboxFocusHandler = () => {
       var _a;
-      this.active = true;
       (_a = this.textInput) === null || _a === void 0 ? void 0 : _a.focus();
     };
     this.comboboxBlurHandler = (event) => {
@@ -319,6 +358,9 @@ export class Combobox {
       this.updateItems();
     }
   }
+  flipPlacementsHandler() {
+    this.setFilteredPlacements();
+  }
   //--------------------------------------------------------------------------
   //
   //  Event Listeners
@@ -332,6 +374,8 @@ export class Combobox {
       return;
     }
     const target = event.target;
+    const newIndex = this.visibleItems.indexOf(target);
+    this.updateActiveItemIndex(newIndex);
     this.toggleSelection(target, target.selected);
   }
   //--------------------------------------------------------------------------
@@ -355,7 +399,6 @@ export class Combobox {
   /** Sets focus on the component. */
   async setFocus() {
     var _a;
-    this.active = true;
     (_a = this.textInput) === null || _a === void 0 ? void 0 : _a.focus();
     this.activeChipIndex = -1;
     this.activeItemIndex = -1;
@@ -374,6 +417,7 @@ export class Combobox {
     this.createPopper();
     connectLabel(this);
     connectForm(this);
+    this.setFilteredPlacements();
   }
   componentWillLoad() {
     this.updateItems();
@@ -405,13 +449,20 @@ export class Combobox {
   textHandler() {
     this.updateActiveItemIndex(-1);
   }
+  comboboxInViewport() {
+    const bounding = this.el.getBoundingClientRect();
+    return (bounding.top >= 0 &&
+      bounding.left >= 0 &&
+      bounding.right <= (window.innerWidth || document.documentElement.clientWidth) &&
+      bounding.bottom <= (window.innerHeight || document.documentElement.clientHeight));
+  }
   getModifiers() {
     const flipModifier = {
       name: "flip",
       enabled: true
     };
     flipModifier.options = {
-      fallbackPlacements: this.flipPlacements || popperMenuFlipPlacements
+      fallbackPlacements: this.filteredFlipPlacements || popperMenuComputedPlacements
     };
     const eventListenerModifier = {
       name: "eventListeners",
@@ -542,8 +593,7 @@ export class Combobox {
     return this.items.map((item) => ({
       constant: item.constant,
       value: item.value,
-      label: item.textLabel,
-      guid: item.guid
+      label: item.textLabel
     }));
   }
   getNeedsIcon() {
@@ -629,19 +679,10 @@ export class Combobox {
     chip === null || chip === void 0 ? void 0 : chip.setFocus();
   }
   shiftActiveItemIndex(delta) {
-    const length = this.visibleItems.length;
+    const { length } = this.visibleItems;
     const newIndex = (this.activeItemIndex + length + delta) % length;
     this.updateActiveItemIndex(newIndex);
-    // ensure active item is in view if we have scrolling
-    const activeItem = this.visibleItems[this.activeItemIndex];
-    const height = this.calculateSingleItemHeight(activeItem);
-    const { offsetHeight, scrollTop } = this.listContainerEl;
-    if (offsetHeight + scrollTop < activeItem.offsetTop + height) {
-      this.listContainerEl.scrollTop = activeItem.offsetTop - offsetHeight + height;
-    }
-    else if (activeItem.offsetTop < scrollTop) {
-      this.listContainerEl.scrollTop = activeItem.offsetTop;
-    }
+    this.scrollToActiveItem();
   }
   updateActiveItemIndex(index) {
     var _a;
@@ -695,7 +736,7 @@ export class Combobox {
       showLabel && (h("span", { class: {
           label: true,
           "label--spaced": needsIcon
-        }, key: "label", onFocus: this.comboboxFocusHandler, tabindex: "0" }, selectedItem.textLabel)),
+        }, key: "label" }, selectedItem.textLabel)),
       h("input", { "aria-activedescendant": this.activeDescendant, "aria-autocomplete": "list", "aria-controls": `${listboxUidPrefix}${guid}`, "aria-label": getLabelText(this), class: {
           input: true,
           "input--single": true,
@@ -705,7 +746,7 @@ export class Combobox {
         }, disabled: disabled, id: `${inputUidPrefix}${guid}`, key: "input", onBlur: this.comboboxBlurHandler, onFocus: this.comboboxFocusHandler, onInput: this.inputHandler, placeholder: placeholder, ref: (el) => (this.textInput = el), type: "text" })));
   }
   renderListBoxOptions() {
-    return this.visibleItems.map((item) => (h("li", { "aria-selected": (!!item.selected).toString(), id: item.guid ? `${itemUidPrefix}${item.guid}` : null, role: "option", tabindex: "-1" }, item.textLabel)));
+    return this.visibleItems.map((item) => (h("li", { "aria-selected": toAriaBoolean(item.selected), id: item.guid ? `${itemUidPrefix}${item.guid}` : null, role: "option", tabindex: "-1" }, item.textLabel)));
   }
   renderPopperContainer() {
     const { active, setMenuEl, setListContainerEl } = this;
@@ -726,18 +767,19 @@ export class Combobox {
       needsIcon && (h("span", { class: "icon-start" }, (selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.icon) && (h("calcite-icon", { class: "selected-icon", icon: selectedItem.icon, scale: "s" })))));
   }
   renderIconEnd() {
+    const { active } = this;
     return (h("span", { class: "icon-end" },
-      h("calcite-icon", { icon: "chevron-down", scale: "s" })));
+      h("calcite-icon", { icon: active ? "chevron-up" : "chevron-down", scale: "s" })));
   }
   render() {
     const { active, guid, label } = this;
     const single = this.selectionMode === "single";
     return (h(Host, { onKeyDown: this.keydownHandler },
-      h("div", { "aria-autocomplete": "list", "aria-expanded": active.toString(), "aria-haspopup": "listbox", "aria-labelledby": `${labelUidPrefix}${guid}`, "aria-owns": `${listboxUidPrefix}${guid}`, class: {
+      h("div", { "aria-autocomplete": "list", "aria-expanded": toAriaBoolean(active), "aria-haspopup": "listbox", "aria-labelledby": `${labelUidPrefix}${guid}`, "aria-owns": `${listboxUidPrefix}${guid}`, class: {
           wrapper: true,
           "wrapper--single": single || !this.selectedItems.length,
           "wrapper--active": active
-        }, onClick: this.setFocusClick, ref: this.setReferenceEl, role: "combobox" },
+        }, onClick: this.clickHandler, ref: this.setReferenceEl, role: "combobox" },
         h("div", { class: "grid-input" },
           this.renderIconStart(),
           !single && this.renderChips(),
@@ -1199,6 +1241,9 @@ export class Combobox {
     }, {
       "propName": "value",
       "methodName": "valueHandler"
+    }, {
+      "propName": "flipPlacements",
+      "methodName": "flipPlacementsHandler"
     }, {
       "propName": "selectedItems",
       "methodName": "selectedItemsHandler"

package/dist/collection/components/combobox/interfaces.js

@@ -1,5 +1,6 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
+ * v1.0.0-beta.82
  */
 export {};

package/dist/collection/components/combobox/resources.js

@@ -1,6 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
+ * v1.0.0-beta.82
  */
 export const ComboboxItem = "CALCITE-COMBOBOX-ITEM";
 export const ComboboxItemGroup = "CALCITE-COMBOBOX-ITEM-GROUP";
@@ -8,3 +9,7 @@ export const ComboboxChildSelector = `${ComboboxItem}, ${ComboboxItemGroup}`;
 export const TEXT = {
   removeTag: "Remove tag"
 };
+export const CSS = {
+  labelActive: "label--active",
+  labelSelected: "label--selected"
+};

package/dist/collection/components/combobox/utils.js

@@ -1,6 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
+ * v1.0.0-beta.82
  */
 import { nodeListToArray } from "../../utils/dom";
 import { ComboboxChildSelector } from "./resources";

package/dist/collection/components/combobox-item/combobox-item.css

@@ -208,7 +208,7 @@
 .icon--dot{
   display: flex;
   justify-content: flex-end;
-  width: var(--calcite-combobox-item-spacing-unit-l);
+  min-width: var(--calcite-combobox-item-spacing-unit-l);
 }
 
 .icon--dot:before {

package/dist/collection/components/combobox-item/combobox-item.js

@@ -1,6 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
+ * v1.0.0-beta.82
  */
 import { Component, Element, Event, Host, Method, Prop, h, Watch } from "@stencil/core";
 import { getElementProp, getSlotted } from "../../utils/dom";
@@ -188,7 +189,7 @@ export class ComboboxItem {
       "mutable": true,
       "complexType": {
         "original": "ComboboxChildElement[]",
-        "resolved": "any[]",
+        "resolved": "ComboboxChildElement[]",
         "references": {
           "ComboboxChildElement": {
             "location": "import",

package/dist/collection/components/combobox-item/resources.js

@@ -1,6 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
+ * v1.0.0-beta.82
  */
 export const CSS = {
   icon: "icon",

package/dist/collection/components/combobox-item-group/combobox-item-group.js

@@ -1,6 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
+ * v1.0.0-beta.82
  */
 import { Component, Prop, h, Element } from "@stencil/core";
 import { CSS } from "./resources";
@@ -51,7 +52,7 @@ export class ComboboxItemGroup {
       "mutable": true,
       "complexType": {
         "original": "ComboboxChildElement[]",
-        "resolved": "any[]",
+        "resolved": "ComboboxChildElement[]",
         "references": {
           "ComboboxChildElement": {
             "location": "import",

package/dist/collection/components/combobox-item-group/resources.js

@@ -1,6 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
+ * v1.0.0-beta.82
  */
 export const CSS = {
   list: "list",

package/dist/collection/components/date-picker/date-picker.js

@@ -1,6 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
+ * v1.0.0-beta.82
  */
 import { Component, h, Prop, Event, Element, Host, State, Watch, Build } from "@stencil/core";
 import { getLocaleData } from "./utils";
@@ -227,10 +228,14 @@ export class DatePicker {
     this.activeStartDate = startDate;
   }
   onMinChanged(min) {
-    this.minAsDate = dateFromISO(min);
+    if (min) {
+      this.minAsDate = dateFromISO(min);
+    }
   }
   onMaxChanged(max) {
-    this.maxAsDate = dateFromISO(max);
+    if (max) {
+      this.maxAsDate = dateFromISO(max);
+    }
   }
   // --------------------------------------------------------------------------
   //

package/dist/collection/components/date-picker/interfaces.js

@@ -1,5 +1,6 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
+ * v1.0.0-beta.82
  */
 export {};