@bitrix24/b24ui-nuxt
Version:
Bitrix24 UI-Kit for developing web applications REST API for NUXT & VUE
641 lines (640 loc) • 14.4 kB
TypeScript
import type { VariantProps } from 'tailwind-variants';
import type { LinkProps } from './Link.vue';
import type { UseComponentIconsProps } from '../composables/useComponentIcons';
import type { PartialString } from '../types/utils';
declare const button: import("tailwind-variants").TVReturnType<{
buttonGroup: {
horizontal: string;
vertical: string;
};
noSplit: {
false: string;
};
color: {
default: string;
danger: string;
success: string;
warning: string;
primary: string;
secondary: string;
collab: string;
ai: string;
link: string;
};
depth: {
light: string;
normal: string;
dark: string;
};
size: {
xs: {
base: string;
baseLine: string;
leadingIcon: string;
leadingAvatarSize: string;
trailingIcon: string;
};
sm: {
base: string;
baseLine: string;
leadingIcon: string;
leadingAvatarSize: string;
trailingIcon: string;
};
md: {
base: string;
baseLine: string;
leadingIcon: string;
leadingAvatarSize: string;
trailingIcon: string;
};
lg: {
base: string;
baseLine: string;
leadingIcon: string;
leadingAvatarSize: string;
trailingIcon: string;
};
};
block: {
true: {
base: string;
baseLine: string;
trailingIcon: string;
};
};
rounded: {
true: string;
false: string;
};
leading: {
true: string;
};
useLabel: {
true: string;
false: string;
};
useDropdown: {
true: string;
};
useWait: {
true: string;
};
useClock: {
true: string;
};
loading: {
true: string;
};
normalCase: {
true: string;
false: string;
};
active: {
true: {
base: string;
};
false: {
base: string;
};
};
}, {
base: string[];
baseLine: string;
label: string;
leadingIcon: string;
leadingAvatar: string;
leadingAvatarSize: string;
trailingIcon: string;
safeList: string;
}, undefined, {
buttonGroup: {
horizontal: string;
vertical: string;
};
noSplit: {
false: string;
};
color: {
default: string;
danger: string;
success: string;
warning: string;
primary: string;
secondary: string;
collab: string;
ai: string;
link: string;
};
depth: {
light: string;
normal: string;
dark: string;
};
size: {
xs: {
base: string;
baseLine: string;
leadingIcon: string;
leadingAvatarSize: string;
trailingIcon: string;
};
sm: {
base: string;
baseLine: string;
leadingIcon: string;
leadingAvatarSize: string;
trailingIcon: string;
};
md: {
base: string;
baseLine: string;
leadingIcon: string;
leadingAvatarSize: string;
trailingIcon: string;
};
lg: {
base: string;
baseLine: string;
leadingIcon: string;
leadingAvatarSize: string;
trailingIcon: string;
};
};
block: {
true: {
base: string;
baseLine: string;
trailingIcon: string;
};
};
rounded: {
true: string;
false: string;
};
leading: {
true: string;
};
useLabel: {
true: string;
false: string;
};
useDropdown: {
true: string;
};
useWait: {
true: string;
};
useClock: {
true: string;
};
loading: {
true: string;
};
normalCase: {
true: string;
false: string;
};
active: {
true: {
base: string;
};
false: {
base: string;
};
};
}, {
base: string[];
baseLine: string;
label: string;
leadingIcon: string;
leadingAvatar: string;
leadingAvatarSize: string;
trailingIcon: string;
safeList: string;
}, import("tailwind-variants").TVReturnType<{
buttonGroup: {
horizontal: string;
vertical: string;
};
noSplit: {
false: string;
};
color: {
default: string;
danger: string;
success: string;
warning: string;
primary: string;
secondary: string;
collab: string;
ai: string;
link: string;
};
depth: {
light: string;
normal: string;
dark: string;
};
size: {
xs: {
base: string;
baseLine: string;
leadingIcon: string;
leadingAvatarSize: string;
trailingIcon: string;
};
sm: {
base: string;
baseLine: string;
leadingIcon: string;
leadingAvatarSize: string;
trailingIcon: string;
};
md: {
base: string;
baseLine: string;
leadingIcon: string;
leadingAvatarSize: string;
trailingIcon: string;
};
lg: {
base: string;
baseLine: string;
leadingIcon: string;
leadingAvatarSize: string;
trailingIcon: string;
};
};
block: {
true: {
base: string;
baseLine: string;
trailingIcon: string;
};
};
rounded: {
true: string;
false: string;
};
leading: {
true: string;
};
useLabel: {
true: string;
false: string;
};
useDropdown: {
true: string;
};
useWait: {
true: string;
};
useClock: {
true: string;
};
loading: {
true: string;
};
normalCase: {
true: string;
false: string;
};
active: {
true: {
base: string;
};
false: {
base: string;
};
};
}, {
base: string[];
baseLine: string;
label: string;
leadingIcon: string;
leadingAvatar: string;
leadingAvatarSize: string;
trailingIcon: string;
safeList: string;
}, undefined, {
buttonGroup: {
horizontal: string;
vertical: string;
};
noSplit: {
false: string;
};
color: {
default: string;
danger: string;
success: string;
warning: string;
primary: string;
secondary: string;
collab: string;
ai: string;
link: string;
};
depth: {
light: string;
normal: string;
dark: string;
};
size: {
xs: {
base: string;
baseLine: string;
leadingIcon: string;
leadingAvatarSize: string;
trailingIcon: string;
};
sm: {
base: string;
baseLine: string;
leadingIcon: string;
leadingAvatarSize: string;
trailingIcon: string;
};
md: {
base: string;
baseLine: string;
leadingIcon: string;
leadingAvatarSize: string;
trailingIcon: string;
};
lg: {
base: string;
baseLine: string;
leadingIcon: string;
leadingAvatarSize: string;
trailingIcon: string;
};
};
block: {
true: {
base: string;
baseLine: string;
trailingIcon: string;
};
};
rounded: {
true: string;
false: string;
};
leading: {
true: string;
};
useLabel: {
true: string;
false: string;
};
useDropdown: {
true: string;
};
useWait: {
true: string;
};
useClock: {
true: string;
};
loading: {
true: string;
};
normalCase: {
true: string;
false: string;
};
active: {
true: {
base: string;
};
false: {
base: string;
};
};
}, {
base: string[];
baseLine: string;
label: string;
leadingIcon: string;
leadingAvatar: string;
leadingAvatarSize: string;
trailingIcon: string;
safeList: string;
}, import("tailwind-variants").TVReturnType<{
buttonGroup: {
horizontal: string;
vertical: string;
};
noSplit: {
false: string;
};
color: {
default: string;
danger: string;
success: string;
warning: string;
primary: string;
secondary: string;
collab: string;
ai: string;
link: string;
};
depth: {
light: string;
normal: string;
dark: string;
};
size: {
xs: {
base: string;
baseLine: string;
leadingIcon: string;
leadingAvatarSize: string;
trailingIcon: string;
};
sm: {
base: string;
baseLine: string;
leadingIcon: string;
leadingAvatarSize: string;
trailingIcon: string;
};
md: {
base: string;
baseLine: string;
leadingIcon: string;
leadingAvatarSize: string;
trailingIcon: string;
};
lg: {
base: string;
baseLine: string;
leadingIcon: string;
leadingAvatarSize: string;
trailingIcon: string;
};
};
block: {
true: {
base: string;
baseLine: string;
trailingIcon: string;
};
};
rounded: {
true: string;
false: string;
};
leading: {
true: string;
};
useLabel: {
true: string;
false: string;
};
useDropdown: {
true: string;
};
useWait: {
true: string;
};
useClock: {
true: string;
};
loading: {
true: string;
};
normalCase: {
true: string;
false: string;
};
active: {
true: {
base: string;
};
false: {
base: string;
};
};
}, {
base: string[];
baseLine: string;
label: string;
leadingIcon: string;
leadingAvatar: string;
leadingAvatarSize: string;
trailingIcon: string;
safeList: string;
}, undefined, unknown, unknown, undefined>>>;
type ButtonVariants = VariantProps<typeof button>;
export interface ButtonProps extends Omit<UseComponentIconsProps, 'trailing' | 'trailingIcon'>, Omit<LinkProps, 'raw' | 'custom'> {
label?: string;
/**
* @defaultValue 'default'
*/
color?: ButtonVariants['color'];
activeColor?: ButtonVariants['color'];
/**
* @defaultValue 'normal'
*/
depth?: ButtonVariants['depth'];
activeDepth?: ButtonVariants['depth'];
/**
* @defaultValue 'md'
*/
size?: ButtonVariants['size'];
/**
* Rounds the corners of the button
* @defaultValue false
*/
rounded?: boolean;
/**
* Render the button full width
* @defaultValue false
*/
block?: boolean;
/**
* Set loading state automatically based on the `@click` promise state
* @defaultValue false
*/
loadingAuto?: boolean;
/**
* Disable uppercase label
* @defaultValue false
*/
normalCase?: boolean;
/**
* Shows LoaderWaitIcon in loading mode
* @defaultValue false
*/
useWait?: boolean;
/**
* Shows LoaderClockIcon icon in loading mode
* @defaultValue false
*/
useClock?: boolean;
/**
* Shows icons.chevronDown on the right side
* @defaultValue false
*/
useDropdown?: boolean;
onClick?: ((event: MouseEvent) => void | Promise<void>) | Array<((event: MouseEvent) => void | Promise<void>)>;
class?: any;
/**
* The class to apply when the link is active
* @defaultValue ''
*/
activeClass?: string;
/**
* The class to apply when the link is inactive
* @defaultValue ''
*/
inactiveClass?: string;
b24ui?: PartialString<typeof button.slots>;
}
export interface ButtonSlots {
leading(props?: {}): any;
default(props?: {}): any;
trailing(props?: {}): any;
}
declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<ButtonProps>, {
type: string;
active: undefined;
activeClass: string;
inactiveClass: string;
}>>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<ButtonProps>, {
type: string;
active: undefined;
activeClass: string;
inactiveClass: string;
}>>> & Readonly<{}>, {
type: "reset" | "submit" | "button";
activeClass: string;
active: boolean;
inactiveClass: string;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, Readonly<ButtonSlots> & ButtonSlots>;
export default _default;
type __VLS_WithDefaults<P, D> = {
[K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_PrettifyLocal<P[K] & {
default: D[K];
}> : P[K];
};
type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
type __VLS_TypePropsToOption<T> = {
[K in keyof T]-?: {} extends Pick<T, K> ? {
type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
} : {
type: import('vue').PropType<T[K]>;
required: true;
};
};
type __VLS_WithTemplateSlots<T, S> = T & {
new (): {
$slots: S;
};
};
type __VLS_PrettifyLocal<T> = {
[K in keyof T]: T[K];
} & {};