primeng 17.0.0 → 17.1.0

package/resources/themes/tailwind-light/theme.css

@@ -897,6 +897,10 @@
     margin-left: 0.5rem;
   }
 
+  p-tristatecheckbox.ng-dirty.ng-invalid > .p-checkbox > .p-checkbox-box {
+    border-color: #f0a9a7;
+  }
+
   .p-chips:not(.p-disabled):hover .p-chips-multiple-container {
     border-color: #d4d4d8;
   }
@@ -1088,6 +1092,10 @@
     background-color: transparent;
   }
 
+  p-dropdown.ng-dirty.ng-invalid > .p-dropdown {
+    border-color: #f0a9a7;
+  }
+
   .p-inputgroup-addon {
     background: #fafafa;
     color: #71717a;
@@ -1232,7 +1240,7 @@
     background: #4338ca;
   }
 
-  p-inputswitch.ng-dirty.ng-invalid > .p-inputswitch {
+  p-inputswitch.ng-dirty.ng-invalid > .p-inputswitch > .p-inputswitch-slider {
     border-color: #f0a9a7;
   }
 

package/resources/themes/vela-blue/theme.css

@@ -861,6 +861,10 @@
     margin-left: 0.5rem;
   }
 
+  p-tristatecheckbox.ng-dirty.ng-invalid > .p-checkbox > .p-checkbox-box {
+    border-color: #ef9a9a;
+  }
+
   .p-chips:not(.p-disabled):hover .p-chips-multiple-container {
     border-color: #64B5F6;
   }
@@ -1052,6 +1056,10 @@
     background-color: transparent;
   }
 
+  p-dropdown.ng-dirty.ng-invalid > .p-dropdown {
+    border-color: #ef9a9a;
+  }
+
   .p-inputgroup-addon {
     background: #1f2d40;
     color: rgba(255, 255, 255, 0.6);
@@ -1196,7 +1204,7 @@
     background: #43a5f4;
   }
 
-  p-inputswitch.ng-dirty.ng-invalid > .p-inputswitch {
+  p-inputswitch.ng-dirty.ng-invalid > .p-inputswitch > .p-inputswitch-slider {
     border-color: #ef9a9a;
   }
 

package/resources/themes/vela-green/theme.css

@@ -861,6 +861,10 @@
     margin-left: 0.5rem;
   }
 
+  p-tristatecheckbox.ng-dirty.ng-invalid > .p-checkbox > .p-checkbox-box {
+    border-color: #ef9a9a;
+  }
+
   .p-chips:not(.p-disabled):hover .p-chips-multiple-container {
     border-color: #81C784;
   }
@@ -1052,6 +1056,10 @@
     background-color: transparent;
   }
 
+  p-dropdown.ng-dirty.ng-invalid > .p-dropdown {
+    border-color: #ef9a9a;
+  }
+
   .p-inputgroup-addon {
     background: #1f2d40;
     color: rgba(255, 255, 255, 0.6);
@@ -1196,7 +1204,7 @@
     background: #6abd6e;
   }
 
-  p-inputswitch.ng-dirty.ng-invalid > .p-inputswitch {
+  p-inputswitch.ng-dirty.ng-invalid > .p-inputswitch > .p-inputswitch-slider {
     border-color: #ef9a9a;
   }
 

package/resources/themes/vela-orange/theme.css

@@ -861,6 +861,10 @@
     margin-left: 0.5rem;
   }
 
+  p-tristatecheckbox.ng-dirty.ng-invalid > .p-checkbox > .p-checkbox-box {
+    border-color: #ef9a9a;
+  }
+
   .p-chips:not(.p-disabled):hover .p-chips-multiple-container {
     border-color: #FFD54F;
   }
@@ -1052,6 +1056,10 @@
     background-color: transparent;
   }
 
+  p-dropdown.ng-dirty.ng-invalid > .p-dropdown {
+    border-color: #ef9a9a;
+  }
+
   .p-inputgroup-addon {
     background: #1f2d40;
     color: rgba(255, 255, 255, 0.6);
@@ -1196,7 +1204,7 @@
     background: #ffcd2e;
   }
 
