@vtex/admin-ui
Version:
> VTEX admin component library
97 lines (96 loc) • 4.17 kB
TypeScript
/// <reference types="react" />
export declare function useSegmentState(props?: SegmentInitialState): {
showPlaceholder: import("react").MutableRefObject<Record<string | number | symbol, any>>;
fieldValue: Date;
setFieldValue: import("react").Dispatch<import("react").SetStateAction<Date>>;
segments: DateSegment[];
dateFormatter: import("@internationalized/date").DateFormatter;
resetPlaceholder: () => void;
displayPlaceholder: () => void;
increment(part: Intl.DateTimeFormatPartTypes): void;
decrement(part: Intl.DateTimeFormatPartTypes): void;
incrementPage(part: Intl.DateTimeFormatPartTypes): void;
decrementPage(part: Intl.DateTimeFormatPartTypes): void;
setSegment(part: Intl.DateTimeFormatPartTypes, v: number): void;
baseId: string;
unstable_idCountRef: import("react").MutableRefObject<number>;
setBaseId: import("react").Dispatch<import("react").SetStateAction<string>>;
unstable_virtual: boolean;
rtl: boolean;
orientation?: "horizontal" | "vertical" | undefined;
items: import("reakit/ts/Composite/__utils/types").Item[];
groups: import("reakit/ts/Composite/__utils/types").Group[];
currentId?: string | null | undefined;
loop: boolean | "horizontal" | "vertical";
wrap: boolean | "horizontal" | "vertical";
shift: boolean;
unstable_moves: number;
unstable_hasActiveWidget: boolean;
unstable_includesBaseElement: boolean;
registerItem: (item: import("reakit/ts/Composite/__utils/types").Item) => void;
unregisterItem: (id: string) => void;
registerGroup: (group: import("reakit/ts/Composite/__utils/types").Group) => void;
unregisterGroup: (id: string) => void;
move: (id: string | null) => void;
next: (unstable_allTheWay?: boolean | undefined) => void;
previous: (unstable_allTheWay?: boolean | undefined) => void;
up: (unstable_allTheWay?: boolean | undefined) => void;
down: (unstable_allTheWay?: boolean | undefined) => void;
first: () => void;
last: () => void;
sort: () => void;
unstable_setVirtual: import("react").Dispatch<import("react").SetStateAction<boolean>>;
setRTL: import("react").Dispatch<import("react").SetStateAction<boolean>>;
setOrientation: import("react").Dispatch<import("react").SetStateAction<"horizontal" | "vertical" | undefined>>;
setCurrentId: import("react").Dispatch<import("react").SetStateAction<string | null | undefined>>;
setLoop: import("react").Dispatch<import("react").SetStateAction<boolean | "horizontal" | "vertical">>;
setWrap: import("react").Dispatch<import("react").SetStateAction<boolean | "horizontal" | "vertical">>;
setShift: import("react").Dispatch<import("react").SetStateAction<boolean>>;
reset: () => void;
unstable_setIncludesBaseElement: import("react").Dispatch<import("react").SetStateAction<boolean>>;
unstable_setHasActiveWidget: import("react").Dispatch<import("react").SetStateAction<boolean>>;
};
export interface ControllableState<T> {
/**
* value for uncontrolled mode
*/
defaultValue?: T;
/**
* value for controlled mode
*/
value?: T;
/**
* onChange for controlled mode
*/
onChange?: (value: T, ...args: any[]) => void;
}
export interface SegmentInitialState extends ControllableState<Date> {
/**
* Sets formmating of date based on Intl.DateFormatOptions
*
* https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat
*
* @example
* {
* year: "numeric",
* month: "2-digit",
* day: "2-digit",
* weekday: "long",
* }
*/
formatOptions?: Intl.DateTimeFormatOptions;
placeholder?: {
year: string;
month: string;
day: string;
};
}
export interface DateSegment {
type: Intl.DateTimeFormatPartTypes;
text: string;
value?: number;
minValue?: number;
maxValue?: number;
placeholder?: string;
}
export declare type SegmentStateReturn = ReturnType<typeof useSegmentState>;