@ithinkdt/naive/types/frame/layout.d.ts

iThinkDT Naive UI

import { VNode, VNodeChild, PropType } from 'vue'

import { DropdownGroupOption, DropdownDividerOption, DropdownRenderOption, DropdownOption } from 'ithinkdt-ui'

import { SimpleComponent, SimpleDefineComponent } from '@ithinkdt/common'
import { ModuleItem } from '@ithinkdt/core'

export declare const DtLogo: SimpleDefineComponent<{
    src: {
        type: StringConstructor
    }
    name: {
        type: StringConstructor
    }
}>

export declare const DtNavMenu: LayoutEgComponent['Menu']
export declare const DtSideMenu: LayoutEgComponent['Menu']

export type UserDropdownMenuOption = Omit<DropdownOption, 'children'> & {
    action?: () => void
    children?: UserDropdownOption[]
}

export type UserDropdownGroupOption = Omit<DropdownGroupOption, 'children'> & {
    children?: UserDropdownOption[]
}

export type UserDropdownOption =
    | UserDropdownMenuOption
    | UserDropdownGroupOption
    | DropdownDividerOption
    | DropdownRenderOption

export declare const DtUser: SimpleDefineComponent<{
    dropMenus: {
        type: PropType<UserDropdownOption[]>
    }
    src: {
        type: String
    }
}>

export declare const DtMessage: SimpleDefineComponent

export declare const DtLang: SimpleDefineComponent
export declare const DtCollpaseBtn: LayoutEgComponent['CollpaseButton']
export declare const DtTabs: SimpleDefineComponent
export declare const DtFullscreen: SimpleComponent
export declare const DtAppearence: SimpleComponent

export type BreadcrumbOption = Omit<ModuleItem, 'type' | 'appCode'> & {
    dropdown?: UserDropdownOption[]
}
export declare const DtBreadcrumb: SimpleDefineComponent<{
    prefix: {
        type: PropType<BreadcrumbOption[]>
    }
}>

export declare const DtFooter: SimpleDefineComponent<{
    content: {
        type: StringConstructor
        required: true
    }
}>

export interface LayoutSlots {
    logo: () => VNode
    avator: () => VNode
    message?: () => VNode
    language?: () => VNode
    appearence?: () => VNode
    fullscreen?: () => VNode
    extra?: () => VNode
    nav?: (_: { full: boolean }) => VNode
    side?: (_: { full: boolean }) => VNode
    collpase?: (_: { size: 'medium' | 'large' }) => VNode
    breadcrumb?: () => VNode
    tabs?: ({ showBreadcrumb: boolean }) => VNode
    footer?: (_: { description: string }) => VNodeChild
}

export declare const DtLayout: SimpleDefineComponent<{}, LayoutSlots>

export interface LayoutEgComponent {
    CollpaseButton: SimpleDefineComponent<{
        size: {
            type: PropType<'medium' | 'large'>
            required: false
            default: string
        }
    }>

    Menu: SimpleDefineComponent<{
        full: {
            type: BooleanConstructor
            required: false
            default: boolean
        }
    }>
}