@esri/calcite-components 1.0.0-next.555 → 1.0.0-next.558

package/dist/cjs/calcite-color-picker_3.cjs.entry.js

@@ -1,19 +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.555
+ * v1.0.0-next.558
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-a63e0c6e.js');
-const dom = require('./dom-d6b74aa3.js');
-const utils = require('./utils-3d436716.js');
-const math = require('./math-90fee1c0.js');
-const interactive = require('./interactive-3049b1d7.js');
-const debounce = require('./debounce-b7489443.js');
-require('./guid-4a4f363a.js');
+const index = require('./index-1551f0c3.js');
+const dom = require('./dom-14e5af32.js');
+const utils = require('./utils-f923cce9.js');
+const math = require('./math-437432fd.js');
+const interactive = require('./interactive-b6c7ef94.js');
+const key = require('./key-c7d73dea.js');
+const debounce = require('./debounce-8565a616.js');
+require('./resources-f351edf3.js');
+require('./guid-0cd4a810.js');
 
 /** Error message constants. */
 var FUNC_ERROR_TEXT = 'Expected a function';
@@ -2484,7 +2486,7 @@ const ColorPicker = class {
       this.updateChannelsFromColor(this.color);
     };
     this.handleColorFieldScopeKeyDown = (event) => {
-      const key = event.key;
+      const { key } = event;
       const arrowKeyToXYOffset = {
         ArrowUp: { x: 0, y: -10 },
         ArrowRight: { x: 10, y: 0 },
@@ -2499,7 +2501,7 @@ const ColorPicker = class {
     };
     this.handleHueScopeKeyDown = (event) => {
       const modifier = event.shiftKey ? 10 : 1;
-      const key = event.key;
+      const { key } = event;
       const arrowKeyToXOffset = {
         ArrowUp: 1,
         ArrowRight: 1,
@@ -2565,9 +2567,8 @@ const ColorPicker = class {
       this.updateColorFromChannels(channels);
     };
     this.handleSavedColorKeyDown = (event) => {
-      if (event.key === " " || event.key === "Enter") {
+      if (key.isActivationKey(event.key)) {
         event.preventDefault();
-        event.stopPropagation();
         this.handleSavedColorSelect(event);
       }
     };
@@ -2834,7 +2835,7 @@ const ColorPicker = class {
   // using @Listen as a workaround for VDOM listener not firing
   handleChannelKeyUpOrDown(event) {
     this.shiftKeyChannelAdjustment = 0;
-    const key = event.key;
+    const { key } = event;
     if ((key !== "ArrowUp" && key !== "ArrowDown") ||
       !event.composedPath().some((node) => { var _a; return (_a = node.classList) === null || _a === void 0 ? void 0 : _a.contains(CSS$2.channel); })) {
       return;
@@ -3210,7 +3211,7 @@ const ColorPickerHexInput = class {
   onInputKeyDown(event) {
     const { altKey, ctrlKey, metaKey, shiftKey } = event;
     const { internalColor, value } = this;
-    const key = event.key;
+    const { key } = event;
     if (key === "Tab" || key === "Enter") {
       this.onInputChange();
       return;

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

@@ -1,24 +1,25 @@
 /*!
  * 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.555
+ * v1.0.0-next.558
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-a63e0c6e.js');
-const filter = require('./filter-c245e6df.js');
-const floatingUi = require('./floating-ui-f9976acd.js');
-const guid = require('./guid-4a4f363a.js');
-const dom = require('./dom-d6b74aa3.js');
-const label = require('./label-6ebcd769.js');
-const form = require('./form-7c9f751c.js');
-const observers = require('./observers-f8b22aed.js');
-const interactive = require('./interactive-3049b1d7.js');
-const openCloseComponent = require('./openCloseComponent-b069a5fb.js');
-const debounce = require('./debounce-b7489443.js');
-const conditionalSlot = require('./conditionalSlot-9af3512f.js');
+const index = require('./index-1551f0c3.js');
+const filter = require('./filter-e6823373.js');
+const floatingUi = require('./floating-ui-f1794a41.js');
+const guid = require('./guid-0cd4a810.js');
+const dom = require('./dom-14e5af32.js');
+const label = require('./label-3c08392d.js');
+const form = require('./form-d0c52805.js');
+const observers = require('./observers-36262a56.js');
+const interactive = require('./interactive-b6c7ef94.js');
+const openCloseComponent = require('./openCloseComponent-9ca34c15.js');
+const debounce = require('./debounce-8565a616.js');
+const conditionalSlot = require('./conditionalSlot-c5d23706.js');
+require('./resources-f351edf3.js');
 
 const ComboboxItem$1 = "CALCITE-COMBOBOX-ITEM";
 const ComboboxItemGroup$1 = "CALCITE-COMBOBOX-ITEM-GROUP";
@@ -85,7 +86,12 @@ const Combobox = class {
     this.disabled = false;
     /** Specify the maximum number of combobox items (including nested children) to display before showing the scroller */
     this.maxItems = 0;
-    /** Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value. */
+    /**
+     * Determines the type of positioning to use for the overlaid content.
+     *
+     * Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
+     *
+     */
     this.overlayPositioning = "absolute";
     /**
      * When true, makes the component required for form-submission.
@@ -167,19 +173,22 @@ const Combobox = class {
           break;
         case "ArrowLeft":
           this.previousChip();
+          event.preventDefault();
           break;
         case "ArrowRight":
           this.nextChip();
+          event.preventDefault();
           break;
         case "ArrowUp":
+          event.preventDefault();
           this.shiftActiveItemIndex(-1);
           if (!this.comboboxInViewport()) {
             this.el.scrollIntoView();
           }
           break;
         case "ArrowDown":
+          event.preventDefault();
           if (!this.open) {
-            event.preventDefault();
             this.open = true;
           }
           this.shiftActiveItemIndex(1);
@@ -195,9 +204,10 @@ const Combobox = class {
           }
           break;
         case "Home":
-          if (this.open) {
-            event.preventDefault();
+          if (!this.open) {
+            return;
           }
+          event.preventDefault();
           this.updateActiveItemIndex(0);
           this.scrollToActiveItem();
           if (!this.comboboxInViewport()) {
@@ -205,9 +215,10 @@ const Combobox = class {
           }
           break;
         case "End":
-          if (this.open) {
-            event.preventDefault();
+          if (!this.open) {
+            return;
           }
+          event.preventDefault();
           this.updateActiveItemIndex(this.visibleItems.length - 1);
           this.scrollToActiveItem();
           if (!this.comboboxInViewport()) {
@@ -216,27 +227,35 @@ const Combobox = class {
           break;
         case "Escape":
           this.open = false;
+          event.preventDefault();
           break;
         case "Enter":
           if (this.activeItemIndex > -1) {
             this.toggleSelection(this.visibleItems[this.activeItemIndex]);
+            event.preventDefault();
           }
           else if (this.activeChipIndex > -1) {
             this.removeActiveChip();
+            event.preventDefault();
           }
           else if (this.allowCustomValues && this.text) {
             this.addCustomChip(this.text, true);
+            event.preventDefault();
           }
           else if (!event.defaultPrevented) {
-            form.submitForm(this);
+            if (form.submitForm(this)) {
+              event.preventDefault();
+            }
           }
           break;
         case "Delete":
         case "Backspace":
           if (this.activeChipIndex > -1) {
+            event.preventDefault();
             this.removeActiveChip();
           }
           else if (!this.text && this.isMulti()) {
+            event.preventDefault();
             this.removeLastChip();
           }
           break;

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

@@ -1,20 +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.555
+ * v1.0.0-next.558
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-a63e0c6e.js');
-const resources = require('./resources-7195d5f1.js');
-const dom = require('./dom-d6b74aa3.js');
-const interactive = require('./interactive-3049b1d7.js');
-const Heading = require('./Heading-f5821e3b.js');
-require('./locale-0df5a0db.js');
-require('./key-62b8adda.js');
-require('./guid-4a4f363a.js');
+const index = require('./index-1551f0c3.js');
+const resources = require('./resources-a8470dd3.js');
+const dom = require('./dom-14e5af32.js');
+const resources$1 = require('./resources-f351edf3.js');
+const interactive = require('./interactive-b6c7ef94.js');
+const key = require('./key-c7d73dea.js');
+const Heading = require('./Heading-bbd94693.js');
+require('./locale-acfba29a.js');
+require('./guid-0cd4a810.js');
 
 const datePickerCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 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;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}.calcite-animate__in{-webkit-animation-name:in;animation-name:in}.calcite-animate__in-down{-webkit-animation-name:in-down;animation-name:in-down}.calcite-animate__in-up{-webkit-animation-name:in-up;animation-name:in-up}.calcite-animate__in-scale{-webkit-animation-name:in-scale;animation-name:in-scale}:root{--calcite-floating-ui-transition:var(--calcite-animation-timing)}:host([hidden]){display:none !important}: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}";
 
@@ -468,9 +469,9 @@ const DatePickerDay = class {
       !this.disabled && this.calciteDaySelect.emit();
     };
     this.keyDownHandler = (event) => {
-      const key = event.key;
-      if (key === " " || key === "Enter") {
+      if (key.isActivationKey(event.key)) {
         !this.disabled && this.calciteDaySelect.emit();
+        event.preventDefault();
       }
     };
   }
@@ -488,7 +489,7 @@ const DatePickerDay = class {
       .map((i) => this.localeData.numerals[i])
       .join("");
     const dir = dom.getElementDir(this.el);
-    return (index.h(index.Host, { onClick: this.onClick, onKeyDown: this.keyDownHandler, role: "gridcell" }, index.h("div", { class: { "day-v-wrapper": true, [dom.CSS_UTILITY.rtl]: dir === "rtl" } }, index.h("div", { class: "day-wrapper" }, index.h("span", { class: "day" }, index.h("span", { class: "text" }, formattedDay))))));
+    return (index.h(index.Host, { onClick: this.onClick, onKeyDown: this.keyDownHandler, role: "gridcell" }, index.h("div", { class: { "day-v-wrapper": true, [resources$1.CSS_UTILITY.rtl]: dir === "rtl" } }, index.h("div", { class: "day-wrapper" }, index.h("span", { class: "day" }, index.h("span", { class: "text" }, formattedDay))))));
   }
   componentDidRender() {
     interactive.updateHostInteraction(this, this.isTabbable);
@@ -517,6 +518,9 @@ const DatePickerMonth = class {
     //
     //--------------------------------------------------------------------------
     this.keyDownHandler = (event) => {
+      if (event.defaultPrevented) {
+        return;
+      }
       const isRTL = this.el.dir === "rtl";
       switch (event.key) {
         case "ArrowUp":
@@ -846,8 +850,7 @@ const DatePickerMonthHeader = class {
       this.handleArrowClick(event, this.prevMonthDate);
     };
     this.prevMonthKeydown = (event) => {
-      const key = event.key;
-      if (key === " " || key === "Enter") {
+      if (key.isActivationKey(event.key)) {
         this.prevMonthClick(event);
       }
     };
@@ -855,8 +858,7 @@ const DatePickerMonthHeader = class {
       this.handleArrowClick(event, this.nextMonthDate);
     };
     this.nextMonthKeydown = (event) => {
-      const key = event.key;
-      if (key === " " || key === "Enter") {
+      if (key.isActivationKey(event.key)) {
         this.nextMonthClick(event);
       }
     };
@@ -864,8 +866,7 @@ const DatePickerMonthHeader = class {
      * Update active month on clicks of left/right arrows
      */
     this.handleArrowClick = (event, date) => {
-      event === null || event === void 0 ? void 0 : event.preventDefault();
-      event.stopPropagation();
+      event.preventDefault();
       this.calciteDatePickerSelect.emit(date);
     };
   }

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

@@ -1,19 +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.555
+ * v1.0.0-next.558
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-a63e0c6e.js');
-const dom = require('./dom-d6b74aa3.js');
-const floatingUi = require('./floating-ui-f9976acd.js');
-const observers = require('./observers-f8b22aed.js');
-const interactive = require('./interactive-3049b1d7.js');
-const openCloseComponent = require('./openCloseComponent-b069a5fb.js');
-const guid = require('./guid-4a4f363a.js');
+const index = require('./index-1551f0c3.js');
+const dom = require('./dom-14e5af32.js');
+const floatingUi = require('./floating-ui-f1794a41.js');
+const observers = require('./observers-36262a56.js');
+const interactive = require('./interactive-b6c7ef94.js');
+const openCloseComponent = require('./openCloseComponent-9ca34c15.js');
+const guid = require('./guid-0cd4a810.js');
+const key = require('./key-c7d73dea.js');
+require('./resources-f351edf3.js');
 
 const SLOTS = {
   dropdownTrigger: "dropdown-trigger"
@@ -54,7 +56,12 @@ const Dropdown = class {
      this value does not include groupTitles passed to calcite-dropdown-group
      */
     this.maxItems = 0;
-    /** Describes the type of positioning to use for the overlaid content. If your element is in a fixed container, use the 'fixed' value. */
+    /**
+     * Determines the type of positioning to use for the overlaid content.
+     *
+     * Using the "absolute" value will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout. The "fixed" value should be used to escape an overflowing parent container, or when the reference element's `position` CSS property is "fixed".
+     *
+     */
     this.overlayPositioning = "absolute";
     /**
      * Determines where the dropdown will be positioned relative to the button.
@@ -165,19 +172,29 @@ const Dropdown = class {
       if (target !== this.referenceEl) {
         return;
       }
-      const key = event.key;
-      if (this.open && (key === "Escape" || (event.shiftKey && key === "Tab"))) {
-        this.closeCalciteDropdown();
+      const { defaultPrevented, key: key$1 } = event;
+      if (defaultPrevented) {
         return;
       }
-      switch (key) {
-        case " ":
-        case "Enter":
-          this.openCalciteDropdown();
-          break;
-        case "Escape":
+      if (this.open) {
+        if (key$1 === "Escape") {
+          this.closeCalciteDropdown();
+          event.preventDefault();
+          return;
+        }
+        else if (event.shiftKey && key$1 === "Tab") {
           this.closeCalciteDropdown();
-          break;
+          event.preventDefault();
+          return;
+        }
+      }
+      if (key.isActivationKey(key$1)) {
+        this.openCalciteDropdown();
+        event.preventDefault();
+      }
+      else if (key$1 === "Escape") {
+        this.closeCalciteDropdown();
+        event.preventDefault();
       }
     };
     this.focusOnFirstActiveOrFirstItem = () => {

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

@@ -1,16 +1,17 @@
 /*!
  * 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.555
+ * v1.0.0-next.558
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-a63e0c6e.js');
-const dom = require('./dom-d6b74aa3.js');
-const interactive = require('./interactive-3049b1d7.js');
-require('./guid-4a4f363a.js');
+const index = require('./index-1551f0c3.js');
+const dom = require('./dom-14e5af32.js');
+const interactive = require('./interactive-b6c7ef94.js');
+require('./resources-f351edf3.js');
+require('./guid-0cd4a810.js');
 
 const CSS = {
   button: "button"

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

@@ -1,18 +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.555
+ * v1.0.0-next.558
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-a63e0c6e.js');
-const dom = require('./dom-d6b74aa3.js');
-const interactive = require('./interactive-3049b1d7.js');
-const filter = require('./filter-c245e6df.js');
-const debounce = require('./debounce-b7489443.js');
-require('./guid-4a4f363a.js');
+const index = require('./index-1551f0c3.js');
+const dom = require('./dom-14e5af32.js');
+const interactive = require('./interactive-b6c7ef94.js');
+const filter = require('./filter-e6823373.js');
+const debounce = require('./debounce-8565a616.js');
+require('./resources-f351edf3.js');
+require('./guid-0cd4a810.js');
 
 const CSS = {
   container: "container",
@@ -76,6 +77,7 @@ const Filter = class {
     this.keyDownHandler = (event) => {
       if (event.key === "Escape") {
         this.clear();
+        event.preventDefault();
       }
       if (event.key === "Enter") {
         event.preventDefault();

package/dist/cjs/calcite-flow.cjs.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.555
+ * v1.0.0-next.558
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-a63e0c6e.js');
-const observers = require('./observers-f8b22aed.js');
+const index = require('./index-1551f0c3.js');
+const observers = require('./observers-36262a56.js');
 
 const CSS = {
   frame: "frame",

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

@@ -1,20 +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.555
+ * v1.0.0-next.558
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-a63e0c6e.js');
-const guid = require('./guid-4a4f363a.js');
-const observers = require('./observers-f8b22aed.js');
-const dom = require('./dom-d6b74aa3.js');
-const math = require('./math-90fee1c0.js');
-const label = require('./label-6ebcd769.js');
-const form = require('./form-7c9f751c.js');
-const interactive = require('./interactive-3049b1d7.js');
+const index = require('./index-1551f0c3.js');
+const guid = require('./guid-0cd4a810.js');
+const observers = require('./observers-36262a56.js');
+const dom = require('./dom-14e5af32.js');
+const math = require('./math-437432fd.js');
+const label = require('./label-3c08392d.js');
+const form = require('./form-d0c52805.js');
+const interactive = require('./interactive-b6c7ef94.js');
+const key = require('./key-c7d73dea.js');
+require('./resources-f351edf3.js');
 
 /**
  * Calculate slope of the tangents
@@ -248,17 +250,17 @@ const Slider = class {
     //  Properties
     //
     //--------------------------------------------------------------------------
-    /** Disable and gray out the slider */
+    /** When true, interaction is prevented and the component is displayed with lower opacity. */
     this.disabled = false;
-    /** Indicates if a histogram is present */
+    /** When true, indicates a histogram is present. */
     this.hasHistogram = false;
-    /** Label handles with their numeric value */
+    /** When true, displays label handles with their numeric value. */
     this.labelHandles = false;
-    /** Label tick marks with their numeric value. */
+    /** When true and "ticks" is specified, displays label tick marks with their numeric value. */
     this.labelTicks = false;
-    /** Maximum selectable value */
+    /** The component's maximum selectable value. */
     this.max = 100;
-    /** Minimum selectable value */
+    /** The component's minimum selectable value. */
     this.min = 0;
     /**
      * When true, the slider will display values from high to low.
@@ -266,20 +268,20 @@ const Slider = class {
      * Note that this value will be ignored if the slider has an associated histogram.
      */
     this.mirrored = false;
-    /** Use finer point for handles */
+    /** When true, sets a finer point for handles. */
     this.precise = false;
     /**
-     * When true, makes the component required for form-submission.
+     * When true, the component must have a value on form submission.
      */
     this.required = false;
-    /** When true, enables snap selection along the step interval */
+    /** When true, enables snap selection in coordination with "step" via a mouse. */
     this.snap = false;
-    /** Interval to move on up/down keys */
+    /** Specifies the interval to move with the up, or down keys. */
     this.step = 1;
-    /** Currently selected number (if single select) */
+    /** The component's value. */
     this.value = 0;
     /**
-     * Specify the scale of the slider, defaults to m
+     *  Specifies the size of the component.
      */
     this.scale = "m";
     this.guid = `calcite-slider-${guid.guid()}`;
@@ -569,34 +571,34 @@ const Slider = class {
     const mirror = this.shouldMirror();
     const { activeProp, max, min, pageStep, step } = this;
     const value = this[activeProp];
-    const key = event.key;
-    if (key === "Enter" || key === " ") {
+    const { key: key$1 } = event;
+    if (key.isActivationKey(key$1)) {
       event.preventDefault();
       return;
     }
     let adjustment;
-    if (key === "ArrowUp" || key === "ArrowRight") {
-      const directionFactor = mirror && key === "ArrowRight" ? -1 : 1;
+    if (key$1 === "ArrowUp" || key$1 === "ArrowRight") {
+      const directionFactor = mirror && key$1 === "ArrowRight" ? -1 : 1;
       adjustment = value + step * directionFactor;
     }
-    else if (key === "ArrowDown" || key === "ArrowLeft") {
-      const directionFactor = mirror && key === "ArrowLeft" ? -1 : 1;
+    else if (key$1 === "ArrowDown" || key$1 === "ArrowLeft") {
+      const directionFactor = mirror && key$1 === "ArrowLeft" ? -1 : 1;
       adjustment = value - step * directionFactor;
     }
-    else if (key === "PageUp") {
+    else if (key$1 === "PageUp") {
       if (pageStep) {
         adjustment = value + pageStep;
       }
     }
-    else if (key === "PageDown") {
+    else if (key$1 === "PageDown") {
       if (pageStep) {
         adjustment = value - pageStep;
       }
     }
-    else if (key === "Home") {
+    else if (key$1 === "Home") {
       adjustment = min;
     }
-    else if (key === "End") {
+    else if (key$1 === "End") {
       adjustment = max;
     }
     if (isNaN(adjustment)) {

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

@@ -1,15 +1,16 @@
 /*!
  * 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.555
+ * v1.0.0-next.558
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-a63e0c6e.js');
-const dom = require('./dom-d6b74aa3.js');
-require('./guid-4a4f363a.js');
+const index = require('./index-1551f0c3.js');
+const dom = require('./dom-14e5af32.js');
+require('./resources-f351edf3.js');
+require('./guid-0cd4a810.js');
 
 const CSS = {
   handle: "handle",
@@ -47,12 +48,14 @@ const Handle = class {
       switch (event.key) {
         case " ":
           this.activated = !this.activated;
+          event.preventDefault();
           break;
         case "ArrowUp":
         case "ArrowDown":
           if (!this.activated) {
             return;
           }
+          event.preventDefault();
           const direction = event.key.toLowerCase().replace("arrow", "");
           this.calciteHandleNudge.emit({ handle: this.el, direction });
           break;

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

@@ -1,16 +1,17 @@
 /*!
  * 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.555
+ * v1.0.0-next.558
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-a63e0c6e.js');
-const dom = require('./dom-d6b74aa3.js');
-const observers = require('./observers-f8b22aed.js');
-require('./guid-4a4f363a.js');
+const index = require('./index-1551f0c3.js');
+const dom = require('./dom-14e5af32.js');
+const observers = require('./observers-36262a56.js');
+require('./resources-f351edf3.js');
+require('./guid-0cd4a810.js');
 
 const CSS = {
   icon: "icon",