@esri/calcite-components 1.0.0-next.602 → 1.0.0-next.604

package/dist/esm/calcite-combobox_3.entry.js

@@ -1,21 +1,21 @@
 /*!
  * 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.602
+ * v1.0.0-next.604
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-d9f44f88.js';
-import { f as filter } from './filter-36efc477.js';
-import { d as defaultMenuPlacement, f as filterComputedPlacements, c as connectFloatingUI, p as positionFloatingUI, a as disconnectFloatingUI, r as repositionDebounceTimeout, F as FloatingCSS } from './floating-ui-ef2255b3.js';
-import { g as guid } from './guid-b1d46039.js';
-import { n as nodeListToArray, t as toAriaBoolean, e as getElementProp, g as getSlotted } from './dom-10a58495.js';
-import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-5b9ab9cf.js';
-import { s as submitForm, c as connectForm, a as afterConnectDefaultValueSet, d as disconnectForm, H as HiddenFormInputSlot } from './form-d994f68b.js';
-import { c as createObserver } from './observers-b4b363d9.js';
-import { u as updateHostInteraction } from './interactive-3a6eeea6.js';
-import { c as connectOpenCloseComponent, d as disconnectOpenCloseComponent } from './openCloseComponent-e3bc2607.js';
-import { d as debounce } from './debounce-231ab717.js';
-import { c as connectConditionalSlotComponent, d as disconnectConditionalSlotComponent } from './conditionalSlot-143bb096.js';
-import './resources-0ec049ad.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-b452034d.js';
+import { f as filter } from './filter-d22f4d94.js';
+import { d as defaultMenuPlacement, f as filterComputedPlacements, c as connectFloatingUI, p as positionFloatingUI, a as disconnectFloatingUI, r as repositionDebounceTimeout, F as FloatingCSS } from './floating-ui-4dec1723.js';
+import { g as guid } from './guid-2563b904.js';
+import { n as nodeListToArray, i as isPrimaryPointerButton, t as toAriaBoolean, e as getElementProp, g as getSlotted } from './dom-e368d23b.js';
+import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-c63a5725.js';
+import { s as submitForm, c as connectForm, a as afterConnectDefaultValueSet, d as disconnectForm, H as HiddenFormInputSlot } from './form-9f1caa56.js';
+import { c as createObserver } from './observers-73b4a955.js';
+import { u as updateHostInteraction } from './interactive-7be16f70.js';
+import { c as connectOpenCloseComponent, d as disconnectOpenCloseComponent } from './openCloseComponent-3adb36f4.js';
+import { d as debounce } from './debounce-da00fd2e.js';
+import { c as connectConditionalSlotComponent, d as disconnectConditionalSlotComponent } from './conditionalSlot-8139b6c7.js';
+import './resources-5c3e406b.js';
 
 const ComboboxItem$1 = "CALCITE-COMBOBOX-ITEM";
 const ComboboxItemGroup$1 = "CALCITE-COMBOBOX-ITEM-GROUP";
@@ -457,6 +457,9 @@ const Combobox = class {
   //
   //--------------------------------------------------------------------------
   documentClickHandler(event) {
+    if (!isPrimaryPointerButton(event)) {
+      return;
+    }
     this.setInactiveIfNotContained(event);
   }
   calciteComboboxItemChangeHandler(event) {

package/dist/esm/calcite-date-picker_4.entry.js

@@ -1,18 +1,18 @@
 /*!
  * 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.602
+ * v1.0.0-next.604
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement, F as Fragment } from './index-d9f44f88.js';
-import { T as TEXT, f as getDaysDiff, d as dateToISO, a as dateFromISO, g as getValueAsDateRange, b as dateFromRange, c as getLocaleData, s as setEndOfDay, H as HEADING_LEVEL, e as sameDate, i as inRange, h as getOrder, n as nextMonth, j as prevMonth, l as localizeNumber, k as parseNumber } from './resources-906a203c.js';
-import { c as connectLocalized, d as disconnectLocalized } from './locale-c3b649b7.js';
-import { a as getElementDir } from './dom-10a58495.js';
-import { C as CSS_UTILITY } from './resources-0ec049ad.js';
-import { u as updateHostInteraction } from './interactive-3a6eeea6.js';
-import { i as isActivationKey } from './key-7f10e5ae.js';
-import { H as Heading } from './Heading-fc5adcab.js';
-import './observers-b4b363d9.js';
-import './guid-b1d46039.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement, F as Fragment } from './index-b452034d.js';
+import { T as TEXT, f as getDaysDiff, d as dateToISO, a as dateFromISO, g as getValueAsDateRange, b as dateFromRange, c as getLocaleData, s as setEndOfDay, H as HEADING_LEVEL, e as sameDate, i as inRange, h as getOrder, n as nextMonth, j as prevMonth, l as localizeNumber, k as parseNumber } from './resources-a4a87dee.js';
+import { c as connectLocalized, d as disconnectLocalized } from './locale-6d23910f.js';
+import { a as getElementDir } from './dom-e368d23b.js';
+import { C as CSS_UTILITY } from './resources-5c3e406b.js';
+import { u as updateHostInteraction } from './interactive-7be16f70.js';
+import { i as isActivationKey } from './key-76f8b045.js';
+import { H as Heading } from './Heading-40531cc4.js';
+import './observers-73b4a955.js';
+import './guid-2563b904.js';
 
 const datePickerCss = "@keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in-down{0%{opacity:0;transform:translate3D(0, -5px, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;transform:translate3D(0, 5px, 0)}100%{opacity:1;transform:translate3D(0, 0, 0)}}@keyframes in-scale{0%{opacity:0;transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;transform:scale3D(1, 1, 1)}}:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}.calcite-animate{opacity:0;animation-fill-mode:both;animation-duration:var(--calcite-animation-timing)}.calcite-animate__in{animation-name:in}.calcite-animate__in-down{animation-name:in-down}.calcite-animate__in-up{animation-name:in-up}.calcite-animate__in-scale{animation-name:in-scale}@media (prefers-reduced-motion: reduce){:root{--calcite-internal-duration-factor:0.01}}:root{--calcite-floating-ui-transition:var(--calcite-animation-timing)}:host([hidden]){display:none}:host{position:relative;display:inline-block;inline-size:100%;overflow:visible;border-radius:0px;border-width:1px;border-style:solid;border-color:var(--calcite-ui-border-2);background-color:var(--calcite-ui-foreground-1);vertical-align:top}:host([scale=s]){max-inline-size:216px}:host([scale=m]){max-inline-size:286px}:host([scale=l]){max-inline-size:398px}";
 

package/dist/esm/calcite-dropdown_3.entry.js

@@ -1,18 +1,18 @@
 /*!
  * 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.602
+ * v1.0.0-next.604
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-d9f44f88.js';
-import { t as toAriaBoolean, f as focusElement, e as getElementProp } from './dom-10a58495.js';
-import { d as defaultMenuPlacement, f as filterComputedPlacements, c as connectFloatingUI, a as disconnectFloatingUI, F as FloatingCSS, p as positionFloatingUI, r as repositionDebounceTimeout } from './floating-ui-ef2255b3.js';
-import { c as createObserver } from './observers-b4b363d9.js';
-import { u as updateHostInteraction } from './interactive-3a6eeea6.js';
-import { c as connectOpenCloseComponent, d as disconnectOpenCloseComponent } from './openCloseComponent-e3bc2607.js';
-import { g as guid } from './guid-b1d46039.js';
-import { i as isActivationKey } from './key-7f10e5ae.js';
-import { d as debounce } from './debounce-231ab717.js';
-import './resources-0ec049ad.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-b452034d.js';
+import { t as toAriaBoolean, i as isPrimaryPointerButton, f as focusElement, e as getElementProp } from './dom-e368d23b.js';
+import { d as defaultMenuPlacement, f as filterComputedPlacements, c as connectFloatingUI, a as disconnectFloatingUI, F as FloatingCSS, p as positionFloatingUI, r as repositionDebounceTimeout } from './floating-ui-4dec1723.js';
+import { c as createObserver } from './observers-73b4a955.js';
+import { u as updateHostInteraction } from './interactive-7be16f70.js';
+import { c as connectOpenCloseComponent, d as disconnectOpenCloseComponent } from './openCloseComponent-3adb36f4.js';
+import { g as guid } from './guid-2563b904.js';
+import { i as isActivationKey } from './key-76f8b045.js';
+import { d as debounce } from './debounce-da00fd2e.js';
+import './resources-5c3e406b.js';
 
 const SLOTS = {
   dropdownTrigger: "dropdown-trigger"
@@ -297,7 +297,7 @@ const Dropdown = class {
     });
   }
   closeCalciteDropdownOnClick(event) {
-    if (!this.open || event.composedPath().includes(this.el)) {
+    if (!isPrimaryPointerButton(event) || !this.open || event.composedPath().includes(this.el)) {
       return;
     }
     this.closeCalciteDropdown(false);

package/dist/esm/calcite-fab.entry.js

@@ -1,13 +1,13 @@
 /*!
  * 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.602
+ * v1.0.0-next.604
  */
