feat(core): Support optional timeout for idle deferred triggers

Allows specifying a timeout parameter for idle-based deferred triggers, enabling more granular control over when deferred actions are executed.

Closes angular#67187

packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_deferred/GOLDEN_PARTIAL.js

@@ -1385,3 +1385,42 @@ export declare class MyApp {
     static ɵcmp: i0.ɵɵComponentDeclaration<MyApp, "ng-component", never, {}, {}, never, never, true, never>;
 }
 
+/****************************************************************************************************
+ * PARTIAL FILE: deferred_on_idle_with_timeout.js
+ ****************************************************************************************************/
+import { Component } from '@angular/core';
+import * as i0 from "@angular/core";
+export class MyApp {
+    message = 'hello';
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "0.0.0-PLACEHOLDER", ngImport: i0, type: MyApp, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "0.0.0-PLACEHOLDER", type: MyApp, isStandalone: true, selector: "ng-component", ngImport: i0, template: `
+    @defer (on idle(500ms)) {
+      {{message}}
+    } @placeholder {
+      <p>Placeholder</p>
+    }
+  `, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "0.0.0-PLACEHOLDER", ngImport: i0, type: MyApp, decorators: [{
+            type: Component,
+            args: [{
+                    template: `
+    @defer (on idle(500ms)) {
+      {{message}}
+    } @placeholder {
+      <p>Placeholder</p>
+    }
+  `,
+                }]
+        }] });
+
+/****************************************************************************************************
+ * PARTIAL FILE: deferred_on_idle_with_timeout.d.ts
+ ****************************************************************************************************/
+import * as i0 from "@angular/core";
+export declare class MyApp {
+    message: string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MyApp, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MyApp, "ng-component", never, {}, {}, never, never, true, never>;
+}
+

packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_deferred/TEST_CASES.json

@@ -374,6 +374,21 @@
           "failureMessage": "Incorrect template"
         }
       ]
+    },
+    {
+      "description": "should generate a defer block with an `on idle` trigger that has a timeout",
+      "inputFiles": ["deferred_on_idle_with_timeout.ts"],
+      "expectations": [
+        {
+          "files": [
+            {
+              "expected": "deferred_on_idle_with_timeout_template.js",
+              "generated": "deferred_on_idle_with_timeout.js"
+            }
+          ],
+          "failureMessage": "Incorrect template"
+        }
+      ]
     }
   ]
 }

packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_deferred/deferred_on_idle_with_timeout.ts

@@ -0,0 +1,14 @@
+import {Component} from '@angular/core';
+
+@Component({
+    template: `
+    @defer (on idle(500ms)) {
+      {{message}}
+    } @placeholder {
+      <p>Placeholder</p>
+    }
+  `,
+})
+export class MyApp {
+  message = 'hello';
+}

packages/compiler-cli/test/compliance/test_cases/r3_view_compiler_deferred/deferred_on_idle_with_timeout_template.js

@@ -0,0 +1,8 @@
+function MyApp_Template(rf, ctx) {
+  if (rf & 1) {
+    $r3$.ɵɵdomTemplate(0, MyApp_Defer_0_Template, 1, 1)(1, MyApp_DeferPlaceholder_1_Template, 2, 0);
+    $r3$.ɵɵdefer(2, 0, null, null, 1);
+    $r3$.ɵɵdeferOnIdle(500);
+  }
+  …
+}