@dt-frames/ui 3.0.1 → 4.0.1

package/dist/es/lib/layout/src/const/preferences.config.d.ts

@@ -0,0 +1,8 @@
+import type { BuiltinThemePreset, Preferences } from '../types/perferences.type';
+declare const defaultPreferences: Preferences;
+declare const BUILT_IN_THEME_PRESETS: BuiltinThemePreset[];
+declare const PERFERENCES_TABS: {
+    label: string;
+    value: string;
+}[];
+export { defaultPreferences, BUILT_IN_THEME_PRESETS, PERFERENCES_TABS };

package/dist/es/lib/layout/src/hooks/useContext.d.ts

@@ -0,0 +1,6 @@
+import type { MenuProvider, SubMenuProvider } from '../components/menu/basic-menu/type';
+declare function createMenuContext(injectMenuData: MenuProvider): void;
+declare function useMenuContext(): MenuProvider;
+declare function createSubMenuContext(injectSubMenuData: SubMenuProvider): void;
+declare function useSubMenuContext(): SubMenuProvider;
+export { createMenuContext, useMenuContext, createSubMenuContext, useSubMenuContext };

package/dist/es/lib/layout/src/hooks/useDesignTokens.d.ts

@@ -0,0 +1 @@
+export declare function useDesignTokens(): void;

package/dist/es/lib/layout/src/hooks/useExtraMenu.d.ts

@@ -0,0 +1,12 @@
+import type { ComputedRef } from 'vue';
+import type { MenuRecordRaw } from '../types/menu.type';
+declare function useExtraMenu(useRootMenus?: ComputedRef<MenuRecordRaw[]>): {
+    extraActiveMenu: import("vue").Ref<string, string>;
+    extraMenus: ComputedRef;
+    handleDefaultSelect: (menu: MenuRecordRaw, rootMenu?: MenuRecordRaw) => Promise<void>;
+    handleMenuMouseEnter: (menu: MenuRecordRaw) => void;
+    handleMixedMenuSelect: (menu: MenuRecordRaw) => Promise<void>;
+    handleSideMouseLeave: () => void;
+    sidebarExtraVisible: import("vue").Ref<boolean, boolean>;
+};
+export { useExtraMenu };

package/dist/es/lib/layout/src/hooks/useLayoutStyle.d.ts

@@ -0,0 +1,36 @@
+import type { CSSProperties } from 'vue';
+export interface VisibleDomRect {
+    bottom: number;
+    height: number;
+    left: number;
+    right: number;
+    top: number;
+    width: number;
+}
+export declare function useLayoutContentStyle(): {
+    contentElement: import("vue").Ref<HTMLDivElement | null, HTMLDivElement | null>;
+    overlayStyle: import("vue").ComputedRef<CSSProperties>;
+    visibleDomRect: import("vue").Ref<{
+        bottom: number;
+        height: number;
+        left: number;
+        right: number;
+        top: number;
+        width: number;
+    } | null, VisibleDomRect | {
+        bottom: number;
+        height: number;
+        left: number;
+        right: number;
+        top: number;
+        width: number;
+    } | null>;
+};
+export declare function useLayoutHeaderStyle(): {
+    getLayoutHeaderHeight: () => number;
+    setLayoutHeaderHeight: (height: number) => void;
+};
+export declare function useLayoutFooterStyle(): {
+    getLayoutFooterHeight: () => number;
+    setLayoutFooterHeight: (height: number) => void;
+};

package/dist/es/lib/layout/src/hooks/useMenu.d.ts

@@ -0,0 +1,4 @@
+declare function useMenu(): {
+    sidebarVisible: import("vue").ComputedRef<boolean | undefined>;
+};
+export { useMenu };

package/dist/es/lib/layout/src/hooks/useMixedMenu.d.ts

@@ -0,0 +1,13 @@
+import type { MenuRecordRaw } from '../types/menu.type';
+declare function useMixedMenu(): {
+    handleMenuSelect: (key: string, mode?: string) => void;
+    handleMenuOpen: (key: string, parentsPath: string[]) => void;
+    headerActive: import("vue").ComputedRef<string>;
+    headerMenus: import("vue").ComputedRef<MenuRecordRaw[]>;
+    sidebarActive: import("vue").ComputedRef<string>;
+    sidebarMenus: import("vue").ComputedRef<MenuRecordRaw[]>;
+    mixHeaderMenus: import("vue").ComputedRef<MenuRecordRaw[]>;
+    mixExtraMenus: import("vue").Ref<any[], any[]>;
+    sidebarVisible: import("vue").ComputedRef<boolean | undefined>;
+};
+export { useMixedMenu };

