@esri/calcite-components 2.2.0-next.10 → 2.2.0-next.12

package/dist/collection/components/avatar/avatar.e2e.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.10
+ * v2.2.0-next.12
  */
 import { newE2EPage } from "@stencil/core/testing";
 import { accessible, defaults, hidden, renders } from "../../tests/commonTests";

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-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.10
+ * v2.2.0-next.12
  */
 import { h } from "@stencil/core";
 import { getModeName } from "../../utils/dom";

package/dist/collection/components/avatar/avatar.spec.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.10
+ * v2.2.0-next.12
  */
 import { isValidHex } from "../color-picker/utils";
 import { hexToHue, rgbToHue, stringToHex } from "./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-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.10
+ * v2.2.0-next.12
  */
 import { hexToRGB } from "../color-picker/utils";
 /**

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

@@ -1,22 +1,22 @@
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:10 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:09 GMT
  */
 /* mixins & extensions */
 /* helper to properly scale internal durations */

package/dist/collection/components/block/block.e2e.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.10
+ * v2.2.0-next.12
  */
 import { newE2EPage } from "@stencil/core/testing";
 import { CSS, SLOTS } from "./resources";

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-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.10
+ * v2.2.0-next.12
  */
 import { h, Host, } from "@stencil/core";
 import { connectConditionalSlotComponent, disconnectConditionalSlotComponent, } from "../../utils/conditionalSlot";