-  p-inputswitch.ng-dirty.ng-invalid > .p-inputswitch {
+  p-inputswitch.ng-dirty.ng-invalid > .p-inputswitch > .p-inputswitch-slider {
     border-color: #ef9a9a;
   }
 

package/resources/themes/vela-purple/theme.css

@@ -861,6 +861,10 @@
     margin-left: 0.5rem;
   }
 
+  p-tristatecheckbox.ng-dirty.ng-invalid > .p-checkbox > .p-checkbox-box {
+    border-color: #ef9a9a;
+  }
+
   .p-chips:not(.p-disabled):hover .p-chips-multiple-container {
     border-color: #BA68C8;
   }
@@ -1052,6 +1056,10 @@
     background-color: transparent;
   }
 
+  p-dropdown.ng-dirty.ng-invalid > .p-dropdown {
+    border-color: #ef9a9a;
+  }
+
   .p-inputgroup-addon {
     background: #1f2d40;
     color: rgba(255, 255, 255, 0.6);
@@ -1196,7 +1204,7 @@
     background: #b052c0;
   }
 
-  p-inputswitch.ng-dirty.ng-invalid > .p-inputswitch {
+  p-inputswitch.ng-dirty.ng-invalid > .p-inputswitch > .p-inputswitch-slider {
     border-color: #ef9a9a;
   }
 

package/resources/themes/viva-dark/theme.css

@@ -891,6 +891,10 @@
     margin-left: 0.5rem;
   }
 
+  p-tristatecheckbox.ng-dirty.ng-invalid > .p-checkbox > .p-checkbox-box {
+    border-color: #f78c79;
+  }
+
   .p-chips:not(.p-disabled):hover .p-chips-multiple-container {
     border-color: #2d3e44;
   }
@@ -1082,6 +1086,10 @@
     background-color: transparent;
   }
 
+  p-dropdown.ng-dirty.ng-invalid > .p-dropdown {
+    border-color: #f78c79;
+  }
+
   .p-inputgroup-addon {
     background: #161d21;
     color: rgba(255, 255, 255, 0.6);
@@ -1226,7 +1234,7 @@
     background: #8fa0e2;
   }
 
-  p-inputswitch.ng-dirty.ng-invalid > .p-inputswitch {
+  p-inputswitch.ng-dirty.ng-invalid > .p-inputswitch > .p-inputswitch-slider {
     border-color: #f78c79;
   }
 

package/resources/themes/viva-light/theme.css

@@ -892,6 +892,10 @@
     margin-left: 0.5rem;
   }
 
+  p-tristatecheckbox.ng-dirty.ng-invalid > .p-checkbox > .p-checkbox-box {
+    border-color: #f88c79;
+  }
+
   .p-chips:not(.p-disabled):hover .p-chips-multiple-container {
     border-color: #cecece;
   }
@@ -1083,6 +1087,10 @@
     background-color: transparent;
   }
 
+  p-dropdown.ng-dirty.ng-invalid > .p-dropdown {
+    border-color: #f88c79;
+  }
+
   .p-inputgroup-addon {
     background: #f5f5f5;
     color: #898989;
@@ -1227,7 +1235,7 @@
     background: #4868d1;
   }
 
