From b3e91c77387a9169a8cec085a1cfde6df45b7f35 Mon Sep 17 00:00:00 2001 From: LcsGa Date: Mon, 29 Jan 2024 00:10:06 +0100 Subject: [PATCH] feat: add input transform `numberAttribute` functions on every boolean inputs --- src/app/components/accordion/accordion.ts | 5 ++-- .../animateonscroll/animateonscroll.ts | 4 +-- .../components/autocomplete/autocomplete.ts | 15 +++++----- src/app/components/blockui/blockui.ts | 5 ++-- src/app/components/calendar/calendar.ts | 13 +++++---- src/app/components/carousel/carousel.ts | 5 ++-- .../components/cascadeselect/cascadeselect.ts | 5 ++-- src/app/components/checkbox/checkbox.ts | 21 ++++++++++++-- src/app/components/chips/chips.ts | 7 +++-- src/app/components/colorpicker/colorpicker.ts | 5 ++-- .../components/confirmdialog/confirmdialog.ts | 5 ++-- .../components/confirmpopup/confirmpopup.ts | 5 ++-- src/app/components/contextmenu/contextmenu.ts | 11 +++---- src/app/components/dataview/dataview.ts | 17 ++++++----- src/app/components/dialog/dialog.ts | 9 +++--- src/app/components/dropdown/dropdown.ts | 9 +++--- src/app/components/fileupload/fileupload.ts | 9 +++--- src/app/components/galleria/galleria.ts | 13 +++++---- src/app/components/inputmask/inputmask.ts | 7 +++-- src/app/components/inputnumber/inputnumber.ts | 19 ++++++------ src/app/components/inputswitch/inputswitch.ts | 4 +-- src/app/components/knob/knob.ts | 14 ++++----- src/app/components/listbox/listbox.ts | 7 +++-- src/app/components/megamenu/megamenu.ts | 7 +++-- src/app/components/menu/menu.ts | 5 ++-- src/app/components/menubar/menubar.ts | 9 +++--- src/app/components/multiselect/multiselect.ts | 9 +++--- src/app/components/orderlist/orderlist.ts | 7 +++-- .../components/overlaypanel/overlaypanel.ts | 3 +- src/app/components/paginator/paginator.ts | 9 +++--- src/app/components/panelmenu/panelmenu.ts | 9 +++--- src/app/components/password/password.ts | 5 ++-- src/app/components/picklist/picklist.ts | 7 +++-- src/app/components/progressbar/progressbar.ts | 4 +-- src/app/components/radiobutton/radiobutton.ts | 4 +-- src/app/components/rating/rating.ts | 4 +-- src/app/components/scrollpanel/scrollpanel.ts | 5 ++-- src/app/components/scrolltop/scrolltop.ts | 4 +-- .../components/selectbutton/selectbutton.ts | 4 +-- src/app/components/sidebar/sidebar.ts | 5 ++-- src/app/components/slidemenu/slidemenu.ts | 19 ++++++------ src/app/components/slider/slider.ts | 29 +++++++++++++++---- src/app/components/speeddial/speeddial.ts | 5 ++-- src/app/components/spinner/spinner.ts | 14 ++++----- src/app/components/splitbutton/splitbutton.ts | 4 +-- src/app/components/splitter/splitter.ts | 8 ++--- src/app/components/steps/steps.ts | 4 +-- src/app/components/table/table.ts | 29 ++++++++++--------- src/app/components/tabview/tabview.ts | 3 +- src/app/components/tieredmenu/tieredmenu.ts | 11 +++---- src/app/components/toast/toast.ts | 11 +++---- .../components/togglebutton/togglebutton.ts | 4 +-- src/app/components/tooltip/tooltip.ts | 12 ++++---- src/app/components/tree/tree.ts | 15 +++++----- src/app/components/treetable/treetable.ts | 19 ++++++------ .../tristatecheckbox/tristatecheckbox.ts | 4 +-- .../virtualscroller/virtualscroller.ts | 7 +++-- .../layout/doc/app.docapitable.component.ts | 4 +-- .../doc/app.docsectiontext.component.ts | 4 +-- 59 files changed, 298 insertions(+), 222 deletions(-) diff --git a/src/app/components/accordion/accordion.ts b/src/app/components/accordion/accordion.ts index 9a7aa4cc3c2..9f5860532dd 100755 --- a/src/app/components/accordion/accordion.ts +++ b/src/app/components/accordion/accordion.ts @@ -18,7 +18,8 @@ import { TemplateRef, ViewEncapsulation, booleanAttribute, - forwardRef + forwardRef, + numberAttribute } from '@angular/core'; import { BlockableUI, Header, PrimeTemplate, SharedModule } from 'primeng/api'; import { DomHandler } from 'primeng/dom'; @@ -197,7 +198,7 @@ export class AccordionTab implements AfterContentInit, OnDestroy { * The aria-level that each accordion header will have. The default value is 2 as per W3C specifications * @group Props */ - @Input() headerAriaLevel: number = 2; + @Input({ transform: numberAttribute }) headerAriaLevel: number = 2; /** * Event triggered by changing the choice. * @param {boolean} value - Boolean value indicates that the option is changed. diff --git a/src/app/components/animateonscroll/animateonscroll.ts b/src/app/components/animateonscroll/animateonscroll.ts index 3592bd87256..f664bc353c2 100644 --- a/src/app/components/animateonscroll/animateonscroll.ts +++ b/src/app/components/animateonscroll/animateonscroll.ts @@ -1,5 +1,5 @@ import { CommonModule, DOCUMENT, isPlatformBrowser } from '@angular/common'; -import { AfterViewInit, Directive, ElementRef, Input, NgModule, Renderer2, OnInit, Inject, PLATFORM_ID, booleanAttribute } from '@angular/core'; +import { AfterViewInit, Directive, ElementRef, Input, NgModule, Renderer2, OnInit, Inject, PLATFORM_ID, booleanAttribute, numberAttribute } from '@angular/core'; import { DomHandler } from 'primeng/dom'; interface AnimateOnScrollOptions { @@ -43,7 +43,7 @@ export class AnimateOnScroll implements OnInit, AfterViewInit { * Specifies the threshold option of the IntersectionObserver API * @group Props */ - @Input() threshold: number | undefined; + @Input({ transform: numberAttribute }) threshold: number | undefined; /** * Whether the scroll event listener should be removed after initial run. * @group Props diff --git a/src/app/components/autocomplete/autocomplete.ts b/src/app/components/autocomplete/autocomplete.ts index bd33a3f6506..9aa52398d7c 100755 --- a/src/app/components/autocomplete/autocomplete.ts +++ b/src/app/components/autocomplete/autocomplete.ts @@ -17,6 +17,7 @@ import { Input, NgModule, NgZone, + numberAttribute, OnDestroy, Output, QueryList, @@ -282,12 +283,12 @@ export class AutoComplete implements AfterViewChecked, AfterContentInit, OnDestr * Minimum number of characters to initiate a search. * @group Props */ - @Input() minLength: number = 1; + @Input({ transform: numberAttribute }) minLength: number = 1; /** * Delay between keystrokes to wait before sending a query. * @group Props */ - @Input() delay: number = 300; + @Input({ transform: numberAttribute }) delay: number = 300; /** * Inline style of the component. * @group Props @@ -357,7 +358,7 @@ export class AutoComplete implements AfterViewChecked, AfterContentInit, OnDestr * Height of an item in the list for VirtualScrolling. * @group Props */ - @Input() virtualScrollItemSize: number | undefined; + @Input({ transform: numberAttribute }) virtualScrollItemSize: number | undefined; /** * Whether to use the scroller feature. The properties of scroller component can be used like an object in it. * @group Props @@ -367,7 +368,7 @@ export class AutoComplete implements AfterViewChecked, AfterContentInit, OnDestr * Maximum number of character allows in the input field. * @group Props */ - @Input() maxlength: number | undefined; + @Input({ transform: numberAttribute }) maxlength: number | undefined; /** * Name of the input element. * @group Props @@ -382,7 +383,7 @@ export class AutoComplete implements AfterViewChecked, AfterContentInit, OnDestr * Size of the input field. * @group Props */ - @Input() size: number | undefined; + @Input({ transform: numberAttribute }) size: number | undefined; /** * Target element to attach the overlay, valid values are "body" or a local ng-template variable of another element (note: use binding with brackets for template variables, e.g. [appendTo]="mydiv" for a div element having #mydiv as variable name). * @group Props @@ -412,7 +413,7 @@ export class AutoComplete implements AfterViewChecked, AfterContentInit, OnDestr * Base zIndex value to use in layering. * @group Props */ - @Input() baseZIndex: number = 0; + @Input({ transform: numberAttribute }) baseZIndex: number = 0; /** * Defines a string that labels the input for accessibility. * @group Props @@ -483,7 +484,7 @@ export class AutoComplete implements AfterViewChecked, AfterContentInit, OnDestr * Index of the element in tabbing order. * @group Props */ - @Input() tabindex: number | undefined; + @Input({ transform: numberAttribute }) tabindex: number | undefined; /** * A property to uniquely identify a value in options. * @group Props diff --git a/src/app/components/blockui/blockui.ts b/src/app/components/blockui/blockui.ts index eb12ba15683..974ec41da4c 100755 --- a/src/app/components/blockui/blockui.ts +++ b/src/app/components/blockui/blockui.ts @@ -16,7 +16,8 @@ import { TemplateRef, ViewChild, ViewEncapsulation, - booleanAttribute + booleanAttribute, + numberAttribute } from '@angular/core'; import { PrimeNGConfig, PrimeTemplate } from 'primeng/api'; import { DomHandler } from 'primeng/dom'; @@ -63,7 +64,7 @@ export class BlockUI implements AfterViewInit, OnDestroy { * Base zIndex value to use in layering. * @group Props */ - @Input() baseZIndex: number = 0; + @Input({ transform: numberAttribute }) baseZIndex: number = 0; /** * Class of the element. * @group Props diff --git a/src/app/components/calendar/calendar.ts b/src/app/components/calendar/calendar.ts index d1c42117921..4867f5054c0 100755 --- a/src/app/components/calendar/calendar.ts +++ b/src/app/components/calendar/calendar.ts @@ -13,6 +13,7 @@ import { Input, NgModule, NgZone, + numberAttribute, OnDestroy, OnInit, Output, @@ -603,17 +604,17 @@ export class Calendar implements OnInit, OnDestroy, ControlValueAccessor { * Hours to change per step. * @group Props */ - @Input() stepHour: number = 1; + @Input({ transform: numberAttribute }) stepHour: number = 1; /** * Minutes to change per step. * @group Props */ - @Input() stepMinute: number = 1; + @Input({ transform: numberAttribute }) stepMinute: number = 1; /** * Seconds to change per step. * @group Props */ - @Input() stepSecond: number = 1; + @Input({ transform: numberAttribute }) stepSecond: number = 1; /** * Whether to show the seconds in time picker. * @group Props @@ -653,7 +654,7 @@ export class Calendar implements OnInit, OnDestroy, ControlValueAccessor { * Maximum number of selectable dates in multiple mode. * @group Props */ - @Input() maxDateCount: number | undefined; + @Input({ transform: numberAttribute }) maxDateCount: number | undefined; /** * Whether to display today and clear buttons at the footer * @group Props @@ -678,7 +679,7 @@ export class Calendar implements OnInit, OnDestroy, ControlValueAccessor { * Base zIndex value to use in layering. * @group Props */ - @Input() baseZIndex: number = 0; + @Input({ transform: numberAttribute }) baseZIndex: number = 0; /** * Style class of the datetimepicker container element. * @group Props @@ -728,7 +729,7 @@ export class Calendar implements OnInit, OnDestroy, ControlValueAccessor { * Index of the element in tabbing order. * @group Props */ - @Input() tabindex: number | undefined; + @Input({ transform: numberAttribute }) tabindex: number | undefined; /** * The minimum selectable date. * @group Props diff --git a/src/app/components/carousel/carousel.ts b/src/app/components/carousel/carousel.ts index 9818a067e1e..ed10709d1b7 100755 --- a/src/app/components/carousel/carousel.ts +++ b/src/app/components/carousel/carousel.ts @@ -20,7 +20,8 @@ import { TemplateRef, ViewChild, ViewEncapsulation, - booleanAttribute + booleanAttribute, + numberAttribute } from '@angular/core'; import { Footer, Header, PrimeTemplate, SharedModule } from 'primeng/api'; import { ChevronDownIcon } from 'primeng/icons/chevrondown'; @@ -264,7 +265,7 @@ export class Carousel implements AfterContentInit { * Time in milliseconds to scroll items automatically. * @group Props */ - @Input() autoplayInterval: number = 0; + @Input({ transform: numberAttribute }) autoplayInterval: number = 0; /** * Inline style of the component. * @group Props diff --git a/src/app/components/cascadeselect/cascadeselect.ts b/src/app/components/cascadeselect/cascadeselect.ts index ded7a6a0644..2ac1a516b67 100755 --- a/src/app/components/cascadeselect/cascadeselect.ts +++ b/src/app/components/cascadeselect/cascadeselect.ts @@ -15,6 +15,7 @@ import { Inject, Input, NgModule, + numberAttribute, OnInit, Output, QueryList, @@ -113,7 +114,7 @@ export class CascadeSelectSub implements OnInit { @Input() groupIconTemplate: Nullable>; - @Input() level: number = 0; + @Input({ transform: numberAttribute }) level: number = 0; @Input() optionLabel: string | undefined; @@ -438,7 +439,7 @@ export class CascadeSelect implements OnInit, AfterContentInit { * Index of the element in tabbing order. * @group Props */ - @Input() tabindex: number | undefined = 0; + @Input({ transform: numberAttribute }) tabindex: number | undefined = 0; /** * Establishes relationships between the component and label(s) where its value should be one or more element IDs. * @group Props diff --git a/src/app/components/checkbox/checkbox.ts b/src/app/components/checkbox/checkbox.ts index 540555eee9c..6aeed5ac070 100755 --- a/src/app/components/checkbox/checkbox.ts +++ b/src/app/components/checkbox/checkbox.ts @@ -1,5 +1,22 @@ import { CommonModule } from '@angular/common'; -import { booleanAttribute, ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, ElementRef, EventEmitter, forwardRef, Input, NgModule, Output, QueryList, TemplateRef, ViewChild, ViewEncapsulation } from '@angular/core'; +import { + booleanAttribute, + ChangeDetectionStrategy, + ChangeDetectorRef, + Component, + ContentChildren, + ElementRef, + EventEmitter, + forwardRef, + Input, + NgModule, + numberAttribute, + Output, + QueryList, + TemplateRef, + ViewChild, + ViewEncapsulation +} from '@angular/core'; import { ControlValueAccessor, FormControl, NG_VALUE_ACCESSOR } from '@angular/forms'; import { PrimeTemplate, SharedModule } from 'primeng/api'; import { CheckIcon } from 'primeng/icons/check'; @@ -126,7 +143,7 @@ export class Checkbox implements ControlValueAccessor { * Index of the element in tabbing order. * @group Props */ - @Input() tabindex: number | undefined; + @Input({ transform: numberAttribute }) tabindex: number | undefined; /** * Identifier of the focus input to match a label defined for the component. * @group Props diff --git a/src/app/components/chips/chips.ts b/src/app/components/chips/chips.ts index fb342218965..efac7e79302 100755 --- a/src/app/components/chips/chips.ts +++ b/src/app/components/chips/chips.ts @@ -16,7 +16,8 @@ import { ViewChild, ViewEncapsulation, booleanAttribute, - forwardRef + forwardRef, + numberAttribute } from '@angular/core'; import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; import { PrimeTemplate, SharedModule } from 'primeng/api'; @@ -157,7 +158,7 @@ export class Chips implements AfterContentInit, ControlValueAccessor { * Maximum number of entries allowed. * @group Props */ - @Input() max: number | undefined; + @Input({ transform: numberAttribute }) max: number | undefined; /** * Defines a string that labels the input for accessibility. * @group Props @@ -172,7 +173,7 @@ export class Chips implements AfterContentInit, ControlValueAccessor { * Index of the element in tabbing order. * @group Props */ - @Input() tabindex: number | undefined; + @Input({ transform: numberAttribute }) tabindex: number | undefined; /** * Identifier of the focus input to match a label defined for the component. * @group Props diff --git a/src/app/components/colorpicker/colorpicker.ts b/src/app/components/colorpicker/colorpicker.ts index 169a86ff533..3e25b145ff6 100755 --- a/src/app/components/colorpicker/colorpicker.ts +++ b/src/app/components/colorpicker/colorpicker.ts @@ -17,7 +17,8 @@ import { ViewChild, ViewEncapsulation, booleanAttribute, - forwardRef + forwardRef, + numberAttribute } from '@angular/core'; import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; import { OverlayService, PrimeNGConfig } from 'primeng/api'; @@ -144,7 +145,7 @@ export class ColorPicker implements ControlValueAccessor, OnDestroy { * Base zIndex value to use in layering. * @group Props */ - @Input() baseZIndex: number = 0; + @Input({ transform: numberAttribute }) baseZIndex: number = 0; /** * Transition options of the show animation. * @group Props diff --git a/src/app/components/confirmdialog/confirmdialog.ts b/src/app/components/confirmdialog/confirmdialog.ts index e2571cdf42a..38a38b13ba1 100755 --- a/src/app/components/confirmdialog/confirmdialog.ts +++ b/src/app/components/confirmdialog/confirmdialog.ts @@ -22,7 +22,8 @@ import { ViewChild, ViewEncapsulation, ViewRef, - booleanAttribute + booleanAttribute, + numberAttribute } from '@angular/core'; import { ConfirmEventType, Confirmation, ConfirmationService, Footer, PrimeNGConfig, PrimeTemplate, SharedModule, TranslationKeys } from 'primeng/api'; import { ButtonModule } from 'primeng/button'; @@ -274,7 +275,7 @@ export class ConfirmDialog implements AfterContentInit, OnInit, OnDestroy { * Base zIndex value to use in layering. * @group Props */ - @Input() baseZIndex: number = 0; + @Input({ transform: numberAttribute }) baseZIndex: number = 0; /** * Transition options of the animation. * @group Props diff --git a/src/app/components/confirmpopup/confirmpopup.ts b/src/app/components/confirmpopup/confirmpopup.ts index 2a28d3156b6..c966c3f7458 100755 --- a/src/app/components/confirmpopup/confirmpopup.ts +++ b/src/app/components/confirmpopup/confirmpopup.ts @@ -17,7 +17,8 @@ import { Renderer2, TemplateRef, ViewEncapsulation, - booleanAttribute + booleanAttribute, + numberAttribute } from '@angular/core'; import { Confirmation, ConfirmationService, OverlayService, PrimeNGConfig, PrimeTemplate, SharedModule, TranslationKeys } from 'primeng/api'; import { ButtonModule } from 'primeng/button'; @@ -144,7 +145,7 @@ export class ConfirmPopup implements AfterContentInit, OnDestroy { * Base zIndex value to use in layering. * @group Props */ - @Input() baseZIndex: number = 0; + @Input({ transform: numberAttribute }) baseZIndex: number = 0; /** * Inline style of the component. * @group Props diff --git a/src/app/components/contextmenu/contextmenu.ts b/src/app/components/contextmenu/contextmenu.ts index 3ffe14892e3..47bae4689f5 100755 --- a/src/app/components/contextmenu/contextmenu.ts +++ b/src/app/components/contextmenu/contextmenu.ts @@ -25,6 +25,7 @@ import { booleanAttribute, effect, forwardRef, + numberAttribute, signal } from '@angular/core'; import { RouterModule } from '@angular/router'; @@ -206,7 +207,7 @@ export class ContextMenuSub { @Input({ transform: booleanAttribute }) autoZIndex: boolean = true; - @Input() baseZIndex: number = 0; + @Input({ transform: numberAttribute }) baseZIndex: number = 0; @Input({ transform: booleanAttribute }) popup: boolean | undefined; @@ -216,13 +217,13 @@ export class ContextMenuSub { @Input() ariaLabelledBy: string | undefined; - @Input() level: number = 0; + @Input({ transform: numberAttribute }) level: number = 0; @Input() focusedItemId: string | undefined; @Input() activeItemPath: any[]; - @Input() tabindex: number = 0; + @Input({ transform: numberAttribute }) tabindex: number = 0; @Output() itemClick: EventEmitter = new EventEmitter(); @@ -436,7 +437,7 @@ export class ContextMenu implements OnInit, AfterContentInit, OnDestroy { * Base zIndex value to use in layering. * @group Props */ - @Input() baseZIndex: number = 0; + @Input({ transform: numberAttribute }) baseZIndex: number = 0; /** * Current id state as a string. * @group Props @@ -456,7 +457,7 @@ export class ContextMenu implements OnInit, AfterContentInit, OnDestroy { * Press delay in touch devices as miliseconds. * @group Props */ - @Input() pressDelay: number | undefined = 500; + @Input({ transform: numberAttribute }) pressDelay: number | undefined = 500; /** * Callback to invoke when overlay menu is shown. * @group Emits diff --git a/src/app/components/dataview/dataview.ts b/src/app/components/dataview/dataview.ts index 806259a832d..09564a67ee2 100755 --- a/src/app/components/dataview/dataview.ts +++ b/src/app/components/dataview/dataview.ts @@ -17,7 +17,8 @@ import { ChangeDetectorRef, ViewEncapsulation, OnDestroy, - booleanAttribute + booleanAttribute, + numberAttribute } from '@angular/core'; import { CommonModule } from '@angular/common'; import { ObjectUtils } from 'primeng/utils'; @@ -131,22 +132,22 @@ export class DataView implements OnInit, AfterContentInit, OnDestroy, BlockableU * Number of rows to display per page. * @group Props */ - @Input() rows: number | undefined; + @Input({ transform: numberAttribute }) rows: number | undefined; /** * Number of total records, defaults to length of value when not defined. * @group Props */ - @Input() totalRecords: number | undefined; + @Input({ transform: numberAttribute }) totalRecords: number | undefined; /** * Number of page links to display in paginator. * @group Props */ - @Input() pageLinks: number = 5; + @Input({ transform: numberAttribute }) pageLinks: number = 5; /** * Array of integer/object values to display inside rows per page dropdown of paginator * @group Props */ - @Input() rowsPerPageOptions: number[] | any[] | undefined; + @Input({ transform: numberAttribute }) rowsPerPageOptions: number[] | any[] | undefined; /** * Position of the paginator. * @group Props @@ -231,7 +232,7 @@ export class DataView implements OnInit, AfterContentInit, OnDestroy, BlockableU * Function to optimize the dom operations by delegating to ngForTrackBy, default algorithm checks for object identity. * @group Props */ - @Input() trackBy: Function = (index: number, item: any) => item; + @Input({ transform: numberAttribute }) trackBy: Function = (index: number, item: any) => item; /** * Comma separated list of fields in the object graph to search against. * @group Props @@ -256,7 +257,7 @@ export class DataView implements OnInit, AfterContentInit, OnDestroy, BlockableU * Index of the first row to be displayed. * @group Props */ - @Input() first: number | undefined = 0; + @Input({ transform: numberAttribute }) first: number | undefined = 0; /** * Property name of data to use in sorting by default. * @group Props @@ -266,7 +267,7 @@ export class DataView implements OnInit, AfterContentInit, OnDestroy, BlockableU * Order to sort the data by default. * @group Props */ - @Input() sortOrder: number | undefined; + @Input({ transform: numberAttribute }) sortOrder: number | undefined; /** * An array of objects to display. * @group Props diff --git a/src/app/components/dialog/dialog.ts b/src/app/components/dialog/dialog.ts index 7636d1ddb5c..076a9eae21a 100755 --- a/src/app/components/dialog/dialog.ts +++ b/src/app/components/dialog/dialog.ts @@ -24,7 +24,8 @@ import { ViewChild, ViewEncapsulation, ViewRef, - booleanAttribute + booleanAttribute, + numberAttribute } from '@angular/core'; import { Footer, Header, PrimeNGConfig, PrimeTemplate, SharedModule } from 'primeng/api'; import { DomHandler } from 'primeng/dom'; @@ -284,17 +285,17 @@ export class Dialog implements AfterContentInit, OnInit, OnDestroy { * Base zIndex value to use in layering. * @group Props */ - @Input() baseZIndex: number = 0; + @Input({ transform: numberAttribute }) baseZIndex: number = 0; /** * Minimum value for the left coordinate of dialog in dragging. * @group Props */ - @Input() minX: number = 0; + @Input({ transform: numberAttribute }) minX: number = 0; /** * Minimum value for the top coordinate of dialog in dragging. * @group Props */ - @Input() minY: number = 0; + @Input({ transform: numberAttribute }) minY: number = 0; /** * When enabled, first button receives focus on show. * @group Props diff --git a/src/app/components/dropdown/dropdown.ts b/src/app/components/dropdown/dropdown.ts index 6be6573f742..65d36326747 100755 --- a/src/app/components/dropdown/dropdown.ts +++ b/src/app/components/dropdown/dropdown.ts @@ -17,6 +17,7 @@ import { Input, NgModule, NgZone, + numberAttribute, OnInit, Output, QueryList, @@ -92,7 +93,7 @@ export class DropdownItem { @Input({ transform: booleanAttribute }) visible: boolean | undefined; - @Input() itemSize: number | undefined; + @Input({ transform: numberAttribute }) itemSize: number | undefined; @Input() ariaPosInset: string | undefined; @@ -399,7 +400,7 @@ export class Dropdown implements OnInit, AfterViewInit, AfterContentInit, AfterV * Index of the element in tabbing order. * @group Props */ - @Input() tabindex: number | undefined = 0; + @Input({ transform: numberAttribute }) tabindex: number | undefined = 0; /** * Default text to display when no option is selected. * @group Props @@ -515,7 +516,7 @@ export class Dropdown implements OnInit, AfterViewInit, AfterContentInit, AfterV * Height of an item in the list for VirtualScrolling. * @group Props */ - @Input() virtualScrollItemSize: number | undefined; + @Input({ transform: numberAttribute }) virtualScrollItemSize: number | undefined; /** * Whether to use the scroller feature. The properties of scroller component can be used like an object in it. * @group Props @@ -550,7 +551,7 @@ export class Dropdown implements OnInit, AfterViewInit, AfterContentInit, AfterV * Maximum number of character allows in the editable input field. * @group Props */ - @Input() maxlength: number | undefined; + @Input({ transform: numberAttribute }) maxlength: number | undefined; /** * Advisory information to display in a tooltip on hover. * @group Props diff --git a/src/app/components/fileupload/fileupload.ts b/src/app/components/fileupload/fileupload.ts index bd6f959cf3a..7a6da150e56 100755 --- a/src/app/components/fileupload/fileupload.ts +++ b/src/app/components/fileupload/fileupload.ts @@ -22,7 +22,8 @@ import { TemplateRef, ViewChild, ViewEncapsulation, - booleanAttribute + booleanAttribute, + numberAttribute } from '@angular/core'; import { DomSanitizer } from '@angular/platform-browser'; import { BlockableUI, Message, PrimeNGConfig, PrimeTemplate, SharedModule, TranslationKeys } from 'primeng/api'; @@ -203,7 +204,7 @@ export class FileUpload implements AfterViewInit, AfterContentInit, OnInit, OnDe * Maximum file size allowed in bytes. * @group Props */ - @Input() maxFileSize: number | undefined; + @Input({ transform: numberAttribute }) maxFileSize: number | undefined; /** * Summary message of the invalid file size. * @group Props @@ -248,7 +249,7 @@ export class FileUpload implements AfterViewInit, AfterContentInit, OnInit, OnDe * Width of the image thumbnail in pixels. * @group Props */ - @Input() previewWidth: number = 50; + @Input({ transform: numberAttribute }) previewWidth: number = 50; /** * Label of the choose button. Defaults to PrimeNG Locale configuration. * @group Props @@ -308,7 +309,7 @@ export class FileUpload implements AfterViewInit, AfterContentInit, OnInit, OnDe * Maximum number of files that can be uploaded. * @group Props */ - @Input() fileLimit: number | undefined; + @Input({ transform: numberAttribute }) fileLimit: number | undefined; /** * Style class of the upload button. * @group Props diff --git a/src/app/components/galleria/galleria.ts b/src/app/components/galleria/galleria.ts index 507fb637c35..09b7cffcb14 100755 --- a/src/app/components/galleria/galleria.ts +++ b/src/app/components/galleria/galleria.ts @@ -25,7 +25,8 @@ import { TemplateRef, ViewChild, ViewEncapsulation, - booleanAttribute + booleanAttribute, + numberAttribute } from '@angular/core'; import { PrimeNGConfig, PrimeTemplate, SharedModule } from 'primeng/api'; import { DomHandler } from 'primeng/dom'; @@ -117,7 +118,7 @@ export class Galleria implements OnChanges, OnDestroy { * Number of items per page. * @group Props */ - @Input() numVisible: number = 3; + @Input({ transform: numberAttribute }) numVisible: number = 3; /** * An array of options for responsive design. * @see {GalleriaResponsiveOptions} @@ -163,7 +164,7 @@ export class Galleria implements OnChanges, OnDestroy { * Time in milliseconds to scroll items. * @group Props */ - @Input() transitionInterval: number = 4000; + @Input({ transform: numberAttribute }) transitionInterval: number = 4000; /** * Whether to display thumbnail container. * @group Props @@ -198,7 +199,7 @@ export class Galleria implements OnChanges, OnDestroy { * Base zIndex value to use in layering. * @group Props */ - @Input() baseZIndex: number = 0; + @Input({ transform: numberAttribute }) baseZIndex: number = 0; /** * Style class of the mask on fullscreen mode. * @group Props @@ -477,7 +478,7 @@ export class GalleriaContent implements DoCheck { @Input() value: any[] = []; - @Input() numVisible: number | undefined; + @Input({ transform: numberAttribute }) numVisible: number | undefined; @Output() maskHide: EventEmitter = new EventEmitter(); @@ -581,7 +582,7 @@ export class GalleriaContent implements DoCheck { export class GalleriaItemSlot { @Input() templates: QueryList | undefined; - @Input() index: number | undefined; + @Input({ transform: numberAttribute }) index: number | undefined; @Input() get item(): any { return this._item; diff --git a/src/app/components/inputmask/inputmask.ts b/src/app/components/inputmask/inputmask.ts index dedccac16ef..bde26504aac 100755 --- a/src/app/components/inputmask/inputmask.ts +++ b/src/app/components/inputmask/inputmask.ts @@ -44,7 +44,8 @@ import { ViewChild, ViewEncapsulation, booleanAttribute, - forwardRef + forwardRef, + numberAttribute } from '@angular/core'; import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; import { PrimeTemplate, SharedModule } from 'primeng/api'; @@ -162,12 +163,12 @@ export class InputMask implements OnInit, ControlValueAccessor { * Size of the input field. * @group Props */ - @Input() size: number | undefined; + @Input({ transform: numberAttribute }) size: number | undefined; /** * Maximum number of character allows in the input field. * @group Props */ - @Input() maxlength: number | undefined; + @Input({ transform: numberAttribute }) maxlength: number | undefined; /** * Specifies tab order of the element. * @group Props diff --git a/src/app/components/inputnumber/inputnumber.ts b/src/app/components/inputnumber/inputnumber.ts index d16fd63d1bf..e8033c899ec 100644 --- a/src/app/components/inputnumber/inputnumber.ts +++ b/src/app/components/inputnumber/inputnumber.ts @@ -20,7 +20,8 @@ import { ViewChild, ViewEncapsulation, booleanAttribute, - forwardRef + forwardRef, + numberAttribute } from '@angular/core'; import { ControlValueAccessor, NG_VALUE_ACCESSOR, NgControl } from '@angular/forms'; import { PrimeTemplate, SharedModule } from 'primeng/api'; @@ -245,17 +246,17 @@ export class InputNumber implements OnInit, AfterContentInit, OnChanges, Control * Size of the input field. * @group Props */ - @Input() size: number | undefined; + @Input({ transform: numberAttribute }) size: number | undefined; /** * Maximum number of character allows in the input field. * @group Props */ - @Input() maxlength: number | undefined; + @Input({ transform: numberAttribute }) maxlength: number | undefined; /** * Specifies tab order of the element. * @group Props */ - @Input() tabindex: number | undefined; + @Input({ transform: numberAttribute }) tabindex: number | undefined; /** * Title text of the input text. * @group Props @@ -295,12 +296,12 @@ export class InputNumber implements OnInit, AfterContentInit, OnChanges, Control * Mininum boundary value. * @group Props */ - @Input() min: number | undefined; + @Input({ transform: numberAttribute }) min: number | undefined; /** * Maximum boundary value. * @group Props */ - @Input() max: number | undefined; + @Input({ transform: numberAttribute }) max: number | undefined; /** * Style class of the increment button. * @group Props @@ -330,7 +331,7 @@ export class InputNumber implements OnInit, AfterContentInit, OnChanges, Control * Step factor to increment/decrement the value. * @group Props */ - @Input() step: number = 1; + @Input({ transform: numberAttribute }) step: number = 1; /** * Determines whether the input field is empty. * @group Props @@ -370,12 +371,12 @@ export class InputNumber implements OnInit, AfterContentInit, OnChanges, Control * The minimum number of fraction digits to use. Possible values are from 0 to 20; the default for plain number and percent formatting is 0; the default for currency formatting is the number of minor unit digits provided by the ISO 4217 currency code list (2 if the list doesn't provide that information). * @group Props */ - @Input() minFractionDigits: number | undefined; + @Input({ transform: numberAttribute }) minFractionDigits: number | undefined; /** * The maximum number of fraction digits to use. Possible values are from 0 to 20; the default for plain number formatting is the larger of minimumFractionDigits and 3; the default for currency formatting is the larger of minimumFractionDigits and the number of minor unit digits provided by the ISO 4217 currency code list (2 if the list doesn't provide that information). * @group Props */ - @Input() maxFractionDigits: number | undefined; + @Input({ transform: numberAttribute }) maxFractionDigits: number | undefined; /** * Text to display before the value. * @group Props diff --git a/src/app/components/inputswitch/inputswitch.ts b/src/app/components/inputswitch/inputswitch.ts index 1110201d33f..56c669fe1e3 100755 --- a/src/app/components/inputswitch/inputswitch.ts +++ b/src/app/components/inputswitch/inputswitch.ts @@ -1,5 +1,5 @@ import { CommonModule } from '@angular/common'; -import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter, Input, NgModule, Output, ViewChild, ViewEncapsulation, booleanAttribute, forwardRef } from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter, Input, NgModule, Output, ViewChild, ViewEncapsulation, booleanAttribute, forwardRef, numberAttribute } from '@angular/core'; import { NG_VALUE_ACCESSOR } from '@angular/forms'; import { InputSwitchChangeEvent } from './inputswitch.interface'; @@ -67,7 +67,7 @@ export class InputSwitch { * Index of the element in tabbing order. * @group Props */ - @Input() tabindex: number | undefined; + @Input({ transform: numberAttribute }) tabindex: number | undefined; /** * Identifier of the input element. * @group Props diff --git a/src/app/components/knob/knob.ts b/src/app/components/knob/knob.ts index cd959aa093a..7e06d50c33c 100755 --- a/src/app/components/knob/knob.ts +++ b/src/app/components/knob/knob.ts @@ -1,5 +1,5 @@ import { CommonModule, DOCUMENT } from '@angular/common'; -import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter, Inject, Input, NgModule, Output, Renderer2, ViewEncapsulation, booleanAttribute, forwardRef } from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter, Inject, Input, NgModule, Output, Renderer2, ViewEncapsulation, booleanAttribute, forwardRef, numberAttribute } from '@angular/core'; import { NG_VALUE_ACCESSOR } from '@angular/forms'; import { VoidListener } from 'primeng/ts-helpers'; @@ -74,7 +74,7 @@ export class Knob { * Index of the element in tabbing order. * @group Props */ - @Input() tabindex: number = 0; + @Input({ transform: numberAttribute }) tabindex: number = 0; /** * Background of the value. * @group Props @@ -104,27 +104,27 @@ export class Knob { * Size of the component in pixels. * @group Props */ - @Input() size: number = 100; + @Input({ transform: numberAttribute }) size: number = 100; /** * Step factor to increment/decrement the value. * @group Props */ - @Input() step: number = 1; + @Input({ transform: numberAttribute }) step: number = 1; /** * Mininum boundary value. * @group Props */ - @Input() min: number = 0; + @Input({ transform: numberAttribute }) min: number = 0; /** * Maximum boundary value. * @group Props */ - @Input() max: number = 100; + @Input({ transform: numberAttribute }) max: number = 100; /** * Width of the knob stroke. * @group Props */ - @Input() strokeWidth: number = 14; + @Input({ transform: numberAttribute }) strokeWidth: number = 14; /** * When present, it specifies that the component should be disabled. * @group Props diff --git a/src/app/components/listbox/listbox.ts b/src/app/components/listbox/listbox.ts index 7907d990f5a..701129dee49 100755 --- a/src/app/components/listbox/listbox.ts +++ b/src/app/components/listbox/listbox.ts @@ -20,7 +20,8 @@ import { computed, signal, Renderer2, - booleanAttribute + booleanAttribute, + numberAttribute } from '@angular/core'; import { CommonModule } from '@angular/common'; import { SharedModule, PrimeTemplate, Footer, Header, FilterService, TranslationKeys, PrimeNGConfig, ScrollerOptions } from 'primeng/api'; @@ -313,7 +314,7 @@ export class Listbox implements AfterContentInit, OnInit, ControlValueAccessor, * Height of an item in the list for VirtualScrolling. * @group Props */ - @Input() virtualScrollItemSize: number | undefined; + @Input({ transform: numberAttribute }) virtualScrollItemSize: number | undefined; /** * Whether to use the scroller feature. The properties of scroller component can be used like an object in it. * @group Props @@ -328,7 +329,7 @@ export class Listbox implements AfterContentInit, OnInit, ControlValueAccessor, * Index of the element in tabbing order. * @group Props */ - @Input() tabindex: number | undefined = 0; + @Input({ transform: numberAttribute }) tabindex: number | undefined = 0; /** * When specified, allows selecting multiple values. * @group Props diff --git a/src/app/components/megamenu/megamenu.ts b/src/app/components/megamenu/megamenu.ts index b63b31155c5..5f9fb05bcc5 100755 --- a/src/app/components/megamenu/megamenu.ts +++ b/src/app/components/megamenu/megamenu.ts @@ -22,6 +22,7 @@ import { booleanAttribute, effect, forwardRef, + numberAttribute, signal } from '@angular/core'; import { RouterModule } from '@angular/router'; @@ -209,7 +210,7 @@ export class MegaMenuSub { @Input() ariaLabelledBy: string | undefined; - @Input() level: number = 0; + @Input({ transform: numberAttribute }) level: number = 0; @Input() focusedItemId: string | undefined; @@ -221,7 +222,7 @@ export class MegaMenuSub { @Input() submenu: any; - @Input() tabindex: number = 0; + @Input({ transform: numberAttribute }) tabindex: number = 0; @Input({ transform: booleanAttribute }) root: boolean = false; @@ -462,7 +463,7 @@ export class MegaMenu implements AfterContentInit, OnDestroy, OnInit { * Index of the element in tabbing order. * @group Props */ - @Input() tabindex: number = 0; + @Input({ transform: numberAttribute }) tabindex: number = 0; @ContentChildren(PrimeTemplate) templates: QueryList | undefined; diff --git a/src/app/components/menu/menu.ts b/src/app/components/menu/menu.ts index 1045d6133f7..85dc000a33e 100755 --- a/src/app/components/menu/menu.ts +++ b/src/app/components/menu/menu.ts @@ -25,6 +25,7 @@ import { computed, effect, forwardRef, + numberAttribute, signal } from '@angular/core'; import { DomSanitizer, SafeHtml } from '@angular/platform-browser'; @@ -278,7 +279,7 @@ export class Menu implements OnDestroy { * Base zIndex value to use in layering. * @group Props */ - @Input() baseZIndex: number = 0; + @Input({ transform: numberAttribute }) baseZIndex: number = 0; /** * Transition options of the show animation. * @group Props @@ -308,7 +309,7 @@ export class Menu implements OnDestroy { * Index of the element in tabbing order. * @group Props */ - @Input() tabindex: number = 0; + @Input({ transform: numberAttribute }) tabindex: number = 0; /** * Callback to invoke when overlay menu is shown. * @group Emits diff --git a/src/app/components/menubar/menubar.ts b/src/app/components/menubar/menubar.ts index 40b6957e5f5..8cad18623d3 100755 --- a/src/app/components/menubar/menubar.ts +++ b/src/app/components/menubar/menubar.ts @@ -22,6 +22,7 @@ import { ViewEncapsulation, booleanAttribute, effect, + numberAttribute, signal } from '@angular/core'; import { RouterModule } from '@angular/router'; @@ -215,7 +216,7 @@ export class MenubarSub implements OnInit, OnDestroy { @Input({ transform: booleanAttribute }) autoZIndex: boolean = true; - @Input() baseZIndex: number = 0; + @Input({ transform: numberAttribute }) baseZIndex: number = 0; @Input({ transform: booleanAttribute }) mobileActive: boolean | undefined; @@ -227,7 +228,7 @@ export class MenubarSub implements OnInit, OnDestroy { @Input() ariaLabelledBy: string | undefined; - @Input() level: number = 0; + @Input({ transform: numberAttribute }) level: number = 0; @Input() focusedItemId: string | undefined; @@ -440,7 +441,7 @@ export class Menubar implements AfterContentInit, OnDestroy, OnInit { * Base zIndex value to use in layering. * @group Props */ - @Input() baseZIndex: number = 0; + @Input({ transform: numberAttribute }) baseZIndex: number = 0; /** * Whether to show a root submenu on mouse over. * @defaultValue true @@ -456,7 +457,7 @@ export class Menubar implements AfterContentInit, OnDestroy, OnInit { * Delay to hide the root submenu in milliseconds when mouse leaves. * @group Props */ - @Input() autoHideDelay: number = 100; + @Input({ transform: numberAttribute }) autoHideDelay: number = 100; /** * Current id state as a string. * @group Props diff --git a/src/app/components/multiselect/multiselect.ts b/src/app/components/multiselect/multiselect.ts index 74477ea209c..da85f815b6f 100755 --- a/src/app/components/multiselect/multiselect.ts +++ b/src/app/components/multiselect/multiselect.ts @@ -18,6 +18,7 @@ import { Input, NgModule, NgZone, + numberAttribute, OnInit, Output, QueryList, @@ -100,7 +101,7 @@ export class MultiSelectItem { @Input({ transform: booleanAttribute }) disabled: boolean | undefined; - @Input() itemSize: number | undefined; + @Input({ transform: numberAttribute }) itemSize: number | undefined; @Input({ transform: booleanAttribute }) focused: boolean | undefined; @@ -466,7 +467,7 @@ export class MultiSelect implements OnInit, AfterViewInit, AfterContentInit, Aft * Index of the element in tabbing order. * @group Props */ - @Input() tabindex: number | undefined = 0; + @Input({ transform: numberAttribute }) tabindex: number | undefined = 0; /** * Target element to attach the overlay, valid values are "body" or a local ng-template variable of another element (note: use binding with brackets for template variables, e.g. [appendTo]="mydiv" for a div element having #mydiv as variable name). * @group Props @@ -513,7 +514,7 @@ export class MultiSelect implements OnInit, AfterViewInit, AfterContentInit, Aft * Decides how many selected item labels to show at most. * @group Props */ - @Input() selectionLimit: number | undefined; + @Input({ transform: numberAttribute }) selectionLimit: number | undefined; /** * Label to display after exceeding max selected labels e.g. ({0} items selected), defaults "ellipsis" keyword to indicate a text-overflow. * @group Props @@ -598,7 +599,7 @@ export class MultiSelect implements OnInit, AfterViewInit, AfterContentInit, Aft * Height of an item in the list for VirtualScrolling. * @group Props */ - @Input() virtualScrollItemSize: number | undefined; + @Input({ transform: numberAttribute }) virtualScrollItemSize: number | undefined; /** * Whether to use the scroller feature. The properties of scroller component can be used like an object in it. * @group Props diff --git a/src/app/components/orderlist/orderlist.ts b/src/app/components/orderlist/orderlist.ts index 6e8042fe1e6..6679cc6e26f 100755 --- a/src/app/components/orderlist/orderlist.ts +++ b/src/app/components/orderlist/orderlist.ts @@ -19,7 +19,8 @@ import { TemplateRef, ViewChild, ViewEncapsulation, - booleanAttribute + booleanAttribute, + numberAttribute } from '@angular/core'; import { FilterService, PrimeNGConfig, PrimeTemplate, SharedModule } from 'primeng/api'; import { ButtonModule } from 'primeng/button'; @@ -174,7 +175,7 @@ export class OrderList implements AfterViewChecked, AfterContentInit { * Index of the element in tabbing order. * @group Props */ - @Input() tabindex: number | undefined; + @Input({ transform: numberAttribute }) tabindex: number | undefined; /** * Defines a string that labels the input for accessibility. @@ -270,7 +271,7 @@ export class OrderList implements AfterViewChecked, AfterContentInit { * Function to optimize the dom operations by delegating to ngForTrackBy, default algorithm checks for object identity. * @group Props */ - @Input() trackBy: Function = (index: number, item: any) => item; + @Input({ transform: numberAttribute }) trackBy: Function = (index: number, item: any) => item; /** * A list of values that are currently selected. diff --git a/src/app/components/overlaypanel/overlaypanel.ts b/src/app/components/overlaypanel/overlaypanel.ts index c343182076b..d272d24637a 100755 --- a/src/app/components/overlaypanel/overlaypanel.ts +++ b/src/app/components/overlaypanel/overlaypanel.ts @@ -14,6 +14,7 @@ import { Input, NgModule, NgZone, + numberAttribute, OnDestroy, Output, PLATFORM_ID, @@ -146,7 +147,7 @@ export class OverlayPanel implements AfterContentInit, OnDestroy { * Base zIndex value to use in layering. * @group Props */ - @Input() baseZIndex: number = 0; + @Input({ transform: numberAttribute }) baseZIndex: number = 0; /** * When enabled, first button receives focus on show. * @group Props diff --git a/src/app/components/paginator/paginator.ts b/src/app/components/paginator/paginator.ts index e6b1e31b25b..9936bf07114 100755 --- a/src/app/components/paginator/paginator.ts +++ b/src/app/components/paginator/paginator.ts @@ -16,7 +16,8 @@ import { SimpleChanges, TemplateRef, ViewEncapsulation, - booleanAttribute + booleanAttribute, + numberAttribute } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { PrimeNGConfig, PrimeTemplate, SelectItem, SharedModule } from 'primeng/api'; @@ -167,7 +168,7 @@ export class Paginator implements OnInit, AfterContentInit, OnChanges { * Number of page links to display. * @group Props */ - @Input() pageLinkSize: number = 5; + @Input({ transform: numberAttribute }) pageLinkSize: number = 5; /** * Inline style of the component. * @group Props @@ -229,12 +230,12 @@ export class Paginator implements OnInit, AfterContentInit, OnChanges { * Number of total records. * @group Props */ - @Input() totalRecords: number = 0; + @Input({ transform: numberAttribute }) totalRecords: number = 0; /** * Data count to display per page. * @group Props */ - @Input() rows: number = 0; + @Input({ transform: numberAttribute }) rows: number = 0; /** * Array of integer/object values to display inside rows per page dropdown. A object that have 'showAll' key can be added to it to show all data. Exp; [10,20,30,{showAll:'All'}] * @group Props diff --git a/src/app/components/panelmenu/panelmenu.ts b/src/app/components/panelmenu/panelmenu.ts index 70984dacc6c..aff95febd9f 100644 --- a/src/app/components/panelmenu/panelmenu.ts +++ b/src/app/components/panelmenu/panelmenu.ts @@ -21,6 +21,7 @@ import { booleanAttribute, computed, forwardRef, + numberAttribute, signal } from '@angular/core'; import { RouterModule } from '@angular/router'; @@ -178,13 +179,13 @@ export class PanelMenuSub { @Input() itemTemplate: HTMLElement | undefined; - @Input() level: number = 0; + @Input({ transform: numberAttribute }) level: number = 0; @Input() activeItemPath: any[]; @Input({ transform: booleanAttribute }) root: boolean | undefined; - @Input() tabindex: number | undefined; + @Input({ transform: numberAttribute }) tabindex: number | undefined; @Input() transitionOptions: string | undefined; @@ -318,7 +319,7 @@ export class PanelMenuList implements OnChanges { @Input({ transform: booleanAttribute }) root: boolean | undefined; - @Input() tabindex: number | undefined; + @Input({ transform: numberAttribute }) tabindex: number | undefined; @Input() activeItem: any; @@ -874,7 +875,7 @@ export class PanelMenu implements AfterContentInit { * Index of the element in tabbing order. * @group Props */ - @Input() tabindex: number | undefined = 0; + @Input({ transform: numberAttribute }) tabindex: number | undefined = 0; @ContentChildren(PrimeTemplate) templates: QueryList | undefined; diff --git a/src/app/components/password/password.ts b/src/app/components/password/password.ts index e1537496298..655fea581db 100644 --- a/src/app/components/password/password.ts +++ b/src/app/components/password/password.ts @@ -27,7 +27,8 @@ import { ViewChild, ViewEncapsulation, booleanAttribute, - forwardRef + forwardRef, + numberAttribute } from '@angular/core'; import { NG_VALUE_ACCESSOR } from '@angular/forms'; import { OverlayService, PrimeNGConfig, PrimeTemplate, SharedModule, TranslationKeys } from 'primeng/api'; @@ -460,7 +461,7 @@ export class Password implements AfterContentInit, OnInit { * specifies the maximum number of characters allowed in the input element. * @group Props */ - @Input() maxLength: number | undefined; + @Input({ transform: numberAttribute }) maxLength: number | undefined; /** * Text for a strong password. Defaults to PrimeNG I18N API configuration. * @group Props diff --git a/src/app/components/picklist/picklist.ts b/src/app/components/picklist/picklist.ts index 611afaf1edb..4b4d1136a92 100755 --- a/src/app/components/picklist/picklist.ts +++ b/src/app/components/picklist/picklist.ts @@ -19,7 +19,8 @@ import { TemplateRef, ViewChild, ViewEncapsulation, - booleanAttribute + booleanAttribute, + numberAttribute } from '@angular/core'; import { FilterService, PrimeNGConfig, PrimeTemplate, SharedModule } from 'primeng/api'; import { ButtonModule } from 'primeng/button'; @@ -382,7 +383,7 @@ export class PickList implements AfterViewChecked, AfterContentInit { * Index of the element in tabbing order. * @group Props */ - @Input() tabindex: number | undefined = 0; + @Input({ transform: numberAttribute }) tabindex: number | undefined = 0; /** * Defines a string that labels the move to right button for accessibility. * @group Props @@ -447,7 +448,7 @@ export class PickList implements AfterViewChecked, AfterContentInit { * Function to optimize the dom operations by delegating to ngForTrackBy, default algorithm checks for object identity. Use sourceTrackBy or targetTrackBy in case different algorithms are needed per list. * @group Props */ - @Input() trackBy: Function = (index: number, item: any) => item; + @Input({ transform: numberAttribute }) trackBy: Function = (index: number, item: any) => item; /** * Function to optimize the dom operations by delegating to ngForTrackBy in source list, default algorithm checks for object identity. * @group Props diff --git a/src/app/components/progressbar/progressbar.ts b/src/app/components/progressbar/progressbar.ts index d6ea13cf232..70274c69ddd 100755 --- a/src/app/components/progressbar/progressbar.ts +++ b/src/app/components/progressbar/progressbar.ts @@ -1,5 +1,5 @@ import { CommonModule } from '@angular/common'; -import { ChangeDetectionStrategy, Component, TemplateRef, ContentChildren, Input, NgModule, ViewEncapsulation, booleanAttribute } from '@angular/core'; +import { ChangeDetectionStrategy, Component, TemplateRef, ContentChildren, Input, NgModule, ViewEncapsulation, booleanAttribute, numberAttribute } from '@angular/core'; import { PrimeTemplate } from 'primeng/api'; import { QueryList } from '@angular/core'; /** @@ -43,7 +43,7 @@ export class ProgressBar { * Current value of the progress. * @group Props */ - @Input() value: number | undefined; + @Input({ transform: numberAttribute }) value: number | undefined; /** * Whether to display the progress bar value. * @group Props diff --git a/src/app/components/radiobutton/radiobutton.ts b/src/app/components/radiobutton/radiobutton.ts index a1f3eace01f..3b6852a1cbb 100755 --- a/src/app/components/radiobutton/radiobutton.ts +++ b/src/app/components/radiobutton/radiobutton.ts @@ -1,5 +1,5 @@ import { CommonModule } from '@angular/common'; -import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter, Injectable, Injector, Input, NgModule, OnDestroy, OnInit, Output, ViewChild, booleanAttribute, forwardRef } from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter, Injectable, Injector, Input, NgModule, OnDestroy, OnInit, Output, ViewChild, booleanAttribute, forwardRef, numberAttribute } from '@angular/core'; import { ControlValueAccessor, NG_VALUE_ACCESSOR, NgControl } from '@angular/forms'; import { Nullable } from 'primeng/ts-helpers'; import { RadioButtonClickEvent } from './radiobutton.interface'; @@ -125,7 +125,7 @@ export class RadioButton implements ControlValueAccessor, OnInit, OnDestroy { * Index of the element in tabbing order. * @group Props */ - @Input() tabindex: number | undefined; + @Input({ transform: numberAttribute }) tabindex: number | undefined; /** * Identifier of the focus input to match a label defined for the component. * @group Props diff --git a/src/app/components/rating/rating.ts b/src/app/components/rating/rating.ts index 6f9d8980f52..cfeb0193fbd 100755 --- a/src/app/components/rating/rating.ts +++ b/src/app/components/rating/rating.ts @@ -1,5 +1,5 @@ import { CommonModule } from '@angular/common'; -import { booleanAttribute, ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, EventEmitter, forwardRef, Input, NgModule, OnInit, Output, QueryList, signal, TemplateRef, ViewEncapsulation } from '@angular/core'; +import { booleanAttribute, ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, EventEmitter, forwardRef, Input, NgModule, numberAttribute, OnInit, Output, QueryList, signal, TemplateRef, ViewEncapsulation } from '@angular/core'; import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; import { PrimeNGConfig, PrimeTemplate, SharedModule } from 'primeng/api'; import { BanIcon } from 'primeng/icons/ban'; @@ -102,7 +102,7 @@ export class Rating implements OnInit, ControlValueAccessor { * Number of stars. * @group Props */ - @Input() stars: number = 5; + @Input({ transform: numberAttribute }) stars: number = 5; /** * When specified a cancel icon is displayed to allow removing the value. * @group Props diff --git a/src/app/components/scrollpanel/scrollpanel.ts b/src/app/components/scrollpanel/scrollpanel.ts index 990efa1065d..ad287fa7bc0 100755 --- a/src/app/components/scrollpanel/scrollpanel.ts +++ b/src/app/components/scrollpanel/scrollpanel.ts @@ -17,7 +17,8 @@ import { Renderer2, TemplateRef, ViewChild, - ViewEncapsulation + ViewEncapsulation, + numberAttribute } from '@angular/core'; import { PrimeTemplate } from 'primeng/api'; import { DomHandler } from 'primeng/dom'; @@ -91,7 +92,7 @@ export class ScrollPanel implements AfterViewInit, AfterContentInit, OnDestroy { * Step factor to scroll the content while pressing the arrow keys. * @group Props */ - @Input() step: number = 5; + @Input({ transform: numberAttribute }) step: number = 5; @ViewChild('container') containerViewChild: ElementRef | undefined; diff --git a/src/app/components/scrolltop/scrolltop.ts b/src/app/components/scrolltop/scrolltop.ts index 6af7e45c115..17670b5516e 100755 --- a/src/app/components/scrolltop/scrolltop.ts +++ b/src/app/components/scrolltop/scrolltop.ts @@ -1,6 +1,6 @@ import { AnimationEvent, animate, state, style, transition, trigger } from '@angular/animations'; import { CommonModule, DOCUMENT, isPlatformBrowser } from '@angular/common'; -import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, ElementRef, Inject, Input, NgModule, OnDestroy, OnInit, PLATFORM_ID, QueryList, Renderer2, TemplateRef, ViewEncapsulation } from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, ElementRef, Inject, Input, NgModule, OnDestroy, OnInit, PLATFORM_ID, QueryList, Renderer2, TemplateRef, ViewEncapsulation, numberAttribute } from '@angular/core'; import { PrimeNGConfig, PrimeTemplate, SharedModule } from 'primeng/api'; import { DomHandler } from 'primeng/dom'; import { ChevronUpIcon } from 'primeng/icons/chevronup'; @@ -76,7 +76,7 @@ export class ScrollTop implements OnInit, OnDestroy { * Defines the threshold value of the vertical scroll position of the target to toggle the visibility. * @group Props */ - @Input() threshold: number = 400; + @Input({ transform: numberAttribute }) threshold: number = 400; /** * Name of the icon or JSX.Element for icon. * @group Props diff --git a/src/app/components/selectbutton/selectbutton.ts b/src/app/components/selectbutton/selectbutton.ts index 4693cc2ac3b..719622e29bb 100755 --- a/src/app/components/selectbutton/selectbutton.ts +++ b/src/app/components/selectbutton/selectbutton.ts @@ -1,5 +1,5 @@ import { CommonModule } from '@angular/common'; -import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChild, ElementRef, EventEmitter, Input, NgModule, Output, TemplateRef, ViewChild, ViewEncapsulation, booleanAttribute, forwardRef } from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChild, ElementRef, EventEmitter, Input, NgModule, Output, TemplateRef, ViewChild, ViewEncapsulation, booleanAttribute, forwardRef, numberAttribute } from '@angular/core'; import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; import { PrimeTemplate, SharedModule } from 'primeng/api'; import { RippleModule } from 'primeng/ripple'; @@ -88,7 +88,7 @@ export class SelectButton implements ControlValueAccessor { * Index of the element in tabbing order. * @group Props */ - @Input() tabindex: number = 0; + @Input({ transform: numberAttribute }) tabindex: number = 0; /** * When specified, allows selecting multiple values. * @group Props diff --git a/src/app/components/sidebar/sidebar.ts b/src/app/components/sidebar/sidebar.ts index 893c3c4faad..1f84abfd42e 100755 --- a/src/app/components/sidebar/sidebar.ts +++ b/src/app/components/sidebar/sidebar.ts @@ -18,7 +18,8 @@ import { Renderer2, TemplateRef, ViewEncapsulation, - booleanAttribute + booleanAttribute, + numberAttribute } from '@angular/core'; import { PrimeNGConfig, PrimeTemplate, SharedModule } from 'primeng/api'; import { DomHandler } from 'primeng/dom'; @@ -138,7 +139,7 @@ export class Sidebar implements AfterViewInit, AfterContentInit, OnDestroy { * Base zIndex value to use in layering. * @group Props */ - @Input() baseZIndex: number = 0; + @Input({ transform: numberAttribute }) baseZIndex: number = 0; /** * Whether an overlay mask is displayed behind the sidebar. * @group Props diff --git a/src/app/components/slidemenu/slidemenu.ts b/src/app/components/slidemenu/slidemenu.ts index b1e54a267ec..bb8af66a637 100755 --- a/src/app/components/slidemenu/slidemenu.ts +++ b/src/app/components/slidemenu/slidemenu.ts @@ -24,6 +24,7 @@ import { booleanAttribute, effect, forwardRef, + numberAttribute, signal } from '@angular/core'; import { RouterModule } from '@angular/router'; @@ -195,7 +196,7 @@ import { CaretLeftIcon } from 'primeng/icons/caretleft'; export class SlideMenuSub { @Input() items: any[]; - @Input() menuWidth: number; + @Input({ transform: numberAttribute }) menuWidth: number; @Input({ transform: booleanAttribute }) root: boolean | undefined = false; @@ -207,7 +208,7 @@ export class SlideMenuSub { @Input({ transform: booleanAttribute }) autoZIndex: boolean = true; - @Input() baseZIndex: number = 0; + @Input({ transform: numberAttribute }) baseZIndex: number = 0; @Input({ transform: booleanAttribute }) popup: boolean | undefined; @@ -217,13 +218,13 @@ export class SlideMenuSub { @Input() ariaLabelledBy: string | undefined; - @Input() level: number = 0; + @Input({ transform: numberAttribute }) level: number = 0; @Input() focusedItemId: string | undefined; @Input() activeItemPath: any[]; - @Input() tabindex: number = 0; + @Input({ transform: numberAttribute }) tabindex: number = 0; @Output() itemClick: EventEmitter = new EventEmitter(); @@ -395,17 +396,17 @@ export class SlideMenu implements OnInit, AfterContentInit, OnDestroy { * Width of the submenus. * @group Props */ - @Input() menuWidth: number = 190; + @Input({ transform: numberAttribute }) menuWidth: number = 190; /** * Height of the scrollable area, a scrollbar appears if a menu height is longer than this value. * @group Props */ - @Input() viewportHeight: number = 180; + @Input({ transform: numberAttribute }) viewportHeight: number = 180; /** * Duration of the sliding animation in milliseconds. * @group Props */ - @Input() effectDuration: any = 250; + @Input({ transform: numberAttribute }) effectDuration: any = 250; /** * Easing animation to use for sliding. * @group Props @@ -425,7 +426,7 @@ export class SlideMenu implements OnInit, AfterContentInit, OnDestroy { * Index of the element in tabbing order. * @group Props */ - @Input() tabindex: number = 0; + @Input({ transform: numberAttribute }) tabindex: number = 0; /** * Defines if menu would displayed as a popup. * @group Props @@ -455,7 +456,7 @@ export class SlideMenu implements OnInit, AfterContentInit, OnDestroy { * Base zIndex value to use in layering. * @group Props */ - @Input() baseZIndex: number = 0; + @Input({ transform: numberAttribute }) baseZIndex: number = 0; /** * Whether to show a root submenu on mouse over. * @defaultValue true diff --git a/src/app/components/slider/slider.ts b/src/app/components/slider/slider.ts index d41fd3993d4..76baa4a47a4 100755 --- a/src/app/components/slider/slider.ts +++ b/src/app/components/slider/slider.ts @@ -1,5 +1,24 @@ import { CommonModule, DOCUMENT, isPlatformBrowser } from '@angular/common'; -import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter, Inject, Input, NgModule, NgZone, OnDestroy, Output, PLATFORM_ID, Renderer2, ViewChild, ViewEncapsulation, booleanAttribute, forwardRef } from '@angular/core'; +import { + ChangeDetectionStrategy, + ChangeDetectorRef, + Component, + ElementRef, + EventEmitter, + Inject, + Input, + NgModule, + NgZone, + OnDestroy, + Output, + PLATFORM_ID, + Renderer2, + ViewChild, + ViewEncapsulation, + booleanAttribute, + forwardRef, + numberAttribute +} from '@angular/core'; import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; import { DomHandler } from 'primeng/dom'; import { Nullable, VoidListener } from 'primeng/ts-helpers'; @@ -128,12 +147,12 @@ export class Slider implements OnDestroy, ControlValueAccessor { * Mininum boundary value. * @group Props */ - @Input() min: number = 0; + @Input({ transform: numberAttribute }) min: number = 0; /** * Maximum boundary value. * @group Props */ - @Input() max: number = 100; + @Input({ transform: numberAttribute }) max: number = 100; /** * Orientation of the slider. * @group Props @@ -143,7 +162,7 @@ export class Slider implements OnDestroy, ControlValueAccessor { * Step factor to increment/decrement the value. * @group Props */ - @Input() step: number | undefined; + @Input({ transform: numberAttribute }) step: number | undefined; /** * When specified, allows two boundary values to be picked. * @group Props @@ -173,7 +192,7 @@ export class Slider implements OnDestroy, ControlValueAccessor { * Index of the element in tabbing order. * @group Props */ - @Input() tabindex: number = 0; + @Input({ transform: numberAttribute }) tabindex: number = 0; /** * Callback to invoke on value change. * @param {SliderChangeEvent} event - Custom value change event. diff --git a/src/app/components/speeddial/speeddial.ts b/src/app/components/speeddial/speeddial.ts index ccf4afeb610..ec06f17fa50 100644 --- a/src/app/components/speeddial/speeddial.ts +++ b/src/app/components/speeddial/speeddial.ts @@ -20,6 +20,7 @@ import { ViewChild, ViewEncapsulation, booleanAttribute, + numberAttribute, signal } from '@angular/core'; import { RouterModule } from '@angular/router'; @@ -187,7 +188,7 @@ export class SpeedDial implements AfterViewInit, AfterContentInit, OnDestroy { * Transition delay step for each action item. * @group Props */ - @Input() transitionDelay: number = 30; + @Input({ transform: numberAttribute }) transitionDelay: number = 30; /** * Specifies the opening type of actions. * @group Props @@ -197,7 +198,7 @@ export class SpeedDial implements AfterViewInit, AfterContentInit, OnDestroy { * Radius for *circle types. * @group Props */ - @Input() radius: number = 0; + @Input({ transform: numberAttribute }) radius: number = 0; /** * Whether to show a mask element behind the speeddial. * @group Props diff --git a/src/app/components/spinner/spinner.ts b/src/app/components/spinner/spinner.ts index 943e5072edf..6cae652a2ce 100755 --- a/src/app/components/spinner/spinner.ts +++ b/src/app/components/spinner/spinner.ts @@ -1,4 +1,4 @@ -import { NgModule, Component, ElementRef, OnInit, Input, Output, EventEmitter, forwardRef, ViewChild, ChangeDetectorRef, ChangeDetectionStrategy, ViewEncapsulation, booleanAttribute } from '@angular/core'; +import { NgModule, Component, ElementRef, OnInit, Input, Output, EventEmitter, forwardRef, ViewChild, ChangeDetectorRef, ChangeDetectionStrategy, ViewEncapsulation, booleanAttribute, numberAttribute } from '@angular/core'; import { CommonModule } from '@angular/common'; import { InputTextModule } from 'primeng/inputtext'; import { NG_VALUE_ACCESSOR, ControlValueAccessor } from '@angular/forms'; @@ -82,13 +82,13 @@ export class Spinner implements OnInit, ControlValueAccessor { @Output() onBlur: EventEmitter = new EventEmitter(); - @Input() min: number; + @Input({ transform: numberAttribute }) min: number; - @Input() max: number; + @Input({ transform: numberAttribute }) max: number; - @Input() maxlength: number; + @Input({ transform: numberAttribute }) maxlength: number; - @Input() size: number; + @Input({ transform: numberAttribute }) size: number; @Input() placeholder: string; @@ -98,7 +98,7 @@ export class Spinner implements OnInit, ControlValueAccessor { @Input({ transform: booleanAttribute }) readonly: boolean; - @Input() tabindex: number; + @Input({ transform: numberAttribute }) tabindex: number; @Input({ transform: booleanAttribute }) required: boolean; @@ -116,7 +116,7 @@ export class Spinner implements OnInit, ControlValueAccessor { @Input() thousandSeparator: string; - @Input() precision: number; + @Input({ transform: numberAttribute }) precision: number; value: any; diff --git a/src/app/components/splitbutton/splitbutton.ts b/src/app/components/splitbutton/splitbutton.ts index 68299b059ac..4f4d95efc8d 100755 --- a/src/app/components/splitbutton/splitbutton.ts +++ b/src/app/components/splitbutton/splitbutton.ts @@ -1,5 +1,5 @@ import { CommonModule } from '@angular/common'; -import { ChangeDetectionStrategy, Component, ContentChildren, ElementRef, EventEmitter, Input, NgModule, Output, QueryList, TemplateRef, ViewChild, ViewEncapsulation, booleanAttribute, signal } from '@angular/core'; +import { ChangeDetectionStrategy, Component, ContentChildren, ElementRef, EventEmitter, Input, NgModule, Output, QueryList, TemplateRef, ViewChild, ViewEncapsulation, booleanAttribute, numberAttribute, signal } from '@angular/core'; import { MenuItem, PrimeTemplate } from 'primeng/api'; import { ButtonModule } from 'primeng/button'; import { ChevronDownIcon } from 'primeng/icons/chevrondown'; @@ -131,7 +131,7 @@ export class SplitButton { * Index of the element in tabbing order. * @group Prop */ - @Input() tabindex: number | undefined; + @Input({ transform: numberAttribute }) tabindex: number | undefined; /** * Target element to attach the overlay, valid values are "body" or a local ng-template variable of another element (note: use binding with brackets for template variables, e.g. [appendTo]="mydiv" for a div element having #mydiv as variable name). * @group Props diff --git a/src/app/components/splitter/splitter.ts b/src/app/components/splitter/splitter.ts index f12423ea91c..1cddaa761d6 100755 --- a/src/app/components/splitter/splitter.ts +++ b/src/app/components/splitter/splitter.ts @@ -1,5 +1,5 @@ import { CommonModule, DOCUMENT, isPlatformBrowser } from '@angular/common'; -import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, ElementRef, EventEmitter, Inject, Input, NgModule, Output, PLATFORM_ID, QueryList, Renderer2, ViewChild, ViewEncapsulation } from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, ElementRef, EventEmitter, Inject, Input, NgModule, Output, PLATFORM_ID, QueryList, Renderer2, ViewChild, ViewEncapsulation, numberAttribute } from '@angular/core'; import { PrimeTemplate, SharedModule } from 'primeng/api'; import { DomHandler } from 'primeng/dom'; import { Nullable, VoidListener } from 'primeng/ts-helpers'; @@ -90,17 +90,17 @@ export class Splitter { * Size of the divider in pixels. * @group Props */ - @Input() gutterSize: number = 4; + @Input({ transform: numberAttribute }) gutterSize: number = 4; /** * Step factor to increment/decrement the size of the panels while pressing the arrow keys. * @group Props */ - @Input() step: number = 5; + @Input({ transform: numberAttribute }) step: number = 5; /** * Minimum size of the elements relative to 100%. * @group Props */ - @Input() minSizes: number[] = []; + @Input({ transform: numberAttribute }) minSizes: number[] = []; /** * Size of the elements relative to 100%. * @group Props diff --git a/src/app/components/steps/steps.ts b/src/app/components/steps/steps.ts index da2766bae2f..b85b1233b1c 100755 --- a/src/app/components/steps/steps.ts +++ b/src/app/components/steps/steps.ts @@ -1,5 +1,5 @@ import { CommonModule } from '@angular/common'; -import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter, Input, NgModule, OnDestroy, OnInit, Output, ViewChild, ViewEncapsulation, booleanAttribute } from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter, Input, NgModule, OnDestroy, OnInit, Output, ViewChild, ViewEncapsulation, booleanAttribute, numberAttribute } from '@angular/core'; import { ActivatedRoute, Router, RouterModule } from '@angular/router'; import { DomHandler } from 'primeng/dom'; import { Nullable } from 'primeng/ts-helpers'; @@ -91,7 +91,7 @@ export class Steps implements OnInit, OnDestroy { * Index of the active item. * @group Props */ - @Input() activeIndex: number = 0; + @Input({ transform: numberAttribute }) activeIndex: number = 0; /** * An array of menu items. * @group Props diff --git a/src/app/components/table/table.ts b/src/app/components/table/table.ts index 3c10dd61bcf..8ad4276301e 100644 --- a/src/app/components/table/table.ts +++ b/src/app/components/table/table.ts @@ -17,6 +17,7 @@ import { Input, NgModule, NgZone, + numberAttribute, OnChanges, OnDestroy, OnInit, @@ -369,7 +370,7 @@ export class Table implements OnInit, AfterViewInit, AfterContentInit, Blockable * Number of page links to display in paginator. * @group Props */ - @Input() pageLinks: number = 5; + @Input({ transform: numberAttribute }) pageLinks: number = 5; /** * Array of integer/object values to display inside rows per page dropdown of paginator * @group Props @@ -434,7 +435,7 @@ export class Table implements OnInit, AfterViewInit, AfterContentInit, Blockable * Sort order to use when an unsorted column gets sorted by user interaction. * @group Props */ - @Input() defaultSortOrder: number = 1; + @Input({ transform: numberAttribute }) defaultSortOrder: number = 1; /** * Defines whether sorting works on single column or on multiple columns. * @group Props @@ -490,7 +491,7 @@ export class Table implements OnInit, AfterViewInit, AfterContentInit, Blockable * Function to optimize the dom operations by delegating to ngForTrackBy, default algorithm checks for object identity. * @group Props */ - @Input() rowTrackBy: Function = (index: number, item: any) => item; + @Input({ transform: numberAttribute }) rowTrackBy: Function = (index: number, item: any) => item; /** * Defines if data is loaded and interacted with in lazy manner. * @group Props @@ -530,7 +531,7 @@ export class Table implements OnInit, AfterViewInit, AfterContentInit, Blockable * Delay in milliseconds before filtering the data. * @group Props */ - @Input() filterDelay: number = 300; + @Input({ transform: numberAttribute }) filterDelay: number = 300; /** * Locale to use in filtering. The default locale is the host environment's current locale. * @group Props @@ -581,7 +582,7 @@ export class Table implements OnInit, AfterViewInit, AfterContentInit, Blockable * Height of a row to use in calculations of virtual scrolling. * @group Props */ - @Input() virtualScrollItemSize: number | undefined; + @Input({ transform: numberAttribute }) virtualScrollItemSize: number | undefined; /** * Whether to use the scroller feature. The properties of scroller component can be used like an object in it. * @group Props @@ -591,7 +592,7 @@ export class Table implements OnInit, AfterViewInit, AfterContentInit, Blockable * Threshold in milliseconds to delay lazy loading during scrolling. * @group Props */ - @Input() virtualScrollDelay: number = 250; + @Input({ transform: numberAttribute }) virtualScrollDelay: number = 250; /** * Width of the frozen columns container. * @group Props @@ -699,7 +700,7 @@ export class Table implements OnInit, AfterViewInit, AfterContentInit, Blockable * Order to sort when default row grouping is enabled. * @group Props */ - @Input() groupRowsByOrder: number = 1; + @Input({ transform: numberAttribute }) groupRowsByOrder: number = 1; /** * Defines the responsive mode, valid options are "stack" and "scroll". * @group Props @@ -4531,7 +4532,7 @@ export class TableRadioButton { @Input() value: any; - @Input() index: number | undefined; + @Input({ transform: numberAttribute }) index: number | undefined; @Input() inputId: string | undefined; @@ -4628,7 +4629,7 @@ export class TableCheckbox { @Input() value: any; - @Input() index: number | undefined; + @Input({ transform: numberAttribute }) index: number | undefined; @Input() inputId: string | undefined; @@ -5133,17 +5134,17 @@ export class ColumnFilter implements AfterContentInit { * Defines maximum amount of constraints. * @group Props */ - @Input() maxConstraints: number = 2; + @Input({ transform: numberAttribute }) maxConstraints: number = 2; /** * Defines minimum fraction of digits. * @group Props */ - @Input() minFractionDigits: number | undefined; + @Input({ transform: numberAttribute }) minFractionDigits: number | undefined; /** * Defines maximum fraction of digits. * @group Props */ - @Input() maxFractionDigits: number | undefined; + @Input({ transform: numberAttribute }) maxFractionDigits: number | undefined; /** * Defines prefix of the filter. * @group Props @@ -5756,9 +5757,9 @@ export class ColumnFilterFormElement implements OnInit { @Input() placeholder: string | undefined; - @Input() minFractionDigits: number | undefined; + @Input({ transform: numberAttribute }) minFractionDigits: number | undefined; - @Input() maxFractionDigits: number | undefined; + @Input({ transform: numberAttribute }) maxFractionDigits: number | undefined; @Input() prefix: string | undefined; diff --git a/src/app/components/tabview/tabview.ts b/src/app/components/tabview/tabview.ts index 38d97ff75df..ceabfd8363c 100755 --- a/src/app/components/tabview/tabview.ts +++ b/src/app/components/tabview/tabview.ts @@ -23,6 +23,7 @@ import { ViewEncapsulation, booleanAttribute, forwardRef, + numberAttribute, signal } from '@angular/core'; import { BlockableUI, PrimeTemplate, SharedModule } from 'primeng/api'; @@ -426,7 +427,7 @@ export class TabView implements AfterContentInit, AfterViewChecked, OnDestroy, B * Index of the element in tabbing order. * @group Props */ - @Input() tabindex: number = 0; + @Input({ transform: numberAttribute }) tabindex: number = 0; /** * Callback to invoke on tab change. * @param {TabViewChangeEvent} event - Custom tab change event diff --git a/src/app/components/tieredmenu/tieredmenu.ts b/src/app/components/tieredmenu/tieredmenu.ts index b5d9c6132d0..5526505f76d 100755 --- a/src/app/components/tieredmenu/tieredmenu.ts +++ b/src/app/components/tieredmenu/tieredmenu.ts @@ -24,6 +24,7 @@ import { booleanAttribute, effect, forwardRef, + numberAttribute, signal } from '@angular/core'; import { RouterModule } from '@angular/router'; @@ -202,7 +203,7 @@ export class TieredMenuSub { @Input({ transform: booleanAttribute }) autoZIndex: boolean = true; - @Input() baseZIndex: number = 0; + @Input({ transform: numberAttribute }) baseZIndex: number = 0; @Input({ transform: booleanAttribute }) popup: boolean | undefined; @@ -212,13 +213,13 @@ export class TieredMenuSub { @Input() ariaLabelledBy: string | undefined; - @Input() level: number = 0; + @Input({ transform: numberAttribute }) level: number = 0; @Input() focusedItemId: string | undefined; @Input() activeItemPath: any[]; - @Input() tabindex: number = 0; + @Input({ transform: numberAttribute }) tabindex: number = 0; @Output() itemClick: EventEmitter = new EventEmitter(); @@ -420,7 +421,7 @@ export class TieredMenu implements OnInit, AfterContentInit, OnDestroy { * Base zIndex value to use in layering. * @group Props */ - @Input() baseZIndex: number = 0; + @Input({ transform: numberAttribute }) baseZIndex: number = 0; /** * Whether to show a root submenu on mouse over. * @defaultValue true @@ -461,7 +462,7 @@ export class TieredMenu implements OnInit, AfterContentInit, OnDestroy { * Index of the element in tabbing order. * @group Props */ - @Input() tabindex: number = 0; + @Input({ transform: numberAttribute }) tabindex: number = 0; /** * Callback to invoke when overlay menu is shown. * @group Emits diff --git a/src/app/components/toast/toast.ts b/src/app/components/toast/toast.ts index 60247182af6..04071f81189 100755 --- a/src/app/components/toast/toast.ts +++ b/src/app/components/toast/toast.ts @@ -21,7 +21,8 @@ import { TemplateRef, ViewChild, ViewEncapsulation, - booleanAttribute + booleanAttribute, + numberAttribute } from '@angular/core'; import { Message, MessageService, PrimeNGConfig, PrimeTemplate, SharedModule } from 'primeng/api'; import { CheckIcon } from 'primeng/icons/check'; @@ -126,9 +127,9 @@ import { ToastCloseEvent, ToastItemCloseEvent, ToastPositionType } from './toast export class ToastItem implements AfterViewInit, OnDestroy { @Input() message: Message | null | undefined; - @Input() index: number | null | undefined; + @Input({ transform: numberAttribute }) index: number | null | undefined; - @Input() life: number; + @Input({ transform: numberAttribute }) life: number; @Input() template: TemplateRef | undefined; @@ -251,12 +252,12 @@ export class Toast implements OnInit, AfterContentInit, OnDestroy { * Base zIndex value to use in layering. * @group Props */ - @Input() baseZIndex: number = 0; + @Input({ transform: numberAttribute }) baseZIndex: number = 0; /** * The default time to display messages for in milliseconds. * @group Props */ - @Input() life: number = 3000; + @Input({ transform: numberAttribute }) life: number = 3000; /** * Inline style of the component. * @group Props diff --git a/src/app/components/togglebutton/togglebutton.ts b/src/app/components/togglebutton/togglebutton.ts index 602a1d9c0bb..534b92cd53b 100755 --- a/src/app/components/togglebutton/togglebutton.ts +++ b/src/app/components/togglebutton/togglebutton.ts @@ -1,5 +1,5 @@ import { CommonModule } from '@angular/common'; -import { booleanAttribute, ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, EventEmitter, forwardRef, Input, NgModule, Output, QueryList, TemplateRef } from '@angular/core'; +import { booleanAttribute, ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, EventEmitter, forwardRef, Input, NgModule, numberAttribute, Output, QueryList, TemplateRef } from '@angular/core'; import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; import { RippleModule } from 'primeng/ripple'; import { ToggleButtonChangeEvent } from './togglebutton.interface'; @@ -110,7 +110,7 @@ export class ToggleButton implements ControlValueAccessor { * Index of the element in tabbing order. * @group Props */ - @Input() tabindex: number | undefined = 0; + @Input({ transform: numberAttribute }) tabindex: number | undefined = 0; /** * Position of the icon. * @group Props diff --git a/src/app/components/tooltip/tooltip.ts b/src/app/components/tooltip/tooltip.ts index a0ee27fe875..043a70a7bc1 100755 --- a/src/app/components/tooltip/tooltip.ts +++ b/src/app/components/tooltip/tooltip.ts @@ -1,5 +1,5 @@ import { CommonModule, isPlatformBrowser } from '@angular/common'; -import { AfterViewInit, Directive, ElementRef, HostListener, Inject, Input, NgModule, NgZone, OnDestroy, PLATFORM_ID, Renderer2, SimpleChanges, TemplateRef, ViewContainerRef, booleanAttribute } from '@angular/core'; +import { AfterViewInit, Directive, ElementRef, HostListener, Inject, Input, NgModule, NgZone, OnDestroy, PLATFORM_ID, Renderer2, SimpleChanges, TemplateRef, ViewContainerRef, booleanAttribute, numberAttribute } from '@angular/core'; import { PrimeNGConfig, TooltipOptions } from 'primeng/api'; import { ConnectedOverlayScrollHandler, DomHandler } from 'primeng/dom'; import { Nullable } from 'primeng/ts-helpers'; @@ -55,27 +55,27 @@ export class Tooltip implements AfterViewInit, OnDestroy { * Delay to show the tooltip in milliseconds. * @group Props */ - @Input() showDelay: number | undefined; + @Input({ transform: numberAttribute }) showDelay: number | undefined; /** * Delay to hide the tooltip in milliseconds. * @group Props */ - @Input() hideDelay: number | undefined; + @Input({ transform: numberAttribute }) hideDelay: number | undefined; /** * Time to wait in milliseconds to hide the tooltip even it is active. * @group Props */ - @Input() life: number | undefined; + @Input({ transform: numberAttribute }) life: number | undefined; /** * Specifies the additional vertical offset of the tooltip from its default position. * @group Props */ - @Input() positionTop: number | undefined; + @Input({ transform: numberAttribute }) positionTop: number | undefined; /** * Specifies the additional horizontal offset of the tooltip from its default position. * @group Props */ - @Input() positionLeft: number | undefined; + @Input({ transform: numberAttribute }) positionLeft: number | undefined; /** * Whether to hide tooltip when hovering over tooltip content. * @group Props diff --git a/src/app/components/tree/tree.ts b/src/app/components/tree/tree.ts index fcdda4358e2..2ecac995b13 100755 --- a/src/app/components/tree/tree.ts +++ b/src/app/components/tree/tree.ts @@ -12,6 +12,7 @@ import { Inject, Input, NgModule, + numberAttribute, OnChanges, OnDestroy, OnInit, @@ -213,17 +214,17 @@ export class UITreeNode implements OnInit { @Input({ transform: booleanAttribute }) root: boolean | undefined; - @Input() index: number | undefined; + @Input({ transform: numberAttribute }) index: number | undefined; @Input({ transform: booleanAttribute }) firstChild: boolean | undefined; @Input({ transform: booleanAttribute }) lastChild: boolean | undefined; - @Input() level: number | undefined; + @Input({ transform: numberAttribute }) level: number | undefined; - @Input() indentation: number | undefined; + @Input({ transform: numberAttribute }) indentation: number | undefined; - @Input() itemSize: number | undefined; + @Input({ transform: numberAttribute }) itemSize: number | undefined; tree: Tree; @@ -983,7 +984,7 @@ export class Tree implements OnInit, AfterContentInit, OnChanges, OnDestroy, Blo * Height of an item in the list for VirtualScrolling. * @group Props */ - @Input() virtualScrollItemSize: number | undefined; + @Input({ transform: numberAttribute }) virtualScrollItemSize: number | undefined; /** * Whether to use the scroller feature. The properties of scroller component can be used like an object in it. * @group Props @@ -993,7 +994,7 @@ export class Tree implements OnInit, AfterContentInit, OnChanges, OnDestroy, Blo * Indentation factor for spacing of the nested node when virtual scrolling is enabled. * @group Props */ - @Input() indentation: number = 1.5; + @Input({ transform: numberAttribute }) indentation: number = 1.5; /** * Custom templates of the component. * @group Props @@ -1003,7 +1004,7 @@ export class Tree implements OnInit, AfterContentInit, OnChanges, OnDestroy, Blo * Function to optimize the node list rendering, default algorithm checks for object identity. * @group Props */ - @Input() trackBy: Function = (index: number, item: any) => item; + @Input({ transform: numberAttribute }) trackBy: Function = (index: number, item: any) => item; /** * Height of the node. * @group Props diff --git a/src/app/components/treetable/treetable.ts b/src/app/components/treetable/treetable.ts index bb35271b892..1e507ef133c 100755 --- a/src/app/components/treetable/treetable.ts +++ b/src/app/components/treetable/treetable.ts @@ -26,7 +26,8 @@ import { TemplateRef, ViewChild, ViewEncapsulation, - booleanAttribute + booleanAttribute, + numberAttribute } from '@angular/core'; import { BlockableUI, FilterMetadata, FilterService, PrimeNGConfig, PrimeTemplate, ScrollerOptions, SharedModule, SortMeta, TreeNode, TreeTableNode } from 'primeng/api'; import { DomHandler } from 'primeng/dom'; @@ -306,17 +307,17 @@ export class TreeTable implements AfterContentInit, OnInit, OnDestroy, Blockable * Number of rows to display per page. * @group Props */ - @Input() rows: number | undefined; + @Input({ transform: numberAttribute }) rows: number | undefined; /** * Index of the first row to be displayed. * @group Props */ - @Input() first: number = 0; + @Input({ transform: numberAttribute }) first: number = 0; /** * Number of page links to display in paginator. * @group Props */ - @Input() pageLinks: number = 5; + @Input({ transform: numberAttribute }) pageLinks: number = 5; /** * Array of integer/object values to display inside rows per page dropdown of paginator * @group Props @@ -371,7 +372,7 @@ export class TreeTable implements AfterContentInit, OnInit, OnDestroy, Blockable * Sort order to use when an unsorted column gets sorted by user interaction. * @group Props */ - @Input() defaultSortOrder: number = 1; + @Input({ transform: numberAttribute }) defaultSortOrder: number = 1; /** * Defines whether sorting works on single column or on multiple columns. * @group Props @@ -456,7 +457,7 @@ export class TreeTable implements AfterContentInit, OnInit, OnDestroy, Blockable * Height of a row to use in calculations of virtual scrolling. * @group Props */ - @Input() virtualScrollItemSize: number | undefined; + @Input({ transform: numberAttribute }) virtualScrollItemSize: number | undefined; /** * Whether to use the scroller feature. The properties of scroller component can be used like an object in it. * @group Props @@ -466,7 +467,7 @@ export class TreeTable implements AfterContentInit, OnInit, OnDestroy, Blockable * The delay (in milliseconds) before triggering the virtual scroll. This determines the time gap between the user's scroll action and the actual rendering of the next set of items in the virtual scroll. * @group Props */ - @Input() virtualScrollDelay: number = 150; + @Input({ transform: numberAttribute }) virtualScrollDelay: number = 150; /** * Width of the frozen columns container. * @group Props @@ -501,7 +502,7 @@ export class TreeTable implements AfterContentInit, OnInit, OnDestroy, Blockable * Function to optimize the dom operations by delegating to ngForTrackBy, default algorithm checks for object identity. * @group Props */ - @Input() rowTrackBy: Function = (index: number, item: any) => item; + @Input({ transform: numberAttribute }) rowTrackBy: Function = (index: number, item: any) => item; /** * An array of FilterMetadata objects to provide external filters. * @group Props @@ -516,7 +517,7 @@ export class TreeTable implements AfterContentInit, OnInit, OnDestroy, Blockable * Delay in milliseconds before filtering the data. * @group Props */ - @Input() filterDelay: number = 300; + @Input({ transform: numberAttribute }) filterDelay: number = 300; /** * Mode for filtering valid values are "lenient" and "strict". Default is lenient. * @group Props diff --git a/src/app/components/tristatecheckbox/tristatecheckbox.ts b/src/app/components/tristatecheckbox/tristatecheckbox.ts index dda1f819ec4..6f0732176ce 100755 --- a/src/app/components/tristatecheckbox/tristatecheckbox.ts +++ b/src/app/components/tristatecheckbox/tristatecheckbox.ts @@ -1,5 +1,5 @@ import { CommonModule } from '@angular/common'; -import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, EventEmitter, Input, NgModule, Output, QueryList, TemplateRef, ViewEncapsulation, booleanAttribute, forwardRef } from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, EventEmitter, Input, NgModule, Output, QueryList, TemplateRef, ViewEncapsulation, booleanAttribute, forwardRef, numberAttribute } from '@angular/core'; import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; import { PrimeTemplate, SharedModule } from 'primeng/api'; import { CheckIcon } from 'primeng/icons/check'; @@ -101,7 +101,7 @@ export class TriStateCheckbox implements ControlValueAccessor { * Index of the element in tabbing order. * @group Props */ - @Input() tabindex: number | undefined; + @Input({ transform: numberAttribute }) tabindex: number | undefined; /** * Identifier of the focus input to match a label defined for the component. * @group Props diff --git a/src/app/components/virtualscroller/virtualscroller.ts b/src/app/components/virtualscroller/virtualscroller.ts index 13e6c007ad5..14d26993a90 100755 --- a/src/app/components/virtualscroller/virtualscroller.ts +++ b/src/app/components/virtualscroller/virtualscroller.ts @@ -15,7 +15,8 @@ import { TemplateRef, ViewChild, ViewEncapsulation, - booleanAttribute + booleanAttribute, + numberAttribute } from '@angular/core'; import { BlockableUI, Footer, Header, PrimeTemplate, ScrollerOptions, SharedModule } from 'primeng/api'; import { Scroller, ScrollerModule } from 'primeng/scroller'; @@ -64,7 +65,7 @@ export class VirtualScroller implements AfterContentInit, BlockableUI { * Height of an item in the list. * @group Props */ - @Input() itemSize: number | undefined; + @Input({ transform: numberAttribute }) itemSize: number | undefined; /** * Inline style of the component. * @group Props @@ -94,7 +95,7 @@ export class VirtualScroller implements AfterContentInit, BlockableUI { * Threshold in milliseconds to delay lazy loading during scrolling. * @group Props */ - @Input() delay: number = 250; + @Input({ transform: numberAttribute }) delay: number = 250; /** * Callback to invoke in lazy mode to load new data. * @param {VirtualScrollerLazyLoadEvent} event - custom lazy load event. diff --git a/src/app/showcase/layout/doc/app.docapitable.component.ts b/src/app/showcase/layout/doc/app.docapitable.component.ts index 03b23cf0d66..61a524883c9 100644 --- a/src/app/showcase/layout/doc/app.docapitable.component.ts +++ b/src/app/showcase/layout/doc/app.docapitable.component.ts @@ -1,5 +1,5 @@ import { Location } from '@angular/common'; -import { ChangeDetectionStrategy, Component, Input, ViewContainerRef, booleanAttribute } from '@angular/core'; +import { ChangeDetectionStrategy, Component, Input, ViewContainerRef, booleanAttribute, numberAttribute } from '@angular/core'; import { Router } from '@angular/router'; import { AppConfigService } from '../../service/appconfigservice'; @@ -102,7 +102,7 @@ export class AppDocApiTable { @Input() parentId: string; - @Input() level: number; + @Input({ transform: numberAttribute }) level: number; @Input({ transform: booleanAttribute }) isInterface: boolean = false; diff --git a/src/app/showcase/layout/doc/app.docsectiontext.component.ts b/src/app/showcase/layout/doc/app.docsectiontext.component.ts index 639cacc473d..cc33c0c81a6 100644 --- a/src/app/showcase/layout/doc/app.docsectiontext.component.ts +++ b/src/app/showcase/layout/doc/app.docsectiontext.component.ts @@ -1,5 +1,5 @@ import { Location } from '@angular/common'; -import { Component, ElementRef, Input } from '@angular/core'; +import { Component, ElementRef, Input, numberAttribute } from '@angular/core'; @Component({ selector: 'app-docsectiontext', @@ -25,7 +25,7 @@ export class AppDocSectionTextComponent { @Input() id!: string; - @Input() level!: number; + @Input({ transform: numberAttribute }) level!: number; @Input() label!: string;