@dcodegroup-au/dsg-vue
Version:
Front-end Vue/Tailwind DSG for UntitledUI.
73 lines (72 loc) • 3.07 kB
TypeScript
import { Placement as FloatingVuePlacement, TriggerEvent as FloatingVueTriggerEvent } from 'floating-vue';
/**
* ------------------------------------------------
* # Setup: Props
* ------------------------------------------------
*/
export type DsgTooltipTrigger = FloatingVueTriggerEvent;
export type DsgTooltipPosition = FloatingVuePlacement;
export type DsgTooltipTheme = "light" | "dark";
export interface DsgTooltipProps {
label?: string;
supportingText?: string;
supportingTextHtml?: boolean;
width?: string;
maxWidth?: string;
titleClass?: string;
supportingTextClass?: string;
position?: DsgTooltipPosition;
triggers?: DsgTooltipTrigger[];
autoHide?: boolean;
preventsDefault?: boolean;
/**
* Optional icon name to display inside the tooltip trigger alongside any
* slotted content. When provided the icon is rendered after the slot content
* using `DsgIcon`. When omitted the default `help-circle` icon is shown only
* if no `dsg-tooltip--trigger` slot content is provided.
*/
icon?: string;
showTriggers?: DsgTooltipTrigger[];
hideTriggers?: DsgTooltipTrigger[];
popperTriggers?: string[];
distance?: number;
skidding?: number;
arrowPadding?: number;
theme?: DsgTooltipTheme;
boundary?: HTMLElement | null | undefined;
container?: HTMLElement | null | undefined;
strategy?: "fixed" | "absolute";
}
declare function __VLS_template(): {
attrs: Partial<{}>;
slots: {
'dsg-tooltip--trigger'?(_: {}): any;
'dsg-tooltip--title'?(_: {}): any;
'dsg-tooltip--text'?(_: {}): any;
};
refs: {
tooltipTrigger: HTMLSpanElement;
};
rootEl: any;
};
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
declare const __VLS_component: import('vue').DefineComponent<DsgTooltipProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
"on-click": (triggerElement: HTMLElement | HTMLSpanElement | null) => void;
"on-hover": (triggerElement: HTMLElement | HTMLSpanElement | null) => void;
"on-focus": (triggerElement: HTMLElement | HTMLSpanElement | null) => void;
"on-touch": (triggerElement: HTMLElement | HTMLSpanElement | null) => void;
}, string, import('vue').PublicProps, Readonly<DsgTooltipProps> & Readonly<{
"onOn-click"?: ((triggerElement: HTMLElement | HTMLSpanElement | null) => any) | undefined;
"onOn-hover"?: ((triggerElement: HTMLElement | HTMLSpanElement | null) => any) | undefined;
"onOn-focus"?: ((triggerElement: HTMLElement | HTMLSpanElement | null) => any) | undefined;
"onOn-touch"?: ((triggerElement: HTMLElement | HTMLSpanElement | null) => any) | undefined;
}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
tooltipTrigger: HTMLSpanElement;
}, any>;
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
export default _default;
type __VLS_WithTemplateSlots<T, S> = T & {
new (): {
$slots: S;
};
};