package/dist/es/lib/layout/src/hooks/useNavigation.d.ts

@@ -0,0 +1,5 @@
+declare function useNavigation(): {
+    navigation: (path: string) => Promise<void>;
+    willOpenedByWindow: (path: string) => boolean;
+};
+export { useNavigation };

package/dist/es/lib/layout/src/hooks/useTheme.d.ts

@@ -0,0 +1,34 @@
+export declare function useTheme(): {
+    theme: import("../..").Preferences;
+    savePreferences: (preference: import("../..").Preferences) => void;
+    initPreferences: (preference: import("../..").Preferences) => Promise<void>;
+    resetPreferences: () => void;
+    updatePreferences: (updates: import("../..").Preferences) => void;
+    initPlatform: () => void;
+    loadPreferences: () => import("../..").Preferences;
+    loadCachedPreferences: () => import("../..").Preferences | null;
+    handleUpdates: (updates: import("../..").Preferences) => void;
+    updateColorMode: (preference: import("../..").Preferences) => void;
+    useBasicLayout: (isUse?: boolean) => void;
+    currentLayout: import("vue").ComputedRef<import("../types/perferences.type").LayoutType | undefined>;
+    isFullContent: import("vue").ComputedRef<boolean>;
+    isSidebarMixedNav: import("vue").ComputedRef<boolean>;
+    isHeaderNav: import("vue").ComputedRef<boolean>;
+    isMixedNav: import("vue").ComputedRef<boolean>;
+    isHeaderMixedNav: import("vue").ComputedRef<boolean>;
+    keepAlive: import("vue").ComputedRef<boolean | undefined>;
+    themeButtonPosition: import("vue").ComputedRef<{
+        fixed: boolean;
+        header: boolean;
+    }>;
+    isDark: import("vue").ComputedRef<boolean>;
+    isSideMode: import("vue").ComputedRef<boolean>;
+    isSideNav: import("vue").ComputedRef<boolean>;
+    isHeaderSidebarNav: import("vue").ComputedRef<boolean>;
+    preferencesButtonPosition: import("vue").ComputedRef<{
+        fixed: boolean;
+        header: boolean;
+    }>;
+    contentIsMaximize: import("vue").ComputedRef<boolean | undefined>;
+    diffPreference: Partial<import("../..").Preferences>;
+};

package/dist/es/lib/layout/src/stores/preferences.store.d.ts

@@ -0,0 +1,66 @@
+import type { Preferences } from '../types/perferences.type';
+/**
+ * 深层递归所有属性为可选
+ */
+type PerferceState = {
+    initialPreferences: Preferences;
+    isInitialized: boolean;
+    state: Preferences;
+};
+export declare const useThemeStore: import("pinia").StoreDefinition<"dt-theme", PerferceState, {
+    theme(): Preferences;
+    diffPreference(): Partial<Preferences>;
+}, {
+    /**
+     * 避免频繁的操作缓存
+     */
+    savePreferences: (preference: Preferences) => void;
+    /**
+     * 覆盖偏好设置
+     * overrides  要覆盖的偏好设置
+     * namespace  命名空间
+     */
+    initPreferences(preference: Preferences): Promise<void>;
+    /**
+     * 重置偏好设置
+     * 偏好设置将被重置为初始值，并从 localStorage 中移除。
+     *
+     * @example
+     * 假设 initialPreferences 为 { theme: 'light', language: 'en' }
+     * 当前 state 为 { theme: 'dark', language: 'fr' }
+     * this.resetPreferences();
+     * 调用后，state 将被重置为 { theme: 'light', language: 'en' }
+     * 并且 localStorage 中的对应项将被移除
+     */
+    resetPreferences(): void;
+    /**
+     * 更新偏好设置
+     * @param updates - 要更新的偏好设置
+     */
+    updatePreferences(updates: Preferences): void;
+    isMacOs(): boolean;
+    /**
+     * 设置平台
+     */
+    initPlatform(): void;
+    /**
+     * 获取主题
+     */
+    loadPreferences(): Preferences;
+    /**
+     * 加载主题
+     */
+    loadCachedPreferences(): Preferences | null;
+    /**
+     * 处理更新的键值
+     * 根据更新的键值执行相应的操作。
+     * @param {DeepPartial<Preferences>} updates - 部分更新的偏好设置
+     */
+    handleUpdates(updates: Preferences): void;
+    /**
+     * 更新页面颜色模式（灰色、色弱）
+     * @param preference
+     */
+    updateColorMode(preference: Preferences): void;
+}>;
+export {};