@@ -461,9 +461,9 @@ export class Block {
                 "docs": {
                     "tags": [{
                             "name": "deprecated",
-                            "text": "use `openClose` events: `calciteBlock[Before]Open` and `calciteBlock[Before]Close` instead."
+                            "text": "Use `openClose` events such as `calciteBlockOpen`, `calciteBlockClose`, `calciteBlockBeforeOpen`, and `calciteBlockBeforeClose` instead."
                         }],
-                    "text": "Emits when the component's header is clicked."
+                    "text": "Fires when the component's header is clicked."
                 },
                 "complexType": {
                     "original": "void",

package/dist/collection/components/block/block.js.map

@@ -1 +1 @@
-{"version":3,"file":"block.js","sourceRoot":"","sources":["../../../../src/components/block/block.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport {\n  ConditionalSlotComponent,\n  connectConditionalSlotComponent,\n  disconnectConditionalSlotComponent,\n} from \"../../utils/conditionalSlot\";\nimport { focusFirstTabbable, getSlotted, toAriaBoolean } from \"../../utils/dom\";\nimport {\n  connectInteractive,\n  disconnectInteractive,\n  InteractiveComponent,\n  InteractiveContainer,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport { connectLocalized, disconnectLocalized, LocalizedComponent } from \"../../utils/locale\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport { Heading, HeadingLevel } from \"../functional/Heading\";\nimport { Status } from \"../interfaces\";\nimport { BlockMessages } from \"./assets/block/t9n\";\nimport { CSS, ICONS, IDS, SLOTS } from \"./resources\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { onToggleOpenCloseComponent, OpenCloseComponent } from \"../../utils/openCloseComponent\";\n\n/**\n * @slot - A slot for adding custom content.\n * @slot icon - A slot for adding a leading header icon with `calcite-icon`.\n * @slot control - A slot for adding a single HTML input element in a header.\n * @slot header-menu-actions - A slot for adding an overflow menu with `calcite-action`s inside a dropdown menu.\n */\n@Component({\n  tag: \"calcite-block\",\n  styleUrl: \"block.scss\",\n  shadow: true,\n  assetsDirs: [\"assets\"],\n})\nexport class Block\n  implements\n    ConditionalSlotComponent,\n    InteractiveComponent,\n    LocalizedComponent,\n    T9nComponent,\n    LoadableComponent,\n    OpenCloseComponent\n{\n  // --------------------------------------------------------------------------\n  //\n  //  Public Properties\n  //\n  // --------------------------------------------------------------------------\n\n  /**\n   * When `true`, the component is collapsible.\n   */\n  @Prop({ reflect: true }) collapsible = false;\n\n  /**\n   * When `true`, interaction is prevented and the component is displayed with lower opacity.\n   */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * When `true`, displays a drag handle in the header.\n   */\n  @Prop({ reflect: true }) dragHandle = false;\n\n  /**\n   * The component header text.\n   */\n  @Prop() heading!: string;\n\n  /**\n   * Specifies the number at which section headings should start.\n   */\n  @Prop({ reflect: true }) headingLevel: HeadingLevel;\n\n  /**\n   * When `true`, a busy indicator is displayed.\n   */\n  @Prop({ reflect: true }) loading = false;\n\n  /**\n   * When `true`, expands the component and its contents.\n   */\n  @Prop({ reflect: true, mutable: true }) open = false;\n\n  @Watch(\"open\")\n  openHandler(): void {\n    onToggleOpenCloseComponent(this);\n  }\n\n  /**\n   * Displays a status-related indicator icon.\n   */\n  @Prop({ reflect: true }) status: Status;\n\n  /**\n   * A description for the component, which displays below the heading.\n   */\n  @Prop() description: string;\n\n  /**\n   * Made into a prop for testing purposes only\n   *\n   * @internal\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messages: BlockMessages;\n\n  /**\n   * Use this property to override individual strings used by the component.\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messageOverrides: Partial<BlockMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Sets focus on the component's first tabbable element.\n   *\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n    focusFirstTabbable(this.el);\n  }\n\n  onBeforeOpen(): void {\n    this.calciteBlockBeforeOpen.emit();\n  }\n\n  onOpen(): void {\n    this.calciteBlockOpen.emit();\n  }\n\n  onBeforeClose(): void {\n    this.calciteBlockBeforeClose.emit();\n  }\n\n  onClose(): void {\n    this.calciteBlockClose.emit();\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Private Properties\n  //\n  // --------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteBlockElement;\n\n  @State() effectiveLocale: string;\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  @State() defaultMessages: BlockMessages;\n\n  openTransitionProp = \"opacity\";\n\n  transitionEl: HTMLElement;\n\n  // --------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  // --------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectConditionalSlotComponent(this);\n    connectInteractive(this);\n    connectLocalized(this);\n    connectMessages(this);\n  }\n\n  disconnectedCallback(): void {\n    disconnectInteractive(this);\n    disconnectLocalized(this);\n    disconnectMessages(this);\n    disconnectConditionalSlotComponent(this);\n  }\n\n  async componentWillLoad(): Promise<void> {\n    await setUpMessages(this);\n    setUpLoadableComponent(this);\n\n    if (this.open) {\n      onToggleOpenCloseComponent(this);\n    }\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  // --------------------------------------------------------------------------\n\n  /** Fires when the component is requested to be closed and before the closing transition begins. */\n  @Event({ cancelable: false }) calciteBlockBeforeClose: EventEmitter<void>;\n\n  /** Fires when the component is added to the DOM but not rendered, and before the opening transition begins. */\n  @Event({ cancelable: false }) calciteBlockBeforeOpen: EventEmitter<void>;\n\n  /** Fires when the component is closed and animation is complete. */\n  @Event({ cancelable: false }) calciteBlockClose: EventEmitter<void>;\n\n  /** Fires when the component is open and animation is complete. */\n  @Event({ cancelable: false }) calciteBlockOpen: EventEmitter<void>;\n\n  /**\n   * Emits when the component's header is clicked.\n   *\n   * @deprecated use `openClose` events: `calciteBlock[Before]Open` and `calciteBlock[Before]Close` instead.\n   */\n  @Event({ cancelable: false }) calciteBlockToggle: EventEmitter<void>;\n\n  // --------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  // --------------------------------------------------------------------------\n\n  onHeaderClick = (): void => {\n    this.open = !this.open;\n    this.calciteBlockToggle.emit();\n  };\n\n  private setTransitionEl = (el: HTMLElement): void => {\n    this.transitionEl = el;\n  };\n\n  // --------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  // --------------------------------------------------------------------------\n\n  renderScrim(): VNode[] {\n    const { loading } = this;\n    const defaultSlot = <slot />;\n\n    return [loading ? <calcite-scrim loading={loading} /> : null, defaultSlot];\n  }\n\n  renderIcon(): VNode[] {\n    const { loading, messages, status } = this;\n\n    const hasSlottedIcon = !!getSlotted(this.el, SLOTS.icon);\n\n    return loading ? (\n      <div class={CSS.icon} key=\"loader\">\n        <calcite-loader inline label={messages.loading} />\n      </div>\n    ) : !!status ? (\n      <div class={CSS.icon} key=\"status-icon\">\n        <calcite-icon\n          class={{\n            [CSS.statusIcon]: true,\n            [CSS.valid]: status == \"valid\",\n            [CSS.invalid]: status == \"invalid\",\n          }}\n          icon={ICONS[status]}\n          scale=\"s\"\n        />\n      </div>\n    ) : hasSlottedIcon ? (\n      <div class={CSS.icon} key=\"icon-slot\">\n        <slot key=\"icon-slot\" name={SLOTS.icon} />\n      </div>\n    ) : null;\n  }\n\n  renderTitle(): VNode {\n    const { heading, headingLevel, description } = this;\n    return heading || description ? (\n      <div class={CSS.title}>\n        <Heading class={CSS.heading} level={headingLevel}>\n          {heading}\n        </Heading>\n        {description ? <div class={CSS.description}>{description}</div> : null}\n      </div>\n    ) : null;\n  }\n\n  render(): VNode {\n    const { collapsible, el, loading, open, messages } = this;\n\n    const toggleLabel = open ? messages.collapse : messages.expand;\n\n    const headerContent = (\n      <header class={CSS.header} id={IDS.header}>\n        {this.renderIcon()}\n        {this.renderTitle()}\n      </header>\n    );\n\n    const hasControl = !!getSlotted(el, SLOTS.control);\n    const hasMenuActions = !!getSlotted(el, SLOTS.headerMenuActions);\n    const collapseIcon = open ? ICONS.opened : ICONS.closed;\n\n    const headerNode = (\n      <div class={CSS.headerContainer}>\n        {this.dragHandle ? <calcite-handle /> : null}\n        {collapsible ? (\n          <button\n            aria-controls={IDS.content}\n            aria-describedby={IDS.header}\n            aria-expanded={collapsible ? toAriaBoolean(open) : null}\n            class={CSS.toggle}\n            id={IDS.toggle}\n            onClick={this.onHeaderClick}\n            title={toggleLabel}\n          >\n            {headerContent}\n            <calcite-icon aria-hidden=\"true\" class={CSS.toggleIcon} icon={collapseIcon} scale=\"s\" />\n          </button>\n        ) : (\n          headerContent\n        )}\n        {hasControl ? (\n          <div class={CSS.controlContainer}>\n            <slot name={SLOTS.control} />\n          </div>\n        ) : null}\n        {hasMenuActions ? (\n          <calcite-action-menu label={messages.options}>\n            <slot name={SLOTS.headerMenuActions} />\n          </calcite-action-menu>\n        ) : null}\n      </div>\n    );\n\n    return (\n      <Host>\n        <InteractiveContainer disabled={this.disabled}>\n          <article\n            aria-busy={toAriaBoolean(loading)}\n            class={{\n              [CSS.container]: true,\n            }}\n          >\n            {headerNode}\n            <section\n              aria-labelledby={IDS.toggle}\n              class={CSS.content}\n              hidden={!open}\n              id={IDS.content}\n              // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)\n              ref={this.setTransitionEl}\n            >\n              {this.renderScrim()}\n            </section>\n          </article>\n        </InteractiveContainer>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"block.js","sourceRoot":"","sources":["../../../../src/components/block/block.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport {\n  ConditionalSlotComponent,\n  connectConditionalSlotComponent,\n  disconnectConditionalSlotComponent,\n} from \"../../utils/conditionalSlot\";\nimport { focusFirstTabbable, getSlotted, toAriaBoolean } from \"../../utils/dom\";\nimport {\n  connectInteractive,\n  disconnectInteractive,\n  InteractiveComponent,\n  InteractiveContainer,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport { connectLocalized, disconnectLocalized, LocalizedComponent } from \"../../utils/locale\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport { Heading, HeadingLevel } from \"../functional/Heading\";\nimport { Status } from \"../interfaces\";\nimport { BlockMessages } from \"./assets/block/t9n\";\nimport { CSS, ICONS, IDS, SLOTS } from \"./resources\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { onToggleOpenCloseComponent, OpenCloseComponent } from \"../../utils/openCloseComponent\";\n\n/**\n * @slot - A slot for adding custom content.\n * @slot icon - A slot for adding a leading header icon with `calcite-icon`.\n * @slot control - A slot for adding a single HTML input element in a header.\n * @slot header-menu-actions - A slot for adding an overflow menu with `calcite-action`s inside a dropdown menu.\n */\n@Component({\n  tag: \"calcite-block\",\n  styleUrl: \"block.scss\",\n  shadow: true,\n  assetsDirs: [\"assets\"],\n})\nexport class Block\n  implements\n    ConditionalSlotComponent,\n    InteractiveComponent,\n    LocalizedComponent,\n    T9nComponent,\n    LoadableComponent,\n    OpenCloseComponent\n{\n  // --------------------------------------------------------------------------\n  //\n  //  Public Properties\n  //\n  // --------------------------------------------------------------------------\n\n  /**\n   * When `true`, the component is collapsible.\n   */\n  @Prop({ reflect: true }) collapsible = false;\n\n  /**\n   * When `true`, interaction is prevented and the component is displayed with lower opacity.\n   */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * When `true`, displays a drag handle in the header.\n   */\n  @Prop({ reflect: true }) dragHandle = false;\n\n  /**\n   * The component header text.\n   */\n  @Prop() heading!: string;\n\n  /**\n   * Specifies the number at which section headings should start.\n   */\n  @Prop({ reflect: true }) headingLevel: HeadingLevel;\n\n  /**\n   * When `true`, a busy indicator is displayed.\n   */\n  @Prop({ reflect: true }) loading = false;\n\n  /**\n   * When `true`, expands the component and its contents.\n   */\n  @Prop({ reflect: true, mutable: true }) open = false;\n\n  @Watch(\"open\")\n  openHandler(): void {\n    onToggleOpenCloseComponent(this);\n  }\n\n  /**\n   * Displays a status-related indicator icon.\n   */\n  @Prop({ reflect: true }) status: Status;\n\n  /**\n   * A description for the component, which displays below the heading.\n   */\n  @Prop() description: string;\n\n  /**\n   * Made into a prop for testing purposes only\n   *\n   * @internal\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messages: BlockMessages;\n\n  /**\n   * Use this property to override individual strings used by the component.\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messageOverrides: Partial<BlockMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Sets focus on the component's first tabbable element.\n   *\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n    focusFirstTabbable(this.el);\n  }\n\n  onBeforeOpen(): void {\n    this.calciteBlockBeforeOpen.emit();\n  }\n\n  onOpen(): void {\n    this.calciteBlockOpen.emit();\n  }\n\n  onBeforeClose(): void {\n    this.calciteBlockBeforeClose.emit();\n  }\n\n  onClose(): void {\n    this.calciteBlockClose.emit();\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Private Properties\n  //\n  // --------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteBlockElement;\n\n  @State() effectiveLocale: string;\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  @State() defaultMessages: BlockMessages;\n\n  openTransitionProp = \"opacity\";\n\n  transitionEl: HTMLElement;\n\n  // --------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  // --------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectConditionalSlotComponent(this);\n    connectInteractive(this);\n    connectLocalized(this);\n    connectMessages(this);\n  }\n\n  disconnectedCallback(): void {\n    disconnectInteractive(this);\n    disconnectLocalized(this);\n    disconnectMessages(this);\n    disconnectConditionalSlotComponent(this);\n  }\n\n  async componentWillLoad(): Promise<void> {\n    await setUpMessages(this);\n    setUpLoadableComponent(this);\n\n    if (this.open) {\n      onToggleOpenCloseComponent(this);\n    }\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  // --------------------------------------------------------------------------\n\n  /** Fires when the component is requested to be closed and before the closing transition begins. */\n  @Event({ cancelable: false }) calciteBlockBeforeClose: EventEmitter<void>;\n\n  /** Fires when the component is added to the DOM but not rendered, and before the opening transition begins. */\n  @Event({ cancelable: false }) calciteBlockBeforeOpen: EventEmitter<void>;\n\n  /** Fires when the component is closed and animation is complete. */\n  @Event({ cancelable: false }) calciteBlockClose: EventEmitter<void>;\n\n  /** Fires when the component is open and animation is complete. */\n  @Event({ cancelable: false }) calciteBlockOpen: EventEmitter<void>;\n\n  /**\n   * Fires when the component's header is clicked.\n   *\n   * @deprecated Use `openClose` events such as `calciteBlockOpen`, `calciteBlockClose`, `calciteBlockBeforeOpen`, and `calciteBlockBeforeClose` instead.\n   */\n  @Event({ cancelable: false }) calciteBlockToggle: EventEmitter<void>;\n\n  // --------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  // --------------------------------------------------------------------------\n\n  onHeaderClick = (): void => {\n    this.open = !this.open;\n    this.calciteBlockToggle.emit();\n  };\n\n  private setTransitionEl = (el: HTMLElement): void => {\n    this.transitionEl = el;\n  };\n\n  // --------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  // --------------------------------------------------------------------------\n\n  renderScrim(): VNode[] {\n    const { loading } = this;\n    const defaultSlot = <slot />;\n\n    return [loading ? <calcite-scrim loading={loading} /> : null, defaultSlot];\n  }\n\n  renderIcon(): VNode[] {\n    const { loading, messages, status } = this;\n\n    const hasSlottedIcon = !!getSlotted(this.el, SLOTS.icon);\n\n    return loading ? (\n      <div class={CSS.icon} key=\"loader\">\n        <calcite-loader inline label={messages.loading} />\n      </div>\n    ) : !!status ? (\n      <div class={CSS.icon} key=\"status-icon\">\n        <calcite-icon\n          class={{\n            [CSS.statusIcon]: true,\n            [CSS.valid]: status == \"valid\",\n            [CSS.invalid]: status == \"invalid\",\n          }}\n          icon={ICONS[status]}\n          scale=\"s\"\n        />\n      </div>\n    ) : hasSlottedIcon ? (\n      <div class={CSS.icon} key=\"icon-slot\">\n        <slot key=\"icon-slot\" name={SLOTS.icon} />\n      </div>\n    ) : null;\n  }\n\n  renderTitle(): VNode {\n    const { heading, headingLevel, description } = this;\n    return heading || description ? (\n      <div class={CSS.title}>\n        <Heading class={CSS.heading} level={headingLevel}>\n          {heading}\n        </Heading>\n        {description ? <div class={CSS.description}>{description}</div> : null}\n      </div>\n    ) : null;\n  }\n\n  render(): VNode {\n    const { collapsible, el, loading, open, messages } = this;\n\n    const toggleLabel = open ? messages.collapse : messages.expand;\n\n    const headerContent = (\n      <header class={CSS.header} id={IDS.header}>\n        {this.renderIcon()}\n        {this.renderTitle()}\n      </header>\n    );\n\n    const hasControl = !!getSlotted(el, SLOTS.control);\n    const hasMenuActions = !!getSlotted(el, SLOTS.headerMenuActions);\n    const collapseIcon = open ? ICONS.opened : ICONS.closed;\n\n    const headerNode = (\n      <div class={CSS.headerContainer}>\n        {this.dragHandle ? <calcite-handle /> : null}\n        {collapsible ? (\n          <button\n            aria-controls={IDS.content}\n            aria-describedby={IDS.header}\n            aria-expanded={collapsible ? toAriaBoolean(open) : null}\n            class={CSS.toggle}\n            id={IDS.toggle}\n            onClick={this.onHeaderClick}\n            title={toggleLabel}\n          >\n            {headerContent}\n            <calcite-icon aria-hidden=\"true\" class={CSS.toggleIcon} icon={collapseIcon} scale=\"s\" />\n          </button>\n        ) : (\n          headerContent\n        )}\n        {hasControl ? (\n          <div class={CSS.controlContainer}>\n            <slot name={SLOTS.control} />\n          </div>\n        ) : null}\n        {hasMenuActions ? (\n          <calcite-action-menu label={messages.options}>\n            <slot name={SLOTS.headerMenuActions} />\n          </calcite-action-menu>\n        ) : null}\n      </div>\n    );\n\n    return (\n      <Host>\n        <InteractiveContainer disabled={this.disabled}>\n          <article\n            aria-busy={toAriaBoolean(loading)}\n            class={{\n              [CSS.container]: true,\n            }}\n          >\n            {headerNode}\n            <section\n              aria-labelledby={IDS.toggle}\n              class={CSS.content}\n              hidden={!open}\n              id={IDS.content}\n              // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)\n              ref={this.setTransitionEl}\n            >\n              {this.renderScrim()}\n            </section>\n          </article>\n        </InteractiveContainer>\n      </Host>\n    );\n  }\n}\n"]}

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-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.10
+ * v2.2.0-next.12
  */
 export const IDS = {
     content: "content",

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

@@ -1,22 +1,22 @@
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:10 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:09 GMT
  */
 /* mixins & extensions */
 /* helper to properly scale internal durations */

package/dist/collection/components/block-section/block-section.e2e.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.10
+ * v2.2.0-next.12
  */
 import { CSS } from "./resources";
 import { accessible, defaults, focusable, hidden, reflects, renders, t9n } from "../../tests/commonTests";

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-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.10
+ * v2.2.0-next.12
  */
 import { h, Host, } from "@stencil/core";
 import { focusFirstTabbable, getElementDir, toAriaBoolean } from "../../utils/dom";
@@ -205,7 +205,7 @@ export class BlockSection {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Specifies the component's toggle display -\n\n`\"button\"` (selectable header), or\n\n`\"switch\"` (toggle switch)."
+                    "text": "Specifies how the component's toggle is displayed -\n\n`\"button\"` (selectable header), or\n\n`\"switch\"` (toggle switch)."
                 },
                 "attribute": "toggle-display",
                 "reflect": true,
@@ -277,7 +277,7 @@ export class BlockSection {
                 "composed": true,
                 "docs": {
                     "tags": [],
-                    "text": "Emits when the header has been clicked."
+                    "text": "Fires when the header has been clicked."
                 },
                 "complexType": {
                     "original": "void",

package/dist/collection/components/block-section/block-section.js.map

@@ -1 +1 @@
-{"version":3,"file":"block-section.js","sourceRoot":"","sources":["../../../../src/components/block-section/block-section.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\n\nimport { focusFirstTabbable, getElementDir, toAriaBoolean } from \"../../utils/dom\";\nimport { isActivationKey } from \"../../utils/key\";\nimport { connectLocalized, disconnectLocalized, LocalizedComponent } from \"../../utils/locale\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport { Status } from \"../interfaces\";\nimport { BlockSectionMessages } from \"./assets/block-section/t9n\";\nimport { BlockSectionToggleDisplay } from \"./interfaces\";\nimport { CSS, ICONS, IDS } from \"./resources\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\n\n/**\n * @slot - A slot for adding custom content.\n */\n@Component({\n  tag: \"calcite-block-section\",\n  styleUrl: \"block-section.scss\",\n  shadow: true,\n  assetsDirs: [\"assets\"],\n})\nexport class BlockSection implements LocalizedComponent, T9nComponent, LoadableComponent {\n  // --------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  // --------------------------------------------------------------------------\n\n  /**\n   * When `true`, expands the component and its contents.\n   */\n  @Prop({ reflect: true, mutable: true }) open = false;\n\n  /**\n   * Displays a status-related indicator icon.\n   */\n  @Prop({ reflect: true }) status: Status;\n\n  /**\n   * The component header text.\n   */\n  @Prop() text: string;\n\n  /**\n   * Specifies the component's toggle display -\n   *\n   * `\"button\"` (selectable header), or\n   *\n   * `\"switch\"` (toggle switch).\n   */\n  @Prop({ reflect: true }) toggleDisplay: BlockSectionToggleDisplay = \"button\";\n\n  /**\n   * Made into a prop for testing purposes only\n   *\n   * @internal\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messages: BlockSectionMessages;\n\n  /**\n   * Use this property to override individual strings used by the component.\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messageOverrides: Partial<BlockSectionMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Sets focus on the component's first tabbable element.\n   *\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n    focusFirstTabbable(this.el);\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Private Properties\n  //\n  // --------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteBlockSectionElement;\n\n  @State() effectiveLocale: string;\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  @State() defaultMessages: BlockSectionMessages;\n\n  // --------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  // --------------------------------------------------------------------------\n\n  /**\n   * Emits when the header has been clicked.\n   */\n  @Event({ cancelable: false }) calciteBlockSectionToggle: EventEmitter<void>;\n\n  // --------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  // --------------------------------------------------------------------------\n\n  handleHeaderKeyDown = (event: KeyboardEvent): void => {\n    if (isActivationKey(event.key)) {\n      this.toggleSection();\n      event.preventDefault();\n      event.stopPropagation();\n    }\n  };\n\n  toggleSection = (): void => {\n    this.open = !this.open;\n    this.calciteBlockSectionToggle.emit();\n  };\n\n  // --------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  // --------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectLocalized(this);\n    connectMessages(this);\n  }\n\n  async componentWillLoad(): Promise<void> {\n    await setUpMessages(this);\n    setUpLoadableComponent(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  disconnectedCallback(): void {\n    disconnectLocalized(this);\n    disconnectMessages(this);\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  // --------------------------------------------------------------------------\n  renderStatusIcon(): VNode[] {\n    const { status } = this;\n    const statusIcon = ICONS[status] ?? false;\n    const statusIconClasses = {\n      [CSS.statusIcon]: true,\n      [CSS.valid]: status == \"valid\",\n      [CSS.invalid]: status == \"invalid\",\n    };\n\n    return !!statusIcon ? (\n      <calcite-icon class={statusIconClasses} icon={statusIcon} scale=\"s\" />\n    ) : null;\n  }\n\n  render(): VNode {\n    const { el, messages, open, text, toggleDisplay } = this;\n    const dir = getElementDir(el);\n    const arrowIcon = open\n      ? ICONS.menuOpen\n      : dir === \"rtl\"\n        ? ICONS.menuClosedLeft\n        : ICONS.menuClosedRight;\n\n    const toggleLabel = open ? messages.collapse : messages.expand;\n\n    const headerNode =\n      toggleDisplay === \"switch\" ? (\n        <div\n          class={{\n            [CSS.toggleSwitchContainer]: true,\n          }}\n        >\n          <div\n            aria-controls={IDS.content}\n            aria-expanded={toAriaBoolean(open)}\n            class={{\n              [CSS.toggle]: true,\n              [CSS.toggleSwitch]: true,\n            }}\n            id={IDS.toggle}\n            onClick={this.toggleSection}\n            onKeyDown={this.handleHeaderKeyDown}\n            role=\"button\"\n            tabIndex={0}\n            title={toggleLabel}\n          >\n            <div class={CSS.toggleSwitchContent}>\n              <span class={CSS.toggleSwitchText}>{text}</span>\n            </div>\n            {this.renderStatusIcon()}\n          </div>\n          {/* we use calcite-label to use a simple component that will allow us to prevent keyboard focus by setting tabindex=\"-1\" on the host */}\n          <calcite-label class={CSS.focusGuard} layout=\"inline\" tabIndex={-1}>\n            <calcite-switch checked={open} label={toggleLabel} scale=\"s\" />\n          </calcite-label>\n        </div>\n      ) : (\n        <button\n          aria-controls={IDS.content}\n          aria-expanded={toAriaBoolean(open)}\n          class={{\n            [CSS.sectionHeader]: true,\n            [CSS.toggle]: true,\n          }}\n          id={IDS.toggle}\n          onClick={this.toggleSection}\n        >\n          <calcite-icon icon={arrowIcon} scale=\"s\" />\n          <span class={CSS.sectionHeaderText}>{text}</span>\n          {this.renderStatusIcon()}\n        </button>\n      );\n\n    return (\n      <Host>\n        {headerNode}\n        <section aria-labelledby={IDS.toggle} class={CSS.content} hidden={!open} id={IDS.content}>\n          <slot />\n        </section>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"block-section.js","sourceRoot":"","sources":["../../../../src/components/block-section/block-section.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\n\nimport { focusFirstTabbable, getElementDir, toAriaBoolean } from \"../../utils/dom\";\nimport { isActivationKey } from \"../../utils/key\";\nimport { connectLocalized, disconnectLocalized, LocalizedComponent } from \"../../utils/locale\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport { Status } from \"../interfaces\";\nimport { BlockSectionMessages } from \"./assets/block-section/t9n\";\nimport { BlockSectionToggleDisplay } from \"./interfaces\";\nimport { CSS, ICONS, IDS } from \"./resources\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\n\n/**\n * @slot - A slot for adding custom content.\n */\n@Component({\n  tag: \"calcite-block-section\",\n  styleUrl: \"block-section.scss\",\n  shadow: true,\n  assetsDirs: [\"assets\"],\n})\nexport class BlockSection implements LocalizedComponent, T9nComponent, LoadableComponent {\n  // --------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  // --------------------------------------------------------------------------\n\n  /**\n   * When `true`, expands the component and its contents.\n   */\n  @Prop({ reflect: true, mutable: true }) open = false;\n\n  /**\n   * Displays a status-related indicator icon.\n   */\n  @Prop({ reflect: true }) status: Status;\n\n  /**\n   * The component header text.\n   */\n  @Prop() text: string;\n\n  /**\n   * Specifies how the component's toggle is displayed -\n   *\n   * `\"button\"` (selectable header), or\n   *\n   * `\"switch\"` (toggle switch).\n   */\n  @Prop({ reflect: true }) toggleDisplay: BlockSectionToggleDisplay = \"button\";\n\n  /**\n   * Made into a prop for testing purposes only\n   *\n   * @internal\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messages: BlockSectionMessages;\n\n  /**\n   * Use this property to override individual strings used by the component.\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messageOverrides: Partial<BlockSectionMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Sets focus on the component's first tabbable element.\n   *\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n    focusFirstTabbable(this.el);\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Private Properties\n  //\n  // --------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteBlockSectionElement;\n\n  @State() effectiveLocale: string;\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  @State() defaultMessages: BlockSectionMessages;\n\n  // --------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  // --------------------------------------------------------------------------\n\n  /**\n   * Fires when the header has been clicked.\n   */\n  @Event({ cancelable: false }) calciteBlockSectionToggle: EventEmitter<void>;\n\n  // --------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  // --------------------------------------------------------------------------\n\n  handleHeaderKeyDown = (event: KeyboardEvent): void => {\n    if (isActivationKey(event.key)) {\n      this.toggleSection();\n      event.preventDefault();\n      event.stopPropagation();\n    }\n  };\n\n  toggleSection = (): void => {\n    this.open = !this.open;\n    this.calciteBlockSectionToggle.emit();\n  };\n\n  // --------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  // --------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectLocalized(this);\n    connectMessages(this);\n  }\n\n  async componentWillLoad(): Promise<void> {\n    await setUpMessages(this);\n    setUpLoadableComponent(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  disconnectedCallback(): void {\n    disconnectLocalized(this);\n    disconnectMessages(this);\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  // --------------------------------------------------------------------------\n  renderStatusIcon(): VNode[] {\n    const { status } = this;\n    const statusIcon = ICONS[status] ?? false;\n    const statusIconClasses = {\n      [CSS.statusIcon]: true,\n      [CSS.valid]: status == \"valid\",\n      [CSS.invalid]: status == \"invalid\",\n    };\n\n    return !!statusIcon ? (\n      <calcite-icon class={statusIconClasses} icon={statusIcon} scale=\"s\" />\n    ) : null;\n  }\n\n  render(): VNode {\n    const { el, messages, open, text, toggleDisplay } = this;\n    const dir = getElementDir(el);\n    const arrowIcon = open\n      ? ICONS.menuOpen\n      : dir === \"rtl\"\n        ? ICONS.menuClosedLeft\n        : ICONS.menuClosedRight;\n\n    const toggleLabel = open ? messages.collapse : messages.expand;\n\n    const headerNode =\n      toggleDisplay === \"switch\" ? (\n        <div\n          class={{\n            [CSS.toggleSwitchContainer]: true,\n          }}\n        >\n          <div\n            aria-controls={IDS.content}\n            aria-expanded={toAriaBoolean(open)}\n            class={{\n              [CSS.toggle]: true,\n              [CSS.toggleSwitch]: true,\n            }}\n            id={IDS.toggle}\n            onClick={this.toggleSection}\n            onKeyDown={this.handleHeaderKeyDown}\n            role=\"button\"\n            tabIndex={0}\n            title={toggleLabel}\n          >\n            <div class={CSS.toggleSwitchContent}>\n              <span class={CSS.toggleSwitchText}>{text}</span>\n            </div>\n            {this.renderStatusIcon()}\n          </div>\n          {/* we use calcite-label to use a simple component that will allow us to prevent keyboard focus by setting tabindex=\"-1\" on the host */}\n          <calcite-label class={CSS.focusGuard} layout=\"inline\" tabIndex={-1}>\n            <calcite-switch checked={open} label={toggleLabel} scale=\"s\" />\n          </calcite-label>\n        </div>\n      ) : (\n        <button\n          aria-controls={IDS.content}\n          aria-expanded={toAriaBoolean(open)}\n          class={{\n            [CSS.sectionHeader]: true,\n            [CSS.toggle]: true,\n          }}\n          id={IDS.toggle}\n          onClick={this.toggleSection}\n        >\n          <calcite-icon icon={arrowIcon} scale=\"s\" />\n          <span class={CSS.sectionHeaderText}>{text}</span>\n          {this.renderStatusIcon()}\n        </button>\n      );\n\n    return (\n      <Host>\n        {headerNode}\n        <section aria-labelledby={IDS.toggle} class={CSS.content} hidden={!open} id={IDS.content}>\n          <slot />\n        </section>\n      </Host>\n    );\n  }\n}\n"]}

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-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.10
+ * v2.2.0-next.12
  */
 export const IDS = {
     content: "content",

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

@@ -1,22 +1,22 @@
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:10 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:09 GMT
  */
 /* mixins & extensions */
 /* helper to properly scale internal durations */

package/dist/collection/components/button/button.e2e.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.10
+ * v2.2.0-next.12
  */
 import { newE2EPage } from "@stencil/core/testing";
 import { accessible, disabled, HYDRATED_ATTR, labelable, defaults, hidden, t9n } from "../../tests/commonTests";
@@ -573,21 +573,34 @@ describe("calcite-button", () => {
     describe("translation support", () => {
         t9n("calcite-button");
     });
-    it("shows tooltip for buttons with truncated long text", async () => {
-        const shortText = "Hi!";
-        const longText = "This_long_text_contains_a_coded_map_for_hidden_treasures_of_Edward_Teach_aka_Blackbeard_._If_only_you_could_access_it_you_could_buy_out_The_Magic_Castle_on_Franklin_ave_Los_Angeles_like_you_ve_always_wanted.";
-        const page = await newE2EPage();
-        await page.setContent(html `
-      <calcite-button id="one" style="width: 100px">${longText}</calcite-button>
-      <calcite-button id="two" style="width: 100px">${shortText}</calcite-button>
-    `);
-        await page.waitForChanges();
-        const button1 = await page.find(`calcite-button[id='one'] >>> button`);
-        const button2 = await page.find(`calcite-button[id='two'] >>> button`);
-        expect(button1).toHaveAttribute("title");
-        expect(button2).not.toHaveAttribute("title");
-        expect(button1.textContent.length).toBeLessThan(longText.length);
-        expect(button1.getAttribute("title")).toEqual(longText);
+    describe('automatic tooltip', () => {
+        it("shows tooltip for buttons with truncated long text", async () => {
+            const shortText = "Hi!";
+            const longText = "This_long_text_contains_a_coded_map_for_hidden_treasures_of_Edward_Teach_aka_Blackbeard_._If_only_you_could_access_it_you_could_buy_out_The_Magic_Castle_on_Franklin_ave_Los_Angeles_like_you_ve_always_wanted.";
+            const page = await newE2EPage();
+            await page.setContent(html `
+        <calcite-button id="one" style="width: 100px">${longText}</calcite-button>
+        <calcite-button id="two" style="width: 100px">${shortText}</calcite-button>
+      `);
+            await page.waitForChanges();
+            const button1 = await page.find(`calcite-button[id='one'] >>> button`);
+            const button2 = await page.find(`calcite-button[id='two'] >>> button`);
+            expect(button1).toHaveAttribute("title");
+            expect(button2).not.toHaveAttribute("title");
+            expect(button1.textContent.length).toBeLessThan(longText.length);
+            expect(button1.getAttribute("title")).toEqual(longText);
+        });
+        it("does not show tooltip for buttons without text content", async () => {
+            const page = await newE2EPage();
+            await page.setContent(html `
+        <calcite-button style="width:32px;height:32px" scale="s">
+          <calcite-icon icon="compass-needle" scale="m" />
+        </calcite-button>
+      `);
+            await page.waitForChanges();
+            const button = await page.find(`calcite-button >>> button`);
+            expect(button).not.toHaveAttribute("title");
+        });
     });
     it("should set aria-expanded attribute on shadowDOM element when used as trigger", async () => {
         const page = await newE2EPage();