@design.estate/dees-catalog 3.43.4 → 3.44.0

package/dist_bundle/bundle.js

@@ -130084,17 +130084,25 @@ var DemoCloseableTabs = class extends (_a38 = DeesElement, _tabs_dec2 = [r5()],
   removeTab(tabKey) {
     this.tabs = this.tabs.filter((t9) => t9.key !== tabKey);
   }
+  clearAll() {
+    const tabsEl = this.shadowRoot.querySelector("dees-appui-tabs");
+    tabsEl?.clear();
+    this.tabs = [];
+    this.tabCounter = 0;
+  }
   render() {
+    const rightActions = [
+      { id: "add", iconName: "lucide:plus", action: () => this.addTab(), tooltip: "New Tab" },
+      { id: "clear", iconName: "lucide:trash2", action: () => this.clearAll(), tooltip: "Clear All Tabs" }
+    ];
     return b2`
       <dees-appui-tabs
         .tabs=${this.tabs}
+        .actionsRight=${rightActions}
         @tab-close=${(e11) => this.removeTab(e11.detail.tab.key)}
       ></dees-appui-tabs>
-      <div class="controls">
-        <button @click=${() => this.addTab()}>+ Add New Tab</button>
-      </div>
       <div class="info">
-        Click the X button on tabs to close them. The "Main" tab is not closeable.
+        Click the X button on tabs to close them. Use the + button to add tabs and the trash button to clear all.
         <br>Current tabs: ${this.tabs.length}
       </div>
     `;
@@ -130111,24 +130119,6 @@ __publicField(DemoCloseableTabs, "styles", [
       :host {
         display: block;
       }
-      .controls {
-        display: flex;
-        gap: 8px;
-        margin-top: 16px;
-      }
-      button {
-        background: ${cssManager.bdTheme("rgba(59, 130, 246, 0.1)", "rgba(59, 130, 246, 0.1)")};
-        border: 1px solid ${cssManager.bdTheme("rgba(59, 130, 246, 0.3)", "rgba(59, 130, 246, 0.3)")};
-        color: ${cssManager.bdTheme("#3b82f6", "#60a5fa")};
-        padding: 8px 16px;
-        border-radius: 6px;
-        cursor: pointer;
-        font-size: 13px;
-        transition: all 0.15s ease;
-      }
-      button:hover {
-        background: ${cssManager.bdTheme("rgba(59, 130, 246, 0.2)", "rgba(59, 130, 246, 0.2)")};
-      }
       .info {
         margin-top: 16px;
         padding: 12px 16px;
@@ -130287,6 +130277,15 @@ var demoFunc30 = () => {
     { key: "Completed", action: () => console.log("Completed clicked") },
     { key: "Archived", action: () => console.log("Archived clicked") }
   ];
+  const actionsLeft = [
+    { id: "back", iconName: "lucide:arrowLeft", action: () => console.log("Back"), tooltip: "Go Back" }
+  ];
+  const actionsRight = [
+    { id: "add", iconName: "lucide:plus", action: () => console.log("Add tab"), tooltip: "New Tab" },
+    { id: "search", iconName: "lucide:search", action: () => console.log("Search"), tooltip: "Search Tabs" },
+    { id: "disabled", iconName: "lucide:lock", action: () => {
+    }, tooltip: "Disabled Action", disabled: true }
+  ];
   const demoContent = (text9) => b2`
     <div style="padding: 24px; color: ${cssManager.bdTheme("#71717a", "#a1a1aa")};">
       ${text9}
@@ -130333,7 +130332,17 @@ var demoFunc30 = () => {
       </div>
 
       <div class="section">
-        <div class="section-title">Closeable Tabs (Browser-style)</div>
+        <div class="section-title">Tabs with Action Buttons</div>
+        <dees-appui-tabs
+          .tabs=${horizontalTabs}
+          .actionsLeft=${actionsLeft}
+          .actionsRight=${actionsRight}
+        ></dees-appui-tabs>
+        ${demoContent("Action buttons can be placed on either side of the tab bar. They remain fixed while tabs scroll. The lock icon shows a disabled action.")}
+      </div>
+
+      <div class="section">
+        <div class="section-title">Closeable Tabs with Actions</div>
         <demo-closeable-tabs></demo-closeable-tabs>
       </div>
 
@@ -130363,11 +130372,11 @@ var demoFunc30 = () => {
 init_dist_ts28();
 init_dist_ts27();
 init_theme();
-var _canScrollRight_dec, _canScrollLeft_dec, _autoHideThreshold_dec, _autoHide_dec2, _tabStyle_dec, _showTabIndicator_dec, _selectedTab_dec2, _tabs_dec4, _a39, _DeesAppuiTabs_decorators, _init41, _tabs4, _selectedTab2, _showTabIndicator, _tabStyle, _autoHide2, _autoHideThreshold, _canScrollLeft, _canScrollRight;
+var _canScrollRight_dec, _canScrollLeft_dec, _actionsRight_dec, _actionsLeft_dec, _autoHideThreshold_dec, _autoHide_dec2, _tabStyle_dec, _showTabIndicator_dec, _selectedTab_dec2, _tabs_dec4, _a39, _DeesAppuiTabs_decorators, _init41, _tabs4, _selectedTab2, _showTabIndicator, _tabStyle, _autoHide2, _autoHideThreshold, _actionsLeft, _actionsRight, _canScrollLeft, _canScrollRight;
 _DeesAppuiTabs_decorators = [t4("dees-appui-tabs")];
 var DeesAppuiTabs = class extends (_a39 = DeesElement, _tabs_dec4 = [n5({
   type: Array
-})], _selectedTab_dec2 = [n5({ type: Object })], _showTabIndicator_dec = [n5({ type: Boolean })], _tabStyle_dec = [n5({ type: String })], _autoHide_dec2 = [n5({ type: Boolean })], _autoHideThreshold_dec = [n5({ type: Number })], _canScrollLeft_dec = [r5()], _canScrollRight_dec = [r5()], _a39) {
+})], _selectedTab_dec2 = [n5({ type: Object })], _showTabIndicator_dec = [n5({ type: Boolean })], _tabStyle_dec = [n5({ type: String })], _autoHide_dec2 = [n5({ type: Boolean })], _autoHideThreshold_dec = [n5({ type: Number })], _actionsLeft_dec = [n5({ type: Array })], _actionsRight_dec = [n5({ type: Array })], _canScrollLeft_dec = [r5()], _canScrollRight_dec = [r5()], _a39) {
   constructor() {
     super(...arguments);
     __privateAdd(this, _tabs4, __runInitializers(_init41, 8, this, [])), __runInitializers(_init41, 11, this);
@@ -130376,8 +130385,10 @@ var DeesAppuiTabs = class extends (_a39 = DeesElement, _tabs_dec4 = [n5({
     __privateAdd(this, _tabStyle, __runInitializers(_init41, 20, this, "horizontal")), __runInitializers(_init41, 23, this);
     __privateAdd(this, _autoHide2, __runInitializers(_init41, 24, this, false)), __runInitializers(_init41, 27, this);
     __privateAdd(this, _autoHideThreshold, __runInitializers(_init41, 28, this, 0)), __runInitializers(_init41, 31, this);
-    __privateAdd(this, _canScrollLeft, __runInitializers(_init41, 32, this, false)), __runInitializers(_init41, 35, this);
-    __privateAdd(this, _canScrollRight, __runInitializers(_init41, 36, this, false)), __runInitializers(_init41, 39, this);
+    __privateAdd(this, _actionsLeft, __runInitializers(_init41, 32, this, [])), __runInitializers(_init41, 35, this);
+    __privateAdd(this, _actionsRight, __runInitializers(_init41, 36, this, [])), __runInitializers(_init41, 39, this);
+    __privateAdd(this, _canScrollLeft, __runInitializers(_init41, 40, this, false)), __runInitializers(_init41, 43, this);
+    __privateAdd(this, _canScrollRight, __runInitializers(_init41, 44, this, false)), __runInitializers(_init41, 47, this);
     __publicField(this, "resizeObserver", null);
     __publicField(this, "handleScroll", () => {
       this.updateScrollState();
@@ -130397,13 +130408,19 @@ var DeesAppuiTabs = class extends (_a39 = DeesElement, _tabs_dec4 = [n5({
     const wrapperClass = isHorizontal ? "tabs-wrapper horizontal-wrapper" : "vertical-wrapper";
     const containerClass = `tabsContainer ${this.tabStyle}`;
     if (isHorizontal) {
+      const hasLeftActions = this.actionsLeft && this.actionsLeft.length > 0;
+      const hasRightActions = this.actionsRight && this.actionsRight.length > 0;
       return b2`
         <div class="${wrapperClass}">
-          <div class="scroll-fade scroll-fade-left ${this.canScrollLeft ? "visible" : ""}"></div>
-          <div class="${containerClass}" @scroll=${this.handleScroll}>
-            ${this.tabs.map((tab2) => this.renderTab(tab2, isHorizontal))}
+          ${hasLeftActions ? this.renderActions(this.actionsLeft, "left") : ""}
+          <div class="scroll-area">
+            <div class="scroll-fade scroll-fade-left ${this.canScrollLeft ? "visible" : ""}"></div>
+            <div class="${containerClass}" @scroll=${this.handleScroll}>
+              ${this.tabs.map((tab2) => this.renderTab(tab2, isHorizontal))}
+            </div>
+            <div class="scroll-fade scroll-fade-right ${this.canScrollRight ? "visible" : ""}"></div>
           </div>
-          <div class="scroll-fade scroll-fade-right ${this.canScrollRight ? "visible" : ""}"></div>
+          ${hasRightActions ? this.renderActions(this.actionsRight, "right") : ""}
           ${this.showTabIndicator ? b2`<div class="tabIndicator"></div>` : ""}
         </div>
       `;
@@ -130417,6 +130434,21 @@ var DeesAppuiTabs = class extends (_a39 = DeesElement, _tabs_dec4 = [n5({
       </div>
     `;
   }
+  renderActions(actions, position3) {
+    return b2`
+      <div class="tab-actions ${position3}">
+        ${actions.map((action) => b2`
+          <div
+            class="tab-action-button ${action.disabled ? "disabled" : ""}"
+            title="${action.tooltip || action.id}"
+            @click=${() => !action.disabled && action.action()}
+          >
+            <dees-icon .icon=${action.iconName}></dees-icon>
+          </div>
+        `)}
+      </div>
+    `;
+  }
   renderTab(tab2, isHorizontal) {
     const isSelected = tab2 === this.selectedTab;
     const classes = `tab ${isSelected ? "selectedTab" : ""}`;
@@ -130460,6 +130492,13 @@ var DeesAppuiTabs = class extends (_a39 = DeesElement, _tabs_dec4 = [n5({
       composed: true
     }));
   }
+  /**
+   * Clear all tabs and reset selection.
+   */
+  clear() {
+    this.tabs = [];
+    this.selectedTab = null;
+  }
   closeTab(e11, tab2) {
     e11.stopPropagation();
     if (tab2.onClose) {
@@ -130472,9 +130511,6 @@ var DeesAppuiTabs = class extends (_a39 = DeesElement, _tabs_dec4 = [n5({
     }));
   }
   firstUpdated() {
-    if (this.tabs && this.tabs.length > 0) {
-      this.selectTab(this.tabs[0]);
-    }
     this.setupResizeObserver();
     requestAnimationFrame(() => {
       this.updateScrollState();
@@ -130524,8 +130560,21 @@ var DeesAppuiTabs = class extends (_a39 = DeesElement, _tabs_dec4 = [n5({
   }
   async updated(changedProperties) {
     super.updated(changedProperties);
-    if (changedProperties.has("tabs") && this.tabs && this.tabs.length > 0 && !this.selectedTab) {
-      this.selectTab(this.tabs[0]);
+    if (changedProperties.has("tabs")) {
+      if (!this.tabs || this.tabs.length === 0) {
+        if (this.selectedTab !== null) {
+          this.selectedTab = null;
+          this.dispatchEvent(new CustomEvent("tab-select", {
+            detail: { tab: null },
+            bubbles: true,
+            composed: true
+          }));
+        }
+      } else if (this.selectedTab && !this.tabs.includes(this.selectedTab)) {
+        this.selectTab(this.tabs[0]);
+      } else if (!this.selectedTab) {
+        this.selectTab(this.tabs[0]);
+      }
     }
     if (changedProperties.has("selectedTab") || changedProperties.has("tabs")) {
       await this.updateComplete;
@@ -130598,6 +130647,8 @@ _showTabIndicator = new WeakMap();
 _tabStyle = new WeakMap();
 _autoHide2 = new WeakMap();
 _autoHideThreshold = new WeakMap();
+_actionsLeft = new WeakMap();
+_actionsRight = new WeakMap();
 _canScrollLeft = new WeakMap();
 _canScrollRight = new WeakMap();
 __decorateElement(_init41, 4, "tabs", _tabs_dec4, DeesAppuiTabs, _tabs4);
@@ -130606,6 +130657,8 @@ __decorateElement(_init41, 4, "showTabIndicator", _showTabIndicator_dec, DeesApp
 __decorateElement(_init41, 4, "tabStyle", _tabStyle_dec, DeesAppuiTabs, _tabStyle);
 __decorateElement(_init41, 4, "autoHide", _autoHide_dec2, DeesAppuiTabs, _autoHide2);
 __decorateElement(_init41, 4, "autoHideThreshold", _autoHideThreshold_dec, DeesAppuiTabs, _autoHideThreshold);
+__decorateElement(_init41, 4, "actionsLeft", _actionsLeft_dec, DeesAppuiTabs, _actionsLeft);
+__decorateElement(_init41, 4, "actionsRight", _actionsRight_dec, DeesAppuiTabs, _actionsRight);
 __decorateElement(_init41, 4, "canScrollLeft", _canScrollLeft_dec, DeesAppuiTabs, _canScrollLeft);
 __decorateElement(_init41, 4, "canScrollRight", _canScrollRight_dec, DeesAppuiTabs, _canScrollRight);
 DeesAppuiTabs = __decorateElement(_init41, 0, "DeesAppuiTabs", _DeesAppuiTabs_decorators, DeesAppuiTabs);
@@ -130634,6 +130687,8 @@ __publicField(DeesAppuiTabs, "styles", [
         border-bottom: 1px solid ${cssManager.bdTheme("#e5e7eb", "#27272a")};
         box-sizing: border-box;
         overflow: hidden;
+        display: flex;
+        align-items: stretch;
       }
 
       /* Scroll fade indicators */
@@ -130666,6 +130721,72 @@ __publicField(DeesAppuiTabs, "styles", [
         opacity: 1;
       }
 
+      .scroll-area {
+        position: relative;
+        flex: 1;
+        min-width: 0;
+        overflow: hidden;
+        display: flex;
+      }
+
+      /* Tab action buttons */
+      .tab-actions {
+        display: flex;
+        align-items: center;
+        gap: 2px;
+        flex-shrink: 0;
+        padding: 0 4px;
+      }
+
+      .tab-actions.left {
+        padding-left: 12px;
+        padding-right: 8px;
+        border-right: 1px solid ${cssManager.bdTheme("#e5e7eb", "#27272a")};
+      }
+
+      .tab-actions.right {
+        padding-right: 12px;
+        padding-left: 8px;
+        border-left: 1px solid ${cssManager.bdTheme("#e5e7eb", "#27272a")};
+      }
+
+      .tab-action-button {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        width: 32px;
+        height: 32px;
+        border-radius: 6px;
+        cursor: pointer;
+        transition: background 0.15s ease, color 0.15s ease;
+        background: transparent;
+        color: ${cssManager.bdTheme("#71717a", "#71717a")};
+        flex-shrink: 0;
+      }
+
+      .tab-action-button:hover {
+        background: ${cssManager.bdTheme("rgba(0, 0, 0, 0.06)", "rgba(255, 255, 255, 0.06)")};
+        color: ${cssManager.bdTheme("#09090b", "#fafafa")};
+      }
+
+      .tab-action-button:active {
+        background: ${cssManager.bdTheme("rgba(0, 0, 0, 0.1)", "rgba(255, 255, 255, 0.1)")};
+      }
+
+      .tab-action-button.disabled {
+        opacity: 0.4;
+        cursor: not-allowed;
+      }
+
+      .tab-action-button.disabled:hover {
+        background: transparent;
+        color: ${cssManager.bdTheme("#71717a", "#71717a")};
+      }
+
+      .tab-action-button dees-icon {
+        font-size: 16px;
+      }
+
       .tabsContainer {
         position: relative;
         user-select: none;
@@ -130682,12 +130803,14 @@ __publicField(DeesAppuiTabs, "styles", [
         scrollbar-width: thin;
         scrollbar-color: transparent transparent;
         height: 100%;
+        width: 100%;
         padding: 0 16px;
         gap: 4px;
       }
 
       /* Show scrollbar on hover */
-      .tabs-wrapper:hover .tabsContainer.horizontal {
+      .tabs-wrapper:hover .tabsContainer.horizontal,
+      .scroll-area:hover .tabsContainer.horizontal {
         scrollbar-color: ${cssManager.bdTheme("rgba(0,0,0,0.2)", "rgba(255,255,255,0.2)")} transparent;
       }
 
@@ -130705,11 +130828,13 @@ __publicField(DeesAppuiTabs, "styles", [
         transition: background 0.2s ease;
       }
 
-      .tabs-wrapper:hover .tabsContainer.horizontal::-webkit-scrollbar-thumb {
+      .tabs-wrapper:hover .tabsContainer.horizontal::-webkit-scrollbar-thumb,
+      .scroll-area:hover .tabsContainer.horizontal::-webkit-scrollbar-thumb {
         background: ${cssManager.bdTheme("rgba(0,0,0,0.2)", "rgba(255,255,255,0.2)")};
       }
 
-      .tabs-wrapper:hover .tabsContainer.horizontal::-webkit-scrollbar-thumb:hover {
+      .tabs-wrapper:hover .tabsContainer.horizontal::-webkit-scrollbar-thumb:hover,
+      .scroll-area:hover .tabsContainer.horizontal::-webkit-scrollbar-thumb:hover {
         background: ${cssManager.bdTheme("rgba(0,0,0,0.35)", "rgba(255,255,255,0.35)")};
       }
 
@@ -130881,11 +131006,11 @@ __runInitializers(_init41, 1, DeesAppuiTabs);
 init_dist_ts28();
 init_dist_ts27();
 init_theme();
-var _tabsAutoHideThreshold_dec, _tabsAutoHide_dec, _showTabs_dec, _selectedTab_dec3, _tabs_dec5, _a40, _DeesAppuiMaincontent_decorators, _init42, _tabs5, _selectedTab3, _showTabs, _tabsAutoHide, _tabsAutoHideThreshold;
+var _tabActionsRight_dec, _tabActionsLeft_dec, _tabsAutoHideThreshold_dec, _tabsAutoHide_dec, _showTabs_dec, _selectedTab_dec3, _tabs_dec5, _a40, _DeesAppuiMaincontent_decorators, _init42, _tabs5, _selectedTab3, _showTabs, _tabsAutoHide, _tabsAutoHideThreshold, _tabActionsLeft, _tabActionsRight;
 _DeesAppuiMaincontent_decorators = [t4("dees-appui-maincontent")];
 var DeesAppuiMaincontent = class extends (_a40 = DeesElement, _tabs_dec5 = [n5({
   type: Array
-})], _selectedTab_dec3 = [n5({ type: Object })], _showTabs_dec = [n5({ type: Boolean })], _tabsAutoHide_dec = [n5({ type: Boolean })], _tabsAutoHideThreshold_dec = [n5({ type: Number })], _a40) {
+})], _selectedTab_dec3 = [n5({ type: Object })], _showTabs_dec = [n5({ type: Boolean })], _tabsAutoHide_dec = [n5({ type: Boolean })], _tabsAutoHideThreshold_dec = [n5({ type: Number })], _tabActionsLeft_dec = [n5({ type: Array })], _tabActionsRight_dec = [n5({ type: Array })], _a40) {
   constructor() {
     super(...arguments);
     __privateAdd(this, _tabs5, __runInitializers(_init42, 8, this, [
@@ -130895,6 +131020,8 @@ var DeesAppuiMaincontent = class extends (_a40 = DeesElement, _tabs_dec5 = [n5({
     __privateAdd(this, _showTabs, __runInitializers(_init42, 16, this, true)), __runInitializers(_init42, 19, this);
     __privateAdd(this, _tabsAutoHide, __runInitializers(_init42, 20, this, false)), __runInitializers(_init42, 23, this);
     __privateAdd(this, _tabsAutoHideThreshold, __runInitializers(_init42, 24, this, 0)), __runInitializers(_init42, 27, this);
+    __privateAdd(this, _tabActionsLeft, __runInitializers(_init42, 28, this, [])), __runInitializers(_init42, 31, this);
+    __privateAdd(this, _tabActionsRight, __runInitializers(_init42, 32, this, [])), __runInitializers(_init42, 35, this);
   }
   render() {
     return b2`
@@ -130907,6 +131034,8 @@ var DeesAppuiMaincontent = class extends (_a40 = DeesElement, _tabs_dec5 = [n5({
             .tabStyle=${"horizontal"}
             .autoHide=${this.tabsAutoHide}
             .autoHideThreshold=${this.tabsAutoHideThreshold}
+            .actionsLeft=${this.tabActionsLeft}
+            .actionsRight=${this.tabActionsRight}
             @tab-select=${(e11) => this.handleTabSelect(e11)}
             @tab-close=${(e11) => this.handleTabClose(e11)}
           ></dees-appui-tabs>
@@ -130960,11 +131089,15 @@ _selectedTab3 = new WeakMap();
 _showTabs = new WeakMap();
 _tabsAutoHide = new WeakMap();
 _tabsAutoHideThreshold = new WeakMap();
+_tabActionsLeft = new WeakMap();
+_tabActionsRight = new WeakMap();
 __decorateElement(_init42, 4, "tabs", _tabs_dec5, DeesAppuiMaincontent, _tabs5);
 __decorateElement(_init42, 4, "selectedTab", _selectedTab_dec3, DeesAppuiMaincontent, _selectedTab3);
 __decorateElement(_init42, 4, "showTabs", _showTabs_dec, DeesAppuiMaincontent, _showTabs);
 __decorateElement(_init42, 4, "tabsAutoHide", _tabsAutoHide_dec, DeesAppuiMaincontent, _tabsAutoHide);
 __decorateElement(_init42, 4, "tabsAutoHideThreshold", _tabsAutoHideThreshold_dec, DeesAppuiMaincontent, _tabsAutoHideThreshold);
+__decorateElement(_init42, 4, "tabActionsLeft", _tabActionsLeft_dec, DeesAppuiMaincontent, _tabActionsLeft);
+__decorateElement(_init42, 4, "tabActionsRight", _tabActionsRight_dec, DeesAppuiMaincontent, _tabActionsRight);
 DeesAppuiMaincontent = __decorateElement(_init42, 0, "DeesAppuiMaincontent", _DeesAppuiMaincontent_decorators, DeesAppuiMaincontent);
 __publicField(DeesAppuiMaincontent, "demo", () => b2`
     <dees-appui-maincontent
@@ -131028,9 +131161,9 @@ __runInitializers(_init42, 1, DeesAppuiMaincontent);
 init_dist_ts28();
 init_dist_ts27();
 init_theme();
-var _currentView_dec, _bottombarVisible_dec, _bottombarElement_dec, _activitylogElement_dec, _maincontent_dec, _secondarymenu_dec, _mainmenu_dec, _appbar_dec, _maincontentSelectedTab_dec, _maincontentTabs_dec, _activityLogCount_dec2, _activityLogVisible_dec, _contentTabsAutoHideThreshold_dec, _contentTabsAutoHide_dec, _maincontentTabsVisible_dec, _secondarymenuVisible_dec, _mainmenuVisible_dec, _secondarymenuCollapsed_dec, _mainmenuCollapsed_dec, _secondarymenuSelectedItem_dec, _secondarymenuGroups_dec, _secondarymenuHeading_dec, _mainmenuSelectedTab_dec, _mainmenuTabs_dec, _mainmenuBottomTabs_dec, _mainmenuGroups_dec, _mainmenuLogoText_dec, _mainmenuLogoIcon_dec, _appbarShowSearch_dec, _appbarProfileMenuItems_dec, _appbarUser_dec, _appbarShowWindowControls_dec, _appbarBreadcrumbSeparator_dec, _appbarBreadcrumbs_dec, _appbarMenuItems_dec, _a41, _DeesAppui_decorators, _init43, _appbarMenuItems, _appbarBreadcrumbs, _appbarBreadcrumbSeparator, _appbarShowWindowControls, _appbarUser, _appbarProfileMenuItems, _appbarShowSearch, _mainmenuLogoIcon, _mainmenuLogoText, _mainmenuGroups, _mainmenuBottomTabs, _mainmenuTabs, _mainmenuSelectedTab, _secondarymenuHeading, _secondarymenuGroups, _secondarymenuSelectedItem, _mainmenuCollapsed, _secondarymenuCollapsed, _mainmenuVisible, _secondarymenuVisible, _maincontentTabsVisible, _contentTabsAutoHide, _contentTabsAutoHideThreshold, _activityLogVisible, _activityLogCount2, _maincontentTabs, _maincontentSelectedTab, _appbar, _mainmenu, _secondarymenu, _maincontent, _activitylogElement, _bottombarElement, _bottombarVisible, _currentView;
+var _currentView_dec, _bottombarVisible_dec, _bottombarElement_dec, _activitylogElement_dec, _maincontent_dec, _secondarymenu_dec, _mainmenu_dec, _appbar_dec, _contentTabActionsRight_dec, _contentTabActionsLeft_dec, _maincontentSelectedTab_dec, _maincontentTabs_dec, _activityLogCount_dec2, _activityLogVisible_dec, _contentTabsAutoHideThreshold_dec, _contentTabsAutoHide_dec, _maincontentTabsVisible_dec, _secondarymenuVisible_dec, _mainmenuVisible_dec, _secondarymenuCollapsed_dec, _mainmenuCollapsed_dec, _secondarymenuSelectedItem_dec, _secondarymenuGroups_dec, _secondarymenuHeading_dec, _mainmenuSelectedTab_dec, _mainmenuTabs_dec, _mainmenuBottomTabs_dec, _mainmenuGroups_dec, _mainmenuLogoText_dec, _mainmenuLogoIcon_dec, _appbarShowSearch_dec, _appbarProfileMenuItems_dec, _appbarUser_dec, _appbarShowWindowControls_dec, _appbarBreadcrumbSeparator_dec, _appbarBreadcrumbs_dec, _appbarMenuItems_dec, _a41, _DeesAppui_decorators, _init43, _appbarMenuItems, _appbarBreadcrumbs, _appbarBreadcrumbSeparator, _appbarShowWindowControls, _appbarUser, _appbarProfileMenuItems, _appbarShowSearch, _mainmenuLogoIcon, _mainmenuLogoText, _mainmenuGroups, _mainmenuBottomTabs, _mainmenuTabs, _mainmenuSelectedTab, _secondarymenuHeading, _secondarymenuGroups, _secondarymenuSelectedItem, _mainmenuCollapsed, _secondarymenuCollapsed, _mainmenuVisible, _secondarymenuVisible, _maincontentTabsVisible, _contentTabsAutoHide, _contentTabsAutoHideThreshold, _activityLogVisible, _activityLogCount2, _maincontentTabs, _maincontentSelectedTab, _contentTabActionsLeft, _contentTabActionsRight, _appbar, _mainmenu, _secondarymenu, _maincontent, _activitylogElement, _bottombarElement, _bottombarVisible, _currentView;
 _DeesAppui_decorators = [t4("dees-appui")];
-var DeesAppui = class extends (_a41 = DeesElement, _appbarMenuItems_dec = [n5({ type: Array })], _appbarBreadcrumbs_dec = [n5({ type: String })], _appbarBreadcrumbSeparator_dec = [n5({ type: String })], _appbarShowWindowControls_dec = [n5({ type: Boolean })], _appbarUser_dec = [n5({ type: Object })], _appbarProfileMenuItems_dec = [n5({ type: Array })], _appbarShowSearch_dec = [n5({ type: Boolean })], _mainmenuLogoIcon_dec = [n5({ type: String })], _mainmenuLogoText_dec = [n5({ type: String })], _mainmenuGroups_dec = [n5({ type: Array })], _mainmenuBottomTabs_dec = [n5({ type: Array })], _mainmenuTabs_dec = [n5({ type: Array })], _mainmenuSelectedTab_dec = [n5({ type: Object })], _secondarymenuHeading_dec = [n5({ type: String })], _secondarymenuGroups_dec = [n5({ type: Array })], _secondarymenuSelectedItem_dec = [n5({ type: Object })], _mainmenuCollapsed_dec = [n5({ type: Boolean })], _secondarymenuCollapsed_dec = [n5({ type: Boolean })], _mainmenuVisible_dec = [n5({ type: Boolean })], _secondarymenuVisible_dec = [n5({ type: Boolean })], _maincontentTabsVisible_dec = [n5({ type: Boolean })], _contentTabsAutoHide_dec = [n5({ type: Boolean })], _contentTabsAutoHideThreshold_dec = [n5({ type: Number })], _activityLogVisible_dec = [r5()], _activityLogCount_dec2 = [r5()], _maincontentTabs_dec = [n5({ type: Array })], _maincontentSelectedTab_dec = [n5({ type: Object })], _appbar_dec = [r5()], _mainmenu_dec = [r5()], _secondarymenu_dec = [r5()], _maincontent_dec = [r5()], _activitylogElement_dec = [r5()], _bottombarElement_dec = [r5()], _bottombarVisible_dec = [r5()], _currentView_dec = [r5()], _a41) {
+var DeesAppui = class extends (_a41 = DeesElement, _appbarMenuItems_dec = [n5({ type: Array })], _appbarBreadcrumbs_dec = [n5({ type: String })], _appbarBreadcrumbSeparator_dec = [n5({ type: String })], _appbarShowWindowControls_dec = [n5({ type: Boolean })], _appbarUser_dec = [n5({ type: Object })], _appbarProfileMenuItems_dec = [n5({ type: Array })], _appbarShowSearch_dec = [n5({ type: Boolean })], _mainmenuLogoIcon_dec = [n5({ type: String })], _mainmenuLogoText_dec = [n5({ type: String })], _mainmenuGroups_dec = [n5({ type: Array })], _mainmenuBottomTabs_dec = [n5({ type: Array })], _mainmenuTabs_dec = [n5({ type: Array })], _mainmenuSelectedTab_dec = [n5({ type: Object })], _secondarymenuHeading_dec = [n5({ type: String })], _secondarymenuGroups_dec = [n5({ type: Array })], _secondarymenuSelectedItem_dec = [n5({ type: Object })], _mainmenuCollapsed_dec = [n5({ type: Boolean })], _secondarymenuCollapsed_dec = [n5({ type: Boolean })], _mainmenuVisible_dec = [n5({ type: Boolean })], _secondarymenuVisible_dec = [n5({ type: Boolean })], _maincontentTabsVisible_dec = [n5({ type: Boolean })], _contentTabsAutoHide_dec = [n5({ type: Boolean })], _contentTabsAutoHideThreshold_dec = [n5({ type: Number })], _activityLogVisible_dec = [r5()], _activityLogCount_dec2 = [r5()], _maincontentTabs_dec = [n5({ type: Array })], _maincontentSelectedTab_dec = [n5({ type: Object })], _contentTabActionsLeft_dec = [n5({ type: Array })], _contentTabActionsRight_dec = [n5({ type: Array })], _appbar_dec = [r5()], _mainmenu_dec = [r5()], _secondarymenu_dec = [r5()], _maincontent_dec = [r5()], _activitylogElement_dec = [r5()], _bottombarElement_dec = [r5()], _bottombarVisible_dec = [r5()], _currentView_dec = [r5()], _a41) {
   constructor() {
     super(...arguments);
     // ==========================================
@@ -131067,14 +131200,16 @@ var DeesAppui = class extends (_a41 = DeesElement, _appbarMenuItems_dec = [n5({
     __privateAdd(this, _activityLogCount2, __runInitializers(_init43, 104, this, 0)), __runInitializers(_init43, 107, this);
     __privateAdd(this, _maincontentTabs, __runInitializers(_init43, 108, this, [])), __runInitializers(_init43, 111, this);
     __privateAdd(this, _maincontentSelectedTab, __runInitializers(_init43, 112, this)), __runInitializers(_init43, 115, this);
-    __privateAdd(this, _appbar, __runInitializers(_init43, 116, this)), __runInitializers(_init43, 119, this);
-    __privateAdd(this, _mainmenu, __runInitializers(_init43, 120, this)), __runInitializers(_init43, 123, this);
-    __privateAdd(this, _secondarymenu, __runInitializers(_init43, 124, this)), __runInitializers(_init43, 127, this);
-    __privateAdd(this, _maincontent, __runInitializers(_init43, 128, this)), __runInitializers(_init43, 131, this);
-    __privateAdd(this, _activitylogElement, __runInitializers(_init43, 132, this)), __runInitializers(_init43, 135, this);
-    __privateAdd(this, _bottombarElement, __runInitializers(_init43, 136, this)), __runInitializers(_init43, 139, this);
-    __privateAdd(this, _bottombarVisible, __runInitializers(_init43, 140, this, true)), __runInitializers(_init43, 143, this);
-    __privateAdd(this, _currentView, __runInitializers(_init43, 144, this)), __runInitializers(_init43, 147, this);
+    __privateAdd(this, _contentTabActionsLeft, __runInitializers(_init43, 116, this, [])), __runInitializers(_init43, 119, this);
+    __privateAdd(this, _contentTabActionsRight, __runInitializers(_init43, 120, this, [])), __runInitializers(_init43, 123, this);
+    __privateAdd(this, _appbar, __runInitializers(_init43, 124, this)), __runInitializers(_init43, 127, this);
+    __privateAdd(this, _mainmenu, __runInitializers(_init43, 128, this)), __runInitializers(_init43, 131, this);
+    __privateAdd(this, _secondarymenu, __runInitializers(_init43, 132, this)), __runInitializers(_init43, 135, this);
+    __privateAdd(this, _maincontent, __runInitializers(_init43, 136, this)), __runInitializers(_init43, 139, this);
+    __privateAdd(this, _activitylogElement, __runInitializers(_init43, 140, this)), __runInitializers(_init43, 143, this);
+    __privateAdd(this, _bottombarElement, __runInitializers(_init43, 144, this)), __runInitializers(_init43, 147, this);
+    __privateAdd(this, _bottombarVisible, __runInitializers(_init43, 148, this, true)), __runInitializers(_init43, 151, this);
+    __privateAdd(this, _currentView, __runInitializers(_init43, 152, this)), __runInitializers(_init43, 155, this);
     // Internal services
     __publicField(this, "viewRegistry", new ViewRegistry());
     __publicField(this, "routerCleanup", null);
@@ -131131,6 +131266,8 @@ var DeesAppui = class extends (_a41 = DeesElement, _appbarMenuItems_dec = [n5({
           .showTabs=${this.maincontentTabsVisible}
           .tabsAutoHide=${this.contentTabsAutoHide}
           .tabsAutoHideThreshold=${this.contentTabsAutoHideThreshold}
+          .tabActionsLeft=${this.contentTabActionsLeft}
+          .tabActionsRight=${this.contentTabActionsRight}
           @tab-select=${(e11) => this.handleContentTabSelect(e11)}
           @tab-close=${(e11) => this.handleContentTabClose(e11)}
         >
@@ -131472,6 +131609,18 @@ var DeesAppui = class extends (_a41 = DeesElement, _appbarMenuItems_dec = [n5({
   getSelectedContentTab() {
     return this.maincontentSelectedTab;
   }
+  /**
+   * Set content tab action buttons on the left side
+   */
+  setContentTabActionsLeft(actions) {
+    this.contentTabActionsLeft = [...actions];
+  }
+  /**
+   * Set content tab action buttons on the right side
+   */
+  setContentTabActionsRight(actions) {
+    this.contentTabActionsRight = [...actions];
+  }
   // ==========================================
   // PROGRAMMATIC API: ACTIVITY LOG
   // ==========================================
@@ -131919,6 +132068,8 @@ _activityLogVisible = new WeakMap();
 _activityLogCount2 = new WeakMap();
 _maincontentTabs = new WeakMap();
 _maincontentSelectedTab = new WeakMap();
+_contentTabActionsLeft = new WeakMap();
+_contentTabActionsRight = new WeakMap();
 _appbar = new WeakMap();
 _mainmenu = new WeakMap();
 _secondarymenu = new WeakMap();
@@ -131954,6 +132105,8 @@ __decorateElement(_init43, 4, "activityLogVisible", _activityLogVisible_dec, Dee
 __decorateElement(_init43, 4, "activityLogCount", _activityLogCount_dec2, DeesAppui, _activityLogCount2);
 __decorateElement(_init43, 4, "maincontentTabs", _maincontentTabs_dec, DeesAppui, _maincontentTabs);
 __decorateElement(_init43, 4, "maincontentSelectedTab", _maincontentSelectedTab_dec, DeesAppui, _maincontentSelectedTab);
+__decorateElement(_init43, 4, "contentTabActionsLeft", _contentTabActionsLeft_dec, DeesAppui, _contentTabActionsLeft);
+__decorateElement(_init43, 4, "contentTabActionsRight", _contentTabActionsRight_dec, DeesAppui, _contentTabActionsRight);
 __decorateElement(_init43, 4, "appbar", _appbar_dec, DeesAppui, _appbar);
 __decorateElement(_init43, 4, "mainmenu", _mainmenu_dec, DeesAppui, _mainmenu);
 __decorateElement(_init43, 4, "secondarymenu", _secondarymenu_dec, DeesAppui, _secondarymenu);
@@ -165576,7 +165729,7 @@ init_group_runtime();
 // ts_web/00_commitinfo_data.ts
 var commitinfo = {
   name: "@design.estate/dees-catalog",
-  version: "3.43.4",
+  version: "3.44.0",
   description: "A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript."
 };
 export {
@@ -167530,4 +167683,4 @@ ibantools/jsnext/ibantools.js:
    * @preferred
    *)
 */
-//# sourceMappingURL=bundle-1773077881686.js.map
+//# sourceMappingURL=bundle-1773146372777.js.map

package/dist_ts_web/00_commitinfo_data.js

@@ -3,7 +3,7 @@
  */
 export const commitinfo = {
     name: '@design.estate/dees-catalog',
-    version: '3.43.4',
+    version: '3.44.0',
     description: 'A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript.'
 };
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiMDBfY29tbWl0aW5mb19kYXRhLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vdHNfd2ViLzAwX2NvbW1pdGluZm9fZGF0YS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7R0FFRztBQUNILE1BQU0sQ0FBQyxNQUFNLFVBQVUsR0FBRztJQUN4QixJQUFJLEVBQUUsNkJBQTZCO0lBQ25DLE9BQU8sRUFBRSxRQUFRO0lBQ2pCLFdBQVcsRUFBRSxzSkFBc0o7Q0FDcEssQ0FBQSJ9

package/dist_ts_web/elements/00group-appui/dees-appui/dees-appui.d.ts

@@ -53,6 +53,8 @@ export declare class DeesAppui extends DeesElement {
     accessor activityLogCount: number;
     accessor maincontentTabs: interfaces.IMenuItem[];
     accessor maincontentSelectedTab: interfaces.IMenuItem | undefined;
+    accessor contentTabActionsLeft: interfaces.ITabAction[];
+    accessor contentTabActionsRight: interfaces.ITabAction[];
     accessor appbar: DeesAppuiBar | undefined;
     accessor mainmenu: DeesAppuiMainmenu | undefined;
     accessor secondarymenu: DeesAppuiSecondarymenu | undefined;
@@ -197,6 +199,14 @@ export declare class DeesAppui extends DeesElement {
      * Get the currently selected content tab
      */
     getSelectedContentTab(): interfaces.IMenuItem | undefined;
+    /**
+     * Set content tab action buttons on the left side
+     */
+    setContentTabActionsLeft(actions: interfaces.ITabAction[]): void;
+    /**
+     * Set content tab action buttons on the right side
+     */
+    setContentTabActionsRight(actions: interfaces.ITabAction[]): void;
     /**
      * Get the activity log API
      */