@robot-admin/layout 2.0.1 → 2.1.0

package/dist/index.d.ts

@@ -1,20 +1,283 @@
 import { App } from 'vue';
+import { Component } from 'vue';
 import { ComponentOptionsMixin } from 'vue';
 import { ComponentProvideOptions } from 'vue';
 import { ComputedRef } from 'vue';
 import { DefineComponent } from 'vue';
+import { InjectionKey } from 'vue';
+import { MaybeRefOrGetter } from 'vue';
 import { PublicProps } from 'vue';
 import { Ref } from 'vue';
 import { StoreDefinition } from 'pinia';
 import { ThemeMode } from '@robot-admin/theme';
+import { VNode } from 'vue';
+
+declare const __VLS_component: DefineComponent<    {}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, HTMLDivElement>;
+
+declare const __VLS_component_2: DefineComponent<__VLS_Props_8, {
+collapsed: ComputedRef<boolean>;
+toggleCollapse: () => void;
+}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+"update:collapsed": (value: boolean) => any;
+}, string, PublicProps, Readonly<__VLS_Props_8> & Readonly<{
+"onUpdate:collapsed"?: ((value: boolean) => any) | undefined;
+}>, {
+collapsed: boolean;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
+
+declare const __VLS_component_3: DefineComponent<    {}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, HTMLDivElement>;
+
+declare const __VLS_component_4: DefineComponent<    {}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, HTMLDivElement>;
+
+declare const __VLS_component_5: DefineComponent<    {}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, HTMLDivElement>;
+
+declare const __VLS_component_6: DefineComponent<    {}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, HTMLDivElement>;
+
+declare const __VLS_component_7: DefineComponent<    {}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, HTMLDivElement>;
 
 declare type __VLS_Props = {
-    storageKey?: string;
+    /** 是否显示品牌名称 */
+    showName?: boolean;
+    /** 是否显示分隔线 */
+    showDivider?: boolean;
+    /** Logo 尺寸 */
+    size?: number;
+    /** 是否折叠状态 */
+    collapsed?: boolean;
+    /** 布局方向 */
+    variant?: "vertical" | "horizontal";
+};
+
+declare type __VLS_Props_2 = {
+    /** 菜单数据 */
+    menus: MenuOptions[];
+    /** 当前激活的菜单路径 */
+    active?: string;
+};
+
+declare type __VLS_Props_3 = {
+    /** 是否显示 */
+    show: boolean;
+    /** 当前悬浮的一级菜单项（包含 children） */
+    menuItem: MenuOptions | null;
+    /** 判断菜单项是否激活 */
+    isActive?: (path: string | undefined) => boolean;
+};
+
+declare type __VLS_Props_4 = {
+    /** 二级菜单列表 */
+    menus: MenuOptions[];
+    /** 当前一级菜单项（显示标题和图标） */
+    activeItem?: MenuOptions;
+    /** 判断菜单项是否激活 */
+    isActive?: (path: string | undefined) => boolean;
+};
+
+declare type __VLS_Props_5 = {
+    /** 菜单数据 */
+    menus: MenuOptions[];
+    /** 是否显示 */
+    show: boolean;
+};
+
+declare type __VLS_Props_6 = {
+    show?: boolean;
+};
+
+declare type __VLS_Props_7 = {
+    /** 菜单数据 */
+    data: MenuOptions[];
+};
+
+declare type __VLS_Props_8 = {
+    /** 控制侧边栏折叠状态 (支持 v-model:collapsed) */
+    collapsed?: boolean;
 };
 
 declare type __VLS_PublicProps = {
     "show"?: boolean;
-} & __VLS_Props;
+};
+
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        logo?(_: {}): any;
+        logo?(_: {}): any;
+        logo?(_: {}): any;
+        logo?(_: {}): any;
+        logo?(_: {}): any;
+        logo?(_: {}): any;
+        menu?(_: {
+            collapsed: boolean;
+        }): any;
+        header?(_: {}): any;
+        header?(_: {}): any;
+        footer?(_: {}): any;
+        footer?(_: {}): any;
+        footer?(_: {}): any;
+        footer?(_: {}): any;
+        footer?(_: {}): any;
+        footer?(_: {}): any;
+        'top-menu'?(_: {}): any;
+        'top-menu'?(_: {}): any;
+        'top-menu'?(_: {}): any;
+        'header-extra'?(_: {}): any;
+        'header-extra'?(_: {}): any;
+        'header-extra'?(_: {}): any;
+        'header-extra'?(_: {}): any;
+        'tags-view'?(_: {}): any;
+        'tags-view'?(_: {}): any;
+        'tags-view'?(_: {}): any;
+        'tags-view'?(_: {}): any;
+        brand?(_: {}): any;
+        'menu-trigger'?(_: {}): any;
+        'drawer-menu'?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+
+declare function __VLS_template_2(): {
+    attrs: Partial<{}>;
+    slots: {
+        logo?(_: {}): any;
+        menu?(_: {
+            collapsed: boolean;
+        }): any;
+        header?(_: {}): any;
+        footer?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+
+declare function __VLS_template_3(): {
+    attrs: Partial<{}>;
+    slots: {
+        logo?(_: {}): any;
+        menu?(_: {}): any;
+        'header-extra'?(_: {}): any;
+        'tags-view'?(_: {}): any;
+        footer?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+
+declare function __VLS_template_4(): {
+    attrs: Partial<{}>;
+    slots: {
+        logo?(_: {}): any;
+        header?(_: {}): any;
+        footer?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+
+declare function __VLS_template_5(): {
+    attrs: Partial<{}>;
+    slots: {
+        logo?(_: {}): any;
+        brand?(_: {}): any;
+        'top-menu'?(_: {}): any;
+        'header-extra'?(_: {}): any;
+        'tags-view'?(_: {}): any;
+        footer?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+
+declare function __VLS_template_6(): {
+    attrs: Partial<{}>;
+    slots: {
+        logo?(_: {}): any;
+        'top-menu'?(_: {}): any;
+        'header-extra'?(_: {}): any;
+        'tags-view'?(_: {}): any;
+        footer?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+
+declare function __VLS_template_7(): {
+    attrs: Partial<{}>;
+    slots: {
+        'menu-trigger'?(_: {}): any;
+        logo?(_: {}): any;
+        'header-extra'?(_: {}): any;
+        'tags-view'?(_: {}): any;
+        'drawer-menu'?(_: {}): any;
+        footer?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+
+declare type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+
+declare type __VLS_TemplateResult_2 = ReturnType<typeof __VLS_template_2>;
+
+declare type __VLS_TemplateResult_3 = ReturnType<typeof __VLS_template_3>;
+
+declare type __VLS_TemplateResult_4 = ReturnType<typeof __VLS_template_4>;
+
+declare type __VLS_TemplateResult_5 = ReturnType<typeof __VLS_template_5>;
+
+declare type __VLS_TemplateResult_6 = ReturnType<typeof __VLS_template_6>;
+
+declare type __VLS_TemplateResult_7 = ReturnType<typeof __VLS_template_7>;
+
+declare type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithTemplateSlots_2<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithTemplateSlots_3<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithTemplateSlots_4<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithTemplateSlots_5<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithTemplateSlots_6<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithTemplateSlots_7<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+/**
+ * 调整颜色亮度
+ * @param color - 十六进制颜色值
+ * @param amount - 调整量，正数变亮，负数变暗
+ */
+export declare function adjustColor(color: string, amount: number): string;
 
 export declare const BORDER_RADIUS_MAP: {
     readonly small: "4px";
@@ -27,6 +290,16 @@ export declare const BORDER_RADIUS_MAP: {
  */
 export declare type BorderRadiusSize = "small" | "medium" | "large";
 
+export declare const BrandLogo: DefineComponent<__VLS_Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+collapsed: boolean;
+size: number;
+showName: boolean;
+showDivider: boolean;
+variant: "vertical" | "horizontal";
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+
+export declare const C_LayoutContainer: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+
 /** Color swatches for color picker */
 export declare const COLOR_SWATCHES: string[];
 
@@ -123,10 +396,155 @@ updateThemeMode: (mode: ThemeMode) => Promise<void>;
 toggleCollapse: () => void;
 }, "syncCSSVariables" | "applyPreset" | "resetSettings" | "updateThemeMode" | "toggleCollapse">>;
 
+declare const _default: __VLS_WithTemplateSlots_2<typeof __VLS_component_2, __VLS_TemplateResult_2["slots"]>;
+export { _default as C_SideLayout }
+export { _default as SideLayout }
+
+declare const _default_2: __VLS_WithTemplateSlots_3<typeof __VLS_component_3, __VLS_TemplateResult_3["slots"]>;
+export { _default_2 as C_TopLayout }
+export { _default_2 as TopLayout }
+
+declare const _default_3: __VLS_WithTemplateSlots_4<typeof __VLS_component_4, __VLS_TemplateResult_4["slots"]>;
+export { _default_3 as C_MixLayout }
+export { _default_3 as MixLayout }
+
+declare const _default_4: __VLS_WithTemplateSlots_5<typeof __VLS_component_5, __VLS_TemplateResult_5["slots"]>;
+export { _default_4 as C_MixTopLayout }
+export { _default_4 as MixTopLayout }
+
+declare const _default_5: __VLS_WithTemplateSlots_6<typeof __VLS_component_6, __VLS_TemplateResult_6["slots"]>;
+export { _default_5 as C_ReverseHorizontalMixLayout }
+export { _default_5 as ReverseHorizontalMixLayout }
+
+declare const _default_6: __VLS_WithTemplateSlots_7<typeof __VLS_component_7, __VLS_TemplateResult_7["slots"]>;
+export { _default_6 as C_CardLayout }
+export { _default_6 as CardLayout }
+
+/**
+ * 默认品牌配置
+ */
+export declare const DEFAULT_BRAND_CONFIG: Required<LayoutBrandConfig>;
+
 export declare const DEFAULT_SETTINGS: SettingsState;
 
+/**
+ * 抽屉菜单控制器 Injection Key
+ */
+export declare const DRAWER_HANDLER_KEY: InjectionKey<DrawerHandlers>;
+
+/**
+ * 抽屉菜单统一控制器
+ * 解决 MenuTrigger 与 DrawerMenu 各自拥有独立定时器导致的
+ * "鼠标从 trigger 移到 drawer 过程中 drawer 被关闭"问题
+ */
+export declare interface DrawerHandlers {
+    /** 显示抽屉并取消所有待执行的隐藏操作 */
+    show: () => void;
+    /** 启动延迟隐藏（300ms） */
+    startHide: () => void;
+    /** 立即隐藏抽屉（如导航跳转后） */
+    hide: () => void;
+}
+
+export declare const DrawerMenu: DefineComponent<__VLS_Props_5, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_5> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+
+export declare const FloatingMenu: DefineComponent<__VLS_Props_3, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+click: (item: MenuOptions) => any;
+}, string, PublicProps, Readonly<__VLS_Props_3> & Readonly<{
+onClick?: ((item: MenuOptions) => any) | undefined;
+}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
+
+export declare const IconMenu: DefineComponent<__VLS_Props_2, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+click: (item: MenuOptions) => any;
+}, string, PublicProps, Readonly<__VLS_Props_2> & Readonly<{
+onClick?: ((item: MenuOptions) => any) | undefined;
+}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+
+/**
+ * 布局上下文 Injection Key
+ */
+export declare const LAYOUT_CONTEXT_KEY: InjectionKey<LayoutContext>;
+
 export declare const LAYOUT_MODES: LayoutInfo[];
 
+/**
+ * 品牌配置
+ */
+export declare interface LayoutBrandConfig {
+    /** 品牌名称，如 'Robot Admin' */
+    name?: string;
+    /** 品牌副标题，如 '机器人管理系统' */
+    subtitle?: string;
+    /** Logo 地址（图片或视频） */
+    logoSrc?: string;
+    /** Logo 类型 */
+    logoType?: "video" | "image";
+    /** Logo 尺寸 */
+    logoSize?: number;
+    /** 首页路径，默认 '/home' */
+    homePath?: string;
+    /** 页脚版权文本 */
+    copyright?: string;
+}
+
+/**
+ * @robot-admin/layout
+ *
+ * 统一的 KeepAlive 缓存管理
+ * 从主项目提取的通用 composable，零业务依赖
+ */
+/** KeepAlive 缓存选项 */
+export declare interface LayoutCacheOptions {
+    /** 最大缓存数量，默认 20 */
+    maxCacheCount?: number;
+    /** 是否在开发模式下输出日志，默认 true */
+    enableDevLog?: boolean;
+    /** 是否暴露调试方法到 window，默认 true */
+    exposeToWindow?: boolean;
+}
+
+/**
+ * 布局上下文数据接口
+ * 骨架组件通过 inject 获取这些数据
+ */
+export declare interface LayoutContext {
+    /** 菜单列表数据 */
+    menus: ComputedRef<MenuOptions[]>;
+    /** 是否为暗色模式 */
+    isDark: ComputedRef<boolean>;
+    /** 当前布局模式 */
+    layoutMode: ComputedRef<LayoutMode>;
+    /** 侧边栏宽度 (px) */
+    sidebarWidth: ComputedRef<number>;
+    /** 侧边栏折叠后宽度 (px) */
+    sidebarCollapsedWidth: ComputedRef<number>;
+    /** 是否显示页脚 */
+    showFooter: ComputedRef<boolean>;
+    /** 是否显示标签页 */
+    showTagsView: ComputedRef<boolean>;
+    /** 标签页高度 (px) */
+    tagsViewHeight: ComputedRef<number>;
+    /** 头部高度 (px) */
+    headerHeight: ComputedRef<number>;
+    /** 过渡动画名称 */
+    transitionName: ComputedRef<string>;
+    /** 是否显示面包屑 */
+    showBreadcrumb: ComputedRef<boolean>;
+    /** 是否显示面包屑图标 */
+    showBreadcrumbIcon: ComputedRef<boolean>;
+    /** 是否固定头部 */
+    fixedHeader: ComputedRef<boolean>;
+    /** 品牌信息 */
+    brand: LayoutBrandConfig;
+    /**
+     * 自定义图标组件（如 @iconify/vue 的 Icon 组件）
+     * 用于布局内部组件渲染菜单图标
+     * 组件需接受 name (string) 和 size (number) 两个 props
+     * 如果不提供，将使用 CSS class 渲染图标
+     */
+    iconComponent?: Component;
+}
+
 /**
  * 布局模式信息
  */
@@ -142,6 +560,80 @@ export declare interface LayoutInfo {
  */
 export declare type LayoutMode = "side" | "top" | "mix" | "mix-top" | "reverse-horizontal-mix" | "card-layout";
 
+/**
+ * 菜单项类型
+ * - `group` 分组
+ * - `divider` 分割线
+ * - `item` 普通菜单项
+ */
+export declare type MenuItemType = "group" | "divider" | "item";
+
+/**
+ * 菜单选项的详细类型定义
+ */
+export declare interface MenuOptions {
+    /** 菜单项类型（分组/分割线） */
+    type?: "group" | "divider";
+    /** 唯一标识 */
+    key?: string;
+    /** 菜单跳转路径 */
+    path?: string;
+    /** 菜单名称（可对应路由名） */
+    name?: string;
+    /** 菜单项对应的组件名称 */
+    component?: string;
+    /** 重定向路径 */
+    redirect?: string;
+    /** 菜单显示的文本 */
+    label?: string;
+    /** 图标 */
+    icon?: string | (() => VNode) | VNode;
+    /** 是否禁用此菜单项 */
+    disabled?: boolean;
+    /** 元数据 */
+    meta?: {
+        /** 页面标题 */
+        title?: string;
+        /** 菜单项的图标 */
+        icon?: string;
+        /** 是否在菜单中隐藏 */
+        hidden?: boolean;
+        /** 是否固定在标签栏 */
+        affix?: boolean;
+        /** 是否缓存该页面 */
+        keepAlive?: boolean;
+        /** 是否全屏显示 */
+        full?: boolean;
+        /** 外部链接 URL */
+        link?: string;
+        /** 扩展属性 */
+        [key: string]: any;
+    };
+    /** 子菜单 */
+    children?: MenuOptions[];
+}
+
+/**
+ * 标签栏项类型定义
+ */
+export declare interface MenuTag {
+    /** 标签项对应的路由路径 */
+    path: string;
+    /** 标签显示的标题（已翻译） */
+    title: string;
+    /** 原始标题（中文，用于重新翻译） */
+    originalTitle?: string;
+    /** 显示的图标 */
+    icon?: string;
+    /** 标签相关元数据 */
+    meta?: {
+        /** 是否固定在标签栏 */
+        affix?: boolean;
+    };
+}
+
+export declare const MenuTrigger: DefineComponent<__VLS_Props_6, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_6> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+
 export declare const PRESET_COLORS: PresetColor[];
 
 /**
@@ -152,6 +644,11 @@ export declare interface PresetColor {
     value: string;
 }
 
+export declare const ResponsiveMenu: DefineComponent<__VLS_Props_7, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_7> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {
+containerRef: HTMLDivElement;
+visibleRef: HTMLDivElement;
+}, HTMLDivElement>;
+
 export declare const SettingsDrawer: DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
 "update:show": (value: boolean) => any;
 }, string, PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
@@ -208,8 +705,6 @@ export declare interface SettingsState {
 export declare interface SettingsStoreOptions {
     /** 默认配置 */
     defaults?: Partial<SettingsState>;
-    /** localStorage 键名 */
-    storageKey?: string;
     /** 主题模式变化回调（用于同步到 theme store） */
     onThemeModeChange?: (mode: ThemeMode) => void | Promise<void>;
 }
@@ -317,6 +812,12 @@ updateThemeMode: (mode: ThemeMode) => Promise<void>;
 toggleCollapse: () => void;
 }, "syncCSSVariables" | "applyPreset" | "resetSettings" | "updateThemeMode" | "toggleCollapse">>;
 
+export declare const SideMenu: DefineComponent<__VLS_Props_4, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+click: (item: MenuOptions) => any;
+}, string, PublicProps, Readonly<__VLS_Props_4> & Readonly<{
+onClick?: ((item: MenuOptions) => any) | undefined;
+}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
+
 /**
  * 标签页风格
  */
@@ -352,6 +853,94 @@ export declare const TRANSITION_MAP: {
  */
 export declare type TransitionType = "fade" | "slide" | "zoom" | "none";
 
+/**
+ * 统一的 KeepAlive 缓存管理 composable
+ *
+ * @param options - 缓存配置选项
+ * @returns 缓存视图列表和管理方法
+ *
+ * @example
+ * ```vue
+ * <script setup>
+ * import { useLayoutCache } from '@robot-admin/layout'
+ *
+ * const { cachedViews, maxCacheCount } = useLayoutCache({ maxCacheCount: 30 })
+ * </script>
+ *
+ * <template>
+ *   <KeepAlive :include="cachedViews" :max="maxCacheCount">
+ *     <RouterView />
+ *   </KeepAlive>
+ * </template>
+ * ```
+ */
+export declare function useLayoutCache(options?: LayoutCacheOptions): {
+    cachedViews: Ref<string[], string[]>;
+    maxCacheCount: Ref<number, number>;
+    addCache: (name: string) => void;
+    removeCache: (name: string) => void;
+    clearAllCache: () => void;
+};
+
+/**
+ * 在骨架组件中获取布局上下文
+ *
+ * @throws 如果没有 provide LayoutContext 会抛出错误
+ *
+ * @example
+ * ```vue
+ * <script setup>
+ * // 在包的骨架组件内部使用
+ * const ctx = useLayoutContext()
+ * const menus = ctx.menus
+ * const isDark = ctx.isDark
+ * </script>
+ * ```
+ */
+export declare function useLayoutContext(): LayoutContext;
+
+/**
+ * 菜单拆分 Composable
+ *
+ * 提供一级/二级菜单拆分状态管理、路由自动匹配、菜单点击处理。
+ * 供 MixLayout / MixTopLayout / ReverseHorizontalMixLayout 共用。
+ *
+ * @example
+ * ```ts
+ * const menuSplit = useMenuSplit({
+ *   menus: ctx.menus,
+ *   floatingSecondMenu: computed(() => layoutMode.value === 'mix'),
+ * })
+ * ```
+ */
+export declare function useMenuSplit(options: UseMenuSplitOptions): UseMenuSplitReturn;
+
+export declare interface UseMenuSplitOptions {
+    /** 菜单数据（响应式） */
+    menus: ComputedRef<MenuOptions[]>;
+    /** 是否使用悬浮式二级菜单（MixLayout 的 toggle 模式） */
+    floatingSecondMenu?: MaybeRefOrGetter<boolean>;
+}
+
+export declare interface UseMenuSplitReturn {
+    /** 当前激活的一级菜单路径 */
+    activeFirstMenu: Ref<string>;
+    /** 当前激活的一级菜单完整数据 */
+    activeFirstMenuItem: ComputedRef<MenuOptions | undefined>;
+    /** 当前一级菜单对应的二级菜单列表 */
+    currentSecondMenus: ComputedRef<MenuOptions[]>;
+    /** 悬浮的菜单项（MixLayout 使用） */
+    hoveredMenuItem: Ref<MenuOptions | null>;
+    /** 是否显示悬浮二级菜单（MixLayout 使用） */
+    showSecondMenu: Ref<boolean>;
+    /** 处理一级菜单点击 */
+    handleFirstMenuClick: (item: MenuOptions) => void;
+    /** 处理二级菜单点击 */
+    handleSecondMenuClick: (item: MenuOptions) => void;
+    /** 检查路由是否匹配菜单项 */
+    isMenuItemActive: (menuPath: string | undefined) => boolean;
+}
+
 /**
  * 默认的设置 Store（使用默认配置）
  */