@renderlesskit/react
Version:
Collection of headless components/hooks that are accessible, composable, customizable from low level to build your own UI & Design System powered by Reakit
98 lines (97 loc) • 4.28 kB
TypeScript
/**
* All credit goes to [React Spectrum](https://github.com/adobe/react-spectrum)
* We improved the Calendar from Stately [useCalendarState](https://github.com/adobe/react-spectrum/tree/main/packages/%40react-stately/calendar)
* to work with Reakit System
*/
/// <reference types="react" />
export interface DateSegment {
type: Intl.DateTimeFormatPartTypes;
text: string;
value?: number;
minValue?: number;
maxValue?: number;
isPlaceholder: boolean;
}
export declare type SegmentInitialState = {
/**
* Default segment value
*/
defaultValue?: Date;
/**
* Segment value
*/
value?: Date;
/**
* Callback to fire on value change
*/
onChange?: (value: Date, ...args: any[]) => void;
/**
* 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 date
*/
placeholderDate?: Date;
};
export declare function useSegmentState(props: SegmentInitialState): {
fieldValue: Date;
setFieldValue: (value: Date) => void;
segments: DateSegment[];
dateFormatter: import("@internationalized/date").DateFormatter;
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;
confirmPlaceholder(part: Intl.DateTimeFormatPartTypes): void;
baseId: string;
unstable_idCountRef: import("react").MutableRefObject<number>;
setBaseId: import("react").Dispatch<import("react").SetStateAction<string>>;
unstable_virtual: boolean;
rtl: boolean;
orientation?: import("reakit/ts/Composite/__utils/types").Orientation | undefined;
items: import("reakit/ts/Composite/__utils/types").Item[];
groups: import("reakit/ts/Composite/__utils/types").Group[];
currentId?: string | null | undefined;
loop: boolean | import("reakit/ts/Composite/__utils/types").Orientation;
wrap: boolean | import("reakit/ts/Composite/__utils/types").Orientation;
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<import("reakit/ts/Composite/__utils/types").Orientation | undefined>>;
setCurrentId: import("react").Dispatch<import("react").SetStateAction<string | null | undefined>>;
setLoop: import("react").Dispatch<import("react").SetStateAction<boolean | import("reakit/ts/Composite/__utils/types").Orientation>>;
setWrap: import("react").Dispatch<import("react").SetStateAction<boolean | import("reakit/ts/Composite/__utils/types").Orientation>>;
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 declare type SegmentStateReturn = ReturnType<typeof useSegmentState>;