@fifteen/design-system-vue/dist/types/components/FButton.d.ts

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

import { Color } from '../types/colors';
export type FButtonAnchorPoint = 'left' | 'right' | 'center';
export type FButtonSize = 'tiny' | 'small' | 'medium' | 'large' | 'giant';
export interface FButtonProps {
    /**
     * Submits all form values to a form-handler
     */
    submit?: boolean;
    /**
     * Loading state of the button
     */
    loading?: boolean;
    /**
     * Use event preventDefault on anchor if component is rendered as a FLink
     */
    preventDefault?: boolean;
    /**
     * Display or not the background of the button
     */
    ghost?: boolean;
    /**
     * Display or not the outlines of the button
     */
    outlined?: boolean;
    /**
     * Disable or not the button
     */
    disabled?: boolean;
    /**
     * Use the button for an icon
     */
    icon?: boolean;
    /**
     * Size of the button
     */
    size?: FButtonSize;
    /**
     * Emit or not click event
     */
    preventClick?: boolean;
    /**
     * Use blur method of the button
     */
    preventBlurOnClick?: boolean;
    /**
     * Text/icon color or background color if background prop exist
     */
    color?: Color;
    /**
     * Background color of the button
     */
    background?: Color;
    /**
     * Color of the sliding overlay on hover
     */
    hoverColor?: Color;
    /**
     * Focus color
     */
    focusColor?: Color;
    /**
     * Anchor point of the button
     */
    anchorPoint?: FButtonAnchorPoint;
    /**
     * Use a circle for the shape of the button
     */
    circle?: boolean;
    /**
     * Disable text color, background color and button size changes on hover
     */
    static?: boolean;
    /**
     * Link href
     */
    href?: HTMLAnchorElement['href'];
    /**
     * Language of the linked URL
     */
    hreflang?: HTMLAnchorElement['hreflang'];
    /**
     * Link target
     */
    target?: HTMLAnchorElement['target'];
}
declare function __VLS_template(): {
    slots: {
        default?(_: {}): any;
    };
    refs: {
        buttonRef: unknown;
    };
    attrs: Partial<{}>;
};
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
declare const __VLS_component: import('vue').DefineComponent<FButtonProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
    blur: (event: FocusEvent) => any;
    click: (event: MouseEvent) => any;
    focus: (event: FocusEvent) => any;
}, string, import('vue').PublicProps, Readonly<FButtonProps> & Readonly<{
    onBlur?: ((event: FocusEvent) => any) | undefined;
    onClick?: ((event: MouseEvent) => any) | undefined;
    onFocus?: ((event: FocusEvent) => any) | undefined;
}>, {
    submit: boolean;
    color: Color;
    hoverColor: Color;
    circle: boolean;
    size: FButtonSize;
    loading: boolean;
    href: HTMLAnchorElement["href"];
    hreflang: HTMLAnchorElement["hreflang"];
    target: HTMLAnchorElement["target"];
    disabled: boolean;
    preventDefault: boolean;
    ghost: boolean;
    outlined: boolean;
    icon: boolean;
    preventClick: boolean;
    preventBlurOnClick: boolean;
    background: Color;
    focusColor: Color;
    anchorPoint: FButtonAnchorPoint;
    static: boolean;
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
export default _default;
type __VLS_WithTemplateSlots<T, S> = T & {
    new (): {
        $slots: S;
    };
};