@esri/calcite-components 1.0.0-beta.83 → 1.0.0-beta.84

package/dist/collection/components/panel/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.83
+ * v1.0.0-beta.84
  */
 export const CSS = {
   backButton: "back-button",
@@ -9,6 +9,7 @@ export const CSS = {
   header: "header",
   heading: "heading",
   summary: "summary",
+  description: "description",
   headerContent: "header-content",
   headerActions: "header-actions",
   headerActionsEnd: "header-actions--end",

package/dist/collection/components/pick-list/pick-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.83
+ * v1.0.0-beta.84
  */
 import { Component, Element, Event, Listen, Method, Prop, State, h } from "@stencil/core";
 import { ICON_TYPES } from "./resources";
@@ -10,8 +10,8 @@ import List from "./shared-list-render";
 import { createObserver } from "../../utils/observers";
 import { updateHostInteraction } from "../../utils/interactive";
 /**
- * @slot - A slot for adding `calcite-pick-list-item` elements or `calcite-pick-list-group` elements. Items are displayed as a vertical list.
- * @slot menu-actions - A slot for adding a button + menu combo for performing actions like sorting.
+ * @slot - A slot for adding `calcite-pick-list-item` or `calcite-pick-list-group` elements. Items are displayed as a vertical list.
+ * @slot menu-actions - A slot for adding a button and menu combination for performing actions, such as sorting.
  */
 export class PickList {
   constructor() {
@@ -21,7 +21,7 @@ export class PickList {
     //
     // --------------------------------------------------------------------------
     /**
-     * When true, disabled prevents interaction. This state shows items with lower opacity/grayed.
+     * When true, interaction is prevented and the component is displayed with lower opacity.
      */
     this.disabled = false;
     /**
@@ -29,18 +29,18 @@ export class PickList {
      */
     this.filterEnabled = false;
     /**
-     * When true, content is waiting to be loaded. This state shows a busy indicator.
+     * When true, a busy indicator is displayed.
      */
     this.loading = false;
     /**
-     * Multiple works similar to standard radio buttons and checkboxes.
-     * When true, a user can select multiple items at a time.
-     * When false, only a single item can be selected at a time
-     * and selecting a new item will deselect any other selected items.
+     * Similar to standard radio buttons and checkboxes.
+     * When true, a user can select multiple `calcite-pick-list-item`s at a time.
+     * When false, only a single `calcite-pick-list-item` can be selected at a time,
+     * and a new selection will deselect previous selections.
      */
     this.multiple = false;
     /**
-     * When true and single-selection is enabled, the selection will change when navigating items via the keyboard.
+     * When true and single-selection is enabled, the selection changes when navigating `calcite-pick-list-item`s via keyboard.
      */
     this.selectionFollowsFocus = false;
     // --------------------------------------------------------------------------
@@ -112,7 +112,7 @@ export class PickList {
   //  Public Methods
   //
   // --------------------------------------------------------------------------
-  /** Returns the currently selected items */
+  /** Returns the component's selected `calcite-pick-list-item`s. */
   async getSelectedItems() {
     return this.selectedValues;
   }
@@ -156,7 +156,7 @@ export class PickList {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "When true, disabled prevents interaction. This state shows items with lower opacity/grayed."
+        "text": "When true, interaction is prevented and the component is displayed with lower opacity."
       },
       "attribute": "disabled",
       "reflect": true,
@@ -214,7 +214,7 @@ export class PickList {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "Number at which section headings should start for this component."
+        "text": "Specifies the number at which section headings should start."
       },
       "attribute": "heading-level",
       "reflect": false
@@ -231,7 +231,7 @@ export class PickList {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "When true, content is waiting to be loaded. This state shows a busy indicator."
+        "text": "When true, a busy indicator is displayed."
       },
       "attribute": "loading",
       "reflect": true,
@@ -249,7 +249,7 @@ export class PickList {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "Multiple works similar to standard radio buttons and checkboxes.\nWhen true, a user can select multiple items at a time.\nWhen false, only a single item can be selected at a time\nand selecting a new item will deselect any other selected items."
+        "text": "Similar to standard radio buttons and checkboxes.\nWhen true, a user can select multiple `calcite-pick-list-item`s at a time.\nWhen false, only a single `calcite-pick-list-item` can be selected at a time,\nand a new selection will deselect previous selections."
       },
       "attribute": "multiple",
       "reflect": true,
@@ -267,7 +267,7 @@ export class PickList {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "When true and single-selection is enabled, the selection will change when navigating items via the keyboard."
+        "text": "When true and single-selection is enabled, the selection changes when navigating `calcite-pick-list-item`s via keyboard."
       },
       "attribute": "selection-follows-focus",
       "reflect": false,
@@ -286,7 +286,7 @@ export class PickList {
       "composed": true,
       "docs": {
         "tags": [],
-        "text": "Emitted when any of the item selections have changed."
+        "text": "Emits when any of the `calcite-pick-list-item` selections have changed."
       },
       "complexType": {
         "original": "Map<string, HTMLCalcitePickListItemElement>",
@@ -320,7 +320,7 @@ export class PickList {
         "return": "Promise<Map<string, HTMLCalcitePickListItemElement>>"
       },
       "docs": {
-        "text": "Returns the currently selected items",
+        "text": "Returns the component's selected `calcite-pick-list-item`s.",
         "tags": []
       }
     },

package/dist/collection/components/pick-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.83
+ * v1.0.0-beta.84
  */
 export const CSS = {
   sticky: "sticky-pos"

package/dist/collection/components/pick-list/shared-list-logic.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.83
+ * v1.0.0-beta.84
  */
 import { debounce } from "lodash-es";
 import { focusElement, getSlotted } from "../../utils/dom";

package/dist/collection/components/pick-list/shared-list-render.js

@@ -1,26 +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-beta.83
+ * v1.0.0-beta.84
  */
-var __rest = (this && this.__rest) || function (s, e) {
-  var t = {};
-  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-    t[p] = s[p];
-  if (s != null && typeof Object.getOwnPropertySymbols === "function")
-    for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-      if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-        t[p[i]] = s[p[i]];
-    }
-  return t;
-};
 import { h, Host } from "@stencil/core";
 import { toAriaBoolean } from "../../utils/dom";
 import { CSS, SLOTS } from "./resources";
-export const List = (_a) => {
-  var { props: { disabled, loading, filterEnabled, dataForFilter, handleFilter, filterPlaceholder, setFilterEl } } = _a, rest = __rest(_a, ["props"]);
+export const List = ({ props: { disabled, loading, filterEnabled, dataForFilter, handleFilter, filterPlaceholder, setFilterEl }, ...rest }) => {
   const defaultSlot = h("slot", null);
-  return (h(Host, Object.assign({ "aria-busy": toAriaBoolean(loading), role: "menu" }, rest),
+  return (h(Host, { "aria-busy": toAriaBoolean(loading), role: "menu", ...rest },
     h("section", null,
       h("header", { class: { [CSS.sticky]: true } },
         filterEnabled ? (h("calcite-filter", { "aria-label": filterPlaceholder, disabled: loading || disabled, items: dataForFilter, onCalciteFilterChange: handleFilter, placeholder: filterPlaceholder, ref: setFilterEl })) : null,

package/dist/collection/components/pick-list-group/pick-list-group.css

@@ -130,7 +130,8 @@ h3.heading {
   line-height: 1.25rem;
 }
 
-h4.heading, h5.heading {
+h4.heading, 
+h5.heading {
   font-size: var(--calcite-font-size--1);
   line-height: 1rem;
 }

package/dist/collection/components/pick-list-group/pick-list-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.83
+ * v1.0.0-beta.84
  */
 import { Component, Element, Prop, h, Fragment } from "@stencil/core";
 import { CSS, SLOTS } from "./resources";
@@ -68,7 +68,7 @@ export class PickListGroup {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "The title used for all nested `calcite-pick-list` rows."
+        "text": "Specifies the title for all nested `calcite-pick-list-item`s."
       },
       "attribute": "group-title",
       "reflect": true
@@ -90,7 +90,7 @@ export class PickListGroup {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "Number at which section headings should start for this component."
+        "text": "Specifies the number at which section headings should start."
       },
       "attribute": "heading-level",
       "reflect": false

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

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

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

@@ -119,7 +119,8 @@
   background-color: var(--calcite-ui-foreground-1);
 }
 
-:host([non-interactive]) .label, :host([non-interactive]) .icon{
+:host([non-interactive]) .label, 
+:host([non-interactive]) .icon{
   pointer-events: none;
 }
 

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

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.83
+ * v1.0.0-beta.84
  */
 import { Component, Element, Event, Fragment, h, Method, Prop, Watch } from "@stencil/core";
 import { CSS, ICONS, SLOTS, TEXT } from "./resources";
@@ -10,17 +10,17 @@ import { getSlotted, toAriaBoolean } from "../../utils/dom";
 import { connectConditionalSlotComponent, disconnectConditionalSlotComponent } from "../../utils/conditionalSlot";
 import { updateHostInteraction } from "../../utils/interactive";
 /**
- * @slot actions-end - a slot for adding actions or content to the end side of the item.
- * @slot actions-start - a slot for adding actions or content to the start side of the item.
+ * @slot actions-end - A slot for adding actions or content to the end side of the component.
+ * @slot actions-start - A slot for adding actions or content to the start side of the component.
  */
 export class PickListItem {
   constructor() {
     /**
-     * When true, the item cannot be clicked and is visually muted.
+     * When true, interaction is prevented and the component is displayed with lower opacity.
      */
     this.disabled = false;
     /**
-     * When false, the item cannot be deselected by user interaction.
+     * When false, the component cannot be deselected by user interaction.
      */
     this.disableDeselect = false;
     /**
@@ -34,15 +34,15 @@ export class PickListItem {
      */
     this.icon = null;
     /**
-     * Set this to true to display a remove action that removes the item from the list.
+     * When true, displays a remove action that removes the item from the list.
      */
     this.removable = false;
     /**
-     * Set this to true to pre-select an item. Toggles when an item is checked/unchecked.
+     * When true, selects an item. Toggles when an item is checked/unchecked.
      */
     this.selected = false;
     /**
-     * Used as an accessible label (aria-label) for the "remove item" action. Only applicable if removable is true.
+     * Accessible name for the component's remove button. Only applicable if removable is "true".
      *
      * @default "Remove"
      */
@@ -113,7 +113,7 @@ export class PickListItem {
   //
   // --------------------------------------------------------------------------
   /**
-   * Used to toggle the selection state. By default this won't trigger an event.
+   * Toggles the selection state. By default this won't trigger an event.
    * The first argument allows the value to be coerced, rather than swapping values.
    *
    * @param coerce
@@ -189,7 +189,7 @@ export class PickListItem {
       "optional": true,
       "docs": {
         "tags": [],
-        "text": "An optional description for this item.  This will appear below the label text."
+        "text": "A description for the component that displays below the label text."
       },
       "attribute": "description",
       "reflect": true
@@ -206,7 +206,7 @@ export class PickListItem {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "When true, the item cannot be clicked and is visually muted."
+        "text": "When true, interaction is prevented and the component is displayed with lower opacity."
       },
       "attribute": "disabled",
       "reflect": true,
@@ -224,7 +224,7 @@ export class PickListItem {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "When false, the item cannot be deselected by user interaction."
+        "text": "When false, the component cannot be deselected by user interaction."
       },
       "attribute": "disable-deselect",
       "reflect": false,
@@ -289,7 +289,7 @@ export class PickListItem {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "The main label for this item. This will appear next to the icon."
+        "text": "Label and accessible name for the component. Appears next to the icon."
       },
       "attribute": "label",
       "reflect": true
@@ -310,7 +310,7 @@ export class PickListItem {
       "optional": true,
       "docs": {
         "tags": [],
-        "text": "Used to provide additional metadata to an item, primarily used when the parent list has a filter."
+        "text": "Provides additional metadata to the component. Primary use is for a filter on the parent list."
       }
     },
     "removable": {
@@ -325,7 +325,7 @@ export class PickListItem {
       "optional": true,
       "docs": {
         "tags": [],
-        "text": "Set this to true to display a remove action that removes the item from the list."
+        "text": "When true, displays a remove action that removes the item from the list."
       },
       "attribute": "removable",
       "reflect": true,
@@ -343,7 +343,7 @@ export class PickListItem {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "Set this to true to pre-select an item. Toggles when an item is checked/unchecked."
+        "text": "When true, selects an item. Toggles when an item is checked/unchecked."
       },
       "attribute": "selected",
       "reflect": true,
@@ -364,7 +364,7 @@ export class PickListItem {
             "name": "default",
             "text": "\"Remove\""
           }],
-        "text": "Used as an accessible label (aria-label) for the \"remove item\" action. Only applicable if removable is true."
+        "text": "Accessible name for the component's remove button. Only applicable if removable is \"true\"."
       },
       "attribute": "intl-remove",
       "reflect": true,
@@ -382,7 +382,7 @@ export class PickListItem {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "The item's associated value."
+        "text": "The component's value."
       },
       "attribute": "value",
       "reflect": false
@@ -396,7 +396,7 @@ export class PickListItem {
       "composed": true,
       "docs": {
         "tags": [],
-        "text": "Emitted whenever the item is selected or unselected."
+        "text": "Fires when the component is selected or unselected."
       },
       "complexType": {
         "original": "{\n    item: HTMLCalcitePickListItemElement;\n    value: any;\n    selected: boolean;\n    shiftPressed: boolean;\n  }",
@@ -415,7 +415,7 @@ export class PickListItem {
       "composed": true,
       "docs": {
         "tags": [],
-        "text": "Emitted whenever the remove button is pressed."
+        "text": "Fires when the remove button is pressed."
       },
       "complexType": {
         "original": "void",
@@ -433,7 +433,7 @@ export class PickListItem {
             "name": "internal",
             "text": undefined
           }],
-        "text": "Emitted whenever the the item's label, description, value or metadata properties are modified."
+        "text": "Emits when the the component's label, description, value, or metadata properties are modified."
       },
       "complexType": {
         "original": "void",
@@ -451,7 +451,7 @@ export class PickListItem {
             "name": "internal",
             "text": undefined
           }],
-        "text": "Emitted whenever the the item's value property is modified."
+        "text": "Emits when the the component's value property is modified."
       },
       "complexType": {
         "original": "{\n    oldValue: any;\n    newValue: any;\n  }",
@@ -478,7 +478,7 @@ export class PickListItem {
         "return": "Promise<void>"
       },
       "docs": {
-        "text": "Used to toggle the selection state. By default this won't trigger an event.\nThe first argument allows the value to be coerced, rather than swapping values.",
+        "text": "Toggles the selection state. By default this won't trigger an event.\nThe first argument allows the value to be coerced, rather than swapping values.",
         "tags": [{
             "name": "param",
             "text": "coerce"

package/dist/collection/components/pick-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.83
+ * v1.0.0-beta.84
  */
 export const CSS = {
   actions: "actions",

package/dist/collection/components/popover/PopoverManager.js

@@ -1,9 +1,8 @@
 /*!
  * 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.83
+ * v1.0.0-beta.84
  */
-import { queryElementsRoots } from "../../utils/dom";
 export default class PopoverManager {
   constructor() {
     // --------------------------------------------------------------------------
@@ -11,7 +10,7 @@ export default class PopoverManager {
     //  Private Properties
     //
     // --------------------------------------------------------------------------
-    this.registeredElements = new WeakMap();
+    this.registeredElements = new Map();
     this.registeredElementCount = 0;
     // --------------------------------------------------------------------------
     //
@@ -30,7 +29,7 @@ export default class PopoverManager {
         popover.toggle();
         return;
       }
-      queryElementsRoots(event.target, "calcite-popover")
+      Array.from(this.registeredElements.values())
         .filter((popover) => popover.autoClose && popover.open && !composedPath.includes(popover))
         .forEach((popover) => popover.toggle(false));
     };

package/dist/collection/components/popover/popover.css

@@ -244,6 +244,7 @@
   border-end-end-radius: 0.25rem;
 }
 
-::slotted(calcite-panel), ::slotted(calcite-flow) {
+::slotted(calcite-panel), 
+::slotted(calcite-flow) {
   height: 100%;
 }