feat(appui-tabs): add closeable tabs and auto-hide behavior for content tabs, plus API and events to control them

ts_web/elements/00group-appui/dees-appui-base/dees-appui-base.demo.ts

@@ -162,10 +162,30 @@ class DemoDashboardView extends DeesElement {
           <button class="ctx-btn" @click=${() => this.ctx?.appui.activityLog.add({ type: 'custom', user: 'Demo User', message: 'Button clicked from ctx!', iconName: 'lucide:mouse-pointer-click' })}>Add Activity Entry</button>
           <button class="ctx-btn" @click=${() => this.ctx?.appui.setMainMenuBadge('tasks', 99)}>Set Tasks Badge to 99</button>
           <button class="ctx-btn danger" @click=${() => this.ctx?.appui.clearMainMenuBadge('tasks')}>Clear Tasks Badge</button>
+          <button class="ctx-btn" @click=${() => this.ctx?.appui.setContentTabsAutoHide(true, 1)}>Auto-hide Tabs (≤1)</button>
+          <button class="ctx-btn danger" @click=${() => this.ctx?.appui.setContentTabsAutoHide(false)}>Disable Auto-hide</button>
+          <button class="ctx-btn success" @click=${() => this.addCloseableTab()}>Add Closeable Tab</button>
         </div>
       </div>
     `;
   }
+
+  private tabCounter = 0;
+
+  private addCloseableTab() {
+    if (!this.ctx) return;
+    this.tabCounter++;
+    const tabKey = `Tab ${this.tabCounter}`;
+    this.ctx.appui.addContentTab({
+      key: tabKey,
+      iconName: 'lucide:file',
+      action: () => console.log(`Selected ${tabKey}`),
+      closeable: true,
+      onClose: () => {
+        this.ctx?.appui.removeContentTab(tabKey);
+      }
+    });
+  }
 }
 
 // Settings view with route params and canDeactivate guard