@oicl/openbridge-webcomponents 2.2.0-next.1 → 2.2.0-next.2

package/bundle/openbridge-webcomponents.bundle.js

@@ -113957,7 +113957,7 @@ var top_bar_default = i$7`* {
 /* Controls never shrink: a squeeze reaches the texts, then overflows the end */
 .menu-button,
 .app-icon,
-.left-more-button,
+.more-button,
 .dimming-button,
 .user-button,
 .apps-button,
@@ -114013,7 +114013,7 @@ var top_bar_default = i$7`* {
     "ss04" on;
 }
 
-.left-more-button {
+.more-button {
   display: none;
 }
 
@@ -114186,7 +114186,7 @@ var ObcTopBar = class ObcTopBar extends i$4 {
 		this.menuButtonActivated = false;
 		this.dimmingButtonActivated = false;
 		this.appsButtonActivated = false;
-		this.leftMoreButtonActivated = false;
+		this.moreButtonActivated = false;
 		this.userButtonActivated = false;
 		this.userButtonDisabled = false;
 		this.tall = false;
@@ -114224,9 +114224,24 @@ var ObcTopBar = class ObcTopBar extends i$4 {
 		*/
 		this.dispatchEvent(new CustomEvent("apps-button-clicked"));
 	}
-	leftMoreButtonClicked() {
+	/**
+	* Copies the deprecated `leftMoreButtonActivated` into
+	* `moreButtonActivated`. A plain field rather than a getter/setter alias:
+	* the Vue wrapper writes every prop back on its second render, and a getter
+	* would then write `false` over the new property.
+	*/
+	willUpdate(changed) {
+		super.willUpdate(changed);
+		if (changed.has("leftMoreButtonActivated") && this.leftMoreButtonActivated !== void 0) this.moreButtonActivated = this.leftMoreButtonActivated;
+	}
+	moreButtonClicked() {
+		/**
+		* Fired when the more button is clicked.
+		* @event more-button-clicked
+		*/
+		this.dispatchEvent(new CustomEvent("more-button-clicked"));
 		/**
-		* Fired when the left more button is clicked.
+		* Deprecated alias of `more-button-clicked`; removed in 4.0.0.
 		* @event left-more-button-clicked
 		*/
 		this.dispatchEvent(new CustomEvent("left-more-button-clicked"));
@@ -114342,8 +114357,8 @@ var ObcTopBar = class ObcTopBar extends i$4 {
 		}
 		return b`
       <style>
-        @media (max-width: ${Math.max(this.appButtonBreakpointPx, this.dimmingButtonBreakpointPx)}px) {
-          .left-more-button {
+        @media (max-width: ${Math.max(this.appButtonBreakpointPx, this.dimmingButtonBreakpointPx, this.userButtonBreakpointPx, this.appIconBreakpointPx)}px) {
+          .more-button {
             display: revert !important;
           }
 
@@ -114429,12 +114444,12 @@ var ObcTopBar = class ObcTopBar extends i$4 {
                 </obc-icon-button>` : null}
           ${this.showClock ? b`<slot name="clock"></slot>` : null}
           ${!this.inactive ? b`<obc-icon-button
-                  class="left-more-button"
-                  part="left-more-button"
+                  class="more-button"
+                  part="more-button left-more-button"
                   variant="flat"
                   aria-label=${msg("More")}
-                  @click=${this.leftMoreButtonClicked}
-                  ?activated=${this.leftMoreButtonActivated}
+                  @click=${this.moreButtonClicked}
+                  ?activated=${this.moreButtonActivated}
                 >
                   <obi-more-vertical-google></obi-more-vertical-google>
                 </obc-icon-button>` : null}
@@ -114452,6 +114467,7 @@ __decorate([n$4({ type: String })], ObcTopBar.prototype, "menuButtonIcon", void
 __decorate([n$4({ type: Boolean })], ObcTopBar.prototype, "menuButtonActivated", void 0);
 __decorate([n$4({ type: Boolean })], ObcTopBar.prototype, "dimmingButtonActivated", void 0);
 __decorate([n$4({ type: Boolean })], ObcTopBar.prototype, "appsButtonActivated", void 0);
+__decorate([n$4({ type: Boolean })], ObcTopBar.prototype, "moreButtonActivated", void 0);
 __decorate([n$4({ type: Boolean })], ObcTopBar.prototype, "leftMoreButtonActivated", void 0);
 __decorate([n$4({ type: Boolean })], ObcTopBar.prototype, "userButtonActivated", void 0);
 __decorate([n$4({ type: Boolean })], ObcTopBar.prototype, "userButtonDisabled", void 0);