@yamada-ui/stepper
Version:
Yamada UI stepper component
157 lines (154 loc) • 14.6 kB
TypeScript
import * as react from 'react';
import * as _yamada_ui_use_descendant from '@yamada-ui/use-descendant';
import { PropGetter, HTMLUIProps, CSSUIObject } from '@yamada-ui/core';
interface StepperContext extends Omit<UseStepperReturn, "descendants" | "getContainerProps"> {
styles: {
[key: string]: CSSUIObject | undefined;
};
}
declare const StepperDescendantsContextProvider: react.Provider<{
count: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => number;
destroy: () => void;
enabledCount: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => number;
enabledFirstValue: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
enabledIndexOf: (node?: HTMLDivElement | null | undefined, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => number;
enabledLastValue: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
enabledNextValue: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined, loop?: boolean) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
enabledPrevValue: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined, loop?: boolean) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
enabledValue: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
enabledValues: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}>[];
firstValue: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
indexOf: (node?: HTMLDivElement | null | undefined) => number;
lastValue: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
nextValue: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined, loop?: boolean) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
prevValue: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined, loop?: boolean) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
register: (nodeOrOptions?: HTMLDivElement | {
id?: string;
disabled?: boolean;
filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined;
} | null | undefined) => void | ((node: HTMLDivElement | null) => void);
unregister: (node?: HTMLDivElement | undefined) => void;
value: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
values: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}>[];
}>;
declare const useStepperDescendant: (options?: {
id?: string;
disabled?: boolean;
filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined;
} | undefined) => {
descendants: {
count: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => number;
destroy: () => void;
enabledCount: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => number;
enabledFirstValue: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
enabledIndexOf: (node?: HTMLDivElement | null | undefined, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => number;
enabledLastValue: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
enabledNextValue: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined, loop?: boolean) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
enabledPrevValue: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined, loop?: boolean) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
enabledValue: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
enabledValues: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}>[];
firstValue: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
indexOf: (node?: HTMLDivElement | null | undefined) => number;
lastValue: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
nextValue: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined, loop?: boolean) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
prevValue: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined, loop?: boolean) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
register: (nodeOrOptions?: HTMLDivElement | {
id?: string;
disabled?: boolean;
filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined;
} | null | undefined) => void | ((node: HTMLDivElement | null) => void);
unregister: (node?: HTMLDivElement | undefined) => void;
value: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
values: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}>[];
};
enabledIndex: number;
index: number;
register: (node: HTMLDivElement | null) => void;
};
declare const useStepperDescendants: () => {
count: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => number;
destroy: () => void;
enabledCount: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => number;
enabledFirstValue: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
enabledIndexOf: (node?: HTMLDivElement | null | undefined, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => number;
enabledLastValue: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
enabledNextValue: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined, loop?: boolean) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
enabledPrevValue: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined, loop?: boolean) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
enabledValue: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
enabledValues: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}>[];
firstValue: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
indexOf: (node?: HTMLDivElement | null | undefined) => number;
lastValue: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
nextValue: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined, loop?: boolean) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
prevValue: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined, loop?: boolean) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
register: (nodeOrOptions?: HTMLDivElement | {
id?: string;
disabled?: boolean;
filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined;
} | null | undefined) => void | ((node: HTMLDivElement | null) => void);
unregister: (node?: HTMLDivElement | undefined) => void;
value: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
values: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}>[];
};
declare const StepperProvider: react.Provider<StepperContext>;
declare const useStepperContext: () => StepperContext;
interface UseStepperProps extends HTMLUIProps {
/**
* The active step index.
*/
index: number;
/**
* The orientation of the stepper.
*
* @default 'horizontal'
*/
orientation?: "horizontal" | "vertical";
/**
* Whether to show or not the last separator while in vertical orientation.
*
* @default false
*/
showLastSeparator?: boolean;
}
declare const useStepper: ({ index, orientation, showLastSeparator, ...rest }: UseStepperProps) => {
descendants: {
count: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => number;
destroy: () => void;
enabledCount: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => number;
enabledFirstValue: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
enabledIndexOf: (node?: HTMLDivElement | null | undefined, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => number;
enabledLastValue: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
enabledNextValue: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined, loop?: boolean) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
enabledPrevValue: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined, loop?: boolean) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
enabledValue: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
enabledValues: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}>[];
firstValue: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
indexOf: (node?: HTMLDivElement | null | undefined) => number;
lastValue: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
nextValue: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined, loop?: boolean) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
prevValue: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined, loop?: boolean) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
register: (nodeOrOptions?: HTMLDivElement | {
id?: string;
disabled?: boolean;
filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined;
} | null | undefined) => void | ((node: HTMLDivElement | null) => void);
unregister: (node?: HTMLDivElement | undefined) => void;
value: (index: number, filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}> | undefined;
values: (filter?: _yamada_ui_use_descendant.FilterDescendant<HTMLDivElement, {}> | undefined) => _yamada_ui_use_descendant.Descendant<HTMLDivElement, {}>[];
};
getStepStatus: (step: number) => "active" | "complete" | "incomplete";
index: number;
orientation: "vertical" | "horizontal";
showLastSeparator: boolean;
getContainerProps: PropGetter<"div", undefined>;
};
type UseStepperReturn = ReturnType<typeof useStepper>;
declare const useStep: () => {
index: number;
isFirst: boolean;
isLast: boolean;
status: "active" | "complete" | "incomplete";
getStepProps: PropGetter<"div", undefined>;
};
type UseStepReturn = ReturnType<typeof useStep>;
export { StepperDescendantsContextProvider, StepperProvider, type UseStepReturn, type UseStepperProps, type UseStepperReturn, useStep, useStepper, useStepperContext, useStepperDescendant, useStepperDescendants };