@ownclouders/design-system
Version:
ownCloud Design System is based on VueDesign Systems and is used to design ownCloud UI components
616 lines (615 loc) • 19.5 kB
TypeScript
import { PropType } from 'vue';
import { ContextualHelperDataListItem } from '../../helpers';
declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
/**
* Id of the element
*/
dropId: {
type: StringConstructor;
required: false;
default: () => string;
};
/**
* CSS selector for the element to be used as toggle. By default, the preceding element is used
**/
toggle: {
type: StringConstructor;
required: false;
default: string;
};
/**
* Events that cause the drop to show. Multiple event names are separated by spaces
*
* @values click, hover, manual
**/
mode: {
type: StringConstructor;
required: false;
default: string;
validator: (value: string) => boolean;
};
/**
* Element selector used as a target of the element
*/
target: {
type: StringConstructor;
required: false;
default: any;
};
/**
* Title
*/
title: {
type: StringConstructor;
required: true;
};
/**
* Text at the beginning
*/
text: {
type: StringConstructor;
required: false;
default: string;
};
/**
* List element
*/
list: {
type: PropType<ContextualHelperDataListItem[]>;
required: false;
default: () => ContextualHelperDataListItem[];
};
/**
* Text at the end
*/
endText: {
type: StringConstructor;
required: false;
default: string;
};
/**
* Read more link at the end
*/
readMoreLink: {
type: StringConstructor;
required: false;
default: string;
};
}>, {
dropOpen: import('vue').Ref<boolean, boolean>;
listItems: import('vue').ComputedRef<ContextualHelperDataListItem[]>;
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
/**
* Id of the element
*/
dropId: {
type: StringConstructor;
required: false;
default: () => string;
};
/**
* CSS selector for the element to be used as toggle. By default, the preceding element is used
**/
toggle: {
type: StringConstructor;
required: false;
default: string;
};
/**
* Events that cause the drop to show. Multiple event names are separated by spaces
*
* @values click, hover, manual
**/
mode: {
type: StringConstructor;
required: false;
default: string;
validator: (value: string) => boolean;
};
/**
* Element selector used as a target of the element
*/
target: {
type: StringConstructor;
required: false;
default: any;
};
/**
* Title
*/
title: {
type: StringConstructor;
required: true;
};
/**
* Text at the beginning
*/
text: {
type: StringConstructor;
required: false;
default: string;
};
/**
* List element
*/
list: {
type: PropType<ContextualHelperDataListItem[]>;
required: false;
default: () => ContextualHelperDataListItem[];
};
/**
* Text at the end
*/
endText: {
type: StringConstructor;
required: false;
default: string;
};
/**
* Read more link at the end
*/
readMoreLink: {
type: StringConstructor;
required: false;
default: string;
};
}>> & Readonly<{}>, {
text: string;
target: string;
toggle: string;
dropId: string;
mode: string;
list: ContextualHelperDataListItem[];
endText: string;
readMoreLink: string;
}, {}, {
OcButton: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
type: {
type: StringConstructor;
default: string;
validator: (value: any) => boolean;
};
disabled: {
type: BooleanConstructor;
default: boolean;
};
size: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
href: {
type: StringConstructor;
default: any;
};
target: {
type: StringConstructor;
default: any;
validator: (value: string) => boolean;
};
to: {
type: PropType<import('vue-router').RouteLocationRaw>;
default: any;
};
ariaLabel: {
type: StringConstructor;
default: any;
};
submit: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
variation: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
appearance: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
justifyContent: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
gapSize: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
showSpinner: {
type: BooleanConstructor;
default: boolean;
};
}>, {}, {}, {
$_ocButton_buttonClass(): string[];
additionalAttributes(): {
disabled: boolean;
type: string;
to: import('vue-router').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<{
type: {
type: StringConstructor;
default: string;
validator: (value: any) => boolean;
};
disabled: {
type: BooleanConstructor;
default: boolean;
};
size: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
href: {
type: StringConstructor;
default: any;
};
target: {
type: StringConstructor;
default: any;
validator: (value: string) => boolean;
};
to: {
type: PropType<import('vue-router').RouteLocationRaw>;
default: any;
};
ariaLabel: {
type: StringConstructor;
default: any;
};
submit: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
variation: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
appearance: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
justifyContent: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
gapSize: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
showSpinner: {
type: BooleanConstructor;
default: boolean;
};
}>> & Readonly<{
onClick?: (...args: any[]) => any;
}>, {
type: string;
size: string;
variation: string;
target: string;
disabled: boolean;
href: string;
to: import('vue-router').RouteLocationRaw;
ariaLabel: string;
submit: string;
appearance: string;
justifyContent: string;
gapSize: string;
showSpinner: boolean;
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
OcIcon: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
name: {
type: StringConstructor;
default: string;
};
fillType: {
type: StringConstructor;
required: false;
default: string;
validator: (value: string) => boolean;
};
accessibleLabel: {
type: StringConstructor;
default: string;
};
type: {
type: StringConstructor;
default: string;
};
size: {
type: StringConstructor;
default: string;
validator: (value: unknown) => boolean;
};
variation: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
color: {
type: StringConstructor;
required: false;
default: string;
};
}>, {}, {}, {
svgTitleId(): string;
nameWithFillType(): string;
}, {
sizeClass(c: string): string;
variationClass(c: string): string;
prefix(string: string): string;
transformSvgElement(svg: SVGElement): SVGElement;
}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "loaded"[], "loaded", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
name: {
type: StringConstructor;
default: string;
};
fillType: {
type: StringConstructor;
required: false;
default: string;
validator: (value: string) => boolean;
};
accessibleLabel: {
type: StringConstructor;
default: string;
};
type: {
type: StringConstructor;
default: string;
};
size: {
type: StringConstructor;
default: string;
validator: (value: unknown) => boolean;
};
variation: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
color: {
type: StringConstructor;
required: false;
default: string;
};
}>> & Readonly<{
onLoaded?: (...args: any[]) => any;
}>, {
name: string;
type: string;
fillType: string;
accessibleLabel: string;
size: string;
variation: string;
color: string;
}, {}, {
InlineSvg: import('vue').DefineComponent<import('vue-inline-svg').InlineSvgProps, unknown, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, Record<string, any>, string, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, import('vue-inline-svg').InlineSvgProps>;
}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
OcDrop: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
dropId: {
type: StringConstructor;
required: false;
default: () => string;
};
popperOptions: {
type: ObjectConstructor;
required: false;
default: () => {};
};
toggle: {
type: StringConstructor;
default: string;
};
position: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
mode: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
closeOnClick: {
type: BooleanConstructor;
required: false;
};
isNested: {
type: BooleanConstructor;
required: false;
};
target: {
type: StringConstructor;
required: false;
default: any;
};
paddingSize: {
type: StringConstructor;
required: false;
default: string;
validator: (value: unknown) => boolean;
};
offset: {
type: StringConstructor;
required: false;
default: any;
};
}>, {
drop: Readonly<import('vue').ShallowRef<HTMLElement>>;
tippy: import('vue').Ref<any, any>;
show: (duration?: number) => void;
hide: (duration?: number) => void;
onClick: () => void;
}, {}, {
triggerMapping(): string;
paddingClass(): string;
}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("hideDrop" | "showDrop")[], "hideDrop" | "showDrop", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
dropId: {
type: StringConstructor;
required: false;
default: () => string;
};
popperOptions: {
type: ObjectConstructor;
required: false;
default: () => {};
};
toggle: {
type: StringConstructor;
default: string;
};
position: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
mode: {
type: StringConstructor;
default: string;
validator: (value: string) => boolean;
};
closeOnClick: {
type: BooleanConstructor;
required: false;
};
isNested: {
type: BooleanConstructor;
required: false;
};
target: {
type: StringConstructor;
required: false;
default: any;
};
paddingSize: {
type: StringConstructor;
required: false;
default: string;
validator: (value: unknown) => boolean;
};
offset: {
type: StringConstructor;
required: false;
default: any;
};
}>> & Readonly<{
onHideDrop?: (...args: any[]) => any;
onShowDrop?: (...args: any[]) => any;
}>, {
target: string;
offset: string;
popperOptions: Record<string, any>;
toggle: string;
dropId: string;
position: string;
mode: string;
closeOnClick: boolean;
isNested: boolean;
paddingSize: string;
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
FocusTrap: import('vue').DefineComponent<{
active: {
type: BooleanConstructor;
default: boolean;
};
} & {
escapeDeactivates: {
type: BooleanConstructor;
default: true;
};
returnFocusOnDeactivate: {
type: BooleanConstructor;
default: true;
};
allowOutsideClick: {
type: PropType<boolean | import('focus-trap').MouseEventToBoolean | undefined>;
default: true;
};
clickOutsideDeactivates: PropType<boolean | import('focus-trap').MouseEventToBoolean | undefined>;
initialFocus: PropType<import('focus-trap').FocusTargetOrFalse | (() => void) | undefined>;
fallbackFocus: PropType<import('focus-trap').FocusTarget | undefined>;
checkCanFocusTrap: PropType<((containers: (HTMLElement | SVGElement)[]) => Promise<void>) | undefined>;
checkCanReturnFocus: PropType<((trigger: HTMLElement | SVGElement) => Promise<void>) | undefined>;
delayInitialFocus: {
type: BooleanConstructor;
default: true;
};
document: PropType<Document | undefined>;
preventScroll: BooleanConstructor;
setReturnFocus: PropType<import('focus-trap').FocusTargetValueOrFalse | ((nodeFocusedBeforeActivation: HTMLElement | SVGElement) => import('focus-trap').FocusTargetValueOrFalse) | undefined>;
tabbableOptions: PropType<import('focus-trap').FocusTrapTabbableOptions | undefined>;
}, {
activate(): void;
deactivate(): void;
renderImpl(): import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
[key: string]: any;
}> | import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
[key: string]: any;
}>[] | null;
}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("update:active" | "activate" | "postActivate" | "deactivate" | "postDeactivate")[], "update:active" | "activate" | "postActivate" | "deactivate" | "postDeactivate", import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, Readonly<import('vue').ExtractPropTypes<{
active: {
type: BooleanConstructor;
default: boolean;
};
} & {
escapeDeactivates: {
type: BooleanConstructor;
default: true;
};
returnFocusOnDeactivate: {
type: BooleanConstructor;
default: true;
};
allowOutsideClick: {
type: PropType<boolean | import('focus-trap').MouseEventToBoolean | undefined>;
default: true;
};
clickOutsideDeactivates: PropType<boolean | import('focus-trap').MouseEventToBoolean | undefined>;
initialFocus: PropType<import('focus-trap').FocusTargetOrFalse | (() => void) | undefined>;
fallbackFocus: PropType<import('focus-trap').FocusTarget | undefined>;
checkCanFocusTrap: PropType<((containers: (HTMLElement | SVGElement)[]) => Promise<void>) | undefined>;
checkCanReturnFocus: PropType<((trigger: HTMLElement | SVGElement) => Promise<void>) | undefined>;
delayInitialFocus: {
type: BooleanConstructor;
default: true;
};
document: PropType<Document | undefined>;
preventScroll: BooleanConstructor;
setReturnFocus: PropType<import('focus-trap').FocusTargetValueOrFalse | ((nodeFocusedBeforeActivation: HTMLElement | SVGElement) => import('focus-trap').FocusTargetValueOrFalse) | undefined>;
tabbableOptions: PropType<import('focus-trap').FocusTrapTabbableOptions | undefined>;
}>> & {
onActivate?: ((...args: any[]) => any) | undefined;
onPostActivate?: ((...args: any[]) => any) | undefined;
onDeactivate?: ((...args: any[]) => any) | undefined;
onPostDeactivate?: ((...args: any[]) => any) | undefined;
"onUpdate:active"?: ((...args: any[]) => any) | undefined;
}, {
returnFocusOnDeactivate: boolean;
escapeDeactivates: boolean;
allowOutsideClick: boolean | import('focus-trap').MouseEventToBoolean | undefined;
preventScroll: boolean;
delayInitialFocus: boolean;
active: boolean;
}, {}>;
}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
export default _default;