@expcat/tigercat-vue 1.2.47 → 1.3.0

package/dist/{chunk-6GPX4ONB.mjs → chunk-35NT2WJR.mjs}

@@ -12,7 +12,7 @@ import {
 } from "./chunk-MKBIVETW.mjs";
 import {
   Button
-} from "./chunk-PO5GVU4Q.mjs";
+} from "./chunk-YZBQ6IR7.mjs";
 import {
   Avatar
 } from "./chunk-ZCT56WB7.mjs";

package/dist/{chunk-ICECZVMX.js → chunk-3XCQRM3L.js}

@@ -1,12 +1,12 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
 
-var _chunkDMNOK6OPjs = require('./chunk-DMNOK6OP.js');
+var _chunk7VHDBN6Ujs = require('./chunk-7VHDBN6U.js');
 
 
 var _chunkWUEP3PFNjs = require('./chunk-WUEP3PFN.js');
 
 
-var _chunk4VLNT2EDjs = require('./chunk-4VLNT2ED.js');
+var _chunkHA5QZ76Mjs = require('./chunk-HA5QZ76M.js');
 
 // src/components/CropUpload.ts
 var _vue = require('vue');
@@ -171,7 +171,7 @@ var CropUpload = _vue.defineComponent.call(void 0, {
         ]
       );
       const modal = _vue.h.call(void 0, 
-        _chunkDMNOK6OPjs.Modal,
+        _chunk7VHDBN6Ujs.Modal,
         {
           open: modalVisible.value,
           size: "lg",
@@ -191,9 +191,9 @@ var CropUpload = _vue.defineComponent.call(void 0, {
             ...props.cropperProps
           }) : null,
           footer: ({ cancel: _cancel }) => _vue.h.call(void 0, "div", { class: _tigercatcore.modalFooterClasses }, [
-            _vue.h.call(void 0, _chunk4VLNT2EDjs.Button, { variant: "secondary", onClick: handleCancel }, { default: () => "\u53D6\u6D88" }),
+            _vue.h.call(void 0, _chunkHA5QZ76Mjs.Button, { variant: "secondary", onClick: handleCancel }, { default: () => "\u53D6\u6D88" }),
             _vue.h.call(void 0, 
-              _chunk4VLNT2EDjs.Button,
+              _chunkHA5QZ76Mjs.Button,
               { onClick: handleConfirm, loading: cropping.value },
               { default: () => "\u786E\u8BA4\u88C1\u526A" }
             )

package/dist/{chunk-BIDBJNTL.mjs → chunk-4YXQMKKW.mjs}

@@ -1,6 +1,6 @@
 import {
   Select
-} from "./chunk-PYT5DTQQ.mjs";
+} from "./chunk-IZQ7BRHC.mjs";
 import {
   Radio
 } from "./chunk-YZP4K6KI.mjs";
@@ -34,6 +34,7 @@ import {
   getImmediateTigerLocale,
   getTableLabels,
   getTableWrapperClasses,
+  getTableResponsiveCardClasses,
   getTableResponsiveCardListClasses,
   getTableResponsiveTableClasses,
   getTableVirtualRecommendation,
@@ -41,7 +42,6 @@ import {
   mergeTigerLocale,
   resolveTigerLocale,
   tableBaseClasses,
-  tableResponsiveCardClasses,
   tableResponsiveCardLabelClasses,
   tableResponsiveCardRowClasses,
   tableResponsiveCardTitleClasses,
@@ -168,6 +168,18 @@ var tableProps = {
   renderCard: {
     type: Function
   },
+  cardSelectionPosition: {
+    type: String,
+    default: "controls-row"
+  },
+  cardPadding: {
+    type: [String, Boolean],
+    default: void 0
+  },
+  cardFieldGap: {
+    type: String,
+    default: "gap-3"
+  },
   // --- v0.6.0 props ---
   virtual: { type: Boolean, default: false },
   autoVirtual: { type: Boolean, default: true },
@@ -1430,44 +1442,48 @@ var Table = defineComponent({
         }
         if (sortableColumns.length > 0) {
           cardChildren.push(
-            h6("div", {
-              class: "rounded-[var(--tiger-radius-md,0.5rem)] border border-[var(--tiger-border,#e5e7eb)] bg-[var(--tiger-surface,#ffffff)] px-3 py-2"
-            }, [
-              h6(Select, {
-                size: "sm",
-                modelValue: ctx.sortState.value.key && ctx.sortState.value.direction ? `${ctx.sortState.value.key}:${ctx.sortState.value.direction}` : "",
-                options: [
-                  { label: tableLabels.value.clearSortText, value: "" },
-                  ...sortableColumns.flatMap((column) => [
-                    {
-                      label: `${formatTableSortByText(tableLabels.value.sortByText, column.title)} \u2191`,
-                      value: `${column.key}:asc`
-                    },
-                    {
-                      label: `${formatTableSortByText(tableLabels.value.sortByText, column.title)} \u2193`,
-                      value: `${column.key}:desc`
+            h6(
+              "div",
+              {
+                class: "rounded-[var(--tiger-radius-md,0.5rem)] border border-[var(--tiger-border,#e5e7eb)] bg-[var(--tiger-surface,#ffffff)] px-3 py-2"
+              },
+              [
+                h6(Select, {
+                  size: "sm",
+                  modelValue: ctx.sortState.value.key && ctx.sortState.value.direction ? `${ctx.sortState.value.key}:${ctx.sortState.value.direction}` : "",
+                  options: [
+                    { label: tableLabels.value.clearSortText, value: "" },
+                    ...sortableColumns.flatMap((column) => [
+                      {
+                        label: `${formatTableSortByText(tableLabels.value.sortByText, column.title)} \u2191`,
+                        value: `${column.key}:asc`
+                      },
+                      {
+                        label: `${formatTableSortByText(tableLabels.value.sortByText, column.title)} \u2193`,
+                        value: `${column.key}:desc`
+                      }
+                    ])
+                  ],
+                  clearable: false,
+                  "onUpdate:modelValue": (value) => {
+                    const nextValue = String(value ?? "");
+                    if (!nextValue) {
+                      ctx.handleSetSort({ key: null, direction: null });
+                      return;
                     }
-                  ])
-                ],
-                clearable: false,
-                "onUpdate:modelValue": (value) => {
-                  const nextValue = String(value ?? "");
-                  if (!nextValue) {
-                    ctx.handleSetSort({ key: null, direction: null });
-                    return;
+                    const separatorIndex = nextValue.lastIndexOf(":");
+                    const key = nextValue.slice(0, separatorIndex);
+                    const direction = nextValue.slice(separatorIndex + 1);
+                    ctx.handleSetSort({ key, direction });
                   }
-                  const separatorIndex = nextValue.lastIndexOf(":");
-                  const key = nextValue.slice(0, separatorIndex);
-                  const direction = nextValue.slice(separatorIndex + 1);
-                  ctx.handleSetSort({ key, direction });
-                }
-              })
-            ])
+                })
+              ]
+            )
           );
         }
         if (ctx.paginatedData.value.length === 0) {
           cardChildren.push(
-            h6("div", { class: tableResponsiveCardClasses }, [
+            h6("div", { class: getTableResponsiveCardClasses(resolvedProps.cardPadding) }, [
               h6(Empty, { showImage: false, description: tableLabels.value.emptyText })
             ])
           );
@@ -1489,33 +1505,56 @@ var Table = defineComponent({
               const rows = hasCustomCardLayout.value ? [
                 h6(
                   "div",
-                  { class: "grid grid-cols-12 gap-3 mt-2" },
+                  {
+                    class: classNames3(
+                      "grid grid-cols-12 mt-2",
+                      resolvedProps.cardFieldGap ?? "gap-3"
+                    )
+                  },
                   bodyColumns.map((column) => {
                     const layoutItem = cardLayoutMap.value.get(column.key);
                     const gridInfo = getCardGridInfo(column, layoutItem);
                     if (gridInfo.hideLabel) {
                       return h6(
                         "div",
-                        { key: column.key, class: gridInfo.className },
+                        {
+                          key: column.key,
+                          class: classNames3(
+                            gridInfo.className,
+                            gridInfo.divider && "border-t border-[var(--tiger-border,#e5e7eb)] pt-3"
+                          )
+                        },
                         [renderCardCellContent(column)]
                       );
                     }
                     if (gridInfo.labelPosition === "top") {
                       return h6(
                         "div",
-                        { key: column.key, class: gridInfo.className },
+                        {
+                          key: column.key,
+                          class: classNames3(
+                            gridInfo.className,
+                            gridInfo.divider && "border-t border-[var(--tiger-border,#e5e7eb)] pt-3"
+                          )
+                        },
                         [
                           h6(
                             "div",
                             {
-                              class: "text-xs font-medium uppercase tracking-wider text-[var(--tiger-text-muted,#6b7280)] mb-1"
+                              class: classNames3(
+                                "text-xs font-medium uppercase tracking-wider text-[var(--tiger-text-muted,#6b7280)] mb-1",
+                                gridInfo.labelClassName
+                              )
                             },
                             column.title
                           ),
                           h6(
                             "div",
                             {
-                              class: "min-w-0 text-sm text-[var(--tiger-text,#111827)] break-words"
+                              class: classNames3(
+                                "min-w-0 text-sm text-[var(--tiger-text,#111827)] break-words",
+                                gridInfo.valueClassName
+                              )
                             },
                             [renderCardCellContent(column)]
                           )
@@ -1528,21 +1567,28 @@ var Table = defineComponent({
                         key: column.key,
                         class: classNames3(
                           gridInfo.className,
-                          "grid grid-cols-[auto_1fr] gap-2 items-baseline"
+                          "grid grid-cols-[auto_1fr] gap-2 items-baseline",
+                          gridInfo.divider && "border-t border-[var(--tiger-border,#e5e7eb)] pt-3"
                         )
                       },
                       [
                         h6(
                           "div",
                           {
-                            class: "text-xs font-medium uppercase tracking-wider text-[var(--tiger-text-muted,#6b7280)] shrink-0"
+                            class: classNames3(
+                              "text-xs font-medium uppercase tracking-wider text-[var(--tiger-text-muted,#6b7280)] shrink-0",
+                              gridInfo.labelClassName
+                            )
                           },
                           column.title
                         ),
                         h6(
                           "div",
                           {
-                            class: "min-w-0 text-sm text-[var(--tiger-text,#111827)] break-words"
+                            class: classNames3(
+                              "min-w-0 text-sm text-[var(--tiger-text,#111827)] break-words",
+                              gridInfo.valueClassName
+                            )
                           },
                           [renderCardCellContent(column)]
                         )
@@ -1551,48 +1597,40 @@ var Table = defineComponent({
                   })
                 )
               ] : bodyColumns.map(
-                (column) => h6(
-                  "div",
-                  { key: column.key, class: tableResponsiveCardRowClasses },
-                  [
-                    h6("div", { class: tableResponsiveCardLabelClasses }, column.title),
-                    h6("div", { class: tableResponsiveCardValueClasses }, [
-                      renderCardCellContent(column)
-                    ])
-                  ]
-                )
+                (column) => h6("div", { key: column.key, class: tableResponsiveCardRowClasses }, [
+                  h6("div", { class: tableResponsiveCardLabelClasses }, column.title),
+                  h6("div", { class: tableResponsiveCardValueClasses }, [
+                    renderCardCellContent(column)
+                  ])
+                ])
               );
               const controls = [];
               if (resolvedProps.rowSelection && resolvedProps.rowSelection.showCheckbox !== false) {
                 const checkboxProps = resolvedProps.rowSelection.getCheckboxProps?.(record) || {};
                 controls.push(
-                  h6(
-                    "span",
-                    { onClick: (event) => event.stopPropagation() },
-                    [
-                      resolvedProps.rowSelection.type === "radio" ? h6(Radio, {
-                        value: key,
-                        checked: isSelected,
-                        disabled: checkboxProps.disabled,
-                        "aria-label": formatTableSelectRowAriaLabel(
-                          tableLabels.value.selectRowAriaLabel,
-                          index + 1,
-                          tableLocale.value?.locale
-                        ),
-                        onChange: () => ctx.handleSelectRow(key, true)
-                      }) : h6(Checkbox, {
-                        size: "sm",
-                        modelValue: isSelected,
-                        disabled: checkboxProps.disabled,
-                        "aria-label": formatTableSelectRowAriaLabel(
-                          tableLabels.value.selectRowAriaLabel,
-                          index + 1,
-                          tableLocale.value?.locale
-                        ),
-                        onChange: (checked) => ctx.handleSelectRow(key, checked)
-                      })
-                    ]
-                  )
+                  h6("span", { onClick: (event) => event.stopPropagation() }, [
+                    resolvedProps.rowSelection.type === "radio" ? h6(Radio, {
+                      value: key,
+                      checked: isSelected,
+                      disabled: checkboxProps.disabled,
+                      "aria-label": formatTableSelectRowAriaLabel(
+                        tableLabels.value.selectRowAriaLabel,
+                        index + 1,
+                        tableLocale.value?.locale
+                      ),
+                      onChange: () => ctx.handleSelectRow(key, true)
+                    }) : h6(Checkbox, {
+                      size: "sm",
+                      modelValue: isSelected,
+                      disabled: checkboxProps.disabled,
+                      "aria-label": formatTableSelectRowAriaLabel(
+                        tableLabels.value.selectRowAriaLabel,
+                        index + 1,
+                        tableLocale.value?.locale
+                      ),
+                      onChange: (checked) => ctx.handleSelectRow(key, checked)
+                    })
+                  ])
                 );
               }
               if (resolvedProps.expandable && isRowExpandable) {
@@ -1612,6 +1650,21 @@ var Table = defineComponent({
                   )
                 );
               }
+              const titleWithInlineControls = titleNode && resolvedProps.cardSelectionPosition === "title-inline" && controls.length ? h6(
+                "div",
+                {
+                  class: classNames3(
+                    tableResponsiveCardTitleClasses,
+                    "flex items-center gap-3"
+                  )
+                },
+                [
+                  ...controls,
+                  h6("span", { class: "min-w-0 flex-1" }, [
+                    renderCardCellContent(titleColumn)
+                  ])
+                ]
+              ) : titleNode;
               const expandedContent = resolvedProps.expandable && isExpanded && isRowExpandable ? slots["expanded-row"]?.({ record, index }) ?? resolvedProps.expandable.expandedRowRender?.(record, index) : null;
               const cardContext = {
                 record,
@@ -1628,12 +1681,15 @@ var Table = defineComponent({
                 "div",
                 {
                   key,
-                  class: classNames3(tableResponsiveCardClasses, resolvedCardClassName),
+                  class: classNames3(
+                    getTableResponsiveCardClasses(resolvedProps.cardPadding),
+                    resolvedCardClassName
+                  ),
                   onClick: () => ctx.handleRowClick(record, index, key)
                 },
                 customCard !== void 0 && customCard !== null ? [customCard] : [
-                  controls.length ? h6("div", { class: "mb-2 flex items-center gap-3" }, controls) : null,
-                  titleNode,
+                  controls.length && (!titleNode || resolvedProps.cardSelectionPosition !== "title-inline") ? h6("div", { class: "mb-2 flex items-center gap-3" }, controls) : null,
+                  titleWithInlineControls,
                   ...rows,
                   expandedContent ? h6(
                     "div",

package/dist/{chunk-OHCC6NNC.mjs → chunk-5VVP4UNO.mjs}

@@ -1,12 +1,12 @@
 import {
   Table
-} from "./chunk-BIDBJNTL.mjs";
+} from "./chunk-4YXQMKKW.mjs";
 import {
   Select
-} from "./chunk-PYT5DTQQ.mjs";
+} from "./chunk-IZQ7BRHC.mjs";
 import {
   Popover
-} from "./chunk-PT4Q7C2A.mjs";
+} from "./chunk-6OQLZCQK.mjs";
 import {
   useTigerConfig
 } from "./chunk-VG6E4NX6.mjs";
@@ -18,7 +18,7 @@ import {
 } from "./chunk-2BNQGU7E.mjs";
 import {
   Button
-} from "./chunk-PO5GVU4Q.mjs";
+} from "./chunk-YZBQ6IR7.mjs";
 
 // src/components/DataTableWithToolbar.ts
 import {
@@ -143,6 +143,14 @@ var DataTableWithToolbar = defineComponent({
       type: Array,
       default: void 0
     },
+    cardClassName: {
+      type: [String, Function],
+      default: void 0
+    },
+    renderCard: {
+      type: Function,
+      default: void 0
+    },
     toolbar: {
       type: Object,
       default: void 0
@@ -411,7 +419,21 @@ var DataTableWithToolbar = defineComponent({
         }
       );
     };
+    const toolbarRenderContext = () => ({
+      searchValue: searchValue.value ?? "",
+      setSearch: handleSearchChange,
+      submitSearch: handleSearchSubmit,
+      filters: resolvedFilters.value,
+      setFilter: (key, value) => setFilterValue(key, value),
+      selectedKeys: selectedKeys.value,
+      selectedCount: selectedCount.value,
+      hiddenColumnKeys: resolvedHiddenKeys.value,
+      setHiddenColumnKeys: handleHiddenColumnsChange
+    });
     const renderToolbar = () => {
+      if (slots.toolbar) {
+        return slots.toolbar(toolbarRenderContext());
+      }
       if (!hasSearch.value && !hasFilters.value && !hasFiltersExtra.value && !hasBulkActions.value && !hasColumnSettings.value)
         return null;
       const leftNodes = [];
@@ -420,7 +442,12 @@ var DataTableWithToolbar = defineComponent({
         leftNodes.push(
           h(
             "div",
-            { class: "flex items-center gap-2 w-full sm:w-auto sm:min-w-[220px] sm:max-w-[320px]" },
+            {
+              class: classNames(
+                "flex items-center gap-2",
+                props.toolbar?.searchClassName ?? "w-full sm:w-auto sm:min-w-[220px] sm:max-w-[320px]"
+              )
+            },
             [
               h(
                 Input,
@@ -489,14 +516,22 @@ var DataTableWithToolbar = defineComponent({
             leftNodes.push(
               h(
                 "div",
-                { key: filter.key, class: "w-full sm:w-auto" },
+                {
+                  key: filter.key,
+                  class: filter.itemClass ?? "w-full sm:w-auto",
+                  style: filter.itemStyle
+                },
                 filterNode == null ? [] : [filterNode]
               )
             );
             return;
           }
           leftNodes.push(
-            h("div", { key: filter.key, class: "w-full sm:w-auto sm:min-w-[120px] sm:max-w-[180px]" }, [
+            h("div", {
+              key: filter.key,
+              class: filter.itemClass ?? "w-full sm:w-auto sm:min-w-[120px] sm:max-w-[180px]",
+              style: filter.itemStyle
+            }, [
               h(Select, {
                 size: "sm",
                 options: (filter.options ?? []).map((opt) => ({
@@ -565,8 +600,10 @@ var DataTableWithToolbar = defineComponent({
         {
           class: classNames(
             "tiger-data-table-toolbar flex flex-wrap items-center gap-3",
-            props.bordered ? "bg-[var(--tiger-surface-muted,#f9fafb)] dark:bg-gray-800/10 px-4 py-3.5 border-b border-[var(--tiger-border,#e5e7eb)]" : "bg-[var(--tiger-surface-muted,#f9fafb)]/80 dark:bg-gray-800/30 px-4 py-3.5 border border-[var(--tiger-border,#e5e7eb)] rounded-[var(--tiger-radius-md,0.5rem)] shadow-sm"
+            props.bordered ? "bg-[var(--tiger-surface-muted,#f9fafb)] dark:bg-gray-800/10 px-4 py-3.5 border-b border-[var(--tiger-border,#e5e7eb)]" : "bg-[var(--tiger-surface-muted,#f9fafb)]/80 dark:bg-gray-800/30 px-4 py-3.5 border border-[var(--tiger-border,#e5e7eb)] rounded-[var(--tiger-radius-md,0.5rem)] shadow-sm",
+            props.toolbar?.className
           ),
+          style: props.toolbar?.style,
           role: "toolbar",
           "aria-label": tableLabels.value.toolbarAriaLabel
         },
@@ -613,10 +650,17 @@ var DataTableWithToolbar = defineComponent({
         responsiveMode: props.responsiveMode,
         cardBreakpoint: props.cardBreakpoint,
         cardLayout: props.cardLayout,
+        cardClassName: props.cardClassName,
+        renderCard: props.renderCard,
         class: props.bordered ? "border-none rounded-none shadow-none" : void 0,
         onSelectionChange: (keys) => emit("selection-change", keys),
         onPageChange: handleTablePageChange
       };
+      const {
+        toolbar: _toolbarSlot,
+        "filters-extra": _filtersExtraSlot,
+        ...tableSlots
+      } = slots;
       return h(
         "div",
         {
@@ -624,7 +668,7 @@ var DataTableWithToolbar = defineComponent({
           style: wrapperStyle.value,
           "data-tiger-data-table-with-toolbar": ""
         },
-        [renderToolbar(), h(Table, tableProps)]
+        [renderToolbar(), h(Table, tableProps, tableSlots)]
       );
     };
   }

package/dist/{chunk-UETVHC4K.mjs → chunk-6BFGY5W7.mjs}

@@ -7,7 +7,7 @@ import {
 } from "./chunk-PZH2RTSS.mjs";
 import {
   Button
-} from "./chunk-PO5GVU4Q.mjs";
+} from "./chunk-YZBQ6IR7.mjs";
 import {
   Loading
 } from "./chunk-XQRKFOXS.mjs";
@@ -16,7 +16,7 @@ import {
 } from "./chunk-NN6AINLG.mjs";
 import {
   Card
-} from "./chunk-KOTSKHPQ.mjs";
+} from "./chunk-TC6ZPQFT.mjs";
 
 // src/components/NotificationCenter.ts
 import { defineComponent, computed, ref, watch, h } from "vue";

package/dist/{chunk-JE7AWY34.js → chunk-6NFACBDB.js}

@@ -49,6 +49,7 @@ var _vue = require('vue');
 
 
 
+
 
 
 var _tigercatcore = require('@expcat/tigercat-core');
@@ -443,26 +444,36 @@ var MenuItem = _vue.defineComponent.call(void 0, {
     return () => {
       const children = [];
       const effectiveCollapsed = _nullishCoalesce(props.collapsed, () => ( (menuContext ? menuContext.collapsed.value : false)));
+      const iconClasses = effectiveCollapsed ? _tigercatcore.menuCollapsedIconClasses : _tigercatcore.menuItemIconClasses;
       if (props.icon) {
         if (typeof props.icon === "string") {
           children.push(
             _vue.h.call(void 0, "span", {
-              class: _tigercatcore.menuItemIconClasses,
+              class: iconClasses,
               innerHTML: props.icon
             })
           );
         } else {
-          children.push(_vue.h.call(void 0, "span", { class: _tigercatcore.menuItemIconClasses }, props.icon));
+          children.push(_vue.h.call(void 0, "span", { class: iconClasses }, props.icon));
         }
       }
       if (!effectiveCollapsed && slots.default) {
         children.push(_vue.h.call(void 0, "span", { class: "flex-1" }, slots.default()));
-      } else if (effectiveCollapsed && !props.icon && slots.default) {
-        const defaultSlot = slots.default();
-        if (defaultSlot && defaultSlot.length > 0) {
-          const text = String(defaultSlot[0].children || "");
-          children.push(_vue.h.call(void 0, "span", { class: "flex-1 text-center" }, text.charAt(0).toUpperCase()));
+      } else if (effectiveCollapsed && slots.default) {
+        if (!props.icon) {
+          const defaultSlot = slots.default();
+          if (defaultSlot && defaultSlot.length > 0) {
+            const text = String(defaultSlot[0].children || "");
+            children.push(
+              _vue.h.call(void 0, 
+                "span",
+                { class: "flex-1 text-center", "aria-hidden": "true" },
+                text.charAt(0).toUpperCase()
+              )
+            );
+          }
         }
+        children.push(_vue.h.call(void 0, "span", { class: "sr-only" }, slots.default()));
       }
       return _vue.h.call(void 0, 
         "li",
@@ -872,16 +883,17 @@ var SubMenu = _vue.defineComponent.call(void 0, {
     return () => {
       if (!menuContext) return null;
       const titleChildren = [];
+      const submenuIconClasses = effectiveCollapsed.value ? _tigercatcore.menuCollapsedIconClasses : _tigercatcore.menuItemIconClasses;
       if (props.icon) {
         if (typeof props.icon === "string") {
           titleChildren.push(
             _vue.h.call(void 0, "span", {
-              class: _tigercatcore.menuItemIconClasses,
+              class: submenuIconClasses,
               innerHTML: props.icon
             })
           );
         } else {
-          titleChildren.push(_vue.h.call(void 0, "span", { class: _tigercatcore.menuItemIconClasses }, props.icon));
+          titleChildren.push(_vue.h.call(void 0, "span", { class: submenuIconClasses }, props.icon));
         }
       }
       if (!effectiveCollapsed.value) {
@@ -889,10 +901,17 @@ var SubMenu = _vue.defineComponent.call(void 0, {
         if (menuContext.mode.value !== "horizontal" && !isPopup.value) {
           titleChildren.push(ExpandIcon(isExpanded.value));
         }
-      } else if (!props.icon) {
-        titleChildren.push(
-          _vue.h.call(void 0, "span", { class: "flex-1 text-center" }, props.title.charAt(0).toUpperCase())
-        );
+      } else {
+        if (!props.icon) {
+          titleChildren.push(
+            _vue.h.call(void 0, 
+              "span",
+              { class: "flex-1 text-center", "aria-hidden": "true" },
+              props.title.charAt(0).toUpperCase()
+            )
+          );
+        }
+        titleChildren.push(_vue.h.call(void 0, "span", { class: "sr-only" }, props.title));
       }
       const titleNode = _vue.h.call(void 0, 
         "button",
@@ -908,6 +927,7 @@ var SubMenu = _vue.defineComponent.call(void 0, {
           "aria-expanded": isExpanded.value ? "true" : "false",
           "aria-haspopup": "true",
           "aria-disabled": props.disabled ? "true" : void 0,
+          "data-state": isExpanded.value ? "open" : "closed",
           disabled: props.disabled,
           tabindex: -1,
           ...passthroughAttrs.value

package/dist/{chunk-PT4Q7C2A.mjs → chunk-6OQLZCQK.mjs}

@@ -64,8 +64,8 @@ var Popover = defineComponent({
     const triggerClasses = computed(() => getPopoverTriggerClasses(props.disabled));
     const contentClasses = computed(() => getPopoverContentClasses(props.width));
     return () => {
-      const defaultSlot = slots.default?.();
-      if (!defaultSlot || defaultSlot.length === 0) return null;
+      const triggerSlotContent = slots.trigger ? slots.trigger({ open: currentVisible.value }) : slots.default?.();
+      if (!triggerSlotContent || triggerSlotContent.length === 0) return null;
       const {
         class: _class,
         style: _style,
@@ -90,9 +90,14 @@ var Popover = defineComponent({
               class: triggerClasses.value,
               "aria-haspopup": "dialog",
               "aria-disabled": props.disabled ? "true" : void 0,
+              // `data-state` is the stable styling hook. `aria-expanded` is
+              // intentionally omitted: the trigger is a generic wrapper without
+              // an interactive role, where `aria-expanded` is invalid (the
+              // user's own interactive element carries the real semantics).
+              "data-state": currentVisible.value ? "open" : "closed",
               ...triggerHandlers.value
             },
-            defaultSlot
+            triggerSlotContent
           ),
           // Floating content
           currentVisible.value ? renderVueBodyTeleport(