From a757e6e2dfe763b91d6ed84dfb805f3d0dd10a6c Mon Sep 17 00:00:00 2001 From: mertsincan Date: Wed, 1 Dec 2021 17:20:03 +0300 Subject: [PATCH] Fixed #1836 - For SpeedDial --- src/components/speeddial/SpeedDial.d.ts | 195 ++++++++++++++++++++---- 1 file changed, 166 insertions(+), 29 deletions(-) diff --git a/src/components/speeddial/SpeedDial.d.ts b/src/components/speeddial/SpeedDial.d.ts index 1e0724943..9755173d0 100644 --- a/src/components/speeddial/SpeedDial.d.ts +++ b/src/components/speeddial/SpeedDial.d.ts @@ -1,39 +1,176 @@ import { VNode } from 'vue'; +import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers'; +import { MenuItem } from '../menuitem'; -interface SpeedDialProps { - model?: any[]; - visible?: boolean; - direction?: string; - transitionDelay?: number; - type?: string; - radius?: number; - mask?: boolean; - disabled?: boolean; - hideOnClickOutside?: boolean; - buttonClass?: string; - maskStyle?: string; - maskClass?: string; - showIcon?: string; - hideIcon?: string; - rotateAnimation?: boolean; - class?: string; +type SpeedDialDirectionType = 'up' | 'down' | 'left' | 'right' | 'up-left' | 'up-right' | 'down-left' | 'down-right'; + +type SpeedDialType = 'linear' | 'circle' | 'semi-circle' | 'quarter-circle'; + +type SpeedDialTooltipPositionType = 'bottom' | 'top' | 'left' | 'right'; + +type SpeedDialTooltipEventType = 'hover' | 'focus'; + +export interface SpeedDialTooltipOptions { + /** + * Event to show the tooltip, valid values are hover and focus. + * @see SpeedDialTooltipEventType + */ + event: SpeedDialTooltipEventType; + /** + * Position of element. + * @see SpeedDialTooltipPositionType + * Default value is 'bottom'. + */ + position: SpeedDialTooltipPositionType; + /** + * Optional options. + */ + [key: string]: string; +} + +export interface SpeedDialProps { + /** + * MenuModel instance to define the action items. + */ + model?: MenuItem[] | undefined; + /** + * Specifies the visibility of the overlay. + */ + visible?: boolean | undefined; + /** + * Specifies the opening direction of actions. + * @see SpeedDialDirectionType + * Default value is 'up'. + */ + direction?: SpeedDialDirectionType; + /** + * Transition delay step for each action item. + * Default value is 30. + */ + transitionDelay?: number | undefined; + /** + * Specifies the opening type of actions. + * @see SpeedDialType + * Default value is 'linear'. + */ + type?: SpeedDialType; + /** + * Radius for *circle types. + * Default value is 0. + */ + radius?: number | undefined; + /** + * Whether to show a mask element behind the speeddial. + */ + mask?: boolean | undefined; + /** + * Whether the component is disabled. + */ + disabled?: boolean | undefined; + /** + * Whether the actions close when clicked outside. + * Default value is true. + */ + hideOnClickOutside?: boolean | undefined; + /** + * Style class of the button element. + */ + buttonClass?: string | undefined; + /** + * Inline style of the mask element. + */ + maskStyle?: any; + /** + * Style class of the mask element. + */ + maskClass?: string | undefined; + /** + * Show icon of the button element. + * Default value is 'pi pi-plus'. + */ + showIcon?: string | undefined; + /** + * Hide icon of the button element. + */ + hideIcon?: string | undefined; + /** + * Defined to rotate showIcon when hideIcon is not present. + * Default value is true. + */ + rotateAnimation?: boolean | undefined; + /** + * Style class of the element. + */ + class?: string | undefined; + /** + * Inline style of the element. + */ style?: any; - tooltipOptions?: any; + /** + * 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'. + * @see SpeedDialTooltipOptions + */ + tooltipOptions?: SpeedDialTooltipOptions; } -interface SpeedDialItemSlotInterface { - item: any; +export interface SpeedDialSlots { + /** + * Custom content for each item. + * @param {Object} scope - item slot's params. + */ + item: (scope: { + /** + * Menuitem instance + */ + item: MenuItem; + }) => VNode[]; + /** + * Custom button template. + * @param {Object} scope - button slot's params. + */ + button: (scope: { + /** + * Toggle metadata + */ + toggle: () => void; + }) => VNode[]; } -declare class SpeedDial { - $props: SpeedDialProps; - $emit(eventName: 'click', event: Event): this; - $emit(eventName: 'show'): this; - $emit(eventName: 'hide'): this; - $slots: { - item: SpeedDialItemSlotInterface; - button: VNode[]; - }; +export declare type SpeedDialEmits = { + /** + * Fired when the button element clicked. + * @param {Event} event - Browser event. + */ + 'click': (event: Event) => void; + /** + * Fired when the actions are visible. + */ + 'show': () => void; + /** + * Fired when the actions are hidden. + */ + 'hide': () => void; } +declare class SpeedDial extends ClassComponent { } + +declare module '@vue/runtime-core' { + interface GlobalComponents { + SpeedDial: GlobalComponentConstructor + } +} + +/** + * + * When pressed, a floating action button can display multiple primary actions that can be performed on a page. + * + * Helper API: + * + * - [MenuItem](https://www.primefaces.org/primevue/showcase/#/menumodel) + * + * Demos: + * + * - [SpeedDial](https://www.primefaces.org/primevue/showcase/#/speeddial) + * + */ export default SpeedDial;