import type { Ref, InjectionKey } from 'vue';
declare type VarsType = Ref<Record<string, string>> | Record<string, string>;
export declare const themeVarsKey: InjectionKey<VarsType>;
/**
 * @param vars
 * @param target
 * @returns stopWatchHandler
 * @example
 *
 * If you pass a Ref vars param, it will generate a watch handler.
 *
 * In main.ts:
 *
 * ```ts
 * const themeVars = {
 *  '--el-color-primary': '#f44336',
 *  '--el-color-white': '#2196f3',
 * }
 * app.provide(themeVarsKey, themeVars)
 * ```
 * Usually you need to use this function in the root component.
 * In components' steup:
 *
 * ```ts
 * setup() {
 *  const themeVars = ref({
 *    '--el-button-default-background-color': '#f44336',
 *    '--el-button-default-font-color': '#2196f3',
 *  })
 *  useCssVar(themeVars)
 * }
 * ```
 */
export declare function useCssVar(vars: VarsType, target?: Ref<HTMLElement> | HTMLElement): void;
export declare const useThemeVars: () => VarsType;
export {};