@radix-ng/primitives 0.33.1 → 0.33.2
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/calendar/README.md +1 -0
- package/calendar/index.d.ts +30 -0
- package/calendar/src/calendar-cell-trigger.directive.d.ts +54 -0
- package/calendar/src/calendar-cell.directive.d.ts +11 -0
- package/calendar/src/calendar-grid-body.directive.d.ts +5 -0
- package/calendar/src/calendar-grid-head.directive.d.ts +5 -0
- package/calendar/src/calendar-grid-row.directive.d.ts +5 -0
- package/calendar/src/calendar-grid.directive.d.ts +8 -0
- package/calendar/src/calendar-head-cell.directive.d.ts +5 -0
- package/calendar/src/calendar-header.directive.d.ts +5 -0
- package/calendar/src/calendar-heading.directive.d.ts +7 -0
- package/calendar/src/calendar-next.directive.d.ts +16 -0
- package/calendar/src/calendar-prev.directive.d.ts +16 -0
- package/calendar/src/calendar-root.directive.d.ts +148 -0
- package/calendar/src/calendar.d.ts +44 -0
- package/calendar/src//321/201alendar-/321/201ontext.token.d.ts +24 -0
- package/core/index.d.ts +2 -0
- package/core/src/chunk.d.ts +12 -0
- package/core/src/date-time/calendar.d.ts +33 -0
- package/core/src/date-time/comparators.d.ts +92 -0
- package/core/src/date-time/formatter.d.ts +30 -0
- package/core/src/date-time/index.d.ts +6 -0
- package/core/src/date-time/placeholders.d.ts +8 -0
- package/core/src/date-time/types.d.ts +28 -0
- package/core/src/date-time/utils.d.ts +1 -0
- package/core/src/kbd-constants.d.ts +1 -0
- package/core/src/watch.d.ts +41 -0
- package/fesm2022/radix-ng-primitives-calendar.mjs +941 -0
- package/fesm2022/radix-ng-primitives-calendar.mjs.map +1 -0
- package/fesm2022/radix-ng-primitives-core.mjs +544 -2
- package/fesm2022/radix-ng-primitives-core.mjs.map +1 -1
- package/hover-card/src/hover-card-root.directive.d.ts +4 -4
- package/package.json +5 -1
- package/popover/src/popover-root.directive.d.ts +4 -4
- package/tooltip/src/tooltip-root.directive.d.ts +4 -4
@@ -0,0 +1 @@
|
|
1
|
+
# @radix-ng/primitives/calendar
|
@@ -0,0 +1,30 @@
|
|
1
|
+
import * as i0 from "@angular/core";
|
2
|
+
import * as i1 from "./src/calendar-cell-trigger.directive";
|
3
|
+
import * as i2 from "./src/calendar-cell.directive";
|
4
|
+
import * as i3 from "./src/calendar-grid-body.directive";
|
5
|
+
import * as i4 from "./src/calendar-grid-head.directive";
|
6
|
+
import * as i5 from "./src/calendar-grid-row.directive";
|
7
|
+
import * as i6 from "./src/calendar-grid.directive";
|
8
|
+
import * as i7 from "./src/calendar-head-cell.directive";
|
9
|
+
import * as i8 from "./src/calendar-header.directive";
|
10
|
+
import * as i9 from "./src/calendar-prev.directive";
|
11
|
+
import * as i10 from "./src/calendar-root.directive";
|
12
|
+
import * as i11 from "./src/calendar-heading.directive";
|
13
|
+
import * as i12 from "./src/calendar-next.directive";
|
14
|
+
export { RdxCalendarCellTriggerDirective } from './src/calendar-cell-trigger.directive';
|
15
|
+
export { RdxCalendarCellDirective } from './src/calendar-cell.directive';
|
16
|
+
export { RdxCalendarGridBodyDirective } from './src/calendar-grid-body.directive';
|
17
|
+
export { RdxCalendarGridHeadDirective } from './src/calendar-grid-head.directive';
|
18
|
+
export { RdxCalendarGridRowDirective } from './src/calendar-grid-row.directive';
|
19
|
+
export { RdxCalendarGridDirective } from './src/calendar-grid.directive';
|
20
|
+
export { RdxCalendarHeadCellDirective } from './src/calendar-head-cell.directive';
|
21
|
+
export { RdxCalendarHeaderDirective } from './src/calendar-header.directive';
|
22
|
+
export { RdxCalendarHeadingDirective } from './src/calendar-heading.directive';
|
23
|
+
export { RdxCalendarNextDirective } from './src/calendar-next.directive';
|
24
|
+
export { RdxCalendarPrevDirective } from './src/calendar-prev.directive';
|
25
|
+
export { RdxCalendarRootDirective } from './src/calendar-root.directive';
|
26
|
+
export declare class RdxCalendarModule {
|
27
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<RdxCalendarModule, never>;
|
28
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<RdxCalendarModule, never, [typeof i1.RdxCalendarCellTriggerDirective, typeof i2.RdxCalendarCellDirective, typeof i3.RdxCalendarGridBodyDirective, typeof i4.RdxCalendarGridHeadDirective, typeof i5.RdxCalendarGridRowDirective, typeof i6.RdxCalendarGridDirective, typeof i7.RdxCalendarHeadCellDirective, typeof i8.RdxCalendarHeaderDirective, typeof i9.RdxCalendarPrevDirective, typeof i10.RdxCalendarRootDirective, typeof i11.RdxCalendarHeadingDirective, typeof i12.RdxCalendarNextDirective], [typeof i1.RdxCalendarCellTriggerDirective, typeof i2.RdxCalendarCellDirective, typeof i3.RdxCalendarGridBodyDirective, typeof i4.RdxCalendarGridHeadDirective, typeof i5.RdxCalendarGridRowDirective, typeof i6.RdxCalendarGridDirective, typeof i7.RdxCalendarHeadCellDirective, typeof i8.RdxCalendarHeaderDirective, typeof i9.RdxCalendarPrevDirective, typeof i10.RdxCalendarRootDirective, typeof i11.RdxCalendarHeadingDirective, typeof i12.RdxCalendarNextDirective]>;
|
29
|
+
static ɵinj: i0.ɵɵInjectorDeclaration<RdxCalendarModule>;
|
30
|
+
}
|
@@ -0,0 +1,54 @@
|
|
1
|
+
import { AfterViewInit } from '@angular/core';
|
2
|
+
import { DateValue } from '@internationalized/date';
|
3
|
+
import * as i0 from "@angular/core";
|
4
|
+
export declare class RdxCalendarCellTriggerDirective implements AfterViewInit {
|
5
|
+
private readonly rootContext;
|
6
|
+
private readonly elementRef;
|
7
|
+
/**
|
8
|
+
* The date value provided to the cell trigger
|
9
|
+
*/
|
10
|
+
readonly day: import("@angular/core").InputSignal<DateValue | undefined>;
|
11
|
+
/**
|
12
|
+
* The month in which the cell is rendered
|
13
|
+
*/
|
14
|
+
readonly month: import("@angular/core").InputSignal<DateValue | undefined>;
|
15
|
+
/**
|
16
|
+
* Current day
|
17
|
+
*/
|
18
|
+
readonly dayValue: import("@angular/core").Signal<string | undefined>;
|
19
|
+
/**
|
20
|
+
* Current today state
|
21
|
+
*/
|
22
|
+
readonly isDateToday: import("@angular/core").Signal<boolean>;
|
23
|
+
/**
|
24
|
+
* Current selected state
|
25
|
+
*/
|
26
|
+
readonly isSelectedDate: import("@angular/core").Signal<boolean>;
|
27
|
+
readonly isDisabled: import("@angular/core").Signal<boolean>;
|
28
|
+
readonly isOutsideView: import("@angular/core").Signal<boolean>;
|
29
|
+
readonly isFocusedDate: import("@angular/core").Signal<boolean>;
|
30
|
+
readonly isUnavailable: import("@angular/core").Signal<boolean>;
|
31
|
+
readonly labelText: import("@angular/core").Signal<string>;
|
32
|
+
/**
|
33
|
+
* @ignore
|
34
|
+
*/
|
35
|
+
currentElement: HTMLElement;
|
36
|
+
ngAfterViewInit(): void;
|
37
|
+
protected onClick(): void;
|
38
|
+
protected onArrowKey(event: KeyboardEvent): void;
|
39
|
+
private shiftFocus;
|
40
|
+
/**
|
41
|
+
* @ignore
|
42
|
+
*/
|
43
|
+
SELECTOR: string;
|
44
|
+
/**
|
45
|
+
* @ignore
|
46
|
+
*/
|
47
|
+
getSelectableCells(calendar: HTMLElement): HTMLElement[];
|
48
|
+
/**
|
49
|
+
* @ignore
|
50
|
+
*/
|
51
|
+
changeDate(date: DateValue): void;
|
52
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<RdxCalendarCellTriggerDirective, never>;
|
53
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<RdxCalendarCellTriggerDirective, "[rdxCalendarCellTrigger]", ["rdxCalendarCellTrigger"], { "day": { "alias": "day"; "required": false; "isSignal": true; }; "month": { "alias": "month"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
54
|
+
}
|
@@ -0,0 +1,11 @@
|
|
1
|
+
import { DateValue } from '@internationalized/date';
|
2
|
+
import * as i0 from "@angular/core";
|
3
|
+
export declare class RdxCalendarCellDirective {
|
4
|
+
protected readonly rootContext: import("./\u0441alendar-\u0441ontext.token").CalendarRootContextToken;
|
5
|
+
/**
|
6
|
+
* The date of the cell
|
7
|
+
*/
|
8
|
+
readonly date: import("@angular/core").InputSignal<DateValue | undefined>;
|
9
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<RdxCalendarCellDirective, never>;
|
10
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<RdxCalendarCellDirective, "td[rdxCalendarCell]", never, { "date": { "alias": "date"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
11
|
+
}
|
@@ -0,0 +1,5 @@
|
|
1
|
+
import * as i0 from "@angular/core";
|
2
|
+
export declare class RdxCalendarGridBodyDirective {
|
3
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<RdxCalendarGridBodyDirective, never>;
|
4
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<RdxCalendarGridBodyDirective, "tbody[rdxCalendarGridBody]", never, {}, {}, never, never, true, never>;
|
5
|
+
}
|
@@ -0,0 +1,5 @@
|
|
1
|
+
import * as i0 from "@angular/core";
|
2
|
+
export declare class RdxCalendarGridHeadDirective {
|
3
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<RdxCalendarGridHeadDirective, never>;
|
4
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<RdxCalendarGridHeadDirective, "thead[rdxCalendarGridHead]", never, {}, {}, never, never, true, never>;
|
5
|
+
}
|
@@ -0,0 +1,5 @@
|
|
1
|
+
import * as i0 from "@angular/core";
|
2
|
+
export declare class RdxCalendarGridRowDirective {
|
3
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<RdxCalendarGridRowDirective, never>;
|
4
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<RdxCalendarGridRowDirective, "tr[rdxCalendarGridRow]", never, {}, {}, never, never, true, never>;
|
5
|
+
}
|
@@ -0,0 +1,8 @@
|
|
1
|
+
import * as i0 from "@angular/core";
|
2
|
+
export declare class RdxCalendarGridDirective {
|
3
|
+
private readonly rootContext;
|
4
|
+
readonly disabled: import("@angular/core").Signal<true | undefined>;
|
5
|
+
readonly readonly: import("@angular/core").Signal<true | undefined>;
|
6
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<RdxCalendarGridDirective, never>;
|
7
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<RdxCalendarGridDirective, "table[rdxCalendarGrid]", never, {}, {}, never, never, true, never>;
|
8
|
+
}
|
@@ -0,0 +1,5 @@
|
|
1
|
+
import * as i0 from "@angular/core";
|
2
|
+
export declare class RdxCalendarHeadCellDirective {
|
3
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<RdxCalendarHeadCellDirective, never>;
|
4
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<RdxCalendarHeadCellDirective, "th[rdxCalendarHeadCell]", never, {}, {}, never, never, true, never>;
|
5
|
+
}
|
@@ -0,0 +1,5 @@
|
|
1
|
+
import * as i0 from "@angular/core";
|
2
|
+
export declare class RdxCalendarHeaderDirective {
|
3
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<RdxCalendarHeaderDirective, never>;
|
4
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<RdxCalendarHeaderDirective, "div[rdxCalendarHeader]", never, {}, {}, never, never, true, never>;
|
5
|
+
}
|
@@ -0,0 +1,7 @@
|
|
1
|
+
import * as i0 from "@angular/core";
|
2
|
+
export declare class RdxCalendarHeadingDirective {
|
3
|
+
protected readonly rootContext: import("./\u0441alendar-\u0441ontext.token").CalendarRootContextToken;
|
4
|
+
readonly headingValue: import("@angular/core").Signal<string>;
|
5
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<RdxCalendarHeadingDirective, never>;
|
6
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<RdxCalendarHeadingDirective, "div[rdxCalendarHeading]", ["rdxCalendarHeading"], {}, {}, never, never, true, never>;
|
7
|
+
}
|
@@ -0,0 +1,16 @@
|
|
1
|
+
import { DateValue } from '@internationalized/date';
|
2
|
+
import * as i0 from "@angular/core";
|
3
|
+
export declare class RdxCalendarNextDirective {
|
4
|
+
protected readonly rootContext: import("./\u0441alendar-\u0441ontext.token").CalendarRootContextToken;
|
5
|
+
/**
|
6
|
+
* The function to be used for the `next page`. Overwrites the nextPage function set on the `CalendarRoot`.
|
7
|
+
*/
|
8
|
+
readonly nextPage: import("@angular/core").InputSignal<((placeholder: DateValue) => DateValue) | undefined>;
|
9
|
+
/**
|
10
|
+
* @ignore
|
11
|
+
*/
|
12
|
+
readonly disabled: import("@angular/core").Signal<boolean>;
|
13
|
+
protected onClick(): void;
|
14
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<RdxCalendarNextDirective, never>;
|
15
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<RdxCalendarNextDirective, "button[rdxCalendarNext]", ["rdxCalendarNext"], { "nextPage": { "alias": "nextPage"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
16
|
+
}
|
@@ -0,0 +1,16 @@
|
|
1
|
+
import { DateValue } from '@internationalized/date';
|
2
|
+
import * as i0 from "@angular/core";
|
3
|
+
export declare class RdxCalendarPrevDirective {
|
4
|
+
protected readonly rootContext: import("./\u0441alendar-\u0441ontext.token").CalendarRootContextToken;
|
5
|
+
/**
|
6
|
+
* The function to be used for the `prev page`. Overwrites the prevPage function set on the `CalendarRoot`.
|
7
|
+
*/
|
8
|
+
readonly prevPage: import("@angular/core").InputSignal<((placeholder: DateValue) => DateValue) | undefined>;
|
9
|
+
/**
|
10
|
+
* @ignore
|
11
|
+
*/
|
12
|
+
readonly disabled: import("@angular/core").Signal<boolean>;
|
13
|
+
protected onClick(): void;
|
14
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<RdxCalendarPrevDirective, never>;
|
15
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<RdxCalendarPrevDirective, "button[rdxCalendarPrev]", ["rdxCalendarPrev"], { "prevPage": { "alias": "prevPage"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
16
|
+
}
|
@@ -0,0 +1,148 @@
|
|
1
|
+
import { BooleanInput } from '@angular/cdk/coercion';
|
2
|
+
import { AfterViewInit } from '@angular/core';
|
3
|
+
import { DateValue } from '@internationalized/date';
|
4
|
+
import { DateMatcher, Formatter, Month } from '@radix-ng/primitives/core';
|
5
|
+
import * as i0 from "@angular/core";
|
6
|
+
export declare class RdxCalendarRootDirective implements AfterViewInit {
|
7
|
+
private readonly elementRef;
|
8
|
+
/**
|
9
|
+
* The controlled checked state of the calendar
|
10
|
+
*/
|
11
|
+
readonly value: import("@angular/core").ModelSignal<DateValue | DateValue[] | undefined>;
|
12
|
+
/**
|
13
|
+
* The default placeholder date
|
14
|
+
*/
|
15
|
+
readonly defaultPlaceholder: import("@angular/core").ModelSignal<DateValue | undefined>;
|
16
|
+
readonly locale: import("@angular/core").InputSignal<string>;
|
17
|
+
readonly defaultDate: DateValue;
|
18
|
+
/**
|
19
|
+
* The placeholder date, which is used to determine what month to display when no date is selected.
|
20
|
+
* This updates as the user navigates the calendar and can be used to programmatically control the calendar view
|
21
|
+
*/
|
22
|
+
readonly placeholder: import("@angular/core").ModelSignal<DateValue>;
|
23
|
+
readonly multiple: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
|
24
|
+
/**
|
25
|
+
* Whether to always display 6 weeks in the calendar
|
26
|
+
*/
|
27
|
+
readonly fixedWeeks: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
|
28
|
+
/**
|
29
|
+
* Whether the calendar is disabled
|
30
|
+
*/
|
31
|
+
readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
|
32
|
+
/**
|
33
|
+
* Whether to prevent the user from deselecting a date without selecting another date first
|
34
|
+
*/
|
35
|
+
readonly preventDeselect: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
|
36
|
+
/**
|
37
|
+
* The day of the week to start the calendar on
|
38
|
+
*/
|
39
|
+
readonly weekStartsOn: import("@angular/core").InputSignal<0 | 1 | 2 | 3 | 4 | 5 | 6>;
|
40
|
+
/**
|
41
|
+
* The number of months to display at once
|
42
|
+
*/
|
43
|
+
readonly numberOfMonths: import("@angular/core").InputSignal<number>;
|
44
|
+
/**
|
45
|
+
* The reading direction of the calendar when applicable.
|
46
|
+
*/
|
47
|
+
readonly dir: import("@angular/core").InputSignal<"ltr" | "rtl">;
|
48
|
+
/**
|
49
|
+
* The minimum date that can be selected
|
50
|
+
*/
|
51
|
+
readonly minValue: import("@angular/core").InputSignal<DateValue | undefined>;
|
52
|
+
/**
|
53
|
+
* The maximum date that can be selected
|
54
|
+
*/
|
55
|
+
readonly maxValue: import("@angular/core").InputSignal<DateValue | undefined>;
|
56
|
+
/**
|
57
|
+
* The format to use for the weekday strings provided via the weekdays slot prop
|
58
|
+
*/
|
59
|
+
readonly weekdayFormat: import("@angular/core").InputSignal<"long" | "short" | "narrow" | undefined>;
|
60
|
+
/**
|
61
|
+
* The accessible label for the calendar
|
62
|
+
*/
|
63
|
+
readonly calendarLabel: import("@angular/core").InputSignal<string | undefined>;
|
64
|
+
/**
|
65
|
+
* Whether the calendar is readonly
|
66
|
+
*/
|
67
|
+
readonly readonly: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
|
68
|
+
/**
|
69
|
+
* This property causes the previous and next buttons to navigate by the number of months displayed at once, rather than one month
|
70
|
+
*/
|
71
|
+
readonly pagedNavigation: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
|
72
|
+
readonly propsNextPage: import("@angular/core").InputSignal<((placeholder: DateValue) => DateValue) | undefined>;
|
73
|
+
readonly propsPrevPage: import("@angular/core").InputSignal<((placeholder: DateValue) => DateValue) | undefined>;
|
74
|
+
/**
|
75
|
+
* A function that returns whether a date is disabled
|
76
|
+
*/
|
77
|
+
readonly isDateDisabled: import("@angular/core").InputSignal<DateMatcher | undefined>;
|
78
|
+
/**
|
79
|
+
* A function that returns whether a date is unavailable
|
80
|
+
*/
|
81
|
+
readonly isDateUnavailable: import("@angular/core").InputSignal<DateMatcher | undefined>;
|
82
|
+
readonly initialFocus: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
|
83
|
+
readonly months: import("@angular/core").ModelSignal<Month<DateValue>[] | undefined>;
|
84
|
+
/**
|
85
|
+
* The days of the week
|
86
|
+
*/
|
87
|
+
readonly weekDays: import("@angular/core").ModelSignal<string[] | undefined>;
|
88
|
+
protected readonly fixedWeeksRef: import("@angular/core").WritableSignal<boolean>;
|
89
|
+
protected readonly disabledRef: import("@angular/core").WritableSignal<boolean>;
|
90
|
+
protected readonly pagedNavigationRef: import("@angular/core").WritableSignal<boolean>;
|
91
|
+
/**
|
92
|
+
* @ignore
|
93
|
+
*/
|
94
|
+
readonly headingValue: import("@angular/core").WritableSignal<string>;
|
95
|
+
/**
|
96
|
+
* @ignore
|
97
|
+
*/
|
98
|
+
readonly fullCalendarLabel: import("@angular/core").WritableSignal<string>;
|
99
|
+
/**
|
100
|
+
* @ignore
|
101
|
+
*/
|
102
|
+
nextPage: (nextPageFunc?: (date: DateValue) => DateValue) => void;
|
103
|
+
/**
|
104
|
+
* @ignore
|
105
|
+
*/
|
106
|
+
prevPage: (nextPageFunc?: (date: DateValue) => DateValue) => void;
|
107
|
+
/**
|
108
|
+
* @ignore
|
109
|
+
*/
|
110
|
+
isNextButtonDisabled: (nextPageFunc?: (date: DateValue) => DateValue) => boolean;
|
111
|
+
/**
|
112
|
+
* @ignore
|
113
|
+
*/
|
114
|
+
isPrevButtonDisabled: (nextPageFunc?: (date: DateValue) => DateValue) => boolean;
|
115
|
+
/**
|
116
|
+
* @ignore
|
117
|
+
*/
|
118
|
+
isDateSelected: DateMatcher;
|
119
|
+
/**
|
120
|
+
* @ignore
|
121
|
+
*/
|
122
|
+
isInvalid: boolean;
|
123
|
+
/**
|
124
|
+
* @ignore
|
125
|
+
*/
|
126
|
+
isOutsideVisibleView: (date: DateValue) => boolean;
|
127
|
+
/**
|
128
|
+
* @ignore
|
129
|
+
*/
|
130
|
+
formatter: Formatter;
|
131
|
+
/**
|
132
|
+
* @ignore
|
133
|
+
*/
|
134
|
+
currentElement: HTMLElement;
|
135
|
+
private readonly calendar;
|
136
|
+
constructor();
|
137
|
+
ngAfterViewInit(): void;
|
138
|
+
/**
|
139
|
+
* @ignore
|
140
|
+
*/
|
141
|
+
onPlaceholderChange(value: DateValue): void;
|
142
|
+
/**
|
143
|
+
* @ignore
|
144
|
+
*/
|
145
|
+
onDateChange(date: DateValue): void;
|
146
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<RdxCalendarRootDirective, never>;
|
147
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<RdxCalendarRootDirective, "[rdxCalendarRoot]", ["rdxCalendarRoot"], { "value": { "alias": "value"; "required": false; "isSignal": true; }; "defaultPlaceholder": { "alias": "defaultPlaceholder"; "required": false; "isSignal": true; }; "locale": { "alias": "locale"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "fixedWeeks": { "alias": "fixedWeeks"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "preventDeselect": { "alias": "preventDeselect"; "required": false; "isSignal": true; }; "weekStartsOn": { "alias": "weekStartsOn"; "required": false; "isSignal": true; }; "numberOfMonths": { "alias": "numberOfMonths"; "required": false; "isSignal": true; }; "dir": { "alias": "dir"; "required": false; "isSignal": true; }; "minValue": { "alias": "minValue"; "required": false; "isSignal": true; }; "maxValue": { "alias": "maxValue"; "required": false; "isSignal": true; }; "weekdayFormat": { "alias": "weekdayFormat"; "required": false; "isSignal": true; }; "calendarLabel": { "alias": "calendarLabel"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "pagedNavigation": { "alias": "pagedNavigation"; "required": false; "isSignal": true; }; "propsNextPage": { "alias": "propsNextPage"; "required": false; "isSignal": true; }; "propsPrevPage": { "alias": "propsPrevPage"; "required": false; "isSignal": true; }; "isDateDisabled": { "alias": "isDateDisabled"; "required": false; "isSignal": true; }; "isDateUnavailable": { "alias": "isDateUnavailable"; "required": false; "isSignal": true; }; "initialFocus": { "alias": "initialFocus"; "required": false; "isSignal": true; }; "months": { "alias": "months"; "required": false; "isSignal": true; }; "weekDays": { "alias": "weekDays"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "defaultPlaceholder": "defaultPlaceholderChange"; "placeholder": "placeholderChange"; "months": "monthsChange"; "weekDays": "weekDaysChange"; }, never, never, true, never>;
|
148
|
+
}
|
@@ -0,0 +1,44 @@
|
|
1
|
+
import { InputSignal, ModelSignal, WritableSignal } from '@angular/core';
|
2
|
+
import { DateValue } from '@internationalized/date';
|
3
|
+
import { DateMatcher, Month } from '@radix-ng/primitives/core';
|
4
|
+
export type CalendarProps = {
|
5
|
+
locale: InputSignal<string>;
|
6
|
+
placeholder: WritableSignal<DateValue>;
|
7
|
+
weekStartsOn: InputSignal<0 | 1 | 2 | 3 | 4 | 5 | 6>;
|
8
|
+
fixedWeeks: WritableSignal<boolean>;
|
9
|
+
numberOfMonths: InputSignal<number>;
|
10
|
+
minValue: InputSignal<DateValue | undefined>;
|
11
|
+
maxValue: InputSignal<DateValue | undefined>;
|
12
|
+
disabled: WritableSignal<boolean>;
|
13
|
+
weekdayFormat: InputSignal<Intl.DateTimeFormatOptions['weekday']>;
|
14
|
+
pagedNavigation: WritableSignal<boolean>;
|
15
|
+
isDateDisabled?: InputSignal<DateMatcher | undefined>;
|
16
|
+
isDateUnavailable?: InputSignal<DateMatcher | undefined>;
|
17
|
+
calendarLabel: InputSignal<string | undefined>;
|
18
|
+
nextPage: InputSignal<((placeholder: DateValue) => DateValue) | undefined>;
|
19
|
+
prevPage: InputSignal<((placeholder: DateValue) => DateValue) | undefined>;
|
20
|
+
};
|
21
|
+
export type CalendarStateProps = {
|
22
|
+
date: ModelSignal<DateValue | DateValue[] | undefined>;
|
23
|
+
isDateDisabled?: DateMatcher;
|
24
|
+
isDateUnavailable?: DateMatcher;
|
25
|
+
};
|
26
|
+
export declare function calendarState(props: CalendarStateProps): {
|
27
|
+
isDateSelected: (dateObj: DateValue) => boolean;
|
28
|
+
isInvalid: import("@angular/core").Signal<boolean>;
|
29
|
+
};
|
30
|
+
export declare function calendar(props: CalendarProps): {
|
31
|
+
isDateDisabled: (dateObj: DateValue) => boolean;
|
32
|
+
isDateUnavailable: (date: DateValue) => boolean;
|
33
|
+
isNextButtonDisabled: (nextPageFunc?: (date: DateValue) => DateValue) => boolean;
|
34
|
+
isPrevButtonDisabled: (prevPageFunc?: (date: DateValue) => DateValue) => boolean;
|
35
|
+
month: WritableSignal<Month<DateValue>[]>;
|
36
|
+
weekdays: import("@angular/core").Signal<string[]>;
|
37
|
+
visibleView: import("@angular/core").Signal<DateValue[]>;
|
38
|
+
isOutsideVisibleView: (date: DateValue) => boolean;
|
39
|
+
formatter: import("@radix-ng/primitives/core").Formatter;
|
40
|
+
nextPage: (nextPageFunc?: (date: DateValue) => DateValue) => void;
|
41
|
+
prevPage: (prevPageFunc?: (date: DateValue) => DateValue) => void;
|
42
|
+
headingValue: import("@angular/core").Signal<string>;
|
43
|
+
fullCalendarLabel: import("@angular/core").Signal<string>;
|
44
|
+
};
|
@@ -0,0 +1,24 @@
|
|
1
|
+
import { InjectionToken, InputSignal, ModelSignal, WritableSignal } from '@angular/core';
|
2
|
+
import { DateValue } from '@internationalized/date';
|
3
|
+
import { DateMatcher, Formatter } from '@radix-ng/primitives/core';
|
4
|
+
export interface CalendarRootContextToken {
|
5
|
+
nextPage?: (nextPageFunc?: (date: DateValue) => DateValue) => void;
|
6
|
+
prevPage?: (nextPageFunc?: (date: DateValue) => DateValue) => void;
|
7
|
+
isNextButtonDisabled: (nextPageFunc?: (date: DateValue) => DateValue) => boolean;
|
8
|
+
isPrevButtonDisabled: (nextPageFunc?: (date: DateValue) => DateValue) => boolean;
|
9
|
+
headingValue: WritableSignal<string>;
|
10
|
+
dir: InputSignal<'ltr' | 'rtl'>;
|
11
|
+
readonly: boolean;
|
12
|
+
numberOfMonths: InputSignal<number>;
|
13
|
+
placeholder: ModelSignal<DateValue>;
|
14
|
+
pagedNavigation: boolean;
|
15
|
+
disabled: InputSignal<boolean>;
|
16
|
+
isDateSelected?: DateMatcher;
|
17
|
+
isDateDisabled?: DateMatcher;
|
18
|
+
isDateUnavailable: DateMatcher;
|
19
|
+
formatter: Formatter;
|
20
|
+
onDateChange: (date: DateValue) => void;
|
21
|
+
currentElement: HTMLElement;
|
22
|
+
}
|
23
|
+
export declare const CALENDAR_ROOT_CONTEXT: InjectionToken<CalendarRootContextToken>;
|
24
|
+
export declare function injectCalendarRootContext(): CalendarRootContextToken;
|
package/core/index.d.ts
CHANGED
@@ -10,6 +10,8 @@ export * from './src/is-nullish';
|
|
10
10
|
export * from './src/is-number';
|
11
11
|
export * from './src/kbd-constants';
|
12
12
|
export * from './src/window';
|
13
|
+
export * from './src/date-time';
|
13
14
|
export * from './src/positioning/constants';
|
14
15
|
export * from './src/positioning/types';
|
15
16
|
export * from './src/positioning/utils';
|
17
|
+
export * from './src/watch';
|
@@ -0,0 +1,12 @@
|
|
1
|
+
/**
|
2
|
+
* Splits an array into chunks of a given size.
|
3
|
+
* @param arr The array to split.
|
4
|
+
* @param size The size of each chunk.
|
5
|
+
* @returns An array of arrays, where each sub-array has `size` elements from the original array.
|
6
|
+
* @example ```ts
|
7
|
+
* const arr = [1, 2, 3, 4, 5, 6, 7, 8];
|
8
|
+
* const chunks = chunk(arr, 3);
|
9
|
+
* // chunks = [[1, 2, 3], [4, 5, 6], [7, 8]]
|
10
|
+
* ```
|
11
|
+
*/
|
12
|
+
export declare function chunk<T>(arr: T[], size: number): T[][];
|
@@ -0,0 +1,33 @@
|
|
1
|
+
import { DateValue } from '@internationalized/date';
|
2
|
+
import { Month } from './types';
|
3
|
+
export type CreateMonthProps = {
|
4
|
+
/**
|
5
|
+
* The date object representing the month's date (usually the first day of the month).
|
6
|
+
*/
|
7
|
+
dateObj: DateValue;
|
8
|
+
/**
|
9
|
+
* The day of the week to start the calendar on (0 for Sunday, 1 for Monday, etc.).
|
10
|
+
*/
|
11
|
+
weekStartsOn: number;
|
12
|
+
/**
|
13
|
+
* Whether to always render 6 weeks in the calendar, even if the month doesn't
|
14
|
+
* span 6 weeks.
|
15
|
+
*/
|
16
|
+
fixedWeeks: boolean;
|
17
|
+
/**
|
18
|
+
* The locale to use when creating the calendar month.
|
19
|
+
*/
|
20
|
+
locale: string;
|
21
|
+
};
|
22
|
+
/**
|
23
|
+
* Retrieves an array of date values representing the days between
|
24
|
+
* the provided start and end dates.
|
25
|
+
*/
|
26
|
+
export declare function getDaysBetween(start: DateValue, end: DateValue): DateValue[];
|
27
|
+
export declare function createMonth(props: CreateMonthProps): Month<DateValue>;
|
28
|
+
type SetMonthProps = CreateMonthProps & {
|
29
|
+
numberOfMonths: number | undefined;
|
30
|
+
currentMonths?: Month<DateValue>[];
|
31
|
+
};
|
32
|
+
export declare function createMonths(props: SetMonthProps): Month<DateValue>[];
|
33
|
+
export {};
|
@@ -0,0 +1,92 @@
|
|
1
|
+
import { CalendarDateTime, type DateValue, ZonedDateTime } from '@internationalized/date';
|
2
|
+
import type { DateMatcher } from './types';
|
3
|
+
/**
|
4
|
+
* Given a `DateValue` object, convert it to a native `Date` object.
|
5
|
+
* If a timezone is provided, the date will be converted to that timezone.
|
6
|
+
* If no timezone is provided, the date will be converted to the local timezone.
|
7
|
+
*/
|
8
|
+
export declare function toDate(dateValue: DateValue, tz?: string): Date;
|
9
|
+
export declare function isCalendarDateTime(dateValue: DateValue): dateValue is CalendarDateTime;
|
10
|
+
export declare function isZonedDateTime(dateValue: DateValue): dateValue is ZonedDateTime;
|
11
|
+
export declare function hasTime(dateValue: DateValue): dateValue is CalendarDateTime | ZonedDateTime;
|
12
|
+
/**
|
13
|
+
* Given a date, return the number of days in the month.
|
14
|
+
*/
|
15
|
+
export declare function getDaysInMonth(date: Date | DateValue): number;
|
16
|
+
/**
|
17
|
+
* Determine if a date is before the reference date.
|
18
|
+
* @param dateToCompare - is this date before the `referenceDate`
|
19
|
+
* @param referenceDate - is the `dateToCompare` before this date
|
20
|
+
*
|
21
|
+
* @see {@link isBeforeOrSame} for inclusive
|
22
|
+
*/
|
23
|
+
export declare function isBefore(dateToCompare: DateValue, referenceDate: DateValue): boolean;
|
24
|
+
/**
|
25
|
+
* Determine if a date is after the reference date.
|
26
|
+
* @param dateToCompare - is this date after the `referenceDate`
|
27
|
+
* @param referenceDate - is the `dateToCompare` after this date
|
28
|
+
*
|
29
|
+
* @see {@link isAfterOrSame} for inclusive
|
30
|
+
*/
|
31
|
+
export declare function isAfter(dateToCompare: DateValue, referenceDate: DateValue): boolean;
|
32
|
+
/**
|
33
|
+
* Determine if a date is before or the same as the reference date.
|
34
|
+
*
|
35
|
+
* @param dateToCompare - the date to compare
|
36
|
+
* @param referenceDate - the reference date to make the comparison against
|
37
|
+
*
|
38
|
+
* @see {@link isBefore} for non-inclusive
|
39
|
+
*/
|
40
|
+
export declare function isBeforeOrSame(dateToCompare: DateValue, referenceDate: DateValue): boolean;
|
41
|
+
/**
|
42
|
+
* Determine if a date is after or the same as the reference date.
|
43
|
+
*
|
44
|
+
* @param dateToCompare - is this date after or the same as the `referenceDate`
|
45
|
+
* @param referenceDate - is the `dateToCompare` after or the same as this date
|
46
|
+
*
|
47
|
+
* @see {@link isAfter} for non-inclusive
|
48
|
+
*/
|
49
|
+
export declare function isAfterOrSame(dateToCompare: DateValue, referenceDate: DateValue): boolean;
|
50
|
+
/**
|
51
|
+
* Determine if a date is inclusively between a start and end reference date.
|
52
|
+
*
|
53
|
+
* @param date - is this date inclusively between the `start` and `end` dates
|
54
|
+
* @param start - the start reference date to make the comparison against
|
55
|
+
* @param end - the end reference date to make the comparison against
|
56
|
+
*
|
57
|
+
* @see {@link isBetween} for non-inclusive
|
58
|
+
*/
|
59
|
+
export declare function isBetweenInclusive(date: DateValue, start: DateValue, end: DateValue): boolean;
|
60
|
+
/**
|
61
|
+
* Determine if a date is between a start and end reference date.
|
62
|
+
*
|
63
|
+
* @param date - is this date between the `start` and `end` dates
|
64
|
+
* @param start - the start reference date to make the comparison against
|
65
|
+
* @param end - the end reference date to make the comparison against
|
66
|
+
*
|
67
|
+
* @see {@link isBetweenInclusive} for inclusive
|
68
|
+
*/
|
69
|
+
export declare function isBetween(date: DateValue, start: DateValue, end: DateValue): boolean;
|
70
|
+
export declare function getLastFirstDayOfWeek<T extends DateValue = DateValue>(date: T, firstDayOfWeek: number, locale: string): T;
|
71
|
+
export declare function getNextLastDayOfWeek<T extends DateValue = DateValue>(date: T, firstDayOfWeek: number, locale: string): T;
|
72
|
+
export declare function areAllDaysBetweenValid(start: DateValue, end: DateValue, isUnavailable: DateMatcher | undefined, isDisabled: DateMatcher | undefined): boolean;
|
73
|
+
export type Granularity = 'day' | 'hour' | 'minute' | 'second';
|
74
|
+
export type TimeGranularity = 'hour' | 'minute' | 'second';
|
75
|
+
type GetDefaultDateProps = {
|
76
|
+
defaultValue?: DateValue | DateValue[] | undefined;
|
77
|
+
defaultPlaceholder?: DateValue | undefined;
|
78
|
+
granularity?: Granularity;
|
79
|
+
locale?: string;
|
80
|
+
};
|
81
|
+
/**
|
82
|
+
* A helper function used throughout the various date builders
|
83
|
+
* to generate a default `DateValue` using the `defaultValue`,
|
84
|
+
* `defaultPlaceholder`, and `granularity` props.
|
85
|
+
*
|
86
|
+
* It's important to match the `DateValue` type being used
|
87
|
+
* elsewhere in the builder, so they behave according to the
|
88
|
+
* behavior the user expects based on the props they've provided.
|
89
|
+
*
|
90
|
+
*/
|
91
|
+
export declare function getDefaultDate(props: GetDefaultDateProps): DateValue;
|
92
|
+
export {};
|
@@ -0,0 +1,30 @@
|
|
1
|
+
import { type DateValue } from '@internationalized/date';
|
2
|
+
export interface DateFormatterOptions extends Intl.DateTimeFormatOptions {
|
3
|
+
calendar?: string;
|
4
|
+
}
|
5
|
+
export type Formatter = {
|
6
|
+
getLocale: () => string;
|
7
|
+
setLocale: (newLocale: string) => void;
|
8
|
+
custom: (date: Date, options: DateFormatterOptions) => string;
|
9
|
+
selectedDate: (date: DateValue, includeTime?: boolean) => string;
|
10
|
+
dayOfWeek: (date: Date, length?: DateFormatterOptions['weekday']) => string;
|
11
|
+
fullMonthAndYear: (date: Date, options?: DateFormatterOptions) => string;
|
12
|
+
fullMonth: (date: Date, options?: DateFormatterOptions) => string;
|
13
|
+
fullYear: (date: Date, options?: DateFormatterOptions) => string;
|
14
|
+
dayPeriod: (date: Date) => string;
|
15
|
+
part: (dateObj: DateValue, type: Intl.DateTimeFormatPartTypes, options?: DateFormatterOptions) => string;
|
16
|
+
toParts: (date: DateValue, options?: DateFormatterOptions) => Intl.DateTimeFormatPart[];
|
17
|
+
getMonths: () => {
|
18
|
+
label: string;
|
19
|
+
value: number;
|
20
|
+
}[];
|
21
|
+
};
|
22
|
+
/**
|
23
|
+
* Creates a wrapper around the `DateFormatter`, which is
|
24
|
+
* an improved version of the {@link Intl.DateTimeFormat} API,
|
25
|
+
* that is used internally by the various date builders to
|
26
|
+
* easily format dates in a consistent way.
|
27
|
+
*
|
28
|
+
* @see [DateFormatter](https://react-spectrum.adobe.com/internationalized/date/DateFormatter.html)
|
29
|
+
*/
|
30
|
+
export declare function createFormatter(initialLocale: string): Formatter;
|
@@ -0,0 +1,8 @@
|
|
1
|
+
declare const supportedLocales: readonly ["ach", "af", "am", "an", "ar", "ast", "az", "be", "bg", "bn", "br", "bs", "ca", "cak", "ckb", "cs", "cy", "da", "de", "dsb", "el", "en", "eo", "es", "et", "eu", "fa", "ff", "fi", "fr", "fy", "ga", "gd", "gl", "he", "hr", "hsb", "hu", "ia", "id", "it", "ja", "ka", "kk", "kn", "ko", "lb", "lo", "lt", "lv", "meh", "ml", "ms", "nl", "nn", "no", "oc", "pl", "pt", "rm", "ro", "ru", "sc", "scn", "sk", "sl", "sr", "sv", "szl", "tg", "th", "tr", "uk", "zh-CN", "zh-TW"];
|
2
|
+
declare const placeholderFields: readonly ["year", "month", "day"];
|
3
|
+
type SupportedLocale = (typeof supportedLocales)[number];
|
4
|
+
type PlaceholderField = (typeof placeholderFields)[number];
|
5
|
+
export type PlaceholderMap = Record<SupportedLocale, Record<PlaceholderField, string>>;
|
6
|
+
type Field = 'era' | 'year' | 'month' | 'day' | 'hour' | 'minute' | 'second' | 'dayPeriod';
|
7
|
+
export declare function getPlaceholder(field: Field, value: string, locale: SupportedLocale | (string & {})): string;
|
8
|
+
export {};
|
@@ -0,0 +1,28 @@
|
|
1
|
+
import type { DateValue } from '@internationalized/date';
|
2
|
+
export type DateMatcher = (date: DateValue) => boolean;
|
3
|
+
export type HourCycle = 12 | 24;
|
4
|
+
export type Month<T> = {
|
5
|
+
/**
|
6
|
+
* A `DateValue` used to represent the month. Since days
|
7
|
+
* from the previous and next months may be included in the
|
8
|
+
* calendar grid, we need a source of truth for the value
|
9
|
+
* the grid is representing.
|
10
|
+
*/
|
11
|
+
value: DateValue;
|
12
|
+
/**
|
13
|
+
* An array of (rows) arrays representing the weeks in the calendar.
|
14
|
+
* Each sub-array represents a week, and contains the dates for each
|
15
|
+
* day in that week. This structure is useful for rendering the calendar
|
16
|
+
* grid using a table, where each row represents a week and each cell
|
17
|
+
* represents a day.
|
18
|
+
*/
|
19
|
+
weeks: T[][];
|
20
|
+
/**
|
21
|
+
* An array of (cells) all the dates in the current month, including dates from
|
22
|
+
* the previous and next months that are used to fill out the calendar grid.
|
23
|
+
* This array is useful for rendering the calendar grid in a customizable way,
|
24
|
+
* as it provides all the dates that should be displayed in the grid in a flat
|
25
|
+
* array.
|
26
|
+
*/
|
27
|
+
dates: T[];
|
28
|
+
};
|