@expcat/tigercat-vue 0.4.0 → 0.4.3

package/dist/{chunk-3PQIZBT5.js → chunk-NUFSJMVC.js}

@@ -33,6 +33,20 @@ var LockIcon = (locked) => {
     [vue.h("path", { d: locked ? tigercatCore.lockClosedIcon24PathD : tigercatCore.lockOpenIcon24PathD })]
   );
 };
+var ExpandIcon = (expanded) => {
+  return vue.h(
+    "svg",
+    {
+      class: tigercatCore.getExpandIconClasses(expanded),
+      width: "16",
+      height: "16",
+      viewBox: tigercatCore.icon16ViewBox,
+      fill: "currentColor",
+      "aria-hidden": "true"
+    },
+    [vue.h("path", { d: tigercatCore.expandChevronIcon16PathD })]
+  );
+};
 var LoadingSpinner = () => {
   return vue.h(
     "svg",
@@ -160,6 +174,12 @@ var Table = vue.defineComponent({
     rowSelection: {
       type: Object
     },
+    /**
+     * Row expansion configuration
+     */
+    expandable: {
+      type: Object
+    },
     /**
      * Function to get row key
      */
@@ -194,7 +214,15 @@ var Table = vue.defineComponent({
       default: "auto"
     }
   },
-  emits: ["change", "row-click", "selection-change", "sort-change", "filter-change", "page-change"],
+  emits: [
+    "change",
+    "row-click",
+    "selection-change",
+    "sort-change",
+    "filter-change",
+    "page-change",
+    "expand-change"
+  ],
   setup(props, { emit, slots }) {
     const paginationConfig = vue.computed(() => {
       return props.pagination !== false && typeof props.pagination === "object" ? props.pagination : null;
@@ -204,6 +232,7 @@ var Table = vue.defineComponent({
     vue.computed(() => paginationConfig.value?.current !== void 0);
     vue.computed(() => paginationConfig.value?.pageSize !== void 0);
     const isSelectionControlled = vue.computed(() => props.rowSelection?.selectedRowKeys !== void 0);
+    const isExpandControlled = vue.computed(() => props.expandable?.expandedRowKeys !== void 0);
     const uncontrolledSortState = vue.ref(props.defaultSort);
     const uncontrolledFilterState = vue.ref(props.defaultFilters);
     const uncontrolledCurrentPage = vue.ref(
@@ -215,6 +244,9 @@ var Table = vue.defineComponent({
     const uncontrolledSelectedRowKeys = vue.ref(
       props.rowSelection?.defaultSelectedRowKeys ?? props.rowSelection?.selectedRowKeys ?? []
     );
+    const uncontrolledExpandedRowKeys = vue.ref(
+      props.expandable?.defaultExpandedRowKeys ?? props.expandable?.expandedRowKeys ?? []
+    );
     const sortState = vue.computed(() => props.sort ?? uncontrolledSortState.value);
     const filterState = vue.computed(() => props.filters ?? uncontrolledFilterState.value);
     const currentPage = vue.computed(() => {
@@ -226,6 +258,9 @@ var Table = vue.defineComponent({
     const selectedRowKeys = vue.computed(() => {
       return props.rowSelection?.selectedRowKeys ?? uncontrolledSelectedRowKeys.value;
     });
+    const expandedRowKeys = vue.computed(() => {
+      return props.expandable?.expandedRowKeys ?? uncontrolledExpandedRowKeys.value;
+    });
     vue.watch(
       () => props.sort,
       (next) => {
@@ -266,6 +301,14 @@ var Table = vue.defineComponent({
         }
       }
     );
+    vue.watch(
+      () => props.expandable?.expandedRowKeys,
+      (next) => {
+        if (next !== void 0) {
+          uncontrolledExpandedRowKeys.value = next;
+        }
+      }
+    );
     const fixedOverrides = vue.ref({});
     const displayColumns = vue.computed(() => {
       return props.columns.map((column) => {
@@ -314,6 +357,15 @@ var Table = vue.defineComponent({
     const selectedRowKeySet = vue.computed(() => {
       return new Set(selectedRowKeys.value);
     });
+    const expandedRowKeySet = vue.computed(() => {
+      return new Set(expandedRowKeys.value);
+    });
+    const totalColumnCount = vue.computed(() => {
+      let count = displayColumns.value.length;
+      if (props.rowSelection) count += 1;
+      if (props.expandable) count += 1;
+      return count;
+    });
     const paginationInfo = vue.computed(() => {
       if (props.pagination === false) {
         return null;
@@ -397,6 +449,21 @@ var Table = vue.defineComponent({
     }
     function handleRowClick(record, index) {
       emit("row-click", record, index);
+      if (props.expandable?.expandRowByClick) {
+        const key = tigercatCore.getRowKey(record, props.rowKey, index);
+        const isExpandable = props.expandable?.rowExpandable ? props.expandable.rowExpandable(record) : true;
+        if (isExpandable) {
+          handleToggleExpand(key, record);
+        }
+      }
+    }
+    function handleToggleExpand(key, record) {
+      const isExpanded = expandedRowKeySet.value.has(key);
+      const newKeys = isExpanded ? expandedRowKeys.value.filter((k) => k !== key) : [...expandedRowKeys.value, key];
+      if (!isExpandControlled.value) {
+        uncontrolledExpandedRowKeys.value = newKeys;
+      }
+      emit("expand-change", newKeys, record, !isExpanded);
     }
     function handleSelectRow(key, checked) {
       let newKeys;
@@ -439,6 +506,15 @@ var Table = vue.defineComponent({
     });
     function renderTableHeader() {
       const headerCells = [];
+      const expandAtStart = props.expandable && props.expandable.expandIconPosition !== "end";
+      const expandAtEnd = props.expandable && props.expandable.expandIconPosition === "end";
+      const expandHeaderTh = props.expandable ? vue.h("th", {
+        class: tigercatCore.getExpandIconCellClasses(props.size),
+        "aria-label": "Expand"
+      }) : null;
+      if (expandAtStart && expandHeaderTh) {
+        headerCells.push(expandHeaderTh);
+      }
       if (props.rowSelection && props.rowSelection.showCheckbox !== false && props.rowSelection.type !== "radio") {
         headerCells.push(
           vue.h(
@@ -558,6 +634,9 @@ var Table = vue.defineComponent({
           )
         );
       });
+      if (expandAtEnd && expandHeaderTh) {
+        headerCells.push(expandHeaderTh);
+      }
       return vue.h("thead", { class: tigercatCore.getTableHeaderClasses(props.stickyHeader) }, [
         vue.h("tr", headerCells)
       ]);
@@ -572,7 +651,7 @@ var Table = vue.defineComponent({
             vue.h(
               "td",
               {
-                colspan: displayColumns.value.length + (props.rowSelection ? 1 : 0),
+                colspan: totalColumnCount.value,
                 class: tigercatCore.tableEmptyStateClasses
               },
               [
@@ -589,11 +668,39 @@ var Table = vue.defineComponent({
           ])
         ]);
       }
-      const rows = paginatedData.value.map((record, index) => {
+      const rows = paginatedData.value.flatMap((record, index) => {
         const key = paginatedRowKeys.value[index];
         const isSelected = selectedRowKeySet.value.has(key);
+        const isExpanded = expandedRowKeySet.value.has(key);
+        const isRowExpandable = props.expandable ? props.expandable.rowExpandable ? props.expandable.rowExpandable(record) : true : false;
         const rowClass = typeof props.rowClassName === "function" ? props.rowClassName(record, index) : props.rowClassName;
         const cells = [];
+        const expandAtStart = props.expandable && props.expandable.expandIconPosition !== "end";
+        const expandToggleCell = props.expandable ? vue.h(
+          "td",
+          {
+            class: tigercatCore.getExpandIconCellClasses(props.size)
+          },
+          isRowExpandable ? [
+            vue.h(
+              "button",
+              {
+                type: "button",
+                class: "inline-flex items-center justify-center",
+                "aria-label": isExpanded ? "Collapse row" : "Expand row",
+                "aria-expanded": isExpanded,
+                onClick: (e) => {
+                  e.stopPropagation();
+                  handleToggleExpand(key, record);
+                }
+              },
+              [ExpandIcon(isExpanded)]
+            )
+          ] : []
+        ) : null;
+        if (expandAtStart && expandToggleCell) {
+          cells.push(expandToggleCell);
+        }
         if (props.rowSelection && props.rowSelection.showCheckbox !== false) {
           const checkboxProps = props.rowSelection?.getCheckboxProps?.(record) || {};
           cells.push(
@@ -608,6 +715,7 @@ var Table = vue.defineComponent({
                   class: props.rowSelection?.type === "radio" ? "border-gray-300 text-[var(--tiger-primary,#2563eb)] focus:ring-[var(--tiger-primary,#2563eb)]" : "rounded border-gray-300 text-[var(--tiger-primary,#2563eb)] focus:ring-[var(--tiger-primary,#2563eb)]",
                   checked: isSelected,
                   disabled: checkboxProps.disabled,
+                  onClick: (e) => e.stopPropagation(),
                   onChange: (e) => handleSelectRow(key, e.target.checked)
                 })
               ]
@@ -649,12 +757,15 @@ var Table = vue.defineComponent({
                 style
               },
               [
-                column.render ? slots[`cell-${column.key}`]?.({ record, index }) || column.render(record, index) : cellValue
+                slots[`cell-${column.key}`]?.({ record, index }) ?? (column.render ? column.render(record, index) : cellValue)
               ]
             )
           );
         });
-        return vue.h(
+        if (!expandAtStart && expandToggleCell) {
+          cells.push(expandToggleCell);
+        }
+        const rowNode = vue.h(
           "tr",
           {
             key,
@@ -666,6 +777,28 @@ var Table = vue.defineComponent({
           },
           cells
         );
+        if (props.expandable && isExpanded && isRowExpandable) {
+          const expandedContent = slots["expanded-row"]?.({ record, index }) || (props.expandable.expandedRowRender ? props.expandable.expandedRowRender(record, index) : null);
+          const expandedRow = vue.h(
+            "tr",
+            {
+              key: `${key}-expanded`,
+              class: tigercatCore.getExpandedRowClasses()
+            },
+            [
+              vue.h(
+                "td",
+                {
+                  colspan: totalColumnCount.value,
+                  class: tigercatCore.getExpandedRowContentClasses(props.size)
+                },
+                [expandedContent]
+              )
+            ]
+          );
+          return [rowNode, expandedRow];
+        }
+        return rowNode;
       });
       return vue.h("tbody", rows);
     }

package/dist/{chunk-7FCHU5KV.mjs → chunk-TTDBR2B4.mjs}

@@ -1,6 +1,6 @@
 import { MenuContextKey } from './chunk-3AM6WEUE.mjs';
 import { defineComponent, inject, computed, ref, h, Transition, isVNode, cloneVNode, nextTick } from 'vue';
-import { isKeyOpen, classNames, getSubMenuTitleClasses, coerceClassValue, mergeStyleValues, submenuContentHorizontalClasses, submenuContentPopupClasses, submenuContentInlineClasses, submenuContentVerticalClasses, getMenuItemIndent, menuItemIconClasses, getSubMenuExpandIconClasses, moveFocusInMenu, focusMenuEdge, focusFirstChildItem } from '@expcat/tigercat-core';
+import { isKeyOpen, classNames, getSubMenuTitleClasses, coerceClassValue, mergeStyleValues, submenuContentHorizontalClasses, submenuContentHorizontalNestedClasses, submenuContentPopupClasses, submenuContentInlineClasses, submenuContentVerticalClasses, getSubmenuPopupZIndex, getMenuItemIndent, menuItemIconClasses, getSubMenuExpandIconClasses, moveFocusInMenu, focusMenuEdge, focusFirstChildItem } from '@expcat/tigercat-core';
 
 var ExpandIcon = (expanded) => {
   return h(
@@ -85,7 +85,9 @@ var SubMenu = defineComponent({
       return props.collapsed ?? (menuContext ? menuContext.collapsed.value : false);
     });
     const isPopup = computed(() => {
-      return !!menuContext && menuContext.mode.value === "vertical" && effectiveCollapsed.value;
+      if (!menuContext) return false;
+      if (menuContext.mode.value === "horizontal") return true;
+      return menuContext.mode.value === "vertical" && effectiveCollapsed.value;
     });
     const isExpanded = computed(() => {
       if (menuContext?.mode.value === "horizontal" || isPopup.value) {
@@ -109,12 +111,13 @@ var SubMenu = defineComponent({
     const contentClasses = computed(() => {
       if (!menuContext) return "";
       if (menuContext.mode.value === "horizontal") {
-        return submenuContentHorizontalClasses;
+        return props.level === 0 ? submenuContentHorizontalClasses : submenuContentHorizontalNestedClasses;
       }
       if (isPopup.value) return submenuContentPopupClasses;
       if (menuContext.mode.value === "inline") return submenuContentInlineClasses;
       return submenuContentVerticalClasses;
     });
+    const popupZIndex = computed(() => isPopup.value ? getSubmenuPopupZIndex(props.level) : {});
     const handleTitleClick = () => {
       if (!menuContext || props.disabled) return;
       if (menuContext.mode.value === "horizontal") return;
@@ -206,7 +209,7 @@ var SubMenu = defineComponent({
       }
     };
     const indentStyle = computed(() => {
-      if (!menuContext || menuContext.mode.value !== "inline" || props.level === 0) {
+      if (!menuContext || menuContext.mode.value === "horizontal" || props.level === 0) {
         return {};
       }
       return getMenuItemIndent(props.level, menuContext.inlineIndent.value);
@@ -224,9 +227,6 @@ var SubMenu = defineComponent({
         const nextProps = {
           level: existingProps.level ?? nextLevel
         };
-        if (isPopup.value) {
-          nextProps.collapsed = false;
-        }
         return cloneVNode(node, nextProps);
       });
     };
@@ -274,12 +274,13 @@ var SubMenu = defineComponent({
         },
         titleChildren
       );
-      const contentNode = menuContext.mode.value === "horizontal" || isPopup.value ? h(
+      const contentNode = isPopup.value ? h(
         "ul",
         {
           class: contentClasses.value,
           style: {
-            display: isExpanded.value ? "block" : "none"
+            display: isExpanded.value ? "block" : "none",
+            ...popupZIndex.value
           },
           role: "menu",
           "aria-hidden": isExpanded.value ? void 0 : "true"
@@ -324,7 +325,7 @@ var SubMenu = defineComponent({
       return h(
         "li",
         {
-          class: menuContext.mode.value === "horizontal" || isPopup.value ? "relative" : "",
+          class: isPopup.value ? "relative" : "",
           onMouseenter: handleMouseEnter,
           onMouseleave: handleMouseLeave,
           role: "none"

package/dist/{chunk-RKPYLBPU.mjs → chunk-WM4ESIHG.mjs}

@@ -1,5 +1,5 @@
 import { defineComponent, computed, h } from 'vue';
-import { classNames, layoutSidebarClasses, coerceClassValue, mergeStyleValues } from '@expcat/tigercat-core';
+import { classNames, layoutSidebarClasses, layoutSidebarCollapsedClasses, coerceClassValue, getSidebarStyle, mergeStyleValues } from '@expcat/tigercat-core';
 
 // src/components/Sidebar.ts
 var Sidebar = defineComponent({
@@ -21,6 +21,15 @@ var Sidebar = defineComponent({
       type: String,
       default: "256px"
     },
+    /**
+     * Width when collapsed (mini mode).
+     * Set to '0px' to fully hide the sidebar when collapsed.
+     * @default '64px'
+     */
+    collapsedWidth: {
+      type: String,
+      default: "64px"
+    },
     /**
      * Whether the sidebar is collapsed
      * @default false
@@ -41,14 +50,14 @@ var Sidebar = defineComponent({
     const sidebarClasses = computed(
       () => classNames(
         layoutSidebarClasses,
+        props.collapsed && layoutSidebarCollapsedClasses,
         props.className,
         coerceClassValue(attrs.class)
       )
     );
-    const sidebarStyle = computed(() => ({
-      width: props.collapsed ? "0px" : props.width,
-      minWidth: props.collapsed ? "0px" : props.width
-    }));
+    const sidebarStyle = computed(
+      () => getSidebarStyle(props.collapsed, props.width, props.collapsedWidth)
+    );
     return () => h(
       "aside",
       {
@@ -56,7 +65,7 @@ var Sidebar = defineComponent({
         class: sidebarClasses.value,
         style: mergeStyleValues(props.style, sidebarStyle.value)
       },
-      !props.collapsed && slots.default?.()
+      slots.default?.()
     );
   }
 });

package/dist/components/ActivityFeed.d.mts

@@ -107,9 +107,9 @@ declare const ActivityFeed: vue.DefineComponent<vue.ExtractPropTypes<{
         default: undefined;
     };
 }>> & Readonly<{}>, {
-    className: string;
     style: Record<string, string | number>;
     loading: boolean;
+    className: string;
     emptyText: string;
     items: ActivityItem[];
     groups: ActivityGroup[];

package/dist/components/ActivityFeed.d.ts

@@ -107,9 +107,9 @@ declare const ActivityFeed: vue.DefineComponent<vue.ExtractPropTypes<{
         default: undefined;
     };
 }>> & Readonly<{}>, {
-    className: string;
     style: Record<string, string | number>;
     loading: boolean;
+    className: string;
     emptyText: string;
     items: ActivityItem[];
     groups: ActivityGroup[];

package/dist/components/ActivityFeed.js

@@ -2,10 +2,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var chunkNGW5UMAN_js = require('../chunk-NGW5UMAN.js');
+var chunkEBTLMVDJ_js = require('../chunk-EBTLMVDJ.js');
 require('../chunk-27T3QDSF.js');
-require('../chunk-DN5GU5PC.js');
 require('../chunk-ZED7TU62.js');
+require('../chunk-DN5GU5PC.js');
 require('../chunk-2KDSHEZT.js');
 require('../chunk-DUQ7Q2GO.js');
 require('../chunk-WEFQCJAG.js');
@@ -16,9 +16,9 @@ require('../chunk-PNKVD2UK.js');
 
 Object.defineProperty(exports, "ActivityFeed", {
   enumerable: true,
-  get: function () { return chunkNGW5UMAN_js.ActivityFeed; }
+  get: function () { return chunkEBTLMVDJ_js.ActivityFeed; }
 });
 Object.defineProperty(exports, "default", {
   enumerable: true,
-  get: function () { return chunkNGW5UMAN_js.ActivityFeed_default; }
+  get: function () { return chunkEBTLMVDJ_js.ActivityFeed_default; }
 });

package/dist/components/ActivityFeed.mjs

@@ -1,7 +1,7 @@
-export { ActivityFeed, ActivityFeed_default as default } from '../chunk-D7VMY6WX.mjs';
+export { ActivityFeed, ActivityFeed_default as default } from '../chunk-RVEEEDJQ.mjs';
 import '../chunk-LBGTABIU.mjs';
-import '../chunk-Q6OYCTQO.mjs';
 import '../chunk-4YHOD7LT.mjs';
+import '../chunk-Q6OYCTQO.mjs';
 import '../chunk-3G4VPV4D.mjs';
 import '../chunk-6V7XCCXN.mjs';
 import '../chunk-YXN3YY5Y.mjs';

package/dist/components/Alert.d.mts

@@ -157,10 +157,10 @@ declare const Alert: vue.DefineComponent<vue.ExtractPropTypes<{
     onClose?: ((...args: any[]) => any) | undefined;
 }>, {
     type: AlertType;
-    className: string;
     style: Record<string, string | number>;
     title: string;
     size: AlertSize;
+    className: string;
     closable: boolean;
     closeAriaLabel: string;
     showIcon: boolean;

package/dist/components/Alert.d.ts

@@ -157,10 +157,10 @@ declare const Alert: vue.DefineComponent<vue.ExtractPropTypes<{
     onClose?: ((...args: any[]) => any) | undefined;
 }>, {
     type: AlertType;
-    className: string;
     style: Record<string, string | number>;
     title: string;
     size: AlertSize;
+    className: string;
     closable: boolean;
     closeAriaLabel: string;
     showIcon: boolean;

package/dist/components/Anchor.d.mts

@@ -96,7 +96,7 @@ declare const Anchor: vue.DefineComponent<vue.ExtractPropTypes<{
     };
 }>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
     [key: string]: any;
-}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("click" | "change")[], "click" | "change", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("change" | "click")[], "change" | "click", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     /**
      * Whether to fix the anchor to the viewport
      * @default true
@@ -168,9 +168,12 @@ declare const Anchor: vue.DefineComponent<vue.ExtractPropTypes<{
         default: undefined;
     };
 }>> & Readonly<{
-    onClick?: ((...args: any[]) => any) | undefined;
     onChange?: ((...args: any[]) => any) | undefined;
+    onClick?: ((...args: any[]) => any) | undefined;
 }>, {
+    style: Record<string, unknown>;
+    className: string;
+    direction: AnchorDirection;
     affix: boolean;
     bounds: number;
     offsetTop: number;
@@ -178,9 +181,6 @@ declare const Anchor: vue.DefineComponent<vue.ExtractPropTypes<{
     targetOffset: number;
     getCurrentAnchor: (activeLink: string) => string;
     getContainer: () => HTMLElement | Window;
-    direction: AnchorDirection;
-    className: string;
-    style: Record<string, unknown>;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 
 export { Anchor, type AnchorContext, AnchorContextKey, type VueAnchorProps, Anchor as default };

package/dist/components/Anchor.d.ts

@@ -96,7 +96,7 @@ declare const Anchor: vue.DefineComponent<vue.ExtractPropTypes<{
     };
 }>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
     [key: string]: any;
-}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("click" | "change")[], "click" | "change", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("change" | "click")[], "change" | "click", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     /**
      * Whether to fix the anchor to the viewport
      * @default true
@@ -168,9 +168,12 @@ declare const Anchor: vue.DefineComponent<vue.ExtractPropTypes<{
         default: undefined;
     };
 }>> & Readonly<{
-    onClick?: ((...args: any[]) => any) | undefined;
     onChange?: ((...args: any[]) => any) | undefined;
+    onClick?: ((...args: any[]) => any) | undefined;
 }>, {
+    style: Record<string, unknown>;
+    className: string;
+    direction: AnchorDirection;
     affix: boolean;
     bounds: number;
     offsetTop: number;
@@ -178,9 +181,6 @@ declare const Anchor: vue.DefineComponent<vue.ExtractPropTypes<{
     targetOffset: number;
     getCurrentAnchor: (activeLink: string) => string;
     getContainer: () => HTMLElement | Window;
-    direction: AnchorDirection;
-    className: string;
-    style: Record<string, unknown>;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 
 export { Anchor, type AnchorContext, AnchorContextKey, type VueAnchorProps, Anchor as default };

package/dist/components/AnchorLink.d.mts

@@ -61,8 +61,8 @@ declare const AnchorLink: vue.DefineComponent<vue.ExtractPropTypes<{
         default: undefined;
     };
 }>> & Readonly<{}>, {
-    className: string;
     title: string;
+    className: string;
     target: string;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 

package/dist/components/AnchorLink.d.ts

@@ -61,8 +61,8 @@ declare const AnchorLink: vue.DefineComponent<vue.ExtractPropTypes<{
         default: undefined;
     };
 }>> & Readonly<{}>, {
-    className: string;
     title: string;
+    className: string;
     target: string;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 

package/dist/components/Avatar.d.mts

@@ -148,10 +148,10 @@ declare const Avatar: vue.DefineComponent<vue.ExtractPropTypes<{
         default: undefined;
     };
 }>> & Readonly<{}>, {
-    className: string;
     style: Record<string, string | number>;
-    text: string;
     size: AvatarSize;
+    className: string;
+    text: string;
     src: string;
     alt: string;
     shape: AvatarShape;

package/dist/components/Avatar.d.ts

@@ -148,10 +148,10 @@ declare const Avatar: vue.DefineComponent<vue.ExtractPropTypes<{
         default: undefined;
     };
 }>> & Readonly<{}>, {
-    className: string;
     style: Record<string, string | number>;
-    text: string;
     size: AvatarSize;
+    className: string;
+    text: string;
     src: string;
     alt: string;
     shape: AvatarShape;

package/dist/components/BackTop.d.mts

@@ -78,8 +78,8 @@ declare const BackTop: vue.DefineComponent<vue.ExtractPropTypes<{
 }>> & Readonly<{
     onClick?: ((...args: any[]) => any) | undefined;
 }>, {
-    className: string;
     style: Record<string, unknown>;
+    className: string;
     target: () => HTMLElement | Window | null;
     duration: number;
     visibilityHeight: number;

package/dist/components/BackTop.d.ts

@@ -78,8 +78,8 @@ declare const BackTop: vue.DefineComponent<vue.ExtractPropTypes<{
 }>> & Readonly<{
     onClick?: ((...args: any[]) => any) | undefined;
 }>, {
-    className: string;
     style: Record<string, unknown>;
+    className: string;
     target: () => HTMLElement | Window | null;
     duration: number;
     visibilityHeight: number;

package/dist/components/Badge.d.mts

@@ -93,10 +93,10 @@ declare const Badge: vue.DefineComponent<vue.ExtractPropTypes<{
     };
 }>> & Readonly<{}>, {
     type: BadgeType;
-    className: string;
     style: Record<string, string | number>;
     size: BadgeSize;
     variant: BadgeVariant;
+    className: string;
     max: number;
     content: string | number;
     position: BadgePosition;

package/dist/components/Badge.d.ts

@@ -93,10 +93,10 @@ declare const Badge: vue.DefineComponent<vue.ExtractPropTypes<{
     };
 }>> & Readonly<{}>, {
     type: BadgeType;
-    className: string;
     style: Record<string, string | number>;
     size: BadgeSize;
     variant: BadgeVariant;
+    className: string;
     max: number;
     content: string | number;
     position: BadgePosition;

package/dist/components/Breadcrumb.d.mts

@@ -75,8 +75,8 @@ declare const Breadcrumb: vue.DefineComponent<vue.ExtractPropTypes<{
         default: undefined;
     };
 }>> & Readonly<{}>, {
-    className: string;
     style: Record<string, unknown>;
+    className: string;
     separator: string;
     extra: VNodeChild | VNodeChild[];
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;

package/dist/components/Breadcrumb.d.ts

@@ -75,8 +75,8 @@ declare const Breadcrumb: vue.DefineComponent<vue.ExtractPropTypes<{
         default: undefined;
     };
 }>> & Readonly<{}>, {
-    className: string;
     style: Record<string, unknown>;
+    className: string;
     separator: string;
     extra: VNodeChild | VNodeChild[];
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;

package/dist/components/BreadcrumbItem.d.mts

@@ -123,8 +123,8 @@ declare const BreadcrumbItem: vue.DefineComponent<vue.ExtractPropTypes<{
 }>> & Readonly<{
     onClick?: ((event: MouseEvent) => any) | undefined;
 }>, {
-    className: string;
     style: Record<string, unknown>;
+    className: string;
     separator: string;
     href: string;
     target: "_blank" | "_self" | "_parent" | "_top";