construct-ui
Version:
A Mithril.js UI library
1,677 lines (1,675 loc) • 50.3 kB
TypeScript
// Generated by dts-bundle-generator v6.13.0
import m from 'mithril';
import PopperJS from 'popper.js';
import { Boundary } from 'popper.js';
export declare const Align: {
LEFT: "left";
CENTER: "center";
RIGHT: "right";
};
export declare type Align = typeof Align[keyof typeof Align];
export declare type IconName = (typeof Icons)[keyof typeof Icons];
export interface IIconAttrs extends IAttrs, ISizeAttrs, IIntentAttrs {
/** Icon name */
name: IconName;
/** Callback invoked on click; Passing this attr will apply hover styles to the icon */
onclick?: (e: Event) => void;
[htmlAttrs: string]: any;
}
export declare class Icon implements m.Component<IIconAttrs> {
view({ attrs }: m.Vnode<IIconAttrs>): m.Vnode<any, any>;
}
export declare type Style = string | Partial<CSSStyleDeclaration>;
export interface IAttrs {
/** Space delimited class list */
class?: string;
/** Inline styles */
style?: Style;
}
export interface IIntentAttrs {
/** Component color intent */
intent?: Intent;
}
export interface ISizeAttrs {
/** Component size */
size?: Size;
}
export interface IActionItemAttrs {
/** Toggles active state */
active?: boolean;
/** Disables interaction */
disabled?: boolean;
/** Inner text or children */
label?: m.Children;
/** Left-justified icon */
iconLeft?: IconName;
/** Attrs passed though to left-justified icon */
iconLeftAttrs?: Partial<IIconAttrs>;
/** Right-justified icon */
iconRight?: IconName;
/** Attrs passed though to right-justified icon */
iconRightAttrs?: Partial<IIconAttrs>;
/** Callback invoked on click */
onclick?: (e: Event) => void;
}
export interface IOption {
/** Disables interaction */
disabled?: boolean;
/** Inner text */
label?: string | number;
/** Value of option */
value?: string | number;
}
export declare type Option = IOption | string | number;
export declare const Classes: {
XS: string;
SM: string;
LG: string;
XL: string;
PRIMARY: string;
NEGATIVE: string;
POSITIVE: string;
WARNING: string;
ACTIVE: string;
DISABLED: string;
LOADING: string;
BASIC: string;
OUTLINED: string;
ROUNDED: string;
READONLY: string;
SELECTED: string;
INTERACTIVE: string;
ELEVATION: string;
HIDDEN: string;
H1: string;
H2: string;
H3: string;
H4: string;
H5: string;
H6: string;
ALIGN: string;
ALIGN_RIGHT: string;
ALIGN_LEFT: string;
FLUID: string;
TEXT_MUTED: string;
TEXT_DISABLED: string;
FOCUS_DISABLED: string;
COMPACT: string;
BREADCRUMB: string;
BREADCRUMB_ITEM: string;
BREADCRUMB_SEPERATOR: string;
BUTTON: string;
BUTTON_LABEL: string;
BUTTON_SUBLABEL: string;
BUTTON_GROUP: string;
BUTTON_ICON: string;
CARD: string;
CARD_INTERACTIVE: string;
CALLOUT: string;
CALLOUT_HEADER: string;
CALLOUT_CONTENT: string;
CALLOUT_ICON: string;
CALLOUT_DISMISS_ICON: string;
CHECKBOX: string;
COLLAPSE: string;
COLLAPSE_BODY: string;
CONTEXT_MENU: string;
CONTROL: string;
CONTROL_INDICATOR: string;
CONTROL_GROUP: string;
CUSTOM_SELECT: string;
CUSTOM_SELECT_TRIGGER: string;
CUSTOM_SELECT_INPUT: string;
CUSTOM_SELECT_HIDDEN: string;
DIALOG: string;
DIALOG_CLOSE_BUTTON: string;
DIALOG_CONTENT: string;
DIALOG_HEADER: string;
DIALOG_BODY: string;
DIALOG_FOOTER: string;
DRAWER: string;
DRAWER_CONTENT: string;
EMPTY_STATE: string;
EMPTY_STATE_ICON: string;
EMPTY_STATE_CONTENT: string;
EMPTY_STATE_HEADER: string;
EMPTY_STATE_FILL: string;
FORM: string;
FORM_GROUP: string;
FORM_LABEL: string;
GRID: string;
COL: string;
INPUT_FILE: string;
INPUT_FILE_CONTENT: string;
INPUT_FILE_TEXT: string;
INPUT_FILE_BUTTON: string;
ICON: string;
ICON_ACTION: string;
INPUT: string;
INPUT_GROUP: string;
INPUT_POPOVER: string;
INPUT_POPOVER_CONTENT: string;
INPUT_SELECT: string;
LIST: string;
LIST_ITEM: string;
LIST_ITEM_LABEL: string;
LIST_ITEM_CONTENT_LEFT: string;
LIST_ITEM_CONTENT_RIGHT: string;
MENU: string;
MENU_ITEM: string;
MENU_DIVIDER: string;
MENU_HEADING: string;
OVERLAY: string;
OVERLAY_CONTENT: string;
OVERLAY_BACKDROP: string;
OVERLAY_OPEN: string;
OVERLAY_INLINE: string;
OVERLAY_SCROLL_CONTAINER: string;
POPOVER: string;
POPOVER_OPEN: string;
POPOVER_CONTENT: string;
POPOVER_ARROW: string;
POPOVER_TRIGGER_ACTIVE: string;
POPOVER_BACKDROP: string;
POPOVER_DISSMISS: string;
POPOVER_MENU: string;
PORTAL: string;
QUERY_LIST: string;
QUERY_LIST_CHECKMARK: string;
QUERY_LIST_EMPTY: string;
QUERY_LIST_INITIAL: string;
QUERY_LIST_MESSAGE: string;
RADIO: string;
RADIO_GROUP: string;
SELECT: string;
SELECT_ARROW: string;
SELECT_LIST: string;
SPINNER: string;
SPINNER_CONTENT: string;
SPINNER_ICON: string;
SPINNER_MESSAGE: string;
SPINNER_FILL: string;
SPINNER_ACTIVE: string;
SPINNER_BG: string;
SWITCH: string;
TABLE: string;
TABLE_BORDERED: string;
TABLE_STRIPED: string;
TABLE_INTERACTIVE: string;
TAG: string;
TAG_REMOVABLE: string;
TAG_INPUT: string;
TAG_INPUT_VALUES: string;
TABS: string;
TABS_BORDERED: string;
TABS_ITEM: string;
TEXT_AREA: string;
TOAST: string;
TOAST_MESSAGE: string;
TOASTER: string;
TOASTER_INLINE: string;
TOOLTIP: string;
TREE: string;
TREE_NODE: string;
TREE_NODE_LIST: string;
TREE_NODE_CONTENT: string;
TREE_NODE_CARET: string;
TREE_NODE_CARET_OPEN: string;
TREE_NODE_CARET_CLOSED: string;
TREE_NODE_CARET_NONE: string;
TREE_NODE_SELECTED: string;
TREE_NODE_EXPANDED: string;
TREE_NODE_LABEL: string;
TREE_NODE_CONTENT_RIGHT: string;
TREE_NODE_CONTENT_LEFT: string;
};
export declare const Colors: {
WHITE: string;
GREY50: string;
GREY100: string;
GREY200: string;
GREY300: string;
GREY400: string;
GREY500: string;
GREY600: string;
GREY700: string;
GREY800: string;
GREY900: string;
BLUE_GREY50: string;
BLUE_GREY100: string;
BLUE_GREY200: string;
BLUE_GREY300: string;
BLUE_GREY400: string;
BLUE_GREY500: string;
BLUE_GREY600: string;
BLUE_GREY700: string;
BLUE_GREY800: string;
BLUE_GREY900: string;
RED50: string;
RED100: string;
RED200: string;
RED300: string;
RED400: string;
RED500: string;
RED600: string;
RED700: string;
RED800: string;
RED900: string;
PURPLE50: string;
PURPLE100: string;
PURPLE200: string;
PURPLE300: string;
PURPLE400: string;
PURPLE500: string;
PURPLE600: string;
PURPLE700: string;
PURPLE800: string;
PURPLE900: string;
DEEP_PURPLE50: string;
DEEP_PURPLE100: string;
DEEP_PURPLE200: string;
DEEP_PURPLE300: string;
DEEP_PURPLE400: string;
DEEP_PURPLE500: string;
DEEP_PURPLE600: string;
DEEP_PURPLE700: string;
DEEP_PURPLE800: string;
DEEP_PURPLE900: string;
INDIGO50: string;
INDIGO100: string;
INDIGO200: string;
INDIGO300: string;
INDIGO400: string;
INDIGO500: string;
INDIGO600: string;
INDIGO700: string;
INDIGO800: string;
INDIGO900: string;
BLUE50: string;
BLUE100: string;
BLUE200: string;
BLUE300: string;
BLUE400: string;
BLUE500: string;
BLUE600: string;
BLUE700: string;
BLUE800: string;
BLUE900: string;
LIGHT_BLUE50: string;
LIGHT_BLUE100: string;
LIGHT_BLUE200: string;
LIGHT_BLUE300: string;
LIGHT_BLUE400: string;
LIGHT_BLUE500: string;
LIGHT_BLUE600: string;
LIGHT_BLUE700: string;
LIGHT_BLUE800: string;
LIGHT_BLUE900: string;
CYAN50: string;
CYAN100: string;
CYAN200: string;
CYAN300: string;
CYAN400: string;
CYAN500: string;
CYAN600: string;
CYAN700: string;
CYAN800: string;
CYAN900: string;
TEAL50: string;
TEAL100: string;
TEAL200: string;
TEAL300: string;
TEAL400: string;
TEAL500: string;
TEAL600: string;
TEAL700: string;
TEAL800: string;
TEAL900: string;
GREEN50: string;
GREEN100: string;
GREEN200: string;
GREEN300: string;
GREEN400: string;
GREEN500: string;
GREEN600: string;
GREEN700: string;
GREEN800: string;
GREEN900: string;
LIGHT_GREEN50: string;
LIGHT_GREEN100: string;
LIGHT_GREEN200: string;
LIGHT_GREEN300: string;
LIGHT_GREEN400: string;
LIGHT_GREEN500: string;
LIGHT_GREEN600: string;
LIGHT_GREEN700: string;
LIGHT_GREEN800: string;
LIGHT_GREEN900: string;
ORANGE50: string;
ORANGE100: string;
ORANGE200: string;
ORANGE300: string;
ORANGE400: string;
ORANGE500: string;
ORANGE600: string;
ORANGE700: string;
ORANGE800: string;
ORANGE900: string;
};
export declare const Intent: {
NONE: "none";
PRIMARY: "primary";
NEGATIVE: "negative";
POSITIVE: "positive";
WARNING: "warning";
};
export declare type Intent = typeof Intent[keyof typeof Intent];
export declare const Keys: {
TAB: number;
ENTER: number;
SHIFT: number;
ESCAPE: number;
SPACE: number;
ARROW_LEFT: number;
ARROW_UP: number;
ARROW_RIGHT: number;
ARROW_DOWN: number;
};
export declare type Keys = typeof Keys[keyof typeof Keys];
export declare const Breakpoints: {
xs: "(max-width: 575.98px)";
sm: "(min-width: 576px) and (max-width: 767.98px)";
md: "(min-width: 768px) and (max-width: 991.98px)";
lg: "(min-width: 992px) and (max-width: 1199.98px)";
xl: "(min-width: 1200px)";
};
export declare type Breakpoint = typeof Breakpoints[keyof typeof Breakpoints];
export declare const Size: {
XS: "xs";
SM: "sm";
DEFAULT: "default";
LG: "lg";
XL: "xl";
};
export declare type Size = typeof Size[keyof typeof Size];
export declare function isFunction(value: any): value is Function;
export declare function safeCall(func: any, ...args: any[]): any;
export declare function getClosest(el: any, selector: string): HTMLElement | null;
export declare function getScrollbarWidth(): number;
export declare function hasScrollbar(el: HTMLElement): boolean;
export declare function elementIsOrContains(element: HTMLElement, testElement: HTMLElement): boolean;
export declare function normalizeStyle(style?: Style): Object | undefined;
export declare function updateElementGroupPadding(containerEl: HTMLElement, contentLeft?: m.Vnode<any, any>, contentRight?: m.Vnode<any, any>): void;
export declare function isNullOrEmpty(item: any): boolean;
export interface IBreadcrumbAttrs extends IAttrs, ISizeAttrs {
/** Element to display in between breadcrumb items */
seperator?: m.Child;
[htmlAttrs: string]: any;
}
export declare class Breadcrumb implements m.Component<IBreadcrumbAttrs> {
view({ attrs, children }: m.Vnode<IBreadcrumbAttrs>): m.Vnode<any, any>;
private renderChildren;
}
export interface IBreadcrumbItemAttrs extends IAttrs {
[htmlAttrs: string]: any;
}
export declare class BreadcrumbItem implements m.Component<IBreadcrumbItemAttrs> {
view({ attrs, children }: m.Vnode<IBreadcrumbItemAttrs>): m.Vnode<any, any>;
}
export interface IButtonAttrs extends IAttrs, IActionItemAttrs, ISizeAttrs, IIntentAttrs {
/**
* Content alignment; Used to align left/right icon when fluid=true
* @default 'center'
*/
align?: Align;
/** Toggles basic styling (no borders/background) */
basic?: boolean;
/** Reduces horizontal padding */
compact?: boolean;
/** Sets anchor tag URL (anchor button only) */
href?: string;
/** Toggles loading animation */
loading?: boolean;
/** Toggles rounded styling */
rounded?: boolean;
/** Fills width of parent container */
fluid?: boolean;
/** Toggles outlined styling */
outlined?: boolean;
/** Sublabel */
sublabel?: m.Child;
[htmlAttrs: string]: any;
}
export declare class Button implements m.Component<IButtonAttrs> {
view({ attrs }: m.Vnode<IButtonAttrs>): m.Vnode<any, any>;
}
export interface IButtonGroupAttrs extends IAttrs, ISizeAttrs, IIntentAttrs {
/** Toggles basic styling on children (no borders/background) */
basic?: boolean;
/** Adds rounded styling (no borders/background) */
rounded?: boolean;
/** Toggles outline styling on children (no background) */
outlined?: boolean;
/** Fills width of parent container */
fluid?: boolean;
[htmlAttrs: string]: any;
}
export declare class ButtonGroup implements m.Component<IButtonGroupAttrs> {
view({ attrs, children }: m.Vnode<IButtonGroupAttrs>): m.Vnode<any, any>;
}
export interface ICardAttrs extends IAttrs, ISizeAttrs {
/** Degree of card shadow */
elevation?: number;
/** Fills width of parent container */
fluid?: boolean;
/** Adds interactive hover/active styling */
interactive?: boolean;
[htmlAttrs: string]: any;
}
export declare class Card implements m.Component<ICardAttrs> {
view({ attrs, children }: m.Vnode<ICardAttrs>): m.Vnode<any, any>;
}
export interface ICalloutAttrs extends IAttrs, ISizeAttrs, IIntentAttrs {
/** Inner text content */
content?: m.Children;
/**
* Callback invoked when "dismiss" icon is clicked;
* Omitting this property will hide the dismiss icon.
*/
onDismiss?: (e: Event) => void;
/** Header content */
header?: m.Children;
/** Left-justified icon */
icon?: IconName;
[htmlAttrs: string]: any;
}
export declare class Callout implements m.Component<ICalloutAttrs> {
view({ attrs }: m.Vnode<ICalloutAttrs>): m.Vnode<any, any>;
}
export interface IControlAttrs extends IAttrs, ISizeAttrs, IIntentAttrs {
/** Toggles checked state */
checked?: boolean;
/**
* Attrs passed through to container element
*/
containerAttrs?: any;
/** Initially sets control to checked state (uncontrolled mode) */
defaultChecked?: boolean;
/** Disables interaction */
disabled?: boolean;
/** Text label */
label?: m.Children;
/** Callback invoked on control change */
onchange?: (e: Event) => void;
/** Disables interaction but maintains styling */
readonly?: boolean;
type?: "checkbox" | "radio";
typeClass?: string;
[htmlAttrs: string]: any;
}
export interface ICheckboxAttrs extends IControlAttrs {
/** Initially sets control to indeterminate state (uncontrolled mode) */
defaultIndeterminate?: boolean;
/** Toggles indeterminate state */
indeterminate?: boolean;
}
export declare class Checkbox implements m.Component<ICheckboxAttrs> {
private input;
oncreate({ attrs, dom }: m.VnodeDOM<ICheckboxAttrs>): void;
onupdate({ attrs, dom }: m.VnodeDOM<ICheckboxAttrs>): void;
view({ attrs }: m.Vnode<ICheckboxAttrs>): m.Vnode<IControlAttrs, unknown>;
private updateIndeterminate;
}
export interface ICollapseAttrs extends IAttrs {
/** Toggles visibility */
isOpen?: boolean;
/**
* Duration of the slide-in/slide-out animation
* @default 300
*/
duration?: number;
}
export declare class Collapse implements m.Component<ICollapseAttrs> {
private height;
private duration;
private contentEl;
private containerStyles;
oninit({ attrs }: m.Vnode<ICollapseAttrs>): void;
onbeforeupdate(): void;
view({ attrs, children }: m.Vnode<ICollapseAttrs>): m.Vnode<import("mithril-transition-group/lib/Transition").ITransitionAttrs, unknown>;
private handleEnter;
private handleExit;
private getContentHeight;
}
export interface IControlGroupAttrs extends IAttrs {
[htmlAttrs: string]: any;
}
export declare class ControlGroup implements m.Component<IControlGroupAttrs> {
view({ attrs, children }: m.Vnode<IControlGroupAttrs>): m.Vnode<any, any>;
}
declare abstract class AbstractComponent<A> implements m.Component<A> {
protected timeoutStack: number[];
protected attrs: A;
protected prevAttrs: A;
abstract view(vnode: m.Vnode<A>): m.Children | null | void;
abstract getDefaultAttrs(): A;
oninit(vnode: m.Vnode<A>): void;
onbeforeupdate(vnode: m.Vnode<A>, prev: m.VnodeDOM<A>): void;
private setAttrs;
private getAttrs;
protected setTimeout: (callback: () => void, timeout?: number) => () => void;
protected clearTimeouts: () => void;
}
export interface ICustomSelectAttrs extends IAttrs, ISizeAttrs {
/** Initially selected value (uncontrolled mode) */
defaultValue?: string | number;
/**
* Array of list options
* @default []
*/
options: Option[];
/** Value of the selected option */
value?: string | number;
/** Callback invoked when selection changes */
onSelect?: (option: Option) => void;
/** Testing */
itemRender?: (item: Option, isSelected: boolean, index: number) => m.Vnode<any, any>;
/**
* Attrs passed through to trigger
* @default {}
*/
triggerAttrs?: IButtonAttrs;
/** Name attr of hidden input (useful for HTML forms) */
name?: string;
}
export declare class CustomSelect extends AbstractComponent<ICustomSelectAttrs> {
private activeIndex;
private selected?;
private isOpen;
getDefaultAttrs(): ICustomSelectAttrs;
oninit(vnode: m.Vnode<ICustomSelectAttrs>): void;
onbeforeupdate(vnode: m.Vnode<ICustomSelectAttrs>, old: m.VnodeDOM<ICustomSelectAttrs>): void;
view(): m.Vnode<any, any>;
private renderItem;
private handleSelect;
private handleActiveItemChange;
private handleTriggerKeyDown;
private handlePopoverInteraction;
private get selectedValue();
private get selectedLabel();
private setSelected;
}
export interface IPortalAttrs extends IAttrs {
/** Callback invoked when the component is mounted */
onContentMount?: (rootElement: HTMLElement) => void;
/** Optional HTML element to mount to */
container?: HTMLElement;
}
export declare class Portal implements m.Component<IPortalAttrs> {
private rootElement;
private content;
oncreate({ attrs, children }: m.Vnode<IPortalAttrs>): void;
onupdate({ attrs }: m.Vnode<IPortalAttrs>): void;
onbeforeupdate({ children }: m.Vnode<IPortalAttrs>): false | undefined;
onremove({ attrs }: m.Vnode<IPortalAttrs>): void;
view(): m.Vnode<any, any>;
private setStyles;
}
export interface IOverlayableAttrs {
/** Class added to backdrop element */
backdropClass?: string;
/**
* Whether component can be closed on outer click.
* Triggers the <code>onClose</code> attribute when <code>true</code>
*/
closeOnOutsideClick?: boolean;
/**
* Whether component can be closed on Escape key.
* Triggers the <code>onClose</code> attribute when <code>true</code>
* @default true
*/
closeOnEscapeKey?: boolean;
/** Whether to show backdrop element */
hasBackdrop?: boolean;
/** Renders component relative to parent container */
inline?: boolean;
/**
* Callback invoked on initial close
* Passes back event that triggered close
*/
onClose?: (e: Event) => void;
/** Callback invoked after transition is complete and component is unmounted */
onClosed?: () => void;
/**
* Callback invoked when component mounts and transition is complete
* Passes back DOM element container
*/
onOpened?: (contentEl: HTMLElement) => void;
/** Sets focus to first element that has a <code>autofocus</code> or <code>tabindex</code> attribute */
autofocus?: boolean;
/** Wether last active element should be focused on close */
restoreFocus?: boolean;
/**
* Wether overlay should be added to the "open" stack.
* When <code>true</code>, overlays will be stacked on top of one another
* and will close in sequence.
*/
addToStack?: boolean;
/** Attrs passed through to the Portal component */
portalAttrs?: IPortalAttrs;
/**
* Name of transition. The name is used to apply CSS transition classes on open and close.
* On open, ${name}-enter and ${name}-enter-active are added. On close, ${name}-exit
* and ${name}-exit-active are added.
* @default 'fade'
*/
transitionName?: string;
/**
* Duration of the animation. Note: the CSS transition duration must match the
* custom duration passed to this component
* @default 200
*/
transitionDuration?: number;
}
export interface IOverlayAttrs extends IOverlayableAttrs, IAttrs {
/** Inner content */
content?: m.Children;
/** Toggles overlay visibility */
isOpen?: boolean;
}
export declare class Overlay extends AbstractComponent<IOverlayAttrs> {
private id;
private shouldRender;
private contentEl;
private lastActiveElement;
private static openStack;
private static getLastOpened;
getDefaultAttrs(): {
closeOnEscapeKey: boolean;
closeOnOutsideClick: boolean;
hasBackdrop: boolean;
addToStack: boolean;
transitionName: string;
transitionDuration: number;
};
oninit(vnode: m.Vnode<IOverlayAttrs>): void;
onbeforeupdate(vnode: m.Vnode<IOverlayAttrs>, old: m.VnodeDOM<IOverlayAttrs>): void;
onremove(): void;
view(): m.Vnode<any, any> | null;
private onContainerCreate;
private onContainerUpdate;
private handleOpen;
private handleClose;
private handleClosed;
private handleEnterTransition;
private handleExitTransition;
private handleFocus;
private handleBackdropMouseDown;
private handleDocumentMouseDown;
private handleKeyDown;
private get lastOpened();
}
export interface IDialogAttrs extends IOverlayableAttrs, IAttrs {
/** Toggles basic styling (no header/footer border and background) */
basic?: boolean;
/**
* Wether closed button is present in header
* @default true
*/
hasCloseButton?: boolean;
/** Toggles visibility */
isOpen?: boolean;
/** Title of dialog */
title?: string;
/** Inner content */
content?: m.Children;
/** Footer content */
footer?: m.Children;
}
export declare class Dialog extends AbstractComponent<IDialogAttrs> {
getDefaultAttrs(): {
hasCloseButton: boolean;
closeOnOutsideClick: boolean;
};
view(): m.Vnode<IOverlayAttrs, unknown>;
private handleContainerClick;
}
export declare const DrawerPosition: {
TOP: "top";
BOTTOM: "bottom";
RIGHT: "right";
LEFT: "left";
};
export declare type DrawerPosition = typeof DrawerPosition[keyof typeof DrawerPosition];
export interface IDrawerAttrs extends IOverlayAttrs {
/** Position of drawer */
position?: DrawerPosition;
}
export declare class Drawer implements m.Component<IDrawerAttrs> {
view({ attrs }: m.Vnode<IDrawerAttrs>): m.Vnode<IOverlayAttrs, unknown>;
}
export interface IEmptyStateAttrs extends IAttrs {
/** Icon name */
icon?: IconName | m.Children;
/** Header content */
header?: m.Children;
/** Main content */
content?: m.Children;
/**
* Fills the height/width of parent container
* @default true
*/
fill?: boolean;
[htmlAttrs: string]: any;
}
export declare class EmptyState implements m.Component<IEmptyStateAttrs> {
view({ attrs }: m.Vnode<IEmptyStateAttrs>): m.Vnode<any, any>;
}
export interface IBreakpointMap {
xs?: number;
sm?: number;
md?: number;
lg?: number;
xl?: number;
}
export interface IGridAttrs extends IAttrs {
/** HTML element to render into */
element?: string;
/** Space between columns */
gutter?: number | IBreakpointMap;
/** Flexbox column alignment */
align?: "top" | "middle" | "bottom";
/** Flexbox column justify */
justify?: "start" | "end" | "center" | "space-around" | "space-between";
[htmlAttrs: string]: any;
}
export declare class Grid implements m.Component<IGridAttrs> {
view({ attrs, children }: m.Vnode<IGridAttrs>): m.Vnode<any, any>;
private getGutter;
private renderCols;
}
export interface IColAttrs extends IAttrs {
/** Width of column; between 1-12 */
span?: number | IBreakpointMap;
/** Column order */
order?: number | IBreakpointMap;
/** Column offset */
offset?: number | IBreakpointMap;
[htmlAttrs: string]: any;
}
export declare class Col implements m.Component<IColAttrs> {
view({ attrs, children }: m.Vnode<IColAttrs>): m.Vnode<any, any>;
}
export interface IFormAttrs extends IAttrs, IGridAttrs {
[htmlAttrs: string]: any;
}
export declare class Form implements m.Component<IFormAttrs> {
view({ attrs, children }: m.Vnode<IFormAttrs>): m.Vnode<IGridAttrs, unknown>;
}
export interface IFormGroupAttrs extends IColAttrs {
/** Text label */
label?: string;
/** Inner content; can be used instead of passing children */
content?: m.Children;
/** Disables interaction */
disabled?: boolean;
}
export declare class FormGroup implements m.Component<IFormGroupAttrs> {
view({ attrs, children }: m.Vnode<IFormGroupAttrs>): m.Vnode<IColAttrs, unknown>;
}
export interface IFormLabelAttrs extends IAttrs {
[htmlAttrs: string]: any;
}
export declare class FormLabel implements m.Component<IFormLabelAttrs> {
view({ attrs, children }: m.Vnode<IFormLabelAttrs>): m.Vnode<any, any>;
}
export interface IInputAttrs extends IAttrs, ISizeAttrs, IIntentAttrs {
/** Toggles basic styling (only bottom border) */
basic?: boolean;
/** Left-justified content */
contentLeft?: m.Vnode<any, any>;
/** Right-justified content */
contentRight?: m.Vnode<any, any>;
/** Initial value to display (uncontrolled mode) */
defaultValue?: string;
/** Disables input */
disabled?: boolean;
/** Fills width of parent container */
fluid?: boolean;
/** Callback invoked on value change */
onchange?: (e: Event) => void;
/** Input value */
value?: string | number;
[htmlAttrs: string]: any;
}
export declare class Input implements m.Component<IInputAttrs> {
oncreate(vnode: m.VnodeDOM<IInputAttrs>): void;
onupdate(vnode: m.VnodeDOM<IInputAttrs>): void;
view({ attrs }: m.Vnode<IInputAttrs>): m.Vnode<any, any>;
private updatePadding;
}
export interface IInputFileAttrs extends IAttrs, ISizeAttrs, IIntentAttrs {
/** Left-justified content */
contentLeft?: m.Vnode<any, any>;
/** Right-justified content */
contentRight?: m.Vnode<any, any>;
/** Disables file selection */
disabled?: boolean;
/** Fills width of parent container */
fluid?: boolean;
/** Callback invoked on filename change */
onchange?: (e: Event) => void;
/** Inner text value */
text?: string;
[htmlAttrs: string]: any;
}
export declare class InputFile implements m.Component<IInputFileAttrs> {
private browseButton;
oncreate(vnode: m.VnodeDOM<IInputFileAttrs>): void;
onupdate(vnode: m.VnodeDOM<IInputFileAttrs>): void;
view({ attrs }: m.Vnode<IInputFileAttrs>): m.Vnode<any, any>;
private updatePadding;
}
export declare const PopoverInteraction: {
CLICK: "click";
CLICK_TRIGGER: "click-trigger";
HOVER: "hover";
HOVER_TRIGGER: "hover-trigger";
};
export declare type PopoverInteraction = typeof PopoverInteraction[keyof typeof PopoverInteraction];
export declare const PopoverPosition: {
AUTO: "auto";
AUTO_START: "auto-start";
AUTO_END: "auto-end";
TOP: "top";
TOP_START: "top-start";
TOP_END: "top-end";
RIGHT: "right";
RIGHT_START: "right-start";
RIGHT_END: "right-end";
BOTTOM: "bottom";
BOTTOM_START: "bottom-start";
BOTTOM_END: "bottom-end";
LEFT: "left";
LEFT_START: "left-start";
LEFT_END: "left-end";
};
export declare type PopoverPosition = typeof PopoverPosition[keyof typeof PopoverPosition];
export interface IPopoverAttrs extends IOverlayableAttrs, IAttrs {
/**
* Set the bounding box.
* see <a href="https://popper.js.org/popper-documentation.html#modifiers..preventOverflow">Here</a> for more details
* @default 'window'
*/
boundariesEl?: Boundary | Element;
/** Close the popover on inner content click */
closeOnContentClick?: boolean;
/** Inner content */
content: m.Children;
/** Initial open when in uncontrolled mode */
defaultIsOpen?: boolean;
/**
* Toggles arrow visiblity
* @default true
*/
hasArrow?: boolean;
/**
* Duration of close delay on hover interaction
* @default 100
*/
hoverCloseDelay?: number;
/**
* Duration of open delay on hover interaction
* @default 0
*/
hoverOpenDelay?: number;
/**
* Trigger interaction to toggle visiblity
* @default 'click'
*/
interactionType?: PopoverInteraction;
/**
* Toggles visibility;
* Specifying this attr will place the Popover in controlled mode
* and will invoke the `onInteraction` callback for each open/close state change
*/
isOpen?: boolean;
/**
* Options to pass to the PopperJS instance;
* see <a href="https://popper.js.org/popper-documentation.html#modifiers">HERE</a> for more details
*/
modifiers?: PopperJS.Modifiers;
/**
* Position relative to trigger element
* @default 'bottom'
*/
position?: PopoverPosition;
/** Callback invoked in controlled mode when a popover action will modify the open state */
onInteraction?: (nextOpenState: boolean, e: Event) => void;
/**
* Toggles visibilty when trigger is keyboard focused;
* Only works when interactionType is hover or hover-trigger
*/
openOnTriggerFocus?: boolean;
/** Overlay HTML container class */
overlayClass?: string;
/** Overlay HTML container styles */
overlayStyle?: Style;
/** Trigger element */
trigger: m.Vnode<any, any>;
/**
* Class added to trigger element on interaction
* @default 'cui-active'
*/
triggerActiveClass?: string;
}
export interface IPopoverTriggerAttrs extends IAttrs {
onclick?(e: Event): void;
onmouseenter?(e: MouseEvent): void;
onmouseleave?(e: MouseEvent): void;
onfocus?(e: Event): void;
onblur?(e: Event): void;
[htmlAttrs: string]: any;
}
export declare class Popover extends AbstractComponent<IPopoverAttrs> {
private isOpen;
private popper?;
private trigger;
getDefaultAttrs(): IPopoverAttrs;
oninit(vnode: m.Vnode<IPopoverAttrs>): void;
onbeforeupdate(vnode: m.Vnode<IPopoverAttrs>, old: m.VnodeDOM<IPopoverAttrs>): void;
onupdate(): void;
onremove(): void;
view(): m.Vnode<any, any>;
private handleOpened;
private handleClosed;
private handleOverlayClose;
private createPopper;
private destroyPopper;
private setTriggerAttrs;
private handleInteraction;
private handlePopoverClick;
private handleTriggerClick;
private handleTriggerFocus;
private handleTriggerBlur;
private handleTriggerMouseEnter;
private handleTriggerMouseLeave;
private isHoverInteraction;
private isClickInteraction;
private get isControlled();
private getContentOffset;
}
export interface IInputPopoverAttrs extends Omit<IPopoverAttrs, "content"> {
/**
* Attrs passed through to wrapper container
* @default {}
*/
contentAttrs?: any;
/** Initial value to display */
value?: string;
/** Elements added before content */
header?: m.Children;
/** Elements added after content */
footer?: m.Children;
/** Whether to highlight input text on open */
hightlightOnOpen?: boolean;
/**
* Attrs passed through to input/textarea element
* @default {}
*/
inputAttrs?: IInputAttrs;
/**
* Type of input to render
* @default 'input'
*/
type?: "input" | "textarea";
/** Placeholder value for input */
placeholder?: string;
/**
* Callback invoked when submit button is clicked
* (or if type="input", submitOnEnter="true" and ENTER key is pressed)
*/
onSubmit: (value: string) => void;
/**
* Attrs passed through to submit button
* @default {}
*/
submitButtonAttrs?: IButtonAttrs;
/**
* Label for submit button
* @default 'Submit'
*/
submitButtonLabel?: m.Children;
/**
* Whether onSubmit is called on ENTER key
* Note: only applies to type="input" element
* @default true
*/
submitOnEnter?: boolean;
}
export declare class InputPopover extends AbstractComponent<IInputPopoverAttrs> {
private value;
getDefaultAttrs(): IInputPopoverAttrs;
oninit(vnode: m.Vnode<IInputPopoverAttrs>): void;
view(): m.Vnode<IPopoverAttrs, unknown>;
private renderInput;
private handleOnKeyDown;
private handleOnSubmit;
private handleOnOpened;
private handleOnClosed;
}
export interface IListAttrs extends IAttrs, ISizeAttrs {
/** Wether to show background on item hover */
interactive?: boolean;
[htmlAttrs: string]: any;
}
export declare class List implements m.Component<IListAttrs> {
view({ attrs, children }: m.Vnode<IListAttrs>): m.Vnode<any, any>;
}
export interface IListItemAttrs extends IAttrs {
/** Toggles active state */
active?: boolean;
/** Allow onclick event to be processed for contentLeft/contentRight */
allowOnContentClick?: boolean;
/** Left-justified content */
contentLeft?: m.Children;
/** Right-justified content */
contentRight?: m.Children;
/** Toggles disabled state */
disabled?: boolean;
/** Toggles selected state */
selected?: boolean;
/** Inner text or content */
label?: m.Children;
/** Callback invoked on click */
onclick?: (e: Event) => void;
[htmlAttrs: string]: any;
}
export declare class ListItem implements m.Component<IListItemAttrs> {
view({ attrs }: m.Vnode<IListItemAttrs>): m.Vnode<any, any>;
private handleClick;
}
export interface IQueryListEvents {
handleKeyDown: (e: KeyboardEvent) => void;
}
export interface IFilterableAttrs {
/**
* Attrs passed through to the ControlGroup component
* @default {}
*/
controlGroupAttrs?: IControlGroupAttrs;
/** Right-justified content in relation to Input component */
contentRight?: m.Children;
/** Left-justified content in relation to Input component */
contentLeft?: m.Children;
/** Initial query value (uncontrolled mode) */
defaultQuery?: string;
/**
* Toggles search input
* @default true
*/
filterable?: boolean;
/** Callback invoked on input query change; only called when `query` is defined */
onQueryChange?: (query: string) => void;
/** Input query value (controlled mode) */
query?: string;
}
export interface IQueryableAttrs<T> extends IAttrs {
/** Current index position (controlled mode) */
activeIndex?: number;
/**
* When true, items will be "cached" when a query is specified.
* When false, every redraw will call itemPredicate or itemListPredicate if a query is specified
* @default true
*/
cacheItems?: boolean;
/**
* Wether to show a checkmark for selected item(s)
* @default true
*/
checkmark?: boolean;
/** Initial active index (uncontrolled mode) */
defaultActiveIndex?: number;
/** Disables arrow key navigation and prevents highlighting of active item */
disableArrowKeys?: boolean;
/**
* Content rendered when input query is empty. If defined, items will only be rendered
* when a search query is provided.
*/
initialContent?: m.Children;
/**
* Attrs passed through to Input component.
* @default {}
*/
inputAttrs?: IInputAttrs;
/**
* Custom render function for the entire list. If undefined, returns a List
* component that calls `itemRender` for each item.
*/
itemListRender?: (items: T[]) => m.Vnode;
/**
* Predicate function used to filter all items.
* Takes predecent over `itemPredicate`
*/
itemListPredicate?: (query: string, items: T[]) => T[];
/** Render function applied to each item */
itemRender: (item: T, index: number) => m.Vnode<any, any>;
/** Predicate function applied to filter individual items */
itemPredicate?: (query: string, item: T, index: number) => boolean;
/** Array of T items */
items: T[];
/**
* Element(s) shown when input query returns empty
* @default 'No items available'
*/
emptyContent?: m.Children;
/** Callback invoked on active item change; only called when `activeIndex` is defined */
onActiveItemChange?: (activeItem: T, index: number) => void;
/** Callback invoked when child item is clicked */
onSelect?: (item: T, e: Event, index: number) => void;
/**
* Attrs passed through to List component
* @default {}
*/
listAttrs?: IListAttrs;
eventCallbacks?: (events: IQueryListEvents) => void;
}
export interface IQueryListAttrs<T> extends IQueryableAttrs<T>, IFilterableAttrs {
}
export declare class QueryList<T> extends AbstractComponent<IQueryListAttrs<T>> {
private filteredItems;
private activeIndex;
private itemNodes;
private inputEl;
private query;
private listEl;
static ofType<T>(): new () => QueryList<T>;
getDefaultAttrs(): IQueryListAttrs<T>;
oninit(vnode: m.Vnode<IQueryListAttrs<T>>): void;
oncreate({ dom }: m.VnodeDOM<IQueryListAttrs<T>>): void;
onbeforeupdate(vnode: m.Vnode<IQueryListAttrs<T>>, old: m.VnodeDOM<IQueryListAttrs<T>>): void;
view(): m.Vnode<any, any>;
private renderControlGroup;
private renderList;
private renderItem;
private setControlledAttrs;
scrollToActiveItem(): void;
private get activeItem();
private updateQuery;
private handleInput;
private handleSearchDebounce;
private handleInputClear;
private handleSelect;
private handleKeyDown;
private moveActiveIndex;
private updateActiveIndex;
private handleEnterKey;
private getFilteredItems;
}
export interface IInputSelectAttrs<T> extends IQueryableAttrs<T> {
/**
* Closes popover on item select
* @default true
*/
closeOnSelect?: boolean;
/**
* Attrs passed through to Popover component
* @default {}
*/
popoverAttrs?: Partial<IPopoverAttrs>;
/** Header content */
header?: m.Children;
/** Footer content */
footer?: m.Children;
/** Toggles loading state of inner list */
loading?: boolean;
/** Input value; */
value?: number | string;
/**
* Opens popover on input down key
* @default true
*/
openOnDownKey?: boolean;
}
export declare class InputSelect<T> extends AbstractComponent<IInputSelectAttrs<T>> {
private queryList;
private isOpen;
private query;
private input;
private activeIndex;
private handleQueryListKeyDown;
getDefaultAttrs(): IInputSelectAttrs<T>;
static ofType<T>(): new () => InputSelect<T>;
oninit(vnode: m.Vnode<IInputSelectAttrs<T>>): void;
onbeforeupdate(vnode: m.Vnode<IInputSelectAttrs<T>>, old: m.VnodeDOM<IInputSelectAttrs<T>>): void;
view(): m.Vnode<IPopoverAttrs, unknown>;
private handleInput;
private handleInputFocus;
private handleInputKeyDown;
private handleSearchDebounce;
private handleActiveItemChange;
private handleSelect;
private handlePopoverInteraction;
private handlePopoverClosed;
private get inputEl();
}
export interface IMenuAttrs extends IAttrs, ISizeAttrs {
/** Toggles basic styling (no border) */
basic?: boolean;
[htmlAttrs: string]: any;
}
export declare class Menu implements m.Component<IMenuAttrs> {
view({ attrs, children }: m.Vnode<IMenuAttrs>): m.Vnode<any, any>;
}
export declare class MenuDivider implements m.Component {
view(): m.Vnode<any, any>;
}
export interface IPopoverMenuAttrs extends IPopoverAttrs {
/** Attrs passed through to Menu component */
menuAttrs?: IMenuAttrs;
}
export declare class PopoverMenu implements m.Component<IPopoverMenuAttrs> {
view({ attrs }: m.Vnode<IPopoverMenuAttrs>): m.Vnode<IPopoverAttrs, unknown>;
}
export interface IMenuItemAttrs extends IButtonAttrs {
/** Submenu (Menu component) */
submenu?: m.Children;
/** Close submenu on child item click */
closeOnSubmenuClick?: boolean;
/** Attrs passed through to Popover (if submenu exists) */
popoverMenuAttrs?: Partial<IPopoverMenuAttrs>;
[htmlAttrs: string]: any;
}
export declare class MenuItem implements m.Component<IMenuItemAttrs> {
view({ attrs }: m.Vnode<IMenuItemAttrs>): m.Vnode<IButtonAttrs, unknown> | m.Vnode<IPopoverMenuAttrs, unknown>;
}
export interface IMenuHeadingAttrs extends IAttrs, ISizeAttrs {
}
export declare class MenuHeading implements m.Component<IMenuHeadingAttrs> {
view({ attrs, children }: m.Vnode<IMenuHeadingAttrs>): m.Vnode<any, any>;
}
export declare class Radio implements m.Component<IControlAttrs> {
view({ attrs }: m.Vnode<IControlAttrs>): m.Vnode<IControlAttrs, unknown>;
}
export interface IRadioGroupAttrs extends IAttrs, ISizeAttrs {
/** Disables selection */
disabled?: boolean;
/**
* Name of the radio group.
* If no name is specified, a unique name will be generated for each instance.
*/
name?: string;
/**
* Callback invoked when selection changes.
* The selected value can be accessed through <code>e.currentTarget.value</code>
*/
onchange?: (e: Event) => void;
/** Array of radio group options */
options?: Option[];
/** Value of the selected radio element */
value?: string;
[htmlAttrs: string]: any;
}
export declare class RadioGroup implements m.Component<IRadioGroupAttrs> {
private uniqueId;
view({ attrs }: m.Vnode<IRadioGroupAttrs>): m.Vnode<any, any>;
private renderRadioButton;
}
export interface ISelectAttrs extends IAttrs, ISizeAttrs, IIntentAttrs {
/** Toggles basic styling (no borders/background) */
basic?: boolean;
/** Left-justified content */
contentLeft?: m.Vnode<any, any>;
/** Right-justified content */
contentRight?: m.Vnode<any, any>;
/** Disables selection */
disabled?: boolean;
/** Initially selected value (uncontrolled mode) */
defaultValue?: string;
/** Array of list options */
options?: Option[];
/** Fills width of parent container */
fluid?: boolean;
/**
* Callback invoked when selection changes.
* The selected value can be accessed through <code>e.currentTarget.value</code>
*/
onchange?: (e: Event) => void;
/** Value of the selected option */
value?: string;
[htmlAttrs: string]: any;
}
export declare class Select implements m.Component<ISelectAttrs> {
oncreate(vnode: m.VnodeDOM<ISelectAttrs>): void;
onupdate(vnode: m.VnodeDOM<ISelectAttrs>): void;
view({ attrs }: m.Vnode<ISelectAttrs>): m.Vnode<any, any>;
private renderOption;
private updatePadding;
}
export interface ISelectListAttrs<T> extends IQueryListAttrs<T> {
/**
* Closes popover on item select
* @default true
*/
closeOnSelect?: boolean;
/**
* Attrs passed through to Popover component
* @default {}
*/
popoverAttrs?: Partial<IPopoverAttrs>;
/** Trigger element */
trigger: m.Vnode<any, any>;
/** Header content */
header?: m.Children;
/** Footer content */
footer?: m.Children;
/** Toggles loading state of inner list */
loading?: boolean;
}
export declare class SelectList<T> extends AbstractComponent<ISelectListAttrs<T>> {
queryList: new () => QueryList<T>;
private isOpen;
private activeIndex;
static ofType<T>(): new () => SelectList<T>;
getDefaultAttrs(): ISelectListAttrs<T>;
oninit(vnode: m.Vnode<ISelectListAttrs<T>>): void;
onbeforeupdate(vnode: m.Vnode<ISelectListAttrs<T>>, old: m.VnodeDOM<ISelectListAttrs<T>>): void;
view(): m.Vnode<IPopoverAttrs, unknown>;
private handleActiveItemChange;
private handleSelect;
private handlePopoverInteraction;
}
export interface ISpinnerAttrs extends IAttrs, ISizeAttrs, IIntentAttrs {
/** Toggles visibility of spinner */
active?: boolean;
/** Fills the height/width of parent container */
fill?: boolean;
/** Shows background when fill=true */
background?: boolean;
/** Optional message to show under icon */
message?: string;
[htmlAttrs: string]: any;
}
export declare class Spinner implements m.Component<ISpinnerAttrs> {
view({ attrs }: m.Vnode<ISpinnerAttrs>): m.Vnode<any, any>;
}
export declare class Switch implements m.Component<IControlAttrs> {
view({ attrs }: m.Vnode<IControlAttrs>): m.Vnode<IControlAttrs, unknown>;
}
export interface ITableAttrs extends IAttrs {
/** Toggles bordered styling */
bordered?: boolean;
/** Adds interactive hover/active styling for each row */
interactive?: boolean;
/** Toggles striped styling */
striped?: boolean;
[htmlAttrs: string]: any;
}
export declare class Table implements m.Component<ITableAttrs> {
view({ attrs, children }: m.Vnode<ITableAttrs>): m.Vnode<any, any>;
}
export interface ITabsAttrs extends IAttrs, ISizeAttrs {
/**
* Content alignment; Used to align tabs when fluid=true
* @default 'center'
*/
align?: Align;
/** Toggles bottom border */
bordered?: boolean;
/** Fills width of parent container */
fluid?: boolean;
[htmlAttrs: string]: any;
}
export declare class Tabs implements m.ClassComponent<ITabsAttrs> {
view({ attrs, children }: m.Vnode<ITabsAttrs>): m.Vnode<any, any>;
}
export interface ITabItemAttrs extends IAttrs {
/** Toggles active state */
active?: boolean;
/** Inner text or children */
label: m.Children;
/** Toggles loading animation */
loading?: boolean;
[htmlAttrs: string]: any;
}
export declare class TabItem implements m.ClassComponent<ITabItemAttrs> {
view({ attrs }: m.Vnode<ITabItemAttrs>): m.Vnode<any, any>;
}
export interface ITagAttrs extends IAttrs, ISizeAttrs, IIntentAttrs {
/** Text label */
label?: m.Children;
/**
* Callback invoked when "remove" icon is clicked;
* Omitting this property will hide the remove icon.
*/
onRemove?: (e: Event) => void;
/** Toggles rounded styling */
rounded?: boolean;
[htmlAttrs: string]: any;
}
export declare class Tag implements m.Component<ITagAttrs> {
view({ attrs }: m.Vnode<ITagAttrs>): m.Vnode<any, any>;
}
export interface ITagInputAttrs extends IAttrs, ISizeAttrs, IIntentAttrs {
/** Triggers onAdd when input loses focus */
addOnBlur?: boolean;
/**
* Array of Tag components
* @default []
*/
tags: m.Vnode<ITagAttrs, any>[];
/** Left-justified content */
contentLeft?: m.Child;
/** Right-justified content */
contentRight?: m.Child;
/** Disables interaction */
disabled?: boolean;
/** Fills width of parent container */
fluid?: boolean;
/**
* Attrs passed through to input
* @default {}
*/
inputAttrs?: IInputAttrs;
/** Function invoked when new tag is added (via enter key or addOnBlur) */
onAdd?: (value: string, e: Event) => void;
[htmlAttrs: string]: any;
}
export declare class TagInput extends AbstractComponent<ITagInputAttrs> {
private isActive;
private inputEl;
getDefaultAttrs(): ITagInputAttrs;
oncreate({ dom }: m.VnodeDOM<ITagInputAttrs>): void;
view(): m.Vnode<any, any>;
private handleContentClick;
private handleInputKeyDown;
private handleInputFocus;
private handleInputBlur;
private handleOnAdd;
}
export interface ITextAreaAttrs extends IAttrs, ISizeAttrs, IIntentAttrs {
/** Toggles basic styling (only bottom border) */
basic?: boolean;
/** Initial value to display (uncontrolled mode) */
defaultValue?: string;
/** Disables input */
disabled?: boolean;
/** Fills width of parent container */
fluid?: boolean;
/** Callback invoked on value change */
onchange?: (e: Event) => void;
/** Input value */
value?: string | number;
[htmlAttrs: string]: any;
}
export declare class TextArea implements m.Component<ITextAreaAttrs> {
view({ attrs }: m.Vnode<ITextAreaAttrs>): m.Vnode<any, any>;
}
export interface IToastAttrs extends IAttrs, ISizeAttrs, IIntentAttrs {
/** Left-justified icon */
icon?: IconName;
/** Inner content message */
message?: m.Children;
/** Callback invoked when toast is dismissed or timeout expires */
onDismiss?: (key: number | string, timedOut: boolean) => void;
/**
* Duration of dismiss timeout;
* A value of `0` will prevent the toast from timing out
* @default 3000
*/
timeout?: number;
/** Toast key; necessary when used in controlled mode */
key?: number | string;
[htmlAttrs: string]: any;
}
export declare class Toast extends AbstractComponent<IToastAttrs> {
getDefaultAttrs(): {
timeout: number;
};
oncreate(): void;
onbeforeupdate(vnode: m.Vnode<IToastAttrs>, prev: m.VnodeDOM<IToastAttrs>): void;
view(): m.Vnode<any, any>;
onremove(): void;
private handleCloseClick;
private triggerDismiss;
private startTimeout;
}
export declare type IToastOptions = IToastAttrs & {
key?: string;
};
export declare const ToasterPosition: {
TOP: "top";
TOP_START: "top-start";
TOP_END: "top-end";
BOTTOM: "bottom";
BOTTOM_START: "bottom-start";
BOTTOM_END: "bottom-end";
};
export declare type ToasterPosition = typeof ToasterPosition[keyof typeof ToasterPosition];
export interface IToaster {
/** Show toast */
show(attrs: IToastAttrs): string;
/** Update toast attrs by key */
update(key: string, attrs: IToastAttrs): void;
/** Dismiss toast by key */
dismiss(key: string): void;
/** Clear all toasts */
clear(): void;
/** Get array of toasts */
getToasts(): IToastOptions[];
}
export interface IToasterAttrs extends IAttrs {
/**
* Clears all toasts on ESCAPE key
* @default true
*/
clearOnEscapeKey?: boolean;
/** Renders component relative to parent container */
inline?: boolean;
/**
* Position of each toast item
* @default 'top'
*/
position?: ToasterPosition;
/** Array of `Toast` items when used in declarative mode */
toasts?: m.Vnode<IToastAttrs, any>[];
}
export declare class Toaster extends AbstractComponent<IToasterAttrs> {
private toasts;
private toastId;
getDefaultAttrs(): IToasterAttrs;
view(): m.Vnode<IOverlayAttrs, unknown>;
onremove(): void;
show(attrs: IToastAttrs): string;
update(key: string | number, attrs: IToastOptions): void;
dismiss: (key: string | number, timedOut?: boolean) => void;
clear(): void;
getToasts(): IToastOptions[];
private renderToast;
private isControlled;
}
export interface ITooltipAttrs extends IAttrs, ISizeAttrs {
/** Inner content */
content?: m.Children;
/** Content to trigger tooltip */
trigger?: m.Child;
/**
* Position of content relative to trigger
* @default 'auto'
*/
position?: PopoverPosition;
/**
* Displays an arrow pointing to trigger
* @default true
*/
hasArrow?: boolean;
/** Duration of close delay on hover interaction */
hoverCloseDelay?: number;
/** Duration of open delay on hover interaction */
hoverOpenDelay?: number;
/**
* Transition duration
* @default 300
*/
transitionDuration?: number;
}
export declare class Tooltip implements m.Component<ITooltipAttrs> {
view({ attrs }: m.Vnode<ITooltipAttrs>): m.Vnode<IPopoverAttrs, unknown>;
}
export interface ITreeAttrs extends IAttrs {
/** An array of child nodes */
nodes?: m.Vnode<ITreeAttrs, any>[];
[htmlAttrs: string]: any;
}
export declare class Tree implements m.Component<ITreeAttrs> {
view({ attrs }: m.Vnode<ITreeAttrs>): m.Vnode<any, any>;
}
export interface ITreeNodeAttrs extends IAttrs {
key: number | string;
/** Right-justified content */
contentRight?: m.Children;
/** Left-justified content */
contentLeft?: m.Children;
/** Array of TreeNodes */
children?: m.Vnode<ITreeNodeAttrs, unknown>[];
/** Toggles caret visiblity */
hasCaret?: boolean;
/** Wether children are expanded */
isExpanded?: boolean;
/** Wether node is selected */
isSelected?: boolean;
/** Inner label or children */
label?: m.Children;
/** Callback invoked on tree node click */
onClick?: (node: ITreeNodeAttrs, e: Event) => void;
/** Callback invoked when caret is collapsed */
onCollapse?: (node: ITreeNodeAttrs, e: Event) => void;
/** Callback invoked when caret is expanded */
onExpand?: (node: ITreeNodeAttrs, e: Event) => void;
[htmlAttrs: string]: any;
}
export declare class TreeNode implements m.Component<ITreeNodeAttrs> {
view({ attrs }: m.Vnode<ITreeNodeAttrs>): m.Vnode<any, any>;
private handleCaretClick;
private handleClick;
}
declare class FocusManager {
/** Focus outline is shown only when tabbing through elements */
showFocusOnlyOnTab(): void;
/** Focus outline is always shown (mouse click and tab) */
alwaysShowFocus(): void;
private handleMouseDown;
private handleKeyDown;
}
declare const _default: FocusManager;
declare class ResponsiveManager {
/** Key value of active breakpoints */
activeBreakpoints: Record<keyof typeof Breakpoints, boolean>;
/** Binds breakpoints */
initialize(breakpoints?: Record<keyof typeof Breakpoints, string>): void;
/** Checks if current breakpoint string is active */
is(key: keyof typeof Breakpoints): boolean;
/** Unbinds all breakpoints */
destroy(): void;
}
declare const _default: Responsiv