diff --git a/CHANGELOG.md b/CHANGELOG.md index f4bb2225629..9f88dcf3155 100755 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,4 +1,32 @@ # Changelog +## [17.6.0](https://github.com/primefaces/primeng/tree/17.6.0) (2024-02-07) + +[Full Changelog](https://github.com/primefaces/primeng/compare/17.5.0...17.6.0) + +**Implemented New Features and Enhancements:** +- Dropdown | make clear method public for better DX [\#14641](https://github.com/primefaces/primeng/issues/14641) + +**Fixed bugs:** +- MultiSelect: selectedItemsLabel is not localized (re-opened) [\#14554](https://github.com/primefaces/primeng/issues/14554) +- Component: Calendar isn't show initial value from FormControl/ngModel [\#14616](https://github.com/primefaces/primeng/issues/14616) +- Component: Dropdown removing a letter from filter that comes after a whitespace ' ' removes the whitespace [\#14701](https://github.com/primefaces/primeng/issues/14701) +- Component: p-multiselect - double click on multiselect "button" causes modal window to jump around before disappearing [\#14442](https://github.com/primefaces/primeng/issues/14442) +- Virtual Scroll Jumping Backwards [\#14298](https://github.com/primefaces/primeng/issues/14298) +- p-dropdown: dropdown options float to the top when searching [\#14659](https://github.com/primefaces/primeng/issues/14659) +- Dropdown: Key events not correctly working when filter is enabled [\#14189](https://github.com/primefaces/primeng/issues/14189) +- Component: Dropdown| closing overlay on pressing enter key on filter input [\#14708](https://github.com/primefaces/primeng/issues/14708) +- Component: p-Dropdown placeholder/values not displayed [\#14695](https://github.com/primefaces/primeng/issues/14695) +- TreeSelect: When using reactive form disabled input doesn't affect [\#14662](https://github.com/primefaces/primeng/issues/14662) +- MultiSelect: dynamic text in placeholder is not displayed [\#14321](https://github.com/primefaces/primeng/issues/14321) +- Dropdown: dynamic text in placeholder is not displayed [\#14320](https://github.com/primefaces/primeng/issues/14320) +- Component: Dropdown TypeError: option.toLowerCase is not a function [\#14682](https://github.com/primefaces/primeng/issues/14682) +- Dropdown: "0" Value in optionValue, causes Label to be replaced by Placeholder [\#14715](https://github.com/primefaces/primeng/issues/14715) +- The scrollToIndex method on VirtualScroller does not scroll to the correct index when triggered twice. [\#14731](https://github.com/primefaces/primeng/issues/14731) +- Checkbox: Disabled property does not work when it's used with formControlName [\#14693](https://github.com/primefaces/primeng/issues/14693) +- PrimeNg p-columnFilter does not close on outside element click or scroll or search submit [\#14658](https://github.com/primefaces/primeng/issues/14658) +- Showcase | Remove stateful config [\#14752](https://github.com/primefaces/primeng/issues/14752) + + ## [17.5.0](https://github.com/primefaces/primeng/tree/17.5.0) (2024-02-01) [Full Changelog](https://github.com/primefaces/primeng/compare/17.4.0...17.5.0) @@ -242,6 +270,12 @@ - TypeError: this.focusedItemInfo.mutate is not a function [\#14119](https://github.com/primefaces/primeng/issues/14119) - Upgrade to Angular 17? [\#14063](https://github.com/primefaces/primeng/issues/14063) +## ![LTS](https://www.primefaces.org/wp-content/uploads/2020/01/lts-icon-24.png "PrimeNG LTS") [16.9.5-LTS](https://www.npmjs.com/package/primeng/v/16.9.5-lts) (2024-02-07) + +**Fixed bugs:** +- The scrollToIndex method on VirtualScroller does not scroll to the correct index when triggered twice. [\#14731](https://github.com/primefaces/primeng/issues/14731) +- Checkbox: Disabled property does not work when it's used with formControlName [\#14693](https://github.com/primefaces/primeng/issues/14693) + ## ![LTS](https://www.primefaces.org/wp-content/uploads/2020/01/lts-icon-24.png "PrimeNG LTS") [16.9.4-LTS](https://www.npmjs.com/package/primeng/v/16.9.4-lts) (2024-01-19) **Fixed bugs:** @@ -789,6 +823,12 @@ - Checkbox in p-treeNode always checked when using custom icon [\#12951](https://github.com/primefaces/primeng/issues/12951) - ConfirmDialog: Duplicated AcceptIcons [\#13001](https://github.com/primefaces/primeng/issues/13001) +## ![LTS](https://www.primefaces.org/wp-content/uploads/2020/01/lts-icon-24.png "PrimeNG LTS") [15.4.16-LTS](https://www.npmjs.com/package/primeng/v/15.4.16-lts) (2024-02-07) + +**Fixed bugs:** +- The scrollToIndex method on VirtualScroller does not scroll to the correct index when triggered twice. [\#14731](https://github.com/primefaces/primeng/issues/14731) +- Checkbox: Disabled property does not work when it's used with formControlName [\#14693](https://github.com/primefaces/primeng/issues/14693) + ## ![LTS](https://www.primefaces.org/wp-content/uploads/2020/01/lts-icon-24.png "PrimeNG LTS") [15.4.15-LTS](https://www.npmjs.com/package/primeng/v/15.4.15-lts) (2024-01-19) **Fixed bugs:** diff --git a/package.json b/package.json index 86941ae4ea6..ed24dbe2932 100755 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "primeng", - "version": "17.5.0", + "version": "17.6.0", "license": "SEE LICENSE IN LICENSE.md", "scripts": { "ng": "ng", diff --git a/src/app/components/api/translationkeys.ts b/src/app/components/api/translationkeys.ts index ca48602cfa6..1c1f803cc23 100644 --- a/src/app/components/api/translationkeys.ts +++ b/src/app/components/api/translationkeys.ts @@ -43,5 +43,5 @@ export class TranslationKeys { public static readonly EMPTY_FILTER_MESSAGE = 'emptyFilterMessage'; public static readonly SHOW_FILTER_MENU = 'showFilterMenu'; public static readonly HIDE_FILTER_MENU = 'hideFilterMenu'; - public static readonly SELECTION_MESSAGE = '{0} items selected'; + public static readonly SELECTION_MESSAGE = 'selectionMessage'; } diff --git a/src/app/components/calendar/calendar.ts b/src/app/components/calendar/calendar.ts index 311bf6f2ecb..ce28618cce4 100755 --- a/src/app/components/calendar/calendar.ts +++ b/src/app/components/calendar/calendar.ts @@ -3016,9 +3016,7 @@ export class Calendar implements OnInit, OnDestroy, ControlValueAccessor { } } } - if (this.dataType === 'string') { - this.updateModel(value); - } + this.updateInputfield(); this.updateUI(); this.cd.markForCheck(); diff --git a/src/app/components/dropdown/dropdown.ts b/src/app/components/dropdown/dropdown.ts index 029b537cb6e..54c58442874 100755 --- a/src/app/components/dropdown/dropdown.ts +++ b/src/app/components/dropdown/dropdown.ts @@ -886,7 +886,7 @@ export class Dropdown implements OnInit, AfterViewInit, AfterContentInit, AfterV return { 'p-dropdown-label p-inputtext': true, 'p-placeholder': this.placeholder() && label === this.placeholder(), - 'p-dropdown-label-empty': !this.editable && !this.selectedItemTemplate && (!label || label === 'p-emptylabel' || label.length === 0) + 'p-dropdown-label-empty': !this.editable && !this.selectedItemTemplate && (label === undefined || label === null || label === 'p-emptylabel' || label.length === 0) }; } @@ -912,11 +912,11 @@ export class Dropdown implements OnInit, AfterViewInit, AfterContentInit, AfterV !_filterBy && !this.filterFields && !this.optionValue ? this.options.filter((option) => { if (option.label) { - return option.label.toLowerCase().indexOf(this._filterValue().toLowerCase()) !== -1; + return option.label.toLowerCase().indexOf(this._filterValue().toLowerCase().trim()) !== -1; } - return option.toLowerCase().indexOf(this._filterValue().toLowerCase()) !== -1; + return option.toLowerCase().indexOf(this._filterValue().toLowerCase().trim()) !== -1; }) - : this.filterService.filter(options, this.searchFields(), this._filterValue(), this.filterMatchMode, this.filterLocale); + : this.filterService.filter(options, this.searchFields(), this._filterValue().trim(), this.filterMatchMode, this.filterLocale); if (this.group) { const optionGroups = this.options || []; @@ -939,6 +939,7 @@ export class Dropdown implements OnInit, AfterViewInit, AfterContentInit, AfterV label = computed(() => { const selectedOptionIndex = this.findSelectedOptionIndex(); + return selectedOptionIndex !== -1 ? this.getOptionLabel(this.visibleOptions()[selectedOptionIndex]) : this.placeholder() || 'p-emptylabel'; }); @@ -1773,13 +1774,13 @@ export class Dropdown implements OnInit, AfterViewInit, AfterContentInit, AfterV } onFilterInputChange(event: Event | any): void { - let value: string = (event.target as HTMLInputElement).value?.trim(); + let value: string = (event.target as HTMLInputElement).value; this._filterValue.set(value); this.focusedOptionIndex.set(-1); this.onFilter.emit({ originalEvent: event, filter: this._filterValue() }); !this.virtualScrollerDisabled && this.scroller.scrollToIndex(0); setTimeout(() => { - this.overlayViewChild.alignOverlay() + this.overlayViewChild.alignOverlay(); }); this.cd.markForCheck(); } diff --git a/src/app/components/inputtextarea/inputtextarea.ts b/src/app/components/inputtextarea/inputtextarea.ts index 2ba3ee128e5..87cf924c2f0 100755 --- a/src/app/components/inputtextarea/inputtextarea.ts +++ b/src/app/components/inputtextarea/inputtextarea.ts @@ -14,7 +14,7 @@ import { Subscription } from 'rxjs'; '[class.p-inputtextarea-resizable]': 'autoResize' } }) -export class InputTextarea implements OnInit, AfterViewInit, AfterViewChecked, OnDestroy { +export class InputTextarea implements OnInit, AfterViewInit, OnDestroy { /** * When present, textarea size changes as being typed. * @group Props @@ -51,10 +51,6 @@ export class InputTextarea implements OnInit, AfterViewInit, AfterViewChecked, O } } - ngAfterViewChecked() { - this.updateState(); - } - ngAfterViewInit() { if (this.autoResize) this.resize(); diff --git a/src/app/components/multiselect/multiselect.ts b/src/app/components/multiselect/multiselect.ts index 51fc8931029..e51a28054d1 100755 --- a/src/app/components/multiselect/multiselect.ts +++ b/src/app/components/multiselect/multiselect.ts @@ -177,7 +177,7 @@ export class MultiSelectItem { - {{ placeholder || defaultLabel || 'empty' }} + {{ placeholder() || defaultLabel || 'empty' }} @@ -518,7 +518,7 @@ export class MultiSelect implements OnInit, AfterViewInit, AfterContentInit, Aft * Label to display after exceeding max selected labels e.g. ({0} items selected), defaults "ellipsis" keyword to indicate a text-overflow. * @group Props */ - @Input() selectedItemsLabel: string = '{0} items selected'; + @Input() selectedItemsLabel: string | undefined; /** * Whether to show the checkbox at header to toggle all items at once. * @group Props @@ -976,6 +976,8 @@ export class MultiSelect implements OnInit, AfterViewInit, AfterContentInit, Aft selectedOptions: any; + clickInProgress: boolean = false; + get containerClass() { return { 'p-multiselect p-component p-inputwrapper': true, @@ -1692,7 +1694,7 @@ export class MultiSelect implements OnInit, AfterViewInit, AfterContentInit, Aft } onContainerClick(event: any) { - if (this.disabled || this.readonly || (event.target).isSameNode(this.focusInputViewChild?.nativeElement)) { + if (this.disabled || this.readonly || (event.target as Node).isSameNode(this.focusInputViewChild?.nativeElement)) { return; } @@ -1700,6 +1702,16 @@ export class MultiSelect implements OnInit, AfterViewInit, AfterContentInit, Aft event.preventDefault(); return; } else if (!this.overlayViewChild || !this.overlayViewChild.el.nativeElement.contains(event.target)) { + if (this.clickInProgress) { + return; + } + + this.clickInProgress = true; + + setTimeout(() => { + this.clickInProgress = false; + }, 150); + this.overlayVisible ? this.hide(true) : this.show(true); } this.focusInputViewChild?.nativeElement.focus({ preventScroll: true }); @@ -1735,7 +1747,7 @@ export class MultiSelect implements OnInit, AfterViewInit, AfterContentInit, Aft } onFilterInputChange(event: KeyboardEvent) { - let value: string = (event.target as HTMLInputElement).value?.trim(); + let value: string = (event.target as HTMLInputElement).value; this._filterValue.set(value); this.focusedOptionIndex.set(-1); this.onFilter.emit({ originalEvent: event, filter: this._filterValue() }); diff --git a/src/app/components/package.json b/src/app/components/package.json index cee5282f334..9468b002cce 100644 --- a/src/app/components/package.json +++ b/src/app/components/package.json @@ -1,6 +1,6 @@ { "name": "primeng", - "version": "17.5.0", + "version": "17.6.0", "repository": { "type": "git", "url": "https://github.com/primefaces/primeng" diff --git a/src/app/showcase/data/versions.json b/src/app/showcase/data/versions.json index c7ff02b2b20..da9c2ad68bb 100644 --- a/src/app/showcase/data/versions.json +++ b/src/app/showcase/data/versions.json @@ -1,16 +1,16 @@ [ { - "version": "v17.5.0", + "version": "v17.6.0", "name": "v17", "url": "https://primeng.org" }, { - "version": "v16.9.3-lts", + "version": "v16.9.5-lts", "name": "v16", "url": "https://www.primefaces.org/primeng-v16-lts/" }, { - "version": "v15.4.14-lts", + "version": "v15.4.16-lts", "name": "v15", "url": "https://www.primefaces.org/primeng-v15-lts/#/" }, diff --git a/src/app/showcase/layout/doc/app.docsection-nav.component.ts b/src/app/showcase/layout/doc/app.docsection-nav.component.ts index 31e17a8e223..3c9bf1b2d90 100644 --- a/src/app/showcase/layout/doc/app.docsection-nav.component.ts +++ b/src/app/showcase/layout/doc/app.docsection-nav.component.ts @@ -92,7 +92,7 @@ export class AppDocSectionNavComponent implements OnInit, OnDestroy { return [...Array.from(this.document.querySelectorAll(':is(h1,h2,h3).doc-section-label'))].filter((el: any) => DomHandler.isVisible(el)); } - onScroll() { + onScroll() { if (isPlatformBrowser(this.platformId) && this.nav) { if (!this.isScrollBlocked) { this.zone.run(() => { diff --git a/src/app/showcase/layout/doc/codeeditor/templates.ts b/src/app/showcase/layout/doc/codeeditor/templates.ts index ef1df9cfeb4..748ba555e21 100644 --- a/src/app/showcase/layout/doc/codeeditor/templates.ts +++ b/src/app/showcase/layout/doc/codeeditor/templates.ts @@ -15,7 +15,7 @@ export interface Props { const app_dependencies = pkg ? pkg.devDependencies : {}; const PrimeNG = { - version: '17.5.0', + version: '17.6.0', description: 'PrimeNG is an open source UI library for Angular featuring a rich set of 80+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with PrimeBlock, which has 370+ ready to use UI blocks to build spectacular applications in no time.' };