@fifteen/design-system-vue/dist/types/composables/useIcon.d.ts

Vue 3 (Composition API + Typescript) implementation of the Fifteen Design System

import { Ref, ComputedRef, InjectionKey } from 'vue';
import { CreditCardBrandId } from '../utils/credit-cards';
import { Icon } from '../types/icons';
import { FlagCode } from '../types/flags';
type IconCollection<T extends Icon | FlagCode | CreditCardBrandId> = {
    [key in T]?: string;
};
export type Icons = IconCollection<Icon>;
export type FlagIcons = IconCollection<FlagCode>;
export type CreditCardIcons = IconCollection<CreditCardBrandId>;
export type IconCollectionName = 'icons' | 'flags' | 'creditCards';
export declare const iconsInjectionKeys: {
    icons: InjectionKey<Icons>;
    flags: InjectionKey<FlagIcons>;
    creditCards: InjectionKey<CreditCardIcons>;
};
type IconCollectionMap = {
    icons: Icon;
    flags: FlagCode;
    creditCards: CreditCardBrandId;
};
export interface UseIconReturn {
    /**
     * Icon svg markup as string
     */
    markup: ComputedRef<string | null | undefined>;
}
/**
 * Get SVG makup for an icon name given an icon collection injection key
 * @param injectionKey - Injection key of the icon collection
 * @param name - Name of the icon
 */
export declare function useIcon<C extends IconCollectionName>(collectionName: C, iconName: Ref<IconCollectionMap[C] | null> | IconCollectionMap[C] | null): UseIconReturn;
/**
 * Register icons _a posteriori_ to a specific collection, if they have not been registered by `createFds`
 * @param collectionName - Name of the icon collection
 * @param icons - Icons to register
 */
export declare function registerIcons<C extends IconCollectionName>(collectionName: C, icons: {
    [K in IconCollectionMap[C]]?: string;
}): void;
export {};