Skip to content

Commit 995f79e

Browse files
skrustevskrustev
committed
Merge master into skrastev/localization
2 parents 3fd96c1 + 2818f3a commit 995f79e

File tree

52 files changed

+1031
-276
lines changed

Some content is hidden

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

52 files changed

+1031
-276
lines changed

‎.github/workflows/nodejs.yml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ jobs:
1616

1717
strategy:
1818
matrix:
19-
node-version: [20.x, 22.x]
19+
node-version: [20.x, 22.17.1]
2020

2121
steps:
2222
- name: Checkout

‎CHANGELOG.md‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,11 +5,34 @@ All notable changes for each version of this project will be documented in this
55

66
## 20.1.0
77
### New Features
8+
`IgxDateRangePicker`
9+
- Added cancel button to the dialog, allowing the user to cancel the selection.
10+
811
- `IgxCarousel`
912
- Added `select` method overload accepting index.
1013
```ts
1114
this.carousel.select(2, Direction.NEXT);
1215
```
16+
- `IgxGrid`, `IgxTreeGrid`, `IgxHierarchicalGrid`
17+
- Added ability to pin individual columns to a specific side (start or end of the grid), so that you can now have pinning from both sides. This can be done either declaratively by setting the `pinningPosition` property on the column:
18+
19+
```html
20+
<igx-column [field]="'Col1'" [pinned]='true' [pinningPosition]='pinningPosition'>
21+
</igx-column>
22+
```
23+
24+
```ts
25+
public pinningPosition = ColumnPinningPosition.End;
26+
```
27+
28+
Or with the API, via optional parameter:
29+
30+
```ts
31+
grid.pinColumn('Col1', 0, ColumnPinningPosition.End);
32+
grid.pinColumn('Col2', 0, ColumnPinningPosition.Start);
33+
```
34+
35+
If property `pinningPosition` is not set on a column, the column will default to the position specified on the grid's `pinning` options for `columns`.
1336

1437
- `IgxDateRangePicker`
1538
- Added new properties:

‎projects/igniteui-angular-elements/src/analyzer/elements.config.ts‎

