@esri/calcite-components 1.0.0-next.690 → 1.0.0-next.692

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

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 export const CSS = {
   handle: "handle",

package/dist/collection/components/icon/icon.js

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 import { Build, h, Host } from "@stencil/core";
 import { CSS } from "./resources";

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

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 export const CSS = {
   icon: "icon",

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

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 import { getAssetPath } from "@stencil/core";
 /**

package/dist/collection/components/inline-editable/inline-editable.js

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 import { h } from "@stencil/core";
 import { getElementProp, getSlotted } from "../../utils/dom";

package/dist/collection/components/inline-editable/resources.js

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 export const CSS = {
   wrapper: "wrapper",

package/dist/collection/components/input/input.js

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 import { h, Host } from "@stencil/core";
 import { getElementDir, getElementProp, getSlotted, isPrimaryPointerButton, setRequestedIcon } from "../../utils/dom";

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

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 export const CSS = {
   loader: "loader",

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

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 import { h, Host, Build } from "@stencil/core";
 import { getLocaleData, getValueAsDateRange } from "../date-picker/utils";
@@ -158,8 +158,6 @@ export class InputDatePicker {
       this.userChangedValue = true;
       this.value = newValue;
       this.valueAsDate = newValue ? getValueAsDateRange(newValue) : undefined;
-      this.start = newStartDateISO;
-      this.end = newEndDateISO;
       const eventDetail = {
         startDate: newStartDate,
         endDate: newEndDate ? setEndOfDay(newEndDate) : null
@@ -211,8 +209,6 @@ export class InputDatePicker {
     this.flipPlacements = undefined;
     this.headingLevel = undefined;
     this.valueAsDate = undefined;
-    this.startAsDate = undefined;
-    this.endAsDate = undefined;
     this.minAsDate = undefined;
     this.maxAsDate = undefined;
     this.min = undefined;
@@ -224,8 +220,6 @@ export class InputDatePicker {
     this.placement = defaultMenuPlacement;
     this.range = false;
     this.required = false;
-    this.start = undefined;
-    this.end = undefined;
     this.overlayPositioning = "absolute";
     this.proximitySelectionDisabled = false;
     this.layout = "horizontal";
@@ -246,8 +240,6 @@ export class InputDatePicker {
       let newValueAsDate;
       if (Array.isArray(newValue)) {
         newValueAsDate = getValueAsDateRange(newValue);
-        this.start = newValue[0];
-        this.end = newValue[1];
       }
       else if (newValue) {
         newValueAsDate = dateFromISO(newValue);
@@ -353,8 +345,6 @@ export class InputDatePicker {
     open && this.openHandler(open);
     if (Array.isArray(this.value)) {
       this.valueAsDate = getValueAsDateRange(this.value);
-      this.start = this.value[0];
-      this.end = this.value[1];
     }
     else if (this.value) {
       try {
@@ -364,18 +354,10 @@ export class InputDatePicker {
         this.warnAboutInvalidValue(this.value);
         this.value = "";
       }
-      this.start = "";
-      this.end = "";
     }
     else if (this.range && this.valueAsDate) {
       this.setRangeValue(this.valueAsDate);
     }
-    if (this.start) {
-      this.startAsDate = dateFromISO(this.start);
-    }
-    if (this.end) {
-      this.endAsDate = setEndOfDay(dateFromISO(this.end));
-    }
     if (this.min) {
       this.minAsDate = dateFromISO(this.min);
     }
@@ -429,7 +411,7 @@ export class InputDatePicker {
         ["calendar-picker-wrapper--end"]: this.focusedInput === "end",
         [FloatingCSS.animation]: true,
         [FloatingCSS.animationActive]: this.open
-      }, ref: this.setTransitionEl }, h("calcite-date-picker", { activeDate: this.datePickerActiveDate, activeRange: this.focusedInput, endAsDate: this.endAsDate, headingLevel: this.headingLevel, max: this.max, maxAsDate: this.maxAsDate, messageOverrides: this.messageOverrides, min: this.min, minAsDate: this.minAsDate, numberingSystem: numberingSystem, onCalciteDatePickerChange: this.handleDateChange, onCalciteDatePickerRangeChange: this.handleDateRangeChange, proximitySelectionDisabled: this.proximitySelectionDisabled, range: this.range, scale: this.scale, startAsDate: this.startAsDate, tabIndex: 0, valueAsDate: this.valueAsDate }))), this.range && this.layout === "horizontal" && (h("div", { class: "horizontal-arrow-container" }, h("calcite-icon", { flipRtl: true, icon: "arrow-right", scale: "s" }))), this.range && this.layout === "vertical" && this.scale !== "s" && (h("div", { class: "vertical-arrow-container" }, h("calcite-icon", { icon: "arrow-down", scale: "s" }))), this.range && (h("div", { class: "input-wrapper", ref: this.setEndWrapper }, h("calcite-input", { class: {
+      }, ref: this.setTransitionEl }, h("calcite-date-picker", { activeDate: this.datePickerActiveDate, activeRange: this.focusedInput, headingLevel: this.headingLevel, max: this.max, maxAsDate: this.maxAsDate, messageOverrides: this.messageOverrides, min: this.min, minAsDate: this.minAsDate, numberingSystem: numberingSystem, onCalciteDatePickerChange: this.handleDateChange, onCalciteDatePickerRangeChange: this.handleDateRangeChange, proximitySelectionDisabled: this.proximitySelectionDisabled, range: this.range, scale: this.scale, tabIndex: 0, valueAsDate: this.valueAsDate }))), this.range && this.layout === "horizontal" && (h("div", { class: "horizontal-arrow-container" }, h("calcite-icon", { flipRtl: true, icon: "arrow-right", scale: "s" }))), this.range && this.layout === "vertical" && this.scale !== "s" && (h("div", { class: "vertical-arrow-container" }, h("calcite-icon", { icon: "arrow-down", scale: "s" }))), this.range && (h("div", { class: "input-wrapper", ref: this.setEndWrapper }, h("calcite-input", { class: {
         input: true,
         "border-top-color-one": this.layout === "vertical" && this.range
       }, disabled: disabled, icon: "calendar", "number-button-type": "none", numberingSystem: numberingSystem, onCalciteInputInput: this.calciteInternalInputInputHandler, onCalciteInternalInputBlur: this.calciteInternalInputBlurHandler, onCalciteInternalInputFocus: this.endInputFocus, placeholder: this.localeData?.placeholder, readOnly: readOnly, ref: this.setEndInput, scale: this.scale, type: "text" }))))), h(HiddenFormInputSlot, { component: this })));
@@ -502,12 +484,6 @@ export class InputDatePicker {
       this.localizeInputValues();
     }
   }
-  startWatcher(start) {
-    this.startAsDate = dateFromISO(start);
-  }
-  endWatcher(end) {
-    this.endAsDate = end ? setEndOfDay(dateFromISO(end)) : dateFromISO(end);
-  }
   async loadLocaleData() {
     if (!Build.isBrowser) {
       return;
@@ -520,21 +496,21 @@ export class InputDatePicker {
     this.localeData = await getLocaleData(this.effectiveLocale);
   }
   shouldFocusRangeStart() {
-    return !!(this.endAsDate &&
-      !this.startAsDate &&
-      this.focusedInput === "end" &&
-      this.startInput);
+    const startValue = this.value[0] || undefined;
+    const endValue = this.value[1] || undefined;
+    return !!(endValue && !startValue && this.focusedInput === "end" && this.startInput);
   }
   shouldFocusRangeEnd() {
-    return !!(this.startAsDate &&
-      !this.endAsDate &&
-      this.focusedInput === "start" &&
-      this.endInput);
+    const startValue = this.value[0] || undefined;
+    const endValue = this.value[1] || undefined;
+    return !!(startValue && !endValue && this.focusedInput === "start" && this.endInput);
   }
   localizeInputValues() {
-    const date = dateFromRange(this.range ? this.startAsDate : this.valueAsDate, this.minAsDate, this.maxAsDate);
+    const date = dateFromRange((this.range
+      ? (Array.isArray(this.valueAsDate) && this.valueAsDate[0]) || undefined
+      : this.valueAsDate), this.minAsDate, this.maxAsDate);
     const endDate = this.range
-      ? dateFromRange(this.endAsDate, this.minAsDate, this.maxAsDate)
+      ? dateFromRange((Array.isArray(this.valueAsDate) && this.valueAsDate[1]) || undefined, this.minAsDate, this.maxAsDate)
       : null;
     const localizedDate = date && this.formatNumerals(date.toLocaleDateString(this.effectiveLocale));
     const localizedEndDate = endDate && this.formatNumerals(endDate.toLocaleDateString(this.effectiveLocale));
@@ -677,50 +653,6 @@ export class InputDatePicker {
           "text": "The component's value as a full date object."
         }
       },
-      "startAsDate": {
-        "type": "unknown",
-        "mutable": true,
-        "complexType": {
-          "original": "Date",
-          "resolved": "Date",
-          "references": {
-            "Date": {
-              "location": "global"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "deprecated",
-              "text": "use `valueAsDate` instead."
-            }],
-          "text": "The component's start date as a full date object."
-        }
-      },
-      "endAsDate": {
-        "type": "unknown",
-        "mutable": true,
-        "complexType": {
-          "original": "Date",
-          "resolved": "Date",
-          "references": {
-            "Date": {
-              "location": "global"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "deprecated",
-              "text": "use `valueAsDate` instead."
-            }],
-          "text": "The component's end date as a full date object."
-        }
-      },
       "minAsDate": {
         "type": "unknown",
         "mutable": true,
@@ -933,46 +865,6 @@ export class InputDatePicker {
         "reflect": true,
         "defaultValue": "false"
       },
-      "start": {
-        "type": "string",
-        "mutable": true,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "deprecated",
-              "text": "use `value` instead."
-            }],
-          "text": "The component's start date."
-        },
-        "attribute": "start",
-        "reflect": true
-      },
-      "end": {
-        "type": "string",
-        "mutable": true,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "deprecated",
-              "text": "use `value` instead."
-            }],
-          "text": "The component's end date."
-        },
-        "attribute": "end",
-        "reflect": true
-      },
       "overlayPositioning": {
         "type": "string",
         "mutable": false,
@@ -1250,12 +1142,6 @@ export class InputDatePicker {
       }, {
         "propName": "focusedInput",
         "methodName": "setReferenceEl"
-      }, {
-        "propName": "start",
-        "methodName": "startWatcher"
-      }, {
-        "propName": "end",
-        "methodName": "endWatcher"
       }, {
         "propName": "effectiveLocale",
         "methodName": "loadLocaleData"

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

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 export const CSS = {
   menu: "menu-container",

package/dist/collection/components/input-message/input-message.js

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 import { Host, h } from "@stencil/core";
 import { getElementProp, setRequestedIcon } from "../../utils/dom";

package/dist/collection/components/input-message/interfaces.js

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 export var StatusIconDefaults;
 (function (StatusIconDefaults) {

package/dist/collection/components/input-number/input-number.js

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 import { h, Host } from "@stencil/core";
 import { getElementDir, getElementProp, getSlotted, isPrimaryPointerButton, setRequestedIcon } from "../../utils/dom";

package/dist/collection/components/input-number/resources.js

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 export const CSS = {
   loader: "loader",

package/dist/collection/components/input-text/input-text.js

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 import { h, Host } from "@stencil/core";
 import { getElementDir, getElementProp, getSlotted, setRequestedIcon } from "../../utils/dom";

package/dist/collection/components/input-text/resources.js

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 export const CSS = {
   loader: "loader",

package/dist/collection/components/input-time-picker/input-time-picker.js

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 import { h, Host } from "@stencil/core";
 import { guid } from "../../utils/guid";

package/dist/collection/components/label/label.js

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 import { h, Host } from "@stencil/core";
 import { labelDisconnectedEvent, labelConnectedEvent } from "../../utils/label";

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

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 export const CSS = {
   container: "container"

package/dist/collection/components/link/link.js

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 import { h, Host } from "@stencil/core";
 import { focusElement, getElementDir } from "../../utils/dom";

package/dist/collection/components/list/list.js

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 import { h } from "@stencil/core";
 import { CSS, debounceTimeout } from "./resources";

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

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 export const CSS = {
   container: "container",

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

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 import { h, Host } from "@stencil/core";
 import { SLOTS, CSS, ICONS } from "./resources";

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

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 export const CSS = {
   container: "container",

package/dist/collection/components/list-item/utils.js

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 import { Build } from "@stencil/core";
 const listItemGroupSelector = "calcite-list-item-group";

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

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 import { h, Host } from "@stencil/core";
 import { updateHostInteraction } from "../../utils/interactive";

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

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 export const CSS = {
   container: "container",

package/dist/collection/components/loader/loader.js

@@ -1,7 +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-next.690
+ * v1.0.0-next.692
  */
 import { h, Host } from "@stencil/core";
 import { guid } from "../../utils/guid";

package/dist/collection/components/modal/modal.css

@@ -93,6 +93,16 @@
 * @prop --calcite-scrim-background: The component's semi-transparent background color.
 */
 :host {
+  position: absolute;
+  inset: 0px;
+  z-index: 700;
+  display: flex;
+  opacity: 0;
+  visibility: hidden !important;
+  transition: visibility 0ms linear var(--calcite-internal-animation-timing-slow), opacity var(--calcite-internal-animation-timing-slow) cubic-bezier(0.215, 0.44, 0.42, 0.88);
+}
+
+.container {
   position: fixed;
   inset: 0px;
   z-index: 700;
@@ -187,7 +197,13 @@
   visibility: visible !important;
   transition-delay: 0ms;
 }
-:host([open]) .modal--open {
+
+:host([open]) .container {
+  opacity: 1;
+  visibility: visible !important;
+  transition-delay: 0ms;
+}
+:host([open]) .container .modal--open {
   pointer-events: auto;
   visibility: visible;
   opacity: 1;
@@ -355,7 +371,7 @@ slot[name=primary] {
     max-block-size: unset;
   }
 
-  :host([width=s][docked]) {
+  :host([width=s][docked]) .container {
     align-items: flex-end;
   }
 }
@@ -377,7 +393,7 @@ slot[name=primary] {
     max-block-size: unset;
   }
 
-  :host([width=m][docked]) {
+  :host([width=m][docked]) .container {
     align-items: flex-end;
   }
 }
@@ -399,16 +415,13 @@ slot[name=primary] {
     max-block-size: unset;
   }
 
-  :host([width=l][docked]) {
+  :host([width=l][docked]) .container {
     align-items: flex-end;
   }
 }
 /**
  * Fullscreen
  */
-:host([fullscreen]) {
-  background-color: transparent;
-}
 :host([fullscreen]) .modal {
   margin: 0px;
   block-size: 100%;
@@ -515,4 +528,14 @@ slot[name=primary] {
     margin: 0px;
     margin-block-end: 0.25rem;
   }
+}
+/**
+ * Conditional styles for when Modal is slotted in Shell
+ */
+.container.slotted-in-shell {
+  position: absolute;
+  pointer-events: auto;
+}
+.container.slotted-in-shell calcite-scrim {
+  position: absolute;
 }