Calendar - expose views as separate components + advanced KB navigation #3855

SAndreeva · 2019-02-07T14:54:57Z

Closes #3023,
Related #3126

Additional information (check all that apply):

Checklist:

All relevant tags have been applied to this PR
This PR includes unit tests covering all the new code
This PR includes API docs for newly added methods/properties
This PR includes feature/README.MD updates for the feature docs
This PR includes general feature table updates in the root README.MD
This PR includes CHANGELOG.MD updates for newly added functionality
This PR contains breaking changes
This PR includes ng update migrations for the breaking changes
This PR includes behavioral changes and the feature specification has been updated with them

…iteUI/igniteui-angular into SAndreeva/calendar-views-poc

simeonoff · 2019-02-08T08:25:38Z

projects/igniteui-angular/src/lib/grids/grid/grid-filtering-ui.spec.ts

@@ -2773,7 +2773,7 @@ describe('IgxGrid - Filtering Row UI actions', () => {
        fix.detectChanges();

        const calendar = fix.debugElement.query(By.css('igx-calendar'));
-        const sundayLabel = calendar.nativeElement.children[1].children[1].children[0].children[0].innerText
+        const sundayLabel = calendar.nativeElement.children[1].children[1].children[0].children[0].innerText;


bkulov · 2019-02-13T08:31:45Z

projects/igniteui-angular/src/lib/calendar/README.md

+- `Tab` will navigate through the subheader buttons;
+
+When `prev` or `next` month buttons (in the subheader) are focused:
+- `Space` will scroll into view the next or previous month.


Space and Enter.

bkulov · 2019-02-13T08:43:51Z

projects/igniteui-angular/src/lib/calendar/calendar.component.html

+                   [selection]="selection"
+                   [disabledDates]="disabledDates"
+                   [specialDates]="specialDates"
+                   (onViewChnaged)="viewChanged($event)"


Typo onViewChnaged.

bkulov · 2019-02-13T08:44:38Z

projects/igniteui-angular/src/lib/calendar/calendar.component.html

+                   [disabledDates]="disabledDates"
+                   [specialDates]="specialDates"
+                   (onViewChnaged)="viewChanged($event)"
+                   (onDateSelection)="childClicked($event)">


Rename onDateSelection to onSelection. Applicable to all new views.

bkulov · 2019-02-13T09:09:55Z

projects/igniteui-angular/src/lib/calendar/calendar.component.html

+<igx-months-view *ngIf="isYearView" [@animateView]="activeView" #months
+                                    [date]="viewDate"
+                                    [locale]="locale"
+                                    [monthFormat]="_formatOptions.month"


Use public property formatOptions instead of the protected field (which is currently public).

bkulov · 2019-02-13T09:10:01Z

projects/igniteui-angular/src/lib/calendar/calendar.component.html

+<igx-years-view *ngIf="isDecadeView" [@animateView]="activeView" #decade
+                                     [date]="viewDate"
+                                     [locale]="locale"
+                                     [yearFormat]="_formatOptions.year"


Use public property formatOptions instead of the protected field (which is currently public).

…iteUI/igniteui-angular into SAndreeva/calendar-views-poc

bkulov · 2019-02-13T09:22:01Z

projects/igniteui-angular/src/lib/calendar/calendar.component.ts

+            event.preventDefault();
+            event.stopPropagation();
+
+            this.previousMonth();


You could add a parameter isKeydownTrigger to this method with default value false. That way you won't need the code bellow.

bkulov · 2019-02-13T09:22:37Z

projects/igniteui-angular/src/lib/calendar/calendar.component.ts

+            event.preventDefault();
+            event.stopPropagation();
+
+            this.nextMonth();


The same as the previous comment. Use parameter and remove the duplicated code bellow.

bkulov · 2019-02-13T09:30:55Z

projects/igniteui-angular/src/lib/calendar/days-view/day-item.component.ts

+    public specialDates: DateRangeDescriptor[];
+
+    @Output()
+    public onDateSelection = new EventEmitter<ICalendarDate>();


Should be onDateSelection.

projects/igniteui-angular/src/lib/calendar/days-view/days-view.component.ts

bkulov · 2019-02-13T09:55:36Z

projects/igniteui-angular/src/lib/calendar/years-view/years-view.component.ts

+    /**
+     * Returns the locale representation of the year in the years view.
+     *
+     * @hidden


This could be useful so it shouldn't be hidden.

bkulov · 2019-02-13T10:01:47Z

projects/igniteui-angular/src/lib/month-picker/month-picker.component.html

+                     (@animateChange.done)="animationDone()"
+                     [date]="viewDate"
+                     [locale]="locale"
+                     [monthFormat]="_formatOptions.month"


Use the public property instead of the protected field _formatOptions.

bkulov · 2019-02-13T10:01:56Z

projects/igniteui-angular/src/lib/month-picker/month-picker.component.html

+<igx-years-view *ngIf="isDecadeView" [@animateView]="activeView" #decade
+                [date]="viewDate"
+                [locale]="locale"
+                [yearFormat]="_formatOptions.year"


Same as above.

bkulov · 2019-02-13T10:06:54Z

projects/igniteui-angular/src/lib/calendar/years-view/years-view.component.ts

+     * @hidden
+     */
+    @HostListener('keydown.arrowdown', ['$event'])
+    public onKeydownArrowDown(event) {


Add type of the event argument. Applicable to all keyboard event handlers.

bkulov · 2019-02-13T10:10:33Z

projects/igniteui-angular/src/lib/month-picker/month-picker.component.ts

+    selector: 'igx-month-picker',
+    templateUrl: 'month-picker.component.html'
+})
+export class IgxMonthPickerComponent extends IgxCalendarComponent {


Shouldn't we have some public API for this component? An input to set the initial month and an event to notify on selection changes. Etc.

We need to import what's exported by this file in the public_api.ts similar to what's done with the calendar component.

bkulov · 2019-02-13T10:18:09Z

Please add changelog note.

…iteUI/igniteui-angular into SAndreeva/calendar-views-poc

SAndreeva added 13 commits January 16, 2019 14:10

Merge branch 'master' of https://github.com/IgniteUI/igniteui-angular

68b8fb7

Merge branch 'master' of https://github.com/IgniteUI/igniteui-angular

795eaba

Merge branch 'master' of https://github.com/IgniteUI/igniteui-angular

2b2caf1

Merge branch 'master' of https://github.com/IgniteUI/igniteui-angular

2267bd2

Merge branch 'master' of https://github.com/IgniteUI/igniteui-angular

dedd966

Merge branch 'master' of https://github.com/IgniteUI/igniteui-angular

b21a16d

Merge branch 'master' of https://github.com/IgniteUI/igniteui-angular

141df15

Merge branch 'master' of https://github.com/IgniteUI/igniteui-angular

9d9bf6d

Merge branch 'master' of https://github.com/IgniteUI/igniteui-angular

4dbbb51

Merge branch 'master' of https://github.com/IgniteUI/igniteui-angular

8fbaaf0

Merge branch 'master' of https://github.com/IgniteUI/igniteui-angular

ca14b1f

feat(month picker): initial refactoring of calendar views #3126

c02327a

fix(*): failing test #3126

9b14056

SAndreeva added 📈 enhancement 🛠️ status: in-development Issues and PRs with active development on them 📆 calendar version: 7.2.x labels Feb 7, 2019

SAndreeva assigned simeonoff and sboykova Feb 7, 2019

SAndreeva requested review from bkulov, simeonoff and rkaraivanov February 7, 2019 14:54

SAndreeva and others added 6 commits February 7, 2019 16:57

Merge branch 'master' into SAndreeva/calendar-views-poc

c099138

fix(*): lint styling issue #3126

b5d3199

feat(month picker): bug fixing #3126

608ab7c

Merge branch 'master' into SAndreeva/calendar-views-poc

355d69b

Merge branch 'SAndreeva/calendar-views-poc' of https://github.com/Ign…

e19ca0b

…iteUI/igniteui-angular into SAndreeva/calendar-views-poc

feat(month picker): fix build error #3126

c5f73a2

simeonoff reviewed Feb 8, 2019

View reviewed changes

feat(month picker): month picker POC #3126

41b9cab

SAndreeva and others added 2 commits February 12, 2019 14:52

Merge branch 'master' into SAndreeva/calendar-views-poc

58e24e3

Merge branch 'master' into SAndreeva/calendar-views-poc

46c5750

bkulov added 💥 status: in-test PRs currently being tested and removed 🛠️ status: in-development Issues and PRs with active development on them labels Feb 13, 2019

Merge branch 'master' into SAndreeva/calendar-views-poc

ac0a77d

bkulov suggested changes Feb 13, 2019

View reviewed changes

SAndreeva added 2 commits February 13, 2019 11:13

feat(month picker): various bug fixes and enhancements #3126

0d080f4

Merge branch 'SAndreeva/calendar-views-poc' of https://github.com/Ign…

59b0db5

…iteUI/igniteui-angular into SAndreeva/calendar-views-poc

bkulov suggested changes Feb 13, 2019

View reviewed changes

SAndreeva and others added 6 commits February 13, 2019 14:56

Merge branch 'master' into SAndreeva/calendar-views-poc

5ee9c87

feat(month picker): add KB to month picker component #3126

40d65ba

Merge branch 'SAndreeva/calendar-views-poc' of https://github.com/Ign…

893e59d

…iteUI/igniteui-angular into SAndreeva/calendar-views-poc

Merge branch 'master' into SAndreeva/calendar-views-poc

40df56c

feat(month picker): address most of the review comments #3126

1a5e56d

Merge branch 'SAndreeva/calendar-views-poc' of https://github.com/Ign…

43b23ea

…iteUI/igniteui-angular into SAndreeva/calendar-views-poc

bkulov added the squash-merge Merge PR with "Squash and Merge" option label Feb 13, 2019

SAndreeva and others added 2 commits February 14, 2019 10:16

feat(month picker): add tests for the month picker #3126

13c645e

Merge branch 'master' into SAndreeva/calendar-views-poc

ed99de2

bkulov previously approved these changes Feb 14, 2019

View reviewed changes

Merge branch 'master' into SAndreeva/calendar-views-poc

e333cde

SAndreeva dismissed bkulov’s stale review via e333cde February 14, 2019 15:20

bkulov approved these changes Feb 14, 2019

View reviewed changes

bkulov added ✅ status: verified Applies to PRs that have passed manual verification and removed 💥 status: in-test PRs currently being tested labels Feb 14, 2019

bkulov merged commit 291b4bf into master Feb 14, 2019

bkulov deleted the SAndreeva/calendar-views-poc branch February 14, 2019 16:06

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Calendar - expose views as separate components + advanced KB navigation #3855

Calendar - expose views as separate components + advanced KB navigation #3855

SAndreeva commented Feb 7, 2019 •

edited

Loading

simeonoff Feb 8, 2019

bkulov Feb 13, 2019

bkulov Feb 13, 2019

bkulov Feb 13, 2019

bkulov Feb 13, 2019

bkulov Feb 13, 2019

bkulov Feb 13, 2019

bkulov Feb 13, 2019

bkulov Feb 13, 2019

bkulov Feb 13, 2019

bkulov Feb 13, 2019

bkulov Feb 13, 2019

bkulov Feb 13, 2019

bkulov Feb 13, 2019

bkulov Feb 13, 2019

bkulov commented Feb 13, 2019

Calendar - expose views as separate components + advanced KB navigation #3855

Calendar - expose views as separate components + advanced KB navigation #3855

Conversation

SAndreeva commented Feb 7, 2019 • edited Loading

Additional information (check all that apply):

Checklist:

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

bkulov commented Feb 13, 2019

SAndreeva commented Feb 7, 2019 •

edited

Loading