@esri/calcite-components 1.0.0-next.647 → 1.0.0-next.648

package/dist/collection/components/dropdown/dropdown.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.647
+ * v1.0.0-next.648
  */
 import { h, Host } from "@stencil/core";
 import { focusElement, isPrimaryPointerButton, toAriaBoolean } from "../../utils/dom";
@@ -18,56 +18,6 @@ import { isActivationKey } from "../../utils/key";
  */
 export class Dropdown {
   constructor() {
-    //--------------------------------------------------------------------------
-    //
-    //  Public Properties
-    //
-    //--------------------------------------------------------------------------
-    /**
-     * Opens or closes the dropdown
-     *
-     * @deprecated use open instead.
-     */
-    this.active = false;
-    /** When true, opens the dropdown */
-    this.open = false;
-    /**
-     allow the dropdown to remain open after a selection is made
-     if the selection-mode of the selected item's containing group is "none", the dropdown will always close
-     */
-    this.disableCloseOnSelect = false;
-    /** is the dropdown disabled  */
-    this.disabled = false;
-    /**
-     specify the maximum number of calcite-dropdown-items to display before showing the scroller, must be greater than 0 -
-     this value does not include groupTitles passed to calcite-dropdown-group
-     */
-    this.maxItems = 0;
-    /**
-     * Determines the type of positioning to use for the overlaid content.
-     *
-     * Using `"absolute"` will work for most cases. The component will be positioned inside of overflowing parent containers and will affect the container's layout.
-     *
-     * `"fixed"` 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.
-     *
-     * @default "bottom-start"
-     */
-    this.placement = defaultMenuPlacement;
-    /** specify the scale of dropdown, defaults to m */
-    this.scale = "m";
-    /**
-     * **read-only** The currently selected items
-     *
-     * @readonly
-     */
-    this.selectedItems = [];
-    /** specify whether the dropdown is opened by hover or click of a trigger element */
-    this.type = "click";
     this.items = [];
     this.groups = [];
     this.mutationObserver = createObserver("mutation", () => this.updateItems());
@@ -199,6 +149,18 @@ export class Dropdown {
         this.el.addEventListener("calciteDropdownOpen", this.toggleOpenEnd);
       }
     };
+    this.active = false;
+    this.open = false;
+    this.disableCloseOnSelect = false;
+    this.disabled = false;
+    this.flipPlacements = undefined;
+    this.maxItems = 0;
+    this.overlayPositioning = "absolute";
+    this.placement = defaultMenuPlacement;
+    this.scale = "m";
+    this.selectedItems = [];
+    this.type = "click";
+    this.width = undefined;
   }
   activeHandler(value) {
     this.open = value;
@@ -473,9 +435,9 @@ export class Dropdown {
         "docs": {
           "tags": [{
               "name": "deprecated",
-              "text": "use open instead."
+              "text": "use `open` instead."
             }],
-          "text": "Opens or closes the dropdown"
+          "text": "When `true`, displays and positions the component."
         },
         "attribute": "active",
         "reflect": true,
@@ -493,7 +455,7 @@ export class Dropdown {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "When true, opens the dropdown"
+          "text": "When `true`, displays and positions the component."
         },
         "attribute": "open",
         "reflect": true,
@@ -511,7 +473,7 @@ export class Dropdown {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "allow the dropdown to remain open after a selection is made\nif the selection-mode of the selected item's containing group is \"none\", the dropdown will always close"
+          "text": "When `true`, the component will remain open after a selection is made.\n\nIf the `selectionMode` of the selected `calcite-dropdown-item`'s containing `calcite-dropdown-group` is `\"none\"`, the component will always close."
         },
         "attribute": "disable-close-on-select",
         "reflect": true,
@@ -529,7 +491,7 @@ export class Dropdown {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "is the dropdown disabled"
+          "text": "When `true`, interaction is prevented and the component is displayed with lower opacity."
         },
         "attribute": "disabled",
         "reflect": true,
@@ -549,7 +511,7 @@ export class Dropdown {
           }
         },
         "required": false,
-        "optional": true,
+        "optional": false,
         "docs": {
           "tags": [],
           "text": "Defines the available placements that can be used when a flip occurs."
@@ -567,7 +529,7 @@ export class Dropdown {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "specify the maximum number of calcite-dropdown-items to display before showing the scroller, must be greater than 0 -\nthis value does not include groupTitles passed to calcite-dropdown-group"
+          "text": "Specifies the maximum number of `calcite-dropdown-item`s to display before showing a scroller.\nValue must be greater than `0`, and does not include `groupTitle`'s from `calcite-dropdown-group`."
         },
         "attribute": "max-items",
         "reflect": true,
@@ -616,7 +578,7 @@ export class Dropdown {
               "name": "default",
               "text": "\"bottom-start\""
             }],
-          "text": "Determines where the dropdown will be positioned relative to the button."
+          "text": "Determines where the component will be positioned relative to the container element."
         },
         "attribute": "placement",
         "reflect": true,