-import { r as registerInstance, h, g as getElement } from './index-d9f44f88.js';
-import { f as focusElement } from './dom-10a58495.js';
-import { u as updateHostInteraction } from './interactive-3a6eeea6.js';
-import './resources-0ec049ad.js';
-import './guid-b1d46039.js';
+import { r as registerInstance, h, g as getElement } from './index-b452034d.js';
+import { f as focusElement } from './dom-e368d23b.js';
+import { u as updateHostInteraction } from './interactive-7be16f70.js';
+import './resources-5c3e406b.js';
+import './guid-2563b904.js';
 
 const CSS = {
   button: "button"

package/dist/esm/calcite-filter.entry.js

@@ -1,15 +1,15 @@
 /*!
  * 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.602
+ * v1.0.0-next.604
  */
-import { r as registerInstance, c as createEvent, h, F as Fragment, g as getElement } from './index-d9f44f88.js';
-import { f as focusElement } from './dom-10a58495.js';
-import { u as updateHostInteraction } from './interactive-3a6eeea6.js';
-import { f as filter } from './filter-36efc477.js';
-import { d as debounce } from './debounce-231ab717.js';
-import './resources-0ec049ad.js';
-import './guid-b1d46039.js';
+import { r as registerInstance, c as createEvent, h, F as Fragment, g as getElement } from './index-b452034d.js';
+import { f as focusElement } from './dom-e368d23b.js';
+import { u as updateHostInteraction } from './interactive-7be16f70.js';
+import { f as filter } from './filter-d22f4d94.js';
+import { d as debounce } from './debounce-da00fd2e.js';
+import './resources-5c3e406b.js';
+import './guid-2563b904.js';
 
 const CSS = {
   container: "container",

package/dist/esm/calcite-flow-item.entry.js

@@ -1,14 +1,14 @@
 /*!
  * 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.602
+ * v1.0.0-next.604
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-d9f44f88.js';
-import { a as getElementDir } from './dom-10a58495.js';
-import { S as SLOTS$1 } from './resources-9d1d540d.js';
-import { u as updateHostInteraction } from './interactive-3a6eeea6.js';
-import './resources-0ec049ad.js';
-import './guid-b1d46039.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-b452034d.js';
+import { a as getElementDir } from './dom-e368d23b.js';
+import { S as SLOTS$1 } from './resources-b67102fc.js';
+import { u as updateHostInteraction } from './interactive-7be16f70.js';
+import './resources-5c3e406b.js';
+import './guid-2563b904.js';
 
 const CSS = {
   backButton: "back-button"

package/dist/esm/calcite-flow.entry.js

@@ -1,10 +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-next.602
+ * v1.0.0-next.604
  */
-import { r as registerInstance, h, g as getElement } from './index-d9f44f88.js';
-import { c as createObserver } from './observers-b4b363d9.js';
+import { r as registerInstance, h, g as getElement } from './index-b452034d.js';
+import { c as createObserver } from './observers-73b4a955.js';
 
 const CSS = {
   frame: "frame",

package/dist/esm/calcite-graph_2.entry.js

@@ -1,19 +1,19 @@
 /*!
  * 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.602
+ * v1.0.0-next.604
  */
-import { r as registerInstance, h, g as getElement, f as forceUpdate, c as createEvent, H as Host } from './index-d9f44f88.js';
-import { g as guid } from './guid-b1d46039.js';
-import { c as createObserver } from './observers-b4b363d9.js';
-import { j as intersects } from './dom-10a58495.js';
-import { d as decimalPlaces, c as clamp } from './math-4149b938.js';
-import { c as connectLabel, d as disconnectLabel } from './label-5b9ab9cf.js';
-import { c as connectForm, d as disconnectForm, a as afterConnectDefaultValueSet, H as HiddenFormInputSlot } from './form-d994f68b.js';
-import { u as updateHostInteraction } from './interactive-3a6eeea6.js';
-import { i as isActivationKey } from './key-7f10e5ae.js';
-import { n as numberStringFormatter, c as connectLocalized, d as disconnectLocalized } from './locale-c3b649b7.js';
-import './resources-0ec049ad.js';
+import { r as registerInstance, h, g as getElement, f as forceUpdate, c as createEvent, H as Host } from './index-b452034d.js';
+import { g as guid } from './guid-2563b904.js';
+import { c as createObserver } from './observers-73b4a955.js';
+import { i as isPrimaryPointerButton, k as intersects } from './dom-e368d23b.js';
+import { d as decimalPlaces, c as clamp } from './math-babff37a.js';
+import { c as connectLabel, d as disconnectLabel } from './label-c63a5725.js';
+import { c as connectForm, d as disconnectForm, a as afterConnectDefaultValueSet, H as HiddenFormInputSlot } from './form-9f1caa56.js';
+import { u as updateHostInteraction } from './interactive-7be16f70.js';
+import { i as isActivationKey } from './key-76f8b045.js';
+import { n as numberStringFormatter, c as connectLocalized, d as disconnectLocalized } from './locale-6d23910f.js';
+import './resources-5c3e406b.js';
 
 /**
  * Calculate slope of the tangents
@@ -293,9 +293,9 @@ const Slider = class {
      *  Specifies the size of the component.
      */
     this.scale = "m";
+    this.activeProp = "value";
     this.guid = `calcite-slider-${guid()}`;
     this.effectiveLocale = "";
-    this.activeProp = "value";
     this.minMaxValueRange = null;
     this.minValueDragRange = null;
     this.maxValueDragRange = null;
@@ -326,6 +326,12 @@ const Slider = class {
         }
       }
     };
+    this.pointerUpDragEnd = (event) => {
+      if (!isPrimaryPointerButton(event)) {
+        return;
+      }
+      this.dragEnd(event);
+    };
     this.dragEnd = (event) => {
       this.removeDragListeners();
       this.focusActiveHandle(event.clientX);
@@ -436,73 +442,73 @@ const Slider = class {
         thumb: true,
         "thumb--value": true,
         "thumb--active": this.lastDragProp !== "minMaxValue" && this.dragProp === maxProp
-      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = maxProp), onPointerDown: () => this.dragStart(maxProp), ref: (el) => (this.maxHandle = el), role: "slider", style: { right: rightThumbOffset }, tabIndex: 0 }, h("div", { class: "handle" })));
+      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = maxProp), onPointerDown: (event) => this.pointerDownDragStart(event, maxProp), ref: (el) => (this.maxHandle = el), role: "slider", style: { right: rightThumbOffset }, tabIndex: 0 }, h("div", { class: "handle" })));
     const labeledHandle = (h("div", { "aria-disabled": this.disabled, "aria-label": valueIsRange ? this.maxLabel : this.minLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": value, class: {
         thumb: true,
         "thumb--value": true,
         "thumb--active": this.lastDragProp !== "minMaxValue" && this.dragProp === maxProp
-      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = maxProp), onPointerDown: () => this.dragStart(maxProp), ref: (el) => (this.maxHandle = el), role: "slider", style: { right: rightThumbOffset }, tabIndex: 0 }, h("span", { "aria-hidden": "true", class: handleLabelValueClasses }, displayedValue), h("span", { "aria-hidden": "true", class: `${handleLabelValueClasses} static` }, displayedValue), h("span", { "aria-hidden": "true", class: `${handleLabelValueClasses} transformed` }, displayedValue), h("div", { class: "handle" })));
+      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = maxProp), onPointerDown: (event) => this.pointerDownDragStart(event, maxProp), ref: (el) => (this.maxHandle = el), role: "slider", style: { right: rightThumbOffset }, tabIndex: 0 }, h("span", { "aria-hidden": "true", class: handleLabelValueClasses }, displayedValue), h("span", { "aria-hidden": "true", class: `${handleLabelValueClasses} static` }, displayedValue), h("span", { "aria-hidden": "true", class: `${handleLabelValueClasses} transformed` }, displayedValue), h("div", { class: "handle" })));
     const histogramLabeledHandle = (h("div", { "aria-disabled": this.disabled, "aria-label": valueIsRange ? this.maxLabel : this.minLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": value, class: {
         thumb: true,
         "thumb--value": true,
         "thumb--active": this.lastDragProp !== "minMaxValue" && this.dragProp === maxProp
-      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = maxProp), onPointerDown: () => this.dragStart(maxProp), ref: (el) => (this.maxHandle = el), role: "slider", style: { right: rightThumbOffset }, tabIndex: 0 }, h("div", { class: "handle" }), h("span", { "aria-hidden": "true", class: handleLabelValueClasses }, displayedValue), h("span", { "aria-hidden": "true", class: `${handleLabelValueClasses} static` }, displayedValue), h("span", { "aria-hidden": "true", class: `${handleLabelValueClasses} transformed` }, displayedValue)));
+      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = maxProp), onPointerDown: (event) => this.pointerDownDragStart(event, maxProp), ref: (el) => (this.maxHandle = el), role: "slider", style: { right: rightThumbOffset }, tabIndex: 0 }, h("div", { class: "handle" }), h("span", { "aria-hidden": "true", class: handleLabelValueClasses }, displayedValue), h("span", { "aria-hidden": "true", class: `${handleLabelValueClasses} static` }, displayedValue), h("span", { "aria-hidden": "true", class: `${handleLabelValueClasses} transformed` }, displayedValue)));
     const preciseHandle = (h("div", { "aria-disabled": this.disabled, "aria-label": valueIsRange ? this.maxLabel : this.minLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": value, class: {
         thumb: true,
         "thumb--value": true,
         "thumb--active": this.lastDragProp !== "minMaxValue" && this.dragProp === maxProp,
         "thumb--precise": true
-      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = maxProp), onPointerDown: () => this.dragStart(maxProp), ref: (el) => (this.maxHandle = el), role: "slider", style: { right: rightThumbOffset }, tabIndex: 0 }, h("div", { class: "handle" }), h("div", { class: "handle-extension" })));
+      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = maxProp), onPointerDown: (event) => this.pointerDownDragStart(event, maxProp), ref: (el) => (this.maxHandle = el), role: "slider", style: { right: rightThumbOffset }, tabIndex: 0 }, h("div", { class: "handle" }), h("div", { class: "handle-extension" })));
     const histogramPreciseHandle = (h("div", { "aria-disabled": this.disabled, "aria-label": valueIsRange ? this.maxLabel : this.minLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": value, class: {
         thumb: true,
         "thumb--value": true,
         "thumb--active": this.lastDragProp !== "minMaxValue" && this.dragProp === maxProp,
         "thumb--precise": true
-      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = maxProp), onPointerDown: () => this.dragStart(maxProp), ref: (el) => (this.maxHandle = el), role: "slider", style: { right: rightThumbOffset }, tabIndex: 0 }, h("div", { class: "handle-extension" }), h("div", { class: "handle" })));
+      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = maxProp), onPointerDown: (event) => this.pointerDownDragStart(event, maxProp), ref: (el) => (this.maxHandle = el), role: "slider", style: { right: rightThumbOffset }, tabIndex: 0 }, h("div", { class: "handle-extension" }), h("div", { class: "handle" })));
     const labeledPreciseHandle = (h("div", { "aria-disabled": this.disabled, "aria-label": valueIsRange ? this.maxLabel : this.minLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": value, class: {
         thumb: true,
         "thumb--value": true,
         "thumb--active": this.lastDragProp !== "minMaxValue" && this.dragProp === maxProp,
         "thumb--precise": true
-      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = maxProp), onPointerDown: () => this.dragStart(maxProp), ref: (el) => (this.maxHandle = el), role: "slider", style: { right: rightThumbOffset }, tabIndex: 0 }, h("span", { "aria-hidden": "true", class: handleLabelValueClasses }, displayedValue), h("span", { "aria-hidden": "true", class: `${handleLabelValueClasses} static` }, displayedValue), h("span", { "aria-hidden": "true", class: `${handleLabelValueClasses} transformed` }, displayedValue), h("div", { class: "handle" }), h("div", { class: "handle-extension" })));
+      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = maxProp), onPointerDown: (event) => this.pointerDownDragStart(event, maxProp), ref: (el) => (this.maxHandle = el), role: "slider", style: { right: rightThumbOffset }, tabIndex: 0 }, h("span", { "aria-hidden": "true", class: handleLabelValueClasses }, displayedValue), h("span", { "aria-hidden": "true", class: `${handleLabelValueClasses} static` }, displayedValue), h("span", { "aria-hidden": "true", class: `${handleLabelValueClasses} transformed` }, displayedValue), h("div", { class: "handle" }), h("div", { class: "handle-extension" })));
     const histogramLabeledPreciseHandle = (h("div", { "aria-disabled": this.disabled, "aria-label": valueIsRange ? this.maxLabel : this.minLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": value, class: {
         thumb: true,
         "thumb--value": true,
         "thumb--active": this.lastDragProp !== "minMaxValue" && this.dragProp === maxProp,
         "thumb--precise": true
-      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = maxProp), onPointerDown: () => this.dragStart(maxProp), ref: (el) => (this.maxHandle = el), role: "slider", style: { right: rightThumbOffset }, tabIndex: 0 }, h("div", { class: "handle-extension" }), h("div", { class: "handle" }), h("span", { "aria-hidden": "true", class: handleLabelValueClasses }, displayedValue), h("span", { "aria-hidden": "true", class: `${handleLabelValueClasses} static` }, displayedValue), h("span", { "aria-hidden": "true", class: `${handleLabelValueClasses} transformed` }, displayedValue)));
+      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = maxProp), onPointerDown: (event) => this.pointerDownDragStart(event, maxProp), ref: (el) => (this.maxHandle = el), role: "slider", style: { right: rightThumbOffset }, tabIndex: 0 }, h("div", { class: "handle-extension" }), h("div", { class: "handle" }), h("span", { "aria-hidden": "true", class: handleLabelValueClasses }, displayedValue), h("span", { "aria-hidden": "true", class: `${handleLabelValueClasses} static` }, displayedValue), h("span", { "aria-hidden": "true", class: `${handleLabelValueClasses} transformed` }, displayedValue)));
     const minHandle = (h("div", { "aria-disabled": this.disabled, "aria-label": this.minLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": this.minValue, class: {
         thumb: true,
         "thumb--minValue": true,
         "thumb--active": this.dragProp === "minValue"
-      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = "minValue"), onPointerDown: () => this.dragStart("minValue"), ref: (el) => (this.minHandle = el), role: "slider", style: { left: leftThumbOffset }, tabIndex: 0 }, h("div", { class: "handle" })));
+      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = "minValue"), onPointerDown: (event) => this.pointerDownDragStart(event, "minValue"), ref: (el) => (this.minHandle = el), role: "slider", style: { left: leftThumbOffset }, tabIndex: 0 }, h("div", { class: "handle" })));
     const minLabeledHandle = (h("div", { "aria-disabled": this.disabled, "aria-label": this.minLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": this.minValue, class: {
         thumb: true,
         "thumb--minValue": true,
         "thumb--active": this.dragProp === "minValue"
-      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = "minValue"), onPointerDown: () => this.dragStart("minValue"), ref: (el) => (this.minHandle = el), role: "slider", style: { left: leftThumbOffset }, tabIndex: 0 }, h("span", { "aria-hidden": "true", class: handleLabelMinValueClasses }, displayedMinValue), h("span", { "aria-hidden": "true", class: `${handleLabelMinValueClasses} static` }, displayedMinValue), h("span", { "aria-hidden": "true", class: `${handleLabelMinValueClasses} transformed` }, displayedMinValue), h("div", { class: "handle" })));
+      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = "minValue"), onPointerDown: (event) => this.pointerDownDragStart(event, "minValue"), ref: (el) => (this.minHandle = el), role: "slider", style: { left: leftThumbOffset }, tabIndex: 0 }, h("span", { "aria-hidden": "true", class: handleLabelMinValueClasses }, displayedMinValue), h("span", { "aria-hidden": "true", class: `${handleLabelMinValueClasses} static` }, displayedMinValue), h("span", { "aria-hidden": "true", class: `${handleLabelMinValueClasses} transformed` }, displayedMinValue), h("div", { class: "handle" })));
     const minHistogramLabeledHandle = (h("div", { "aria-disabled": this.disabled, "aria-label": this.minLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": this.minValue, class: {
         thumb: true,
         "thumb--minValue": true,
         "thumb--active": this.dragProp === "minValue"
-      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = "minValue"), onPointerDown: () => this.dragStart("minValue"), ref: (el) => (this.minHandle = el), role: "slider", style: { left: leftThumbOffset }, tabIndex: 0 }, h("div", { class: "handle" }), h("span", { "aria-hidden": "true", class: handleLabelMinValueClasses }, displayedMinValue), h("span", { "aria-hidden": "true", class: `${handleLabelMinValueClasses} static` }, displayedMinValue), h("span", { "aria-hidden": "true", class: `${handleLabelMinValueClasses} transformed` }, displayedMinValue)));
+      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = "minValue"), onPointerDown: (event) => this.pointerDownDragStart(event, "minValue"), ref: (el) => (this.minHandle = el), role: "slider", style: { left: leftThumbOffset }, tabIndex: 0 }, h("div", { class: "handle" }), h("span", { "aria-hidden": "true", class: handleLabelMinValueClasses }, displayedMinValue), h("span", { "aria-hidden": "true", class: `${handleLabelMinValueClasses} static` }, displayedMinValue), h("span", { "aria-hidden": "true", class: `${handleLabelMinValueClasses} transformed` }, displayedMinValue)));
     const minPreciseHandle = (h("div", { "aria-disabled": this.disabled, "aria-label": this.minLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": this.minValue, class: {
         thumb: true,
         "thumb--minValue": true,
         "thumb--active": this.dragProp === "minValue",
         "thumb--precise": true
-      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = "minValue"), onPointerDown: () => this.dragStart("minValue"), ref: (el) => (this.minHandle = el), role: "slider", style: { left: leftThumbOffset }, tabIndex: 0 }, h("div", { class: "handle-extension" }), h("div", { class: "handle" })));
+      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = "minValue"), onPointerDown: (event) => this.pointerDownDragStart(event, "minValue"), ref: (el) => (this.minHandle = el), role: "slider", style: { left: leftThumbOffset }, tabIndex: 0 }, h("div", { class: "handle-extension" }), h("div", { class: "handle" })));
     const minLabeledPreciseHandle = (h("div", { "aria-disabled": this.disabled, "aria-label": this.minLabel, "aria-orientation": "horizontal", "aria-valuemax": this.max, "aria-valuemin": this.min, "aria-valuenow": this.minValue, class: {
         thumb: true,
         "thumb--minValue": true,
         "thumb--active": this.dragProp === "minValue",
         "thumb--precise": true
-      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = "minValue"), onPointerDown: () => this.dragStart("minValue"), ref: (el) => (this.minHandle = el), role: "slider", style: { left: leftThumbOffset }, tabIndex: 0 }, h("div", { class: "handle-extension" }), h("div", { class: "handle" }), h("span", { "aria-hidden": "true", class: handleLabelMinValueClasses }, displayedMinValue), h("span", { "aria-hidden": "true", class: `${handleLabelMinValueClasses} static` }, displayedMinValue), h("span", { "aria-hidden": "true", class: `${handleLabelMinValueClasses} transformed` }, displayedMinValue)));
+      }, onBlur: () => (this.activeProp = null), onFocus: () => (this.activeProp = "minValue"), onPointerDown: (event) => this.pointerDownDragStart(event, "minValue"), ref: (el) => (this.minHandle = el), role: "slider", style: { left: leftThumbOffset }, tabIndex: 0 }, h("div", { class: "handle-extension" }), h("div", { class: "handle" }), h("span", { "aria-hidden": "true", class: handleLabelMinValueClasses }, displayedMinValue), h("span", { "aria-hidden": "true", class: `${handleLabelMinValueClasses} static` }, displayedMinValue), h("span", { "aria-hidden": "true", class: `${handleLabelMinValueClasses} transformed` }, displayedMinValue)));
     return (h(Host, { id: id, onTouchStart: this.handleTouchStart }, h("div", { class: {
         ["container"]: true,
         ["container--range"]: valueIsRange,
         [`scale--${this.scale}`]: true
-      } }, this.renderGraph(), h("div", { class: "track", ref: this.storeTrackRef }, h("div", { class: "track__range", onPointerDown: () => this.dragStart("minMaxValue"), style: {
+      } }, this.renderGraph(), h("div", { class: "track", ref: this.storeTrackRef }, h("div", { class: "track__range", onPointerDown: (event) => this.pointerDownDragStart(event, "minMaxValue"), style: {
         left: `${mirror ? 100 - maxInterval : minInterval}%`,
         right: `${mirror ? minInterval : 100 - maxInterval}%`
       } }), h("div", { class: "ticks" }, this.tickValues.map((tick) => {
@@ -641,8 +647,10 @@ const Slider = class {
     this.setValue(activeProp, this.clamp(fixedDecimalAdjustment, activeProp));
   }
   pointerDownHandler(event) {
+    if (!isPrimaryPointerButton(event)) {
+      return;
+    }
     const x = event.clientX || event.pageX;
-    this.focusActiveHandle(x);
     const position = this.translate(x);
     let prop = "value";
     if (isRange(this.value)) {
@@ -661,6 +669,7 @@ const Slider = class {
     if (!isThumbActive) {
       this.setValue(prop, this.clamp(position, prop));
     }
+    this.focusActiveHandle(x);
   }
   handleTouchStart(event) {
     // needed to prevent extra click at the end of a handle drag
@@ -715,12 +724,18 @@ const Slider = class {
     }
     return ticks;
   }
+  pointerDownDragStart(event, prop) {
+    if (!isPrimaryPointerButton(event)) {
+      return;
+    }
+    this.dragStart(prop);
+  }
   dragStart(prop) {
     this.dragProp = prop;
     this.lastDragProp = this.dragProp;
     this.activeProp = prop;
     document.addEventListener("pointermove", this.dragUpdate);
-    document.addEventListener("pointerup", this.dragEnd);
+    document.addEventListener("pointerup", this.pointerUpDragEnd);
     document.addEventListener("pointercancel", this.dragEnd);
   }
   focusActiveHandle(valueX) {
@@ -729,6 +744,7 @@ const Slider = class {
         this.minHandle.focus();
         break;
       case "maxValue":
+      case "value":
         this.maxHandle.focus();
         break;
       case "minMaxValue":
@@ -745,7 +761,7 @@ const Slider = class {
   }
   removeDragListeners() {
     document.removeEventListener("pointermove", this.dragUpdate);
-    document.removeEventListener("pointerup", this.dragEnd);
+    document.removeEventListener("pointerup", this.pointerUpDragEnd);
     document.removeEventListener("pointercancel", this.dragEnd);
   }
   /**

package/dist/esm/calcite-handle.entry.js

@@ -1,12 +1,12 @@
 /*!
  * 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.602
+ * v1.0.0-next.604
  */
-import { r as registerInstance, c as createEvent, h, g as getElement } from './index-d9f44f88.js';
-import { t as toAriaBoolean } from './dom-10a58495.js';
-import './resources-0ec049ad.js';
-import './guid-b1d46039.js';
+import { r as registerInstance, c as createEvent, h, g as getElement } from './index-b452034d.js';
+import { t as toAriaBoolean } from './dom-e368d23b.js';
+import './resources-5c3e406b.js';
+import './guid-2563b904.js';
 
 const CSS = {
   handle: "handle",

package/dist/esm/calcite-icon.entry.js

@@ -1,13 +1,13 @@
 /*!
  * 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.602
+ * v1.0.0-next.604
  */
-import { a as getAssetPath, r as registerInstance, h, H as Host, g as getElement } from './index-d9f44f88.js';
-import { a as getElementDir, t as toAriaBoolean } from './dom-10a58495.js';
-import { c as createObserver } from './observers-b4b363d9.js';
-import './resources-0ec049ad.js';
-import './guid-b1d46039.js';
+import { a as getAssetPath, r as registerInstance, h, H as Host, g as getElement } from './index-b452034d.js';
+import { a as getElementDir, t as toAriaBoolean } from './dom-e368d23b.js';
+import { c as createObserver } from './observers-73b4a955.js';
+import './resources-5c3e406b.js';
+import './guid-2563b904.js';
 
 const CSS = {
   icon: "icon",

package/dist/esm/calcite-inline-editable.entry.js

@@ -1,15 +1,15 @@
 /*!
  * 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.602
+ * v1.0.0-next.604
  */
-import { r as registerInstance, c as createEvent, h, g as getElement } from './index-d9f44f88.js';
-import { e as getElementProp, g as getSlotted } from './dom-10a58495.js';
-import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-5b9ab9cf.js';
-import { c as createObserver } from './observers-b4b363d9.js';
-import { u as updateHostInteraction } from './interactive-3a6eeea6.js';
-import './resources-0ec049ad.js';
-import './guid-b1d46039.js';
+import { r as registerInstance, c as createEvent, h, g as getElement } from './index-b452034d.js';
+import { e as getElementProp, g as getSlotted } from './dom-e368d23b.js';
+import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-c63a5725.js';
+import { c as createObserver } from './observers-73b4a955.js';
+import { u as updateHostInteraction } from './interactive-7be16f70.js';
+import './resources-5c3e406b.js';
+import './guid-2563b904.js';
 
 const CSS = {
   wrapper: "wrapper",

package/dist/esm/calcite-input-date-picker.entry.js

@@ -1,22 +1,22 @@
 /*!
  * 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.602
+ * v1.0.0-next.604
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-d9f44f88.js';
-import { T as TEXT, d as dateToISO, g as getValueAsDateRange, a as dateFromISO, s as setEndOfDay, b as dateFromRange, c as getLocaleData, e as sameDate, p as parseDateString, i as inRange } from './resources-906a203c.js';
-import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-5b9ab9cf.js';
-import { s as submitForm, c as connectForm, d as disconnectForm, H as HiddenFormInputSlot } from './form-d994f68b.js';
-import { d as defaultMenuPlacement, f as filterComputedPlacements, c as connectFloatingUI, p as positionFloatingUI, a as disconnectFloatingUI, F as FloatingCSS, r as repositionDebounceTimeout } from './floating-ui-ef2255b3.js';
-import { u as updateHostInteraction } from './interactive-3a6eeea6.js';
-import { t as toAriaBoolean } from './dom-10a58495.js';
-import { c as connectOpenCloseComponent, d as disconnectOpenCloseComponent } from './openCloseComponent-e3bc2607.js';
-import { c as connectLocalized, d as disconnectLocalized } from './locale-c3b649b7.js';
-import { d as debounce } from './debounce-231ab717.js';
-import './resources-0ec049ad.js';
-import './guid-b1d46039.js';
-import './key-7f10e5ae.js';
-import './observers-b4b363d9.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-b452034d.js';
+import { T as TEXT, d as dateToISO, g as getValueAsDateRange, a as dateFromISO, s as setEndOfDay, b as dateFromRange, c as getLocaleData, e as sameDate, p as parseDateString, i as inRange } from './resources-a4a87dee.js';
+import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-c63a5725.js';
+import { s as submitForm, c as connectForm, d as disconnectForm, H as HiddenFormInputSlot } from './form-9f1caa56.js';
+import { d as defaultMenuPlacement, f as filterComputedPlacements, c as connectFloatingUI, p as positionFloatingUI, a as disconnectFloatingUI, F as FloatingCSS, r as repositionDebounceTimeout } from './floating-ui-4dec1723.js';
+import { u as updateHostInteraction } from './interactive-7be16f70.js';
+import { t as toAriaBoolean } from './dom-e368d23b.js';
+import { c as connectOpenCloseComponent, d as disconnectOpenCloseComponent } from './openCloseComponent-3adb36f4.js';
+import { c as connectLocalized, d as disconnectLocalized } from './locale-6d23910f.js';
+import { d as debounce } from './debounce-da00fd2e.js';
+import './resources-5c3e406b.js';
+import './guid-2563b904.js';
+import './key-76f8b045.js';
+import './observers-73b4a955.js';
 
 const CSS = {
   menu: "menu-container",

package/dist/esm/calcite-input-message.entry.js

@@ -1,12 +1,12 @@
 /*!
  * 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.602
+ * v1.0.0-next.604
  */
-import { r as registerInstance, h, H as Host, g as getElement } from './index-d9f44f88.js';
-import { s as setRequestedIcon, e as getElementProp } from './dom-10a58495.js';
-import './resources-0ec049ad.js';
-import './guid-b1d46039.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-b452034d.js';
+import { s as setRequestedIcon, e as getElementProp } from './dom-e368d23b.js';
+import './resources-5c3e406b.js';
+import './guid-2563b904.js';
 
 var StatusIconDefaults;
 (function (StatusIconDefaults) {

package/dist/esm/calcite-input-number.entry.js

@@ -1,19 +1,19 @@
 /*!
  * 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.602
+ * v1.0.0-next.604
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-d9f44f88.js';
-import { g as getSlotted, s as setRequestedIcon, e as getElementProp, a as getElementDir } from './dom-10a58495.js';
-import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-5b9ab9cf.js';
-import { s as submitForm, c as connectForm, d as disconnectForm, H as HiddenFormInputSlot } from './form-d994f68b.js';
-import { n as numberStringFormatter, i as isValidNumber, p as parseNumberString, s as sanitizeNumberString, a as defaultNumberingSystem, u as updateEffectiveLocale, c as connectLocalized, d as disconnectLocalized } from './locale-c3b649b7.js';
-import { n as numberKeys } from './key-7f10e5ae.js';
-import { T as TEXT$1, C as CSS_UTILITY } from './resources-0ec049ad.js';
-import { d as decimalPlaces } from './math-4149b938.js';
-import { c as createObserver } from './observers-b4b363d9.js';
-import { u as updateHostInteraction } from './interactive-3a6eeea6.js';
-import './guid-b1d46039.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-b452034d.js';
+import { g as getSlotted, i as isPrimaryPointerButton, s as setRequestedIcon, e as getElementProp, a as getElementDir } from './dom-e368d23b.js';
+import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label-c63a5725.js';
+import { s as submitForm, c as connectForm, d as disconnectForm, H as HiddenFormInputSlot } from './form-9f1caa56.js';
+import { n as numberStringFormatter, i as isValidNumber, p as parseNumberString, s as sanitizeNumberString, a as defaultNumberingSystem, u as updateEffectiveLocale, c as connectLocalized, d as disconnectLocalized } from './locale-6d23910f.js';
+import { n as numberKeys } from './key-76f8b045.js';
+import { T as TEXT$1, C as CSS_UTILITY } from './resources-5c3e406b.js';
+import { d as decimalPlaces } from './math-babff37a.js';
+import { c as createObserver } from './observers-73b4a955.js';
+import { u as updateHostInteraction } from './interactive-7be16f70.js';
+import './guid-2563b904.js';
 
 const CSS = {
   loader: "loader",
@@ -284,10 +284,16 @@ const InputNumber = class {
         this.incrementOrDecrementNumberValue(direction, inputMax, inputMin, nativeEvent);
       }, valueNudgeDelayInMs);
     };
-    this.nudgeButtonPointerUpAndOutHandler = () => {
+    this.nudgeButtonPointerUpAndOutHandler = (event) => {
+      if (!isPrimaryPointerButton(event)) {
+        return;
+      }
       window.clearInterval(this.nudgeNumberValueIntervalId);
     };
     this.nudgeButtonPointerDownHandler = (event) => {
+      if (!isPrimaryPointerButton(event)) {
+        return;
+      }
       event.preventDefault();
       const direction = event.target.dataset.adjustment;
       if (!this.disabled) {