mirror of
https://github.com/primefaces/primevue.git
synced 2025-05-09 00:42:36 +00:00
Fixed #5266 - New Stepper component
This commit is contained in:
parent
3ddf127783
commit
62e6aaeb28
17 changed files with 976 additions and 0 deletions
274
components/lib/stepperpanel/StepperPanel.d.ts
vendored
Normal file
274
components/lib/stepperpanel/StepperPanel.d.ts
vendored
Normal file
|
@ -0,0 +1,274 @@
|
|||
/**
|
||||
*
|
||||
* StepperPanel is a helper component for StepperPanel component.
|
||||
*
|
||||
* [Live Demo](https://www.primevue.org/stepper/)
|
||||
*
|
||||
* @module stepperpanel
|
||||
*
|
||||
*/
|
||||
import { TransitionProps, VNode } from 'vue';
|
||||
import { ComponentHooks } from '../basecomponent';
|
||||
import { PassThroughOptions } from '../passthrough';
|
||||
import { ClassComponent, GlobalComponentConstructor, PassThrough } from '../ts-helpers';
|
||||
|
||||
export declare type StepperPanelPassThroughOptionType = StepperPanelPassThroughAttributes | ((options: StepperPanelPassThroughMethodOptions) => StepperPanelPassThroughAttributes | string) | string | null | undefined;
|
||||
|
||||
export declare type StepperPanelPassThroughTransitionType = TransitionProps | ((options: StepperPanelPassThroughMethodOptions) => TransitionProps) | undefined;
|
||||
|
||||
/**
|
||||
* Custom passthrough(pt) option method.
|
||||
*/
|
||||
export interface StepperPanelPassThroughMethodOptions {
|
||||
/**
|
||||
* Defines instance.
|
||||
*/
|
||||
instance: any;
|
||||
/**
|
||||
* Defines valid properties.
|
||||
*/
|
||||
props: StepperPanelProps;
|
||||
/**
|
||||
* Defines current options.
|
||||
*/
|
||||
context: StepperPanelContext;
|
||||
/**
|
||||
* Defines valid attributes.
|
||||
*/
|
||||
attrs: any;
|
||||
/**
|
||||
* Defines parent options.
|
||||
*/
|
||||
parent: any;
|
||||
/**
|
||||
* Defines passthrough(pt) options in global config.
|
||||
*/
|
||||
global: object | undefined;
|
||||
}
|
||||
|
||||
/**
|
||||
* Custom passthrough(pt) options.
|
||||
* @see {@link StepperPanelProps.pt}
|
||||
*/
|
||||
export interface StepperPanelPassThroughOptions {
|
||||
/**
|
||||
* Used to pass attributes to the root's DOM element.
|
||||
*/
|
||||
root?: StepperPanelPassThroughOptionType;
|
||||
/**
|
||||
* Used to pass attributes to the header's DOM element.
|
||||
*/
|
||||
header?: StepperPanelPassThroughOptionType;
|
||||
/**
|
||||
* Used to pass attributes to the action's DOM element.
|
||||
*/
|
||||
action?: StepperPanelPassThroughOptionType;
|
||||
/**
|
||||
* Used to pass attributes to the number's DOM element.
|
||||
*/
|
||||
number?: StepperPanelPassThroughOptionType;
|
||||
/**
|
||||
* Used to pass attributes to the title's DOM element.
|
||||
*/
|
||||
title?: StepperPanelPassThroughOptionType;
|
||||
/**
|
||||
* Used to pass attributes to the separator's DOM element.
|
||||
*/
|
||||
separator?: StepperPanelPassThroughOptionType;
|
||||
/**
|
||||
* Used to pass attributes to the content's DOM element.
|
||||
*/
|
||||
content?: StepperPanelPassThroughOptionType;
|
||||
/**
|
||||
* Used to pass attributes to the panel's DOM element.
|
||||
*/
|
||||
panel?: StepperPanelPassThroughOptionType;
|
||||
/**
|
||||
* Used to pass attributes to the toggleable content's DOM element.
|
||||
*/
|
||||
toggleableContent?: StepperPanelPassThroughOptionType;
|
||||
/**
|
||||
* Used to control Vue Transition API.
|
||||
*/
|
||||
transition?: StepperPanelPassThroughTransitionType;
|
||||
/**
|
||||
* Used to manage all lifecycle hooks.
|
||||
* @see {@link BaseComponent.ComponentHooks}
|
||||
*/
|
||||
hooks?: ComponentHooks;
|
||||
}
|
||||
|
||||
export interface StepperPanelPassThroughAttributes {
|
||||
[key: string]: any;
|
||||
}
|
||||
|
||||
/**
|
||||
* Defines valid properties in StepperPanel component.
|
||||
*/
|
||||
export interface StepperPanelProps {
|
||||
/**
|
||||
* Orientation of tab headers.
|
||||
*/
|
||||
header?: string | undefined;
|
||||
/**
|
||||
* Used to pass attributes to DOM elements inside the component.
|
||||
* @type {StepperPanelPassThroughOptions}
|
||||
*/
|
||||
pt?: PassThrough<StepperPanelPassThroughOptions>;
|
||||
/**
|
||||
* Used to configure passthrough(pt) options of the component.
|
||||
* @type {PassThroughOptions}
|
||||
*/
|
||||
ptOptions?: PassThroughOptions;
|
||||
}
|
||||
|
||||
/**
|
||||
* Defines current options in StepperPanel component.
|
||||
*/
|
||||
export interface StepperPanelContext {
|
||||
/**
|
||||
* Current index of the stepperpanel.
|
||||
*/
|
||||
index: number;
|
||||
/**
|
||||
* Count of stepperpanels
|
||||
*/
|
||||
count: number;
|
||||
/**
|
||||
* Whether the stepperpanel is first.
|
||||
*/
|
||||
first: boolean;
|
||||
/**
|
||||
* Whether the stepperpanel is last.
|
||||
*/
|
||||
last: boolean;
|
||||
/**
|
||||
* Whether the stepperpanel is active.
|
||||
*/
|
||||
active: boolean;
|
||||
/**
|
||||
* Whether the stepperpanel is highlighted.
|
||||
*/
|
||||
highlighted: boolean;
|
||||
/**
|
||||
* Whether the stepperpanel is disabled.
|
||||
*/
|
||||
disabled: boolean;
|
||||
}
|
||||
|
||||
/**
|
||||
* Defines valid slots in StepperPanel slots.
|
||||
*/
|
||||
export interface StepperPanelSlots {
|
||||
/**
|
||||
* Custom content template.
|
||||
*/
|
||||
default(): VNode[];
|
||||
/**
|
||||
* Custom header template.
|
||||
*/
|
||||
header(scope: {
|
||||
/**
|
||||
* Index of the stepperpanel
|
||||
*/
|
||||
index: number;
|
||||
/**
|
||||
* Current active state of the stepperpanel
|
||||
*/
|
||||
active: boolean;
|
||||
/**
|
||||
* Current highlighted state of the stepperpanel
|
||||
*/
|
||||
highlighted: boolean;
|
||||
/**
|
||||
* Style class of the stepperpanel
|
||||
*/
|
||||
class: string;
|
||||
/**
|
||||
* Header click function.
|
||||
* @param {Event} event - Browser event
|
||||
*/
|
||||
clickCallback: (event: Event) => void;
|
||||
}): VNode[];
|
||||
/**
|
||||
* Custom content template.
|
||||
*/
|
||||
content(scope: {
|
||||
/**
|
||||
* Index of the stepperpanel
|
||||
*/
|
||||
index: number;
|
||||
/**
|
||||
* Current active state of the stepperpanel
|
||||
*/
|
||||
active: boolean;
|
||||
/**
|
||||
* Current highlighted state of the stepperpanel
|
||||
*/
|
||||
highlighted: boolean;
|
||||
/**
|
||||
* Style class of the stepperpanel
|
||||
*/
|
||||
class: string;
|
||||
/**
|
||||
* Content click function.
|
||||
* @param {Event} event - Browser event
|
||||
*/
|
||||
clickCallback: (event: Event) => void;
|
||||
/**
|
||||
* Content previous panel click function.
|
||||
* @param {Event} event - Browser event
|
||||
*/
|
||||
prevCallback: (event: Event) => void;
|
||||
/**
|
||||
* Content next panel click function.
|
||||
* @param {Event} event - Browser event
|
||||
*/
|
||||
nextCallback: (event: Event) => void;
|
||||
}): VNode[];
|
||||
/**
|
||||
* Custom separator template.
|
||||
*/
|
||||
separator(scope: {
|
||||
/**
|
||||
* Index of the stepperpanel
|
||||
*/
|
||||
index: number;
|
||||
/**
|
||||
* Current active state of the stepperpanel
|
||||
*/
|
||||
active: boolean;
|
||||
/**
|
||||
* Current highlighted state of the stepperpanel
|
||||
*/
|
||||
highlighted: boolean;
|
||||
/**
|
||||
* Style class of the stepperpanel
|
||||
*/
|
||||
class: string;
|
||||
}): VNode[];
|
||||
}
|
||||
|
||||
export interface StepperPanelEmits {}
|
||||
|
||||
/**
|
||||
* **PrimeVue - StepperPanel**
|
||||
*
|
||||
* _StepperPanel is a helper component for Stepper component._
|
||||
*
|
||||
* [Live Demo](https://www.primevue.org/stepper/)
|
||||
* --- ---
|
||||
* 
|
||||
*
|
||||
* @group Component
|
||||
*
|
||||
*/
|
||||
declare class StepperPanel extends ClassComponent<StepperPanelProps, StepperPanelSlots, StepperPanelEmits> {}
|
||||
|
||||
declare module '@vue/runtime-core' {
|
||||
interface GlobalComponents {
|
||||
StepperPanel: GlobalComponentConstructor<StepperPanel>;
|
||||
}
|
||||
}
|
||||
|
||||
export default StepperPanel;
|
Loading…
Add table
Add a link
Reference in a new issue