@ownclouders/design-system
Version:
ownCloud Design System is based on VueDesign Systems and is used to design ownCloud UI components
263 lines (262 loc) • 7.77 kB
TypeScript
import { PropType } from 'vue';
import { RouteLocationRaw } from 'vue-router';
declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
/**
* The html element used for the button.
* `button, a, router-link`
*/
type: {
type: StringConstructor;
default: string;
validator: (value: any) => boolean;
};
/**
* Disable the button
*/
disabled: {
type: BooleanConstructor;
default: boolean;
};
/**
* The size of the button. Defaults to medium.
* `small, medium, large`
*/
size: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
/**
* When setting the button’s type to a link, use this option to give a href.
*/
href: {
type: StringConstructor;
default: any;
};
/**
* When setting the button’s type to a link, use this option to give a give a target.
* `_blank, _self, _parent, _top`
*/
target: {
type: StringConstructor;
default: any;
validator: (value: string) => boolean;
};
/**
* When setting the button’s type to a router-link, use this option to give a to.
*/
to: {
type: PropType<RouteLocationRaw>;
default: any;
};
/**
* The aria-label of the button. Only use this property if you want to overwrite the accessible content of the
* oc-button. Usually this is not needed.
*/
ariaLabel: {
type: StringConstructor;
default: any;
};
/**
* Set the button’s type ("submit", "button" or "reset").
*/
submit: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
/**
* Style variation to give additional meaning.
* Defaults to `primary`.
* Can be `passive, primary, danger, success, warning, brand`.
*/
variation: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
/**
* Style variation to give additional meaning.
* Defaults to `outline`.
* Can be `outline, filled, raw, raw-inverse` with following characteristics:
* - outline: transparent button with text- and border-color according to variation default-color
* - filled: button filled in variation default-color, text in variation contrast-color
* - raw: text-only button with text in variation default-color
* - raw-inverse: text-only button with text in variation contrast-color
*/
appearance: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
/**
* How to justify content within the button. Defaults to center.
* `left, center, right, space-around, space-between, space-evenly`
*/
justifyContent: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
/**
* Distance between children of the button. Defaults to medium. Might be overruled by justify-content value.
* @values none, xsmall, small, medium, large, xlarge
*/
gapSize: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
/**
* Show loading spinner
*/
showSpinner: {
type: BooleanConstructor;
default: boolean;
};
}>, {}, {}, {
$_ocButton_buttonClass(): string[];
additionalAttributes(): {
disabled: boolean;
type: string;
to: RouteLocationRaw;
target: string;
href: string;
};
handlers(): {
click: (event: MouseEvent) => void;
};
}, {
$_ocButton_onClick(event: MouseEvent): void;
}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "click"[], "click", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
/**
* The html element used for the button.
* `button, a, router-link`
*/
type: {
type: StringConstructor;
default: string;
validator: (value: any) => boolean;
};
/**
* Disable the button
*/
disabled: {
type: BooleanConstructor;
default: boolean;
};
/**
* The size of the button. Defaults to medium.
* `small, medium, large`
*/
size: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
/**
* When setting the button’s type to a link, use this option to give a href.
*/
href: {
type: StringConstructor;
default: any;
};
/**
* When setting the button’s type to a link, use this option to give a give a target.
* `_blank, _self, _parent, _top`
*/
target: {
type: StringConstructor;
default: any;
validator: (value: string) => boolean;
};
/**
* When setting the button’s type to a router-link, use this option to give a to.
*/
to: {
type: PropType<RouteLocationRaw>;
default: any;
};
/**
* The aria-label of the button. Only use this property if you want to overwrite the accessible content of the
* oc-button. Usually this is not needed.
*/
ariaLabel: {
type: StringConstructor;
default: any;
};
/**
* Set the button’s type ("submit", "button" or "reset").
*/
submit: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
/**
* Style variation to give additional meaning.
* Defaults to `primary`.
* Can be `passive, primary, danger, success, warning, brand`.
*/
variation: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
/**
* Style variation to give additional meaning.
* Defaults to `outline`.
* Can be `outline, filled, raw, raw-inverse` with following characteristics:
* - outline: transparent button with text- and border-color according to variation default-color
* - filled: button filled in variation default-color, text in variation contrast-color
* - raw: text-only button with text in variation default-color
* - raw-inverse: text-only button with text in variation contrast-color
*/
appearance: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
/**
* How to justify content within the button. Defaults to center.
* `left, center, right, space-around, space-between, space-evenly`
*/
justifyContent: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
/**
* Distance between children of the button. Defaults to medium. Might be overruled by justify-content value.
* @values none, xsmall, small, medium, large, xlarge
*/
gapSize: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
/**
* Show loading spinner
*/
showSpinner: {
type: BooleanConstructor;
default: boolean;
};
}>> & Readonly<{
onClick?: (...args: any[]) => any;
}>, {
type: string;
size: string;
variation: string;
target: string;
disabled: boolean;
href: string;
to: RouteLocationRaw;
ariaLabel: string;
submit: string;
appearance: string;
justifyContent: string;
gapSize: string;
showSpinner: boolean;
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
export default _default;