primeng
Version:
PrimeNG is a premium UI library for Angular featuring a rich set of 90+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with PrimeBlock,
394 lines (390 loc) • 14.5 kB
TypeScript
import { SpeedDialPassThrough, SpeedDialDirection, SpeedDialType, SpeedDialButtonTemplateContext, SpeedDialItemTemplateContext } from 'primeng/types/speeddial';
export * from 'primeng/types/speeddial';
import * as _angular_core from '@angular/core';
import { ElementRef, TemplateRef } from '@angular/core';
import { MenuItem, TooltipOptions } from 'primeng/api';
import { BaseComponent } from 'primeng/basecomponent';
import * as i1 from 'primeng/bind';
import { Bind } from 'primeng/bind';
import { ButtonDirectiveOptions } from 'primeng/types/button';
import { CSSProperties } from 'primeng/types/shared';
import { BaseStyle } from 'primeng/base';
/**
*
* When pressed, a floating action button can display multiple primary actions that can be performed on a page.
*
* [Live Demo](https://www.primeng.org/speeddial/)
*
* @module speeddialstyle
*
*/
declare enum SpeedDialClasses {
/**
* Class name of the root element
*/
root = "p-speeddial",
/**
* Class name of the button element
*/
pcButton = "p-speeddial-button",
/**
* Class name of the list element
*/
list = "p-speeddial-list",
/**
* Class name of the item element
*/
item = "p-speeddial-item",
/**
* Class name of the action element
*/
pcAction = "p-speeddial-action",
/**
* Class name of the action icon element
*/
actionIcon = "p-speeddial-action-icon",
/**
* Class name of the mask element
*/
mask = "p-speeddial-mask"
}
declare class SpeedDialStyle extends BaseStyle {
name: string;
style: string;
classes: {
root: ({ instance }: {
instance: any;
}) => (string | {
[x: string]: any;
'p-speeddial-open': any;
'p-disabled': any;
})[];
pcButton: ({ instance }: {
instance: any;
}) => (string | {
'p-speeddial-rotate': any;
})[];
list: string;
item: ({ instance, item, i }: {
instance: any;
item: any;
i: any;
}) => (string | {
'p-hidden': boolean;
'p-focus': boolean;
})[];
pcAction: string;
actionIcon: string;
mask: string;
};
inlineStyles: {
root: ({ instance }: {
instance: any;
}) => {
alignItems: string | false;
justifyContent: string | false;
flexDirection: string | null;
};
list: ({ instance }: {
instance: any;
}) => {
flexDirection: string | null;
};
};
static ɵfac: _angular_core.ɵɵFactoryDeclaration<SpeedDialStyle, never>;
static ɵprov: _angular_core.ɵɵInjectableDeclaration<SpeedDialStyle>;
}
interface SpeedDialStyle extends BaseStyle {
}
/**
* When pressed, a floating action button can display multiple primary actions that can be performed on a page.
* @group Components
*/
declare class SpeedDial extends BaseComponent<SpeedDialPassThrough> {
componentName: string;
$pcSpeedDial: SpeedDial | undefined;
bindDirectiveInstance: Bind;
onAfterViewChecked(): void;
/**
* List of items id.
* @group Props
*/
id: _angular_core.InputSignal<string | undefined>;
/**
* Inline style of the element.
* @group Props
*/
style: _angular_core.InputSignal<CSSProperties>;
/**
* Style class of the element.
* @group Props
*/
className: _angular_core.InputSignal<string | undefined>;
/**
* MenuModel instance to define the action items.
* @group Props
*/
$model: _angular_core.InputSignal<MenuItem[] | null>;
/**
* Specifies the visibility of the overlay.
* @defaultValue false
* @group Props
*/
visible: _angular_core.ModelSignal<boolean>;
/**
* Specifies the opening direction of actions.
* @gruop Props
*/
direction: _angular_core.InputSignal<SpeedDialDirection>;
/**
* Transition delay step for each action item.
* @group Props
*/
transitionDelay: _angular_core.InputSignalWithTransform<number, unknown>;
/**
* Specifies the opening type of actions.
* @group Props
*/
type: _angular_core.InputSignal<SpeedDialType>;
/**
* Radius for *circle types.
* @group Props
*/
radius: _angular_core.InputSignalWithTransform<number, unknown>;
/**
* Whether to show a mask element behind the speeddial.
* @group Props
*/
mask: _angular_core.InputSignalWithTransform<boolean, unknown>;
/**
* Whether the component is disabled.
* @group Props
*/
disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
/**
* Whether the actions close when clicked outside.
* @group Props
*/
hideOnClickOutside: _angular_core.InputSignalWithTransform<boolean, unknown>;
/**
* Inline style of the button element.
* @group Props
*/
buttonStyle: _angular_core.InputSignal<CSSProperties>;
/**
* Style class of the button element.
* @group Props
*/
buttonClassName: _angular_core.InputSignal<string | undefined>;
/**
* Inline style of the mask element.
* @group Props
*/
maskStyle: _angular_core.InputSignal<CSSProperties>;
/**
* Style class of the mask element.
* @group Props
*/
maskClassName: _angular_core.InputSignal<string | undefined>;
/**
* Show icon of the button element.
* @group Props
*/
showIcon: _angular_core.InputSignal<string | undefined>;
/**
* Hide icon of the button element.
* @group Props
*/
hideIcon: _angular_core.InputSignal<string | undefined>;
/**
* Defined to rotate showIcon when hideIcon is not present.
* @group Props
*/
rotateAnimation: _angular_core.InputSignalWithTransform<boolean, unknown>;
/**
* Defines a string value that labels an interactive element.
* @group Props
*/
ariaLabel: _angular_core.InputSignal<string | undefined>;
/**
* Identifier of the underlying input element.
* @group Props
*/
ariaLabelledBy: _angular_core.InputSignal<string | undefined>;
/**
* Whether to display the tooltip on items. The modifiers of Tooltip can be used like an object in it. Valid keys are 'event' and 'position'.
* @group Props
*/
tooltipOptions: _angular_core.InputSignal<TooltipOptions | undefined>;
/**
* Configuration object forwarded to the Button component.
* @group Props
*/
buttonProps: _angular_core.InputSignal<ButtonDirectiveOptions | undefined>;
/**
* Fired when the visibility of element changed.
* @param {boolean} boolean - Visibility value.
* @group Emits
*/
onVisibleChange: _angular_core.OutputEmitterRef<boolean>;
/**
* Fired when the button element clicked.
* @param {MouseEvent} event - Mouse event.
* @group Emits
*/
onClick: _angular_core.OutputEmitterRef<MouseEvent>;
/**
* Fired when the actions are visible.
* @param {Event} event - Browser event.
* @group Emits
*/
onShow: _angular_core.OutputEmitterRef<void>;
/**
* Fired when the actions are hidden.
* @param {Event} event - Browser event.
* @group Emits
*/
onHide: _angular_core.OutputEmitterRef<void>;
list: _angular_core.Signal<ElementRef<any> | undefined>;
/**
* Custom button template.
* @param {SpeedDialButtonTemplateContext} context - button context.
* @see {@link SpeedDialButtonTemplateContext}
* @group Templates
*/
buttonTemplate: _angular_core.Signal<TemplateRef<SpeedDialButtonTemplateContext> | undefined>;
/**
* Custom item template.
* @param {SpeedDialItemTemplateContext} context - item context.
* @see {@link SpeedDialItemTemplateContext}
* @group Templates
*/
itemTemplate: _angular_core.Signal<TemplateRef<SpeedDialItemTemplateContext> | undefined>;
/**
* Custom icon template.
* @group Templates
*/
iconTemplate: _angular_core.Signal<TemplateRef<void> | undefined>;
isItemClicked: boolean;
documentClickListener: any;
focusedOptionIndex: _angular_core.WritableSignal<any>;
focused: _angular_core.WritableSignal<boolean>;
_componentStyle: SpeedDialStyle;
private generatedId;
$id: _angular_core.Signal<string>;
listId: _angular_core.Signal<string>;
itemAriaControls: _angular_core.Signal<string>;
focusedOptionId: _angular_core.Signal<any>;
ariaActivedescendant: _angular_core.Signal<any>;
buttonIconClass: _angular_core.Signal<string | undefined>;
showDefaultIcon: _angular_core.Signal<boolean>;
buttonClass: _angular_core.Signal<string>;
maskVisible: _angular_core.Signal<boolean>;
maskClass: _angular_core.Signal<string>;
buttonTemplateContext: {
toggleCallback: any;
};
onItemClickBound: any;
constructor();
getItemId(index: number): string;
getItemTemplateContext(item: MenuItem, index: number): SpeedDialItemTemplateContext;
getItemTooltipOptions(item: MenuItem): TooltipOptions;
getItemTabindex(item: MenuItem): string | null;
getPTOptions(id: string, key: string): any;
isItemActive(id: string): boolean;
onAfterViewInit(): void;
show(): void;
hide(): void;
onButtonClick(event: MouseEvent): void;
onItemClick(e: Event, item: MenuItem): void;
onKeyDown(event: KeyboardEvent): void;
onFocus(event: any): void;
onBlur(event: any): void;
onArrowUp(event: any): void;
onArrowDown(event: any): void;
onArrowLeft(event: any): void;
onArrowRight(event: any): void;
onEndKey(event: any): void;
onHomeKey(event: any): void;
onEnterKey(event: any): void;
onEscapeKey(event: KeyboardEvent): void;
onTogglerKeydown(event: KeyboardEvent): void;
onTogglerArrowUp(event: any): void;
onTogglerArrowDown(event: any): void;
navigateNextItem(event: any): void;
navigatePrevItem(event: any): void;
findPrevOptionIndex(index: any): number;
findNextOptionIndex(index: any): number;
changeFocusedOptionIndex(index: any): void;
calculatePointStyle(index: number): {
left: string;
top: string;
bottom?: undefined;
right?: undefined;
} | {
left: string;
bottom: string;
top?: undefined;
right?: undefined;
} | {
right: string;
top: string;
left?: undefined;
bottom?: undefined;
} | {
right: string;
bottom: string;
left?: undefined;
top?: undefined;
} | {
left?: undefined;
top?: undefined;
bottom?: undefined;
right?: undefined;
};
calculateTransitionDelay(index: number): number;
getItemStyle(index: number): {
left: string;
top: string;
bottom?: undefined;
right?: undefined;
transitionDelay: string;
} | {
left: string;
bottom: string;
top?: undefined;
right?: undefined;
transitionDelay: string;
} | {
right: string;
top: string;
left?: undefined;
bottom?: undefined;
transitionDelay: string;
} | {
right: string;
bottom: string;
left?: undefined;
top?: undefined;
transitionDelay: string;
} | {
left?: undefined;
top?: undefined;
bottom?: undefined;
right?: undefined;
transitionDelay: string;
};
isClickableRouterLink(item: MenuItem): any;
isOutsideClicked(event: Event): boolean;
bindDocumentClickListener(): void;
unbindDocumentClickListener(): void;
onDestroy(): void;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<SpeedDial, never>;
static ɵcmp: _angular_core.ɵɵComponentDeclaration<SpeedDial, "p-speeddial, p-speed-dial", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "style": { "alias": "style"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "$model": { "alias": "model"; "required": false; "isSignal": true; }; "visible": { "alias": "visible"; "required": false; "isSignal": true; }; "direction": { "alias": "direction"; "required": false; "isSignal": true; }; "transitionDelay": { "alias": "transitionDelay"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "radius": { "alias": "radius"; "required": false; "isSignal": true; }; "mask": { "alias": "mask"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "hideOnClickOutside": { "alias": "hideOnClickOutside"; "required": false; "isSignal": true; }; "buttonStyle": { "alias": "buttonStyle"; "required": false; "isSignal": true; }; "buttonClassName": { "alias": "buttonClassName"; "required": false; "isSignal": true; }; "maskStyle": { "alias": "maskStyle"; "required": false; "isSignal": true; }; "maskClassName": { "alias": "maskClassName"; "required": false; "isSignal": true; }; "showIcon": { "alias": "showIcon"; "required": false; "isSignal": true; }; "hideIcon": { "alias": "hideIcon"; "required": false; "isSignal": true; }; "rotateAnimation": { "alias": "rotateAnimation"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; "isSignal": true; }; "tooltipOptions": { "alias": "tooltipOptions"; "required": false; "isSignal": true; }; "buttonProps": { "alias": "buttonProps"; "required": false; "isSignal": true; }; }, { "visible": "visibleChange"; "onVisibleChange": "onVisibleChange"; "onClick": "onClick"; "onShow": "onShow"; "onHide": "onHide"; }, ["buttonTemplate", "itemTemplate", "iconTemplate"], never, true, [{ directive: typeof i1.Bind; inputs: {}; outputs: {}; }]>;
}
declare class SpeedDialModule {
static ɵfac: _angular_core.ɵɵFactoryDeclaration<SpeedDialModule, never>;
static ɵmod: _angular_core.ɵɵNgModuleDeclaration<SpeedDialModule, never, [typeof SpeedDial], [typeof SpeedDial]>;
static ɵinj: _angular_core.ɵɵInjectorDeclaration<SpeedDialModule>;
}
export { SpeedDial, SpeedDialClasses, SpeedDialModule, SpeedDialStyle };