package/dist/es/lib/layout/src/stores/useTabbar.store.d.ts

@@ -0,0 +1,185 @@
+import type { ComputedRef } from 'vue';
+import type { RouteLocationNormalized, RouteRecordNormalized, Router } from 'vue-router';
+interface TabDefinition extends RouteLocationNormalized {
+    /**
+     * 标签页的key
+     */
+    key?: string;
+}
+type TabbarState = {
+    /**
+     * 当前打开的标签页列表缓存
+     */
+    cachedTabs: Set<string>;
+    /**
+     * 拖拽结束的索引
+     */
+    dragEndIndex: number;
+    /**
+     * 需要排除缓存的标签页
+     */
+    excludeCachedTabs: Set<string>;
+    /**
+     * 标签右键菜单列表
+     */
+    menuList: string[];
+    /**
+     * 是否刷新
+     */
+    renderRouteView?: boolean;
+    /**
+     * 当前打开的标签页列表
+     */
+    tabs: TabDefinition[];
+    /**
+     * 更新时间，用于一些更新场景，使用watch深度监听的话，会损耗性能
+     */
+    updateTime?: number;
+};
+export declare const useTabbarStore: import("pinia").StoreDefinition<"layout-tabs", TabbarState, {
+    affixTabs(): TabDefinition[];
+    getCachedTabs(): string[];
+    getExcludeCachedTabs(): string[];
+    getMenuList(): string[];
+    getTabs(): TabDefinition[];
+}, {
+    /**
+     * 根据key 批量关闭
+     * @param keys
+     */
+    _bulkCloseByKeys(keys: string[]): Promise<void>;
+    /**
+     * 关闭标签页
+     * @param tab
+     */
+    _close(tab: TabDefinition): void;
+    /**
+     * 跳转到默认标签页
+     */
+    _goToDefaultTab(router: Router): Promise<void>;
+    /**
+     * 跳转到标签页
+     * @param tab
+     * @param router
+     */
+    _goToTab(tab: TabDefinition, router: Router): Promise<void>;
+    /**
+     * 添加标签页
+     * @param routeTab
+     */
+    addTab(routeTab: TabDefinition): TabDefinition | undefined;
+    /**
+     * 关闭所有标签页
+     * @param router
+     */
+    closeAllTabs(router: Router): Promise<void>;
+    /**
+     * 关闭左侧标签页
+     * @param tab
+     */
+    closeLeftTabs(tab: TabDefinition): Promise<void>;
+    /**
+     * 关闭其他标签页
+     * @param tab
+     */
+    closeOtherTabs(tab: TabDefinition): Promise<void>;
+    /**
+     * 关闭右侧标签页
+     * @param tab
+     */
+    closeRightTabs(tab: TabDefinition): Promise<void>;
+    /**
+     * 关闭标签页
+     * @param tab
+     * @param router
+     */
+    closeTab(tab: TabDefinition, router: Router): Promise<void>;
+    /**
+     * 通过key关闭标签页
+     * @param key
+     * @param router
+     */
+    closeTabByKey(key: string, router: Router): Promise<void>;
+    /**
+     * 根据tab的key获取tab
+     * @param key
+     */
+    getTabByKey(key: string): TabDefinition;
+    /**
+     * 新窗口打开标签页
+     * @param tab
+     */
+    openTabInNewWindow(tab: TabDefinition): Promise<void>;
+    pinTab(tab: TabDefinition): Promise<void>;
+    /**
+     * 刷新标签页
+     * @param router
+     */
+    refresh(router: Router | string): Promise<void>;
+    /**
+     * 根据路由名称刷新指定标签页
+     * @param name
+     */
+    refreshByName(name: string): Promise<void>;
+    /**
+     * 重置标签页标题
+     * @param tab
+     */
+    resetTabTitle(tab: TabDefinition): Promise<void>;
+    /**
+     * 设置固定标签页
+     * @param tabs
+     */
+    setAffixTabs(tabs: RouteRecordNormalized[]): void;
+    /**
+     * 更新菜单列表
+     * @param list
+     */
+    setMenuList(list: string[]): void;
+    /**
+     * 设置标签页标题
+     *
+     * 支持设置静态标题字符串或计算属性作为动态标题
+     * 当标题为计算属性时,标题会随计算属性值变化而自动更新
+     * 适用于需要根据状态或多语言动态更新标题的场景
+     *
+     * @param {TabDefinition} tab - 标签页对象
+     * @param {ComputedRef<string> | string} title - 标题内容,支持静态字符串或计算属性
+     *
+     * @example
+     * // 设置静态标题
+     * setTabTitle(tab, '新标签页');
+     *
+     * @example
+     * // 设置动态标题
+     * setTabTitle(tab, computed(() => t('common.dashboard')));
+     */
+    setTabTitle(tab: TabDefinition, title: ComputedRef<string> | string): Promise<void>;
+    setUpdateTime(): void;
+    /**
+     * 设置标签页顺序
+     * @param oldIndex
+     * @param newIndex
+     */
+    sortTabs(oldIndex: number, newIndex: number): Promise<void>;
+    /**
+     * 切换固定标签页
+     * @param tab
+     */
+    toggleTabPin(tab: TabDefinition): Promise<void>;
+    /**
+     * 取消固定标签页
+     * @param tab
+     */
+    unpinTab(tab: TabDefinition): Promise<void>;
+    /**
+     * 根据当前打开的选项卡更新缓存
+     */
+    updateCacheTabs(): Promise<void>;
+}>;
+/**
+ * 从route获取tab页的key
+ * @param tab
+ */
+declare function getTabKey(tab: RouteLocationNormalized | RouteRecordNormalized): string;
+export { getTabKey };

