@stenajs-webui/calendar 17.6.0 → 17.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +12 -0
- package/dist/components/calendar/Calendar.d.ts +3 -3
- package/dist/components/calendar/CalendarMonth.d.ts +16 -16
- package/dist/components/calendar/CalendarMonthWithMonthTextHeader.d.ts +6 -6
- package/dist/components/calendar/CalendarTheme.d.ts +57 -57
- package/dist/components/calendar/CalendarWeek.d.ts +18 -18
- package/dist/components/calendar/DisabledDayWrapper.d.ts +7 -7
- package/dist/components/calendar/renderers/CalendarDay.d.ts +3 -3
- package/dist/components/calendar/renderers/WeekDayCell.d.ts +10 -10
- package/dist/components/calendar/renderers/WeekNumberCell.d.ts +13 -13
- package/dist/components/calendar-types/date-range-calendar/DateRangeCalendar.d.ts +11 -11
- package/dist/components/calendar-types/date-range-calendar/hooks/UseDateRangeCalendarState.d.ts +10 -10
- package/dist/components/calendar-types/date-range-calendar/hooks/UseDateRangeSelection.d.ts +3 -3
- package/dist/components/calendar-types/date-range-exclusion-calendar/DateRangeExclusionCalendar.d.ts +7 -7
- package/dist/components/calendar-types/date-range-exclusion-calendar/UseDateRangeExclusionSelection.d.ts +3 -3
- package/dist/components/calendar-types/multi-date-calendar/MultiDateCalendar.d.ts +8 -8
- package/dist/components/calendar-types/multi-date-calendar/UseMultiDateSelection.d.ts +3 -3
- package/dist/components/calendar-types/single-date-calendar/SingleDateCalendar.d.ts +7 -7
- package/dist/components/calendar-types/single-date-calendar/UseSingleDateSelection.d.ts +3 -3
- package/dist/components/calendar-types/single-week-calendar/SingleWeekCalendar.d.ts +8 -8
- package/dist/components/calendar-types/single-week-calendar/UseSingleWeekSelection.d.ts +3 -3
- package/dist/components/input-types/date-input/DateInput.d.ts +52 -52
- package/dist/components/input-types/date-input/UseDateInput.d.ts +6 -6
- package/dist/components/input-types/date-range-dual-text-input/DateRangeDualTextInput.d.ts +15 -15
- package/dist/components/input-types/date-range-dual-text-input/hooks/UseDateRangeEffects.d.ts +2 -2
- package/dist/components/input-types/date-range-dual-text-input/hooks/UseDateRangeHandlers.d.ts +11 -11
- package/dist/components/input-types/date-range-dual-text-input/hooks/UseInputStates.d.ts +17 -17
- package/dist/components/input-types/date-range-dual-text-input/hooks/UseUserInputHandlers.d.ts +13 -13
- package/dist/components/input-types/date-range-input/DateRangeInput.d.ts +51 -51
- package/dist/components/input-types/date-range-input/hooks/UseDateRangeInput.d.ts +16 -16
- package/dist/components/input-types/date-text-input/DateTextInput.d.ts +28 -28
- package/dist/components/input-types/date-time-input/DateTimeInput.d.ts +12 -12
- package/dist/components/input-types/date-time-input/hooks/UseDateRangeEffects.d.ts +2 -2
- package/dist/components/input-types/date-time-input/hooks/UseDateRangeHandlers.d.ts +11 -11
- package/dist/components/input-types/date-time-input/hooks/UseInputStates.d.ts +22 -22
- package/dist/components/input-types/date-time-input/hooks/UseUserInputHandlers.d.ts +12 -12
- package/dist/components/input-types/time-text-input/TimeTextInput.d.ts +15 -15
- package/dist/config/DefaultMaxDate.d.ts +1 -1
- package/dist/config/DefaultPopoverPlacement.d.ts +2 -2
- package/dist/features/calendar-with-month-year-pickers/CalendarPanelType.d.ts +1 -1
- package/dist/features/calendar-with-month-year-pickers/CalendarWithMonthYearPickers.d.ts +13 -13
- package/dist/features/date-range/hooks/UseDateRangeOnClickDayHandler.d.ts +4 -4
- package/dist/features/dual-text-input/DualTextInput.d.ts +44 -44
- package/dist/features/internal-panel-state/UseCalendarPopoverUpdater.d.ts +4 -4
- package/dist/features/internal-panel-state/UseInternalPanelState.d.ts +9 -9
- package/dist/features/month-picker/MonthPicker.d.ts +6 -6
- package/dist/features/month-picker/MonthPickerCell.d.ts +8 -8
- package/dist/features/month-switcher/CalendarWithMonthSwitcher.d.ts +15 -15
- package/dist/features/month-switcher/MonthSwitcherBelow.d.ts +12 -12
- package/dist/features/month-switcher/hooks/UseSelectedMonthStepperLogic.d.ts +6 -6
- package/dist/features/preset-picker/CalendarPreset.d.ts +14 -14
- package/dist/features/preset-picker/PresetFactory.d.ts +2 -2
- package/dist/features/preset-picker/PresetPicker.d.ts +6 -6
- package/dist/features/time-picker/TimePicker.d.ts +5 -5
- package/dist/features/time-picker/TimePickerCell.d.ts +10 -10
- package/dist/features/time-picker/TimePickerColumn.d.ts +10 -10
- package/dist/features/today-state/UseHighlightToday.d.ts +2 -2
- package/dist/features/year-picker/YearPicker.d.ts +6 -6
- package/dist/features/year-picker/YearPickerCell.d.ts +7 -7
- package/dist/index.d.ts +32 -32
- package/dist/index.es.js +2866 -2058
- package/dist/index.es.js.map +1 -1
- package/dist/index.js +1 -2148
- package/dist/index.js.map +1 -1
- package/dist/types/CalendarTypes.d.ts +133 -133
- package/dist/types/DateRange.d.ts +16 -16
- package/dist/types/InternalPanelAndFocusStateProps.d.ts +3 -3
- package/dist/util/calendar/CalendarDataFactory.d.ts +64 -64
- package/dist/util/calendar/StateHelper.d.ts +3 -3
- package/dist/util/calendar/StateModifier.d.ts +11 -11
- package/dist/util/date/DateFormats.d.ts +11 -11
- package/dist/util/date/DateListTools.d.ts +3 -3
- package/dist/util/date/DateMinMaxValidator.d.ts +1 -1
- package/dist/util/date-range/DateRangeTransformer.d.ts +3 -3
- package/dist/util/date-range/DateRangeValidator.d.ts +4 -4
- package/dist/util/time/OverlappingTimesValidator.d.ts +11 -11
- package/dist/util/time/TimeStringFormatValidator.d.ts +8 -8
- package/dist/util/time/TimeTransformer.d.ts +8 -8
- package/package.json +10 -11
- package/dist/components/calendar-types/date-range-calendar/DateRangeCalendar.stories.d.ts +0 -20
- package/dist/components/calendar-types/date-range-exclusion-calendar/DateRangeExclusionCalendar.stories.d.ts +0 -17
- package/dist/components/calendar-types/multi-date-calendar/MultiDateCalendar.stories.d.ts +0 -15
- package/dist/components/calendar-types/multi-date-calendar/__tests__/UseMultiDateSelection.test.d.ts +0 -1
- package/dist/components/calendar-types/single-date-calendar/SingleDateCalendar.stories.d.ts +0 -17
- package/dist/components/calendar-types/single-week-calendar/SingleWeekCalendar.stories.d.ts +0 -8
- package/dist/components/input-types/date-input/DateInput.stories.d.ts +0 -19
- package/dist/components/input-types/date-range-dual-text-input/DateRangeDualTextInput.stories.d.ts +0 -18
- package/dist/components/input-types/date-range-input/DateRangeInput.stories.d.ts +0 -17
- package/dist/components/input-types/date-text-input/DateTextInput.stories.d.ts +0 -19
- package/dist/components/input-types/date-time-input/DateTimeInput.stories.d.ts +0 -14
- package/dist/components/input-types/time-text-input/TimeTextInput.stories.d.ts +0 -15
- package/dist/features/month-picker/MonthPicker.stories.d.ts +0 -7
- package/dist/features/preset-picker/PresetPicker.stories.d.ts +0 -7
- package/dist/features/time-picker/TimePicker.stories.d.ts +0 -7
- package/dist/features/year-picker/YearPicker.stories.d.ts +0 -12
- package/dist/util/calendar/__tests__/CalendarDataFactory.test.d.ts +0 -1
- package/dist/util/calendar/__tests__/StateHelper.test.d.ts +0 -1
- package/dist/util/calendar/__tests__/StateModifier.test.d.ts +0 -1
- package/dist/util/date/__tests__/DateListTools.test.d.ts +0 -1
- package/dist/util/date/__tests__/DateMinMaxValidator.test.d.ts +0 -1
- package/dist/util/date-range/__tests__/DateRangeValidator.test.d.ts +0 -1
- package/dist/util/time/__tests__/OverlappingTimesValidator.test.d.ts +0 -1
- package/dist/util/time/__tests__/TimeStringFormatValidator.test.d.ts +0 -1
- package/dist/util/time/__tests__/TimeTransformer.test.d.ts +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,15 @@
|
|
|
1
|
+
# v17.7.0 (Fri Jul 01 2022)
|
|
2
|
+
|
|
3
|
+
#### 🚀 Enhancement
|
|
4
|
+
|
|
5
|
+
- Build packages with vite [#475](https://github.com/StenaIT/stenajs-webui/pull/475) ([@lindskogen](https://github.com/lindskogen))
|
|
6
|
+
|
|
7
|
+
#### Authors: 1
|
|
8
|
+
|
|
9
|
+
- Johan Lindskogen ([@lindskogen](https://github.com/lindskogen))
|
|
10
|
+
|
|
11
|
+
---
|
|
12
|
+
|
|
1
13
|
# v17.6.0 (Fri Jul 01 2022)
|
|
2
14
|
|
|
3
15
|
#### 🚀 Enhancement
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { CalendarProps } from "../../types/CalendarTypes";
|
|
3
|
-
export declare function Calendar<T extends {}>(props: CalendarProps<T>): JSX.Element;
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { CalendarProps } from "../../types/CalendarTypes";
|
|
3
|
+
export declare function Calendar<T extends {}>(props: CalendarProps<T>): JSX.Element;
|
|
@@ -1,16 +1,16 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import { CalendarDayProps, CalendarOnClicks, CalendarUserMonthData, DayState, DayStateHighlight, ExtraDayContentProps, OptionalMinMaxDates, Renderers } from "../../types/CalendarTypes";
|
|
3
|
-
import { MonthData } from "../../util/calendar/CalendarDataFactory";
|
|
4
|
-
import { CalendarTheme } from "./CalendarTheme";
|
|
5
|
-
export interface CalendarMonthProps<T> extends CalendarOnClicks<T>, Renderers, OptionalMinMaxDates {
|
|
6
|
-
month: MonthData;
|
|
7
|
-
dayComponent?: React.ComponentType<CalendarDayProps<T>>;
|
|
8
|
-
userDataPerWeek?: CalendarUserMonthData<T>;
|
|
9
|
-
statePerWeek?: CalendarUserMonthData<DayState>;
|
|
10
|
-
theme?: CalendarTheme;
|
|
11
|
-
headerLeftContent?: React.ReactElement<{}>;
|
|
12
|
-
headerRightContent?: React.ReactElement<{}>;
|
|
13
|
-
extraDayContent?: React.ComponentType<ExtraDayContentProps<T>>;
|
|
14
|
-
defaultHighlights?: Array<DayStateHighlight>;
|
|
15
|
-
}
|
|
16
|
-
export declare function CalendarMonth<T>({ month, dayComponent, statePerWeek, userDataPerWeek, minDate, maxDate, onClickDay, onClickWeek, onClickWeekDay, onClickMonth, onClickYear, renderWeekNumber, renderWeekDay, headerLeftContent, headerRightContent, theme, extraDayContent, defaultHighlights, }: CalendarMonthProps<T>): JSX.Element;
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { CalendarDayProps, CalendarOnClicks, CalendarUserMonthData, DayState, DayStateHighlight, ExtraDayContentProps, OptionalMinMaxDates, Renderers } from "../../types/CalendarTypes";
|
|
3
|
+
import { MonthData } from "../../util/calendar/CalendarDataFactory";
|
|
4
|
+
import { CalendarTheme } from "./CalendarTheme";
|
|
5
|
+
export interface CalendarMonthProps<T> extends CalendarOnClicks<T>, Renderers, OptionalMinMaxDates {
|
|
6
|
+
month: MonthData;
|
|
7
|
+
dayComponent?: React.ComponentType<CalendarDayProps<T>>;
|
|
8
|
+
userDataPerWeek?: CalendarUserMonthData<T>;
|
|
9
|
+
statePerWeek?: CalendarUserMonthData<DayState>;
|
|
10
|
+
theme?: CalendarTheme;
|
|
11
|
+
headerLeftContent?: React.ReactElement<{}>;
|
|
12
|
+
headerRightContent?: React.ReactElement<{}>;
|
|
13
|
+
extraDayContent?: React.ComponentType<ExtraDayContentProps<T>>;
|
|
14
|
+
defaultHighlights?: Array<DayStateHighlight>;
|
|
15
|
+
}
|
|
16
|
+
export declare function CalendarMonth<T>({ month, dayComponent, statePerWeek, userDataPerWeek, minDate, maxDate, onClickDay, onClickWeek, onClickWeekDay, onClickMonth, onClickYear, renderWeekNumber, renderWeekDay, headerLeftContent, headerRightContent, theme, extraDayContent, defaultHighlights, }: CalendarMonthProps<T>): JSX.Element;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { CalendarMonthProps } from "./CalendarMonth";
|
|
3
|
-
interface CalendarMonthWithMonthTextHeaderProps<T> extends CalendarMonthProps<T> {
|
|
4
|
-
}
|
|
5
|
-
export declare function CalendarMonthWithMonthTextHeader<T>(props: CalendarMonthWithMonthTextHeaderProps<T>): JSX.Element;
|
|
6
|
-
export {};
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { CalendarMonthProps } from "./CalendarMonth";
|
|
3
|
+
interface CalendarMonthWithMonthTextHeaderProps<T> extends CalendarMonthProps<T> {
|
|
4
|
+
}
|
|
5
|
+
export declare function CalendarMonthWithMonthTextHeader<T>(props: CalendarMonthWithMonthTextHeaderProps<T>): JSX.Element;
|
|
6
|
+
export {};
|
|
@@ -1,57 +1,57 @@
|
|
|
1
|
-
import { IconDefinition } from "@fortawesome/fontawesome-svg-core";
|
|
2
|
-
import { TextProps } from "@stenajs-webui/core";
|
|
3
|
-
import { CSSProperties } from "react";
|
|
4
|
-
import { DayState, DayStateHighlight } from "../../types/CalendarTypes";
|
|
5
|
-
import { DayData, MonthData, WeekData } from "../../util/calendar/CalendarDataFactory";
|
|
6
|
-
export interface CalendarTheme<TUserData = {}> {
|
|
7
|
-
width: string;
|
|
8
|
-
height: string;
|
|
9
|
-
WeekNumber: WeekNumberTheme;
|
|
10
|
-
WeekDay: WeekDayTheme;
|
|
11
|
-
CalendarDay: CalendarDayTheme<TUserData>;
|
|
12
|
-
CalendarMonth: CalendarMonthTheme;
|
|
13
|
-
}
|
|
14
|
-
export interface WeekNumberTheme {
|
|
15
|
-
backgroundColor: string;
|
|
16
|
-
textColor?: string;
|
|
17
|
-
clickableTextColor?: string;
|
|
18
|
-
show?: boolean;
|
|
19
|
-
}
|
|
20
|
-
export interface CalendarMonthTheme {
|
|
21
|
-
headerTextColor?: string;
|
|
22
|
-
cellSpacing?: string;
|
|
23
|
-
headerLeftIcon?: IconDefinition;
|
|
24
|
-
headerRightIcon?: IconDefinition;
|
|
25
|
-
}
|
|
26
|
-
export interface WeekDayTheme {
|
|
27
|
-
textColor?: string;
|
|
28
|
-
clickableTextColor?: string;
|
|
29
|
-
}
|
|
30
|
-
export declare type CalendarStyleProvider<TUserData, TResult> = (defaultHighlights: Array<DayStateHighlight> | undefined, dayState: DayState | undefined, day: DayData, week: WeekData, month: MonthData, userData?: TUserData) => TResult;
|
|
31
|
-
export declare type CalendarWrapperStyleProvider<TUserData> = CalendarStyleProvider<TUserData, CSSProperties | undefined>;
|
|
32
|
-
declare type TextPropsProvider<TUserData> = CalendarStyleProvider<TUserData, TextProps | undefined>;
|
|
33
|
-
export interface CalendarDayTheme<TUserData> {
|
|
34
|
-
tdStyle?: CalendarWrapperStyleProvider<TUserData>;
|
|
35
|
-
innerWrapperStyle?: CalendarWrapperStyleProvider<TUserData>;
|
|
36
|
-
cellWrapperStyle?: CalendarWrapperStyleProvider<TUserData>;
|
|
37
|
-
textProps?: TextPropsProvider<TUserData>;
|
|
38
|
-
}
|
|
39
|
-
export interface CalendarDefaultWrapperColors {
|
|
40
|
-
selectedBackground: string;
|
|
41
|
-
rangeBackground: string;
|
|
42
|
-
todayBackground: string;
|
|
43
|
-
borderColor?: string;
|
|
44
|
-
borderRadius?: string;
|
|
45
|
-
rangeBorderRadius?: string;
|
|
46
|
-
}
|
|
47
|
-
export declare const defaultWrapperStyleProvider: ({ selectedBackground, todayBackground, rangeBackground, borderColor, }: CalendarDefaultWrapperColors) => CalendarWrapperStyleProvider<{}>;
|
|
48
|
-
interface DefaultTextColors {
|
|
49
|
-
disabledColor: string;
|
|
50
|
-
inOtherMonthColor: string;
|
|
51
|
-
selectedColor: string;
|
|
52
|
-
rangeTextColor?: string;
|
|
53
|
-
}
|
|
54
|
-
export declare const defaultTextPropsProvider: ({ selectedColor, disabledColor, inOtherMonthColor, rangeTextColor, }: DefaultTextColors) => TextPropsProvider<{}>;
|
|
55
|
-
export declare const defaultCalendarTheme: CalendarTheme;
|
|
56
|
-
export declare const extranetCalendarTheme: CalendarTheme;
|
|
57
|
-
export {};
|
|
1
|
+
import { IconDefinition } from "@fortawesome/fontawesome-svg-core";
|
|
2
|
+
import { TextProps } from "@stenajs-webui/core";
|
|
3
|
+
import { CSSProperties } from "react";
|
|
4
|
+
import { DayState, DayStateHighlight } from "../../types/CalendarTypes";
|
|
5
|
+
import { DayData, MonthData, WeekData } from "../../util/calendar/CalendarDataFactory";
|
|
6
|
+
export interface CalendarTheme<TUserData = {}> {
|
|
7
|
+
width: string;
|
|
8
|
+
height: string;
|
|
9
|
+
WeekNumber: WeekNumberTheme;
|
|
10
|
+
WeekDay: WeekDayTheme;
|
|
11
|
+
CalendarDay: CalendarDayTheme<TUserData>;
|
|
12
|
+
CalendarMonth: CalendarMonthTheme;
|
|
13
|
+
}
|
|
14
|
+
export interface WeekNumberTheme {
|
|
15
|
+
backgroundColor: string;
|
|
16
|
+
textColor?: string;
|
|
17
|
+
clickableTextColor?: string;
|
|
18
|
+
show?: boolean;
|
|
19
|
+
}
|
|
20
|
+
export interface CalendarMonthTheme {
|
|
21
|
+
headerTextColor?: string;
|
|
22
|
+
cellSpacing?: string;
|
|
23
|
+
headerLeftIcon?: IconDefinition;
|
|
24
|
+
headerRightIcon?: IconDefinition;
|
|
25
|
+
}
|
|
26
|
+
export interface WeekDayTheme {
|
|
27
|
+
textColor?: string;
|
|
28
|
+
clickableTextColor?: string;
|
|
29
|
+
}
|
|
30
|
+
export declare type CalendarStyleProvider<TUserData, TResult> = (defaultHighlights: Array<DayStateHighlight> | undefined, dayState: DayState | undefined, day: DayData, week: WeekData, month: MonthData, userData?: TUserData) => TResult;
|
|
31
|
+
export declare type CalendarWrapperStyleProvider<TUserData> = CalendarStyleProvider<TUserData, CSSProperties | undefined>;
|
|
32
|
+
declare type TextPropsProvider<TUserData> = CalendarStyleProvider<TUserData, TextProps | undefined>;
|
|
33
|
+
export interface CalendarDayTheme<TUserData> {
|
|
34
|
+
tdStyle?: CalendarWrapperStyleProvider<TUserData>;
|
|
35
|
+
innerWrapperStyle?: CalendarWrapperStyleProvider<TUserData>;
|
|
36
|
+
cellWrapperStyle?: CalendarWrapperStyleProvider<TUserData>;
|
|
37
|
+
textProps?: TextPropsProvider<TUserData>;
|
|
38
|
+
}
|
|
39
|
+
export interface CalendarDefaultWrapperColors {
|
|
40
|
+
selectedBackground: string;
|
|
41
|
+
rangeBackground: string;
|
|
42
|
+
todayBackground: string;
|
|
43
|
+
borderColor?: string;
|
|
44
|
+
borderRadius?: string;
|
|
45
|
+
rangeBorderRadius?: string;
|
|
46
|
+
}
|
|
47
|
+
export declare const defaultWrapperStyleProvider: ({ selectedBackground, todayBackground, rangeBackground, borderColor, }: CalendarDefaultWrapperColors) => CalendarWrapperStyleProvider<{}>;
|
|
48
|
+
interface DefaultTextColors {
|
|
49
|
+
disabledColor: string;
|
|
50
|
+
inOtherMonthColor: string;
|
|
51
|
+
selectedColor: string;
|
|
52
|
+
rangeTextColor?: string;
|
|
53
|
+
}
|
|
54
|
+
export declare const defaultTextPropsProvider: ({ selectedColor, disabledColor, inOtherMonthColor, rangeTextColor, }: DefaultTextColors) => TextPropsProvider<{}>;
|
|
55
|
+
export declare const defaultCalendarTheme: CalendarTheme;
|
|
56
|
+
export declare const extranetCalendarTheme: CalendarTheme;
|
|
57
|
+
export {};
|
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import { CalendarDayProps, CalendarUserWeekData, DayState, DayStateHighlight, ExtraDayContentProps, OnClickDay, OnClickWeek, OptionalMinMaxDates, RenderWeekNumber } from "../../types/CalendarTypes";
|
|
3
|
-
import { MonthData, WeekData } from "../../util/calendar/CalendarDataFactory";
|
|
4
|
-
import { CalendarTheme } from "./CalendarTheme";
|
|
5
|
-
export interface CalendarWeekProps<T> extends OptionalMinMaxDates {
|
|
6
|
-
dayComponent: React.ComponentType<CalendarDayProps<T>>;
|
|
7
|
-
week: WeekData;
|
|
8
|
-
month: MonthData;
|
|
9
|
-
statePerWeekDay?: CalendarUserWeekData<DayState>;
|
|
10
|
-
userDataPerWeekDay?: CalendarUserWeekData<T>;
|
|
11
|
-
onClickWeek?: OnClickWeek;
|
|
12
|
-
onClickDay?: OnClickDay<T>;
|
|
13
|
-
theme: CalendarTheme;
|
|
14
|
-
renderWeekNumber?: RenderWeekNumber;
|
|
15
|
-
extraDayContent?: React.ComponentType<ExtraDayContentProps<T>>;
|
|
16
|
-
defaultHighlights?: Array<DayStateHighlight>;
|
|
17
|
-
}
|
|
18
|
-
export declare function CalendarWeek<T>({ week, month, dayComponent, statePerWeekDay, userDataPerWeekDay, minDate, maxDate, onClickWeek, onClickDay, theme, renderWeekNumber, extraDayContent, defaultHighlights, }: CalendarWeekProps<T>): JSX.Element;
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { CalendarDayProps, CalendarUserWeekData, DayState, DayStateHighlight, ExtraDayContentProps, OnClickDay, OnClickWeek, OptionalMinMaxDates, RenderWeekNumber } from "../../types/CalendarTypes";
|
|
3
|
+
import { MonthData, WeekData } from "../../util/calendar/CalendarDataFactory";
|
|
4
|
+
import { CalendarTheme } from "./CalendarTheme";
|
|
5
|
+
export interface CalendarWeekProps<T> extends OptionalMinMaxDates {
|
|
6
|
+
dayComponent: React.ComponentType<CalendarDayProps<T>>;
|
|
7
|
+
week: WeekData;
|
|
8
|
+
month: MonthData;
|
|
9
|
+
statePerWeekDay?: CalendarUserWeekData<DayState>;
|
|
10
|
+
userDataPerWeekDay?: CalendarUserWeekData<T>;
|
|
11
|
+
onClickWeek?: OnClickWeek;
|
|
12
|
+
onClickDay?: OnClickDay<T>;
|
|
13
|
+
theme: CalendarTheme;
|
|
14
|
+
renderWeekNumber?: RenderWeekNumber;
|
|
15
|
+
extraDayContent?: React.ComponentType<ExtraDayContentProps<T>>;
|
|
16
|
+
defaultHighlights?: Array<DayStateHighlight>;
|
|
17
|
+
}
|
|
18
|
+
export declare function CalendarWeek<T>({ week, month, dayComponent, statePerWeekDay, userDataPerWeekDay, minDate, maxDate, onClickWeek, onClickDay, theme, renderWeekNumber, extraDayContent, defaultHighlights, }: CalendarWeekProps<T>): JSX.Element;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import { CalendarDayProps, OptionalMinMaxDates } from "../../types/CalendarTypes";
|
|
3
|
-
interface DisabledDayWrapperProps<T> extends CalendarDayProps<T>, OptionalMinMaxDates {
|
|
4
|
-
dayComponent: React.ComponentType<CalendarDayProps<T>>;
|
|
5
|
-
}
|
|
6
|
-
export declare const DisabledDayWrapper: <T>({ dayComponent: DayComponent, minDate, maxDate, dayState, day, ...props }: DisabledDayWrapperProps<T>) => JSX.Element;
|
|
7
|
-
export {};
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { CalendarDayProps, OptionalMinMaxDates } from "../../types/CalendarTypes";
|
|
3
|
+
interface DisabledDayWrapperProps<T> extends CalendarDayProps<T>, OptionalMinMaxDates {
|
|
4
|
+
dayComponent: React.ComponentType<CalendarDayProps<T>>;
|
|
5
|
+
}
|
|
6
|
+
export declare const DisabledDayWrapper: <T>({ dayComponent: DayComponent, minDate, maxDate, dayState, day, ...props }: DisabledDayWrapperProps<T>) => JSX.Element;
|
|
7
|
+
export {};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { CalendarDayProps } from "../../../types/CalendarTypes";
|
|
3
|
-
export declare const CalendarDay: <T extends {}>({ day, week, month, dayState, userData, onClickDay, theme, extraDayContent: ExtraDayContent, defaultHighlights, }: CalendarDayProps<T>) => JSX.Element;
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { CalendarDayProps } from "../../../types/CalendarTypes";
|
|
3
|
+
export declare const CalendarDay: <T extends {}>({ day, week, month, dayState, userData, onClickDay, theme, extraDayContent: ExtraDayContent, defaultHighlights, }: CalendarDayProps<T>) => JSX.Element;
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { OnClickWeekDay } from "../../../types/CalendarTypes";
|
|
3
|
-
import { DayData } from "../../../util/calendar/CalendarDataFactory";
|
|
4
|
-
import { CalendarTheme } from "../CalendarTheme";
|
|
5
|
-
export interface WeekDayCellProps {
|
|
6
|
-
onClickWeekDay?: OnClickWeekDay;
|
|
7
|
-
day: DayData;
|
|
8
|
-
theme: CalendarTheme;
|
|
9
|
-
}
|
|
10
|
-
export declare const WeekDayCell: ({ onClickWeekDay, day, theme, }: WeekDayCellProps) => JSX.Element;
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { OnClickWeekDay } from "../../../types/CalendarTypes";
|
|
3
|
+
import { DayData } from "../../../util/calendar/CalendarDataFactory";
|
|
4
|
+
import { CalendarTheme } from "../CalendarTheme";
|
|
5
|
+
export interface WeekDayCellProps {
|
|
6
|
+
onClickWeekDay?: OnClickWeekDay;
|
|
7
|
+
day: DayData;
|
|
8
|
+
theme: CalendarTheme;
|
|
9
|
+
}
|
|
10
|
+
export declare const WeekDayCell: ({ onClickWeekDay, day, theme, }: WeekDayCellProps) => JSX.Element;
|
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import { OnClickWeek } from "../../../types/CalendarTypes";
|
|
3
|
-
import { WeekData } from "../../../util/calendar/CalendarDataFactory";
|
|
4
|
-
import { CalendarTheme } from "../CalendarTheme";
|
|
5
|
-
export interface WeekNumberCellProps {
|
|
6
|
-
week: WeekData;
|
|
7
|
-
onClickWeek?: OnClickWeek;
|
|
8
|
-
theme: CalendarTheme;
|
|
9
|
-
background?: JSX.Element;
|
|
10
|
-
prefix?: string;
|
|
11
|
-
backgroundColor?: string;
|
|
12
|
-
}
|
|
13
|
-
export declare const WeekNumberCell: React.FC<WeekNumberCellProps>;
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { OnClickWeek } from "../../../types/CalendarTypes";
|
|
3
|
+
import { WeekData } from "../../../util/calendar/CalendarDataFactory";
|
|
4
|
+
import { CalendarTheme } from "../CalendarTheme";
|
|
5
|
+
export interface WeekNumberCellProps {
|
|
6
|
+
week: WeekData;
|
|
7
|
+
onClickWeek?: OnClickWeek;
|
|
8
|
+
theme: CalendarTheme;
|
|
9
|
+
background?: JSX.Element;
|
|
10
|
+
prefix?: string;
|
|
11
|
+
backgroundColor?: string;
|
|
12
|
+
}
|
|
13
|
+
export declare const WeekNumberCell: React.FC<WeekNumberCellProps>;
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { InternalPanelAndFocusStateProps } from "../../../types/InternalPanelAndFocusStateProps";
|
|
3
|
-
import { ValueAndOnValueChangeProps } from "@stenajs-webui/forms";
|
|
4
|
-
import { DateRange } from "../../../types/DateRange";
|
|
5
|
-
export declare type DateRangeFocusedInput = "startDate" | "endDate" | undefined;
|
|
6
|
-
export interface DateRangeCalendarProps<T> extends InternalPanelAndFocusStateProps<T>, ValueAndOnValueChangeProps<DateRange> {
|
|
7
|
-
focusedInput?: DateRangeFocusedInput;
|
|
8
|
-
setFocusedInput: (focusedInput: DateRangeFocusedInput) => void;
|
|
9
|
-
}
|
|
10
|
-
export declare function DateRangeCalendar<T extends {}>(props: DateRangeCalendarProps<T>): JSX.Element;
|
|
11
|
-
export declare type DateRangeInputCalendarProps<T> = Omit<DateRangeCalendarProps<T>, "startDateInFocus" | "value" | "onValueChange" | "focusedInput" | "setFocusedInput" | "theme" | "currentPanel" | "setCurrentPanel">;
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { InternalPanelAndFocusStateProps } from "../../../types/InternalPanelAndFocusStateProps";
|
|
3
|
+
import { ValueAndOnValueChangeProps } from "@stenajs-webui/forms";
|
|
4
|
+
import { DateRange } from "../../../types/DateRange";
|
|
5
|
+
export declare type DateRangeFocusedInput = "startDate" | "endDate" | undefined;
|
|
6
|
+
export interface DateRangeCalendarProps<T> extends InternalPanelAndFocusStateProps<T>, ValueAndOnValueChangeProps<DateRange> {
|
|
7
|
+
focusedInput?: DateRangeFocusedInput;
|
|
8
|
+
setFocusedInput: (focusedInput: DateRangeFocusedInput) => void;
|
|
9
|
+
}
|
|
10
|
+
export declare function DateRangeCalendar<T extends {}>(props: DateRangeCalendarProps<T>): JSX.Element;
|
|
11
|
+
export declare type DateRangeInputCalendarProps<T> = Omit<DateRangeCalendarProps<T>, "startDateInFocus" | "value" | "onValueChange" | "focusedInput" | "setFocusedInput" | "theme" | "currentPanel" | "setCurrentPanel">;
|
package/dist/components/calendar-types/date-range-calendar/hooks/UseDateRangeCalendarState.d.ts
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { DateRangeFocusedInput } from "../DateRangeCalendar";
|
|
3
|
-
export declare const useDateRangeCalendarState: () => {
|
|
4
|
-
startDate: Date | undefined;
|
|
5
|
-
setStartDate: import("react").Dispatch<import("react").SetStateAction<Date | undefined>>;
|
|
6
|
-
endDate: Date | undefined;
|
|
7
|
-
setEndDate: import("react").Dispatch<import("react").SetStateAction<Date | undefined>>;
|
|
8
|
-
focusedInput: DateRangeFocusedInput;
|
|
9
|
-
setFocusedInput: import("react").Dispatch<import("react").SetStateAction<DateRangeFocusedInput>>;
|
|
10
|
-
};
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { DateRangeFocusedInput } from "../DateRangeCalendar";
|
|
3
|
+
export declare const useDateRangeCalendarState: () => {
|
|
4
|
+
startDate: Date | undefined;
|
|
5
|
+
setStartDate: import("react").Dispatch<import("react").SetStateAction<Date | undefined>>;
|
|
6
|
+
endDate: Date | undefined;
|
|
7
|
+
setEndDate: import("react").Dispatch<import("react").SetStateAction<Date | undefined>>;
|
|
8
|
+
focusedInput: DateRangeFocusedInput;
|
|
9
|
+
setFocusedInput: import("react").Dispatch<import("react").SetStateAction<DateRangeFocusedInput>>;
|
|
10
|
+
};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { DateRangeCalendarProps } from "../DateRangeCalendar";
|
|
2
|
-
import { CalendarWithMonthSwitcherProps } from "../../../../features/month-switcher/CalendarWithMonthSwitcher";
|
|
3
|
-
export declare const useDateRangeSelection: <T>({ focusedInput, value, onValueChange, setFocusedInput, statePerMonth, onChangePanel, }: DateRangeCalendarProps<T>) => CalendarWithMonthSwitcherProps<T>;
|
|
1
|
+
import { DateRangeCalendarProps } from "../DateRangeCalendar";
|
|
2
|
+
import { CalendarWithMonthSwitcherProps } from "../../../../features/month-switcher/CalendarWithMonthSwitcher";
|
|
3
|
+
export declare const useDateRangeSelection: <T>({ focusedInput, value, onValueChange, setFocusedInput, statePerMonth, onChangePanel, }: DateRangeCalendarProps<T>) => CalendarWithMonthSwitcherProps<T>;
|
package/dist/components/calendar-types/date-range-exclusion-calendar/DateRangeExclusionCalendar.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { UseInternalPanelStateProps } from "../../../features/internal-panel-state/UseInternalPanelState";
|
|
3
|
-
import { InternalPanelAndFocusStateProps } from "../../../types/InternalPanelAndFocusStateProps";
|
|
4
|
-
import { ValueAndOnValueChangeProps } from "@stenajs-webui/forms";
|
|
5
|
-
export interface DateRangeExclusionCalendarProps<T> extends InternalPanelAndFocusStateProps<T>, UseInternalPanelStateProps, ValueAndOnValueChangeProps<Array<Date>> {
|
|
6
|
-
}
|
|
7
|
-
export declare function DateRangeExclusionCalendar<T extends {}>(props: DateRangeExclusionCalendarProps<T>): JSX.Element;
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { UseInternalPanelStateProps } from "../../../features/internal-panel-state/UseInternalPanelState";
|
|
3
|
+
import { InternalPanelAndFocusStateProps } from "../../../types/InternalPanelAndFocusStateProps";
|
|
4
|
+
import { ValueAndOnValueChangeProps } from "@stenajs-webui/forms";
|
|
5
|
+
export interface DateRangeExclusionCalendarProps<T> extends InternalPanelAndFocusStateProps<T>, UseInternalPanelStateProps, ValueAndOnValueChangeProps<Array<Date>> {
|
|
6
|
+
}
|
|
7
|
+
export declare function DateRangeExclusionCalendar<T extends {}>(props: DateRangeExclusionCalendarProps<T>): JSX.Element;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { DateRangeExclusionCalendarProps } from "./DateRangeExclusionCalendar";
|
|
2
|
-
import { CalendarWithMonthSwitcherProps } from "../../../features/month-switcher/CalendarWithMonthSwitcher";
|
|
3
|
-
export declare const useDateRangeExclusionSelection: <T>({ value, onValueChange, statePerMonth, onChangePanel, }: DateRangeExclusionCalendarProps<T>) => CalendarWithMonthSwitcherProps<T>;
|
|
1
|
+
import { DateRangeExclusionCalendarProps } from "./DateRangeExclusionCalendar";
|
|
2
|
+
import { CalendarWithMonthSwitcherProps } from "../../../features/month-switcher/CalendarWithMonthSwitcher";
|
|
3
|
+
export declare const useDateRangeExclusionSelection: <T>({ value, onValueChange, statePerMonth, onChangePanel, }: DateRangeExclusionCalendarProps<T>) => CalendarWithMonthSwitcherProps<T>;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { UseInternalPanelStateProps } from "../../../features/internal-panel-state/UseInternalPanelState";
|
|
3
|
-
import { InternalPanelAndFocusStateProps } from "../../../types/InternalPanelAndFocusStateProps";
|
|
4
|
-
export interface MultiDateCalendarProps<T> extends InternalPanelAndFocusStateProps<T>, UseInternalPanelStateProps {
|
|
5
|
-
value?: Array<Date>;
|
|
6
|
-
onChange?: (value: Array<Date>) => void;
|
|
7
|
-
}
|
|
8
|
-
export declare function MultiDateCalendar<T extends {}>(props: MultiDateCalendarProps<T>): JSX.Element;
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { UseInternalPanelStateProps } from "../../../features/internal-panel-state/UseInternalPanelState";
|
|
3
|
+
import { InternalPanelAndFocusStateProps } from "../../../types/InternalPanelAndFocusStateProps";
|
|
4
|
+
export interface MultiDateCalendarProps<T> extends InternalPanelAndFocusStateProps<T>, UseInternalPanelStateProps {
|
|
5
|
+
value?: Array<Date>;
|
|
6
|
+
onChange?: (value: Array<Date>) => void;
|
|
7
|
+
}
|
|
8
|
+
export declare function MultiDateCalendar<T extends {}>(props: MultiDateCalendarProps<T>): JSX.Element;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { MultiDateCalendarProps } from "./MultiDateCalendar";
|
|
2
|
-
import { CalendarWithMonthSwitcherProps } from "../../../features/month-switcher/CalendarWithMonthSwitcher";
|
|
3
|
-
export declare const useMultiDateSelection: <T>({ onChange, value, statePerMonth, onChangePanel, }: MultiDateCalendarProps<T>) => CalendarWithMonthSwitcherProps<T>;
|
|
1
|
+
import { MultiDateCalendarProps } from "./MultiDateCalendar";
|
|
2
|
+
import { CalendarWithMonthSwitcherProps } from "../../../features/month-switcher/CalendarWithMonthSwitcher";
|
|
3
|
+
export declare const useMultiDateSelection: <T>({ onChange, value, statePerMonth, onChangePanel, }: MultiDateCalendarProps<T>) => CalendarWithMonthSwitcherProps<T>;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { InternalPanelAndFocusStateProps } from "../../../types/InternalPanelAndFocusStateProps";
|
|
3
|
-
export interface SingleDateCalendarProps<T> extends InternalPanelAndFocusStateProps<T> {
|
|
4
|
-
value: Date | undefined;
|
|
5
|
-
onChange: (value: Date | undefined) => void;
|
|
6
|
-
}
|
|
7
|
-
export declare function SingleDateCalendar<T extends {}>(props: SingleDateCalendarProps<T>): JSX.Element;
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { InternalPanelAndFocusStateProps } from "../../../types/InternalPanelAndFocusStateProps";
|
|
3
|
+
export interface SingleDateCalendarProps<T> extends InternalPanelAndFocusStateProps<T> {
|
|
4
|
+
value: Date | undefined;
|
|
5
|
+
onChange: (value: Date | undefined) => void;
|
|
6
|
+
}
|
|
7
|
+
export declare function SingleDateCalendar<T extends {}>(props: SingleDateCalendarProps<T>): JSX.Element;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { SingleDateCalendarProps } from "./SingleDateCalendar";
|
|
2
|
-
import { CalendarWithMonthSwitcherProps } from "../../../features/month-switcher/CalendarWithMonthSwitcher";
|
|
3
|
-
export declare const useSingleDateSelection: <T>({ onChange, value, statePerMonth, onChangePanel, }: SingleDateCalendarProps<T>) => CalendarWithMonthSwitcherProps<T>;
|
|
1
|
+
import { SingleDateCalendarProps } from "./SingleDateCalendar";
|
|
2
|
+
import { CalendarWithMonthSwitcherProps } from "../../../features/month-switcher/CalendarWithMonthSwitcher";
|
|
3
|
+
export declare const useSingleDateSelection: <T>({ onChange, value, statePerMonth, onChangePanel, }: SingleDateCalendarProps<T>) => CalendarWithMonthSwitcherProps<T>;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { InternalPanelAndFocusStateProps } from "../../../types/InternalPanelAndFocusStateProps";
|
|
3
|
-
export declare type SingleWeekValue = string;
|
|
4
|
-
export interface SingleWeekCalendarProps<T> extends InternalPanelAndFocusStateProps<T> {
|
|
5
|
-
value: SingleWeekValue | undefined;
|
|
6
|
-
onChange: (value: SingleWeekValue | undefined) => void;
|
|
7
|
-
}
|
|
8
|
-
export declare function SingleWeekCalendar<T>(props: SingleWeekCalendarProps<T>): JSX.Element;
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { InternalPanelAndFocusStateProps } from "../../../types/InternalPanelAndFocusStateProps";
|
|
3
|
+
export declare type SingleWeekValue = string;
|
|
4
|
+
export interface SingleWeekCalendarProps<T> extends InternalPanelAndFocusStateProps<T> {
|
|
5
|
+
value: SingleWeekValue | undefined;
|
|
6
|
+
onChange: (value: SingleWeekValue | undefined) => void;
|
|
7
|
+
}
|
|
8
|
+
export declare function SingleWeekCalendar<T>(props: SingleWeekCalendarProps<T>): JSX.Element;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { CalendarWithMonthSwitcherProps } from "../../../features/month-switcher/CalendarWithMonthSwitcher";
|
|
2
|
-
import { SingleWeekCalendarProps } from "./SingleWeekCalendar";
|
|
3
|
-
export declare const useSingleWeekSelection: <T>({ onChange, value, statePerMonth, onChangePanel, }: SingleWeekCalendarProps<T>) => CalendarWithMonthSwitcherProps<T>;
|
|
1
|
+
import { CalendarWithMonthSwitcherProps } from "../../../features/month-switcher/CalendarWithMonthSwitcher";
|
|
2
|
+
import { SingleWeekCalendarProps } from "./SingleWeekCalendar";
|
|
3
|
+
export declare const useSingleWeekSelection: <T>({ onChange, value, statePerMonth, onChangePanel, }: SingleWeekCalendarProps<T>) => CalendarWithMonthSwitcherProps<T>;
|
|
@@ -1,52 +1,52 @@
|
|
|
1
|
-
import { TextInputProps } from "@stenajs-webui/forms";
|
|
2
|
-
import * as React from "react";
|
|
3
|
-
import { CalendarTheme } from "../../calendar/CalendarTheme";
|
|
4
|
-
import { DateTextInputCalendarProps } from "../date-text-input/DateTextInput";
|
|
5
|
-
import { OptionalMinMaxDatesAsString } from "../../../types/CalendarTypes";
|
|
6
|
-
export interface DateInputProps<T = {}> extends OptionalMinMaxDatesAsString {
|
|
7
|
-
/** The current value */
|
|
8
|
-
value?: Date;
|
|
9
|
-
/** onChange handler for when the user selects a date. */
|
|
10
|
-
onChange?: (date: Date | undefined) => void;
|
|
11
|
-
/** Variant of the input field. */
|
|
12
|
-
variant?: TextInputProps["variant"];
|
|
13
|
-
/** If true, calendar will be open when component mounts. */
|
|
14
|
-
openOnMount?: boolean;
|
|
15
|
-
/** Is invoked when user closes the calendar popup. */
|
|
16
|
-
onClose?: () => void;
|
|
17
|
-
/**
|
|
18
|
-
* The date format in the input field. See date-fns docs.
|
|
19
|
-
* @default YYYY-MM-dd
|
|
20
|
-
*/
|
|
21
|
-
displayFormat?: string;
|
|
22
|
-
/**
|
|
23
|
-
* Placeholder when no date has been selected.
|
|
24
|
-
* @default Enter date
|
|
25
|
-
*/
|
|
26
|
-
placeholder?: string;
|
|
27
|
-
/**
|
|
28
|
-
* Portal target, HTML element. If not set, portal is not used.
|
|
29
|
-
*/
|
|
30
|
-
portalTarget?: HTMLElement | null;
|
|
31
|
-
/**
|
|
32
|
-
* Z-index of the calendar overlay.
|
|
33
|
-
* @default 100
|
|
34
|
-
*/
|
|
35
|
-
zIndex?: number;
|
|
36
|
-
/**
|
|
37
|
-
* Width of the input element.
|
|
38
|
-
* * @default 125px
|
|
39
|
-
*/
|
|
40
|
-
width?: string;
|
|
41
|
-
/**
|
|
42
|
-
* The calendar theme to use.
|
|
43
|
-
*/
|
|
44
|
-
calendarTheme?: CalendarTheme;
|
|
45
|
-
/** Props to be passed to Calendar, see SingleDateCalendar. */
|
|
46
|
-
calendarProps?: DateTextInputCalendarProps<T>;
|
|
47
|
-
/**
|
|
48
|
-
* Disables the TextInput, Calendar and Popover.
|
|
49
|
-
*/
|
|
50
|
-
disabled?: boolean;
|
|
51
|
-
}
|
|
52
|
-
export declare const DateInput: React.FC<DateInputProps>;
|
|
1
|
+
import { TextInputProps } from "@stenajs-webui/forms";
|
|
2
|
+
import * as React from "react";
|
|
3
|
+
import { CalendarTheme } from "../../calendar/CalendarTheme";
|
|
4
|
+
import { DateTextInputCalendarProps } from "../date-text-input/DateTextInput";
|
|
5
|
+
import { OptionalMinMaxDatesAsString } from "../../../types/CalendarTypes";
|
|
6
|
+
export interface DateInputProps<T = {}> extends OptionalMinMaxDatesAsString {
|
|
7
|
+
/** The current value */
|
|
8
|
+
value?: Date;
|
|
9
|
+
/** onChange handler for when the user selects a date. */
|
|
10
|
+
onChange?: (date: Date | undefined) => void;
|
|
11
|
+
/** Variant of the input field. */
|
|
12
|
+
variant?: TextInputProps["variant"];
|
|
13
|
+
/** If true, calendar will be open when component mounts. */
|
|
14
|
+
openOnMount?: boolean;
|
|
15
|
+
/** Is invoked when user closes the calendar popup. */
|
|
16
|
+
onClose?: () => void;
|
|
17
|
+
/**
|
|
18
|
+
* The date format in the input field. See date-fns docs.
|
|
19
|
+
* @default YYYY-MM-dd
|
|
20
|
+
*/
|
|
21
|
+
displayFormat?: string;
|
|
22
|
+
/**
|
|
23
|
+
* Placeholder when no date has been selected.
|
|
24
|
+
* @default Enter date
|
|
25
|
+
*/
|
|
26
|
+
placeholder?: string;
|
|
27
|
+
/**
|
|
28
|
+
* Portal target, HTML element. If not set, portal is not used.
|
|
29
|
+
*/
|
|
30
|
+
portalTarget?: HTMLElement | null;
|
|
31
|
+
/**
|
|
32
|
+
* Z-index of the calendar overlay.
|
|
33
|
+
* @default 100
|
|
34
|
+
*/
|
|
35
|
+
zIndex?: number;
|
|
36
|
+
/**
|
|
37
|
+
* Width of the input element.
|
|
38
|
+
* * @default 125px
|
|
39
|
+
*/
|
|
40
|
+
width?: string;
|
|
41
|
+
/**
|
|
42
|
+
* The calendar theme to use.
|
|
43
|
+
*/
|
|
44
|
+
calendarTheme?: CalendarTheme;
|
|
45
|
+
/** Props to be passed to Calendar, see SingleDateCalendar. */
|
|
46
|
+
calendarProps?: DateTextInputCalendarProps<T>;
|
|
47
|
+
/**
|
|
48
|
+
* Disables the TextInput, Calendar and Popover.
|
|
49
|
+
*/
|
|
50
|
+
disabled?: boolean;
|
|
51
|
+
}
|
|
52
|
+
export declare const DateInput: React.FC<DateInputProps>;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
export declare const useDateInput: (onChange?: ((date: Date | undefined) => void) | undefined, onClose?: () => void, openOnMount?: boolean) => {
|
|
2
|
-
showCalendar: () => true;
|
|
3
|
-
hideCalendar: () => void;
|
|
4
|
-
showingCalendar: boolean;
|
|
5
|
-
onSelectDate: (date: Date | undefined) => void;
|
|
6
|
-
};
|
|
1
|
+
export declare const useDateInput: (onChange?: ((date: Date | undefined) => void) | undefined, onClose?: () => void, openOnMount?: boolean) => {
|
|
2
|
+
showCalendar: () => true;
|
|
3
|
+
hideCalendar: () => void;
|
|
4
|
+
showingCalendar: boolean;
|
|
5
|
+
onSelectDate: (date: Date | undefined) => void;
|
|
6
|
+
};
|
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { ValueAndOnValueChangeProps } from "@stenajs-webui/forms";
|
|
3
|
-
import { DualTextInputProps } from "../../../features/dual-text-input/DualTextInput";
|
|
4
|
-
import { DateRangeInputCalendarProps } from "../../calendar-types/date-range-calendar/DateRangeCalendar";
|
|
5
|
-
import { OptionalMinMaxDatesAsString } from "../../../types/CalendarTypes";
|
|
6
|
-
import { DateRange } from "../../../types/DateRange";
|
|
7
|
-
export interface DateRangeDualTextInputProps<TData = unknown> extends ValueAndOnValueChangeProps<DateRange>, OptionalMinMaxDatesAsString, Pick<DualTextInputProps, "widthLeft" | "widthRight" | "variant"> {
|
|
8
|
-
onEsc?: () => void;
|
|
9
|
-
onEnter?: () => void;
|
|
10
|
-
onBlur?: () => void;
|
|
11
|
-
autoFocus?: boolean;
|
|
12
|
-
calendarProps?: DateRangeInputCalendarProps<TData>;
|
|
13
|
-
disabled?: boolean;
|
|
14
|
-
}
|
|
15
|
-
export declare const DateRangeDualTextInput: <TData extends {}>({ value, onValueChange, autoFocus, onBlur, onEnter, onEsc, minDate, maxDate, calendarProps, widthLeft, widthRight, variant, disabled, }: DateRangeDualTextInputProps<TData>) => JSX.Element;
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { ValueAndOnValueChangeProps } from "@stenajs-webui/forms";
|
|
3
|
+
import { DualTextInputProps } from "../../../features/dual-text-input/DualTextInput";
|
|
4
|
+
import { DateRangeInputCalendarProps } from "../../calendar-types/date-range-calendar/DateRangeCalendar";
|
|
5
|
+
import { OptionalMinMaxDatesAsString } from "../../../types/CalendarTypes";
|
|
6
|
+
import { DateRange } from "../../../types/DateRange";
|
|
7
|
+
export interface DateRangeDualTextInputProps<TData = unknown> extends ValueAndOnValueChangeProps<DateRange>, OptionalMinMaxDatesAsString, Pick<DualTextInputProps, "widthLeft" | "widthRight" | "variant"> {
|
|
8
|
+
onEsc?: () => void;
|
|
9
|
+
onEnter?: () => void;
|
|
10
|
+
onBlur?: () => void;
|
|
11
|
+
autoFocus?: boolean;
|
|
12
|
+
calendarProps?: DateRangeInputCalendarProps<TData>;
|
|
13
|
+
disabled?: boolean;
|
|
14
|
+
}
|
|
15
|
+
export declare const DateRangeDualTextInput: <TData extends {}>({ value, onValueChange, autoFocus, onBlur, onEnter, onEsc, minDate, maxDate, calendarProps, widthLeft, widthRight, variant, disabled, }: DateRangeDualTextInputProps<TData>) => JSX.Element;
|