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

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

import { ComputedRef } from 'vue';
import { RouteLocationRaw } from 'vue-router';
export interface UseSmartLinkBaseProps {
    /**
     * Target location or url
     */
    location?: RouteLocationRaw | null;
    /**
     * Link target, overrides the one computed automatically on location
     */
    target?: HTMLAnchorElement['target'];
    /**
     * Link hreflang, overrides the one computed automatically on location
     */
    hreflang?: HTMLAnchorElement['hreflang'];
    /**
     * RouterLink-like active class, defaults to 'link--active'
     */
    activeClass?: string | null;
    /**
     * RouterLink-like exact active class, defaults to 'link--exactActive'
     */
    exactActiveClass?: string | null;
    /**
     * RouterLink replace prop
     */
    replace?: boolean;
}
export type UseSmartLinkProps<Props> = Omit<Props, 'location' | 'replace'> & {
    /**
     * Computed final href
     */
    href?: HTMLAnchorElement['href'];
};
export interface UseSmartLinkReturn<Props> {
    /**
     * Whether the location prop is an external url
     * @example http(s)://, mailto:, tel:, ...
     */
    isExternal: ComputedRef<boolean>;
    /**
     * Whether the location prop should be treated as an href
     * @example all the above + links starting with an anchor ref (#)
     */
    isHref: ComputedRef<boolean>;
    /**
     * Get final link props based on component props and input href
     */
    getProps: (href: string) => UseSmartLinkProps<Props>;
    /**
     * Get final active and exact-active link classes based on component props,
     */
    getClasses: (href: string) => Record<string, boolean>;
}
/**
 * Expose methods and properties to compute link props and classes
 * @param props - The link component props, extending UseSmartLinkBaseProps
 */
export declare function useSmartLink<Props extends UseSmartLinkBaseProps>(props: Props): UseSmartLinkReturn<Props>;