import type { DefineComponent } from 'vue';
import type {
    ProLayoutMode,
    ProLayoutThemeConfig,
    ProLayoutThemeTokens,
    ProLayoutSettingsFabConfig,
    ProLayoutSettingsFabPosition,
} from './types';

declare const ProLayout: DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown>;
export default ProLayout;

export const ProLayoutRouterView: DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown>;
export const ProLayoutSettingsFab: DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown>;
export const ProLayoutSettingsDrawer: DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown>;
export const ProLayoutColumnsAside: DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown>;

export const proLayoutContextKey: symbol;

export function normalizeProLayoutRoutePath(path: string): string;
export function getProLayoutRouteCacheKey(route: {
    path: string;
    fullPath: string;
    meta?: Record<string, unknown>;
    matched?: Array<{ meta?: Record<string, unknown> }>;
}): string;
export function shouldProLayoutRouteKeepAlive(
    route: {
        path: string;
        fullPath: string;
        meta?: Record<string, unknown>;
        matched?: Array<{ meta?: Record<string, unknown> }>;
    },
    tagsViewKeepAliveEnabled?: boolean,
): boolean;

export const DEFAULT_PRO_LAYOUT_THEME_CONFIG: ProLayoutThemeConfig;
export const DEFAULT_PRO_LAYOUT_THEME_TOKENS: Required<ProLayoutThemeTokens>;

export const DEFAULT_PRO_LAYOUT_GLOBAL_COLORS: Record<string, string>;
export const PRO_LAYOUT_COLOR_SETTING_GROUPS: Array<{
    title: string;
    items: Array<{ key: string; label: string; alpha?: boolean }>;
}>;

export function applyProLayoutThemeToElement(
    el: HTMLElement | null | undefined,
    tokens?: ProLayoutThemeTokens | null,
): void;
export function applyProLayoutGlobalColors(colors?: Record<string, string> | null, target?: HTMLElement | null): void;
export function applyPrimaryColorDerivatives(primary: string, target?: HTMLElement): void;
export function mergeProLayoutTheme(
    base: ProLayoutThemeConfig,
    patch?: ProLayoutThemeConfig | null,
): ProLayoutThemeConfig;
export function persistProLayoutTheme(key: string, config: ProLayoutThemeConfig): void;
export function readPersistedProLayoutTheme(key: string): ProLayoutThemeConfig | null;
export function clearPersistedProLayoutTheme(key: string): void;
export function getLightColor(color: string, level: number): string;
export function getDarkColor(color: string, level: number): string;

export type {
    ProLayoutMode,
    ProLayoutThemeConfig,
    ProLayoutThemeTokens,
    ProLayoutGlobalColors,
    ProLayoutSettingsFabConfig,
    ProLayoutSettingsFabPosition,
};