@angular/aria 21.0.0-rc.0 → 21.0.0-rc.2

package/_adev_assets/aria-tabs.json

@@ -10,19 +10,13 @@
       "entryType": "directive",
       "members": [
         {
-          "name": "tabs",
-          "type": "any",
-          "memberType": "property",
-          "memberTags": [],
-          "description": "The Tab UIPattern of the child Tabs.",
-          "jsdocTags": []
-        },
-        {
-          "name": "unorderedTabpanels",
-          "type": "any",
+          "name": "element",
+          "type": "HTMLElement",
           "memberType": "property",
-          "memberTags": [],
-          "description": "The TabPanel UIPattern of the child TabPanels.",
+          "memberTags": [
+            "readonly"
+          ],
+          "description": "A reference to the host element.",
           "jsdocTags": []
         },
         {
@@ -125,9 +119,14 @@
         }
       ],
       "generics": [],
-      "description": "A Tabs container.\n\nRepresents a set of layered sections of content. The Tabs is a container meant to be used with\nTabList, Tab, and TabPanel as follows:\n\n```html\n<div ngTabs>\n  <ul ngTabList>\n    <li ngTab value=\"tab1\">Tab 1</li>\n    <li ngTab value=\"tab2\">Tab 2</li>\n    <li ngTab value=\"tab3\">Tab 3</li>\n  </ul>\n\n  <div ngTabPanel value=\"tab1\">\n     <ng-template ngTabContent>Tab content 1</ng-template>\n  </div>\n  <div ngTabPanel value=\"tab2\">\n     <ng-template ngTabContent>Tab content 2</ng-template>\n  </div>\n  <div ngTabPanel value=\"tab3\">\n     <ng-template ngTabContent>Tab content 3</ng-template>\n  </div>\n```",
-      "jsdocTags": [],
-      "rawComment": "/**\n * A Tabs container.\n *\n * Represents a set of layered sections of content. The Tabs is a container meant to be used with\n * TabList, Tab, and TabPanel as follows:\n *\n * ```html\n * <div ngTabs>\n *   <ul ngTabList>\n *     <li ngTab value=\"tab1\">Tab 1</li>\n *     <li ngTab value=\"tab2\">Tab 2</li>\n *     <li ngTab value=\"tab3\">Tab 3</li>\n *   </ul>\n *\n *   <div ngTabPanel value=\"tab1\">\n *      <ng-template ngTabContent>Tab content 1</ng-template>\n *   </div>\n *   <div ngTabPanel value=\"tab2\">\n *      <ng-template ngTabContent>Tab content 2</ng-template>\n *   </div>\n *   <div ngTabPanel value=\"tab3\">\n *      <ng-template ngTabContent>Tab content 3</ng-template>\n *   </div>\n * ```\n */",
+      "description": "A Tabs container.\n\nThe `ngTabs` directive represents a set of layered sections of content. It acts as the\noverarching container for a tabbed interface, coordinating the behavior of `ngTabList`,\n`ngTab`, and `ngTabPanel` directives.\n\n```html\n<div ngTabs>\n  <ul ngTabList [(selectedTab)]=\"selectedTabValue\">\n    <li ngTab value=\"tab1\">Tab 1</li>\n    <li ngTab value=\"tab2\">Tab 2</li>\n    <li ngTab value=\"tab3\">Tab 3</li>\n  </ul>\n\n  <div ngTabPanel value=\"tab1\">\n     <ng-template ngTabContent>Content for Tab 1</ng-template>\n  </div>\n  <div ngTabPanel value=\"tab2\">\n     <ng-template ngTabContent>Content for Tab 2</ng-template>\n  </div>\n  <div ngTabPanel value=\"tab3\">\n     <ng-template ngTabContent>Content for Tab 3</ng-template>\n  </div>\n</div>\n```",
+      "jsdocTags": [
+        {
+          "name": "developerPreview",
+          "comment": "21.0"
+        }
+      ],
+      "rawComment": "/**\n * A Tabs container.\n *\n * The `ngTabs` directive represents a set of layered sections of content. It acts as the\n * overarching container for a tabbed interface, coordinating the behavior of `ngTabList`,\n * `ngTab`, and `ngTabPanel` directives.\n *\n * ```html\n * <div ngTabs>\n *   <ul ngTabList [(selectedTab)]=\"selectedTabValue\">\n *     <li ngTab value=\"tab1\">Tab 1</li>\n *     <li ngTab value=\"tab2\">Tab 2</li>\n *     <li ngTab value=\"tab3\">Tab 3</li>\n *   </ul>\n *\n *   <div ngTabPanel value=\"tab1\">\n *      <ng-template ngTabContent>Content for Tab 1</ng-template>\n *   </div>\n *   <div ngTabPanel value=\"tab2\">\n *      <ng-template ngTabContent>Content for Tab 2</ng-template>\n *   </div>\n *   <div ngTabPanel value=\"tab3\">\n *      <ng-template ngTabContent>Content for Tab 3</ng-template>\n *   </div>\n * </div>\n * ```\n *\n * @developerPreview 21.0\n */",
       "implements": [],
       "isStandalone": true,
       "selector": "[ngTabs]",