-  p-inputswitch.ng-dirty.ng-invalid > .p-inputswitch {
+  p-inputswitch.ng-dirty.ng-invalid > .p-inputswitch > .p-inputswitch-slider {
     border-color: #f88c79;
   }
 

package/sidebar/sidebar.d.ts

@@ -127,6 +127,7 @@ export declare class Sidebar implements AfterViewInit, AfterContentInit, OnDestr
     headerTemplate: Nullable<TemplateRef<any>>;
     footerTemplate: Nullable<TemplateRef<any>>;
     closeIconTemplate: Nullable<TemplateRef<any>>;
+    headlessTemplate: Nullable<TemplateRef<any>>;
     constructor(document: Document, el: ElementRef, renderer: Renderer2, cd: ChangeDetectorRef, config: PrimeNGConfig);
     ngAfterViewInit(): void;
     ngAfterContentInit(): void;

package/sidebar/sidebar.interface.d.ts

@@ -20,4 +20,8 @@ export interface SidebarTemplates {
      * Custom template of closeicon.
      */
     closeicon(): TemplateRef<any>;
+    /**
+     * Headless template.
+     */
+    headless(): TemplateRef<any>;
 }

package/tieredmenu/tieredmenu.interface.d.ts

@@ -4,6 +4,22 @@ import { TemplateRef } from '@angular/core';
  * @group Templates
  */
 export interface TieredMenuTemplates {
+    /**
+     * Custom template of item.
+     */
+    item(context: {
+        /**
+         * Item instance.
+         */
+        $implicit: any;
+        /**
+         * Submenu control of the item.
+         */
+        hasSubmenu: boolean;
+    }): TemplateRef<{
+        $implicit: any;
+        hasSubmenu: boolean;
+    }>;
     /**
      * Custom template of submenuicon.
      */

package/toast/toast.d.ts

@@ -19,6 +19,7 @@ export declare class ToastItem implements AfterViewInit, OnDestroy {
     index: number | null | undefined;
     life: number;
     template: TemplateRef<any> | undefined;
+    headlessTemplate: TemplateRef<any> | undefined;
     showTransformOptions: string | undefined;
     hideTransformOptions: string | undefined;
     showTransitionOptions: string | undefined;
@@ -36,7 +37,7 @@ export declare class ToastItem implements AfterViewInit, OnDestroy {
     get closeAriaLabel(): string;
     ngOnDestroy(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ToastItem, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ToastItem, "p-toastItem", never, { "message": { "alias": "message"; "required": false; }; "index": { "alias": "index"; "required": false; }; "life": { "alias": "life"; "required": false; }; "template": { "alias": "template"; "required": false; }; "showTransformOptions": { "alias": "showTransformOptions"; "required": false; }; "hideTransformOptions": { "alias": "hideTransformOptions"; "required": false; }; "showTransitionOptions": { "alias": "showTransitionOptions"; "required": false; }; "hideTransitionOptions": { "alias": "hideTransitionOptions"; "required": false; }; }, { "onClose": "onClose"; }, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ToastItem, "p-toastItem", never, { "message": { "alias": "message"; "required": false; }; "index": { "alias": "index"; "required": false; }; "life": { "alias": "life"; "required": false; }; "template": { "alias": "template"; "required": false; }; "headlessTemplate": { "alias": "headlessTemplate"; "required": false; }; "showTransformOptions": { "alias": "showTransformOptions"; "required": false; }; "hideTransformOptions": { "alias": "hideTransformOptions"; "required": false; }; "showTransitionOptions": { "alias": "showTransitionOptions"; "required": false; }; "hideTransitionOptions": { "alias": "hideTransitionOptions"; "required": false; }; }, { "onClose": "onClose"; }, never, never, false, never>;
 }
 /**
  * Toast is used to display messages in an overlay.
@@ -136,6 +137,7 @@ export declare class Toast implements OnInit, AfterContentInit, OnDestroy {
     messages: Message[] | null | undefined;
     messagesArchieve: Message[] | undefined;
     template: TemplateRef<any> | undefined;
+    headlessTemplate: TemplateRef<any> | undefined;
     _position: ToastPositionType;
     constructor(document: Document, renderer: Renderer2, messageService: MessageService, cd: ChangeDetectorRef, config: PrimeNGConfig);
     styleElement: any;

package/toast/toast.interface.d.ts

@@ -16,6 +16,17 @@ export interface ToastTemplates {
     }): TemplateRef<{
         $implicit: any;
     }>;
+    /**
+     * Headless template.
+     */
+    headless(context: {
+        /**
+         * Data of the message.
+         */
+        $implicit: any;
+    }): TemplateRef<{
+        $implicit: any;
+    }>;
 }
 /**
  * Custom close event.

package/togglebutton/togglebutton.d.ts

@@ -1,9 +1,12 @@
-import { ChangeDetectorRef, EventEmitter } from '@angular/core';
+import { ChangeDetectorRef, EventEmitter, QueryList, TemplateRef } from '@angular/core';
 import { ControlValueAccessor } from '@angular/forms';
 import { ToggleButtonChangeEvent } from './togglebutton.interface';
+import { Nullable } from 'primeng/ts-helpers';
+import { PrimeTemplate } from 'primeng/api';
 import * as i0 from "@angular/core";
 import * as i1 from "@angular/common";
 import * as i2 from "primeng/ripple";
+import * as i3 from "primeng/api";
 export declare const TOGGLEBUTTON_VALUE_ACCESSOR: any;
 /**
  * ToggleButton is used to select a boolean value using a button.
@@ -77,10 +80,13 @@ export declare class ToggleButton implements ControlValueAccessor {
      * @group Emits
      */
     onChange: EventEmitter<ToggleButtonChangeEvent>;
+    templates: QueryList<PrimeTemplate>;
+    iconTemplate: Nullable<TemplateRef<any>>;
     checked: boolean;
     onModelChange: Function;
     onModelTouched: Function;
     constructor(cd: ChangeDetectorRef);
+    ngAfterContentInit(): void;
     toggle(event: Event): void;
     onKeyDown(event: KeyboardEvent): void;
     onBlur(): void;
@@ -91,10 +97,10 @@ export declare class ToggleButton implements ControlValueAccessor {
     get hasOnLabel(): boolean;
     get hasOffLabel(): boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<ToggleButton, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ToggleButton, "p-toggleButton", never, { "onLabel": { "alias": "onLabel"; "required": false; }; "offLabel": { "alias": "offLabel"; "required": false; }; "onIcon": { "alias": "onIcon"; "required": false; }; "offIcon": { "alias": "offIcon"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "style": { "alias": "style"; "required": false; }; "styleClass": { "alias": "styleClass"; "required": false; }; "inputId": { "alias": "inputId"; "required": false; }; "tabindex": { "alias": "tabindex"; "required": false; }; "iconPos": { "alias": "iconPos"; "required": false; }; }, { "onChange": "onChange"; }, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ToggleButton, "p-toggleButton", never, { "onLabel": { "alias": "onLabel"; "required": false; }; "offLabel": { "alias": "offLabel"; "required": false; }; "onIcon": { "alias": "onIcon"; "required": false; }; "offIcon": { "alias": "offIcon"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "style": { "alias": "style"; "required": false; }; "styleClass": { "alias": "styleClass"; "required": false; }; "inputId": { "alias": "inputId"; "required": false; }; "tabindex": { "alias": "tabindex"; "required": false; }; "iconPos": { "alias": "iconPos"; "required": false; }; }, { "onChange": "onChange"; }, ["templates"], never, false, never>;
 }
 export declare class ToggleButtonModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<ToggleButtonModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<ToggleButtonModule, [typeof ToggleButton], [typeof i1.CommonModule, typeof i2.RippleModule], [typeof ToggleButton]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ToggleButtonModule, [typeof ToggleButton], [typeof i1.CommonModule, typeof i2.RippleModule, typeof i3.SharedModule], [typeof ToggleButton, typeof i3.SharedModule]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<ToggleButtonModule>;
 }

package/togglebutton/togglebutton.interface.d.ts

@@ -1,3 +1,4 @@
+import { TemplateRef } from '@angular/core';
 /**
  * Custom change event.
  * @see {@link ToggleButton.onChange}
@@ -13,3 +14,21 @@ export interface ToggleButtonChangeEvent {
      */
     checked: boolean | undefined;
 }
+/**
+ * Defines valid templates in ToggleButton.
+ * @group Templates
+ */
+export interface ToggleButtonTemplates {
+    /**
+     * Custom icon template.
+     * @param {boolean} context - checked state as boolean.
+     */
+    icon(context: {
+        /**
+         * Checked.
+         */
+        $implicit: boolean;
+    }): TemplateRef<{
+        $implicit: boolean;
+    }>;
+}

package/resources/components/tristatecheckbox/tristatecheckbox.css

@@ -1,5 +0,0 @@
-@layer primeng {
-    .p-tristatecheckbox-label {
-        cursor: pointer;
-    }
-}