admin/packages/@core/ui-kit/layout-ui/src/vben-layout.ts

import type {
  ContentCompactType,
  LayoutHeaderModeType,
  LayoutType,
  ThemeModeType,
} from '@vben-core/typings';

interface VbenLayoutProps {
  /**
   * 内容区域定宽
   * @default 'wide'
   */
  contentCompact?: ContentCompactType;
  /**
   * 定宽布局宽度
   * @default 1200
   */
  contentCompactWidth?: number;
  /**
   * padding
   * @default 16
   */
  contentPadding?: number;
  /**
   * paddingBottom
   * @default 16
   */
  contentPaddingBottom?: number;
  /**
   * paddingLeft
   * @default 16
   */
  contentPaddingLeft?: number;
  /**
   * paddingRight
   * @default 16
   */
  contentPaddingRight?: number;
  /**
   * paddingTop
   * @default 16
   */
  contentPaddingTop?: number;
  /**
   * footer背景颜色
   * @default #fff
   */
  footerBackgroundColor?: string;
  /**
   * footer 是否可见
   * @default false
   */
  footerEnable?: boolean;
  /**
   * footer 是否固定
   * @default true
   */
  footerFixed?: boolean;
  /**
   * footer 高度
   * @default 32
   */
  footerHeight?: number;
  /**
   * 背景颜色
   * @default #fff
   */
  headerBackgroundColor?: string;
  /**
   * header高度
   * @default 48
   */
  headerHeight?: number;
  /**
   * header高度增加高度
   * 在顶部存在导航时，额外加高header高度
   * @default 10
   */
  headerHeightOffset?: number;
  /**
   * 顶栏是否隐藏
   * @default false
   */
  headerHidden?: boolean;
  /**
   * header 显示模式
   * @default 'fixed'
   */
  headerMode?: LayoutHeaderModeType;
  /**
   * 是否显示header切换侧边栏按钮
   * @default
   */
  headerToggleSidebarButton?: boolean;
  /**
   * header是否显示
   * @default true
   */
  headerVisible?: boolean;
  /**
   * 是否移动端显示
   * @default false
   */
  isMobile?: boolean;
  /**
   * 布局方式
   * sidebar-nav 侧边菜单布局
   * header-nav 顶部菜单布局
   * mixed-nav 侧边&顶部菜单布局
   * sidebar-mixed-nav 侧边混合菜单布局
   * full-content 全屏内容布局
   * @default sidebar-nav
   */
  layout?: LayoutType;
  /**
   *  侧边菜单折叠宽度
   * @default 48
   */
  sideCollapseWidth?: number;
  /**
   * 侧边菜单折叠状态
   * @default false
   */
  sidebarCollapse?: boolean;
  /**
   * 侧边菜单是否折叠时，是否显示title
   * @default true
   */
  sidebarCollapseShowTitle?: boolean;
  /**
   * 侧边栏是否可见
   * @default true
   */
  sidebarEnable?: boolean;
  /**
   * 侧边栏是否隐藏
   * @default false
   */
  sidebarHidden?: boolean;
  /**
   * 混合侧边栏宽度
   * @default 80
   */
  sidebarMixedWidth?: number;
  /**
   * 侧边栏是否半深色
   * @default false
   */
  sidebarSemiDark?: boolean;
  /**
   * 侧边栏
   * @default dark
   */
  sidebarTheme?: ThemeModeType;
  /**
   * 侧边栏宽度
   * @default 210
   */
  sidebarWidth?: number;
  /**
   * footer背景颜色
   * @default #fff
   */
  tabbarBackgroundColor?: string;
  /**
   * tab是否可见
   * @default true
   */
  tabbarEnable?: boolean;
  /**
   * tab高度
   * @default 30
   */
  tabbarHeight?: number;
  /**
   * zIndex
   * @default 100
   */
  zIndex?: number;
}
export type { VbenLayoutProps };