@design.estate/dees-catalog 3.67.0 → 3.68.0

package/dist_bundle/bundle.js

@@ -145176,11 +145176,17 @@ var _DeesFormSubmit = class _DeesFormSubmit extends (_a25 = DeesElement, _disabl
         .text=${this.text}
         ?disabled=${this.disabled}
         @clicked=${this.submit}
-      >
-        <slot></slot>
-      </dees-button>
+      ></dees-button>
     `;
   }
+  async firstUpdated() {
+    if (!this.text) {
+      const slotText = this.textContent?.trim();
+      if (slotText) {
+        this.text = slotText;
+      }
+    }
+  }
   async submit() {
     if (this.disabled) {
       return;
@@ -165272,7 +165278,7 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
               </th>
             ` : b2``}
         ${effectiveColumns.filter((c11) => !c11.hidden).map((col) => {
-      const isSortable = !!col.sortable;
+      const isSortable = col.sortable !== false;
       const ariaSort = this.getAriaSort(col);
       return b2`
               <th
@@ -165500,10 +165506,16 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
         headerHeight += realHeadRows[r11].getBoundingClientRect().height;
       }
     }
-    const shouldBeActive = tableRect.top < stick.top && tableRect.bottom > stick.top + Math.min(headerHeight, 1);
+    const distance = tableRect.bottom - stick.top;
+    const shouldBeActive = tableRect.top < stick.top && distance > 0;
     if (shouldBeActive !== this.__floatingActive) {
       this.__floatingActive = shouldBeActive;
       fh.classList.toggle("active", shouldBeActive);
+      if (!shouldBeActive) {
+        fh.style.height = "";
+        const ft = this.__floatingTableEl;
+        if (ft) ft.style.transform = "";
+      }
       if (shouldBeActive) {
         this.updateComplete.then(() => this.__syncFloatingHeader());
         return;
@@ -165532,8 +165544,12 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
     fh.style.top = `${stick.top}px`;
     fh.style.left = `${clipLeft}px`;
     fh.style.width = `${clipWidth}px`;
+    const visibleHeight = Math.min(headerHeight, distance);
+    const exitOffset = headerHeight - visibleHeight;
+    fh.style.height = `${visibleHeight}px`;
     floatTable.style.width = `${tableRect.width}px`;
     floatTable.style.marginLeft = `${tableRect.left - clipLeft}px`;
+    floatTable.style.transform = exitOffset > 0 ? `translateY(-${exitOffset}px)` : "";
   }
   async disconnectedCallback() {
     super.disconnectedCallback();
@@ -165845,7 +165861,7 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
     const key2 = String(col.key);
     const existing = this.getSortDescriptor(key2);
     const cascadeLen = this.sortBy.length;
-    const sortableColumnCount = effectiveColumns.filter((c11) => !!c11.sortable).length;
+    const sortableColumnCount = effectiveColumns.filter((c11) => c11.sortable !== false).length;
     const maxSlot = Math.min(
       Math.max(cascadeLen + (existing ? 0 : 1), 1),
       Math.max(sortableColumnCount, 1)
@@ -165939,6 +165955,16 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
         }, "action")
       });
     }
+    items.push({ divider: true });
+    items.push({
+      name: this.showColumnFilters ? "Hide column filters" : "Show column filters",
+      iconName: this.showColumnFilters ? "lucide:filterX" : "lucide:filter",
+      action: /* @__PURE__ */ __name(async () => {
+        this.showColumnFilters = !this.showColumnFilters;
+        this.requestUpdate();
+        return null;
+      }, "action")
+    });
     return items;
   }
   // ─── sort: indicator + ARIA ──────────────────────────────────────────
@@ -193928,12 +193954,35 @@ var demoFunc57 = /* @__PURE__ */ __name(() => b2`
   {
     name: "Analytics",
     iconName: "lucide:lineChart",
-    element: DemoViewAnalytics
+    element: DemoViewAnalytics,
+    subViews: [
+      {
+        name: "Overview",
+        iconName: "lucide:activity",
+        element: DemoViewAnalytics
+      },
+      {
+        name: "Reports",
+        iconName: "lucide:fileText",
+        element: DemoViewDashboard
+      }
+    ]
   },
   {
     name: "Settings",
     iconName: "lucide:settings",
-    element: DemoViewSettings
+    subViews: [
+      {
+        name: "Profile",
+        iconName: "lucide:user",
+        element: DemoViewSettings
+      },
+      {
+        name: "Billing",
+        iconName: "lucide:creditCard",
+        element: DemoViewSettings
+      }
+    ]
   }
 ]}
       @logout=${() => {
@@ -193978,10 +194027,12 @@ var _DeesSimpleAppDash = class _DeesSimpleAppDash extends (_a97 = DeesElement, _
           <div class="viewTabs-container">
             <div class="section-label">Navigation</div>
             <div class="viewTabs">
-              ${this.viewTabs.map(
-      (view) => b2`
+              ${this.viewTabs.map((view) => {
+      const hasSubs = !!view.subViews?.length;
+      const groupActive = hasSubs && this.isGroupActive(view);
+      return b2`
                   <div
-                    class="viewTab ${this.selectedView === view ? "selected" : ""}"
+                    class="viewTab ${this.selectedView === view ? "selected" : ""} ${hasSubs ? "hasSubs" : ""} ${groupActive ? "groupActive" : ""}"
                     @click=${() => this.loadView(view)}
                   >
                     ${view.iconName ? b2`
@@ -193990,9 +194041,34 @@ var _DeesSimpleAppDash = class _DeesSimpleAppDash extends (_a97 = DeesElement, _
                       <dees-icon .icon="${"lucide:file"}"></dees-icon>
                     `}
                     <span>${view.name}</span>
+                    ${hasSubs ? b2`
+                      <dees-icon class="chevron" .icon="${"lucide:chevronDown"}"></dees-icon>
+                    ` : ""}
                   </div>
-                `
-    )}
+                  ${hasSubs && groupActive ? b2`
+                    <div class="subViews">
+                      ${view.subViews.map(
+        (sub2) => b2`
+                          <div
+                            class="viewTab sub ${this.selectedView === sub2 ? "selected" : ""}"
+                            @click=${(e11) => {
+          e11.stopPropagation();
+          this.loadView(sub2);
+        }}
+                          >
+                            ${sub2.iconName ? b2`
+                              <dees-icon .icon="${sub2.iconName.includes(":") ? sub2.iconName : `lucide:${sub2.iconName}`}"></dees-icon>
+                            ` : b2`
+                              <dees-icon .icon="${"lucide:dot"}"></dees-icon>
+                            `}
+                            <span>${sub2.name}</span>
+                          </div>
+                        `
+      )}
+                    </div>
+                  ` : ""}
+                `;
+    })}
             </div>
           </div>
           <div class="appActions">
@@ -194160,7 +194236,19 @@ var _DeesSimpleAppDash = class _DeesSimpleAppDash extends (_a97 = DeesElement, _
       this.currentTerminal = null;
     }
   }
+  isGroupActive(view) {
+    if (this.selectedView === view) return true;
+    return view.subViews?.some((sv) => sv === this.selectedView) ?? false;
+  }
   async loadView(viewArg) {
+    if (!viewArg.element && viewArg.subViews?.length) {
+      const firstNavigable = viewArg.subViews.find((sv) => sv.element);
+      if (firstNavigable) {
+        return this.loadView(firstNavigable);
+      }
+      return;
+    }
+    if (!viewArg.element) return;
     const appcontent = this.shadowRoot.querySelector(".appcontent");
     const view = new viewArg.element();
     if (this.currentView) {
@@ -194372,6 +194460,55 @@ __publicField(_DeesSimpleAppDash, "styles", [
         white-space: nowrap;
       }
 
+      .viewTab .chevron {
+        flex: 0 0 auto;
+        font-size: 14px;
+        opacity: 0.5;
+        transform: rotate(-90deg);
+        transition: transform 0.2s ease, opacity 0.15s ease;
+      }
+
+      .viewTab.hasSubs:hover .chevron {
+        opacity: 0.75;
+      }
+
+      .viewTab.hasSubs.groupActive .chevron {
+        transform: rotate(0deg);
+        opacity: 0.9;
+      }
+
+      .subViews {
+        display: flex;
+        flex-direction: column;
+        gap: 2px;
+        margin: 2px 0 4px 12px;
+        padding-left: 12px;
+        position: relative;
+      }
+
+      .subViews::before {
+        content: '';
+        position: absolute;
+        left: 0;
+        top: 4px;
+        bottom: 4px;
+        width: 1px;
+        background: var(--dees-color-border-default);
+      }
+
+      .viewTab.sub {
+        padding: 8px 12px;
+        font-size: 12px;
+      }
+
+      .viewTab.sub dees-icon {
+        font-size: 14px;
+      }
+
+      .viewTab.sub.selected::before {
+        left: -12px;
+      }
+
       .appActions {
         padding: 12px 8px;
         border-top: 1px solid var(--dees-color-border-default);
@@ -200295,7 +200432,7 @@ init_group_runtime();
 // ts_web/00_commitinfo_data.ts
 var commitinfo = {
   name: "@design.estate/dees-catalog",
-  version: "3.67.0",
+  version: "3.68.0",
   description: "A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript."
 };
 export {
@@ -202268,4 +202405,4 @@ ibantools/jsnext/ibantools.js:
    * @preferred
    *)
 */
-//# sourceMappingURL=bundle-1775595907478.js.map
+//# sourceMappingURL=bundle-1775635568867.js.map

package/dist_ts_web/00_commitinfo_data.js

@@ -3,7 +3,7 @@
  */
 export const commitinfo = {
     name: '@design.estate/dees-catalog',
-    version: '3.67.0',
+    version: '3.68.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