@@ -136,8 +135,8 @@
       ],
       "source": {
         "filePath": "/src/aria/tabs/tabs.ts",
-        "startLine": 67,
-        "endLine": 110
+        "startLine": 74,
+        "endLine": 120
       }
     },
     {
@@ -146,23 +145,23 @@
       "entryType": "directive",
       "members": [
         {
-          "name": "textDirection",
-          "type": "any",
+          "name": "element",
+          "type": "HTMLElement",
           "memberType": "property",
           "memberTags": [
             "readonly"
           ],
-          "description": "Text direction.",
+          "description": "A reference to the host element.",
           "jsdocTags": []
         },
         {
-          "name": "tabs",
+          "name": "textDirection",
           "type": "any",
           "memberType": "property",
           "memberTags": [
             "readonly"
           ],
-          "description": "The Tab UIPatterns of the child Tabs.",
+          "description": "Text direction.",
           "jsdocTags": []
         },
         {
@@ -192,16 +191,16 @@
           "isRequiredInput": false
         },
         {
-          "name": "skipDisabled",
+          "name": "softDisabled",
           "type": "any",
           "memberType": "property",
           "memberTags": [
             "readonly",
             "input"
           ],
-          "description": "Whether disabled items in the list should be skipped when navigating.",
+          "description": "Whether to allow disabled items to receive focus. When `true`, disabled items are\nfocusable but not interactive. When `false`, disabled items are skipped during navigation.",
           "jsdocTags": [],
-          "inputAlias": "skipDisabled",
+          "inputAlias": "softDisabled",
           "isRequiredInput": false
         },
         {
@@ -212,7 +211,7 @@
             "readonly",
             "input"
           ],
-          "description": "The focus strategy used by the tablist.",
+          "description": "The focus strategy used by the tablist.\n- `roving`: Focus is moved to the active tab using `tabindex`.\n- `activedescendant`: Focus remains on the tablist container, and `aria-activedescendant` is used to indicate the active tab.",
           "jsdocTags": [],
           "inputAlias": "focusMode",
           "isRequiredInput": false
@@ -225,38 +224,38 @@
             "readonly",
             "input"
           ],
-          "description": "The selection strategy used by the tablist.",
+          "description": "The selection strategy used by the tablist.\n- `follow`: The focused tab is automatically selected.\n- `explicit`: Tabs are selected explicitly by the user (e.g., via click or spacebar).",
           "jsdocTags": [],
           "inputAlias": "selectionMode",
           "isRequiredInput": false
         },
         {
-          "name": "disabled",
+          "name": "selectedTab",
           "type": "any",
           "memberType": "property",
           "memberTags": [
             "readonly",
-            "input"
+            "input",
+            "output"
           ],
-          "description": "Whether the tablist is disabled.",
+          "description": "The current selected tab.",
           "jsdocTags": [],
-          "inputAlias": "disabled",
-          "isRequiredInput": false
+          "inputAlias": "selectedTab",
+          "isRequiredInput": false,
+          "outputAlias": "selectedTabChange"
         },
         {
-          "name": "selectedTab",
+          "name": "disabled",
           "type": "any",
           "memberType": "property",
           "memberTags": [
             "readonly",
-            "input",
-            "output"
+            "input"
           ],
-          "description": "The current selected tab.",
+          "description": "Whether the tablist is disabled.",
           "jsdocTags": [],
-          "inputAlias": "selectedTab",
-          "isRequiredInput": false,
-          "outputAlias": "selectedTabChange"
+          "inputAlias": "disabled",
+          "isRequiredInput": false
         },
         {
           "name": "onFocus",
@@ -454,12 +453,66 @@
           "rawComment": "",
           "memberType": "method",
           "memberTags": []
+        },
+        {
+          "name": "open",
+          "signatures": [
+            {
+              "name": "open",
+              "entryType": "function",
+              "description": "Opens the tab panel with the specified value.",
+              "generics": [],
+              "isNewType": false,
+              "jsdocTags": [],
+              "params": [
+                {
+                  "name": "value",
+                  "description": "",
+                  "type": "string",
+                  "isOptional": false,
+                  "isRestParam": false
+                }
+              ],
+              "rawComment": "/** Opens the tab panel with the specified value. */",
+              "returnType": "boolean"
+            }
+          ],
+          "implementation": {
+            "params": [
+              {
+                "name": "value",
+                "description": "",
+                "type": "string",
+                "isOptional": false,
+                "isRestParam": false
+              }
+            ],
+            "isNewType": false,
+            "returnType": "boolean",
+            "generics": [],
+            "name": "open",
+            "description": "Opens the tab panel with the specified value.",
+            "entryType": "function",
+            "jsdocTags": [],
+            "rawComment": "/** Opens the tab panel with the specified value. */"
+          },
+          "entryType": "function",
+          "description": "Opens the tab panel with the specified value.",
+          "jsdocTags": [],
+          "rawComment": "/** Opens the tab panel with the specified value. */",
+          "memberType": "method",
+          "memberTags": []
         }
       ],
       "generics": [],
