@radix-ng/primitives 0.33.2 → 0.35.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/calendar/src/calendar-root.directive.d.ts +3 -3
- package/core/index.d.ts +1 -0
- package/core/src/accessor/provide-value-accessor.d.ts +1 -1
- package/core/src/date-time/index.d.ts +3 -0
- package/core/src/date-time/parser.d.ts +37 -0
- package/core/src/date-time/parts.d.ts +12 -0
- package/core/src/date-time/segment.d.ts +4 -0
- package/core/src/date-time/types.d.ts +18 -1
- package/core/src/date-time/useDateField.d.ts +141 -0
- package/core/src/date-time/utils.d.ts +3 -0
- package/core/src/provide-token.d.ts +22 -0
- package/date-field/README.md +1 -0
- package/date-field/index.d.ts +2 -0
- package/date-field/src/date-field-context.token.d.ts +18 -0
- package/date-field/src/date-field-input.directive.d.ts +53 -0
- package/date-field/src/date-field-root.directive.d.ts +126 -0
- package/dialog/src/dialog-ref.d.ts +3 -0
- package/dialog/src/dialog.config.d.ts +1 -0
- package/fesm2022/radix-ng-primitives-calendar.mjs +6 -15
- package/fesm2022/radix-ng-primitives-calendar.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-checkbox.mjs +3 -4
- package/fesm2022/radix-ng-primitives-checkbox.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-core.mjs +1014 -8
- package/fesm2022/radix-ng-primitives-core.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-date-field.mjs +320 -0
- package/fesm2022/radix-ng-primitives-date-field.mjs.map +1 -0
- package/fesm2022/radix-ng-primitives-dialog.mjs +54 -4
- package/fesm2022/radix-ng-primitives-dialog.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-navigation-menu.mjs +0 -2
- package/fesm2022/radix-ng-primitives-navigation-menu.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-progress.mjs +3 -3
- package/fesm2022/radix-ng-primitives-progress.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-radio.mjs +7 -7
- package/fesm2022/radix-ng-primitives-radio.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-switch.mjs +7 -15
- package/fesm2022/radix-ng-primitives-switch.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-tabs.mjs +3 -6
- package/fesm2022/radix-ng-primitives-tabs.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-toggle-group.mjs +8 -10
- package/fesm2022/radix-ng-primitives-toggle-group.mjs.map +1 -1
- package/fesm2022/radix-ng-primitives-toggle.mjs +5 -12
- package/fesm2022/radix-ng-primitives-toggle.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/switch/src/switch-root.directive.d.ts +0 -1
- package/toggle/src/toggle.directive.d.ts +0 -1
- package/tooltip/src/tooltip-root.directive.d.ts +4 -4
@@ -85,9 +85,9 @@ export declare class RdxCalendarRootDirective implements AfterViewInit {
|
|
85
85
|
* The days of the week
|
86
86
|
*/
|
87
87
|
readonly weekDays: import("@angular/core").ModelSignal<string[] | undefined>;
|
88
|
-
protected readonly
|
89
|
-
protected readonly
|
90
|
-
protected readonly
|
88
|
+
protected readonly _fixedWeeks: import("@angular/core").WritableSignal<boolean>;
|
89
|
+
protected readonly _disabled: import("@angular/core").WritableSignal<boolean>;
|
90
|
+
protected readonly _pagedNavigation: import("@angular/core").WritableSignal<boolean>;
|
91
91
|
/**
|
92
92
|
* @ignore
|
93
93
|
*/
|
package/core/index.d.ts
CHANGED
@@ -9,6 +9,7 @@ export * from './src/is-inside-form';
|
|
9
9
|
export * from './src/is-nullish';
|
10
10
|
export * from './src/is-number';
|
11
11
|
export * from './src/kbd-constants';
|
12
|
+
export * from './src/provide-token';
|
12
13
|
export * from './src/window';
|
13
14
|
export * from './src/date-time';
|
14
15
|
export * from './src/positioning/constants';
|
@@ -1,6 +1,9 @@
|
|
1
1
|
export * from './calendar';
|
2
2
|
export * from './comparators';
|
3
3
|
export * from './formatter';
|
4
|
+
export * from './parser';
|
4
5
|
export * from './placeholders';
|
6
|
+
export * from './segment';
|
5
7
|
export * from './types';
|
8
|
+
export * from './useDateField';
|
6
9
|
export * from './utils';
|
@@ -0,0 +1,37 @@
|
|
1
|
+
import { InputSignal } from '@angular/core';
|
2
|
+
import { DateValue } from '@internationalized/date';
|
3
|
+
import { Granularity } from './comparators';
|
4
|
+
import { Formatter } from './formatter';
|
5
|
+
import { HourCycle, SegmentContentObj, SegmentPart, SegmentValueObj } from './types';
|
6
|
+
type SyncDateSegmentValuesProps = {
|
7
|
+
value: DateValue;
|
8
|
+
formatter: Formatter;
|
9
|
+
};
|
10
|
+
type SyncTimeSegmentValuesProps = {
|
11
|
+
value: DateValue;
|
12
|
+
formatter: Formatter;
|
13
|
+
};
|
14
|
+
export declare function syncTimeSegmentValues(props: SyncTimeSegmentValuesProps): SegmentValueObj;
|
15
|
+
export declare function initializeSegmentValues(granularity: Granularity): SegmentValueObj;
|
16
|
+
type SharedContentProps = {
|
17
|
+
granularity: Granularity;
|
18
|
+
dateRef: DateValue;
|
19
|
+
formatter: Formatter;
|
20
|
+
hideTimeZone: boolean;
|
21
|
+
hourCycle: HourCycle;
|
22
|
+
isTimeValue?: boolean;
|
23
|
+
};
|
24
|
+
type CreateContentObjProps = SharedContentProps & {
|
25
|
+
segmentValues: SegmentValueObj;
|
26
|
+
locale: InputSignal<string>;
|
27
|
+
};
|
28
|
+
export declare function syncSegmentValues(props: SyncDateSegmentValuesProps): SegmentValueObj;
|
29
|
+
type CreateContentProps = CreateContentObjProps;
|
30
|
+
export declare function createContent(props: CreateContentProps): {
|
31
|
+
obj: SegmentContentObj;
|
32
|
+
arr: {
|
33
|
+
part: SegmentPart;
|
34
|
+
value: string;
|
35
|
+
}[];
|
36
|
+
};
|
37
|
+
export {};
|
@@ -0,0 +1,12 @@
|
|
1
|
+
import type { DateSegmentPart, EditableSegmentPart, SegmentPart, TimeSegmentPart } from './types';
|
2
|
+
export declare const DATE_SEGMENT_PARTS: readonly ["day", "month", "year"];
|
3
|
+
export declare const TIME_SEGMENT_PARTS: readonly ["hour", "minute", "second", "dayPeriod"];
|
4
|
+
export declare const NON_EDITABLE_SEGMENT_PARTS: readonly ["literal", "timeZoneName"];
|
5
|
+
export declare const EDITABLE_SEGMENT_PARTS: readonly ["day", "month", "year", "hour", "minute", "second", "dayPeriod"];
|
6
|
+
export declare const EDITABLE_TIME_SEGMENT_PARTS: readonly ["hour", "minute", "second", "dayPeriod"];
|
7
|
+
export declare const ALL_SEGMENT_PARTS: readonly ["day", "month", "year", "hour", "minute", "second", "dayPeriod", "literal", "timeZoneName"];
|
8
|
+
export declare const ALL_EXCEPT_LITERAL_PARTS: ("day" | "month" | "year" | "hour" | "minute" | "second" | "dayPeriod" | "timeZoneName")[];
|
9
|
+
export declare function isDateSegmentPart(part: unknown): part is DateSegmentPart;
|
10
|
+
export declare function isTimeSegmentPart(part: unknown): part is TimeSegmentPart;
|
11
|
+
export declare function isSegmentPart(part: string): part is EditableSegmentPart;
|
12
|
+
export declare function isAnySegmentPart(part: unknown): part is SegmentPart;
|
@@ -0,0 +1,4 @@
|
|
1
|
+
export declare function isSegmentNavigationKey(key: string): boolean;
|
2
|
+
export declare function isNumberString(value: string): boolean;
|
3
|
+
export declare function isAcceptableSegmentKey(key: string): boolean;
|
4
|
+
export declare function getSegmentElements(parentElement: HTMLElement): Element[];
|
@@ -1,6 +1,7 @@
|
|
1
1
|
import type { DateValue } from '@internationalized/date';
|
2
|
+
import { DATE_SEGMENT_PARTS, EDITABLE_SEGMENT_PARTS, NON_EDITABLE_SEGMENT_PARTS, TIME_SEGMENT_PARTS } from './parts';
|
2
3
|
export type DateMatcher = (date: DateValue) => boolean;
|
3
|
-
export type HourCycle = 12 | 24;
|
4
|
+
export type HourCycle = 12 | 24 | undefined;
|
4
5
|
export type Month<T> = {
|
5
6
|
/**
|
6
7
|
* A `DateValue` used to represent the month. Since days
|
@@ -26,3 +27,19 @@ export type Month<T> = {
|
|
26
27
|
*/
|
27
28
|
dates: T[];
|
28
29
|
};
|
30
|
+
export type DateSegmentPart = (typeof DATE_SEGMENT_PARTS)[number];
|
31
|
+
export type TimeSegmentPart = (typeof TIME_SEGMENT_PARTS)[number];
|
32
|
+
export type EditableSegmentPart = (typeof EDITABLE_SEGMENT_PARTS)[number];
|
33
|
+
export type NonEditableSegmentPart = (typeof NON_EDITABLE_SEGMENT_PARTS)[number];
|
34
|
+
export type SegmentPart = EditableSegmentPart | NonEditableSegmentPart;
|
35
|
+
export type AnyExceptLiteral = Exclude<SegmentPart, 'literal'>;
|
36
|
+
export type DayPeriod = 'AM' | 'PM' | null;
|
37
|
+
export type DateSegmentObj = {
|
38
|
+
[K in DateSegmentPart]: number | null;
|
39
|
+
};
|
40
|
+
export type TimeSegmentObj = {
|
41
|
+
[K in TimeSegmentPart]: K extends 'dayPeriod' ? DayPeriod : number | null;
|
42
|
+
};
|
43
|
+
export type DateAndTimeSegmentObj = DateSegmentObj & TimeSegmentObj;
|
44
|
+
export type SegmentValueObj = DateSegmentObj | DateAndTimeSegmentObj;
|
45
|
+
export type SegmentContentObj = Record<EditableSegmentPart, string>;
|
@@ -0,0 +1,141 @@
|
|
1
|
+
import { InputSignal, ModelSignal, WritableSignal } from '@angular/core';
|
2
|
+
import { DateValue } from '@internationalized/date';
|
3
|
+
import { Formatter } from './formatter';
|
4
|
+
import { HourCycle, SegmentPart, SegmentValueObj } from './types';
|
5
|
+
export type UseDateFieldProps = {
|
6
|
+
hasLeftFocus: WritableSignal<boolean>;
|
7
|
+
lastKeyZero: WritableSignal<boolean>;
|
8
|
+
placeholder: ModelSignal<DateValue>;
|
9
|
+
hourCycle: HourCycle;
|
10
|
+
formatter: Formatter;
|
11
|
+
segmentValues: WritableSignal<SegmentValueObj>;
|
12
|
+
disabled: InputSignal<boolean>;
|
13
|
+
readonly: InputSignal<boolean>;
|
14
|
+
part: SegmentPart;
|
15
|
+
modelValue: ModelSignal<DateValue | undefined>;
|
16
|
+
focusNext: () => void;
|
17
|
+
};
|
18
|
+
type SegmentAttrProps = {
|
19
|
+
disabled: boolean;
|
20
|
+
segmentValues: SegmentValueObj;
|
21
|
+
hourCycle: HourCycle;
|
22
|
+
placeholder: DateValue;
|
23
|
+
formatter: Formatter;
|
24
|
+
};
|
25
|
+
declare function daySegmentAttrs(props: SegmentAttrProps): {
|
26
|
+
'aria-label': string;
|
27
|
+
'aria-valuemin': number;
|
28
|
+
'aria-valuemax': number;
|
29
|
+
'aria-valuenow': number;
|
30
|
+
'aria-valuetext': string;
|
31
|
+
'data-placeholder': string | undefined;
|
32
|
+
role: string;
|
33
|
+
contenteditable: boolean;
|
34
|
+
tabindex: number | undefined;
|
35
|
+
spellcheck: boolean;
|
36
|
+
inputmode: string;
|
37
|
+
autocorrect: string;
|
38
|
+
enterkeyhint: string;
|
39
|
+
style: string;
|
40
|
+
};
|
41
|
+
declare function monthSegmentAttrs(props: SegmentAttrProps): {
|
42
|
+
'aria-label': string;
|
43
|
+
contenteditable: boolean;
|
44
|
+
'aria-valuemin': number;
|
45
|
+
'aria-valuemax': number;
|
46
|
+
'aria-valuenow': number;
|
47
|
+
'aria-valuetext': string;
|
48
|
+
'data-placeholder': string | undefined;
|
49
|
+
role: string;
|
50
|
+
tabindex: number | undefined;
|
51
|
+
spellcheck: boolean;
|
52
|
+
inputmode: string;
|
53
|
+
autocorrect: string;
|
54
|
+
enterkeyhint: string;
|
55
|
+
style: string;
|
56
|
+
};
|
57
|
+
declare function yearSegmentAttrs(props: SegmentAttrProps): {
|
58
|
+
'aria-label': string;
|
59
|
+
'aria-valuemin': number;
|
60
|
+
'aria-valuemax': number;
|
61
|
+
'aria-valuenow': number;
|
62
|
+
'aria-valuetext': string;
|
63
|
+
'data-placeholder': string | undefined;
|
64
|
+
role: string;
|
65
|
+
contenteditable: boolean;
|
66
|
+
tabindex: number | undefined;
|
67
|
+
spellcheck: boolean;
|
68
|
+
inputmode: string;
|
69
|
+
autocorrect: string;
|
70
|
+
enterkeyhint: string;
|
71
|
+
style: string;
|
72
|
+
};
|
73
|
+
declare function hourSegmentAttrs(props: SegmentAttrProps): {};
|
74
|
+
declare function minuteSegmentAttrs(props: SegmentAttrProps): {};
|
75
|
+
declare function secondSegmentAttrs(props: SegmentAttrProps): {};
|
76
|
+
declare function dayPeriodSegmentAttrs(props: SegmentAttrProps): {};
|
77
|
+
declare function literalSegmentAttrs(_props: SegmentAttrProps): {
|
78
|
+
'aria-hidden': boolean;
|
79
|
+
'data-segment': string;
|
80
|
+
};
|
81
|
+
declare function timeZoneSegmentAttrs(props: SegmentAttrProps): {
|
82
|
+
role: string;
|
83
|
+
'aria-label': string;
|
84
|
+
'data-readonly': boolean;
|
85
|
+
'data-segment': string;
|
86
|
+
tabindex: number | undefined;
|
87
|
+
style: string;
|
88
|
+
};
|
89
|
+
declare function eraSegmentAttrs(props: SegmentAttrProps): {
|
90
|
+
'aria-label': string;
|
91
|
+
'aria-valuemin': number;
|
92
|
+
'aria-valuemax': number;
|
93
|
+
'aria-valuenow': number;
|
94
|
+
'aria-valuetext': unknown;
|
95
|
+
role: string;
|
96
|
+
contenteditable: boolean;
|
97
|
+
tabindex: number | undefined;
|
98
|
+
spellcheck: boolean;
|
99
|
+
inputmode: string;
|
100
|
+
autocorrect: string;
|
101
|
+
enterkeyhint: string;
|
102
|
+
style: string;
|
103
|
+
};
|
104
|
+
export declare const segmentBuilders: {
|
105
|
+
day: {
|
106
|
+
attrs: typeof daySegmentAttrs;
|
107
|
+
};
|
108
|
+
month: {
|
109
|
+
attrs: typeof monthSegmentAttrs;
|
110
|
+
};
|
111
|
+
year: {
|
112
|
+
attrs: typeof yearSegmentAttrs;
|
113
|
+
};
|
114
|
+
hour: {
|
115
|
+
attrs: typeof hourSegmentAttrs;
|
116
|
+
};
|
117
|
+
minute: {
|
118
|
+
attrs: typeof minuteSegmentAttrs;
|
119
|
+
};
|
120
|
+
second: {
|
121
|
+
attrs: typeof secondSegmentAttrs;
|
122
|
+
};
|
123
|
+
dayPeriod: {
|
124
|
+
attrs: typeof dayPeriodSegmentAttrs;
|
125
|
+
};
|
126
|
+
literal: {
|
127
|
+
attrs: typeof literalSegmentAttrs;
|
128
|
+
};
|
129
|
+
timeZoneName: {
|
130
|
+
attrs: typeof timeZoneSegmentAttrs;
|
131
|
+
};
|
132
|
+
era: {
|
133
|
+
attrs: typeof eraSegmentAttrs;
|
134
|
+
};
|
135
|
+
};
|
136
|
+
export declare function useDateField(props: UseDateFieldProps): {
|
137
|
+
handleSegmentClick: (e: MouseEvent) => void;
|
138
|
+
handleSegmentKeydown: (e: KeyboardEvent) => void;
|
139
|
+
attributes: import("@angular/core").Signal<{}>;
|
140
|
+
};
|
141
|
+
export {};
|
@@ -1 +1,4 @@
|
|
1
|
+
import { Granularity } from './comparators';
|
2
|
+
import { HourCycle } from './types';
|
3
|
+
export declare function getOptsByGranularity(granularity: Granularity, hourCycle: HourCycle, isTimeValue?: boolean): Intl.DateTimeFormatOptions;
|
1
4
|
export declare function handleCalendarInitialFocus(calendar: HTMLElement): void;
|
@@ -0,0 +1,22 @@
|
|
1
|
+
import { InjectionToken, Provider, Type } from '@angular/core';
|
2
|
+
/**
|
3
|
+
* Creates an Angular provider that binds the given token to the existing instance
|
4
|
+
* of the specified class. This is especially useful when you want multiple
|
5
|
+
* tokens (or interfaces) to resolve to the same directive/component instance.
|
6
|
+
*
|
7
|
+
* @template T - The type associated with the injection token.
|
8
|
+
* @param token - The InjectionToken or abstract type you want to provide.
|
9
|
+
* @param type - The class type whose existing instance will be used for this token.
|
10
|
+
* @returns A Provider configuration object for Angular's DI system.
|
11
|
+
*
|
12
|
+
* @example
|
13
|
+
*
|
14
|
+
* @Directive({
|
15
|
+
* providers: [
|
16
|
+
* provideToken(RdxToggleGroupToken, RdxToggleGroupDirective),
|
17
|
+
* provideValueAccessor(RdxToggleGroupDirective)
|
18
|
+
* ]
|
19
|
+
* })
|
20
|
+
* export class RdxToggleGroupDirective {}
|
21
|
+
*/
|
22
|
+
export declare function provideToken<T>(token: InjectionToken<T>, type: Type<unknown>): Provider;
|
@@ -0,0 +1 @@
|
|
1
|
+
# @radix-ng/primitives/date-field
|
@@ -0,0 +1,18 @@
|
|
1
|
+
import { InjectionToken, InputSignal, ModelSignal, Signal, WritableSignal } from '@angular/core';
|
2
|
+
import { DateValue } from '@internationalized/date';
|
3
|
+
import { Formatter, HourCycle, SegmentValueObj } from '@radix-ng/primitives/core';
|
4
|
+
export interface DateFieldContextToken {
|
5
|
+
locale: InputSignal<string>;
|
6
|
+
value: ModelSignal<DateValue | undefined>;
|
7
|
+
disabled: InputSignal<boolean>;
|
8
|
+
readonly: InputSignal<boolean>;
|
9
|
+
isInvalid: Signal<boolean>;
|
10
|
+
placeholder: ModelSignal<DateValue>;
|
11
|
+
hourCycle: InputSignal<HourCycle>;
|
12
|
+
formatter: Formatter;
|
13
|
+
segmentValues: WritableSignal<SegmentValueObj>;
|
14
|
+
focusNext: () => void;
|
15
|
+
setFocusedElement: (el: HTMLElement) => void;
|
16
|
+
}
|
17
|
+
export declare const DATE_FIELDS_ROOT_CONTEXT: InjectionToken<DateFieldContextToken>;
|
18
|
+
export declare function injectDateFieldsRootContext(): DateFieldContextToken;
|
@@ -0,0 +1,53 @@
|
|
1
|
+
import { ElementRef } from '@angular/core';
|
2
|
+
import { SegmentPart } from '@radix-ng/primitives/core';
|
3
|
+
import * as i0 from "@angular/core";
|
4
|
+
export declare class RdxDateFieldInputDirective {
|
5
|
+
private el;
|
6
|
+
private readonly rootContext;
|
7
|
+
/**
|
8
|
+
* The part of the date to render
|
9
|
+
* `'day' | 'month' | 'year' | 'hour' | 'minute' | 'second' | 'dayPeriod' | 'literal' | 'timeZoneName'`
|
10
|
+
*/
|
11
|
+
readonly part: import("@angular/core").InputSignal<SegmentPart | undefined>;
|
12
|
+
/**
|
13
|
+
* @ignore
|
14
|
+
*/
|
15
|
+
readonly disabled: import("@angular/core").Signal<boolean>;
|
16
|
+
/**
|
17
|
+
* @ignore
|
18
|
+
*/
|
19
|
+
readonly readonly: import("@angular/core").Signal<boolean>;
|
20
|
+
/**
|
21
|
+
* @ignore
|
22
|
+
*/
|
23
|
+
readonly isInvalid: import("@angular/core").Signal<boolean>;
|
24
|
+
/**
|
25
|
+
* @ignore
|
26
|
+
*/
|
27
|
+
readonly hasLeftFocus: import("@angular/core").WritableSignal<boolean>;
|
28
|
+
/**
|
29
|
+
* @ignore
|
30
|
+
*/
|
31
|
+
readonly lastKeyZero: import("@angular/core").WritableSignal<boolean>;
|
32
|
+
private readonly fieldData;
|
33
|
+
private readonly attributes;
|
34
|
+
/**
|
35
|
+
* @ignore
|
36
|
+
*/
|
37
|
+
handleSegmentClick: (e: MouseEvent) => void;
|
38
|
+
/**
|
39
|
+
* @ignore
|
40
|
+
*/
|
41
|
+
handleSegmentKeydown: (e: KeyboardEvent) => void;
|
42
|
+
constructor(el: ElementRef);
|
43
|
+
/**
|
44
|
+
* @ignore
|
45
|
+
*/
|
46
|
+
onFocus(e: FocusEvent): void;
|
47
|
+
/**
|
48
|
+
* @ignore
|
49
|
+
*/
|
50
|
+
onFocusOut(): void;
|
51
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<RdxDateFieldInputDirective, never>;
|
52
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<RdxDateFieldInputDirective, "[rdxDateFieldInput]", never, { "part": { "alias": "part"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
53
|
+
}
|
@@ -0,0 +1,126 @@
|
|
1
|
+
import { Direction } from '@angular/cdk/bidi';
|
2
|
+
import { BooleanInput } from '@angular/cdk/coercion';
|
3
|
+
import { AfterViewInit, OnInit } from '@angular/core';
|
4
|
+
import { DateValue } from '@internationalized/date';
|
5
|
+
import { DateMatcher, Formatter, Granularity, HourCycle, SegmentValueObj } from '@radix-ng/primitives/core';
|
6
|
+
import * as i0 from "@angular/core";
|
7
|
+
export declare class RdxDateFieldRootDirective implements OnInit, AfterViewInit {
|
8
|
+
private readonly elementRef;
|
9
|
+
/**
|
10
|
+
* The controlled checked state of the calendar.
|
11
|
+
*/
|
12
|
+
readonly value: import("@angular/core").ModelSignal<DateValue | undefined>;
|
13
|
+
/**
|
14
|
+
* A callback fired when the date field's value is invalid.
|
15
|
+
*/
|
16
|
+
readonly isDateUnavailable: import("@angular/core").InputSignal<DateMatcher | undefined>;
|
17
|
+
/**
|
18
|
+
* The hour cycle to use for formatting times. Defaults to the locale preference
|
19
|
+
*/
|
20
|
+
readonly hourCycle: import("@angular/core").InputSignal<HourCycle>;
|
21
|
+
/**
|
22
|
+
* The granularity to use for formatting the field. Defaults to 'day' if a CalendarDate is provided, otherwise defaults to 'minute'.
|
23
|
+
* The field will render segments for each part of the date up to and including the specified granularity.
|
24
|
+
*/
|
25
|
+
readonly granularity: import("@angular/core").InputSignal<Granularity | undefined>;
|
26
|
+
/**
|
27
|
+
* The locale to use for formatting dates.
|
28
|
+
*/
|
29
|
+
readonly locale: import("@angular/core").InputSignal<string>;
|
30
|
+
readonly dir: import("@angular/core").InputSignal<Direction>;
|
31
|
+
/**
|
32
|
+
* The minimum valid date that can be entered.
|
33
|
+
*/
|
34
|
+
readonly minValue: import("@angular/core").InputSignal<DateValue | undefined>;
|
35
|
+
/**
|
36
|
+
* The maximum valid date that can be entered.
|
37
|
+
*/
|
38
|
+
readonly maxValue: import("@angular/core").InputSignal<DateValue | undefined>;
|
39
|
+
/**
|
40
|
+
* Whether or not to hide the time zone segment of the field.
|
41
|
+
*/
|
42
|
+
readonly hideTimeZone: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
|
43
|
+
readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
|
44
|
+
/**
|
45
|
+
* Whether or not the field is readonly.
|
46
|
+
*/
|
47
|
+
readonly readonly: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
|
48
|
+
/**
|
49
|
+
* @ignore
|
50
|
+
*/
|
51
|
+
readonly defaultDate: import("@angular/core").Signal<DateValue>;
|
52
|
+
/**
|
53
|
+
* The placeholder date, which is used to determine what month to display when no date is selected. This updates as the user navigates the calendar and can be used to programmatically control the calendar view
|
54
|
+
*/
|
55
|
+
readonly placeholder: import("@angular/core").ModelSignal<DateValue | undefined>;
|
56
|
+
/**
|
57
|
+
* @ignore
|
58
|
+
*/
|
59
|
+
readonly segmentElements: import("@angular/core").WritableSignal<Set<HTMLElement>>;
|
60
|
+
/**
|
61
|
+
* @ignore
|
62
|
+
*/
|
63
|
+
readonly currentFocusedElement: import("@angular/core").WritableSignal<HTMLElement | null>;
|
64
|
+
/**
|
65
|
+
* @ignore
|
66
|
+
*/
|
67
|
+
formatter: Formatter;
|
68
|
+
/**
|
69
|
+
* @ignore
|
70
|
+
*/
|
71
|
+
readonly segmentValues: import("@angular/core").WritableSignal<SegmentValueObj>;
|
72
|
+
/**
|
73
|
+
* @ignore
|
74
|
+
*/
|
75
|
+
readonly inferredGranularity: import("@angular/core").Signal<Granularity | undefined>;
|
76
|
+
/**
|
77
|
+
* @ignore
|
78
|
+
*/
|
79
|
+
readonly isInvalid: import("@angular/core").Signal<boolean>;
|
80
|
+
/**
|
81
|
+
* @ignore
|
82
|
+
*/
|
83
|
+
readonly allSegmentContent: import("@angular/core").Signal<{
|
84
|
+
obj: import("@radix-ng/primitives/core").SegmentContentObj;
|
85
|
+
arr: {
|
86
|
+
part: import("@radix-ng/primitives/core").SegmentPart;
|
87
|
+
value: string;
|
88
|
+
}[];
|
89
|
+
}>;
|
90
|
+
/**
|
91
|
+
* An array of segments that should be readonly, which prevent user input on them.
|
92
|
+
*/
|
93
|
+
readonly segmentContents: import("@angular/core").Signal<{
|
94
|
+
part: import("@radix-ng/primitives/core").SegmentPart;
|
95
|
+
value: string;
|
96
|
+
}[]>;
|
97
|
+
/**
|
98
|
+
* @ignore
|
99
|
+
*/
|
100
|
+
readonly currentSegmentIndex: import("@angular/core").Signal<number>;
|
101
|
+
/**
|
102
|
+
* @ignore
|
103
|
+
*/
|
104
|
+
readonly prevFocusableSegment: import("@angular/core").Signal<HTMLElement | null>;
|
105
|
+
/**
|
106
|
+
* @ignore
|
107
|
+
*/
|
108
|
+
readonly nextFocusableSegment: import("@angular/core").Signal<HTMLElement | null>;
|
109
|
+
/**
|
110
|
+
* @ignore
|
111
|
+
*/
|
112
|
+
readonly focusNext: () => void;
|
113
|
+
constructor();
|
114
|
+
ngOnInit(): void;
|
115
|
+
ngAfterViewInit(): void;
|
116
|
+
/**
|
117
|
+
* @ignore
|
118
|
+
*/
|
119
|
+
onKeydown(event: KeyboardEvent): void;
|
120
|
+
/**
|
121
|
+
* @ignore
|
122
|
+
*/
|
123
|
+
setFocusedElement(el: HTMLElement): void;
|
124
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<RdxDateFieldRootDirective, never>;
|
125
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<RdxDateFieldRootDirective, "[rdxDateFieldRoot]", ["rdxDateFieldRoot"], { "value": { "alias": "value"; "required": false; "isSignal": true; }; "isDateUnavailable": { "alias": "isDateUnavailable"; "required": false; "isSignal": true; }; "hourCycle": { "alias": "hourCycle"; "required": false; "isSignal": true; }; "granularity": { "alias": "granularity"; "required": false; "isSignal": true; }; "locale": { "alias": "locale"; "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; }; "hideTimeZone": { "alias": "hideTimeZone"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "placeholder": "placeholderChange"; }, never, never, true, never>;
|
126
|
+
}
|
@@ -10,6 +10,9 @@ export declare const DISMISSED_VALUE: {};
|
|
10
10
|
export declare class RdxDialogRef<C = unknown> {
|
11
11
|
readonly cdkRef: DialogRef<RdxDialogResult<C> | typeof DISMISSED_VALUE, C>;
|
12
12
|
readonly config: RdxDialogConfig<C>;
|
13
|
+
private _previousTimeout;
|
14
|
+
private readonly _openSignal;
|
15
|
+
readonly state: import("@angular/core").Signal<"open" | "closed">;
|
13
16
|
closed$: Observable<RdxDialogResult<C> | undefined>;
|
14
17
|
dismissed$: Observable<void>;
|
15
18
|
result$: Observable<RdxDialogResult<C>>;
|
@@ -26,6 +26,7 @@ type RdxBaseDialogConfig<C> = {
|
|
26
26
|
autoFocus?: AutoFocusTarget | 'first-input' | string;
|
27
27
|
canClose?: (comp: C) => boolean | Observable<boolean>;
|
28
28
|
canCloseWithBackdrop?: boolean;
|
29
|
+
closeDelay?: number;
|
29
30
|
cdkConfigOverride?: Partial<DialogConfig<C>>;
|
30
31
|
mode?: RdxDialogMode;
|
31
32
|
backdropClass?: string | string[];
|
@@ -744,18 +744,9 @@ class RdxCalendarRootDirective {
|
|
744
744
|
* The days of the week
|
745
745
|
*/
|
746
746
|
this.weekDays = model();
|
747
|
-
this.
|
748
|
-
|
749
|
-
|
750
|
-
});
|
751
|
-
this.disabledRef = linkedSignal({
|
752
|
-
source: this.disabled,
|
753
|
-
computation: (value) => value
|
754
|
-
});
|
755
|
-
this.pagedNavigationRef = linkedSignal({
|
756
|
-
source: this.pagedNavigation,
|
757
|
-
computation: (value) => value
|
758
|
-
});
|
747
|
+
this._fixedWeeks = linkedSignal(this.fixedWeeks);
|
748
|
+
this._disabled = linkedSignal(this.disabled);
|
749
|
+
this._pagedNavigation = linkedSignal(this.pagedNavigation);
|
759
750
|
/**
|
760
751
|
* @ignore
|
761
752
|
*/
|
@@ -768,13 +759,13 @@ class RdxCalendarRootDirective {
|
|
768
759
|
locale: this.locale,
|
769
760
|
placeholder: this.placeholder,
|
770
761
|
weekStartsOn: this.weekStartsOn,
|
771
|
-
fixedWeeks: this.
|
762
|
+
fixedWeeks: this._fixedWeeks,
|
772
763
|
numberOfMonths: this.numberOfMonths,
|
773
764
|
minValue: this.minValue,
|
774
765
|
maxValue: this.maxValue,
|
775
|
-
disabled: this.
|
766
|
+
disabled: this._disabled,
|
776
767
|
weekdayFormat: this.weekdayFormat,
|
777
|
-
pagedNavigation: this.
|
768
|
+
pagedNavigation: this._pagedNavigation,
|
778
769
|
isDateDisabled: this.isDateDisabled,
|
779
770
|
isDateUnavailable: this.isDateUnavailable,
|
780
771
|
calendarLabel: this.calendarLabel,
|