@esri/calcite-components 1.3.0-next.0 → 1.3.0-next.10

package/dist/cjs/{sortable.esm-ee4200c6.js → sortable.esm-bbb32b43.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.3.0-next.0
+ * v1.3.0-next.10
  */
 'use strict';
 

package/dist/cjs/{t9n-9f1d14ae.js → t9n-a3a4e4d4.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.3.0-next.0
+ * v1.3.0-next.10
  */
 'use strict';
 
-const index = require('./index-b39921d4.js');
-const locale = require('./locale-61c6c3c8.js');
+const index = require('./index-36931dc8.js');
+const locale = require('./locale-49182fa6.js');
 
 const componentLangToMessageBundleCache = {};
 async function getMessageBundle(lang, component) {

package/dist/cjs/{throttle-d1f01efb.js → throttle-ca8f21c9.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.3.0-next.0
+ * v1.3.0-next.10
  */
 'use strict';
 
-const debounce = require('./debounce-d53ac1c0.js');
+const debounce = require('./debounce-b4709363.js');
 
 /** Error message constants. */
 var FUNC_ERROR_TEXT = 'Expected a function';

package/dist/cjs/{utils-93c0e5cf.js → utils-39510fb1.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.3.0-next.0
+ * v1.3.0-next.10
  */
 'use strict';
 
-const index = require('./index-b39921d4.js');
-const locale = require('./locale-61c6c3c8.js');
+const index = require('./index-36931dc8.js');
+const locale = require('./locale-49182fa6.js');
 
 /**
  * Check if date is within a min and max

package/dist/cjs/{utils-9bce2cc2.js → utils-5b2922fd.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.3.0-next.0
+ * v1.3.0-next.10
  */
 'use strict';
 

package/dist/collection/collection-manifest.json

@@ -17,6 +17,7 @@
     "./components/card/card.js",
     "./components/checkbox/checkbox.js",
     "./components/chip/chip.js",
+    "./components/chip-group/chip-group.js",
     "./components/color-picker/color-picker.js",
     "./components/color-picker-hex-input/color-picker-hex-input.js",
     "./components/color-picker-swatch/color-picker-swatch.js",
@@ -150,6 +151,11 @@
         "calcite-chip"
       ]
     },
+    {
+      "components": [
+        "calcite-chip-group"
+      ]
+    },
     {
       "components": [
         "calcite-icon"

package/dist/collection/components/accordion/accordion.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.3.0-next.0
+ * v1.3.0-next.10
  */
 import { h } from "@stencil/core";
 /**

package/dist/collection/components/accordion-item/accordion-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.3.0-next.0
+ * v1.3.0-next.10
  */
 import { h, Host } from "@stencil/core";
 import { connectConditionalSlotComponent, disconnectConditionalSlotComponent } from "../../utils/conditionalSlot";

package/dist/collection/components/accordion-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.3.0-next.0
+ * v1.3.0-next.10
  */
 export const SLOTS = {
   actionsStart: "actions-start",

package/dist/collection/components/action/action.css

@@ -97,13 +97,17 @@
 }
 
 :host([disabled]) {
-  pointer-events: none;
   cursor: default;
   -webkit-user-select: none;
           user-select: none;
   opacity: var(--calcite-ui-opacity-disabled);
 }
 
+:host([disabled]) *,
+:host([disabled]) ::slotted(*) {
+  pointer-events: none;
+}
+
 /**
 * CSS Custom Properties
 *

package/dist/collection/components/action/action.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.3.0-next.0
+ * v1.3.0-next.10
  */
 import { Build, forceUpdate, h, Host } from "@stencil/core";
 import { toAriaBoolean } from "../../utils/dom";

package/dist/collection/components/action/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.3.0-next.0
+ * v1.3.0-next.10
  */
 export const CSS = {
   button: "button",

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.3.0-next.0
+ * v1.3.0-next.10
  */
 import { h, Host } from "@stencil/core";
 import { debounce } from "lodash-es";
 import { connectConditionalSlotComponent, disconnectConditionalSlotComponent } from "../../utils/conditionalSlot";
-import { getSlotted } from "../../utils/dom";
+import { getSlotted, slotChangeGetAssignedElements } from "../../utils/dom";
 import { componentLoaded, setComponentLoaded, setUpLoadableComponent } from "../../utils/loadable";
 import { connectLocalized, disconnectLocalized } from "../../utils/locale";
 import { createObserver } from "../../utils/observers";
@@ -57,6 +57,7 @@ export class ActionBar {
       const actions = queryActions(el);
       const actionCount = expandDisabled ? actions.length : actions.length + 1;
       const actionGroups = Array.from(el.querySelectorAll("calcite-action-group"));
+      this.setGroupLayout(actionGroups);
       const groupCount = getSlotted(el, SLOTS.bottomActions) || !expandDisabled
         ? actionGroups.length + 1
         : actionGroups.length;
@@ -88,6 +89,10 @@ export class ActionBar {
     this.setExpandToggleRef = (el) => {
       this.expandToggleEl = el;
     };
+    this.handleDefaultSlotChange = (event) => {
+      const groups = slotChangeGetAssignedElements(event).filter((el) => el?.matches("calcite-action-group"));
+      this.setGroupLayout(groups);
+    };
     this.expandDisabled = false;
     this.expanded = false;
     this.layout = "vertical";
@@ -106,6 +111,9 @@ export class ActionBar {
     toggleChildActionText({ parent: this.el, expanded });
     this.conditionallyOverflowActions();
   }
+  layoutHandler() {
+    this.updateGroups();
+  }
   overflowDisabledHandler(overflowActionsDisabled) {
     overflowActionsDisabled
       ? this.resizeObserver.disconnect()
@@ -169,6 +177,12 @@ export class ActionBar {
     await componentLoaded(this);
     this.el?.focus();
   }
+  updateGroups() {
+    this.setGroupLayout(Array.from(this.el.querySelectorAll("calcite-action-group")));
+  }
+  setGroupLayout(groups) {
+    groups.forEach((group) => (group.layout = this.layout));
+  }
   // --------------------------------------------------------------------------
   //
   //  Render Methods
@@ -183,7 +197,7 @@ export class ActionBar {
     return getSlotted(el, SLOTS.bottomActions) || expandToggleNode ? (h("calcite-action-group", { class: CSS.actionGroupBottom, layout: layout, scale: scale }, h("slot", { name: SLOTS.bottomActions }), h("slot", { name: SLOTS.expandTooltip }), expandToggleNode)) : null;
   }
   render() {
-    return (h(Host, { onCalciteActionMenuOpen: this.actionMenuOpenHandler }, h("slot", null), this.renderBottomActionGroup()));
+    return (h(Host, { onCalciteActionMenuOpen: this.actionMenuOpenHandler }, h("slot", { onSlotchange: this.handleDefaultSlotChange }), this.renderBottomActionGroup()));
   }
   static get is() { return "calcite-action-bar"; }
   static get encapsulation() { return "shadow"; }
@@ -444,6 +458,9 @@ export class ActionBar {
       }, {
         "propName": "expanded",
         "methodName": "expandedHandler"
+      }, {
+        "propName": "layout",
+        "methodName": "layoutHandler"
       }, {
         "propName": "overflowActionsDisabled",
         "methodName": "overflowDisabledHandler"

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.3.0-next.0
+ * v1.3.0-next.10
  */
 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.3.0-next.0
+ * v1.3.0-next.10
  */
 import { forceUpdate } from "@stencil/core";
 import { SLOTS as ACTION_GROUP_SLOTS } from "../action-group/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.3.0-next.0
+ * v1.3.0-next.10
  */
 import { Fragment, h } from "@stencil/core";
 import { connectConditionalSlotComponent, disconnectConditionalSlotComponent } from "../../utils/conditionalSlot";
@@ -145,7 +145,10 @@ export class ActionGroup {
         "required": false,
         "optional": false,
         "docs": {
-          "tags": [],
+          "tags": [{
+              "name": "deprecated",
+              "text": "Use the `layout` property on the component's parent instead."
+            }],
           "text": "Indicates the layout of the component."
         },
         "attribute": "layout",

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.3.0-next.0
+ * v1.3.0-next.10
  */
 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.3.0-next.0
+ * v1.3.0-next.10
  */
 import { h } from "@stencil/core";
 import { Fragment } from "@stencil/core/internal";

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.3.0-next.0
+ * v1.3.0-next.10
  */
 export const CSS = {
   menu: "menu",

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

@@ -1,22 +1,24 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.3.0-next.0
+ * v1.3.0-next.10
  */
 import { h, Host } from "@stencil/core";
 import { connectConditionalSlotComponent, disconnectConditionalSlotComponent } from "../../utils/conditionalSlot";
-import { getSlotted } from "../../utils/dom";
+import { getSlotted, slotChangeGetAssignedElements } from "../../utils/dom";
 import { componentLoaded, setComponentLoaded, setUpLoadableComponent } from "../../utils/loadable";
 import { connectLocalized, disconnectLocalized } from "../../utils/locale";
 import { connectMessages, disconnectMessages, setUpMessages, updateMessages } from "../../utils/t9n";
 import { ExpandToggle, toggleChildActionText } from "../functional/ExpandToggle";
 import { CSS, SLOTS } from "./resources";
+import { createObserver } from "../../utils/observers";
 /**
  * @slot - A slot for adding `calcite-action`s to the component.
  * @slot expand-tooltip - A slot to set the `calcite-tooltip` for the expand toggle.
  */
 export class ActionPad {
   constructor() {
+    this.mutationObserver = createObserver("mutation", () => this.setGroupLayout(Array.from(this.el.querySelectorAll("calcite-action-group"))));
     // --------------------------------------------------------------------------
     //
     //  Private Methods
@@ -39,6 +41,10 @@ export class ActionPad {
     this.setExpandToggleRef = (el) => {
       this.expandToggleEl = el;
     };
+    this.handleDefaultSlotChange = (event) => {
+      const groups = slotChangeGetAssignedElements(event).filter((el) => el?.matches("calcite-action-group"));
+      this.setGroupLayout(groups);
+    };
     this.expandDisabled = false;
     this.expanded = false;
     this.layout = "vertical";
@@ -52,6 +58,9 @@ export class ActionPad {
   expandedHandler(expanded) {
     toggleChildActionText({ parent: this.el, expanded });
   }
+  layoutHandler() {
+    this.updateGroups();
+  }
   onMessagesChange() {
     /* wired up by t9n util */
   }
@@ -94,6 +103,12 @@ export class ActionPad {
     await componentLoaded(this);
     this.el?.focus();
   }
+  updateGroups() {
+    this.setGroupLayout(Array.from(this.el.querySelectorAll("calcite-action-group")));
+  }
+  setGroupLayout(groups) {
+    groups.forEach((group) => (group.layout = this.layout));
+  }
   // --------------------------------------------------------------------------
   //
   //  Component Methods
@@ -108,7 +123,7 @@ export class ActionPad {
     return expandToggleNode ? (h("calcite-action-group", { class: CSS.actionGroupBottom, layout: layout, scale: scale }, h("slot", { name: SLOTS.expandTooltip }), expandToggleNode)) : null;
   }
   render() {
-    return (h(Host, { onCalciteActionMenuOpen: this.actionMenuOpenHandler }, h("div", { class: CSS.container }, h("slot", null), this.renderBottomActionGroup())));
+    return (h(Host, { onCalciteActionMenuOpen: this.actionMenuOpenHandler }, h("div", { class: CSS.container }, h("slot", { onSlotchange: this.handleDefaultSlotChange }), this.renderBottomActionGroup())));
   }
   static get is() { return "calcite-action-pad"; }
   static get encapsulation() { return "shadow"; }
@@ -326,6 +341,9 @@ export class ActionPad {
     return [{
         "propName": "expanded",
         "methodName": "expandedHandler"
+      }, {
+        "propName": "layout",
+        "methodName": "layoutHandler"
       }, {
         "propName": "messageOverrides",
         "methodName": "onMessagesChange"

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.3.0-next.0
+ * v1.3.0-next.10
  */
 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.3.0-next.0
+ * v1.3.0-next.10
  */
 import { h, Host } from "@stencil/core";
 import { getSlotted, setRequestedIcon, slotChangeHasAssignedElement, toAriaBoolean } from "../../utils/dom";

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.3.0-next.0
+ * v1.3.0-next.10
  */
 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.3.0-next.0
+ * v1.3.0-next.10
  */
 import { h } from "@stencil/core";
 import { getModeName } from "../../utils/dom";

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.3.0-next.0
+ * v1.3.0-next.10
  */
 import { hexToRGB } from "../color-picker/utils";
 /**

package/dist/collection/components/block/block.css

@@ -113,13 +113,17 @@
 }
 
 :host([disabled]) {
-  pointer-events: none;
   cursor: default;
   -webkit-user-select: none;
           user-select: none;
   opacity: var(--calcite-ui-opacity-disabled);
 }
 
+:host([disabled]) *,
+:host([disabled]) ::slotted(*) {
+  pointer-events: none;
+}
+
 /**
 * CSS Custom Properties
 *
@@ -317,6 +321,7 @@ calcite-handle {
   margin-block-start: 0.125rem;
   padding: 0px;
   font-size: var(--calcite-font-size--2);
+  line-height: 1.375;
   color: var(--calcite-ui-text-3);
   word-wrap: break-word;
   word-break: break-word;

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.3.0-next.0
+ * v1.3.0-next.10
  */
 import { h, Host } from "@stencil/core";
 import { connectConditionalSlotComponent, disconnectConditionalSlotComponent } from "../../utils/conditionalSlot";

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.3.0-next.0
+ * v1.3.0-next.10
  */
 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.3.0-next.0
+ * v1.3.0-next.10
  */
 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.3.0-next.0
+ * v1.3.0-next.10
  */
 export const CSS = {
   content: "content",

package/dist/collection/components/button/button.css

@@ -86,13 +86,18 @@
 }
 
 :host([disabled]) {
-  pointer-events: none;
   cursor: default;
   -webkit-user-select: none;
           user-select: none;
   opacity: var(--calcite-ui-opacity-disabled);
 }
 
+:host([loading]) *, :host([disabled]) *,
+:host([loading]) ::slotted(*),
+:host([disabled]) ::slotted(*) {
+  pointer-events: none;
+}
+
 :host {
   display: inline-block;
   inline-size: auto;
@@ -147,10 +152,14 @@
 :host a:hover {
   text-decoration-line: none;
 }
+:host button span,
+:host a span {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
 
 .content {
-  display: flex;
-  flex-basis: auto;
   margin-inline: var(--calcite-button-content-margin-internal);
 }
 
@@ -239,12 +248,8 @@
   opacity: 1;
 }
 
-:host([loading]) {
-  pointer-events: none;
-}
 :host([loading]) button,
 :host([loading]) a {
-  pointer-events: none;
   opacity: var(--calcite-ui-opacity-disabled);
 }
 

package/dist/collection/components/button/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.3.0-next.0
+ * v1.3.0-next.10
  */
 import { Build, h } from "@stencil/core";
 import { findAssociatedForm, resetForm, submitForm } from "../../utils/form";
@@ -19,6 +19,7 @@ export class Button {
   constructor() {
     /** watches for changing text content */
     this.mutationObserver = createObserver("mutation", () => this.updateHasContent());
+    this.resizeObserver = createObserver("resize", () => this.setTooltipText());
     // act on a requested or nearby form based on type
     this.handleClick = () => {
       const { type } = this;
@@ -33,6 +34,18 @@ export class Button {
         resetForm(this);
       }
     };
+    this.setTooltipText = () => {
+      const { contentEl } = this;
+      if (contentEl) {
+        this.tooltipText = contentEl.offsetWidth < contentEl.scrollWidth ? this.el.innerText : null;
+      }
+    };
+    this.setChildEl = (el) => {
+      this.childEl = el;
+      if (el) {
+        this.resizeObserver?.observe(el);
+      }
+    };
     this.alignment = "center";
     this.appearance = "solid";
     this.label = undefined;
@@ -58,6 +71,7 @@ export class Button {
     this.hasLoader = false;
     this.effectiveLocale = "";
     this.defaultMessages = undefined;
+    this.tooltipText = undefined;
   }
   loadingChanged(newValue, oldValue) {
     if (!!newValue && !oldValue) {
@@ -90,6 +104,7 @@ export class Button {
     disconnectLabel(this);
     disconnectLocalized(this);
     disconnectMessages(this);
+    this.resizeObserver?.disconnect();
     this.formEl = null;
   }
   async componentWillLoad() {
@@ -101,6 +116,7 @@ export class Button {
   }
   componentDidLoad() {
     setComponentLoaded(this);
+    this.setTooltipText();
   }
   componentDidRender() {
     updateHostInteraction(this);
@@ -112,16 +128,14 @@ export class Button {
     const noStartEndIcons = !this.iconStart && !this.iconEnd;
     const iconStartEl = (h("calcite-icon", { class: { [CSS.icon]: true, [CSS.iconStart]: true }, flipRtl: this.iconFlipRtl === "start" || this.iconFlipRtl === "both", icon: this.iconStart, scale: this.scale === "l" ? "m" : "s" }));
     const iconEndEl = (h("calcite-icon", { class: { [CSS.icon]: true, [CSS.iconEnd]: true }, flipRtl: this.iconFlipRtl === "end" || this.iconFlipRtl === "both", icon: this.iconEnd, scale: this.scale === "l" ? "m" : "s" }));
-    const contentEl = (h("span", { class: CSS.content }, h("slot", null)));
+    const contentEl = (h("span", { class: CSS.content, ref: (el) => (this.contentEl = el) }, h("slot", null)));
     return (h(Tag, { "aria-label": getLabelText(this), class: {
         [CSS.buttonPadding]: noStartEndIcons,
         [CSS.buttonPaddingShrunk]: !noStartEndIcons,
         [CSS.contentSlotted]: this.hasContent,
         [CSS.iconStartEmpty]: !this.iconStart,
         [CSS.iconEndEmpty]: !this.iconEnd
-      }, disabled: this.disabled || this.loading, href: childElType === "a" && this.href, name: childElType === "button" && this.name, onClick: this.handleClick, rel: childElType === "a" && this.rel, tabIndex: this.disabled || this.loading ? -1 : null, target: childElType === "a" && this.target, type: childElType === "button" && this.type,
-      // eslint-disable-next-line react/jsx-sort-props
-      ref: (el) => (this.childEl = el) }, loaderNode, this.iconStart ? iconStartEl : null, this.hasContent ? contentEl : null, this.iconEnd ? iconEndEl : null));
+      }, disabled: this.disabled || this.loading, href: childElType === "a" && this.href, name: childElType === "button" && this.name, onClick: this.handleClick, ref: this.setChildEl, rel: childElType === "a" && this.rel, tabIndex: this.disabled || this.loading ? -1 : null, target: childElType === "a" && this.target, title: this.tooltipText, type: childElType === "button" && this.type }, loaderNode, this.iconStart ? iconStartEl : null, this.hasContent ? contentEl : null, this.iconEnd ? iconEndEl : null));
   }
   //--------------------------------------------------------------------------
   //
@@ -601,7 +615,8 @@ export class Button {
       "hasContent": {},
       "hasLoader": {},
       "effectiveLocale": {},
-      "defaultMessages": {}
+      "defaultMessages": {},
+      "tooltipText": {}
     };
   }
   static get methods() {

package/dist/collection/components/button/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.3.0-next.0
+ * v1.3.0-next.10
  */
 export const CSS = {
   buttonLoader: "calcite-button--loader",