-      "description": "A TabList container.\n\nControls a list of Tab(s).",
-      "jsdocTags": [],
-      "rawComment": "/**\n * A TabList container.\n *\n * Controls a list of Tab(s).\n */",
+      "description": "A TabList container.\n\nThe `ngTabList` directive controls a list of `ngTab` elements. It manages keyboard\nnavigation, selection, and the overall orientation of the tabs. It should be placed\nwithin an `ngTabs` container.\n\n```html\n<ul ngTabList [(selectedTab)]=\"mySelectedTab\" orientation=\"horizontal\" selectionMode=\"explicit\">\n  <li ngTab value=\"first\">First Tab</li>\n  <li ngTab value=\"second\">Second Tab</li>\n</ul>\n```",
+      "jsdocTags": [
+        {
+          "name": "developerPreview",
+          "comment": "21.0"
+        }
+      ],
+      "rawComment": "/**\n * A TabList container.\n *\n * The `ngTabList` directive controls a list of `ngTab` elements. It manages keyboard\n * navigation, selection, and the overall orientation of the tabs. It should be placed\n * within an `ngTabs` container.\n *\n * ```html\n * <ul ngTabList [(selectedTab)]=\"mySelectedTab\" orientation=\"horizontal\" selectionMode=\"explicit\">\n *   <li ngTab value=\"first\">First Tab</li>\n *   <li ngTab value=\"second\">Second Tab</li>\n * </ul>\n * ```\n *\n * @developerPreview 21.0\n */",
       "implements": [
         "OnInit",
         "OnDestroy"
@@ -471,8 +524,8 @@
       ],
       "source": {
         "filePath": "/src/aria/tabs/tabs.ts",
-        "startLine": 117,
-        "endLine": 219
+        "startLine": 138,
+        "endLine": 264
       }
     },
     {
@@ -482,14 +535,27 @@
       "members": [
         {
           "name": "element",
-          "type": "any",
+          "type": "HTMLElement",
           "memberType": "property",
           "memberTags": [
             "readonly"
           ],
-          "description": "The host native element.",
+          "description": "A reference to the host element.",
           "jsdocTags": []
         },
+        {
+          "name": "id",
+          "type": "any",
+          "memberType": "property",
+          "memberTags": [
+            "readonly",
+            "input"
+          ],
+          "description": "A unique identifier for the widget.",
+          "jsdocTags": [],
+          "inputAlias": "id",
+          "isRequiredInput": false
+        },
         {
           "name": "tablist",
           "type": "any",
@@ -531,11 +597,64 @@
             "readonly",
             "input"
           ],
-          "description": "A local unique identifier for the tab.",
+          "description": "The remote tabpanel unique identifier.",
           "jsdocTags": [],
           "inputAlias": "value",
           "isRequiredInput": true
         },
+        {
+          "name": "active",
+          "type": "any",
+          "memberType": "property",
+          "memberTags": [
+            "readonly"
+          ],
+          "description": "Whether the tab is active.",
+          "jsdocTags": []
+        },
+        {
+          "name": "selected",
+          "type": "any",
+          "memberType": "property",
+          "memberTags": [
+            "readonly"
+          ],
+          "description": "Whether the tab is selected.",
+          "jsdocTags": []
+        },
+        {
+          "name": "open",
+          "signatures": [
+            {
+              "name": "open",
+              "entryType": "function",
+              "description": "Opens this tab panel.",
+              "generics": [],
+              "isNewType": false,
+              "jsdocTags": [],
+              "params": [],
+              "rawComment": "/** Opens this tab panel. */",
+              "returnType": "void"
+            }
+          ],
+          "implementation": {
+            "params": [],
+            "isNewType": false,
+            "returnType": "void",
+            "generics": [],
+            "name": "open",
+            "description": "Opens this tab panel.",
+            "entryType": "function",
+            "jsdocTags": [],
+            "rawComment": "/** Opens this tab panel. */"
+          },
+          "entryType": "function",
+          "description": "Opens this tab panel.",
+          "jsdocTags": [],
+          "rawComment": "/** Opens this tab panel. */",
+          "memberType": "method",
+          "memberTags": []
+        },
         {
           "name": "ngOnInit",
           "signatures": [
@@ -604,9 +723,14 @@
         }
       ],
       "generics": [],
-      "description": "A selectable tab in a TabList.",
-      "jsdocTags": [],
-      "rawComment": "/** A selectable tab in a TabList. */",
+      "description": "A selectable tab in a TabList.\n\nThe `ngTab` directive represents an individual tab control within an `ngTabList`. It\nrequires a `value` that uniquely identifies it and links it to a corresponding `ngTabPanel`.\n\n```html\n<li ngTab value=\"myTabId\" [disabled]=\"isTabDisabled\">\n  My Tab Label\n</li>\n```",
+      "jsdocTags": [
+        {
+          "name": "developerPreview",
+          "comment": "21.0"
+        }
+      ],
+      "rawComment": "/**\n * A selectable tab in a TabList.\n *\n * The `ngTab` directive represents an individual tab control within an `ngTabList`. It\n * requires a `value` that uniquely identifies it and links it to a corresponding `ngTabPanel`.\n *\n * ```html\n * <li ngTab value=\"myTabId\" [disabled]=\"isTabDisabled\">\n *   My Tab Label\n * </li>\n * ```\n *\n * @developerPreview 21.0\n */",
       "implements": [
         "HasElement",
         "OnInit",
@@ -619,8 +743,8 @@
       ],
       "source": {
         "filePath": "/src/aria/tabs/tabs.ts",
-        "startLine": 222,
-        "endLine": 282
+        "startLine": 280,
+        "endLine": 350
       }
     },
     {
@@ -628,6 +752,26 @@
       "isAbstract": false,
       "entryType": "undecorated_class",
       "members": [
+        {
+          "name": "element",
+          "type": "HTMLElement",
+          "memberType": "property",
+          "memberTags": [
+            "readonly"
+          ],
+          "description": "A reference to the host element.",
+          "jsdocTags": []
+        },
+        {
+          "name": "id",
+          "type": "any",
+          "memberType": "property",
+          "memberTags": [
+            "readonly"
+          ],
+          "description": "A global unique identifier for the tab.",
+          "jsdocTags": []
+        },
         {
           "name": "tab",
           "type": "any",
@@ -648,6 +792,16 @@
           "description": "A local unique identifier for the tabpanel.",
           "jsdocTags": []
         },
+        {
+          "name": "visible",
+          "type": "any",
+          "memberType": "property",
+          "memberTags": [
+            "readonly"
+          ],
+          "description": "Whether the tab panel is visible.",
+          "jsdocTags": []
+        },
         {
           "name": "ngOnInit",
           "signatures": [
@@ -716,17 +870,22 @@
         }
       ],
       "generics": [],
-      "description": "A TabPanel container for the resources of layered content associated with a tab.\n\nIf a tabpanel is hidden due to its corresponding tab is not activated, the `inert` attribute\nwill be applied to the tabpanel element to remove it from the accessibility tree and stop\nall the keyboard and pointer interactions. Note that this does not visually hide the tabpenl\nand a proper styling is required.",
-      "jsdocTags": [],
-      "rawComment": "/**\n * A TabPanel container for the resources of layered content associated with a tab.\n *\n * If a tabpanel is hidden due to its corresponding tab is not activated, the `inert` attribute\n * will be applied to the tabpanel element to remove it from the accessibility tree and stop\n * all the keyboard and pointer interactions. Note that this does not visually hide the tabpenl\n * and a proper styling is required.\n */",
+      "description": "A TabPanel container for the resources of layered content associated with a tab.\n\nThe `ngTabPanel` directive holds the content for a specific tab. It is linked to an\n`ngTab` by a matching `value`. If a tab panel is hidden, the `inert` attribute will be\napplied to remove it from the accessibility tree. Proper styling is required for visual hiding.\n\n```html\n<div ngTabPanel value=\"myTabId\">\n  <ng-template ngTabContent>\n    <!-- Content for the tab panel -->\n  </ng-template>\n</div>\n```",
+      "jsdocTags": [
+        {
+          "name": "developerPreview",
+          "comment": "21.0"
+        }
+      ],
+      "rawComment": "/**\n * A TabPanel container for the resources of layered content associated with a tab.\n *\n * The `ngTabPanel` directive holds the content for a specific tab. It is linked to an\n * `ngTab` by a matching `value`. If a tab panel is hidden, the `inert` attribute will be\n * applied to remove it from the accessibility tree. Proper styling is required for visual hiding.\n *\n * ```html\n * <div ngTabPanel value=\"myTabId\">\n *   <ng-template ngTabContent>\n *     <!-- Content for the tab panel -->\n *   </ng-template>\n * </div>\n * ```\n *\n * @developerPreview 21.0\n */",
       "implements": [
         "OnInit",
         "OnDestroy"
       ],
       "source": {
         "filePath": "/src/aria/tabs/tabs.ts",
-        "startLine": 292,
-        "endLine": 344
+        "startLine": 369,
+        "endLine": 429
       }
     },
     {
@@ -735,26 +894,23 @@
       "entryType": "undecorated_class",
       "members": [],
       "generics": [],
-      "description": "A TabContent container for the lazy-loaded content.",
-      "jsdocTags": [],
-      "rawComment": "/**\n * A TabContent container for the lazy-loaded content.\n */",
+      "description": "A TabContent container for the lazy-loaded content.\n\nThis structural directive should be applied to an `ng-template` within an `ngTabPanel`.\nIt enables lazy loading of the tab's content, meaning the content is only rendered\nwhen the tab is activated for the first time.\n\n```html\n<div ngTabPanel value=\"myTabId\">\n  <ng-template ngTabContent>\n    <p>This content will be loaded when 'myTabId' is selected.</p>\n  </ng-template>\n</div>\n```",
+      "jsdocTags": [
+        {
+          "name": "developerPreview",
+          "comment": "21.0"
+        }
+      ],
+      "rawComment": "/**\n * A TabContent container for the lazy-loaded content.\n *\n * This structural directive should be applied to an `ng-template` within an `ngTabPanel`.\n * It enables lazy loading of the tab's content, meaning the content is only rendered\n * when the tab is activated for the first time.\n *\n * ```html\n * <div ngTabPanel value=\"myTabId\">\n *   <ng-template ngTabContent>\n *     <p>This content will be loaded when 'myTabId' is selected.</p>\n *   </ng-template>\n * </div>\n * ```\n *\n * @developerPreview 21.0\n */",
       "implements": [],
       "source": {
         "filePath": "/src/aria/tabs/tabs.ts",
-        "startLine": 349,
-        "endLine": 354
+        "startLine": 448,
+        "endLine": 453
       }
     }
   ],
   "symbols": [
-    [
-      "DeferredContent",
-      "@angular/aria/deferred-content"
-    ],
-    [
-      "DeferredContentAware",
-      "@angular/aria/deferred-content"
-    ],
     [
       "_IdGenerator",
       "@angular/cdk/a11y"
@@ -791,18 +947,10 @@
       "model",
       "@angular/core"
     ],
-    [
-      "linkedSignal",
-      "@angular/core"
-    ],
     [
       "signal",
       "@angular/core"
     ],
-    [
-      "Signal",
-      "@angular/core"
-    ],
     [
       "afterRenderEffect",
       "@angular/core"
@@ -827,6 +975,14 @@
       "TabPattern",
       "@angular/aria/private"
     ],
+    [
+      "DeferredContent",
+      "@angular/aria/private"
+    ],
+    [
+      "DeferredContentAware",
+      "@angular/aria/private"
+    ],
     [
       "Tabs",
       "@angular/aria/tabs"
@@ -852,11 +1008,7 @@
       "@angular/aria/tabs"
     ],
     [
-      "Tabs.tabs",
-      "@angular/aria/tabs"
-    ],
-    [
-      "Tabs.unorderedTabpanels",
+      "Tabs.element",
       "@angular/aria/tabs"
     ],
     [
@@ -872,11 +1024,11 @@
       "@angular/aria/tabs"
     ],
     [
-      "TabList.textDirection",
+      "TabList.element",
       "@angular/aria/tabs"
     ],
     [
-      "TabList.tabs",
+      "TabList.textDirection",
       "@angular/aria/tabs"
     ],
     [
@@ -888,7 +1040,7 @@
       "@angular/aria/tabs"
     ],
     [
-      "TabList.skipDisabled",
+      "TabList.softDisabled",
       "@angular/aria/tabs"
     ],
     [
@@ -900,11 +1052,11 @@
       "@angular/aria/tabs"
     ],
     [
-      "TabList.disabled",
+      "TabList.selectedTab",
       "@angular/aria/tabs"
     ],
     [
-      "TabList.selectedTab",
+      "TabList.disabled",
       "@angular/aria/tabs"
     ],
     [
@@ -927,6 +1079,10 @@
       "TabList.deregister",
       "@angular/aria/tabs"
     ],
+    [
+      "TabList.open",
+      "@angular/aria/tabs"
+    ],
     [
       "Tab",
       "@angular/aria/tabs"
@@ -935,6 +1091,10 @@
       "Tab.element",
       "@angular/aria/tabs"
     ],
+    [
+      "Tab.id",
+      "@angular/aria/tabs"
+    ],
     [
       "Tab.tablist",
       "@angular/aria/tabs"
@@ -951,6 +1111,18 @@
       "Tab.value",
       "@angular/aria/tabs"
     ],
+    [
+      "Tab.active",
+      "@angular/aria/tabs"
+    ],
+    [
+      "Tab.selected",
+      "@angular/aria/tabs"
+    ],
+    [
+      "Tab.open",
+      "@angular/aria/tabs"
+    ],
     [
       "Tab.ngOnInit",
       "@angular/aria/tabs"
@@ -963,6 +1135,14 @@
       "TabPanel",
       "@angular/aria/tabs"
     ],
+    [
+      "TabPanel.element",
+      "@angular/aria/tabs"
+    ],
+    [
+      "TabPanel.id",
+      "@angular/aria/tabs"
+    ],
     [
       "TabPanel.tab",
       "@angular/aria/tabs"
@@ -971,6 +1151,10 @@
       "TabPanel.value",
       "@angular/aria/tabs"
     ],
+    [
+      "TabPanel.visible",
+      "@angular/aria/tabs"
+    ],
     [
       "TabPanel.ngOnInit",
       "@angular/aria/tabs"