@esri/calcite-components 5.2.0-next.20 → 5.2.0-next.21

package/dist/components/calcite-action-bar/customElement.js

@@ -10,6 +10,7 @@ import { c as createObserver } from "../../chunks/observers.js";
 import { o as overflowActions, q as queryActions, t as toggleChildActionText, E as ExpandToggle } from "../../chunks/ExpandToggle.js";
 import { u as useT9n } from "../../chunks/useT9n.js";
 import { u as useCancelable } from "../../chunks/useCancelable.js";
+import { l as logger } from "../../chunks/logger.js";
 import { u as useSetFocus } from "../../chunks/useSetFocus.js";
 import { i as isAction } from "../../chunks/resources.js";
 const calculateMaxItems = ({
@@ -59,15 +60,15 @@ class ActionBar extends LitElement {
     this.mutationObserver = createObserver("mutation", () => this.mutationObserverHandler());
     this.cancelable = useCancelable()(this);
     this.resize = debounce(({ width, height }) => {
-      const { expanded, expandDisabled, layout, overflowActionsDisabled, expandPosition } = this;
+      const { expanded, expandToggleDisabled, layout, overflowActionsDisabled, expandPosition } = this;
       if (overflowActionsDisabled || layout === "vertical" && !height || layout === "horizontal" && !width || !this.containerRef.value) {
         return;
       }
       this.updateGroups();
       const itemSizes = this.getItemSizes();
       const { actionGroups } = this;
-      const actionsEndCount = this.hasActionsEnd || !expandDisabled && expandPosition === "end" ? 1 : 0;
-      const actionsStartCount = this.hasActionsStart || !expandDisabled && expandPosition === "start" ? 1 : 0;
+      const actionsEndCount = this.hasActionsEnd || !expandToggleDisabled && expandPosition === "end" ? 1 : 0;
+      const actionsStartCount = this.hasActionsStart || !expandToggleDisabled && expandPosition === "start" ? 1 : 0;
       const groupCount = actionGroups.length + actionsEndCount + actionsStartCount;
       let bufferSize = groupCount;
       const actionBarContainerStyle = getComputedStyle(this.containerRef.value);
@@ -117,7 +118,7 @@ class ActionBar extends LitElement {
     this.hasActionsEnd = false;
     this.hasActionsStart = false;
     this.floating = false;
-    this.expandDisabled = false;
+    this.expandToggleDisabled = false;
     this.expanded = false;
     this.expandPosition = "end";
     this.layout = "vertical";
@@ -132,11 +133,23 @@ class ActionBar extends LitElement {
     this.listen("keydown", this.handleKeyDown);
   }
   static {
-    this.properties = { expandTooltip: [16, {}, { state: true }], hasActionsEnd: [16, {}, { state: true }], hasActionsStart: [16, {}, { state: true }], actionsEndGroupLabel: 1, actionsStartGroupLabel: 1, floating: [7, {}, { reflect: true, type: Boolean }], expandDisabled: [7, {}, { reflect: true, type: Boolean }], expanded: [7, {}, { reflect: true, type: Boolean }], expandPosition: [3, {}, { reflect: true }], layout: [3, {}, { reflect: true }], messageOverrides: [0, {}, { attribute: false }], overflowActionsDisabled: [7, {}, { reflect: true, type: Boolean }], overlayPositioning: [3, {}, { reflect: true }], position: [3, {}, { reflect: true }], scale: [3, {}, { reflect: true }], selectionAppearance: [3, {}, { reflect: true }] };
+    this.properties = { expandTooltip: [16, {}, { state: true }], hasActionsEnd: [16, {}, { state: true }], hasActionsStart: [16, {}, { state: true }], actionsEndGroupLabel: 1, actionsStartGroupLabel: 1, floating: [7, {}, { reflect: true, type: Boolean }], expandToggleDisabled: [7, {}, { reflect: true, type: Boolean }], expandDisabled: [7, {}, { reflect: true, type: Boolean }], expanded: [7, {}, { reflect: true, type: Boolean }], expandPosition: [3, {}, { reflect: true }], layout: [3, {}, { reflect: true }], messageOverrides: [0, {}, { attribute: false }], overflowActionsDisabled: [7, {}, { reflect: true, type: Boolean }], overlayPositioning: [3, {}, { reflect: true }], position: [3, {}, { reflect: true }], scale: [3, {}, { reflect: true }], selectionAppearance: [3, {}, { reflect: true }] };
   }
   static {
     this.styles = styles;
   }
+  get expandDisabled() {
+    return this.expandToggleDisabled;
+  }
+  set expandDisabled(value) {
+    logger.deprecated("property", {
+      component: this,
+      name: "expandDisabled",
+      removalVersion: 6,
+      suggested: "expandToggleDisabled"
+    });
+    this.expandToggleDisabled = value;
+  }
   async overflowActions() {
     this.resize({ width: this.el.clientWidth, height: this.el.clientHeight });
   }
@@ -153,7 +166,7 @@ class ActionBar extends LitElement {
     this.cancelable.add(this.resize);
   }
   willUpdate(changes) {
-    if (changes.has("expandDisabled") && (this.hasUpdated || this.expandDisabled !== false) || changes.has("expandPosition") && (this.hasUpdated || this.expandPosition !== "end")) {
+    if (changes.has("expandDisabled") && (this.hasUpdated || this.expandDisabled !== false) || changes.has("expandToggleDisabled") && (this.hasUpdated || this.expandToggleDisabled !== false) || changes.has("expandPosition") && (this.hasUpdated || this.expandPosition !== "end")) {
       this.overflowActions();
     }
     if (changes.has("layout") && (this.hasUpdated || this.layout !== "vertical")) {
@@ -306,9 +319,9 @@ class ActionBar extends LitElement {
     return ExpandToggle({ collapseLabel: messages.collapseLabel, collapseText: messages.collapse, direction: this.direction, el, expanded, expandLabel: messages.expandLabel, expandText: messages.expand, position, ref: this.setExpandToggleEl, scale, toggle: toggleExpand, tooltip: this.expandTooltip });
   }
   renderActionsGroup(position) {
-    const { expandDisabled, scale, layout, overlayPositioning, expandPosition } = this;
+    const { expandToggleDisabled, scale, layout, overlayPositioning, expandPosition } = this;
     const isStart = position === "start";
-    const hasExpandToggle = !expandDisabled && expandPosition === position;
+    const hasExpandToggle = !expandToggleDisabled && expandPosition === position;
     const slotName = isStart ? SLOTS.actionsStart : SLOTS.actionsEnd;
     const onSlotChange = isStart ? this.handleActionsStartSlotChange : this.handleActionsEndSlotChange;
     const label = isStart ? this.actionsStartGroupLabel : this.actionsEndGroupLabel;