Lines changed: 19 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -274,6 +274,8 @@ export var registerConfig = [
274274
{ name: "defaultHeaderGroupMinWidth" },
275275
{ name: "columns" },
276276
{ name: "pinnedColumns" },
277+
{ name: "pinnedStartColumns" },
278+
{ name: "pinnedEndColumns" },
277279
{ name: "pinnedRows" },
278280
{ name: "unpinnedColumns" },
279281
{ name: "visibleColumns" },
@@ -327,7 +329,8 @@ export var registerConfig = [
327329
"findPrev",
328330
"refreshSearch",
329331
"clearSearch",
330-
"getPinnedWidth",
332+
"getPinnedStartWidth",
333+
"getPinnedEndWidth",
331334
"selectRows",
332335
"deselectRows",
333336
"selectAllRows",
@@ -568,6 +571,8 @@ export var registerConfig = [
568571
{ name: "defaultHeaderGroupMinWidth" },
569572
{ name: "columns" },
570573
{ name: "pinnedColumns" },
574+
{ name: "pinnedStartColumns" },
575+
{ name: "pinnedEndColumns" },
571576
{ name: "pinnedRows" },
572577
{ name: "unpinnedColumns" },
573578
{ name: "visibleColumns" },
@@ -613,7 +618,8 @@ export var registerConfig = [
613618
"findPrev",
614619
"refreshSearch",
615620
"clearSearch",
616-
"getPinnedWidth",
621+
"getPinnedStartWidth",
622+
"getPinnedEndWidth",
617623
"selectRows",
618624
"deselectRows",
619625
"selectAllRows",
@@ -748,6 +754,8 @@ export var registerConfig = [
748754
{ name: "defaultRowHeight" },
749755
{ name: "defaultHeaderGroupMinWidth" },
750756
{ name: "columns" },
757+
{ name: "pinnedStartColumns" },
758+
{ name: "pinnedEndColumns" },
751759
{ name: "visibleColumns" },
752760
{ name: "dataView" },
753761
],
@@ -780,6 +788,7 @@ export var registerConfig = [
780788
"clearFilter",
781789
"clearSort",
782790
"reflow",
791+
"getPinnedEndWidth",
783792
"selectRows",
784793
"deselectRows",
785794
"selectAllRows",
@@ -872,6 +881,8 @@ export var registerConfig = [
872881
{ name: "defaultRowHeight" },
873882
{ name: "defaultHeaderGroupMinWidth" },
874883
{ name: "columns" },
884+
{ name: "pinnedStartColumns" },
885+
{ name: "pinnedEndColumns" },
875886
{ name: "pinnedRows" },
876887
],
877888
methods: [
@@ -908,7 +919,8 @@ export var registerConfig = [
908919
"findPrev",
909920
"refreshSearch",
910921
"clearSearch",
911-
"getPinnedWidth",
922+
"getPinnedStartWidth",
923+
"getPinnedEndWidth",
912924
"selectRows",
913925
"deselectRows",
914926
"selectAllRows",
@@ -1022,6 +1034,8 @@ export var registerConfig = [
10221034
{ name: "defaultHeaderGroupMinWidth" },
10231035
{ name: "columns" },
10241036
{ name: "pinnedColumns" },
1037+
{ name: "pinnedStartColumns" },
1038+
{ name: "pinnedEndColumns" },
10251039
{ name: "pinnedRows" },
10261040
{ name: "unpinnedColumns" },
10271041
{ name: "visibleColumns" },
@@ -1069,7 +1083,8 @@ export var registerConfig = [
10691083
"findPrev",
10701084
"refreshSearch",
10711085
"clearSearch",
1072-
"getPinnedWidth",
1086+
"getPinnedStartWidth",
1087+
"getPinnedEndWidth",
10731088
"selectRows",
10741089
"deselectRows",
10751090
"selectAllRows",

‎projects/igniteui-angular/src/lib/core/i18n/date-range-picker-resources.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { convertToIgxResource } from './resources';
44
export interface IDateRangePickerResourceStrings {
55
igx_date_range_picker_date_separator?: string;
66
igx_date_range_picker_done_button?: string;
7+
igx_date_range_picker_cancel_button?: string;
78
igx_date_range_picker_last7Days?: string;
89
igx_date_range_picker_currentMonth?: string;
910
igx_date_range_picker_last30Days?: string;

‎projects/igniteui-angular/src/lib/core/styles/components/calendar/_calendar-theme.scss‎

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -814,11 +814,9 @@
814814
%date-inner {
815815
color: var-get($theme, 'weekend-color');
816816

817-
@if $variant == 'indigo' {
818-
&:hover {
819-
color: var-get($theme, 'date-hover-foreground');
820-
}
821-
}
817+
&:hover {
818+
color: var-get($theme, 'date-hover-foreground');
819+
}
822820
}
823821
}
824822

‎projects/igniteui-angular/src/lib/core/styles/components/combo/_combo-theme.scss‎

Lines changed: 0 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -136,20 +136,6 @@
136136
}
137137

138138
@if $variant == 'bootstrap' {
139-
.igx-input-group--disabled {
140-
%igx-combo__toggle-button {
141-
border-inline-start-width: rem(1px);
142-
border-inline-start-style: solid;
143-
border-inline-start-color: inherit;
144-
}
145-
}
146-
147-
igx-suffix:not(.igx-combo__clear-button) + %igx-combo__toggle-button {
148-
border-inline-start-width: rem(1px);
149-
border-inline-start-style: solid;
150-
border-inline-start-color: inherit;
151-
}
152-
153139
.igx-input-group__bundle::after {
154140
height: rem(1px) !important;
155141
}

‎projects/igniteui-angular/src/lib/core/styles/components/input/_input-group-theme.scss‎

Lines changed: 51 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -612,7 +612,7 @@
612612
%bootstrap-file-focused,
613613
%bootstrap-file-valid,
614614
%bootstrap-file-warning,
615-
%bootstrap-file-invalid,
615+
%bootstrap-file-invalid
616616
{
617617
%form-group-bundle {
618618
border-radius: var-get($theme, 'box-border-radius');
@@ -670,18 +670,42 @@
670670
%form-group-bundle {
671671
box-shadow: 0 0 0 rem(4px) var-get($theme, 'success-shadow-color');
672672
}
673+
674+
%form-group-prefix:not(:first-child) {
675+
border-inline-start-color: var-get($theme, 'success-secondary-color');
676+
}
677+
678+
%form-group-suffix:not(:last-child) {
679+
border-inline-end-color: var-get($theme, 'success-secondary-color');
680+
}
673681
}
674682

675683
%bootstrap-file-warning-focused {
676684
%form-group-bundle {
677685
box-shadow: 0 0 0 rem(4px) color($color: 'warn', $variant: '500', $opacity: .38);
686+
687+
%form-group-prefix:not(:first-child) {
688+
border-inline-start-color: var-get($theme, 'warning-secondary-color');
689+
}
690+
691+
%form-group-suffix:not(:last-child) {
692+
border-inline-end-color: var-get($theme, 'warning-secondary-color');
693+
}
678694
}
679695
}
680696

681697
%bootstrap-file-invalid-focused {
682698
%form-group-bundle {
683699
box-shadow: 0 0 0 rem(4px) var-get($theme, 'error-shadow-color');
684700
}
701+
702+
%form-group-prefix:not(:first-child) {
703+
border-inline-start-color: var-get($theme, 'error-secondary-color');
704+
}
705+
706+
%form-group-suffix:not(:last-child) {
707+
border-inline-end-color: var-get($theme, 'error-secondary-color');
708+
}
685709
}
686710

687711
@if $variant == 'bootstrap' {
@@ -691,6 +715,14 @@
691715
%upload-button {
692716
border-color: var-get($theme, 'focused-border-color');
693717
}
718+
719+
%form-group-prefix:not(:first-child) {
720+
border-inline-start-color: var-get($theme, 'focused-border-color');
721+
}
722+
723+
%form-group-suffix:not(:last-child) {
724+
border-inline-end-color: var-get($theme, 'focused-border-color');
725+
}
694726
}
695727
}
696728

@@ -2015,11 +2047,6 @@
20152047
};
20162048
}
20172049
}
2018-
2019-
.igx-input-group__clear-icon + igx-suffix,
2020-
.igx-input-group__clear-icon + [igxPrefix] {
2021-
border-inline-start: rem(1px) solid var-get($theme, 'border-color');
2022-
}
20232050
}
20242051

20252052
%form-group-display--bootstrap-suffixed-focused {
@@ -2284,6 +2311,24 @@
22842311
border-color: var-get($theme, 'disabled-border-color');
22852312
color: var-get($theme, 'disabled-text-color');
22862313
}
2314+
2315+
%form-group-prefix--disabled-bootstrap:not(:first-child) {
2316+
border-inline-start-color: var-get($theme, 'disabled-border-color');
2317+
}
2318+
2319+
%form-group-suffix--disabled-bootstrap:not(:last-child) {
2320+
border-inline-end-color: var-get($theme, 'disabled-border-color');
2321+
}
2322+
2323+
@if $variant == 'bootstrap' {
2324+
%form-group-prefix:not(:first-child) {
2325+
border-inline-start: rem(1px) solid var-get($theme, 'border-color');
2326+
}
2327+
2328+
%form-group-suffix:not(:last-child) {
2329+
border-inline-end: rem(1px) solid var-get($theme, 'border-color');
2330+
}
2331+
}
22872332
}
22882333

22892334
/// Adds typography styles for the igx-input-group component.

‎projects/igniteui-angular/src/lib/core/styles/components/select/_select-theme.scss‎

Lines changed: 0 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -13,22 +13,6 @@
1313
display: block;
1414
}
1515

16-
@if $variant == 'bootstrap' {
17-
.igx-input-group--disabled {
18-
%igx-select__toggle-button {
19-
border-inline-start-width: rem(1px);
20-
border-inline-start-style: solid;
21-
border-inline-start-color: inherit;
22-
}
23-
}
24-
25-
igx-suffix + %igx-select__toggle-button {
26-
border-inline-start-width: rem(1px);
27-
border-inline-start-style: solid;
28-
border-inline-start-color: inherit;
29-
}
30-
}
31-
3216
.igx-input-group {
3317
%igx-select__toggle-button {
3418
background: var-get($theme, 'toggle-button-background');

‎projects/igniteui-angular/src/lib/date-common/calendar-container/calendar-container.component.html‎

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,22 @@
11
<ng-template #defaultPickerActions>
2-
@if (closeButtonLabel || todayButtonLabel) {
2+
@if (closeButtonLabel || cancelButtonLabel || todayButtonLabel) {
33
<div class="igx-date-picker__buttons">
4+
@if (cancelButtonLabel) {
5+
<button
6+
#cancelButton type="button"
7+
igxButton="flat" igxRipple
8+
(click)="calendarCancel.emit({ owner: this})"
9+
>
10+
{{ cancelButtonLabel }}
11+
</button>
12+
}
413
@if (closeButtonLabel) {
514
<button
615
#closeButton
716
type="button"
817
igxButton="flat"
918
igxRipple
10-
(click)="calendarClose.emit({ owner: this })"
19+
(click)="calendarClose.emit({ owner: this})"
1120
>
1221
{{ closeButtonLabel }}
1322
</button>
@@ -28,7 +37,6 @@
2837
</ng-template>
2938

3039
<igx-calendar></igx-calendar>
31-
3240
@if( usePredefinedRanges || (customRanges?.length || 0) > 0 ){
3341
<igx-predefined-ranges-area
3442
[usePredefinedRanges]="usePredefinedRanges"
@@ -40,7 +48,7 @@
4048
@if (pickerActions?.template || (closeButtonLabel || todayButtonLabel)) {
4149
<igx-divider></igx-divider>
4250
}
43-
@if (pickerActions?.template || (closeButtonLabel || todayButtonLabel)) {
51+
@if (pickerActions?.template || (closeButtonLabel || cancelButtonLabel || todayButtonLabel)) {
4452
<div class="igx-date-picker__actions">
4553
<ng-container
4654
*ngTemplateOutlet="

‎projects/igniteui-angular/src/lib/date-common/calendar-container/calendar-container.component.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,9 @@ export class IgxCalendarContainerComponent {
3838
@Output()
3939
public calendarClose = new EventEmitter<IBaseEventArgs>();
4040

41+
@Output()
42+
public calendarCancel = new EventEmitter<IBaseEventArgs>();
43+
4144
@Output()
4245
public todaySelection = new EventEmitter<IBaseEventArgs>();
4346

@@ -58,6 +61,7 @@ export class IgxCalendarContainerComponent {
5861
public resourceStrings!: IDateRangePickerResourceStrings;
5962
public vertical = false;
6063
public closeButtonLabel: string;
64+
public cancelButtonLabel: string;
6165
public todayButtonLabel: string;
6266
public mode: PickerInteractionMode = PickerInteractionMode.DropDown;
6367
public pickerActions: IgxPickerActionsDirective;

0 commit comments

Comments
 (0)