Skip to content

Commit d3d356e

Browse files
RafalSeifertRafalSeifert
committed
Release 7.0.0
1 parent 31bb495 commit d3d356e

File tree

14 files changed

+165
-34
lines changed

14 files changed

+165
-34
lines changed

‎CHANGELOG.md

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,62 @@
1+
## 7.0.0 (16.09.2024)
2+
3+
This version requires Angular v18. Follow the [Angular Update Guide](https://angular.dev/update-guide) to migrate your project to Angular 18.
4+
5+
### Breaking changes:
6+
7+
- Updated Angular to v18, this version is required in MDB Angular v7.
8+
- [Checkbox](https://mdbootstrap.com/docs/angular/forms/checkbox/) - changed `margin-right` style from `4px` to `6px` in `.form-check-input` element.
9+
- [Forms](https://mdbootstrap.com/docs/angular/forms/overview/) - added `padding-left: 0.15rem` style to `.form-check-label` element.
10+
- [Switch](https://mdbootstrap.com/docs/angular/forms/switch/) - changed `margin-right` style from `4px` to `8px` in `.form-check-input` element.
11+
- [Progress](https://mdbootstrap.com/docs/angular/components/progress/) - added `box-shadow: none` style to `.progress` element.
12+
- [Input group](https://mdbootstrap.com/docs/angular/forms/input-group/) - added `flex-wrap: nowrap` style to `.input-group` element.
13+
- [Datepicker](https://mdbootstrap.com/docs/angular/forms/datepicker/) - changed SCSS variable `$datepicker-small-cell-content-width` value from `36px` to `40px`.
14+
- [Range](https://mdbootstrap.com/docs/angular/forms/range/):
15+
- Added `box-shadow: none` style to `.form-range ::-webkit-slider-runnable-track` element.
16+
- Added `box-shadow: none` style to `.form-range ::-moz-range-track` element.
17+
- [Captcha](https://mdbootstrap.com/docs/angular/plugins/captcha/):
18+
- Changed `error` event name to `captchaError`.
19+
- Changed `expire` event name to `captchaExpire`.
20+
- Changed `success` event name to `captchaSuccess`.
21+
- [Timepicker](https://mdbootstrap.com/docs/angular/forms/timepicker/):
22+
- Redesigned clock's page HTML structure and styles.
23+
- Arrow icons are now displayed when hour/minute buttons are hovered in inline mode.
24+
- [Treeview](https://mdbootstrap.com/docs/angular/plugins/tree-view/):
25+
- Redesigned entire HTML structure.
26+
- Replaced `li` element with `mdb-treeview-item`.
27+
- Removed the `<div class="treeview">` wrapper element from the entire component.
28+
- Removed the `checkboxesField` input.
29+
- Added a public `MdbTreeviewColor` type for the color input.
30+
- Added a new mechanism for setting the arrow icon with the `collapseIcon` property.
31+
- Added keyboard navigation handling.
32+
33+
### Fixes and improvements:
34+
35+
- [Multi range](https://mdbootstrap.com/docs/angular/forms/multi-range-slider/) - resolved the issue with `TouchEvent` in Firefox.
36+
- [Select](https://mdbootstrap.com/docs/angular/forms/select/) - resolved the issue with unhandled `tabindex` input.
37+
- [Onboarding](https://mdbootstrap.com/docs/angular/plugins/onboarding/) - resolved the issue with initializing onboarding with a delay after navigating to another page.
38+
- [Input fields](https://mdbootstrap.com/docs/angular/forms/input-fields/) - resolved the issue with displaying the value after setting it programmatically in all inputs with built-in placeholders (e.g., `datetime-local` or `time`).
39+
- [Datatable](https://mdbootstrap.com/docs/angular/data/datatables/) - resolved the issue with the `showAllEntries` input not working properly with the `entries` input.
40+
- [Timepicker](https://mdbootstrap.com/docs/angular/forms/timepicker/) - resolved the issue with `ArrowUp` and `ArrowDown` key presses not working upon opening the timepicker.
41+
- [Datepicker](https://mdbootstrap.com/docs/angular/forms/datepicker/):
42+
- Resolved the issue with returned form control values for empty or invalid input values.
43+
- Resolved the issue with closing the datepicker using the input toggle.
44+
- [Calendar](https://mdbootstrap.com/docs/angular/plugins/calendar/):
45+
- Resolved the issue with unpreserved event IDs on edit.
46+
- Resolved the issue with dragging in `readonly` mode.
47+
- Resolved the issue with view selection when non-default captions are used.
48+
- Resolved the issue with rendering the period in the correct format in Month view.
49+
50+
### New features:
51+
52+
- [Dropdown](https://mdbootstrap.com/docs/angular/components/dropdown/) - added `MdbDropdownPositionClass` type to the public API.
53+
- [Modal](https://mdbootstrap.com/docs/angular/components/modal/) - added `focusElementSelector` property to the `open` method's options for specifying the element to focus on when the modal opens.
54+
- [Calendar](https://mdbootstrap.com/docs/angular/plugins/calendar/):
55+
- Added `addEventButtonCaption` property to the `options` input for setting a custom caption for the add event button.
56+
- Added `MdbCalendarViews` Enum to the public API.
57+
58+
---
59+
160
## 6.1.0 (27.05.2024)
261

362
### Fixes and improvements:

‎README.txt

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
MDB 5 Angular
22

3-
Version: FREE 6.1.0
3+
Version: FREE 7.0.0
44

55
Documentation:
66
https://mdbootstrap.com/docs/angular/

‎package-lock.json

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "mdb-angular-ui-kit-free",
3-
"version": "6.1.0",
3+
"version": "7.0.0",
44
"scripts": {
55
"ng": "ng",
66
"start": "ng serve",

‎projects/mdb-angular-ui-kit/CHANGELOG.md

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,62 @@
1+
## 7.0.0 (16.09.2024)
2+
3+
This version requires Angular v18. Follow the [Angular Update Guide](https://angular.dev/update-guide) to migrate your project to Angular 18.
4+
5+
### Breaking changes:
6+
7+
- Updated Angular to v18, this version is required in MDB Angular v7.
8+
- [Checkbox](https://mdbootstrap.com/docs/angular/forms/checkbox/) - changed `margin-right` style from `4px` to `6px` in `.form-check-input` element.
9+
- [Forms](https://mdbootstrap.com/docs/angular/forms/overview/) - added `padding-left: 0.15rem` style to `.form-check-label` element.
10+
- [Switch](https://mdbootstrap.com/docs/angular/forms/switch/) - changed `margin-right` style from `4px` to `8px` in `.form-check-input` element.
11+
- [Progress](https://mdbootstrap.com/docs/angular/components/progress/) - added `box-shadow: none` style to `.progress` element.
12+
- [Input group](https://mdbootstrap.com/docs/angular/forms/input-group/) - added `flex-wrap: nowrap` style to `.input-group` element.
13+
- [Datepicker](https://mdbootstrap.com/docs/angular/forms/datepicker/) - changed SCSS variable `$datepicker-small-cell-content-width` value from `36px` to `40px`.
14+
- [Range](https://mdbootstrap.com/docs/angular/forms/range/):
15+
- Added `box-shadow: none` style to `.form-range ::-webkit-slider-runnable-track` element.
16+
- Added `box-shadow: none` style to `.form-range ::-moz-range-track` element.
17+
- [Captcha](https://mdbootstrap.com/docs/angular/plugins/captcha/):
18+
- Changed `error` event name to `captchaError`.
19+
- Changed `expire` event name to `captchaExpire`.
20+
- Changed `success` event name to `captchaSuccess`.
21+
- [Timepicker](https://mdbootstrap.com/docs/angular/forms/timepicker/):
22+
- Redesigned clock's page HTML structure and styles.
23+
- Arrow icons are now displayed when hour/minute buttons are hovered in inline mode.
24+
- [Treeview](https://mdbootstrap.com/docs/angular/plugins/tree-view/):
25+
- Redesigned entire HTML structure.
26+
- Replaced `li` element with `mdb-treeview-item`.
27+
- Removed the `<div class="treeview">` wrapper element from the entire component.
28+
- Removed the `checkboxesField` input.
29+
- Added a public `MdbTreeviewColor` type for the color input.
30+
- Added a new mechanism for setting the arrow icon with the `collapseIcon` property.
31+
- Added keyboard navigation handling.
32+
33+
### Fixes and improvements:
34+
35+
- [Multi range](https://mdbootstrap.com/docs/angular/forms/multi-range-slider/) - resolved the issue with `TouchEvent` in Firefox.
36+
- [Select](https://mdbootstrap.com/docs/angular/forms/select/) - resolved the issue with unhandled `tabindex` input.
37+
- [Onboarding](https://mdbootstrap.com/docs/angular/plugins/onboarding/) - resolved the issue with initializing onboarding with a delay after navigating to another page.
38+
- [Input fields](https://mdbootstrap.com/docs/angular/forms/input-fields/) - resolved the issue with displaying the value after setting it programmatically in all inputs with built-in placeholders (e.g., `datetime-local` or `time`).
39+
- [Datatable](https://mdbootstrap.com/docs/angular/data/datatables/) - resolved the issue with the `showAllEntries` input not working properly with the `entries` input.
40+
- [Timepicker](https://mdbootstrap.com/docs/angular/forms/timepicker/) - resolved the issue with `ArrowUp` and `ArrowDown` key presses not working upon opening the timepicker.
41+
- [Datepicker](https://mdbootstrap.com/docs/angular/forms/datepicker/):
42+
- Resolved the issue with returned form control values for empty or invalid input values.
43+
- Resolved the issue with closing the datepicker using the input toggle.
44+
- [Calendar](https://mdbootstrap.com/docs/angular/plugins/calendar/):
45+
- Resolved the issue with unpreserved event IDs on edit.
46+
- Resolved the issue with dragging in `readonly` mode.
47+
- Resolved the issue with view selection when non-default captions are used.
48+
- Resolved the issue with rendering the period in the correct format in Month view.
49+
50+
### New features:
51+
52+
- [Dropdown](https://mdbootstrap.com/docs/angular/components/dropdown/) - added `MdbDropdownPositionClass` type to the public API.
53+
- [Modal](https://mdbootstrap.com/docs/angular/components/modal/) - added `focusElementSelector` property to the `open` method's options for specifying the element to focus on when the modal opens.
54+
- [Calendar](https://mdbootstrap.com/docs/angular/plugins/calendar/):
55+
- Added `addEventButtonCaption` property to the `options` input for setting a custom caption for the add event button.
56+
- Added `MdbCalendarViews` Enum to the public API.
57+
58+
---
59+
160
## 6.1.0 (27.05.2024)
261

362
### Fixes and improvements:

‎projects/mdb-angular-ui-kit/assets/scss/free/_progress.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,5 +2,5 @@
22

33
.progress {
44
border-radius: 0;
5-
// box-shadow: none; This should be added in next major release 7.0.0
5+
box-shadow: none;
66
}

‎projects/mdb-angular-ui-kit/assets/scss/free/forms/_form-check.scss

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -85,7 +85,7 @@
8585
&[type='checkbox'] {
8686
border-radius: $form-check-input-checkbox-border-radius;
8787
margin-top: 0.19em;
88-
margin-right: 4px; // This should be changed to 6px in next major release 7.0.0
88+
margin-right: 6px;
8989

9090
&:focus {
9191
&:after {
@@ -177,7 +177,7 @@
177177
}
178178

179179
.form-check-label {
180-
// padding-left: 0.15rem; This should be added in next major release 7.0.0
180+
padding-left: 0.15rem;
181181
&:hover {
182182
cursor: pointer;
183183
}
@@ -196,7 +196,7 @@
196196
height: $form-switch-form-check-input-height;
197197
background-color: $form-switch-form-check-input-background-color;
198198
margin-top: 0.3em;
199-
margin-right: 4px; // This should be changed to 8px in next major release 7.0.0
199+
margin-right: 8px;
200200

201201
&:after {
202202
content: '';

‎projects/mdb-angular-ui-kit/assets/scss/free/forms/_form-range.scss

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@
3434
&::-webkit-slider-runnable-track {
3535
height: $form-range-webkit-slider-runnable-track-height;
3636
border-radius: 0;
37-
// box-shadow: none; This should be added in next major release 7.0.0
37+
box-shadow: none;
3838
}
3939

4040
&::-moz-range-thumb {
@@ -43,6 +43,6 @@
4343
}
4444

4545
&::-moz-range-track {
46-
// box-shadow: none; This should be added in next major release 7.0.0
46+
box-shadow: none;
4747
}
4848
}

‎projects/mdb-angular-ui-kit/assets/scss/free/forms/_input-group.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
//
44

55
.input-group {
6-
// flex-wrap: nowrap; This should be added in next major release 7.0.0
6+
flex-wrap: nowrap;
77

88
> .form-control {
99
min-height: $input-group-min-height;

‎projects/mdb-angular-ui-kit/dropdown/public_api.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
export { MdbDropdownDirective } from './dropdown.directive';
1+
export { MdbDropdownDirective, MdbDropdownPositionClass } from './dropdown.directive';
22
export { MdbDropdownToggleDirective } from './dropdown-toggle.directive';
33
export { MdbDropdownMenuDirective } from './dropdown-menu.directive';
44
export { MdbDropdownModule } from './dropdown.module';

‎projects/mdb-angular-ui-kit/forms/input.directive.ts

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { BooleanInput, coerceBooleanProperty } from '@angular/cdk/coercion';
22
import {
33
AfterViewInit,
4+
DestroyRef,
45
Directive,
56
DoCheck,
67
ElementRef,
@@ -16,7 +17,7 @@ import { NgControl } from '@angular/forms';
1617
import { Subject } from 'rxjs';
1718
import { MdbAbstractFormControl } from './form-control';
1819
import { AutofillEvent, AutofillMonitor } from '@angular/cdk/text-field';
19-
20+
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
2021
@Directive({
2122
// eslint-disable-next-line @angular-eslint/directive-selector
2223
selector: '[mdbInput]',
@@ -31,7 +32,8 @@ export class MdbInputDirective
3132
private _elementRef: ElementRef,
3233
private _renderer: Renderer2,
3334
@Optional() @Self() private _ngControl: NgControl,
34-
private _autofill: AutofillMonitor
35+
private _autofill: AutofillMonitor,
36+
private _destroyRef: DestroyRef
3537
) {}
3638

3739
readonly stateChanges: Subject<void> = new Subject<void>();
@@ -53,6 +55,12 @@ export class MdbInputDirective
5355
this._autofilled = event.isAutofilled;
5456
this.stateChanges.next();
5557
});
58+
59+
this.stateChanges.pipe(takeUntilDestroyed(this._destroyRef)).subscribe(() => {
60+
if (this._hasTypeInterferingPlaceholder()) {
61+
this._updateTextColorForDateType();
62+
}
63+
});
5664
}
5765

5866
private _currentNativeValue: any;
@@ -109,18 +117,12 @@ export class MdbInputDirective
109117
@HostListener('focus')
110118
_onFocus(): void {
111119
this._focused = true;
112-
if (this._hasTypeInterferingPlaceholder()) {
113-
this._updateTextColorForDateType();
114-
}
115120
this.stateChanges.next();
116121
}
117122

118123
@HostListener('blur')
119124
_onBlur(): void {
120125
this._focused = false;
121-
if (this._hasTypeInterferingPlaceholder()) {
122-
this._updateTextColorForDateType();
123-
}
124126
this.stateChanges.next();
125127
}
126128

‎projects/mdb-angular-ui-kit/modal/modal-config.ts

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
11
import { ViewContainerRef } from '@angular/core';
22

3-
/* eslint-disable @typescript-eslint/no-inferrable-types */
43
export class MdbModalConfig<D = any> {
5-
animation?: boolean = true;
6-
backdrop?: boolean = true;
7-
ignoreBackdropClick?: boolean = false;
8-
keyboard?: boolean = true;
9-
modalClass?: string = '';
10-
containerClass?: string = '';
4+
animation? = true;
5+
backdrop? = true;
6+
ignoreBackdropClick? = false;
7+
keyboard? = true;
8+
modalClass? = '';
9+
containerClass? = '';
1110
viewContainerRef?: ViewContainerRef;
1211
data?: D | null = null;
13-
nonInvasive?: boolean = false;
12+
nonInvasive? = false;
13+
focusElementSelector? = '';
1414
}

‎projects/mdb-angular-ui-kit/modal/modal-container.component.ts

Lines changed: 16 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -101,15 +101,26 @@ export class MdbModalContainerComponent implements OnInit, AfterViewInit, OnDest
101101
this._focusTrap = this._focusTrapFactory.create(this.host);
102102
this._previouslyFocusedElement = this._document.activeElement as HTMLElement;
103103
}
104-
104+
const focusElement =
105+
this._config.focusElementSelector &&
106+
(this.modalContent.nativeElement.querySelector(
107+
this._config.focusElementSelector
108+
) as HTMLElement);
105109
if (this._config.animation) {
106110
setTimeout(() => {
107111
this._renderer.addClass(this.host, 'show');
108-
109-
setTimeout(() => {
110-
this._focusTrap?.focusInitialElementWhenReady();
111-
}, this.MODAL_TRANSITION);
112+
if (focusElement) {
113+
setTimeout(() => {
114+
focusElement.focus();
115+
}, this.MODAL_TRANSITION);
116+
} else {
117+
setTimeout(() => {
118+
this._focusTrap?.focusInitialElementWhenReady();
119+
}, this.MODAL_TRANSITION);
120+
}
112121
}, this.BACKDROP_TRANSITION);
122+
} else if (focusElement) {
123+
focusElement.focus();
113124
} else {
114125
this._focusTrap?.focusInitialElementWhenReady();
115126
}

‎projects/mdb-angular-ui-kit/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
"homepage": "https://mdbootstrap.com/docs/b5/angular/",
55
"author": "MDBootstrap",
66
"license": "MIT",
7-
"version": "6.1.0",
7+
"version": "7.0.0",
88
"peerDependencies": {
99
"@angular/common": "^18.0.0",
1010
"@angular/core": "^18.0.0",

0 commit comments

Comments
 (0)