@esri/calcite-components 1.0.0-next.561 → 1.0.0-next.564

package/dist/collection/components/split-button/split-button.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.561
+ * v1.0.0-next.564
  */
 import { Component, Element, Event, h, Prop, Watch } from "@stencil/core";
 import { CSS } from "./resources";

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

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

package/dist/collection/components/stepper/stepper.css

@@ -75,7 +75,7 @@
 }
 
 :host([hidden]) {
-  display: none !important;
+  display: none;
 }
 
 :host {

package/dist/collection/components/stepper/stepper.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.561
+ * v1.0.0-next.564
  */
 import { Component, Element, Event, h, Listen, Method, Prop } from "@stencil/core";
 import { focusElement } from "../../utils/dom";

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

@@ -75,7 +75,7 @@
 }
 
 :host([hidden]) {
-  display: none !important;
+  display: none;
 }
 
 :host([layout=horizontal][disabled]) .stepper-item-header,  :host([disabled]) {
@@ -259,42 +259,42 @@
   color: var(--calcite-ui-danger);
 }
 
-:host(:hover:not([disabled]):not([active])) .container, 
-:host(:focus:not([disabled]):not([active])) .container {
+:host(:hover:not([disabled]):not([selected])) .container, 
+:host(:focus:not([disabled]):not([selected])) .container {
   border-block-start-color: var(--calcite-ui-brand);
 }
-:host(:hover:not([disabled]):not([active])) .container .stepper-item-heading, 
-:host(:focus:not([disabled]):not([active])) .container .stepper-item-heading {
+:host(:hover:not([disabled]):not([selected])) .container .stepper-item-heading, 
+:host(:focus:not([disabled]):not([selected])) .container .stepper-item-heading {
   color: var(--calcite-ui-text-1);
 }
-:host(:hover:not([disabled]):not([active])) .container .stepper-item-description, 
-:host(:focus:not([disabled]):not([active])) .container .stepper-item-description {
+:host(:hover:not([disabled]):not([selected])) .container .stepper-item-description, 
+:host(:focus:not([disabled]):not([selected])) .container .stepper-item-description {
   color: var(--calcite-ui-text-2);
 }
 
-:host([error]:hover:not([disabled]):not([active])) .container, 
-:host([error]:focus:not([disabled]):not([active])) .container {
+:host([error]:hover:not([disabled]):not([selected])) .container, 
+:host([error]:focus:not([disabled]):not([selected])) .container {
   border-block-start-color: var(--calcite-ui-danger-hover);
 }
 
-:host([active]) .container {
+:host([selected]) .container {
   border-block-start-color: var(--calcite-ui-brand);
 }
-:host([active]) .container .stepper-item-heading {
+:host([selected]) .container .stepper-item-heading {
   color: var(--calcite-ui-text-1);
 }
-:host([active]) .container .stepper-item-description {
+:host([selected]) .container .stepper-item-description {
   color: var(--calcite-ui-text-2);
 }
-:host([active]) .container .stepper-item-number {
+:host([selected]) .container .stepper-item-number {
   color: var(--calcite-ui-brand);
 }
-:host([active]) .container .stepper-item-icon {
+:host([selected]) .container .stepper-item-icon {
   color: var(--calcite-ui-brand);
   opacity: 1;
 }
 
-:host([active]) .container .stepper-item-content {
+:host([selected]) .container .stepper-item-content {
   display: flex;
 }
 
@@ -326,8 +326,8 @@
   border-color: rgba(0, 122, 194, 0.5);
 }
 
-:host([layout=vertical][complete]:hover:not([disabled]):not([active])) .container, 
-:host([layout=vertical][complete]:focus:not([disabled]):not([active])) .container {
+:host([layout=vertical][complete]:hover:not([disabled]):not([selected])) .container, 
+:host([layout=vertical][complete]:focus:not([disabled]):not([selected])) .container {
   border-color: var(--calcite-ui-brand);
 }
 
@@ -335,20 +335,20 @@
   border-color: var(--calcite-ui-danger);
 }
 
-:host([layout=vertical][active]) .container {
+:host([layout=vertical][selected]) .container {
   border-color: var(--calcite-ui-brand);
 }
-:host([layout=vertical][active]) .container .stepper-item-content ::slotted(:last-child) {
+:host([layout=vertical][selected]) .container .stepper-item-content ::slotted(:last-child) {
   margin-block-end: var(--calcite-stepper-item-spacing-unit-l);
 }
 
-:host([layout=vertical]:hover:not([disabled]):not([active])) .container,
-:host([layout=vertical]:focus:not([disabled]):not([active])) .container {
+:host([layout=vertical]:hover:not([disabled]):not([selected])) .container,
+:host([layout=vertical]:focus:not([disabled]):not([selected])) .container {
   border-color: rgba(0, 122, 194, 0.5);
 }
 
-:host([layout=vertical][error]:hover:not([disabled]):not([active])) .container, 
-:host([layout=vertical][error]:focus:not([disabled]):not([active])) .container {
+:host([layout=vertical][error]:hover:not([disabled]):not([selected])) .container, 
+:host([layout=vertical][error]:focus:not([disabled]):not([selected])) .container {
   border-color: var(--calcite-ui-danger-hover);
 }
 
@@ -381,7 +381,7 @@
   text-align: start;
 }
 
-:host([layout=horizontal][active]) .stepper-item-content {
+:host([layout=horizontal][selected]) .stepper-item-content {
   grid-area: 2/1/2/-1;
 }
 
@@ -399,8 +399,8 @@
   border-color: rgba(0, 122, 194, 0.5);
 }
 
-:host([layout=horizontal][complete]:hover:not([disabled]):not([active])) .stepper-item-header, 
-:host([layout=horizontal][complete]:focus:not([disabled]):not([active])) .stepper-item-header {
+:host([layout=horizontal][complete]:hover:not([disabled]):not([selected])) .stepper-item-header, 
+:host([layout=horizontal][complete]:focus:not([disabled]):not([selected])) .stepper-item-header {
   border-color: var(--calcite-ui-brand);
 }
 
@@ -408,17 +408,17 @@
   border-color: var(--calcite-ui-danger);
 }
 
-:host([layout=horizontal][active]) .stepper-item-header {
+:host([layout=horizontal][selected]) .stepper-item-header {
   border-color: var(--calcite-ui-brand);
 }
 
-:host([layout=horizontal]:hover:not([disabled]):not([active])) .stepper-item-header,
-:host([layout=horizontal]:focus:not([disabled]):not([active])) .stepper-item-header {
+:host([layout=horizontal]:hover:not([disabled]):not([selected])) .stepper-item-header,
+:host([layout=horizontal]:focus:not([disabled]):not([selected])) .stepper-item-header {
   border-color: rgba(0, 122, 194, 0.5);
 }
 
-:host([layout=horizontal][error]:hover:not([disabled]):not([active])) .stepper-item-header, 
-:host([layout=horizontal][error]:focus:not([disabled]):not([active])) .stepper-item-header {
+:host([layout=horizontal][error]:hover:not([disabled]):not([selected])) .stepper-item-header, 
+:host([layout=horizontal][error]:focus:not([disabled]):not([selected])) .stepper-item-header {
   border-color: var(--calcite-ui-danger-hover);
 }
 
@@ -433,17 +433,17 @@
     outline-color: canvasText;
   }
 
-  :host([active]) .container {
+  :host([selected]) .container {
     border-block-start-color: highlight;
   }
-  :host([active]) .container .stepper-item-number {
+  :host([selected]) .container .stepper-item-number {
     color: highlight;
   }
-  :host([active]) .container .stepper-item-icon {
+  :host([selected]) .container .stepper-item-icon {
     color: highlight;
   }
 
-  :host([layout=vertical][active]) .container {
+  :host([layout=vertical][selected]) .container {
     border-color: highlight;
   }
 }

package/dist/collection/components/stepper-item/stepper-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.561
+ * v1.0.0-next.564
  */
 import { Component, Element, Event, h, Host, Listen, Method, Prop, Watch } from "@stencil/core";
 import { getElementProp, toAriaBoolean } from "../../utils/dom";
@@ -16,9 +16,17 @@ export class StepperItem {
     //  Public Properties
     //
     //--------------------------------------------------------------------------
-    /** When true, the component is active. */
+    /**
+     *  is the step active
+     *
+     * @deprecated Use selected instead.
+     */
     this.active = false;
-    /** When true, the component's workflow has been completed. */
+    /**
+     * When true, step is selected
+     */
+    this.selected = false;
+    /** has the step been completed */
     this.complete = false;
     /** When true, the component contains an error that requires resolution from the user. */
     this.error = false;
@@ -89,20 +97,33 @@ export class StepperItem {
       }
     };
   }
-  // watch for removal of disabled to register step
-  disabledWatcher() {
-    this.registerStepperItem();
+  activeHandler(value) {
+    this.selected = value;
   }
-  activeWatcher(active) {
-    if (active) {
+  selectedHandler(value) {
+    this.active = value;
+    if (this.selected) {
       this.emitRequestedItem();
     }
   }
+  // watch for removal of disabled to register step
+  disabledWatcher() {
+    this.registerStepperItem();
+  }
   //--------------------------------------------------------------------------
   //
   //  Lifecycle
   //
   //--------------------------------------------------------------------------
+  connectedCallback() {
+    const { selected, active } = this;
+    if (selected) {
+      this.active = selected;
+    }
+    else if (active) {
+      this.selected = active;
+    }
+  }
   componentWillLoad() {
     this.icon = getElementProp(this.el, "icon", false);
     this.numbered = getElementProp(this.el, "numbered", false);
@@ -111,7 +132,7 @@ export class StepperItem {
     this.parentStepperEl = this.el.parentElement;
     this.itemPosition = this.getItemPosition();
     this.registerStepperItem();
-    if (this.active) {
+    if (this.selected) {
       this.emitRequestedItem();
     }
   }
@@ -142,8 +163,8 @@ export class StepperItem {
   updateActiveItemOnChange(event) {
     if (event.target === this.parentStepperEl ||
       event.composedPath().includes(this.parentStepperEl)) {
-      this.activePosition = event.detail.position;
-      this.determineActiveItem();
+      this.selectedPosition = event.detail.position;
+      this.determineSelectedItem();
     }
   }
   //--------------------------------------------------------------------------
@@ -156,7 +177,7 @@ export class StepperItem {
     (_a = (this.layout === "vertical" ? this.el : this.headerEl)) === null || _a === void 0 ? void 0 : _a.focus();
   }
   renderIcon() {
-    const path = this.active
+    const path = this.selected
       ? "circleF"
       : this.error
         ? "exclamationMarkCircleF"
@@ -165,8 +186,8 @@ export class StepperItem {
           : "circle";
     return h("calcite-icon", { class: "stepper-item-icon", icon: path, scale: "s" });
   }
-  determineActiveItem() {
-    this.active = !this.disabled && this.itemPosition === this.activePosition;
+  determineSelectedItem() {
+    this.selected = !this.disabled && this.itemPosition === this.selectedPosition;
   }
   registerStepperItem() {
     this.calciteInternalStepperItemRegister.emit({
@@ -197,13 +218,34 @@ export class StepperItem {
       "required": false,
       "optional": false,
       "docs": {
-        "tags": [],
-        "text": "When true, the component is active."
+        "tags": [{
+            "name": "deprecated",
+            "text": "Use selected instead."
+          }],
+        "text": "is the step active"
       },
       "attribute": "active",
       "reflect": true,
       "defaultValue": "false"
     },
+    "selected": {
+      "type": "boolean",
+      "mutable": true,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "When true, step is selected"
+      },
+      "attribute": "selected",
+      "reflect": true,
+      "defaultValue": "false"
+    },
     "complete": {
       "type": "boolean",
       "mutable": false,
@@ -216,7 +258,7 @@ export class StepperItem {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "When true, the component's workflow has been completed."
+        "text": "has the step been completed"
       },
       "attribute": "complete",
       "reflect": true,
@@ -543,11 +585,14 @@ export class StepperItem {
   }; }
   static get elementRef() { return "el"; }
   static get watchers() { return [{
+      "propName": "active",
+      "methodName": "activeHandler"
+    }, {
+      "propName": "selected",
+      "methodName": "selectedHandler"
+    }, {
       "propName": "disabled",
       "methodName": "disabledWatcher"
-    }, {
-      "propName": "active",
-      "methodName": "activeWatcher"
     }]; }
   static get listeners() { return [{
       "name": "calciteInternalStepperItemChange",

package/dist/collection/components/switch/switch.css

@@ -75,7 +75,7 @@
 }
 
 :host([hidden]) {
-  display: none !important;
+  display: none;
 }
 
 :host([disabled]) {

package/dist/collection/components/switch/switch.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.561
+ * v1.0.0-next.564
  */
 import { Component, Element, Event, h, Host, Method, Prop, Watch } from "@stencil/core";
 import { focusElement, toAriaBoolean } from "../../utils/dom";

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

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

package/dist/collection/components/tab/tab.css

@@ -75,7 +75,7 @@
 }
 
 :host([hidden]) {
-  display: none !important;
+  display: none;
 }
 
 :host([selected]) section {

package/dist/collection/components/tab/tab.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.561
+ * v1.0.0-next.564
  */
 import { Component, Prop, Element, Listen, Method, Event, h, State, Host, Watch } from "@stencil/core";
 import { guid } from "../../utils/guid";

package/dist/collection/components/tab-nav/tab-nav.css

@@ -75,7 +75,7 @@
 }
 
 :host([hidden]) {
-  display: none !important;
+  display: none;
 }
 
 :host {

package/dist/collection/components/tab-nav/tab-nav.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.561
+ * v1.0.0-next.564
  */
 import { Component, Element, Event, h, Host, Listen, Prop, State, Watch } from "@stencil/core";
 import { getElementDir, filterDirectChildren } from "../../utils/dom";
@@ -168,7 +168,6 @@ export class TabNav {
       event.target.syncId === this.syncId &&
       this.selectedTab !== event.detail.tab) {
       this.selectedTab = event.detail.tab;
-      event.stopPropagation();
     }
     event.stopPropagation();
   }

package/dist/collection/components/tab-title/tab-title.css

@@ -75,7 +75,7 @@
 }
 
 :host([hidden]) {
-  display: none !important;
+  display: none;
 }
 
 :host([disabled]) {

package/dist/collection/components/tab-title/tab-title.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.561
+ * v1.0.0-next.564
  */
 import { Build, Component, Element, Event, h, Host, Listen, Method, Prop, State, Watch } from "@stencil/core";
 import { guid } from "../../utils/guid";

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

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

package/dist/collection/components/tabs/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.561
+ * v1.0.0-next.564
  */
 export const SLOTS = {
   tabNav: "tab-nav"

package/dist/collection/components/tabs/tabs.css

@@ -75,7 +75,7 @@
 }
 
 :host([hidden]) {
-  display: none !important;
+  display: none;
 }
 
 :host {

package/dist/collection/components/tabs/tabs.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.561
+ * v1.0.0-next.564
  */
 import { Component, Prop, h, Element, Listen, State, Fragment } from "@stencil/core";
 import { SLOTS } from "./resources";

package/dist/collection/components/tile/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.561
+ * v1.0.0-next.564
  */
 export const SLOTS = {
   contentStart: "content-start",

package/dist/collection/components/tile/tile.css

@@ -75,7 +75,7 @@
 }
 
 :host([hidden]) {
-  display: none !important;
+  display: none;
 }
 
 :host([disabled]) {

package/dist/collection/components/tile/tile.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.561
+ * v1.0.0-next.564
  */
 import { Component, Element, Fragment, h, Prop } from "@stencil/core";
 import { SLOTS } from "./resources";

package/dist/collection/components/tile-select/interfaces.js

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

package/dist/collection/components/tile-select/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.561
+ * v1.0.0-next.564
  */
 export const CSS = {
   checked: "checked",

package/dist/collection/components/tile-select/tile-select.css

@@ -75,7 +75,7 @@
 }
 
 :host([hidden]) {
-  display: none !important;
+  display: none;
 }
 
 :host([disabled]) {

package/dist/collection/components/tile-select/tile-select.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.561
+ * v1.0.0-next.564
  */
 import { Component, Element, Event, h, Prop, Listen, Watch, State, Method } from "@stencil/core";
 import { guid } from "../../utils/guid";

package/dist/collection/components/tile-select-group/interfaces.js

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

package/dist/collection/components/tile-select-group/tile-select-group.css

@@ -75,7 +75,7 @@
 }
 
 :host([hidden]) {
-  display: none !important;
+  display: none;
 }
 
 :host([disabled]) {

package/dist/collection/components/tile-select-group/tile-select-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.561
+ * v1.0.0-next.564
  */
 import { Component, h, Prop, Element } from "@stencil/core";
 import { updateHostInteraction } from "../../utils/interactive";

package/dist/collection/components/time-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.561
+ * v1.0.0-next.564
  */
 export const CSS = {
   button: "button",

package/dist/collection/components/time-picker/time-picker.css

@@ -75,7 +75,7 @@
 }
 
 :host([hidden]) {
-  display: none !important;
+  display: none;
 }
 
 :host {

package/dist/collection/components/time-picker/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.561
+ * v1.0.0-next.564
  */
 import { Component, Element, h, Prop, Event, Watch, State, Listen, Method } from "@stencil/core";
 import { isActivationKey, numberKeys } from "../../utils/key";

package/dist/collection/components/tip/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.561
+ * v1.0.0-next.564
  */
 import { HEADING_LEVEL as PARENT_HEADING_LEVEL } from "../tip-manager/resources";
 export const CSS = {