package/dist/es/lib/layout/src/types/basic.type.d.ts

@@ -0,0 +1,5 @@
+interface SelectOption {
+    label: string;
+    value: string;
+}
+export type { SelectOption };

package/dist/es/lib/layout/src/types/menu.type.d.ts

@@ -0,0 +1,102 @@
+interface MenuRecordBadgeRaw {
+    /**
+     * 徽标
+     */
+    badge?: string;
+    /**
+     * 徽标类型
+     */
+    badgeType?: 'dot' | 'normal';
+    /**
+     * 徽标颜色
+     */
+    badgeVariants?: 'destructive' | 'primary' | string;
+}
+type IconType = 'svg' | 'online' | 'offline';
+/**
+ * 菜单原始对象
+ */
+interface MenuRecordRaw extends MenuRecordBadgeRaw {
+    /**
+     * 激活时的图标名
+     */
+    activeIcon?: string;
+    /**
+     * 子菜单
+     */
+    children?: MenuRecordRaw[];
+    /**
+     * 是否禁用菜单
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * 图标名
+     */
+    icon?: string;
+    /**
+     * 图标类型
+     */
+    iconType?: IconType;
+    /**
+     * 菜单名
+     */
+    name: string;
+    /**
+     * 排序号
+     */
+    order?: number;
+    /**
+     * 父级路径
+     */
+    parent?: string;
+    /**
+     * 所有父级路径
+     */
+    parents?: string[];
+    /**
+     * 节点id
+     */
+    id?: string | number;
+    /**
+     * 父节点id
+     */
+    pid?: string | number;
+    /**
+     * 菜单路径，唯一，可当作key
+     */
+    /**
+     * 菜单类型
+     */
+    type?: 'catalog' | 'menu' | 'button' | 'embedded' | 'link';
+    path: string;
+    /**
+     * 是否显示菜单
+     * @default true
+     */
+    show?: boolean;
+}
+type NormalProps = {
+    /**
+     * 菜单数据
+     */
+    activePath?: string;
+    /**
+     * 是否折叠
+     */
+    collapse?: boolean;
+    /**
+     * 菜单项
+     */
+    menus?: MenuRecordRaw[];
+    /**
+     * @zh_CN 是否圆润风格
+     * @default true
+     */
+    rounded?: boolean;
+    /**
+     * 主题
+     */
+    theme?: 'dark' | 'light';
+};
+export type { MenuRecordBadgeRaw, MenuRecordRaw, NormalProps, IconType };