UNPKG

maz-ui

Version:

A standalone components library for Vue.Js 3 & Nuxt.Js 3

136 lines (135 loc) 4.21 kB
import type { Color, Icon, Size } from './types'; export type { Color, Size }; export interface Props { /** * The variant of the button - Change UI of component (link or button style) * @values `'button' | 'link'` * @deprecated Use the component <MazLink /> instead */ variant?: 'button' | 'link'; /** * The size of the button * @values `'xl' | 'lg' | 'md' | 'sm' | 'xs' | 'mini'` */ size?: Size; /** * The color of the button * @values `'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'danger' | 'white' | 'black' | 'transparent' | 'theme'` */ color?: Color; /** * The type of the button * @values `'submit' | 'reset' | 'button'` */ type?: 'submit' | 'reset' | 'button'; /** * If true, the button will have a full border radius * @default false */ rounded?: boolean; /** * Size of the rounded * @values `'none' | 'sm' | 'md' | 'lg' | 'xl' | 'full'` * @default 'lg' */ roundedSize?: 'none' | 'sm' | 'md' | 'lg' | 'xl' | 'full'; /** * If true, the button will have no border radius * @default false */ noRounded?: boolean; /** * If true, the button have the "border" style * @default false */ outline?: boolean; /** * If true, the button will have a pastel color * @default false */ pastel?: boolean; /** * If true, the button will have a full width * @default false */ block?: boolean; /** * If true, the button will have no underline on hover (useful with `variant="link"`) * @default false */ noUnderline?: boolean; /** * Enable the button loader * @default false */ loading?: boolean; /** * Disable the button * @default false */ disabled?: boolean; /** * If true, the button will have a fab style * @default false */ fab?: boolean; /** * The name of the icon to display or component, only with fab * `@type` `{string | FunctionalComponent<SVGAttributes> | ComponentPublicInstance | Component}` */ icon?: string | Icon; /** * The name of the icon or component to display on the left of the button * `@type` `{string | FunctionalComponent<SVGAttributes> | ComponentPublicInstance | Component}` */ leftIcon?: string | Icon; /** * The name of the icon or component to display on the right of the button * `@type` `{string | FunctionalComponent<SVGAttributes> | ComponentPublicInstance | Component}` */ rightIcon?: string | Icon; /** * If true, the button will have no padding * @default false */ noPadding?: boolean; /** * If true, the button will have no box-shadow * @default false */ noElevation?: boolean; /** * Choose how the elements are aligned in the button */ justify?: 'start' | 'end' | 'center' | 'space-between' | 'space-around' | 'space-evenly'; } declare function __VLS_template(): { attrs: Partial<{}>; slots: { "left-icon"?(_: {}): any; icon?(_: {}): any; default?(_: {}): any; "right-icon"?(_: {}): any; }; refs: {}; rootEl: any; }; type __VLS_TemplateResult = ReturnType<typeof __VLS_template>; declare const __VLS_component: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, { size: Size; color: Color; type: "submit" | "reset" | "button"; variant: "button" | "link"; roundedSize: "none" | "sm" | "md" | "lg" | "xl" | "full"; icon: string | Icon; leftIcon: string | Icon; rightIcon: string | Icon; justify: "start" | "end" | "center" | "space-between" | "space-around" | "space-evenly"; }, {}, {}, {}, 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; }; };