@brickclay-org/ui 0.0.40 → 0.0.42
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/README.md +1911 -1911
- package/fesm2022/brickclay-org-ui.mjs +5235 -0
- package/fesm2022/brickclay-org-ui.mjs.map +1 -0
- package/index.d.ts +1508 -0
- package/package.json +36 -15
- package/schematics/collection.json +10 -0
- package/schematics/ng-add/index.js +60 -0
- package/schematics/ng-add/schema.json +15 -0
- package/src/lib/dialog/dialog-container.css +102 -0
- package/src/styles.css +1 -0
- package/ASSETS_SETUP.md +0 -59
- package/ng-package.json +0 -29
- package/src/lib/assets/icons.ts +0 -8
- package/src/lib/badge/badge.html +0 -24
- package/src/lib/badge/badge.ts +0 -42
- package/src/lib/brickclay-lib.spec.ts +0 -23
- package/src/lib/brickclay-lib.ts +0 -15
- package/src/lib/button-group/button-group.html +0 -12
- package/src/lib/button-group/button-group.ts +0 -73
- package/src/lib/calender/calendar.module.ts +0 -35
- package/src/lib/calender/components/custom-calendar/custom-calendar.component.css +0 -698
- package/src/lib/calender/components/custom-calendar/custom-calendar.component.html +0 -230
- package/src/lib/calender/components/custom-calendar/custom-calendar.component.spec.ts +0 -23
- package/src/lib/calender/components/custom-calendar/custom-calendar.component.ts +0 -1554
- package/src/lib/calender/components/scheduled-date-picker/scheduled-date-picker.component.css +0 -373
- package/src/lib/calender/components/scheduled-date-picker/scheduled-date-picker.component.html +0 -210
- package/src/lib/calender/components/scheduled-date-picker/scheduled-date-picker.component.ts +0 -361
- package/src/lib/calender/components/time-picker/time-picker.component.css +0 -174
- package/src/lib/calender/components/time-picker/time-picker.component.html +0 -60
- package/src/lib/calender/components/time-picker/time-picker.component.ts +0 -283
- package/src/lib/calender/services/calendar-manager.service.ts +0 -45
- package/src/lib/checkbox/checkbox.html +0 -42
- package/src/lib/checkbox/checkbox.ts +0 -67
- package/src/lib/chips/chips.html +0 -74
- package/src/lib/chips/chips.ts +0 -222
- package/src/lib/grid/components/grid/grid.html +0 -97
- package/src/lib/grid/components/grid/grid.ts +0 -139
- package/src/lib/grid/models/grid.model.ts +0 -20
- package/src/lib/input/input.html +0 -127
- package/src/lib/input/input.ts +0 -394
- package/src/lib/pill/pill.html +0 -24
- package/src/lib/pill/pill.ts +0 -39
- package/src/lib/radio/radio.html +0 -58
- package/src/lib/radio/radio.ts +0 -72
- package/src/lib/select/select.html +0 -111
- package/src/lib/select/select.ts +0 -401
- package/src/lib/spinner/spinner.html +0 -5
- package/src/lib/spinner/spinner.ts +0 -22
- package/src/lib/tabs/tabs.html +0 -28
- package/src/lib/tabs/tabs.ts +0 -48
- package/src/lib/textarea/textarea.html +0 -80
- package/src/lib/textarea/textarea.ts +0 -172
- package/src/lib/toggle/toggle.html +0 -24
- package/src/lib/toggle/toggle.ts +0 -62
- package/src/lib/ui-button/ui-button.html +0 -25
- package/src/lib/ui-button/ui-button.ts +0 -55
- package/src/lib/ui-icon-button/ui-icon-button.html +0 -7
- package/src/lib/ui-icon-button/ui-icon-button.ts +0 -38
- package/src/public-api.ts +0 -43
- package/tsconfig.lib.json +0 -19
- package/tsconfig.lib.prod.json +0 -11
- package/tsconfig.spec.json +0 -15
package/index.d.ts
ADDED
|
@@ -0,0 +1,1508 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { OnInit, OnDestroy, OnChanges, EventEmitter, SimpleChanges, AfterViewInit, QueryList, ElementRef, ComponentRef, Type, InjectionToken } from '@angular/core';
|
|
3
|
+
import * as rxjs from 'rxjs';
|
|
4
|
+
import { Observable } from 'rxjs';
|
|
5
|
+
import * as i1 from '@angular/common';
|
|
6
|
+
import { ControlValueAccessor, NgControl } from '@angular/forms';
|
|
7
|
+
import { CdkDragDrop, CdkDragMove, CdkDragStart } from '@angular/cdk/drag-drop';
|
|
8
|
+
import * as i1$2 from '@angular/cdk/dialog';
|
|
9
|
+
import { CdkDialogContainer, DialogRef as DialogRef$1 } from '@angular/cdk/dialog';
|
|
10
|
+
import * as i2 from '@angular/cdk/overlay';
|
|
11
|
+
import { ScrollStrategy } from '@angular/cdk/overlay';
|
|
12
|
+
import * as i3 from '@angular/cdk/portal';
|
|
13
|
+
import { ComponentPortal } from '@angular/cdk/portal';
|
|
14
|
+
import * as i1$1 from '@angular/cdk/scrolling';
|
|
15
|
+
|
|
16
|
+
declare const BrickclayIcons: {
|
|
17
|
+
readonly arrowleft: "assets/icons/chevron-left.svg";
|
|
18
|
+
readonly arrowRight: "assets/icons/chevron-right.svg";
|
|
19
|
+
readonly calenderIcon: "assets/icons/calender.svg";
|
|
20
|
+
readonly timerIcon: "assets/icons/timer.svg";
|
|
21
|
+
};
|
|
22
|
+
|
|
23
|
+
declare class BrickclayLib {
|
|
24
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BrickclayLib, never>;
|
|
25
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BrickclayLib, "lib-brickclay-lib", never, {}, {}, never, never, true, never>;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
declare class CalendarManagerService {
|
|
29
|
+
private calendarInstances;
|
|
30
|
+
private closeAllSubject;
|
|
31
|
+
closeAll$: rxjs.Observable<void>;
|
|
32
|
+
/**
|
|
33
|
+
* Register a calendar instance with its close function
|
|
34
|
+
*/
|
|
35
|
+
register(closeFn: () => void): () => void;
|
|
36
|
+
/**
|
|
37
|
+
* Close all calendars except the one being opened
|
|
38
|
+
*/
|
|
39
|
+
closeAllExcept(exceptCloseFn: () => void): void;
|
|
40
|
+
/**
|
|
41
|
+
* Close all calendars
|
|
42
|
+
*/
|
|
43
|
+
closeAll(): void;
|
|
44
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<CalendarManagerService, never>;
|
|
45
|
+
static ɵprov: i0.ɵɵInjectableDeclaration<CalendarManagerService>;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
interface CalendarRange {
|
|
49
|
+
start: Date;
|
|
50
|
+
end: Date;
|
|
51
|
+
}
|
|
52
|
+
interface CalendarSelection {
|
|
53
|
+
startDate: string | null;
|
|
54
|
+
endDate: string | null;
|
|
55
|
+
selectedDates?: string[];
|
|
56
|
+
}
|
|
57
|
+
declare class BkCustomCalendar implements OnInit, OnDestroy, OnChanges {
|
|
58
|
+
private calendarManager;
|
|
59
|
+
enableTimepicker: boolean;
|
|
60
|
+
autoApply: boolean;
|
|
61
|
+
closeOnAutoApply: boolean;
|
|
62
|
+
showCancel: boolean;
|
|
63
|
+
linkedCalendars: boolean;
|
|
64
|
+
singleDatePicker: boolean;
|
|
65
|
+
showWeekNumbers: boolean;
|
|
66
|
+
showISOWeekNumbers: boolean;
|
|
67
|
+
customRangeDirection: boolean;
|
|
68
|
+
lockStartDate: boolean;
|
|
69
|
+
position: 'center' | 'left' | 'right';
|
|
70
|
+
drop: 'up' | 'down';
|
|
71
|
+
dualCalendar: boolean;
|
|
72
|
+
showRanges: boolean;
|
|
73
|
+
timeFormat: 12 | 24;
|
|
74
|
+
enableSeconds: boolean;
|
|
75
|
+
customRanges?: Record<string, CalendarRange>;
|
|
76
|
+
multiDateSelection: boolean;
|
|
77
|
+
maxDate?: Date;
|
|
78
|
+
minDate?: Date;
|
|
79
|
+
placeholder: string;
|
|
80
|
+
opens: 'left' | 'right' | 'center';
|
|
81
|
+
inline: boolean;
|
|
82
|
+
isDisplayCrossIcon: boolean;
|
|
83
|
+
selected: EventEmitter<CalendarSelection>;
|
|
84
|
+
opened: EventEmitter<void>;
|
|
85
|
+
closed: EventEmitter<void>;
|
|
86
|
+
/**
|
|
87
|
+
* External value passed from parent. If provided, component will select these dates on init / change.
|
|
88
|
+
* Accepts { startDate: Date|null, endDate: Date|null, selectedDates?: Date[] }
|
|
89
|
+
*/
|
|
90
|
+
selectedValue: CalendarSelection | null;
|
|
91
|
+
/** Optional display format for the input value. Uses moment formatting tokens. */
|
|
92
|
+
displayFormat: string;
|
|
93
|
+
brickclayIcons: {
|
|
94
|
+
readonly arrowleft: "assets/icons/chevron-left.svg";
|
|
95
|
+
readonly arrowRight: "assets/icons/chevron-right.svg";
|
|
96
|
+
readonly calenderIcon: "assets/icons/calender.svg";
|
|
97
|
+
readonly timerIcon: "assets/icons/timer.svg";
|
|
98
|
+
};
|
|
99
|
+
show: boolean;
|
|
100
|
+
today: Date;
|
|
101
|
+
month: number;
|
|
102
|
+
year: number;
|
|
103
|
+
calendar: {
|
|
104
|
+
day: number;
|
|
105
|
+
currentMonth: boolean;
|
|
106
|
+
}[][];
|
|
107
|
+
leftMonth: number;
|
|
108
|
+
leftYear: number;
|
|
109
|
+
rightMonth: number;
|
|
110
|
+
rightYear: number;
|
|
111
|
+
leftCalendar: {
|
|
112
|
+
day: number;
|
|
113
|
+
currentMonth: boolean;
|
|
114
|
+
}[][];
|
|
115
|
+
rightCalendar: {
|
|
116
|
+
day: number;
|
|
117
|
+
currentMonth: boolean;
|
|
118
|
+
}[][];
|
|
119
|
+
startDate: Date | null;
|
|
120
|
+
endDate: Date | null;
|
|
121
|
+
selectedDates: Date[];
|
|
122
|
+
disableHighlight: boolean;
|
|
123
|
+
hoveredDate: Date | null;
|
|
124
|
+
minuteInputValues: {
|
|
125
|
+
[key: string]: string;
|
|
126
|
+
};
|
|
127
|
+
selectedHour: number;
|
|
128
|
+
selectedMinute: number;
|
|
129
|
+
selectedSecond: number;
|
|
130
|
+
selectedAMPM: 'AM' | 'PM';
|
|
131
|
+
startHour: number;
|
|
132
|
+
startMinute: number;
|
|
133
|
+
startSecond: number;
|
|
134
|
+
startAMPM: 'AM' | 'PM';
|
|
135
|
+
endHour: number;
|
|
136
|
+
endMinute: number;
|
|
137
|
+
endSecond: number;
|
|
138
|
+
endAMPM: 'AM' | 'PM';
|
|
139
|
+
openTimePickerId: string | null;
|
|
140
|
+
closePickerCounter: {
|
|
141
|
+
[key: string]: number;
|
|
142
|
+
};
|
|
143
|
+
defaultRanges: Record<string, CalendarRange>;
|
|
144
|
+
activeRange: string | null;
|
|
145
|
+
rangeOrder: string[];
|
|
146
|
+
private unregisterFn?;
|
|
147
|
+
private closeAllSubscription?;
|
|
148
|
+
private closeFn?;
|
|
149
|
+
constructor(calendarManager: CalendarManagerService);
|
|
150
|
+
onClickOutside(event: MouseEvent): void;
|
|
151
|
+
ngOnInit(): void;
|
|
152
|
+
ngOnChanges(changes: SimpleChanges): void;
|
|
153
|
+
ngOnDestroy(): void;
|
|
154
|
+
checkAndSetActiveRange(): void;
|
|
155
|
+
initializeDefaultRanges(): void;
|
|
156
|
+
initializeTimeFromDate(date: Date, isStart: boolean): void;
|
|
157
|
+
toggle(): void;
|
|
158
|
+
close(): void;
|
|
159
|
+
onDateHover(day: number | null, fromRight?: boolean): void;
|
|
160
|
+
onDateLeave(): void;
|
|
161
|
+
selectDate(day: number | null, fromRight?: boolean): void;
|
|
162
|
+
handleMultiDateSelection(selected: Date): void;
|
|
163
|
+
getDateString(date: Date): string;
|
|
164
|
+
isDateInMultiSelection(year: number, month: number, day: number): boolean;
|
|
165
|
+
apply(): void;
|
|
166
|
+
cancel(): void;
|
|
167
|
+
clear(): void;
|
|
168
|
+
chooseRange(key: string): void;
|
|
169
|
+
emitSelection(): void;
|
|
170
|
+
addDays(date: Date, days: number): Date;
|
|
171
|
+
generateCalendar(): void;
|
|
172
|
+
nextMonth(): void;
|
|
173
|
+
prevMonth(): void;
|
|
174
|
+
nextLeftMonth(): void;
|
|
175
|
+
prevLeftMonth(): void;
|
|
176
|
+
nextRightMonth(): void;
|
|
177
|
+
prevRightMonth(): void;
|
|
178
|
+
initializeDual(): void;
|
|
179
|
+
generateDualCalendars(): void;
|
|
180
|
+
buildCalendar(year: number, month: number): {
|
|
181
|
+
day: number;
|
|
182
|
+
currentMonth: boolean;
|
|
183
|
+
}[][];
|
|
184
|
+
isDateSelected(year: number, month: number, day: number): boolean;
|
|
185
|
+
isDateInRange(year: number, month: number, day: number): boolean;
|
|
186
|
+
isDateDisabled(year: number, month: number, day: number): boolean;
|
|
187
|
+
isToday(year: number, month: number, day: number): boolean;
|
|
188
|
+
getDisplayValue(): string;
|
|
189
|
+
getTimeInputValue(isStart?: boolean): string;
|
|
190
|
+
getSingleTimeInputValue(): string;
|
|
191
|
+
getSingleTimePickerDisplay(): string;
|
|
192
|
+
getDualTimePickerDisplay(isStart?: boolean): string;
|
|
193
|
+
onTimePickerOpened(pickerId: string): void;
|
|
194
|
+
onTimePickerClosed(pickerId: string): void;
|
|
195
|
+
shouldClosePicker(pickerId: string): number;
|
|
196
|
+
private parsePickerTimeString;
|
|
197
|
+
onSingleTimePickerChange(time: string): void;
|
|
198
|
+
onDualTimePickerChange(time: string, isStart?: boolean): void;
|
|
199
|
+
onTimeChange(event: any, isStart?: boolean): void;
|
|
200
|
+
onSingleTimeChange(event: any): void;
|
|
201
|
+
incrementHour(isStart?: boolean): void;
|
|
202
|
+
decrementHour(isStart?: boolean): void;
|
|
203
|
+
incrementMinute(isStart?: boolean): void;
|
|
204
|
+
decrementMinute(isStart?: boolean): void;
|
|
205
|
+
toggleAMPM(isStart?: boolean): void;
|
|
206
|
+
incrementSingleHour(): void;
|
|
207
|
+
decrementSingleHour(): void;
|
|
208
|
+
incrementSingleMinute(): void;
|
|
209
|
+
decrementSingleMinute(): void;
|
|
210
|
+
toggleSingleAMPM(): void;
|
|
211
|
+
getMonthName(month: number): string;
|
|
212
|
+
onHourInput(event: any, isStart?: boolean, isSingle?: boolean): void;
|
|
213
|
+
onHourBlur(event: any, isStart?: boolean, isSingle?: boolean): void;
|
|
214
|
+
onMinuteInput(event: any, isStart?: boolean, isSingle?: boolean): void;
|
|
215
|
+
onMinuteBlur(event: any, isStart?: boolean, isSingle?: boolean): void;
|
|
216
|
+
getDisplayHour(hour: number): number;
|
|
217
|
+
getMinuteDisplayValue(isStart: boolean, isSingle: boolean): string;
|
|
218
|
+
applyTimeToDate(date: Date, isStart: boolean): void;
|
|
219
|
+
onTimeInputFocus(event: any): void;
|
|
220
|
+
formatAllMinuteInputs(): void;
|
|
221
|
+
formatDateToString(date: Date): string;
|
|
222
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkCustomCalendar, never>;
|
|
223
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BkCustomCalendar, "bk-custom-calendar", never, { "enableTimepicker": { "alias": "enableTimepicker"; "required": false; }; "autoApply": { "alias": "autoApply"; "required": false; }; "closeOnAutoApply": { "alias": "closeOnAutoApply"; "required": false; }; "showCancel": { "alias": "showCancel"; "required": false; }; "linkedCalendars": { "alias": "linkedCalendars"; "required": false; }; "singleDatePicker": { "alias": "singleDatePicker"; "required": false; }; "showWeekNumbers": { "alias": "showWeekNumbers"; "required": false; }; "showISOWeekNumbers": { "alias": "showISOWeekNumbers"; "required": false; }; "customRangeDirection": { "alias": "customRangeDirection"; "required": false; }; "lockStartDate": { "alias": "lockStartDate"; "required": false; }; "position": { "alias": "position"; "required": false; }; "drop": { "alias": "drop"; "required": false; }; "dualCalendar": { "alias": "dualCalendar"; "required": false; }; "showRanges": { "alias": "showRanges"; "required": false; }; "timeFormat": { "alias": "timeFormat"; "required": false; }; "enableSeconds": { "alias": "enableSeconds"; "required": false; }; "customRanges": { "alias": "customRanges"; "required": false; }; "multiDateSelection": { "alias": "multiDateSelection"; "required": false; }; "maxDate": { "alias": "maxDate"; "required": false; }; "minDate": { "alias": "minDate"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "opens": { "alias": "opens"; "required": false; }; "inline": { "alias": "inline"; "required": false; }; "isDisplayCrossIcon": { "alias": "isDisplayCrossIcon"; "required": false; }; "selectedValue": { "alias": "selectedValue"; "required": false; }; "displayFormat": { "alias": "displayFormat"; "required": false; }; "startDate": { "alias": "startDate"; "required": false; }; "endDate": { "alias": "endDate"; "required": false; }; }, { "selected": "selected"; "opened": "opened"; "closed": "closed"; }, never, never, true, never>;
|
|
224
|
+
}
|
|
225
|
+
|
|
226
|
+
interface TimeConfiguration {
|
|
227
|
+
date: Date;
|
|
228
|
+
allDay: boolean;
|
|
229
|
+
startTime: string;
|
|
230
|
+
endTime: string;
|
|
231
|
+
}
|
|
232
|
+
interface ScheduledDateSelection {
|
|
233
|
+
mode: 'single' | 'multiple' | 'range';
|
|
234
|
+
singleDate?: {
|
|
235
|
+
startDate: Date;
|
|
236
|
+
endDate: Date;
|
|
237
|
+
allDay: boolean;
|
|
238
|
+
startTime: string;
|
|
239
|
+
endTime: string;
|
|
240
|
+
};
|
|
241
|
+
multipleDates?: TimeConfiguration[];
|
|
242
|
+
dateRange?: {
|
|
243
|
+
startDate: Date;
|
|
244
|
+
endDate: Date;
|
|
245
|
+
allDay: boolean;
|
|
246
|
+
startTime: string;
|
|
247
|
+
endTime: string;
|
|
248
|
+
};
|
|
249
|
+
}
|
|
250
|
+
declare class BkScheduledDatePicker implements OnInit {
|
|
251
|
+
timeFormat: 12 | 24;
|
|
252
|
+
enableSeconds: boolean;
|
|
253
|
+
scheduled: EventEmitter<ScheduledDateSelection>;
|
|
254
|
+
cleared: EventEmitter<void>;
|
|
255
|
+
activeTab: 'single' | 'multiple' | 'range';
|
|
256
|
+
openTimePickerId: string | null;
|
|
257
|
+
closePickerCounter: {
|
|
258
|
+
[key: string]: number;
|
|
259
|
+
};
|
|
260
|
+
singleDate: Date | null;
|
|
261
|
+
singleAllDay: boolean;
|
|
262
|
+
singleStartTime: string;
|
|
263
|
+
singleEndTime: string;
|
|
264
|
+
multipleDates: TimeConfiguration[];
|
|
265
|
+
rangeStartDate: Date | null;
|
|
266
|
+
rangeEndDate: Date | null;
|
|
267
|
+
rangeAllDay: boolean;
|
|
268
|
+
rangeStartTime: string;
|
|
269
|
+
rangeEndTime: string;
|
|
270
|
+
ngOnInit(): void;
|
|
271
|
+
onTabChange(tab: 'single' | 'multiple' | 'range'): void;
|
|
272
|
+
onTimePickerOpened(pickerId: string): void;
|
|
273
|
+
onTimePickerClosed(pickerId: string): void;
|
|
274
|
+
shouldClosePicker(pickerId: string): number;
|
|
275
|
+
onSingleDateSelected(event: CalendarSelection): void;
|
|
276
|
+
onSingleAllDayChange(): void;
|
|
277
|
+
onSingleStartTimeChange(time: string): void;
|
|
278
|
+
onSingleEndTimeChange(time: string): void;
|
|
279
|
+
updateSingleDateTimes(): void;
|
|
280
|
+
onMultipleDatesSelected(event: CalendarSelection): void;
|
|
281
|
+
onMultipleDateAllDayChange(index: number): void;
|
|
282
|
+
onMultipleDateStartTimeChange(index: number, time: string): void;
|
|
283
|
+
onMultipleDateEndTimeChange(index: number, time: string): void;
|
|
284
|
+
onRangeSelected(event: CalendarSelection): void;
|
|
285
|
+
onRangeAllDayChange(): void;
|
|
286
|
+
onRangeStartTimeChange(time: string): void;
|
|
287
|
+
onRangeEndTimeChange(time: string): void;
|
|
288
|
+
updateRangeTimes(): void;
|
|
289
|
+
parseTimeString(timeStr: string): {
|
|
290
|
+
hours: number;
|
|
291
|
+
minutes: number;
|
|
292
|
+
};
|
|
293
|
+
getDateString(date: Date): string;
|
|
294
|
+
formatDate(date: Date): string;
|
|
295
|
+
emitScheduled(): void;
|
|
296
|
+
clear(): void;
|
|
297
|
+
apply(): void;
|
|
298
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkScheduledDatePicker, never>;
|
|
299
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BkScheduledDatePicker, "bk-scheduled-date-picker", never, { "timeFormat": { "alias": "timeFormat"; "required": false; }; "enableSeconds": { "alias": "enableSeconds"; "required": false; }; }, { "scheduled": "scheduled"; "cleared": "cleared"; }, never, never, true, never>;
|
|
300
|
+
}
|
|
301
|
+
|
|
302
|
+
declare class BkTimePicker implements OnInit, OnChanges, AfterViewInit {
|
|
303
|
+
value: string;
|
|
304
|
+
label: string;
|
|
305
|
+
placeholder: string;
|
|
306
|
+
position: 'left' | 'right';
|
|
307
|
+
pickerId: string;
|
|
308
|
+
closePicker: number;
|
|
309
|
+
timeFormat: 12 | 24;
|
|
310
|
+
showSeconds: boolean;
|
|
311
|
+
timeChange: EventEmitter<string>;
|
|
312
|
+
pickerOpened: EventEmitter<string>;
|
|
313
|
+
pickerClosed: EventEmitter<string>;
|
|
314
|
+
timeScrollElements: QueryList<ElementRef>;
|
|
315
|
+
showPicker: boolean;
|
|
316
|
+
currentHour: number;
|
|
317
|
+
currentMinute: number;
|
|
318
|
+
currentAMPM: string;
|
|
319
|
+
currentSecond: number;
|
|
320
|
+
brickclayIcons: {
|
|
321
|
+
readonly arrowleft: "assets/icons/chevron-left.svg";
|
|
322
|
+
readonly arrowRight: "assets/icons/chevron-right.svg";
|
|
323
|
+
readonly calenderIcon: "assets/icons/calender.svg";
|
|
324
|
+
readonly timerIcon: "assets/icons/timer.svg";
|
|
325
|
+
};
|
|
326
|
+
ngOnInit(): void;
|
|
327
|
+
ngAfterViewInit(): void;
|
|
328
|
+
parseTimeValue(): void;
|
|
329
|
+
getHours(): number[];
|
|
330
|
+
getMinutes(): number[];
|
|
331
|
+
getSeconds(): number[];
|
|
332
|
+
getAMPMOptions(): string[];
|
|
333
|
+
parseTimeStringToComponents(timeStr: string): {
|
|
334
|
+
hour: number;
|
|
335
|
+
minute: number;
|
|
336
|
+
second: number;
|
|
337
|
+
ampm: string;
|
|
338
|
+
};
|
|
339
|
+
formatTimeFromComponents(hour: number, minute: number, second: number, ampm: string): string;
|
|
340
|
+
togglePicker(): void;
|
|
341
|
+
onHourChange(hour: number): void;
|
|
342
|
+
onMinuteChange(minute: number): void;
|
|
343
|
+
onSecondChange(second: number): void;
|
|
344
|
+
onAMPMChange(ampm: string): void;
|
|
345
|
+
updateTime(): void;
|
|
346
|
+
scrollToSelectedTimes(): void;
|
|
347
|
+
onDocumentClick(event: MouseEvent): void;
|
|
348
|
+
private previousCloseCounter;
|
|
349
|
+
ngOnChanges(changes: SimpleChanges): void;
|
|
350
|
+
onInputKeydown(event: KeyboardEvent): void;
|
|
351
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkTimePicker, never>;
|
|
352
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BkTimePicker, "bk-time-picker", never, { "value": { "alias": "value"; "required": false; }; "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "position": { "alias": "position"; "required": false; }; "pickerId": { "alias": "pickerId"; "required": false; }; "closePicker": { "alias": "closePicker"; "required": false; }; "timeFormat": { "alias": "timeFormat"; "required": false; }; "showSeconds": { "alias": "showSeconds"; "required": false; }; }, { "timeChange": "timeChange"; "pickerOpened": "pickerOpened"; "pickerClosed": "pickerClosed"; }, never, never, true, never>;
|
|
353
|
+
}
|
|
354
|
+
|
|
355
|
+
/**
|
|
356
|
+
* Optional NgModule wrapper for projects that prefer module-based usage.
|
|
357
|
+
*
|
|
358
|
+
* Note:
|
|
359
|
+
* - The components themselves are standalone, so you can also import them
|
|
360
|
+
* directly into any standalone component without using this module.
|
|
361
|
+
* - This module is mainly for:
|
|
362
|
+
* - Existing apps that still use feature modules
|
|
363
|
+
* - Easier "plug-and-play" integration: import CalendarModule once and use
|
|
364
|
+
* the three exported components anywhere in your templates.
|
|
365
|
+
*/
|
|
366
|
+
declare class CalendarModule {
|
|
367
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<CalendarModule, never>;
|
|
368
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<CalendarModule, never, [typeof i1.CommonModule, typeof BkCustomCalendar, typeof BkScheduledDatePicker, typeof BkTimePicker], [typeof BkCustomCalendar, typeof BkScheduledDatePicker, typeof BkTimePicker]>;
|
|
369
|
+
static ɵinj: i0.ɵɵInjectorDeclaration<CalendarModule>;
|
|
370
|
+
}
|
|
371
|
+
|
|
372
|
+
declare class BkToggle implements ControlValueAccessor {
|
|
373
|
+
label: string;
|
|
374
|
+
disabled: boolean;
|
|
375
|
+
toggleClass: string;
|
|
376
|
+
change: EventEmitter<boolean>;
|
|
377
|
+
isChecked: boolean;
|
|
378
|
+
onChange: (_: boolean) => void;
|
|
379
|
+
onTouched: () => void;
|
|
380
|
+
toggle(): void;
|
|
381
|
+
writeValue(value: boolean): void;
|
|
382
|
+
registerOnChange(fn: any): void;
|
|
383
|
+
registerOnTouched(fn: any): void;
|
|
384
|
+
setDisabledState(isDisabled: boolean): void;
|
|
385
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkToggle, never>;
|
|
386
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BkToggle, "bk-toggle", never, { "label": { "alias": "label"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "toggleClass": { "alias": "toggleClass"; "required": false; }; }, { "change": "change"; }, never, never, true, never>;
|
|
387
|
+
}
|
|
388
|
+
|
|
389
|
+
declare class BkCheckbox implements ControlValueAccessor {
|
|
390
|
+
checkboxClass: string;
|
|
391
|
+
label: string;
|
|
392
|
+
labelClass: string;
|
|
393
|
+
disabled: boolean;
|
|
394
|
+
change: EventEmitter<boolean>;
|
|
395
|
+
isChecked: boolean;
|
|
396
|
+
private onChange;
|
|
397
|
+
private onTouched;
|
|
398
|
+
toggle(): void;
|
|
399
|
+
/** ------------------ ControlValueAccessor methods ------------------ */
|
|
400
|
+
writeValue(value: boolean): void;
|
|
401
|
+
registerOnChange(fn: any): void;
|
|
402
|
+
registerOnTouched(fn: any): void;
|
|
403
|
+
setDisabledState(isDisabled: boolean): void;
|
|
404
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkCheckbox, never>;
|
|
405
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BkCheckbox, "bk-checkbox", never, { "checkboxClass": { "alias": "checkboxClass"; "required": false; }; "label": { "alias": "label"; "required": false; }; "labelClass": { "alias": "labelClass"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "change": "change"; }, never, never, true, never>;
|
|
406
|
+
}
|
|
407
|
+
|
|
408
|
+
declare class BkRadioButton implements ControlValueAccessor {
|
|
409
|
+
radioClass: string;
|
|
410
|
+
label: string;
|
|
411
|
+
labelClass: string;
|
|
412
|
+
value: any;
|
|
413
|
+
disabled: boolean;
|
|
414
|
+
variant: 'dot' | 'tick';
|
|
415
|
+
change: EventEmitter<any>;
|
|
416
|
+
modelValue: any;
|
|
417
|
+
onChange: (_: any) => void;
|
|
418
|
+
onTouched: () => void;
|
|
419
|
+
select(): void;
|
|
420
|
+
get isChecked(): boolean;
|
|
421
|
+
writeValue(value: any): void;
|
|
422
|
+
registerOnChange(fn: any): void;
|
|
423
|
+
registerOnTouched(fn: any): void;
|
|
424
|
+
setDisabledState(isDisabled: boolean): void;
|
|
425
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkRadioButton, never>;
|
|
426
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BkRadioButton, "bk-radio-button", never, { "radioClass": { "alias": "radioClass"; "required": false; }; "label": { "alias": "label"; "required": false; }; "labelClass": { "alias": "labelClass"; "required": false; }; "value": { "alias": "value"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; }, { "change": "change"; }, never, never, true, never>;
|
|
427
|
+
}
|
|
428
|
+
|
|
429
|
+
type PillVariant = 'Light' | 'Solid' | 'Outline' | 'Transparent';
|
|
430
|
+
type PillColor = 'Gray' | 'Primary' | 'Error' | 'Warning' | 'Success' | 'Purple' | 'Cyan';
|
|
431
|
+
type PillSize = 'xsm' | 'sm' | 'md' | 'lg';
|
|
432
|
+
declare class BkPill {
|
|
433
|
+
label: string;
|
|
434
|
+
variant: PillVariant;
|
|
435
|
+
color: PillColor;
|
|
436
|
+
size: PillSize;
|
|
437
|
+
dot: 'left' | 'right' | 'none';
|
|
438
|
+
removable: boolean;
|
|
439
|
+
customClass: string;
|
|
440
|
+
clicked: EventEmitter<string>;
|
|
441
|
+
get containerClasses(): string;
|
|
442
|
+
onRemove(e: Event): void;
|
|
443
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkPill, never>;
|
|
444
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BkPill, "bk-pill", never, { "label": { "alias": "label"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "color": { "alias": "color"; "required": false; }; "size": { "alias": "size"; "required": false; }; "dot": { "alias": "dot"; "required": false; }; "removable": { "alias": "removable"; "required": false; }; "customClass": { "alias": "customClass"; "required": false; }; }, { "clicked": "clicked"; }, never, never, true, never>;
|
|
445
|
+
}
|
|
446
|
+
|
|
447
|
+
type BadgeVariant = 'Light' | 'Solid' | 'Outline' | 'Transparent';
|
|
448
|
+
type BadgeColor = 'Gray' | 'Primary' | 'Error' | 'Warning' | 'Success' | 'Purple' | 'Cyan';
|
|
449
|
+
type BadgeSize = 'xsm' | 'sm' | 'md' | 'lg';
|
|
450
|
+
declare class BkBadge {
|
|
451
|
+
label: string;
|
|
452
|
+
variant: BadgeVariant;
|
|
453
|
+
color: BadgeColor;
|
|
454
|
+
size: BadgeSize;
|
|
455
|
+
dot: 'left' | 'right' | 'none';
|
|
456
|
+
removable: boolean;
|
|
457
|
+
customClass: string;
|
|
458
|
+
clicked: EventEmitter<string>;
|
|
459
|
+
get containerClasses(): string;
|
|
460
|
+
onRemove(e: Event): void;
|
|
461
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkBadge, never>;
|
|
462
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BkBadge, "bk-badge", never, { "label": { "alias": "label"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "color": { "alias": "color"; "required": false; }; "size": { "alias": "size"; "required": false; }; "dot": { "alias": "dot"; "required": false; }; "removable": { "alias": "removable"; "required": false; }; "customClass": { "alias": "customClass"; "required": false; }; }, { "clicked": "clicked"; }, never, never, true, never>;
|
|
463
|
+
}
|
|
464
|
+
|
|
465
|
+
type SpinnerSize = 'xsm' | 'sm' | 'md' | 'lg' | 'xl';
|
|
466
|
+
declare class BkSpinner {
|
|
467
|
+
size: SpinnerSize;
|
|
468
|
+
show: boolean;
|
|
469
|
+
color: string;
|
|
470
|
+
get classes(): string;
|
|
471
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkSpinner, never>;
|
|
472
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BkSpinner, "bk-spinner", never, { "size": { "alias": "size"; "required": false; }; "show": { "alias": "show"; "required": false; }; "color": { "alias": "color"; "required": false; }; }, {}, never, never, true, never>;
|
|
473
|
+
}
|
|
474
|
+
|
|
475
|
+
type ButtonSize = 'xxsm' | 'xsm' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
|
|
476
|
+
type ButtonVariant = 'primary' | 'secondary';
|
|
477
|
+
declare class BkButton {
|
|
478
|
+
variant: ButtonVariant;
|
|
479
|
+
size: ButtonSize;
|
|
480
|
+
label: string;
|
|
481
|
+
leftIcon?: string;
|
|
482
|
+
rightIcon?: string;
|
|
483
|
+
iconAlt: string;
|
|
484
|
+
type: 'button' | 'submit' | 'reset';
|
|
485
|
+
loading: boolean;
|
|
486
|
+
disabled: boolean;
|
|
487
|
+
buttonClass: string;
|
|
488
|
+
textClass: string;
|
|
489
|
+
spinnerClass: string;
|
|
490
|
+
clicked: EventEmitter<boolean>;
|
|
491
|
+
onClick(event: Event): void;
|
|
492
|
+
get buttonClasses(): string;
|
|
493
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkButton, never>;
|
|
494
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BkButton, "bk-button", never, { "variant": { "alias": "variant"; "required": false; }; "size": { "alias": "size"; "required": false; }; "label": { "alias": "label"; "required": false; }; "leftIcon": { "alias": "leftIcon"; "required": false; }; "rightIcon": { "alias": "rightIcon"; "required": false; }; "iconAlt": { "alias": "iconAlt"; "required": false; }; "type": { "alias": "type"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "buttonClass": { "alias": "buttonClass"; "required": false; }; "textClass": { "alias": "textClass"; "required": false; }; "spinnerClass": { "alias": "spinnerClass"; "required": false; }; }, { "clicked": "clicked"; }, never, never, true, never>;
|
|
495
|
+
}
|
|
496
|
+
|
|
497
|
+
type IconButtonSize = 'xxsm' | 'xsm' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
|
|
498
|
+
type IconButtonVariant = 'primary' | 'secondary';
|
|
499
|
+
declare class BkIconButton {
|
|
500
|
+
icon: string;
|
|
501
|
+
alt: string;
|
|
502
|
+
variant: IconButtonVariant;
|
|
503
|
+
size: IconButtonSize;
|
|
504
|
+
disabled: boolean;
|
|
505
|
+
buttonClass: string;
|
|
506
|
+
clicked: EventEmitter<boolean>;
|
|
507
|
+
onClick(event: Event): void;
|
|
508
|
+
get buttonClasses(): string;
|
|
509
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkIconButton, never>;
|
|
510
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BkIconButton, "bk-icon-button", never, { "icon": { "alias": "icon"; "required": false; }; "alt": { "alias": "alt"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "size": { "alias": "size"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "buttonClass": { "alias": "buttonClass"; "required": false; }; }, { "clicked": "clicked"; }, never, never, true, never>;
|
|
511
|
+
}
|
|
512
|
+
|
|
513
|
+
interface GroupItem {
|
|
514
|
+
label: string;
|
|
515
|
+
value: any;
|
|
516
|
+
}
|
|
517
|
+
type GroupMode = 'single' | 'multiple';
|
|
518
|
+
declare class BkButtonGroup {
|
|
519
|
+
items: GroupItem[];
|
|
520
|
+
mode: GroupMode;
|
|
521
|
+
disabled: boolean;
|
|
522
|
+
value: any | any[];
|
|
523
|
+
valueChange: EventEmitter<any>;
|
|
524
|
+
onItemClick(itemValue: any): void;
|
|
525
|
+
isActive(itemValue: any): boolean;
|
|
526
|
+
get containerClass(): string;
|
|
527
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkButtonGroup, never>;
|
|
528
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BkButtonGroup, "bk-button-group", never, { "items": { "alias": "items"; "required": false; }; "mode": { "alias": "mode"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
|
|
529
|
+
}
|
|
530
|
+
|
|
531
|
+
type BkTextAreaAutoComplete = 'on' | 'off' | 'name' | 'honorific-prefix' | 'given-name' | 'additional-name' | 'family-name' | 'honorific-suffix' | 'nickname' | 'email' | 'username' | 'new-password' | 'current-password' | 'organization-title' | 'organization' | 'street-address' | 'address-line1' | 'address-line2' | 'address-line3' | 'address-level4' | 'address-level3' | 'address-level2' | 'address-level1' | 'country' | 'country-name' | 'postal-code' | 'cc-name' | 'cc-given-name' | 'cc-additional-name' | 'cc-family-name' | 'cc-number' | 'cc-exp' | 'cc-exp-month' | 'cc-exp-year' | 'cc-csc' | 'cc-type' | 'transaction-currency' | 'transaction-amount' | 'language' | 'bday' | 'bday-day' | 'bday-month' | 'bday-year' | 'sex' | 'tel' | 'tel-country-code' | 'tel-national' | 'tel-area-code' | 'tel-local' | 'tel-extension' | 'impp' | 'url' | 'photo';
|
|
532
|
+
type BkTextAreaAutoCapitalize = 'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters';
|
|
533
|
+
type BkTextAreaInputMode = 'none' | 'text' | 'tel' | 'url' | 'email' | 'numeric' | 'decimal' | 'search';
|
|
534
|
+
declare class BkTextarea implements ControlValueAccessor {
|
|
535
|
+
private ngControl;
|
|
536
|
+
autoComplete: BkTextAreaAutoComplete;
|
|
537
|
+
name: string;
|
|
538
|
+
id: string;
|
|
539
|
+
label: string;
|
|
540
|
+
placeholder: string;
|
|
541
|
+
rows: number;
|
|
542
|
+
hint: string;
|
|
543
|
+
required: boolean;
|
|
544
|
+
maxlength: number | null;
|
|
545
|
+
minlength: number | null;
|
|
546
|
+
hasError: boolean | null;
|
|
547
|
+
disabled: boolean;
|
|
548
|
+
errorMessage: string;
|
|
549
|
+
tabIndex: number | null;
|
|
550
|
+
readOnly: boolean;
|
|
551
|
+
autoCapitalize: BkTextAreaAutoCapitalize | null;
|
|
552
|
+
inputMode: BkTextAreaInputMode | null;
|
|
553
|
+
input: EventEmitter<Event>;
|
|
554
|
+
change: EventEmitter<Event>;
|
|
555
|
+
blur: EventEmitter<Event>;
|
|
556
|
+
focus: EventEmitter<Event>;
|
|
557
|
+
value: string;
|
|
558
|
+
onChange: (_: any) => void;
|
|
559
|
+
onTouched: () => void;
|
|
560
|
+
constructor(ngControl: NgControl);
|
|
561
|
+
get control(): any;
|
|
562
|
+
get touched(): boolean;
|
|
563
|
+
get dirty(): boolean;
|
|
564
|
+
get errors(): any;
|
|
565
|
+
handleFocus(event: Event): void;
|
|
566
|
+
handleBlur(event: Event): void;
|
|
567
|
+
handleInput(event: Event): void;
|
|
568
|
+
handleChange(event: Event): void;
|
|
569
|
+
writeValue(value: any): void;
|
|
570
|
+
registerOnChange(fn: any): void;
|
|
571
|
+
registerOnTouched(fn: any): void;
|
|
572
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkTextarea, [{ optional: true; self: true; }]>;
|
|
573
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BkTextarea, "bk-textarea", never, { "autoComplete": { "alias": "autoComplete"; "required": false; }; "name": { "alias": "name"; "required": false; }; "id": { "alias": "id"; "required": false; }; "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "required": { "alias": "required"; "required": false; }; "maxlength": { "alias": "maxlength"; "required": false; }; "minlength": { "alias": "minlength"; "required": false; }; "hasError": { "alias": "hasError"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "errorMessage": { "alias": "errorMessage"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "readOnly": { "alias": "readOnly"; "required": false; }; "autoCapitalize": { "alias": "autoCapitalize"; "required": false; }; "inputMode": { "alias": "inputMode"; "required": false; }; }, { "input": "input"; "change": "change"; "blur": "blur"; "focus": "focus"; }, never, never, true, never>;
|
|
574
|
+
}
|
|
575
|
+
|
|
576
|
+
interface TableColumn<T = any> {
|
|
577
|
+
header: string;
|
|
578
|
+
field?: keyof T;
|
|
579
|
+
width?: string;
|
|
580
|
+
sticky?: boolean;
|
|
581
|
+
sortable?: boolean;
|
|
582
|
+
headerClass?: string;
|
|
583
|
+
cellClass?: string;
|
|
584
|
+
formatter?: (row: T) => string;
|
|
585
|
+
/** show / hide both th + td */
|
|
586
|
+
visible?: boolean;
|
|
587
|
+
}
|
|
588
|
+
interface TableAction {
|
|
589
|
+
name: string;
|
|
590
|
+
icon: string;
|
|
591
|
+
tooltip: string;
|
|
592
|
+
hasPermission: boolean;
|
|
593
|
+
}
|
|
594
|
+
|
|
595
|
+
type SortDirection = 'asc' | 'desc';
|
|
596
|
+
declare class BkGrid<T = any> {
|
|
597
|
+
draggable: boolean;
|
|
598
|
+
columns: TableColumn<T>[];
|
|
599
|
+
result: T[];
|
|
600
|
+
actions: TableAction[];
|
|
601
|
+
actionClick: EventEmitter<{
|
|
602
|
+
action: string;
|
|
603
|
+
row: T;
|
|
604
|
+
}>;
|
|
605
|
+
sortChange: EventEmitter<{
|
|
606
|
+
columnIndex: number;
|
|
607
|
+
column: TableColumn<T>;
|
|
608
|
+
direction: SortDirection;
|
|
609
|
+
}>;
|
|
610
|
+
dragDropChange: EventEmitter<T[]>;
|
|
611
|
+
sortColumn?: keyof T;
|
|
612
|
+
sortDirection: SortDirection;
|
|
613
|
+
tableScrollContainer: ElementRef<HTMLDivElement>;
|
|
614
|
+
get firstVisibleColumnIndex(): number;
|
|
615
|
+
sort(column: TableColumn<T>, index: number): void;
|
|
616
|
+
isColumnVisible(column: TableColumn<T>): boolean;
|
|
617
|
+
getCellValue(row: T, column: TableColumn<T>): string;
|
|
618
|
+
emitAction(action: TableAction, row: T): void;
|
|
619
|
+
dropList(event: CdkDragDrop<T[]>): void;
|
|
620
|
+
onDragMoved(event: CdkDragMove<any>): void;
|
|
621
|
+
onDragStart(event: CdkDragStart<any>): void;
|
|
622
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkGrid<any>, never>;
|
|
623
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BkGrid<any>, "bk-grid", never, { "draggable": { "alias": "draggable"; "required": false; }; "columns": { "alias": "columns"; "required": false; }; "result": { "alias": "result"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; }, { "actionClick": "actionClick"; "sortChange": "sortChange"; "dragDropChange": "dragDropChange"; }, never, never, true, never>;
|
|
624
|
+
}
|
|
625
|
+
|
|
626
|
+
declare class BkSelect implements ControlValueAccessor {
|
|
627
|
+
items: i0.InputSignal<any[]>;
|
|
628
|
+
bindLabel: i0.InputSignal<string>;
|
|
629
|
+
bindValue: i0.InputSignal<string>;
|
|
630
|
+
placeholder: i0.InputSignal<string>;
|
|
631
|
+
notFoundText: i0.InputSignal<string>;
|
|
632
|
+
loadingText: i0.InputSignal<string>;
|
|
633
|
+
clearAllText: i0.InputSignal<string>;
|
|
634
|
+
iconAlt: string;
|
|
635
|
+
label: string;
|
|
636
|
+
required: Boolean;
|
|
637
|
+
iconSrc?: string;
|
|
638
|
+
multiple: i0.InputSignal<boolean>;
|
|
639
|
+
maxLabels: i0.InputSignal<number>;
|
|
640
|
+
searchable: i0.InputSignal<boolean>;
|
|
641
|
+
clearable: i0.InputSignal<boolean>;
|
|
642
|
+
readonly: i0.InputSignal<boolean>;
|
|
643
|
+
disabled: i0.ModelSignal<boolean>;
|
|
644
|
+
loading: i0.InputSignal<boolean>;
|
|
645
|
+
closeOnSelect: i0.InputSignal<boolean>;
|
|
646
|
+
dropdownPosition: i0.InputSignal<"bottom" | "top">;
|
|
647
|
+
appendToBody: i0.InputSignal<boolean>;
|
|
648
|
+
open: i0.OutputEmitterRef<void>;
|
|
649
|
+
close: i0.OutputEmitterRef<void>;
|
|
650
|
+
focus: i0.OutputEmitterRef<void>;
|
|
651
|
+
blur: i0.OutputEmitterRef<void>;
|
|
652
|
+
search: i0.OutputEmitterRef<{
|
|
653
|
+
term: string;
|
|
654
|
+
items: any[];
|
|
655
|
+
}>;
|
|
656
|
+
clear: i0.OutputEmitterRef<void>;
|
|
657
|
+
change: i0.OutputEmitterRef<any>;
|
|
658
|
+
scrollToEnd: i0.OutputEmitterRef<void>;
|
|
659
|
+
searchInput: ElementRef<HTMLInputElement>;
|
|
660
|
+
optionsListContainer: ElementRef<HTMLDivElement>;
|
|
661
|
+
optionsRef: QueryList<ElementRef>;
|
|
662
|
+
controlWrapper: ElementRef<HTMLDivElement>;
|
|
663
|
+
private _value;
|
|
664
|
+
isOpen: i0.WritableSignal<boolean>;
|
|
665
|
+
selectedOptions: i0.WritableSignal<any[]>;
|
|
666
|
+
searchTerm: i0.WritableSignal<string>;
|
|
667
|
+
markedIndex: i0.WritableSignal<number>;
|
|
668
|
+
dropdownStyle: i0.WritableSignal<{
|
|
669
|
+
top?: string;
|
|
670
|
+
bottom?: string;
|
|
671
|
+
left: string;
|
|
672
|
+
width: string;
|
|
673
|
+
}>;
|
|
674
|
+
filteredItems: i0.Signal<any[]>;
|
|
675
|
+
isAllSelected: i0.Signal<boolean>;
|
|
676
|
+
constructor();
|
|
677
|
+
resolveLabel(item: any): string;
|
|
678
|
+
resolveValue(item: any): any;
|
|
679
|
+
isItemSelected(item: any): boolean;
|
|
680
|
+
compareWith: i0.InputSignal<(a: any, b: any) => boolean>;
|
|
681
|
+
toggleDropdown(event: Event | null): void;
|
|
682
|
+
openDropdown(): void;
|
|
683
|
+
closeDropdown(): void;
|
|
684
|
+
getTop(): string | null;
|
|
685
|
+
getBottom(): string | null;
|
|
686
|
+
updatePosition(): void;
|
|
687
|
+
onWindowEvents(): void;
|
|
688
|
+
toggleSelectAll(event: Event): void;
|
|
689
|
+
handleSelection(item: any, event?: Event): void;
|
|
690
|
+
removeOption(item: any, event: Event): void;
|
|
691
|
+
handleClear(event: Event): void;
|
|
692
|
+
private updateModel;
|
|
693
|
+
onSearchInput(event: Event): void;
|
|
694
|
+
onKeyDown(event: KeyboardEvent): void;
|
|
695
|
+
onScroll(event: Event): void;
|
|
696
|
+
scrollToMarked(): void;
|
|
697
|
+
onChange: any;
|
|
698
|
+
onTouched: any;
|
|
699
|
+
writeValue(value: any): void;
|
|
700
|
+
registerOnChange(fn: any): void;
|
|
701
|
+
registerOnTouched(fn: any): void;
|
|
702
|
+
setDisabledState(d: boolean): void;
|
|
703
|
+
private resolveSelectedOptions;
|
|
704
|
+
private el;
|
|
705
|
+
onClickOutside(e: Event): void;
|
|
706
|
+
openFromLabel(event: MouseEvent): void;
|
|
707
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkSelect, never>;
|
|
708
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BkSelect, "bk-select", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "bindLabel": { "alias": "bindLabel"; "required": false; "isSignal": true; }; "bindValue": { "alias": "bindValue"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "notFoundText": { "alias": "notFoundText"; "required": false; "isSignal": true; }; "loadingText": { "alias": "loadingText"; "required": false; "isSignal": true; }; "clearAllText": { "alias": "clearAllText"; "required": false; "isSignal": true; }; "iconAlt": { "alias": "iconAlt"; "required": false; }; "label": { "alias": "label"; "required": false; }; "required": { "alias": "required"; "required": false; }; "iconSrc": { "alias": "iconSrc"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "maxLabels": { "alias": "maxLabels"; "required": false; "isSignal": true; }; "searchable": { "alias": "searchable"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "closeOnSelect": { "alias": "closeOnSelect"; "required": false; "isSignal": true; }; "dropdownPosition": { "alias": "dropdownPosition"; "required": false; "isSignal": true; }; "appendToBody": { "alias": "appendToBody"; "required": false; "isSignal": true; }; "compareWith": { "alias": "compareWith"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "open": "open"; "close": "close"; "focus": "focus"; "blur": "blur"; "search": "search"; "clear": "clear"; "change": "change"; "scrollToEnd": "scrollToEnd"; }, never, never, true, never>;
|
|
709
|
+
}
|
|
710
|
+
|
|
711
|
+
type BkInputType = 'text' | 'email' | 'password' | 'number' | 'url' | 'tel';
|
|
712
|
+
type BkInputAutoComplete = 'on' | 'off' | 'name' | 'honorific-prefix' | 'given-name' | 'additional-name' | 'family-name' | 'honorific-suffix' | 'nickname' | 'email' | 'username' | 'new-password' | 'current-password' | 'organization-title' | 'organization' | 'street-address' | 'address-line1' | 'address-line2' | 'address-line3' | 'address-level4' | 'address-level3' | 'address-level2' | 'address-level1' | 'country' | 'country-name' | 'postal-code' | 'cc-name' | 'cc-given-name' | 'cc-additional-name' | 'cc-family-name' | 'cc-number' | 'cc-exp' | 'cc-exp-month' | 'cc-exp-year' | 'cc-csc' | 'cc-type' | 'transaction-currency' | 'transaction-amount' | 'language' | 'bday' | 'bday-day' | 'bday-month' | 'bday-year' | 'sex' | 'tel' | 'tel-country-code' | 'tel-national' | 'tel-area-code' | 'tel-local' | 'tel-extension' | 'impp' | 'url' | 'photo';
|
|
713
|
+
type BkInputAutoCapitalize = 'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters';
|
|
714
|
+
type BkInputMode = 'none' | 'text' | 'tel' | 'url' | 'email' | 'numeric' | 'decimal' | 'search';
|
|
715
|
+
type IconOrientation = 'left' | 'right';
|
|
716
|
+
interface CountryOption {
|
|
717
|
+
code: string;
|
|
718
|
+
name: string;
|
|
719
|
+
mask: string;
|
|
720
|
+
prefix: string;
|
|
721
|
+
placeholder: string;
|
|
722
|
+
}
|
|
723
|
+
declare class BkInput implements OnInit, OnDestroy, ControlValueAccessor {
|
|
724
|
+
id: string;
|
|
725
|
+
name: string;
|
|
726
|
+
mask: string | null;
|
|
727
|
+
autoComplete: BkInputAutoComplete;
|
|
728
|
+
label: string;
|
|
729
|
+
placeholder: string;
|
|
730
|
+
hint: string;
|
|
731
|
+
required: boolean;
|
|
732
|
+
type: BkInputType;
|
|
733
|
+
value: string;
|
|
734
|
+
hasError: boolean;
|
|
735
|
+
showErrorIcon: boolean;
|
|
736
|
+
errorMessage: string;
|
|
737
|
+
disabled: boolean;
|
|
738
|
+
tabIndex: number | null;
|
|
739
|
+
readOnly: boolean;
|
|
740
|
+
autoCapitalize: BkInputAutoComplete | null;
|
|
741
|
+
inputMode: BkInputMode | null;
|
|
742
|
+
iconSrc?: string;
|
|
743
|
+
iconAlt: string;
|
|
744
|
+
showIcon: boolean;
|
|
745
|
+
phone: boolean;
|
|
746
|
+
countryCode: string;
|
|
747
|
+
countryOptions: CountryOption[];
|
|
748
|
+
selectedCountry: CountryOption;
|
|
749
|
+
iconOrientation: IconOrientation;
|
|
750
|
+
password: boolean;
|
|
751
|
+
showPassword: boolean;
|
|
752
|
+
pattern?: string | null;
|
|
753
|
+
max: number | null;
|
|
754
|
+
min: number | null;
|
|
755
|
+
step: number | null;
|
|
756
|
+
maxlength: number | null;
|
|
757
|
+
minlength: number | null;
|
|
758
|
+
dropdownRef?: ElementRef;
|
|
759
|
+
selectRef?: ElementRef;
|
|
760
|
+
inputField?: ElementRef<HTMLInputElement>;
|
|
761
|
+
isFocused: boolean;
|
|
762
|
+
inputValue: string;
|
|
763
|
+
isDropdownOpen: boolean;
|
|
764
|
+
input: EventEmitter<Event>;
|
|
765
|
+
change: EventEmitter<Event>;
|
|
766
|
+
focus: EventEmitter<Event>;
|
|
767
|
+
blur: EventEmitter<Event>;
|
|
768
|
+
clicked: EventEmitter<boolean>;
|
|
769
|
+
get placeHolderText(): string;
|
|
770
|
+
get maskValue(): string;
|
|
771
|
+
get maskPrefixValue(): string;
|
|
772
|
+
private onChange;
|
|
773
|
+
private onTouched;
|
|
774
|
+
writeValue(value: any): void;
|
|
775
|
+
registerOnChange(fn: any): void;
|
|
776
|
+
registerOnTouched(fn: any): void;
|
|
777
|
+
setDisabledState(isDisabled: boolean): void;
|
|
778
|
+
private closeAllDropdownsHandler;
|
|
779
|
+
ngOnInit(): void;
|
|
780
|
+
ngOnDestroy(): void;
|
|
781
|
+
onDocumentClick(event: MouseEvent): void;
|
|
782
|
+
handleFocus(event: Event): void;
|
|
783
|
+
handleBlur(event: Event): void;
|
|
784
|
+
handleInput(event: Event): void;
|
|
785
|
+
handleClicked(): void;
|
|
786
|
+
handleChange(event: Event): void;
|
|
787
|
+
toggleDropdown(event?: Event): void;
|
|
788
|
+
selectCountry(country: CountryOption): void;
|
|
789
|
+
togglePasswordVisibility(event: Event): void;
|
|
790
|
+
handleIconClick(event: Event): void;
|
|
791
|
+
get isFilled(): boolean;
|
|
792
|
+
get inputState(): 'default' | 'focused' | 'filled' | 'error' | 'disabled';
|
|
793
|
+
get currentInputType(): string;
|
|
794
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkInput, never>;
|
|
795
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BkInput, "bk-input", never, { "id": { "alias": "id"; "required": false; }; "name": { "alias": "name"; "required": false; }; "mask": { "alias": "mask"; "required": false; }; "autoComplete": { "alias": "autoComplete"; "required": false; }; "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "required": { "alias": "required"; "required": false; }; "type": { "alias": "type"; "required": false; }; "value": { "alias": "value"; "required": false; }; "hasError": { "alias": "hasError"; "required": false; }; "showErrorIcon": { "alias": "showErrorIcon"; "required": false; }; "errorMessage": { "alias": "errorMessage"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "readOnly": { "alias": "readOnly"; "required": false; }; "autoCapitalize": { "alias": "autoCapitalize"; "required": false; }; "inputMode": { "alias": "inputMode"; "required": false; }; "iconSrc": { "alias": "iconSrc"; "required": false; }; "iconAlt": { "alias": "iconAlt"; "required": false; }; "showIcon": { "alias": "showIcon"; "required": false; }; "phone": { "alias": "phone"; "required": false; }; "countryCode": { "alias": "countryCode"; "required": false; }; "countryOptions": { "alias": "countryOptions"; "required": false; }; "iconOrientation": { "alias": "iconOrientation"; "required": false; }; "password": { "alias": "password"; "required": false; }; "showPassword": { "alias": "showPassword"; "required": false; }; "pattern": { "alias": "pattern"; "required": false; }; "max": { "alias": "max"; "required": false; }; "min": { "alias": "min"; "required": false; }; "step": { "alias": "step"; "required": false; }; "maxlength": { "alias": "maxlength"; "required": false; }; "minlength": { "alias": "minlength"; "required": false; }; }, { "input": "input"; "change": "change"; "focus": "focus"; "blur": "blur"; "clicked": "clicked"; }, never, never, true, never>;
|
|
796
|
+
}
|
|
797
|
+
|
|
798
|
+
declare class BkChips implements ControlValueAccessor, AfterViewInit {
|
|
799
|
+
badgeInput: ElementRef<HTMLInputElement>;
|
|
800
|
+
fieldWrapper: ElementRef<HTMLDivElement>;
|
|
801
|
+
id: string;
|
|
802
|
+
name: string;
|
|
803
|
+
label: string;
|
|
804
|
+
placeholder: string;
|
|
805
|
+
hint: string;
|
|
806
|
+
required: boolean;
|
|
807
|
+
disabled: boolean;
|
|
808
|
+
readOnly: boolean;
|
|
809
|
+
/**
|
|
810
|
+
* If true, displays the component in an error state (red border).
|
|
811
|
+
* It also replaces the hint text with the error message.
|
|
812
|
+
*/
|
|
813
|
+
hasError: boolean;
|
|
814
|
+
errorMessage: string;
|
|
815
|
+
input: EventEmitter<Event>;
|
|
816
|
+
change: EventEmitter<string[]>;
|
|
817
|
+
focus: EventEmitter<Event>;
|
|
818
|
+
blur: EventEmitter<Event>;
|
|
819
|
+
badges: string[];
|
|
820
|
+
inputValue: string;
|
|
821
|
+
isFocused: boolean;
|
|
822
|
+
needsScroll: boolean;
|
|
823
|
+
onChange: any;
|
|
824
|
+
onTouched: any;
|
|
825
|
+
get inputState(): 'default' | 'focused' | 'filled' | 'error' | 'disabled';
|
|
826
|
+
onKeyDown(event: KeyboardEvent): void;
|
|
827
|
+
addBadge(): void;
|
|
828
|
+
removeBadge(index: number): void;
|
|
829
|
+
checkScrollNeeded(): void;
|
|
830
|
+
updateValue(): void;
|
|
831
|
+
focusInput(): void;
|
|
832
|
+
ngAfterViewInit(): void;
|
|
833
|
+
writeValue(value: any): void;
|
|
834
|
+
registerOnChange(fn: any): void;
|
|
835
|
+
registerOnTouched(fn: any): void;
|
|
836
|
+
setDisabledState(disabled: boolean): void;
|
|
837
|
+
handleInput(event: Event): void;
|
|
838
|
+
handleFocus(event: Event): void;
|
|
839
|
+
handleBlur(event: Event): void;
|
|
840
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkChips, never>;
|
|
841
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BkChips, "bk-chips", never, { "id": { "alias": "id"; "required": false; }; "name": { "alias": "name"; "required": false; }; "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "hint": { "alias": "hint"; "required": false; }; "required": { "alias": "required"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "readOnly": { "alias": "readOnly"; "required": false; }; "hasError": { "alias": "hasError"; "required": false; }; "errorMessage": { "alias": "errorMessage"; "required": false; }; }, { "input": "input"; "change": "change"; "focus": "focus"; "blur": "blur"; }, never, never, true, never>;
|
|
842
|
+
}
|
|
843
|
+
|
|
844
|
+
interface TabItem {
|
|
845
|
+
id: string;
|
|
846
|
+
label: string;
|
|
847
|
+
icon?: string;
|
|
848
|
+
iconActive?: string;
|
|
849
|
+
iconAlt?: string;
|
|
850
|
+
disabled?: boolean;
|
|
851
|
+
}
|
|
852
|
+
declare class BkTabs {
|
|
853
|
+
list: TabItem[];
|
|
854
|
+
activeTabId: string;
|
|
855
|
+
disabled: boolean;
|
|
856
|
+
change: EventEmitter<TabItem>;
|
|
857
|
+
setActiveTab(tab: TabItem): void;
|
|
858
|
+
isActive(tabId: string): boolean;
|
|
859
|
+
getTabIcon(tab: TabItem): string | undefined;
|
|
860
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkTabs, never>;
|
|
861
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BkTabs, "bk-tabs", never, { "list": { "alias": "list"; "required": false; }; "activeTabId": { "alias": "activeTabId"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "change": "change"; }, never, never, true, never>;
|
|
862
|
+
}
|
|
863
|
+
|
|
864
|
+
/**
|
|
865
|
+
* DialogContainerComponent
|
|
866
|
+
*
|
|
867
|
+
* Architecture Decision:
|
|
868
|
+
* ─────────────────────
|
|
869
|
+
* Extends CDK's `CdkDialogContainer` — the headless base class that
|
|
870
|
+
* provides:
|
|
871
|
+
* • Focus-trap management (tab key stays inside the dialog).
|
|
872
|
+
* • Auto-focus / restore-focus behaviour.
|
|
873
|
+
* • Portal outlet (`<ng-template cdkPortalOutlet />`) for dynamic
|
|
874
|
+
* component projection.
|
|
875
|
+
* • ARIA attribute management on the host element.
|
|
876
|
+
*
|
|
877
|
+
* We add:
|
|
878
|
+
* • WAAPI enter / leave animations on the panel (host element) and
|
|
879
|
+
* the CDK backdrop sibling.
|
|
880
|
+
* • Flex-column styles on the dynamically created component host so
|
|
881
|
+
* `.bk-dialog-content` scrolls and `.bk-dialog-actions` stays pinned.
|
|
882
|
+
* • Position-offset application via CSS margin.
|
|
883
|
+
*
|
|
884
|
+
* This component is **never** used directly — it is created internally
|
|
885
|
+
* by `DialogService` via CDK's `Dialog.open()`.
|
|
886
|
+
*/
|
|
887
|
+
|
|
888
|
+
declare class DialogContainerComponent extends CdkDialogContainer implements OnInit {
|
|
889
|
+
/**
|
|
890
|
+
* Our full config (including animation fields).
|
|
891
|
+
* Provided by DialogService via the INTERNAL_DIALOG_CONFIG token.
|
|
892
|
+
*/
|
|
893
|
+
private readonly _dialogConfig;
|
|
894
|
+
/**
|
|
895
|
+
* Resolves when the enter animation finishes (or immediately for 'none').
|
|
896
|
+
* `DialogService` subscribes via `.then()` to emit `afterOpened` on the
|
|
897
|
+
* `DialogRef`.
|
|
898
|
+
*/
|
|
899
|
+
private _resolveOpened;
|
|
900
|
+
readonly opened: Promise<void>;
|
|
901
|
+
ngOnInit(): void;
|
|
902
|
+
/**
|
|
903
|
+
* Override the CDK base to apply flex-column layout on the dynamically
|
|
904
|
+
* created component's host element.
|
|
905
|
+
*
|
|
906
|
+
* Angular's emulated view encapsulation prevents scoped CSS from reaching
|
|
907
|
+
* dynamically-projected elements, so we set styles programmatically.
|
|
908
|
+
*/
|
|
909
|
+
attachComponentPortal<C>(portal: ComponentPortal<C>): ComponentRef<C>;
|
|
910
|
+
/**
|
|
911
|
+
* Play the enter animation on the panel (host element) and backdrop.
|
|
912
|
+
* Resolves the `opened` promise when the panel animation finishes.
|
|
913
|
+
*/
|
|
914
|
+
private _playEnterAnimation;
|
|
915
|
+
/**
|
|
916
|
+
* Play the leave animation. Returns a Promise that resolves when done.
|
|
917
|
+
* Called by `DialogRef._runCloseSequence()` before CDK tears down the
|
|
918
|
+
* overlay.
|
|
919
|
+
*/
|
|
920
|
+
playLeaveAnimation(): Promise<void>;
|
|
921
|
+
/**
|
|
922
|
+
* Apply explicit position offsets via CSS margin.
|
|
923
|
+
* These are additive to CDK's `GlobalPositionStrategy` alignment.
|
|
924
|
+
*/
|
|
925
|
+
private _applyPositionOffsets;
|
|
926
|
+
/**
|
|
927
|
+
* CDK places the backdrop as a sibling of `.cdk-overlay-pane`.
|
|
928
|
+
* Walk up from our host → pane → wrapper, then query for the backdrop.
|
|
929
|
+
*/
|
|
930
|
+
private _getBackdropElement;
|
|
931
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<DialogContainerComponent, never>;
|
|
932
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<DialogContainerComponent, "bk-dialog-container", never, {}, {}, never, never, true, never>;
|
|
933
|
+
}
|
|
934
|
+
|
|
935
|
+
/**
|
|
936
|
+
* DialogRef — Handle returned to callers by `DialogService.open()`.
|
|
937
|
+
*
|
|
938
|
+
* Architecture Decision:
|
|
939
|
+
* ─────────────────────
|
|
940
|
+
* Wraps CDK's `DialogRef` to add:
|
|
941
|
+
* • WAAPI leave-animation before CDK tears down the overlay.
|
|
942
|
+
* • Per-instance `afterOpened()` observable (CDK only has a service-level
|
|
943
|
+
* `afterOpened` Subject).
|
|
944
|
+
* • The same familiar API shape used by callers (`close`, `afterClosed`,
|
|
945
|
+
* `backdropClick`, `keydownEvents`, `componentInstance`).
|
|
946
|
+
*
|
|
947
|
+
* CDK's `DialogRef<R, C>` has Result first, Component second.
|
|
948
|
+
* Ours keeps `<T, R>` (Component first, Result second) to match the
|
|
949
|
+
* convention consumers already use.
|
|
950
|
+
*/
|
|
951
|
+
|
|
952
|
+
/**
|
|
953
|
+
* Minimal interface for the container's capabilities.
|
|
954
|
+
* Avoids a direct import of `DialogContainerComponent` in this file
|
|
955
|
+
* (container imports nothing from ref, so no cycle, but this keeps
|
|
956
|
+
* the coupling lightweight).
|
|
957
|
+
*
|
|
958
|
+
* The optional ARIA methods are inherited from `CdkDialogContainer`
|
|
959
|
+
* and used by `BkDialogTitle` to register/deregister title IDs for
|
|
960
|
+
* the `aria-labelledby` attribute.
|
|
961
|
+
*/
|
|
962
|
+
interface DialogAnimatable {
|
|
963
|
+
playLeaveAnimation(): Promise<void>;
|
|
964
|
+
_addAriaLabelledBy?(id: string): void;
|
|
965
|
+
_removeAriaLabelledBy?(id: string): void;
|
|
966
|
+
}
|
|
967
|
+
declare class DialogRef<T = unknown, R = unknown> {
|
|
968
|
+
/**
|
|
969
|
+
* @internal Wrapped CDK ref.
|
|
970
|
+
* Typed as `CdkDialogRef<any>` to avoid deep generic-variance issues
|
|
971
|
+
* that arise from CDK's `config.providers` callback signature.
|
|
972
|
+
* The public API (`afterClosed`, etc.) re-types the observables.
|
|
973
|
+
*/
|
|
974
|
+
readonly _cdkRef: DialogRef$1<any>;
|
|
975
|
+
/** Unique dialog identifier (managed by CDK). */
|
|
976
|
+
readonly id: string;
|
|
977
|
+
/** Instance of the component rendered inside the dialog. */
|
|
978
|
+
componentInstance: T;
|
|
979
|
+
/** @internal Container reference for leave animation. */
|
|
980
|
+
_containerInstance: DialogAnimatable;
|
|
981
|
+
/** @internal Prevent double-close. */
|
|
982
|
+
private _closing;
|
|
983
|
+
/** @internal Per-instance afterOpened Subject. */
|
|
984
|
+
private readonly _afterOpened$;
|
|
985
|
+
constructor(
|
|
986
|
+
/**
|
|
987
|
+
* @internal Wrapped CDK ref.
|
|
988
|
+
* Typed as `CdkDialogRef<any>` to avoid deep generic-variance issues
|
|
989
|
+
* that arise from CDK's `config.providers` callback signature.
|
|
990
|
+
* The public API (`afterClosed`, etc.) re-types the observables.
|
|
991
|
+
*/
|
|
992
|
+
_cdkRef: DialogRef$1<any>);
|
|
993
|
+
/**
|
|
994
|
+
* Close the dialog, optionally returning a result.
|
|
995
|
+
* Plays the WAAPI leave animation, then delegates to CDK for cleanup.
|
|
996
|
+
*/
|
|
997
|
+
close(result?: R): void;
|
|
998
|
+
/**
|
|
999
|
+
* Observable that emits (and completes) once after the dialog has been
|
|
1000
|
+
* removed from the DOM and all cleanup is done.
|
|
1001
|
+
*/
|
|
1002
|
+
afterClosed(): Observable<R | undefined>;
|
|
1003
|
+
/**
|
|
1004
|
+
* Observable that emits (and completes) when the enter animation
|
|
1005
|
+
* finishes and the dialog is fully visible.
|
|
1006
|
+
*/
|
|
1007
|
+
afterOpened(): Observable<void>;
|
|
1008
|
+
/**
|
|
1009
|
+
* Observable of backdrop / outside-pointer click events.
|
|
1010
|
+
*/
|
|
1011
|
+
backdropClick(): Observable<MouseEvent>;
|
|
1012
|
+
/**
|
|
1013
|
+
* Observable of keyboard events dispatched while this dialog is open.
|
|
1014
|
+
*/
|
|
1015
|
+
keydownEvents(): Observable<KeyboardEvent>;
|
|
1016
|
+
/** @internal Called by the container once the enter animation finishes. */
|
|
1017
|
+
_emitOpened(): void;
|
|
1018
|
+
/** Play leave animation, then close via CDK. */
|
|
1019
|
+
private _runCloseSequence;
|
|
1020
|
+
}
|
|
1021
|
+
|
|
1022
|
+
/**
|
|
1023
|
+
* Dialog Content Directives
|
|
1024
|
+
*
|
|
1025
|
+
* Architecture Decision:
|
|
1026
|
+
* ─────────────────────
|
|
1027
|
+
* These directives mirror Angular Material's dialog content directives:
|
|
1028
|
+
*
|
|
1029
|
+
* MatDialogTitle → BkDialogTitle
|
|
1030
|
+
* MatDialogContent → BkDialogContent
|
|
1031
|
+
* MatDialogActions → BkDialogActions
|
|
1032
|
+
* MatDialogClose → BkDialogClose
|
|
1033
|
+
*
|
|
1034
|
+
* Each directive:
|
|
1035
|
+
* 1. Applies the corresponding CSS host class (e.g. `bk-dialog-content`)
|
|
1036
|
+
* that is styled in `dialog-container.css` via `::ng-deep`.
|
|
1037
|
+
* 2. Provides extra accessibility or behavioural features on top of the
|
|
1038
|
+
* plain CSS class.
|
|
1039
|
+
*
|
|
1040
|
+
* Consumers can still use the raw CSS classes directly (without importing
|
|
1041
|
+
* these directives) for backward compatibility, but the directives are
|
|
1042
|
+
* preferred because they add CdkScrollable, ARIA integration, and one-click
|
|
1043
|
+
* close behaviour.
|
|
1044
|
+
*
|
|
1045
|
+
* @see https://github.com/angular/components/blob/main/src/material/dialog/dialog-content-directives.ts
|
|
1046
|
+
*/
|
|
1047
|
+
|
|
1048
|
+
/**
|
|
1049
|
+
* Shared abstract base that resolves the owning `DialogRef` (via DI or
|
|
1050
|
+
* DOM walk) and invokes `_onAdd()` / `_onRemove()` lifecycle hooks.
|
|
1051
|
+
*
|
|
1052
|
+
* Same pattern as Material's internal `MatDialogLayoutSection`.
|
|
1053
|
+
*/
|
|
1054
|
+
declare abstract class BkDialogLayoutSection implements OnInit, OnDestroy {
|
|
1055
|
+
protected _dialogRef: DialogRef | null;
|
|
1056
|
+
protected _elementRef: ElementRef<any>;
|
|
1057
|
+
private _dialogService;
|
|
1058
|
+
ngOnInit(): void;
|
|
1059
|
+
ngOnDestroy(): void;
|
|
1060
|
+
protected abstract _onAdd(): void;
|
|
1061
|
+
protected abstract _onRemove(): void;
|
|
1062
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkDialogLayoutSection, never>;
|
|
1063
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<BkDialogLayoutSection, never, never, {}, {}, never, never, true, never>;
|
|
1064
|
+
}
|
|
1065
|
+
/**
|
|
1066
|
+
* Marks an element as the dialog title.
|
|
1067
|
+
*
|
|
1068
|
+
* • Generates a unique `id` and binds it to the host element.
|
|
1069
|
+
* • Registers the `id` with the CDK container's `aria-labelledby` queue
|
|
1070
|
+
* so screen readers announce the dialog title automatically.
|
|
1071
|
+
*
|
|
1072
|
+
* Usage:
|
|
1073
|
+
* ```html
|
|
1074
|
+
* <h2 bk-dialog-title>Edit User</h2>
|
|
1075
|
+
* ```
|
|
1076
|
+
*/
|
|
1077
|
+
declare class BkDialogTitle extends BkDialogLayoutSection {
|
|
1078
|
+
/** Unique element `id`. Auto-generated but can be overridden. */
|
|
1079
|
+
id: string;
|
|
1080
|
+
protected _onAdd(): void;
|
|
1081
|
+
protected _onRemove(): void;
|
|
1082
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkDialogTitle, never>;
|
|
1083
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<BkDialogTitle, "[bk-dialog-title], [bkDialogTitle]", ["bkDialogTitle"], { "id": { "alias": "id"; "required": false; }; }, {}, never, never, true, never>;
|
|
1084
|
+
}
|
|
1085
|
+
/**
|
|
1086
|
+
* Scrollable content area of a dialog.
|
|
1087
|
+
*
|
|
1088
|
+
* • Applies the `bk-dialog-content` CSS class → `flex: 1 1 auto; overflow: auto`.
|
|
1089
|
+
* • Composes CDK's `CdkScrollable` for scroll-position monitoring and
|
|
1090
|
+
* integration with CDK's scroll dispatcher.
|
|
1091
|
+
*
|
|
1092
|
+
* Usage (attribute):
|
|
1093
|
+
* ```html
|
|
1094
|
+
* <div bk-dialog-content>
|
|
1095
|
+
* <!-- body content — this area scrolls -->
|
|
1096
|
+
* </div>
|
|
1097
|
+
* ```
|
|
1098
|
+
*
|
|
1099
|
+
* Usage (element):
|
|
1100
|
+
* ```html
|
|
1101
|
+
* <bk-dialog-content>...</bk-dialog-content>
|
|
1102
|
+
* ```
|
|
1103
|
+
*/
|
|
1104
|
+
declare class BkDialogContent {
|
|
1105
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkDialogContent, never>;
|
|
1106
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<BkDialogContent, "[bk-dialog-content], bk-dialog-content, [bkDialogContent]", ["bkDialogContent"], {}, {}, never, never, true, [{ directive: typeof i1$1.CdkScrollable; inputs: {}; outputs: {}; }]>;
|
|
1107
|
+
}
|
|
1108
|
+
/**
|
|
1109
|
+
* Container for action buttons at the bottom of a dialog.
|
|
1110
|
+
* Stays pinned when the content area scrolls.
|
|
1111
|
+
*
|
|
1112
|
+
* • Applies `bk-dialog-actions` class → `flex: 0 0 auto` (never shrinks).
|
|
1113
|
+
* • Optional `align` input controls horizontal alignment.
|
|
1114
|
+
*
|
|
1115
|
+
* Usage:
|
|
1116
|
+
* ```html
|
|
1117
|
+
* <div bk-dialog-actions>
|
|
1118
|
+
* <button (click)="cancel()">Cancel</button>
|
|
1119
|
+
* <button (click)="save()">Save</button>
|
|
1120
|
+
* </div>
|
|
1121
|
+
*
|
|
1122
|
+
* <!-- With alignment -->
|
|
1123
|
+
* <div bk-dialog-actions align="center">...</div>
|
|
1124
|
+
* ```
|
|
1125
|
+
*/
|
|
1126
|
+
declare class BkDialogActions extends BkDialogLayoutSection {
|
|
1127
|
+
/** Horizontal alignment of action buttons. */
|
|
1128
|
+
align?: 'start' | 'center' | 'end';
|
|
1129
|
+
protected _onAdd(): void;
|
|
1130
|
+
protected _onRemove(): void;
|
|
1131
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkDialogActions, never>;
|
|
1132
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<BkDialogActions, "[bk-dialog-actions], bk-dialog-actions, [bkDialogActions]", ["bkDialogActions"], { "align": { "alias": "align"; "required": false; }; }, {}, never, never, true, never>;
|
|
1133
|
+
}
|
|
1134
|
+
/**
|
|
1135
|
+
* Closes the dialog when the host element is clicked.
|
|
1136
|
+
* Optionally returns a result value to the opener.
|
|
1137
|
+
*
|
|
1138
|
+
* • Sets `type="button"` by default to prevent accidental form submissions.
|
|
1139
|
+
* • Supports an optional `aria-label` for screen readers.
|
|
1140
|
+
*
|
|
1141
|
+
* Usage:
|
|
1142
|
+
* ```html
|
|
1143
|
+
* <!-- Close with no result -->
|
|
1144
|
+
* <button bk-dialog-close>Cancel</button>
|
|
1145
|
+
*
|
|
1146
|
+
* <!-- Close with a result value -->
|
|
1147
|
+
* <button [bk-dialog-close]="'confirmed'">OK</button>
|
|
1148
|
+
*
|
|
1149
|
+
* <!-- Alternative camelCase binding -->
|
|
1150
|
+
* <button [bkDialogClose]="myResult">Done</button>
|
|
1151
|
+
* ```
|
|
1152
|
+
*/
|
|
1153
|
+
declare class BkDialogClose implements OnInit, OnChanges {
|
|
1154
|
+
private _dialogRef;
|
|
1155
|
+
private _elementRef;
|
|
1156
|
+
private _dialogService;
|
|
1157
|
+
/** Screen-reader label for the button. */
|
|
1158
|
+
ariaLabel?: string;
|
|
1159
|
+
/** Prevents accidental form submits. Default: `'button'`. */
|
|
1160
|
+
type: 'submit' | 'button' | 'reset';
|
|
1161
|
+
/** Dialog result — set via `[bk-dialog-close]="value"`. */
|
|
1162
|
+
dialogResult: any;
|
|
1163
|
+
/** Alternative camelCase binding: `[bkDialogClose]="value"`. */
|
|
1164
|
+
_bkDialogClose: any;
|
|
1165
|
+
ngOnInit(): void;
|
|
1166
|
+
ngOnChanges(changes: SimpleChanges): void;
|
|
1167
|
+
_onButtonClick(_event: MouseEvent): void;
|
|
1168
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkDialogClose, never>;
|
|
1169
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<BkDialogClose, "[bk-dialog-close], [bkDialogClose]", ["bkDialogClose"], { "ariaLabel": { "alias": "aria-label"; "required": false; }; "type": { "alias": "type"; "required": false; }; "dialogResult": { "alias": "bk-dialog-close"; "required": false; }; "_bkDialogClose": { "alias": "bkDialogClose"; "required": false; }; }, {}, never, never, true, never>;
|
|
1170
|
+
}
|
|
1171
|
+
|
|
1172
|
+
declare class BkDialogModule {
|
|
1173
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<BkDialogModule, never>;
|
|
1174
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<BkDialogModule, never, [typeof i1$2.DialogModule, typeof i2.OverlayModule, typeof i3.PortalModule, typeof DialogContainerComponent, typeof BkDialogTitle, typeof BkDialogContent, typeof BkDialogActions, typeof BkDialogClose], [typeof BkDialogTitle, typeof BkDialogContent, typeof BkDialogActions, typeof BkDialogClose]>;
|
|
1175
|
+
static ɵinj: i0.ɵɵInjectorDeclaration<BkDialogModule>;
|
|
1176
|
+
}
|
|
1177
|
+
|
|
1178
|
+
/**
|
|
1179
|
+
* Dialog Configuration
|
|
1180
|
+
*
|
|
1181
|
+
* Architecture Decision:
|
|
1182
|
+
* ─────────────────────
|
|
1183
|
+
* Our `DialogConfig` mirrors the fields from CDK's `DialogConfig` that we
|
|
1184
|
+
* expose, plus adds custom animation properties powered by WAAPI.
|
|
1185
|
+
*
|
|
1186
|
+
* When `DialogService.open()` is called these values are:
|
|
1187
|
+
* 1. Merged with global defaults and per-call overrides.
|
|
1188
|
+
* 2. Mapped onto CDK's native `DialogConfig` for overlay, backdrop, scroll,
|
|
1189
|
+
* position, ARIA, and focus-trap management.
|
|
1190
|
+
* 3. Passed to `DialogContainerComponent` via an internal token for
|
|
1191
|
+
* animation playback and position offsets.
|
|
1192
|
+
*
|
|
1193
|
+
* CDK handles: unique IDs, z-index stacking, scroll blocking, focus trap,
|
|
1194
|
+
* backdrop rendering, overlay positioning, keyboard events.
|
|
1195
|
+
* We handle: WAAPI animations, panel appearance, convenience config sugar.
|
|
1196
|
+
*/
|
|
1197
|
+
|
|
1198
|
+
/**
|
|
1199
|
+
* Built-in WAAPI animation presets.
|
|
1200
|
+
* 'none' disables animation entirely.
|
|
1201
|
+
*/
|
|
1202
|
+
type DialogAnimation = 'none' | 'fade' | 'zoom' | 'slide-top' | 'slide-bottom' | 'slide-left' | 'slide-right';
|
|
1203
|
+
/**
|
|
1204
|
+
* Fine-grained position offsets.
|
|
1205
|
+
* When provided, the dialog shifts from the default centred position.
|
|
1206
|
+
* Internally this is mapped to CDK's `GlobalPositionStrategy`.
|
|
1207
|
+
*/
|
|
1208
|
+
interface DialogPosition {
|
|
1209
|
+
top?: string;
|
|
1210
|
+
bottom?: string;
|
|
1211
|
+
left?: string;
|
|
1212
|
+
right?: string;
|
|
1213
|
+
}
|
|
1214
|
+
interface DialogConfig<D = unknown> {
|
|
1215
|
+
/**
|
|
1216
|
+
* Unique dialog identifier.
|
|
1217
|
+
* CDK auto-generates one if omitted and validates uniqueness —
|
|
1218
|
+
* opening a second dialog with the same ID throws at runtime.
|
|
1219
|
+
*/
|
|
1220
|
+
id?: string;
|
|
1221
|
+
width?: string;
|
|
1222
|
+
height?: string;
|
|
1223
|
+
minWidth?: string | number;
|
|
1224
|
+
minHeight?: string | number;
|
|
1225
|
+
maxWidth?: string | number;
|
|
1226
|
+
maxHeight?: string | number;
|
|
1227
|
+
/**
|
|
1228
|
+
* Master lock — when `true`, neither ESC nor backdrop click closes
|
|
1229
|
+
* the dialog (same semantics as `MatDialogConfig.disableClose`).
|
|
1230
|
+
*/
|
|
1231
|
+
disableClose?: boolean;
|
|
1232
|
+
/**
|
|
1233
|
+
* Close when backdrop is clicked. Default `true`.
|
|
1234
|
+
* Ignored when `disableClose` is `true`.
|
|
1235
|
+
*/
|
|
1236
|
+
closeOnBackdrop?: boolean;
|
|
1237
|
+
/**
|
|
1238
|
+
* Close when Escape key is pressed. Default `true`.
|
|
1239
|
+
* Ignored when `disableClose` is `true`.
|
|
1240
|
+
*/
|
|
1241
|
+
closeOnEsc?: boolean;
|
|
1242
|
+
/** Show a backdrop behind the dialog. Default `true`. */
|
|
1243
|
+
hasBackdrop?: boolean;
|
|
1244
|
+
/**
|
|
1245
|
+
* Block body scroll while the dialog is open. Default `true`.
|
|
1246
|
+
* Mapped to CDK `BlockScrollStrategy` / `NoopScrollStrategy`.
|
|
1247
|
+
*/
|
|
1248
|
+
lockScroll?: boolean;
|
|
1249
|
+
/** Extra CSS class(es) applied to the CDK overlay pane. */
|
|
1250
|
+
panelClass?: string | string[];
|
|
1251
|
+
/** Extra CSS class(es) applied to the CDK backdrop element. */
|
|
1252
|
+
backdropClass?: string | string[];
|
|
1253
|
+
/** Payload injected into the dialog component via `DIALOG_DATA`. */
|
|
1254
|
+
data?: D;
|
|
1255
|
+
/** Panel animation preset. Default `'fade'`. */
|
|
1256
|
+
animation?: DialogAnimation;
|
|
1257
|
+
/** Enter animation duration in ms. Default `200`. */
|
|
1258
|
+
animationDurationEnter?: number;
|
|
1259
|
+
/** Leave animation duration in ms. Default `150`. */
|
|
1260
|
+
animationDurationLeave?: number;
|
|
1261
|
+
/** Position offsets — moves the dialog from its default centred position. */
|
|
1262
|
+
position?: DialogPosition;
|
|
1263
|
+
role?: 'dialog' | 'alertdialog';
|
|
1264
|
+
ariaLabel?: string;
|
|
1265
|
+
ariaLabelledBy?: string;
|
|
1266
|
+
ariaDescribedBy?: string;
|
|
1267
|
+
/**
|
|
1268
|
+
* Where to send focus when the dialog opens.
|
|
1269
|
+
* `true` → first tabbable element (default).
|
|
1270
|
+
* `false` → no auto-focus.
|
|
1271
|
+
* A CSS selector string → that element.
|
|
1272
|
+
*/
|
|
1273
|
+
autoFocus?: boolean | string;
|
|
1274
|
+
/** Restore focus to the previously-focused element on close. */
|
|
1275
|
+
restoreFocus?: boolean;
|
|
1276
|
+
/** Override CDK's scroll strategy for this dialog. */
|
|
1277
|
+
scrollStrategy?: ScrollStrategy;
|
|
1278
|
+
}
|
|
1279
|
+
declare const DEFAULT_DIALOG_CONFIG: DialogConfig;
|
|
1280
|
+
|
|
1281
|
+
/**
|
|
1282
|
+
* DialogService — The core engine of the custom dialog system.
|
|
1283
|
+
*
|
|
1284
|
+
* Architecture Decision:
|
|
1285
|
+
* ─────────────────────
|
|
1286
|
+
* Built on top of Angular CDK's `Dialog` service (the same foundation
|
|
1287
|
+
* that `MatDialog` uses internally):
|
|
1288
|
+
*
|
|
1289
|
+
* 1. CDK creates the overlay, backdrop, scroll-blocking, focus-trap,
|
|
1290
|
+
* z-index stacking, and unique ID management — battle-tested infra
|
|
1291
|
+
* shared with every Angular Material dialog in the ecosystem.
|
|
1292
|
+
*
|
|
1293
|
+
* 2. We provide our own `DialogContainerComponent` (extending
|
|
1294
|
+
* `CdkDialogContainer`) for WAAPI animations and panel styling.
|
|
1295
|
+
*
|
|
1296
|
+
* 3. We wrap CDK's `DialogRef` in our own `DialogRef` to add the
|
|
1297
|
+
* leave-animation step before CDK tears down the overlay, and to
|
|
1298
|
+
* expose the same familiar API shape (`afterClosed()`, etc.).
|
|
1299
|
+
*
|
|
1300
|
+
* 4. Configuration is merged DEFAULT → GLOBAL → per-call, then mapped
|
|
1301
|
+
* to CDK's native config with our extras carried via an internal
|
|
1302
|
+
* injection token.
|
|
1303
|
+
*
|
|
1304
|
+
* What CDK handles for us (no custom code needed):
|
|
1305
|
+
* ─────────────────────────────────────────────────
|
|
1306
|
+
* ✓ Unique dialog IDs (throws on collision)
|
|
1307
|
+
* ✓ Z-index stacking via `.cdk-overlay-container`
|
|
1308
|
+
* ✓ Focus trap (tab key stays inside dialog)
|
|
1309
|
+
* ✓ Auto-focus / restore-focus
|
|
1310
|
+
* ✓ Scroll blocking (BlockScrollStrategy)
|
|
1311
|
+
* ✓ Backdrop rendering and click detection
|
|
1312
|
+
* ✓ Keyboard event forwarding
|
|
1313
|
+
* ✓ Overlay DOM lifecycle (create → attach → detach → dispose)
|
|
1314
|
+
*
|
|
1315
|
+
* Memory safety:
|
|
1316
|
+
* ─────────────
|
|
1317
|
+
* CDK manages the full lifecycle: on close it detaches the overlay,
|
|
1318
|
+
* destroys the container, and disposes the overlay ref.
|
|
1319
|
+
* Our DialogRef subjects complete via CDK's `closed` observable,
|
|
1320
|
+
* preventing lingering subscriptions.
|
|
1321
|
+
*/
|
|
1322
|
+
|
|
1323
|
+
declare class DialogService {
|
|
1324
|
+
private readonly _cdkDialog;
|
|
1325
|
+
private readonly _overlay;
|
|
1326
|
+
private readonly _globalConfig;
|
|
1327
|
+
/** Stack of currently open dialog refs (most recent = last). */
|
|
1328
|
+
private readonly _openDialogRefs;
|
|
1329
|
+
/**
|
|
1330
|
+
* Open a dialog containing the given component.
|
|
1331
|
+
*
|
|
1332
|
+
* @param component The component class to render inside the dialog.
|
|
1333
|
+
* @param config Optional per-dialog configuration (merged on top
|
|
1334
|
+
* of global and default settings).
|
|
1335
|
+
* @returns A strongly-typed `DialogRef` to interact with.
|
|
1336
|
+
*
|
|
1337
|
+
* @example
|
|
1338
|
+
* ```ts
|
|
1339
|
+
* const ref = this.dialog.open(UserFormComponent, {
|
|
1340
|
+
* width: '500px',
|
|
1341
|
+
* data: { userId: 10 },
|
|
1342
|
+
* });
|
|
1343
|
+
* ref.afterClosed().subscribe(result => console.log(result));
|
|
1344
|
+
* ```
|
|
1345
|
+
*/
|
|
1346
|
+
open<T, D = unknown, R = unknown>(component: Type<T>, config?: DialogConfig<D>): DialogRef<T, R>;
|
|
1347
|
+
/**
|
|
1348
|
+
* Close all currently open dialogs (most recent first).
|
|
1349
|
+
*/
|
|
1350
|
+
closeAll(): void;
|
|
1351
|
+
/**
|
|
1352
|
+
* Returns the `DialogRef` of the most recently opened dialog,
|
|
1353
|
+
* or `undefined` if none are open.
|
|
1354
|
+
*/
|
|
1355
|
+
getTopDialog(): DialogRef | undefined;
|
|
1356
|
+
/**
|
|
1357
|
+
* Get a dialog by its CDK-managed unique ID.
|
|
1358
|
+
*/
|
|
1359
|
+
getDialogById(id: string): DialogRef | undefined;
|
|
1360
|
+
/**
|
|
1361
|
+
* Number of currently open dialogs.
|
|
1362
|
+
*/
|
|
1363
|
+
get openDialogCount(): number;
|
|
1364
|
+
/**
|
|
1365
|
+
* Read-only snapshot of currently open dialog refs.
|
|
1366
|
+
* Used internally by content directives (`BkDialogTitle`, `BkDialogActions`,
|
|
1367
|
+
* `BkDialogClose`) for the DOM-walk fallback when `DialogRef` is not
|
|
1368
|
+
* available via injection (e.g. inside `<ng-template>`).
|
|
1369
|
+
*/
|
|
1370
|
+
get openDialogsRef(): readonly DialogRef[];
|
|
1371
|
+
/**
|
|
1372
|
+
* Open a simple confirmation dialog.
|
|
1373
|
+
* Resolves `true` if the user confirms, `false` otherwise.
|
|
1374
|
+
*
|
|
1375
|
+
* @example
|
|
1376
|
+
* ```ts
|
|
1377
|
+
* const ref = this.dialog.confirm({
|
|
1378
|
+
* message: 'Delete this item?',
|
|
1379
|
+
* component: ConfirmDialogComponent,
|
|
1380
|
+
* });
|
|
1381
|
+
* ref.afterClosed().subscribe(yes => { if (yes) ... });
|
|
1382
|
+
* ```
|
|
1383
|
+
*/
|
|
1384
|
+
confirm(options: {
|
|
1385
|
+
title?: string;
|
|
1386
|
+
message: string;
|
|
1387
|
+
btnOkText?: string;
|
|
1388
|
+
btnCancelText?: string;
|
|
1389
|
+
width?: string;
|
|
1390
|
+
component: Type<unknown>;
|
|
1391
|
+
}): DialogRef<unknown, boolean>;
|
|
1392
|
+
/**
|
|
1393
|
+
* Open a simple alert dialog.
|
|
1394
|
+
*/
|
|
1395
|
+
alert(options: {
|
|
1396
|
+
title?: string;
|
|
1397
|
+
message: string;
|
|
1398
|
+
btnOkText?: string;
|
|
1399
|
+
width?: string;
|
|
1400
|
+
component: Type<unknown>;
|
|
1401
|
+
}): DialogRef<unknown, void>;
|
|
1402
|
+
/**
|
|
1403
|
+
* Subscribe to backdrop-click and ESC events on the CDK ref,
|
|
1404
|
+
* closing the dialog based on our config flags.
|
|
1405
|
+
*
|
|
1406
|
+
* We always set CDK `disableClose: true` so that CDK never auto-closes;
|
|
1407
|
+
* this gives us fine-grained control over `closeOnBackdrop` and
|
|
1408
|
+
* `closeOnEsc` independently.
|
|
1409
|
+
*/
|
|
1410
|
+
private _setupCloseListeners;
|
|
1411
|
+
/**
|
|
1412
|
+
* Build the CSS classes for the CDK overlay pane.
|
|
1413
|
+
* Always includes our base class; adds user-provided classes on top.
|
|
1414
|
+
*/
|
|
1415
|
+
private _buildPanelClasses;
|
|
1416
|
+
/**
|
|
1417
|
+
* Build CDK's `GlobalPositionStrategy` from our position config.
|
|
1418
|
+
* Falls back to centred (both axes) when no position is specified.
|
|
1419
|
+
*/
|
|
1420
|
+
private _buildPositionStrategy;
|
|
1421
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<DialogService, never>;
|
|
1422
|
+
static ɵprov: i0.ɵɵInjectableDeclaration<DialogService>;
|
|
1423
|
+
}
|
|
1424
|
+
|
|
1425
|
+
/**
|
|
1426
|
+
* Dialog Injection Tokens
|
|
1427
|
+
*
|
|
1428
|
+
* Architecture Decision:
|
|
1429
|
+
* ─────────────────────
|
|
1430
|
+
* • `DIALOG_DATA` — Re-exported from `@angular/cdk/dialog` so that
|
|
1431
|
+
* consumers import from our barrel and the token identity matches
|
|
1432
|
+
* exactly what CDK's `Dialog` service provides in the injector.
|
|
1433
|
+
* This means `@Inject(DIALOG_DATA)` works without any extra wiring.
|
|
1434
|
+
*
|
|
1435
|
+
* • `DIALOG_GLOBAL_CONFIG` — Optional app-level defaults, same pattern
|
|
1436
|
+
* as before.
|
|
1437
|
+
*
|
|
1438
|
+
* • `INTERNAL_DIALOG_CONFIG` — Internal-only token used to pass our
|
|
1439
|
+
* full `DialogConfig` (including animation fields) to the custom
|
|
1440
|
+
* `DialogContainerComponent`. Not part of the public API.
|
|
1441
|
+
*/
|
|
1442
|
+
|
|
1443
|
+
/**
|
|
1444
|
+
* Injection token used to pass arbitrary data into a dialog component.
|
|
1445
|
+
*
|
|
1446
|
+
* This is CDK's own `DIALOG_DATA` token — re-exported so that imports
|
|
1447
|
+
* from our barrel (`shared/components/dialog`) resolve to the exact same
|
|
1448
|
+
* token that CDK's `Dialog` service provides.
|
|
1449
|
+
*
|
|
1450
|
+
* Usage inside a dialog component:
|
|
1451
|
+
* ```ts
|
|
1452
|
+
* constructor(@Inject(DIALOG_DATA) public data: MyDataType) {}
|
|
1453
|
+
* ```
|
|
1454
|
+
*/
|
|
1455
|
+
declare const DIALOG_DATA: InjectionToken<any>;
|
|
1456
|
+
/**
|
|
1457
|
+
* Optional token for providing global dialog defaults at the
|
|
1458
|
+
* application level.
|
|
1459
|
+
*
|
|
1460
|
+
* Usage in `app.config.ts` or a module's `providers` array:
|
|
1461
|
+
* ```ts
|
|
1462
|
+
* providers: [
|
|
1463
|
+
* { provide: DIALOG_GLOBAL_CONFIG, useValue: { animation: 'zoom', width: '600px' } }
|
|
1464
|
+
* ]
|
|
1465
|
+
* ```
|
|
1466
|
+
*/
|
|
1467
|
+
declare const DIALOG_GLOBAL_CONFIG: InjectionToken<DialogConfig<unknown>>;
|
|
1468
|
+
|
|
1469
|
+
/**
|
|
1470
|
+
* Dialog Animations
|
|
1471
|
+
*
|
|
1472
|
+
* Architecture Decision:
|
|
1473
|
+
* ─────────────────────
|
|
1474
|
+
* Animations are implemented via the Web Animations API (WAAPI) instead of
|
|
1475
|
+
* Angular's @angular/animations so that:
|
|
1476
|
+
* 1. The dialog container stays truly standalone — no BrowserAnimationsModule
|
|
1477
|
+
* dependency is required.
|
|
1478
|
+
* 2. We have full programmatic control over timing, easing, and cleanup.
|
|
1479
|
+
* 3. Future presets can be added without touching the component template.
|
|
1480
|
+
*
|
|
1481
|
+
* Each preset exports an `enter` and `leave` keyframe array plus a
|
|
1482
|
+
* recommended timing object. The DialogContainerComponent plays these
|
|
1483
|
+
* via `element.animate()`.
|
|
1484
|
+
*/
|
|
1485
|
+
|
|
1486
|
+
interface AnimationKeyframes {
|
|
1487
|
+
keyframes: Keyframe[];
|
|
1488
|
+
options: KeyframeAnimationOptions;
|
|
1489
|
+
}
|
|
1490
|
+
/**
|
|
1491
|
+
* Build enter/leave WAAPI keyframes for the dialog **panel** element.
|
|
1492
|
+
*/
|
|
1493
|
+
declare function getDialogPanelAnimation(preset: DialogAnimation, enterDuration: number, leaveDuration: number): {
|
|
1494
|
+
enter: AnimationKeyframes;
|
|
1495
|
+
leave: AnimationKeyframes;
|
|
1496
|
+
};
|
|
1497
|
+
/**
|
|
1498
|
+
* Build enter/leave WAAPI keyframes for the **backdrop** element.
|
|
1499
|
+
* The backdrop always uses a simple opacity fade regardless of the
|
|
1500
|
+
* panel animation preset.
|
|
1501
|
+
*/
|
|
1502
|
+
declare function getDialogBackdropAnimation(enterDuration: number, leaveDuration: number): {
|
|
1503
|
+
enter: AnimationKeyframes;
|
|
1504
|
+
leave: AnimationKeyframes;
|
|
1505
|
+
};
|
|
1506
|
+
|
|
1507
|
+
export { BkBadge, BkButton, BkButtonGroup, BkCheckbox, BkChips, BkCustomCalendar, BkDialogActions, BkDialogClose, BkDialogContent, BkDialogModule, BkDialogTitle, BkGrid, BkIconButton, BkInput, BkPill, BkRadioButton, BkScheduledDatePicker, BkSelect, BkSpinner, BkTabs, BkTextarea, BkTimePicker, BkToggle, BrickclayIcons, BrickclayLib, CalendarManagerService, CalendarModule, DEFAULT_DIALOG_CONFIG, DIALOG_DATA, DIALOG_GLOBAL_CONFIG, DialogRef, DialogService, getDialogBackdropAnimation, getDialogPanelAnimation };
|
|
1508
|
+
export type { AnimationKeyframes, BadgeColor, BadgeSize, BadgeVariant, BkInputAutoCapitalize, BkInputAutoComplete, BkInputMode, BkInputType, BkTextAreaAutoCapitalize, BkTextAreaAutoComplete, BkTextAreaInputMode, ButtonSize, ButtonVariant, CalendarRange, CalendarSelection, CountryOption, DialogAnimation, DialogConfig, DialogPosition, GroupItem, GroupMode, IconButtonSize, IconButtonVariant, IconOrientation, PillColor, PillSize, PillVariant, ScheduledDateSelection, SortDirection, SpinnerSize, TabItem, TableAction, TableColumn, TimeConfiguration };
|