Refactor #3885 - For SpeedDial

This commit is contained in:
Tuğçe Küçükoğlu 2023-04-24 15:44:53 +03:00
parent 9bd5a07b1d
commit 5ee054a86a
3 changed files with 108 additions and 7 deletions

View file

@ -11,6 +11,92 @@ import { VNode } from 'vue';
import { MenuItem } from '../menuitem';
import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
export declare type SpeedDialPassThroughOptionType = SpeedDialPassThroughAttributes | ((options: SpeedDialPassThroughMethodOptions) => SpeedDialPassThroughAttributes) | null | undefined;
/**
* Custom passthrough(pt) option method.
*/
export interface SpeedDialPassThroughMethodOptions {
props: SpeedDialProps;
state: SpeedDialState;
}
/**
* Custom passthrough(pt) options.
* @see {@link SpeedDialProps.pt}
*/
export interface SpeedDialPassThroughOptions {
/**
* Uses to pass attributes to the root's DOM element.
*/
root?: SpeedDialPassThroughOptionType;
/**
* Uses to pass attributes to the button's DOM element.
*/
button?: SpeedDialPassThroughOptionType;
/**
* Uses to pass attributes to the icon's DOM element.
*/
icon?: SpeedDialPassThroughOptionType;
/**
* Uses to pass attributes to the list's DOM element.
*/
list?: SpeedDialPassThroughOptionType;
/**
* Uses to pass attributes to the item's DOM element.
*/
item?: SpeedDialPassThroughOptionType;
/**
* Uses to pass attributes to the action's DOM element.
*/
action?: SpeedDialPassThroughOptionType;
/**
* Uses to pass attributes to the action icon's DOM element.
*/
actionIcon?: SpeedDialPassThroughOptionType;
/**
* Uses to pass attributes to the mask's DOM element.
*/
mask?: SpeedDialPassThroughOptionType;
}
/**
* Custom passthrough attributes for each DOM elements
*/
export interface SpeedDialPassThroughAttributes {
[key: string]: any;
}
/**
* Defines current inline state in SpeedDial component.
*/
export interface SpeedDialState {
/**
* List of items' id.
*/
id: string;
/**
* Current visible state as a boolean.
* @defaultValue false
*/
visible: boolean;
/**
* Current click state of component as a boolean.
* @defaultValue false
*/
isItemClicked: boolean;
/**
* Current focus state as a boolean.
* @defaultValue false
*/
focused: boolean;
/**
* Current focused option index as a number.
* @defaultValue -1
*/
focusedOptionIndex: number;
}
/**
* Defines tooltip options.
* @see {@link SpeedDialProps.tooltipOptions}
@ -127,6 +213,11 @@ export interface SpeedDialProps {
* Identifier of the underlying list element.
*/
'aria-labelledby'?: string | undefined;
/**
* Uses to pass attributes to DOM elements inside the component.
* @type {SpeedDialPassThroughOptions}
*/
pt?: SpeedDialPassThroughOptions;
}
/**