Skip to content

Commit 85a510b

Browse files
ChronosSFChronosSF
authored
Merge branch 'master' into mkirova/row-pinning-sort
2 parents 5d2cca5 + b36b75e commit 85a510b

File tree

78 files changed

+2825
-1535
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

78 files changed

+2825
-1535
lines changed

‎CHANGELOG.md

+11-5
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,9 @@ All notable changes for each version of this project will be documented in this
44

55
## 9.1.0
66

7+
### Themes
8+
- **Breaking Change** Change the default `$legacy-support` value to false in the `igx-theme` function.
9+
710
### New Features
811

912
- `IgxGrid`, `IgxTreeGrid`, `IgxHierarchicalGrid`
@@ -14,6 +17,8 @@ All notable changes for each version of this project will be documented in this
1417
```typescript
1518
public pinningConfiguration: IPinningConfig = { columns: ColumnPinningPosition.End };
1619
```
20+
- `IgxCombo`:
21+
- Added `autoFocusSearch` input that allows to manipulate the combo's opening behavior. When the property is `true` (by default), the combo's search input is focused on open. When set to `false`, the focus goes to the combo items container, which can be used to prevent the software keyboard from activating on mobile devices when opening the combo.
1722

1823
### RTL Support
1924
- `igxSlider` have full right-to-left (RTL) support.
@@ -103,10 +108,6 @@ All notable changes for each version of this project will be documented in this
103108
- `IgxGridExcelStyleFilteringComponent` and `IgxAdvancedFilteringDialogComponent` can now be hosted outside of the grid in order to provide the same experience as the built-in filtering UI.
104109
- `expandRow(rowID)`/`collapseRow(rowID)`/`toggleRow(rowID)` API methods are added for the `igxHierarchicalGrid`. They allow expanding/collapsing a row by its id.
105110
- `onRowToggle` event is added for the `igxHierarchicalGrid`. It is emitted when the expanded state of a row is changed.
106-
- `IgxOverlayService`:
107-
- `setOffset` method added. It offsets the content along the corresponding axis by the provided amount.
108-
- `IgxToggleDirective`:
109-
- `setOffset` method added. It offsets the content along the corresponding axis by the provided amount.
110111
- `IgxRowDragGhost` directive is added. It allows providing a custom template for the drag ghost when dragging a row.
111112
```html
112113
<igx-grid #grid1 [data]="remote | async" primaryKey="ProductID"
@@ -166,6 +167,12 @@ All notable changes for each version of this project will be documented in this
166167
- `IgxDropDown`:
167168
- `clearSelection` method is added, which can be used to deselect the selected dropdown item
168169

170+
- `IgxToggleDirective`:
171+
- `setOffset` method added. It offsets the content along the corresponding axis by the provided amount.
172+
173+
- `IgxOverlayService`:
174+
- `setOffset` method added. It offsets the content along the corresponding axis by the provided amount.
175+
169176
- `IgxCircularProgressBar`:
170177
- added `IgxProgressBarGradientDirective` to allow providing custom circular progress SVG gradients. Providing a custom gradient via a template is as easy as writing:
171178
```html
@@ -2487,4 +2494,3 @@ export class IgxCustomFilteringOperand extends IgxFilteringOperand {
24872494
- `IgxDraggableDirective` moved inside `../directives/dragdrop/` folder
24882495
- `IgxRippleDirective` moved inside `../directives/ripple/` folder
24892496
- Folder `"./navigation/nav-service"` renamed to `"./navigation/nav.service"`
2490-

‎ROADMAP.md

+14-11
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
2. Range Date Picker [#5732](https://github.com/IgniteUI/igniteui-angular/issues/5732)
99
3. RTL Support across Ignite UI for Angular components [#5958](https://github.com/IgniteUI/igniteui-angular/issues/5958)
1010
4. Column freezing/Pinning on the right (igx-grid) [#5879](https://github.com/IgniteUI/igniteui-angular/issues/5879)
11-
5. Column Selection for IgxGrid [#6638](https://github.com/IgniteUI/igniteui-angular/issues/6638)
11+
5. Column Selection for IgxGrid [#6578](https://github.com/IgniteUI/igniteui-angular/issues/6578)
1212
6. Splitter IgxGrid [#6639](https://github.com/IgniteUI/igniteui-angular/issues/6639)
1313
7. Row Pinning IgxGrid [#6640](https://github.com/IgniteUI/igniteui-angular/issues/6640)
1414
8. Data Analysis Directive [#1752](https://github.com/IgniteUI/igniteui-angular-samples/issues/1752)
@@ -23,16 +23,19 @@
2323

2424
## Milestone 10 (Released February 10th, 2020)
2525

26-
1. Dock Manger [#5980](https://github.com/IgniteUI/igniteui-angular/issues/5980)
27-
2. **[DONE]** Theming service for Ignite UI for Angular [#5999](https://github.com/IgniteUI/igniteui-angular/issues/5999)
28-
3. Range Date Picker [#5732](https://github.com/IgniteUI/igniteui-angular/issues/5732)
29-
4. **[DONE]** igxGrid overlay components exposed for instantiation in arbitrary container [#5878](https://github.com/IgniteUI/igniteui-angular/issues/5878)
30-
5. RTL Support across Ignite UI for Angular components [#5958](https://github.com/IgniteUI/igniteui-angular/issues/5958)
31-
6. **[DONE]** Carousel slide animations/transitions [#4268](https://github.com/IgniteUI/igniteui-angular/issues/4268)
32-
7. **[DONE]** Access all data when calculating summary per column [#5754](https://github.com/IgniteUI/igniteui-angular/issues/5754)
33-
8. **[DONE]** Angular 9 support [#5998](https://github.com/IgniteUI/igniteui-angular/issues/5998)
34-
9. **[DONE]** Allow master-detail style visualization with igxHierarchicalGrid [#5880](https://github.com/IgniteUI/igniteui-angular/issues/5880)
35-
10. **[DONE]** Collapsible column groups (column expansion state templates) [#3343](https://github.com/IgniteUI/igniteui-angular/issues/3343)
26+
1. **[DONE]** Theming service for Ignite UI for Angular [#5999](https://github.com/IgniteUI/igniteui-angular/issues/5999)
27+
2. **[DONE]** igxGrid overlay components exposed for instantiation in arbitrary container [#5878](https://github.com/IgniteUI/igniteui-angular/issues/5878)
28+
3. **[DONE]** Carousel slide animations/transitions [#4268](https://github.com/IgniteUI/igniteui-angular/issues/4268)
29+
4. **[DONE]** Access all data when calculating summary per column [#5754](https://github.com/IgniteUI/igniteui-angular/issues/5754)
30+
5. **[DONE]** Angular 9 support [#5998](https://github.com/IgniteUI/igniteui-angular/issues/5998)
31+
6. **[DONE]** Allow master-detail style visualization with igxHierarchicalGrid [#5880](https://github.com/IgniteUI/igniteui-angular/issues/5880)
32+
7. **[DONE]** Collapsible column groups (column expansion state templates) [#3343](https://github.com/IgniteUI/igniteui-angular/issues/3343)
33+
8. **[DONE]** Igx combo select all item [#6342](https://github.com/IgniteUI/igniteui-angular/issues/6342)
34+
9. **[DONE]** Container instance for igxGrid overlay components [#5878](https://github.com/IgniteUI/igniteui-angular/issues/5878)
35+
10. **[DONE]** [igx-select] Footer element [#5911](https://github.com/IgniteUI/igniteui-angular/issues/5911)
36+
11. **[DONE]** Provide the state persistence directive of the igx-grid by default [#5460](https://github.com/IgniteUI/igniteui-angular/issues/5460)
37+
12. **[DONE]** Directive for custom row drag ghost in the grids [#6081](https://github.com/IgniteUI/igniteui-angular/issues/6081)
38+
13. **[DONE]** Provide a way to turn off the built-in filtering and sorting for remote scenarios [#4356](https://github.com/IgniteUI/igniteui-angular/issues/4356)
3639

3740
## Milestone 9 (Released September 26th, 2019)
3841

‎projects/igniteui-angular/src/lib/buttonGroup/buttongroup-content.component.html

+3-3
Original file line numberDiff line numberDiff line change
@@ -11,10 +11,10 @@
1111
[igxLabel]="button.label"
1212
[igxRipple]="button.ripple"
1313
>
14-
<div class="igx-button-group__item-content {{ itemContentCssClass }}">
14+
<span class="igx-button-group__item-content {{ itemContentCssClass }}">
1515
<igx-icon *ngIf="button.icon" fontSet="material">{{button.icon}}</igx-icon>
16-
<span *ngIf="button.label">{{button.label}}</span>
17-
</div>
16+
<span class="igx-button-group__button-text" *ngIf="button.label">{{button.label}}</span>
17+
</span>
1818
</button>
1919
<ng-content></ng-content>
2020
</div>

‎projects/igniteui-angular/src/lib/calendar/calendar-base.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -620,7 +620,7 @@ export class IgxCalendarBaseDirective implements ControlValueAccessor {
620620
* Deselects date(s) (based on the selection type).
621621
*/
622622
public deselectDate(value?: Date | Date[]) {
623-
if (this.selectedDates === null || this.selectedDates.length === 0) {
623+
if (!this.selectedDates || this.selectedDates.length === 0) {
624624
return;
625625
}
626626

‎projects/igniteui-angular/src/lib/combo/README.md

+1
Original file line numberDiff line numberDiff line change
@@ -314,6 +314,7 @@ Setting `[displayDensity]` affects the control's items' and inputs' css properti
314314
| `type` | Combo style. - "line", "box", "border", "search" | string |
315315
| `valid` | gets if control is valid, when used in a form | boolean |
316316
| `overlaySettings` | gets/sets the custom overlay settings that control how the drop-down list displays | OverlaySettings |
317+
| `autoFocusSearch` | controls whether the search input should be focused when the combo is opened | boolean |
317318

318319
### Getters
319320
| Name | Description | Type |

‎projects/igniteui-angular/src/lib/combo/combo.component.spec.ts

+32-1
Original file line numberDiff line numberDiff line change
@@ -149,6 +149,24 @@ describe('igxCombo', () => {
149149
expect(combo.dropdown.toggle).toHaveBeenCalledTimes(1);
150150
expect(combo.collapsed).toBe(false);
151151
});
152+
it(`should not focus search input when property autoFocusSearch=false`, () => {
153+
combo = new IgxComboComponent({ nativeElement: null }, mockCdr, mockSelection as any, mockComboService, null, mockInjector);
154+
const dropdownContainer = { nativeElement: { focus: () => {}}};
155+
combo['dropdownContainer'] = dropdownContainer;
156+
spyOn(combo, 'focusSearchInput');
157+
158+
combo.autoFocusSearch = false;
159+
combo.handleOpened();
160+
expect(combo.focusSearchInput).toHaveBeenCalledTimes(0);
161+
162+
combo.autoFocusSearch = true;
163+
combo.handleOpened();
164+
expect(combo.focusSearchInput).toHaveBeenCalledTimes(1);
165+
166+
combo.autoFocusSearch = false;
167+
combo.handleOpened();
168+
expect(combo.focusSearchInput).toHaveBeenCalledTimes(1);
169+
});
152170
it('should call dropdown toggle with correct overlaySettings', () => {
153171
combo = new IgxComboComponent({ nativeElement: null }, mockCdr, mockSelection as any, mockComboService, null, mockInjector);
154172
const dropdown = jasmine.createSpyObj('IgxComboDropDownComponent', ['toggle']);
@@ -788,6 +806,19 @@ describe('igxCombo', () => {
788806
fixture.detectChanges();
789807
expect(combo.searchInput).toBeFalsy();
790808
});
809+
it('should focus search input', fakeAsync(() => {
810+
combo.toggle();
811+
tick();
812+
fixture.detectChanges();
813+
expect(document.activeElement).toEqual(combo.searchInput.nativeElement);
814+
}));
815+
it('should not focus search input, when autoFocusSearch=false', fakeAsync(() => {
816+
combo.autoFocusSearch = false;
817+
combo.toggle();
818+
tick();
819+
fixture.detectChanges();
820+
expect(document.activeElement).not.toEqual(combo.searchInput.nativeElement);
821+
}));
791822
it('should properly initialize templates', () => {
792823
expect(combo).toBeDefined();
793824
expect(combo.footerTemplate).toBeDefined();
@@ -983,7 +1014,7 @@ describe('igxCombo', () => {
9831014

9841015
productIndex = 485;
9851016
combo.virtualScrollContainer.scrollTo(productIndex);
986-
await wait();
1017+
await wait(30);
9871018
fixture.detectChanges();
9881019
verifyComboData();
9891020
expect(combo.virtualizationState.startIndex + combo.virtualizationState.chunkSize - 1)

‎projects/igniteui-angular/src/lib/combo/combo.component.ts

+17-1
Original file line numberDiff line numberDiff line change
@@ -813,6 +813,14 @@ export class IgxComboComponent extends DisplayDensityBase implements IgxComboBas
813813
@Input()
814814
public type = 'box';
815815

816+
/**
817+
* An @Input property that controls whether the combo's search box
818+
* should be focused after the `onOpened` event is called
819+
* When `false`, the combo's list item container will be focused instead
820+
*/
821+
@Input()
822+
public autoFocusSearch = true;
823+
816824
/**
817825
* Gets if control is valid, when used in a form
818826
*
@@ -1480,7 +1488,15 @@ export class IgxComboComponent extends DisplayDensityBase implements IgxComboBas
14801488
*/
14811489
public handleOpened() {
14821490
this.triggerCheck();
1483-
this.focusSearchInput(true);
1491+
1492+
// Disabling focus of the search input should happen only when drop down opens.
1493+
// During keyboard navigation input should receive focus, even the autoFocusSearch is disabled.
1494+
// That is why in such cases focusing of the dropdownContainer happens outside focusSearchInput method.
1495+
if (this.autoFocusSearch) {
1496+
this.focusSearchInput(true);
1497+
} else {
1498+
this.dropdownContainer.nativeElement.focus();
1499+
}
14841500
this.onOpened.emit();
14851501
}
14861502

‎projects/igniteui-angular/src/lib/core/styles/base/utilities/_functions.scss

+1-1
Original file line numberDiff line numberDiff line change
@@ -350,7 +350,7 @@
350350
/// // otherwise, it will return the value for key 'icon-color' in the '$avatar-theme';
351351
/// @returns {String} - The value of the key in the passed map, or the name of key concatenated with the key name.
352352
@function --var($map, $key, $fallback: null) {
353-
$igx-legacy-support: if(global-variable-exists('igx-legacy-support'), $igx-legacy-support, true);
353+
$igx-legacy-support: if(global-variable-exists('igx-legacy-support'), $igx-legacy-support, false);
354354

355355
@if map-has-key($map, $key) {
356356
@if $igx-legacy-support == false {

‎projects/igniteui-angular/src/lib/core/styles/components/_common/_igx-display-container.scss

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
%display-container {
1+
%display-container {
22
display: inherit;
33
position: relative;
44
width: 100%;

‎projects/igniteui-angular/src/lib/core/styles/components/_common/_igx-vhelper.scss

-1
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,6 @@
1212

1313
%vhelper--vertical {
1414
position: absolute;
15-
width: 18px;
1615
top: 0;
1716
#{$right}: 0;
1817
}

‎projects/igniteui-angular/src/lib/core/styles/components/button-group/_button-group-component.scss

+4
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,10 @@
1515
@extend %igx-group-item !optional;
1616
}
1717

18+
@include e(button-text) {
19+
@extend %igx-button-group__button-text !optional;
20+
}
21+
1822
@include e(item, $m: selected) {
1923
@extend %igx-group-item !optional;
2024
@extend %igx-group-item-selected !optional;

‎projects/igniteui-angular/src/lib/core/styles/components/button-group/_button-group-theme.scss

+7-5
Original file line numberDiff line numberDiff line change
@@ -186,11 +186,10 @@
186186
display: flex;
187187
box-shadow: --var($theme, 'shadow');
188188
transition: $transition;
189-
border-radius: --var($theme, 'border-radius')
189+
border-radius: --var($theme, 'border-radius');
190190
}
191191

192192
%igx-group-item {
193-
@include ellipsis();
194193
border: $group-item-border-thickness solid --var($theme, 'item-border-color');
195194
color: --var($theme, 'item-text-color');
196195
background: --var($theme, 'item-background');
@@ -308,13 +307,16 @@
308307
%igx-group-item-content {
309308
display: flex;
310309
flex-flow: row nowrap;
311-
justify-content: center;
312-
align-items: center;
313-
text-align: center;
310+
min-width: 0;
314311

315312
* ~ * {
316313
margin-#{$left}: $group-items-margin;
317314
}
318315
}
316+
317+
%igx-button-group__button-text {
318+
width: 100%;
319+
@include ellipsis();
320+
}
319321
}
320322

‎projects/igniteui-angular/src/lib/core/styles/components/grid/_excel-filtering-theme.scss

+15-21
Original file line numberDiff line numberDiff line change
@@ -16,31 +16,18 @@
1616

1717
%grid-excel-filter {
1818
display: block;
19-
}
20-
21-
%grid-excel-filter--inline {
2219
width: 100%;
20+
height: 100%;
2321
flex-grow: 1;
22+
box-shadow: igx-elevation($elevations, 12);
2423
overflow: auto;
24+
}
25+
26+
%grid-excel-filter--inline {
27+
box-shadow: none;
2528

2629
%grid-excel-menu {
27-
display: flex;
28-
flex-direction: column;
2930
width: 100%;
30-
height: 100%;
31-
box-shadow: none;
32-
33-
%grid-excel-main {
34-
display: flex;
35-
flex-direction: column;
36-
flex-grow: 1;
37-
overflow: hidden;
38-
}
39-
40-
%grid-excel-main igx-list {
41-
flex-grow: 1;
42-
overflow: hidden;
43-
}
4431
}
4532
}
4633

@@ -67,10 +54,12 @@
6754
}
6855

6956
%grid-excel-menu {
57+
display: flex;
58+
flex-direction: column;
59+
height: 100%;
7060
width: 320px;
7161
min-width: 320px;
7262
background: --var($theme, 'filtering-row-background');
73-
box-shadow: igx-elevation($elevations, 12);
7463
border-radius: 4px;
7564

7665
@include igx-button-group(igx-button-group-theme(
@@ -227,10 +216,15 @@
227216
}
228217

229218
%grid-excel-main {
230-
display: block;
219+
display: flex;
220+
flex-direction: column;
221+
flex-grow: 1;
222+
overflow: hidden;
231223
padding: 0 rem(16px);
232224

233225
igx-list {
226+
flex-grow: 1;
227+
overflow: hidden;
234228
margin: rem(8px) -#{rem(16px)} 0;
235229
border: 0;
236230
border-top: 1px dashed igx-color($palette, 'grays', 300);

‎projects/igniteui-angular/src/lib/core/styles/components/scrollbar/scrollbar-component.scss

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
////
2+
/// @group components
3+
/// @author <a href="https://github.com/simeonoff" target="_blank">Simeon Simeonoff</a>
4+
/// @requires {mixin} bem-block
5+
/// @requires {mixin} bem-elem
6+
/// @requires {mixin} bem-mod
7+
////
8+
@include b(igx-scrollbar) {
9+
// Register the component in the component registry
10+
$this: bem--selector-to-string(&);
11+
@include register-component(str-slice($this, 2, -1));
12+
13+
@extend %scrollbar-display !optional;
14+
}
15+

0 commit comments

Comments
 (0)