@esri/calcite-components 1.0.0-next.686 → 1.0.0-next.688

package/dist/collection/components/action-bar/action-bar.js

@@ -1,12 +1,12 @@
 /*!
  * 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.686
+ * v1.0.0-next.688
  */
 import { Host, h } from "@stencil/core";
 import { ExpandToggle, toggleChildActionText } from "../functional/ExpandToggle";
 import { CSS, SLOTS } from "./resources";
-import { getSlotted, focusElement } from "../../utils/dom";
+import { getSlotted } from "../../utils/dom";
 import { geActionDimensions, getOverflowCount, overflowActions, queryActions, overflowActionsDebounceInMs } from "./utils";
 import { createObserver } from "../../utils/observers";
 import { debounce } from "lodash-es";
@@ -164,15 +164,9 @@ export class ActionBar {
   }
   /**
    * Sets focus on the component.
-   *
-   * @param focusId
    */
-  async setFocus(focusId) {
+  async setFocus() {
     await componentLoaded(this);
-    if (focusId === "expand-toggle") {
-      await focusElement(this.expandToggleEl);
-      return;
-    }
     this.el?.focus();
   }
   // --------------------------------------------------------------------------
@@ -191,6 +185,7 @@ export class ActionBar {
   }
   static get is() { return "calcite-action-bar"; }
   static get encapsulation() { return "shadow"; }
+  static get delegatesFocus() { return true; }
   static get originalStyleUrls() {
     return {
       "$": ["action-bar.scss"]
@@ -423,14 +418,8 @@ export class ActionBar {
       },
       "setFocus": {
         "complexType": {
-          "signature": "(focusId?: \"expand-toggle\") => Promise<void>",
-          "parameters": [{
-              "tags": [{
-                  "name": "param",
-                  "text": "focusId"
-                }],
-              "text": ""
-            }],
+          "signature": "() => Promise<void>",
+          "parameters": [],
           "references": {
             "Promise": {
               "location": "global"
@@ -440,10 +429,7 @@ export class ActionBar {
         },
         "docs": {
           "text": "Sets focus on the component.",
-          "tags": [{
-              "name": "param",
-              "text": "focusId"
-            }]
+          "tags": []
         }
       }
     };

package/dist/collection/components/action-bar/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.686
+ * v1.0.0-next.688
  */
 export const CSS = {
   actionGroupBottom: "action-group--bottom"

package/dist/collection/components/action-bar/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-next.686
+ * v1.0.0-next.688
  */
 import { forceUpdate } from "@stencil/core";
 import { SLOTS as ACTION_MENU_SLOTS } from "../action-menu/resources";

package/dist/collection/components/action-group/action-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.686
+ * v1.0.0-next.688
  */
 import { h } from "@stencil/core";
 import { ICONS, SLOTS } from "./resources";
@@ -83,6 +83,7 @@ export class ActionGroup {
   }
   static get is() { return "calcite-action-group"; }
   static get encapsulation() { return "shadow"; }
+  static get delegatesFocus() { return true; }
   static get originalStyleUrls() {
     return {
       "$": ["action-group.scss"]

package/dist/collection/components/action-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.686
+ * v1.0.0-next.688
  */
 export const SLOTS = {
   menuActions: "menu-actions",

package/dist/collection/components/action-menu/action-menu.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.686
+ * v1.0.0-next.688
  */
 import { h } from "@stencil/core";
 import { CSS, SLOTS, ICONS } from "./resources";

package/dist/collection/components/action-menu/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.686
+ * v1.0.0-next.688
  */
 export const CSS = {
   menu: "menu",

package/dist/collection/components/action-pad/action-pad.js

@@ -1,11 +1,11 @@
 /*!
  * 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.686
+ * v1.0.0-next.688
  */
 import { Host, h } from "@stencil/core";
 import { ExpandToggle, toggleChildActionText } from "../functional/ExpandToggle";
-import { focusElement, getSlotted } from "../../utils/dom";
+import { getSlotted } from "../../utils/dom";
 import { CSS, SLOTS } from "./resources";
 import { connectConditionalSlotComponent, disconnectConditionalSlotComponent } from "../../utils/conditionalSlot";
 import { connectLocalized, disconnectLocalized } from "../../utils/locale";
@@ -89,15 +89,9 @@ export class ActionPad {
   // --------------------------------------------------------------------------
   /**
    * Sets focus on the component.
-   *
-   * @param focusId
    */
-  async setFocus(focusId) {
+  async setFocus() {
     await componentLoaded(this);
-    if (focusId === "expand-toggle") {
-      await focusElement(this.expandToggleEl);
-      return;
-    }
     this.el?.focus();
   }
   // --------------------------------------------------------------------------
@@ -116,6 +110,7 @@ export class ActionPad {
   }
   static get is() { return "calcite-action-pad"; }
   static get encapsulation() { return "shadow"; }
+  static get delegatesFocus() { return true; }
   static get originalStyleUrls() {
     return {
       "$": ["action-pad.scss"]
@@ -308,14 +303,8 @@ export class ActionPad {
     return {
       "setFocus": {
         "complexType": {
-          "signature": "(focusId?: \"expand-toggle\") => Promise<void>",
-          "parameters": [{
-              "tags": [{
-                  "name": "param",
-                  "text": "focusId"
-                }],
-              "text": ""
-            }],
+          "signature": "() => Promise<void>",
+          "parameters": [],
           "references": {
             "Promise": {
               "location": "global"
@@ -325,10 +314,7 @@ export class ActionPad {
         },
         "docs": {
           "text": "Sets focus on the component.",
-          "tags": [{
-              "name": "param",
-              "text": "focusId"
-            }]
+          "tags": []
         }
       }
     };

package/dist/collection/components/action-pad/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.686
+ * v1.0.0-next.688
  */
 export const CSS = {
   actionGroupBottom: "action-group--bottom",

package/dist/collection/components/alert/alert.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.686
+ * v1.0.0-next.688
  */
 import { h, Host } from "@stencil/core";
 import { getSlotted, setRequestedIcon, toAriaBoolean, slotChangeHasAssignedElement } from "../../utils/dom";
@@ -59,6 +59,7 @@ export class Alert {
     this.autoCloseDuration = this.autoClose ? "medium" : null;
     this.kind = "brand";
     this.icon = undefined;
+    this.iconFlipRtl = false;
     this.label = undefined;
     this.numberingSystem = undefined;
     this.placement = "bottom";
@@ -135,7 +136,7 @@ export class Alert {
     const queueNumber = this.queueLength > 2 ? this.queueLength - 1 : 1;
     const queueText = numberStringFormatter.numberFormatter.format(queueNumber);
     const queueCount = (h("div", { class: `${this.queueLength > 1 ? "active " : ""}alert-queue-count` }, h("calcite-chip", { scale: this.scale, value: queueText }, queueText)));
-    const { open, autoClose, label, placement, queued, requestedIcon } = this;
+    const { open, autoClose, label, placement, queued, requestedIcon, iconFlipRtl } = this;
     const role = autoClose ? "alert" : "alertdialog";
     const hidden = !open;
     const slotNode = (h("slot", { key: "actionsEndSlot", name: SLOTS.actionsEnd, onSlotchange: this.actionsEndSlotChangeHandler }));
@@ -143,7 +144,7 @@ export class Alert {
         container: true,
         queued,
         [placement]: true
-      }, onPointerOut: this.autoClose && this.autoCloseTimeoutId ? this.handleMouseLeave : null, onPointerOver: this.autoClose && this.autoCloseTimeoutId ? this.handleMouseOver : null, ref: this.setTransitionEl }, requestedIcon ? (h("div", { class: "alert-icon" }, h("calcite-icon", { icon: requestedIcon, scale: this.scale === "l" ? "m" : "s" }))) : null, h("div", { class: "alert-content" }, h("slot", { name: SLOTS.title }), h("slot", { name: SLOTS.message }), h("slot", { name: SLOTS.link })), h("div", { class: CSS.actionsEnd, hidden: !hasEndActions }, slotNode), this.queueLength > 1 ? queueCount : null, closeButton, open && !queued && autoClose ? h("div", { class: "alert-dismiss-progress" }) : null)));
+      }, onPointerOut: this.autoClose && this.autoCloseTimeoutId ? this.handleMouseLeave : null, onPointerOver: this.autoClose && this.autoCloseTimeoutId ? this.handleMouseOver : null, ref: this.setTransitionEl }, requestedIcon ? (h("div", { class: "alert-icon" }, h("calcite-icon", { flipRtl: iconFlipRtl, icon: requestedIcon, scale: this.scale === "l" ? "m" : "s" }))) : null, h("div", { class: "alert-content" }, h("slot", { name: SLOTS.title }), h("slot", { name: SLOTS.message }), h("slot", { name: SLOTS.link })), h("div", { class: CSS.actionsEnd, hidden: !hasEndActions }, slotNode), this.queueLength > 1 ? queueCount : null, closeButton, open && !queued && autoClose ? h("div", { class: "alert-dismiss-progress" }) : null)));
   }
   // when an alert is opened or closed, update queue and determine active alert
   alertSync(event) {
@@ -294,7 +295,7 @@ export class Alert {
         "mutable": false,
         "complexType": {
           "original": "Kind",
-          "resolved": "\"brand\" | \"danger\" | \"info\" | \"success\" | \"warning\"",
+          "resolved": "\"brand\" | \"danger\" | \"info\" | \"inverse\" | \"neutral\" | \"success\" | \"warning\"",
           "references": {
             "Kind": {
               "location": "import",
@@ -329,6 +330,24 @@ export class Alert {
         "attribute": "icon",
         "reflect": true
       },
+      "iconFlipRtl": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`)."
+        },
+        "attribute": "icon-flip-rtl",
+        "reflect": true,
+        "defaultValue": "false"
+      },
       "label": {
         "type": "string",
         "mutable": false,

package/dist/collection/components/alert/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.686
+ * v1.0.0-next.688
  */
 export const DURATIONS = {
   slow: 14000,

package/dist/collection/components/avatar/avatar.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.686
+ * v1.0.0-next.688
  */
 import { h } from "@stencil/core";
 import { isValidHex } from "../color-picker/utils";

package/dist/collection/components/avatar/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-next.686
+ * v1.0.0-next.688
  */
 import { hexToRGB } from "../color-picker/utils";
 /**

package/dist/collection/components/block/block.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.686
+ * v1.0.0-next.688
  */
 import { h, Host } from "@stencil/core";
 import { CSS, ICONS, SLOTS } from "./resources";

package/dist/collection/components/block/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.686
+ * v1.0.0-next.688
  */
 export const CSS = {
   container: "container",

package/dist/collection/components/block-section/block-section.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.686
+ * v1.0.0-next.688
  */
 import { h, Host } from "@stencil/core";
 import { getElementDir, toAriaBoolean } from "../../utils/dom";

package/dist/collection/components/block-section/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.686
+ * v1.0.0-next.688
  */
 export const CSS = {
   content: "content",