@esri/calcite-components 1.0.0-beta.89 → 1.0.0-beta.91

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-beta.89
+ * v1.0.0-beta.91
  */
 import { Component, Element, h, Prop, Event, Watch, State, Listen, Method } from "@stencil/core";
 import { isActivationKey, numberKeys } from "../../utils/key";
@@ -137,7 +137,7 @@ export class TimePicker {
       }
     };
     this.hourKeyDownHandler = (event) => {
-      const key = event.key;
+      const { key } = event;
       if (numberKeys.includes(key)) {
         const keyAsNumber = parseInt(key);
         let newHour;
@@ -182,7 +182,6 @@ export class TimePicker {
             this.incrementHour();
             break;
           case " ":
-          case "Spacebar":
             event.preventDefault();
             break;
         }
@@ -245,7 +244,6 @@ export class TimePicker {
           this.decrementMeridiem();
           break;
         case " ":
-        case "Spacebar":
           event.preventDefault();
           break;
       }
@@ -261,7 +259,7 @@ export class TimePicker {
       }
     };
     this.minuteKeyDownHandler = (event) => {
-      const key = event.key;
+      const { key } = event;
       if (numberKeys.includes(key)) {
         const keyAsNumber = parseInt(key);
         let newMinute;
@@ -292,7 +290,6 @@ export class TimePicker {
             this.incrementMinute();
             break;
           case " ":
-          case "Spacebar":
             event.preventDefault();
             break;
         }
@@ -309,7 +306,7 @@ export class TimePicker {
       }
     };
     this.secondKeyDownHandler = (event) => {
-      const key = event.key;
+      const { key } = event;
       if (numberKeys.includes(key)) {
         const keyAsNumber = parseInt(key);
         let newSecond;
@@ -340,7 +337,6 @@ export class TimePicker {
             this.incrementSecond();
             break;
           case " ":
-          case "Spacebar":
             event.preventDefault();
             break;
         }
@@ -452,7 +448,7 @@ export class TimePicker {
     this.calciteInternalTimePickerFocus.emit();
   }
   keyDownHandler(event) {
-    const key = event.key;
+    const { key } = event;
     switch (this.activeEl) {
       case this.hourEl:
         if (key === "ArrowRight") {
@@ -520,7 +516,7 @@ export class TimePicker {
   //
   // --------------------------------------------------------------------------
   buttonActivated(event) {
-    const key = event.key;
+    const { key } = event;
     if (key === " ") {
       event.preventDefault();
     }
@@ -994,7 +990,7 @@ export class TimePicker {
       "method": "calciteInternalTimePickerBlur",
       "name": "calciteInternalTimePickerBlur",
       "bubbles": true,
-      "cancelable": true,
+      "cancelable": false,
       "composed": true,
       "docs": {
         "tags": [{
@@ -1012,7 +1008,7 @@ export class TimePicker {
       "method": "calciteInternalTimePickerChange",
       "name": "calciteInternalTimePickerChange",
       "bubbles": true,
-      "cancelable": true,
+      "cancelable": false,
       "composed": true,
       "docs": {
         "tags": [{
@@ -1030,7 +1026,7 @@ export class TimePicker {
       "method": "calciteInternalTimePickerFocus",
       "name": "calciteInternalTimePickerFocus",
       "bubbles": true,
-      "cancelable": true,
+      "cancelable": false,
       "composed": true,
       "docs": {
         "tags": [{

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-beta.89
+ * v1.0.0-beta.91
  */
 import { HEADING_LEVEL as PARENT_HEADING_LEVEL } from "../tip-manager/resources";
 export const CSS = {

package/dist/collection/components/tip/tip.css

@@ -75,7 +75,7 @@
 }
 
 :host([hidden]) {
-  display: none;
+  display: none !important;
 }
 
 :host {
@@ -133,33 +133,14 @@
   padding: 0.5rem;
 }
 
-h1.heading {
-  font-size: var(--calcite-font-size-2);
-  line-height: 1.5rem;
-}
-
-h2.heading {
-  font-size: var(--calcite-font-size-1);
-  line-height: 1.5rem;
-}
-
-h3.heading {
-  font-size: var(--calcite-font-size-0);
-  line-height: 1.25rem;
-}
-
-h4.heading, 
-h5.heading {
-  font-size: var(--calcite-font-size--1);
-  line-height: 1rem;
-}
-
 .header {
   margin-block-end: 0.5rem;
 }
 
 .header .heading {
   padding: 0px;
+  font-size: var(--calcite-font-size-0);
+  line-height: 1.25rem;
   color: var(--calcite-ui-text-1);
 }
 

package/dist/collection/components/tip/tip.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-beta.89
+ * v1.0.0-beta.91
  */
 import { Component, Element, Event, Prop, h, Fragment } from "@stencil/core";
 import { CSS, ICONS, SLOTS, TEXT, HEADING_LEVEL } from "./resources";
@@ -216,7 +216,7 @@ export class Tip {
       "method": "calciteTipDismiss",
       "name": "calciteTipDismiss",
       "bubbles": true,
-      "cancelable": true,
+      "cancelable": false,
       "composed": true,
       "docs": {
         "tags": [],

package/dist/collection/components/tip-group/tip-group.css

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

package/dist/collection/components/tip-group/tip-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-beta.89
+ * v1.0.0-beta.91
  */
 import { Component, Prop, h } from "@stencil/core";
 /**

package/dist/collection/components/tip-manager/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-beta.89
+ * v1.0.0-beta.91
  */
 export const CSS = {
   header: "header",

package/dist/collection/components/tip-manager/tip-manager.css

@@ -75,7 +75,7 @@
 }
 
 :host([hidden]) {
-  display: none;
+  display: none !important;
 }
 
 /**
@@ -124,27 +124,6 @@
   padding: 0.5rem;
 }
 
-h1.heading {
-  font-size: var(--calcite-font-size-2);
-  line-height: 1.5rem;
-}
-
-h2.heading {
-  font-size: var(--calcite-font-size-1);
-  line-height: 1.5rem;
-}
-
-h3.heading {
-  font-size: var(--calcite-font-size-0);
-  line-height: 1.25rem;
-}
-
-h4.heading, 
-h5.heading {
-  font-size: var(--calcite-font-size--1);
-  line-height: 1rem;
-}
-
 .header {
   border-width: 0px;
   border-block-end-width: 1px;
@@ -154,7 +133,7 @@ h5.heading {
   padding-inline-end: 0px;
   padding-inline-start: 1rem;
 }
-.header h2.heading {
+.header .heading {
   padding: 0px;
   font-size: var(--calcite-font-size-1);
   line-height: 1.5rem;

package/dist/collection/components/tip-manager/tip-manager.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-beta.89
+ * v1.0.0-beta.91
  */
 import { Component, Element, Event, Method, Prop, State, Watch, h } from "@stencil/core";
 import { CSS, ICONS, TEXT, HEADING_LEVEL } from "./resources";
@@ -313,7 +313,7 @@ export class TipManager {
       "method": "calciteTipManagerToggle",
       "name": "calciteTipManagerToggle",
       "bubbles": true,
-      "cancelable": true,
+      "cancelable": false,
       "composed": true,
       "docs": {
         "tags": [{
@@ -331,7 +331,7 @@ export class TipManager {
       "method": "calciteTipManagerClose",
       "name": "calciteTipManagerClose",
       "bubbles": true,
-      "cancelable": true,
+      "cancelable": false,
       "composed": true,
       "docs": {
         "tags": [],

package/dist/collection/components/tooltip/TooltipManager.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-beta.89
+ * v1.0.0-beta.91
  */
 import { TOOLTIP_DELAY_MS } from "./resources";
 export default class TooltipManager {

package/dist/collection/components/tooltip/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-beta.89
+ * v1.0.0-beta.91
  */
 export const CSS = {
   container: "container",

package/dist/collection/components/tooltip/tooltip.css

@@ -75,7 +75,7 @@
 }
 
 :host([hidden]) {
-  display: none;
+  display: none !important;
 }
 
 :host {
@@ -87,12 +87,12 @@
 
 .calcite-floating-ui-anim {
   position: relative;
-  z-index: 1;
   transition: var(--calcite-floating-ui-transition);
   visibility: hidden;
   transition-property: transform, visibility, opacity;
   opacity: 0;
   box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.16);
+  z-index: 1;
   border-radius: 0.25rem;
 }
 

package/dist/collection/components/tooltip/tooltip.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-beta.89
+ * v1.0.0-beta.91
  */
 import { Component, Element, Host, Method, Prop, State, Watch, h } from "@stencil/core";
 import { CSS, ARIA_DESCRIBED_BY } from "./resources";
@@ -36,7 +36,12 @@ export class Tooltip {
      * When true, the component is open.
      */
     this.open = false;
-    /** Describes the positioning type to use for the overlaid content. If the `referenceElement` 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 component will be positioned relative to the `referenceElement`.
@@ -284,7 +289,7 @@ export class Tooltip {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "Describes the positioning type to use for the overlaid content. If the `referenceElement` is in a fixed container, use the \"fixed\" value."
+        "text": "Determines the type of positioning to use for the overlaid content.\n\nUsing 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\"."
       },
       "attribute": "overlay-positioning",
       "reflect": false,

package/dist/collection/components/tooltip-manager/tooltip-manager.css

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

package/dist/collection/components/tooltip-manager/tooltip-manager.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-beta.89
+ * v1.0.0-beta.91
  */
 import { Component, h, Prop } from "@stencil/core";
 /**

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

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.89
+ * v1.0.0-beta.91
  */
 export var TreeSelectionMode;
 (function (TreeSelectionMode) {

package/dist/collection/components/tree/tree.css

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

package/dist/collection/components/tree/tree.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-beta.89
+ * v1.0.0-beta.91
  */
 import { Component, Element, Prop, Host, Event, Listen, h } from "@stencil/core";
-import { focusElement, nodeListToArray } from "../../utils/dom";
+import { focusElement, getRootNode, nodeListToArray } from "../../utils/dom";
 import { TreeSelectionMode } from "./interfaces";
 /**
  * @slot - A slot for `calcite-tree-item` elements.
@@ -184,7 +184,7 @@ export class Tree {
           if (!target.hasChildren) {
             break;
           }
-          if (target.expanded && document.activeElement === target) {
+          if (target.expanded && getRootNode(this.el).activeElement === target) {
             // When focus is on an open node, moves focus to the first child node.
             (_a = target.querySelector("calcite-tree-item")) === null || _a === void 0 ? void 0 : _a.focus();
             event.preventDefault();
@@ -374,7 +374,7 @@ export class Tree {
       "method": "calciteTreeSelect",
       "name": "calciteTreeSelect",
       "bubbles": true,
-      "cancelable": true,
+      "cancelable": false,
       "composed": true,
       "docs": {
         "tags": [{

package/dist/collection/components/tree-item/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-beta.89
+ * v1.0.0-beta.91
  */
 export {};

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

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

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

@@ -75,7 +75,7 @@
 }
 
 :host([hidden]) {
-  display: none;
+  display: none !important;
 }
 
 :host {
@@ -135,6 +135,7 @@
 :host([lines]) .children-container:after {
   position: absolute;
   inset-block-start: 0px;
+  z-index: 1;
   inline-size: 1px;
   transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;
   transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
@@ -145,7 +146,6 @@
   block-size: 96%;
   content: "";
   background-color: var(--calcite-ui-border-2);
-  z-index: -1;
 }
 
 :host(:not([lines])) .node-container:after {

package/dist/collection/components/tree-item/tree-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-beta.89
+ * v1.0.0-beta.91
  */
 import { Component, Element, Prop, Host, Event, Listen, Watch, h } from "@stencil/core";
 import { TreeSelectionMode } from "../tree/interfaces";
@@ -440,7 +440,7 @@ export class TreeItem {
       "method": "calciteInternalTreeItemSelect",
       "name": "calciteInternalTreeItemSelect",
       "bubbles": true,
-      "cancelable": true,
+      "cancelable": false,
       "composed": true,
       "docs": {
         "tags": [{

package/dist/collection/components/value-list/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-beta.89
+ * v1.0.0-beta.91
  */
 export {};

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

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

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

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.89
+ * v1.0.0-beta.91
  */
 import { getItemIndex } from "../pick-list/shared-list-logic";
 export function getScreenReaderText(item, status, valueList) {

package/dist/collection/components/value-list/value-list.css

@@ -75,7 +75,7 @@
 }
 
 :host([hidden]) {
-  display: none;
+  display: none !important;
 }
 
 :host([disabled]) {
@@ -127,7 +127,7 @@ calcite-value-list-item:last-of-type {
 :host([filter-enabled]) header.sticky-pos {
   position: sticky;
   inset-block-start: 0px;
-  z-index: 10;
+  z-index: 300;
 }
 
 calcite-filter {

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

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.89
+ * v1.0.0-beta.91
  */
 import Sortable from "sortablejs";
 import { Component, Element, Event, h, Listen, Method, Prop, State } from "@stencil/core";
@@ -456,7 +456,7 @@ export class ValueList {
       "method": "calciteListChange",
       "name": "calciteListChange",
       "bubbles": true,
-      "cancelable": true,
+      "cancelable": false,
       "composed": true,
       "docs": {
         "tags": [],
@@ -478,7 +478,7 @@ export class ValueList {
       "method": "calciteListOrderChange",
       "name": "calciteListOrderChange",
       "bubbles": true,
-      "cancelable": true,
+      "cancelable": false,
       "composed": true,
       "docs": {
         "tags": [],

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

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

package/dist/collection/components/value-list-item/value-list-item.css

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

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

@@ -1,14 +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-beta.89
+ * v1.0.0-beta.91
  */
 import { Component, Element, Event, h, Host, Listen, Method, Prop } from "@stencil/core";
 import { ICON_TYPES } from "../pick-list/resources";
 import { guid } from "../../utils/guid";
-import { CSS } from "../pick-list-item/resources";
+import { CSS, SLOTS as PICK_LIST_SLOTS } from "../pick-list-item/resources";
 import { ICONS, SLOTS } from "./resources";
-import { SLOTS as PICK_LIST_SLOTS } from "../pick-list-item/resources";
 import { getSlotted } from "../../utils/dom";
 import { connectConditionalSlotComponent, disconnectConditionalSlotComponent } from "../../utils/conditionalSlot";
 import { updateHostInteraction } from "../../utils/interactive";

package/dist/collection/demos/_assets/demo-form.js

@@ -0,0 +1,22 @@
+class DemoForm extends HTMLElement {
+    connectedCallback() {
+        this.addEventListener("submit", this.onFormSubmit);
+        this.addEventListener("formdata", this.onFormData);
+    }
+    disconnectedCallback() {
+        this.removeEventListener("submit", this.onFormSubmit);
+        this.removeEventListener("formdata", this.onFormData);
+    }
+    onFormSubmit(event) {
+        event.preventDefault();
+        new FormData(event.target);
+    }
+    onFormData(event) {
+        const data = {};
+        for (const pair of event.formData.entries()) {
+            data[pair[0]] = pair[1];
+        }
+        console.log(data);
+    }
+}
+customElements.define("demo-form", DemoForm);

package/dist/collection/demos/_assets/demo-spacer.js

@@ -0,0 +1,17 @@
+class DemoSpacer extends HTMLElement {
+    constructor() {
+        super();
+        this.attachShadow({ mode: "open" });
+        this.shadowRoot.innerHTML = `
+          <style>
+            :host {
+              display: grid;
+              grid-template-columns: 1fr;
+              grid-gap: ${this.getAttribute("gap") || "12px"};
+            }
+          </style>
+          <slot></slot>
+        `;
+    }
+}
+customElements.define("demo-spacer", DemoSpacer);