@@ -639,7 +601,7 @@ export class Dropdown {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "specify the scale of dropdown, defaults to m"
+          "text": "Specifies the size of the component."
         },
         "attribute": "scale",
         "reflect": true,
@@ -664,7 +626,7 @@ export class Dropdown {
               "name": "readonly",
               "text": undefined
             }],
-          "text": "**read-only** The currently selected items"
+          "text": "Specifies the component's selected items."
         },
         "defaultValue": "[]"
       },
@@ -680,7 +642,7 @@ export class Dropdown {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "specify whether the dropdown is opened by hover or click of a trigger element"
+          "text": "Specifies the action to open the component from the container element."
         },
         "attribute": "type",
         "reflect": true,
@@ -700,10 +662,10 @@ export class Dropdown {
           }
         },
         "required": false,
-        "optional": true,
+        "optional": false,
         "docs": {
           "tags": [],
-          "text": "specify the width of dropdown"
+          "text": "Specifies the width of the component."
         },
         "attribute": "width",
         "reflect": true
@@ -719,7 +681,7 @@ export class Dropdown {
         "composed": true,
         "docs": {
           "tags": [],
-          "text": "fires when a dropdown item has been selected or deselected"
+          "text": "Fires when a `calcite-dropdown-item`'s selection changes."
         },
         "complexType": {
           "original": "Selection",

package/dist/collection/components/dropdown/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.647
+ * v1.0.0-next.648
  */
 export const SLOTS = {
   dropdownTrigger: "dropdown-trigger"

package/dist/collection/components/dropdown-group/dropdown-group.js

@@ -1,21 +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.647
+ * v1.0.0-next.648
  */
 import { h, Host } from "@stencil/core";
 import { getElementProp } from "../../utils/dom";
 import { CSS } from "./resources";
 /**
- * @slot - A slot for adding `calcite-dropdown-item` components.
+ * @slot - A slot for adding `calcite-dropdown-item`s.
  */
 export class DropdownGroup {
   constructor() {
-    /**
-      specify the selection mode - multiple (allow any number of (or no) active items), single (allow and require one active item),
-     none (no active items), defaults to single
-     */
+    this.groupTitle = undefined;
     this.selectionMode = "single";
+    this.scale = undefined;
   }
   //--------------------------------------------------------------------------
   //
@@ -80,10 +78,10 @@ export class DropdownGroup {
           "references": {}
         },
         "required": false,
-        "optional": true,
+        "optional": false,
         "docs": {
           "tags": [],
-          "text": "optionally set a group title for display"
+          "text": "Specifies and displays a group title."
         },
         "attribute": "group-title",
         "reflect": true
@@ -105,7 +103,7 @@ export class DropdownGroup {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "specify the selection mode - multiple (allow any number of (or no) active items), single (allow and require one active item),\nnone (no active items), defaults to single"
+          "text": "Specifies the component's selection mode, where\n`\"multi\"` allows any number of (or no) selected `calcite-dropdown-item`s,\n`\"single\"` allows and requires one selected `calcite-dropdown-item`, and\n`\"none\"` does not allow selection on `calcite-dropdown-item`s."
         },
         "attribute": "selection-mode",
         "reflect": true,
@@ -128,7 +126,7 @@ export class DropdownGroup {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "Specifies the size of the action."
+          "text": "Specifies the size of the component."
         },
         "attribute": "scale",
         "reflect": true

package/dist/collection/components/dropdown-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-next.647
+ * v1.0.0-next.648
  */
 export const CSS = {
   containerSmall: "container--s",

package/dist/collection/components/dropdown-item/dropdown-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.647
+ * v1.0.0-next.648
  */
 import { h, Host } from "@stencil/core";
 import { getElementProp, toAriaBoolean } from "../../utils/dom";
@@ -12,19 +12,15 @@ import { setUpLoadableComponent, setComponentLoaded, componentLoaded } from "../
  */
 export class DropdownItem {
   constructor() {
-    //--------------------------------------------------------------------------
-    //
-    //  Public Properties
-    //
-    //--------------------------------------------------------------------------
-    /**
-     * Indicates whether the item is active.
-     *
-     * @deprecated Use selected instead.
-     */
     this.active = false;
-    /** When true, item is selected  */
     this.selected = false;
+    this.iconFlipRtl = undefined;
+    this.iconStart = undefined;
+    this.iconEnd = undefined;
+    this.href = undefined;
+    this.label = undefined;
+    this.rel = undefined;
+    this.target = undefined;
   }
   activeHandler(value) {
     this.selected = value;
@@ -206,9 +202,9 @@ export class DropdownItem {
         "docs": {
           "tags": [{
               "name": "deprecated",
-              "text": "Use selected instead."
+              "text": "Use `selected` instead."
             }],
-          "text": "Indicates whether the item is active."
+          "text": "When `true`, the component is selected."
         },
         "attribute": "active",
         "reflect": true,
@@ -226,7 +222,7 @@ export class DropdownItem {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "When true, item is selected"
+          "text": "When `true`, the component is selected."
         },
         "attribute": "selected",
         "reflect": true,
@@ -246,10 +242,10 @@ export class DropdownItem {
           }
         },
         "required": false,
-        "optional": true,
+        "optional": false,
         "docs": {
           "tags": [],
-          "text": "When true, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`)."
+          "text": "When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`)."
         },
         "attribute": "icon-flip-rtl",
         "reflect": true
@@ -263,7 +259,7 @@ export class DropdownItem {
           "references": {}
         },
         "required": false,
-        "optional": true,
+        "optional": false,
         "docs": {
           "tags": [],
           "text": "Specifies an icon to display at the start of the component."
@@ -280,7 +276,7 @@ export class DropdownItem {
           "references": {}
         },
         "required": false,
-        "optional": true,
+        "optional": false,
         "docs": {
           "tags": [],
           "text": "Specifies an icon to display at the end of the component."
@@ -297,10 +293,10 @@ export class DropdownItem {
           "references": {}
         },
         "required": false,
-        "optional": true,
+        "optional": false,
         "docs": {
           "tags": [],
-          "text": "optionally pass a href - used to determine if the component should render as anchor"
+          "text": "Specifies the URL of the linked resource, which can be set as an absolute or relative path.\n\nDetermines if the component will render as an anchor."
         },
         "attribute": "href",
         "reflect": true
@@ -314,10 +310,10 @@ export class DropdownItem {
           "references": {}
         },
         "required": false,
-        "optional": true,
+        "optional": false,
         "docs": {
           "tags": [],
-          "text": "Applies to the aria-label attribute on the button or hyperlink"
+          "text": "Accessible name for the component."
         },
         "attribute": "label",
         "reflect": false
@@ -331,10 +327,10 @@ export class DropdownItem {
           "references": {}
         },
         "required": false,
-        "optional": true,
+        "optional": false,
         "docs": {
           "tags": [],
-          "text": "The rel attribute to apply to the hyperlink"
+          "text": "Specifies the relationship to the linked document defined in `href`."
         },
         "attribute": "rel",
         "reflect": true
@@ -348,10 +344,10 @@ export class DropdownItem {
           "references": {}
         },
         "required": false,
-        "optional": true,
+        "optional": false,
         "docs": {
           "tags": [],
-          "text": "The target attribute to apply to the hyperlink"
+          "text": "Specifies the frame or window to open the linked document."
         },
         "attribute": "target",
         "reflect": true

package/dist/collection/components/dropdown-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-next.647
+ * v1.0.0-next.648
  */
 export const CSS = {
   containerLink: "container--link",

package/dist/collection/components/fab/fab.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.647
+ * v1.0.0-next.648
  */
 import { h } from "@stencil/core";
 import { CSS, ICONS } from "./resources";
@@ -10,40 +10,14 @@ import { updateHostInteraction } from "../../utils/interactive";
 import { setUpLoadableComponent, setComponentLoaded, componentLoaded } from "../../utils/loadable";
 export class Fab {
   constructor() {
-    // --------------------------------------------------------------------------
-    //
-    //  Properties
-    //
-    // --------------------------------------------------------------------------
-    /**
-     * Used to set the button's appearance. Default is outline.
-     */
     this.appearance = "outline";
-    /**
-     * Used to set the button's color. Default is light.
-     */
     this.color = "neutral";
-    /**
-     * When true, disabled prevents interaction. This state shows items with lower opacity/grayed.
-     */
     this.disabled = false;
-    /**
-     * Specifies an icon to display.
-     *
-     * @default "plus"
-     */
     this.icon = ICONS.plus;
-    /**
-     * When true, content is waiting to be loaded. This state shows a busy indicator.
-     */
+    this.label = undefined;
     this.loading = false;
-    /**
-     * Specifies the size of the fab.
-     */
     this.scale = "m";
-    /**
-     * Indicates whether the text is displayed.
-     */
+    this.text = undefined;
     this.textEnabled = false;
   }
   //--------------------------------------------------------------------------
@@ -116,7 +90,7 @@ export class Fab {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "Used to set the button's appearance. Default is outline."
+          "text": "Specifies the appearance style of the component."
         },
         "attribute": "appearance",
         "reflect": true,
@@ -139,7 +113,7 @@ export class Fab {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "Used to set the button's color. Default is light."
+          "text": "Specifies the color of the component."
         },
         "attribute": "color",
         "reflect": true,
@@ -157,7 +131,7 @@ export class Fab {
         "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,
@@ -172,7 +146,7 @@ export class Fab {
           "references": {}
         },
         "required": false,
-        "optional": true,
+        "optional": false,
         "docs": {
           "tags": [{
               "name": "default",
@@ -193,10 +167,10 @@ export class Fab {
           "references": {}
         },
         "required": false,
-        "optional": true,
+        "optional": false,
         "docs": {
           "tags": [],
-          "text": "Label of the FAB, exposed on hover when textEnabled is false. If no label is provided, the label inherits what's provided for the `text` prop."
+          "text": "Accessible name for the component."
         },
         "attribute": "label",
         "reflect": false
@@ -213,7 +187,7 @@ export class Fab {
         "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,
@@ -236,7 +210,7 @@ export class Fab {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "Specifies the size of the fab."
+          "text": "Specifies the size of the component."
         },
         "attribute": "scale",
         "reflect": true,
@@ -251,10 +225,10 @@ export class Fab {
           "references": {}
         },
         "required": false,
-        "optional": true,
+        "optional": false,
         "docs": {
           "tags": [],
-          "text": "Text that accompanies the FAB icon."
+          "text": "Specifies text to accompany the component's icon."
         },
         "attribute": "text",
         "reflect": false
@@ -271,7 +245,7 @@ export class Fab {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "Indicates whether the text is displayed."
+          "text": "When `true`, displays the `text` value in the component."
         },
         "attribute": "text-enabled",
         "reflect": true,

package/dist/collection/components/fab/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.647
+ * v1.0.0-next.648
  */
 export const CSS = {
   button: "button"