@fluentui/web-components 3.0.0-rc.1 → 3.0.0-rc.10

package/custom-elements.json

@@ -1621,6 +1621,46 @@
           "description": "CSS custom property value for the @fluentui/tokens#colorNeutralForeground4 | `colorNeutralForeground4` design token.",
           "privacy": "public"
         },
+        {
+          "kind": "variable",
+          "name": "colorNeutralForeground5",
+          "type": {
+            "text": "string"
+          },
+          "default": "'var(--colorNeutralForeground5)'",
+          "description": "CSS custom property value for the @fluentui/tokens#colorNeutralForeground5 | `colorNeutralForeground5` design token.",
+          "privacy": "public"
+        },
+        {
+          "kind": "variable",
+          "name": "colorNeutralForeground5Hover",
+          "type": {
+            "text": "string"
+          },
+          "default": "'var(--colorNeutralForeground5Hover)'",
+          "description": "CSS custom property value for the @fluentui/tokens#colorNeutralForeground5Hover | `colorNeutralForeground5Hover` design token.",
+          "privacy": "public"
+        },
+        {
+          "kind": "variable",
+          "name": "colorNeutralForeground5Pressed",
+          "type": {
+            "text": "string"
+          },
+          "default": "'var(--colorNeutralForeground5Pressed)'",
+          "description": "CSS custom property value for the @fluentui/tokens#colorNeutralForeground5Pressed | `colorNeutralForeground5Pressed` design token.",
+          "privacy": "public"
+        },
+        {
+          "kind": "variable",
+          "name": "colorNeutralForeground5Selected",
+          "type": {
+            "text": "string"
+          },
+          "default": "'var(--colorNeutralForeground5Selected)'",
+          "description": "CSS custom property value for the @fluentui/tokens#colorNeutralForeground5Selected | `colorNeutralForeground5Selected` design token.",
+          "privacy": "public"
+        },
         {
           "kind": "variable",
           "name": "colorNeutralForegroundDisabled",
@@ -2191,6 +2231,56 @@
           "description": "CSS custom property value for the @fluentui/tokens#colorNeutralBackground6 | `colorNeutralBackground6` design token.",
           "privacy": "public"
         },
+        {
+          "kind": "variable",
+          "name": "colorNeutralBackground7",
+          "type": {
+            "text": "string"
+          },
+          "default": "'var(--colorNeutralBackground7)'",
+          "description": "CSS custom property value for the @fluentui/tokens#colorNeutralBackground7 | `colorNeutralBackground7` design token.",
+          "privacy": "public"
+        },
+        {
+          "kind": "variable",
+          "name": "colorNeutralBackground7Hover",
+          "type": {
+            "text": "string"
+          },
+          "default": "'var(--colorNeutralBackground7Hover)'",
+          "description": "CSS custom property value for the @fluentui/tokens#colorNeutralBackground7Hover | `colorNeutralBackground7Hover` design token.",
+          "privacy": "public"
+        },
+        {
+          "kind": "variable",
+          "name": "colorNeutralBackground7Pressed",
+          "type": {
+            "text": "string"
+          },
+          "default": "'var(--colorNeutralBackground7Pressed)'",
+          "description": "CSS custom property value for the @fluentui/tokens#colorNeutralBackground7Pressed | `colorNeutralBackground7Pressed` design token.",
+          "privacy": "public"
+        },
+        {
+          "kind": "variable",
+          "name": "colorNeutralBackground7Selected",
+          "type": {
+            "text": "string"
+          },
+          "default": "'var(--colorNeutralBackground7Selected)'",
+          "description": "CSS custom property value for the @fluentui/tokens#colorNeutralBackground7Selected | `colorNeutralBackground7Selected` design token.",
+          "privacy": "public"
+        },
+        {
+          "kind": "variable",
+          "name": "colorNeutralBackground8",
+          "type": {
+            "text": "string"
+          },
+          "default": "'var(--colorNeutralBackground8)'",
+          "description": "CSS custom property value for the @fluentui/tokens#colorNeutralBackground8 | `colorNeutralBackground8` design token.",
+          "privacy": "public"
+        },
         {
           "kind": "variable",
           "name": "colorNeutralBackgroundInverted",
@@ -2201,6 +2291,36 @@
           "description": "CSS custom property value for the @fluentui/tokens#colorNeutralBackgroundInverted | `colorNeutralBackgroundInverted` design token.",
           "privacy": "public"
         },
+        {
+          "kind": "variable",
+          "name": "colorNeutralBackgroundInvertedHover",
+          "type": {
+            "text": "string"
+          },
+          "default": "'var(--colorNeutralBackgroundInvertedHover)'",
+          "description": "CSS custom property value for the @fluentui/tokens#colorNeutralBackgroundInvertedHover | `colorNeutralBackgroundInvertedHover` design token.",
+          "privacy": "public"
+        },
+        {
+          "kind": "variable",
+          "name": "colorNeutralBackgroundInvertedPressed",
+          "type": {
+            "text": "string"
+          },
+          "default": "'var(--colorNeutralBackgroundInvertedPressed)'",
+          "description": "CSS custom property value for the @fluentui/tokens#colorNeutralBackgroundInvertedPressed | `colorNeutralBackgroundInvertedPressed` design token.",
+          "privacy": "public"
+        },
+        {
+          "kind": "variable",
+          "name": "colorNeutralBackgroundInvertedSelected",
+          "type": {
+            "text": "string"
+          },
+          "default": "'var(--colorNeutralBackgroundInvertedSelected)'",
+          "description": "CSS custom property value for the @fluentui/tokens#colorNeutralBackgroundInvertedSelected | `colorNeutralBackgroundInvertedSelected` design token.",
+          "privacy": "public"
+        },
         {
           "kind": "variable",
           "name": "colorNeutralBackgroundStatic",
@@ -2391,6 +2511,16 @@
           "description": "CSS custom property value for the @fluentui/tokens#colorNeutralBackgroundDisabled | `colorNeutralBackgroundDisabled` design token.",
           "privacy": "public"
         },
+        {
+          "kind": "variable",
+          "name": "colorNeutralBackgroundDisabled2",
+          "type": {
+            "text": "string"
+          },
+          "default": "'var(--colorNeutralBackgroundDisabled2)'",
+          "description": "CSS custom property value for the @fluentui/tokens#colorNeutralBackgroundDisabled2 | `colorNeutralBackgroundDisabled2` design token.",
+          "privacy": "public"
+        },
         {
           "kind": "variable",
           "name": "colorNeutralBackgroundInvertedDisabled",
@@ -2781,6 +2911,46 @@
           "description": "CSS custom property value for the @fluentui/tokens#colorNeutralStroke3 | `colorNeutralStroke3` design token.",
           "privacy": "public"
         },
+        {
+          "kind": "variable",
+          "name": "colorNeutralStroke4",
+          "type": {
+            "text": "string"
+          },
+          "default": "'var(--colorNeutralStroke4)'",
+          "description": "CSS custom property value for the @fluentui/tokens#colorNeutralStroke4 | `colorNeutralStroke4` design token.",
+          "privacy": "public"
+        },
+        {
+          "kind": "variable",
+          "name": "colorNeutralStroke4Hover",
+          "type": {
+            "text": "string"
+          },
+          "default": "'var(--colorNeutralStroke4Hover)'",
+          "description": "CSS custom property value for the @fluentui/tokens#colorNeutralStroke4Hover | `colorNeutralStroke4Hover` design token.",
+          "privacy": "public"
+        },
+        {
+          "kind": "variable",
+          "name": "colorNeutralStroke4Pressed",
+          "type": {
+            "text": "string"
+          },
+          "default": "'var(--colorNeutralStroke4Pressed)'",
+          "description": "CSS custom property value for the @fluentui/tokens#colorNeutralStroke4Pressed | `colorNeutralStroke4Pressed` design token.",
+          "privacy": "public"
+        },
+        {
+          "kind": "variable",
+          "name": "colorNeutralStroke4Selected",
+          "type": {
+            "text": "string"
+          },
+          "default": "'var(--colorNeutralStroke4Selected)'",
+          "description": "CSS custom property value for the @fluentui/tokens#colorNeutralStroke4Selected | `colorNeutralStroke4Selected` design token.",
+          "privacy": "public"
+        },
         {
           "kind": "variable",
           "name": "colorNeutralStrokeSubtle",
@@ -2931,6 +3101,16 @@
           "description": "CSS custom property value for the @fluentui/tokens#colorNeutralStrokeDisabled | `colorNeutralStrokeDisabled` design token.",
           "privacy": "public"
         },
+        {
+          "kind": "variable",
+          "name": "colorNeutralStrokeDisabled2",
+          "type": {
+            "text": "string"
+          },
+          "default": "'var(--colorNeutralStrokeDisabled2)'",
+          "description": "CSS custom property value for the @fluentui/tokens#colorNeutralStrokeDisabled2 | `colorNeutralStrokeDisabled2` design token.",
+          "privacy": "public"
+        },
         {
           "kind": "variable",
           "name": "colorNeutralStrokeInvertedDisabled",
@@ -4961,6 +5141,56 @@
           "description": "CSS custom property value for the @fluentui/tokens#borderRadiusXLarge | `borderRadiusXLarge` design token.",
           "privacy": "public"
         },
+        {
+          "kind": "variable",
+          "name": "borderRadius2XLarge",
+          "type": {
+            "text": "string"
+          },
+          "default": "'var(--borderRadius2XLarge)'",
+          "description": "CSS custom property value for the @fluentui/tokens#borderRadius2XLarge | `borderRadius2XLarge` design token.",
+          "privacy": "public"
+        },
+        {
+          "kind": "variable",
+          "name": "borderRadius3XLarge",
+          "type": {
+            "text": "string"
+          },
+          "default": "'var(--borderRadius3XLarge)'",
+          "description": "CSS custom property value for the @fluentui/tokens#borderRadius3XLarge | `borderRadius3XLarge` design token.",
+          "privacy": "public"
+        },
+        {
+          "kind": "variable",
+          "name": "borderRadius4XLarge",
+          "type": {
+            "text": "string"
+          },
+          "default": "'var(--borderRadius4XLarge)'",
+          "description": "CSS custom property value for the @fluentui/tokens#borderRadius4XLarge | `borderRadius4XLarge` design token.",
+          "privacy": "public"
+        },
+        {
+          "kind": "variable",
+          "name": "borderRadius5XLarge",
+          "type": {
+            "text": "string"
+          },
+          "default": "'var(--borderRadius5XLarge)'",
+          "description": "CSS custom property value for the @fluentui/tokens#borderRadius5XLarge | `borderRadius5XLarge` design token.",
+          "privacy": "public"
+        },
+        {
+          "kind": "variable",
+          "name": "borderRadius6XLarge",
+          "type": {
+            "text": "string"
+          },
+          "default": "'var(--borderRadius6XLarge)'",
+          "description": "CSS custom property value for the @fluentui/tokens#borderRadius6XLarge | `borderRadius6XLarge` design token.",
+          "privacy": "public"
+        },
         {
           "kind": "variable",
           "name": "borderRadiusCircular",
@@ -6025,6 +6255,38 @@
             "module": "src/theme/design-tokens.ts"
           }
         },
+        {
+          "kind": "js",
+          "name": "colorNeutralForeground5",
+          "declaration": {
+            "name": "colorNeutralForeground5",
+            "module": "src/theme/design-tokens.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "colorNeutralForeground5Hover",
+          "declaration": {
+            "name": "colorNeutralForeground5Hover",
+            "module": "src/theme/design-tokens.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "colorNeutralForeground5Pressed",
+          "declaration": {
+            "name": "colorNeutralForeground5Pressed",
+            "module": "src/theme/design-tokens.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "colorNeutralForeground5Selected",
+          "declaration": {
+            "name": "colorNeutralForeground5Selected",
+            "module": "src/theme/design-tokens.ts"
+          }
+        },
         {
           "kind": "js",
           "name": "colorNeutralForegroundDisabled",
@@ -6481,6 +6743,46 @@
             "module": "src/theme/design-tokens.ts"
           }
         },
+        {
+          "kind": "js",
+          "name": "colorNeutralBackground7",
+          "declaration": {
+            "name": "colorNeutralBackground7",
+            "module": "src/theme/design-tokens.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "colorNeutralBackground7Hover",
+          "declaration": {
+            "name": "colorNeutralBackground7Hover",
+            "module": "src/theme/design-tokens.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "colorNeutralBackground7Pressed",
+          "declaration": {
+            "name": "colorNeutralBackground7Pressed",
+            "module": "src/theme/design-tokens.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "colorNeutralBackground7Selected",
+          "declaration": {
+            "name": "colorNeutralBackground7Selected",
+            "module": "src/theme/design-tokens.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "colorNeutralBackground8",
+          "declaration": {
+            "name": "colorNeutralBackground8",
+            "module": "src/theme/design-tokens.ts"
+          }
+        },
         {
           "kind": "js",
           "name": "colorNeutralBackgroundInverted",
@@ -6489,6 +6791,30 @@
             "module": "src/theme/design-tokens.ts"
           }
         },
+        {
+          "kind": "js",
+          "name": "colorNeutralBackgroundInvertedHover",
+          "declaration": {
+            "name": "colorNeutralBackgroundInvertedHover",
+            "module": "src/theme/design-tokens.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "colorNeutralBackgroundInvertedPressed",
+          "declaration": {
+            "name": "colorNeutralBackgroundInvertedPressed",
+            "module": "src/theme/design-tokens.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "colorNeutralBackgroundInvertedSelected",
+          "declaration": {
+            "name": "colorNeutralBackgroundInvertedSelected",
+            "module": "src/theme/design-tokens.ts"
+          }
+        },
         {
           "kind": "js",
           "name": "colorNeutralBackgroundStatic",
@@ -6641,6 +6967,14 @@
             "module": "src/theme/design-tokens.ts"
           }
         },
+        {
+          "kind": "js",
+          "name": "colorNeutralBackgroundDisabled2",
+          "declaration": {
+            "name": "colorNeutralBackgroundDisabled2",
+            "module": "src/theme/design-tokens.ts"
+          }
+        },
         {
           "kind": "js",
           "name": "colorNeutralBackgroundInvertedDisabled",
@@ -6955,55 +7289,87 @@
         },
         {
           "kind": "js",
-          "name": "colorNeutralStrokeSubtle",
+          "name": "colorNeutralStroke4",
           "declaration": {
-            "name": "colorNeutralStrokeSubtle",
+            "name": "colorNeutralStroke4",
             "module": "src/theme/design-tokens.ts"
           }
         },
         {
           "kind": "js",
-          "name": "colorNeutralStrokeOnBrand",
+          "name": "colorNeutralStroke4Hover",
           "declaration": {
-            "name": "colorNeutralStrokeOnBrand",
+            "name": "colorNeutralStroke4Hover",
             "module": "src/theme/design-tokens.ts"
           }
         },
         {
           "kind": "js",
-          "name": "colorNeutralStrokeOnBrand2",
+          "name": "colorNeutralStroke4Pressed",
           "declaration": {
-            "name": "colorNeutralStrokeOnBrand2",
+            "name": "colorNeutralStroke4Pressed",
             "module": "src/theme/design-tokens.ts"
           }
         },
         {
           "kind": "js",
-          "name": "colorNeutralStrokeOnBrand2Hover",
+          "name": "colorNeutralStroke4Selected",
           "declaration": {
-            "name": "colorNeutralStrokeOnBrand2Hover",
+            "name": "colorNeutralStroke4Selected",
             "module": "src/theme/design-tokens.ts"
           }
         },
         {
           "kind": "js",
-          "name": "colorNeutralStrokeOnBrand2Pressed",
+          "name": "colorNeutralStrokeSubtle",
           "declaration": {
-            "name": "colorNeutralStrokeOnBrand2Pressed",
+            "name": "colorNeutralStrokeSubtle",
             "module": "src/theme/design-tokens.ts"
           }
         },
         {
           "kind": "js",
-          "name": "colorNeutralStrokeOnBrand2Selected",
+          "name": "colorNeutralStrokeOnBrand",
           "declaration": {
-            "name": "colorNeutralStrokeOnBrand2Selected",
+            "name": "colorNeutralStrokeOnBrand",
             "module": "src/theme/design-tokens.ts"
           }
         },
         {
           "kind": "js",
-          "name": "colorBrandStroke1",
+          "name": "colorNeutralStrokeOnBrand2",
+          "declaration": {
+            "name": "colorNeutralStrokeOnBrand2",
+            "module": "src/theme/design-tokens.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "colorNeutralStrokeOnBrand2Hover",
+          "declaration": {
+            "name": "colorNeutralStrokeOnBrand2Hover",
+            "module": "src/theme/design-tokens.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "colorNeutralStrokeOnBrand2Pressed",
+          "declaration": {
+            "name": "colorNeutralStrokeOnBrand2Pressed",
+            "module": "src/theme/design-tokens.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "colorNeutralStrokeOnBrand2Selected",
+          "declaration": {
+            "name": "colorNeutralStrokeOnBrand2Selected",
+            "module": "src/theme/design-tokens.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "colorBrandStroke1",
           "declaration": {
             "name": "colorBrandStroke1",
             "module": "src/theme/design-tokens.ts"
@@ -7073,6 +7439,14 @@
             "module": "src/theme/design-tokens.ts"
           }
         },
+        {
+          "kind": "js",
+          "name": "colorNeutralStrokeDisabled2",
+          "declaration": {
+            "name": "colorNeutralStrokeDisabled2",
+            "module": "src/theme/design-tokens.ts"
+          }
+        },
         {
           "kind": "js",
           "name": "colorNeutralStrokeInvertedDisabled",
@@ -8697,6 +9071,46 @@
             "module": "src/theme/design-tokens.ts"
           }
         },
+        {
+          "kind": "js",
+          "name": "borderRadius2XLarge",
+          "declaration": {
+            "name": "borderRadius2XLarge",
+            "module": "src/theme/design-tokens.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "borderRadius3XLarge",
+          "declaration": {
+            "name": "borderRadius3XLarge",
+            "module": "src/theme/design-tokens.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "borderRadius4XLarge",
+          "declaration": {
+            "name": "borderRadius4XLarge",
+            "module": "src/theme/design-tokens.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "borderRadius5XLarge",
+          "declaration": {
+            "name": "borderRadius5XLarge",
+            "module": "src/theme/design-tokens.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "borderRadius6XLarge",
+          "declaration": {
+            "name": "borderRadius6XLarge",
+            "module": "src/theme/design-tokens.ts"
+          }
+        },
         {
           "kind": "js",
           "name": "borderRadiusCircular",
@@ -11799,6 +12213,7 @@
           "kind": "variable",
           "name": "badgeSizeStyles",
           "default": "css.partial` :host([size='tiny']) { width: 6px; height: 6px; font-size: 4px; line-height: 4px; padding-inline: 0; min-width: unset; } :host([size='tiny']) ::slotted(svg) { font-size: 6px; } :host([size='extra-small']) { width: 10px; height: 10px; font-size: 6px; line-height: 6px; padding-inline: 0; min-width: unset; } :host([size='extra-small']) ::slotted(svg) { font-size: 10px; } :host([size='small']) { min-width: 16px; height: 16px; font-size: ${fontSizeBase100}; line-height: ${lineHeightBase100}; padding-inline: calc(${spacingHorizontalXXS} + ${spacingHorizontalXXS}); } :host([size='small']) ::slotted(svg) { font-size: 12px; } :host([size='large']) { min-width: 24px; height: 24px; font-size: ${fontSizeBase200}; line-height: ${lineHeightBase200}; padding-inline: calc(${spacingHorizontalXS} + ${spacingHorizontalXXS}); } :host([size='large']) ::slotted(svg) { font-size: 16px; } :host([size='extra-large']) { min-width: 32px; height: 32px; font-size: ${fontSizeBase200}; line-height: ${lineHeightBase200}; padding-inline: calc(${spacingHorizontalSNudge} + ${spacingHorizontalXXS}); } :host([size='extra-large']) ::slotted(svg) { font-size: 20px; } `",
+          "description": "The badge's size styles",
           "privacy": "public"
         },
         {
@@ -13830,7 +14245,8 @@
               "type": {
                 "text": "HTMLDialogElement"
               },
-              "privacy": "public"
+              "privacy": "public",
+              "description": "The dialog element"
             },
             {
               "kind": "field",
@@ -13838,7 +14254,8 @@
               "type": {
                 "text": "string | undefined"
               },
-              "privacy": "public"
+              "privacy": "public",
+              "description": "The ID of the element that describes the dialog"
             },
             {
               "kind": "field",
@@ -13846,7 +14263,17 @@
               "type": {
                 "text": "string | undefined"
               },
-              "privacy": "public"
+              "privacy": "public",
+              "description": "The ID of the element that labels the dialog"
+            },
+            {
+              "kind": "field",
+              "name": "ariaLabel",
+              "type": {
+                "text": "string | null"
+              },
+              "privacy": "public",
+              "description": "The label of the dialog"
             },
             {
               "kind": "field",
@@ -13855,6 +14282,7 @@
                 "text": "DialogType"
               },
               "privacy": "public",
+              "description": "The type of the dialog modal",
               "parsedType": {
                 "text": "'modal' | 'non-modal' | 'alert'"
               }
@@ -13881,12 +14309,14 @@
             {
               "kind": "field",
               "name": "emitBeforeToggle",
-              "privacy": "public"
+              "privacy": "public",
+              "description": "Method to emit an event before the dialog's open state changes\nHTML spec proposal: https://github.com/whatwg/html/issues/9733"
             },
             {
               "kind": "field",
               "name": "emitToggle",
-              "privacy": "public"
+              "privacy": "public",
+              "description": "Method to emit an event after the dialog's open state changes\nHTML spec proposal: https://github.com/whatwg/html/issues/9733"
             },
             {
               "kind": "method",
@@ -13896,7 +14326,8 @@
                 "type": {
                   "text": "void"
                 }
-              }
+              },
+              "description": "Method to show the dialog"
             },
             {
               "kind": "method",
@@ -13906,7 +14337,8 @@
                 "type": {
                   "text": "void"
                 }
-              }
+              },
+              "description": "Method to hide the dialog"
             },
             {
               "kind": "method",
@@ -13925,7 +14357,8 @@
                   },
                   "description": "The click event"
                 }
-              ]
+              ],
+              "description": "Handles click events on the dialog overlay for light-dismiss"
             }
           ],
           "attributes": [
@@ -13934,6 +14367,7 @@
               "type": {
                 "text": "string | undefined"
               },
+              "description": "The ID of the element that describes the dialog",
               "fieldName": "ariaDescribedby"
             },
             {
@@ -13941,13 +14375,23 @@
               "type": {
                 "text": "string | undefined"
               },
+              "description": "The ID of the element that labels the dialog",
               "fieldName": "ariaLabelledby"
             },
+            {
+              "name": "aria-label",
+              "type": {
+                "text": "string | null"
+              },
+              "description": "The label of the dialog",
+              "fieldName": "ariaLabel"
+            },
             {
               "name": "type",
               "type": {
                 "text": "DialogType"
               },
+              "description": "The type of the dialog modal",
               "fieldName": "type",
               "parsedType": {
                 "text": "'modal' | 'non-modal' | 'alert'"
@@ -14275,6 +14719,7 @@
                 "text": "DrawerType"
               },
               "privacy": "public",
+              "description": "Determines whether the drawer should be displayed as modal or non-modal\nWhen rendered as a modal, an overlay is applied over the rest of the view.",
               "parsedType": {
                 "text": "'inline' | 'modal' | 'non-modal'"
               }
@@ -14290,7 +14735,8 @@
               "type": {
                 "text": "string | undefined"
               },
-              "privacy": "public"
+              "privacy": "public",
+              "description": "The ID of the element that labels the drawer."
             },
             {
               "kind": "field",
@@ -14298,7 +14744,8 @@
               "type": {
                 "text": "string | undefined"
               },
-              "privacy": "public"
+              "privacy": "public",
+              "description": "The ID of the element that describes the drawer."
             },
             {
               "kind": "field",
@@ -14329,17 +14776,20 @@
               "type": {
                 "text": "HTMLDialogElement"
               },
-              "privacy": "public"
+              "privacy": "public",
+              "description": "The dialog element."
             },
             {
               "kind": "field",
               "name": "emitToggle",
-              "privacy": "public"
+              "privacy": "public",
+              "description": "Method to emit an event after the dialog's open state changes\nHTML spec proposal: https://github.com/whatwg/html/issues/9733"
             },
             {
               "kind": "field",
               "name": "emitBeforeToggle",
-              "privacy": "public"
+              "privacy": "public",
+              "description": "Method to emit an event before the dialog's open state changes\nHTML spec proposal: https://github.com/whatwg/html/issues/9733"
             },
             {
               "kind": "method",
@@ -14349,7 +14799,8 @@
                 "type": {
                   "text": "void"
                 }
-              }
+              },
+              "description": "Method to show the drawer"
             },
             {
               "kind": "method",
@@ -14359,7 +14810,8 @@
                 "type": {
                   "text": "void"
                 }
-              }
+              },
+              "description": "Method to hide the drawer"
             },
             {
               "kind": "method",
@@ -14383,7 +14835,8 @@
             {
               "kind": "method",
               "name": "cancelHandler",
-              "privacy": "public"
+              "privacy": "public",
+              "description": "Handles cancel events on the drawer."
             },
             {
               "kind": "method",
@@ -14456,6 +14909,7 @@
               "type": {
                 "text": "DrawerType"
               },
+              "description": "Determines whether the drawer should be displayed as modal or non-modal\nWhen rendered as a modal, an overlay is applied over the rest of the view.",
               "fieldName": "type",
               "parsedType": {
                 "text": "'inline' | 'modal' | 'non-modal'"
@@ -14466,6 +14920,7 @@
               "type": {
                 "text": "string | undefined"
               },
+              "description": "The ID of the element that labels the drawer.",
               "fieldName": "ariaLabelledby"
             },
             {
@@ -14473,6 +14928,7 @@
               "type": {
                 "text": "string | undefined"
               },
+              "description": "The ID of the element that describes the drawer.",
               "fieldName": "ariaDescribedby"
             },
             {
@@ -19014,7 +19470,8 @@
             {
               "kind": "field",
               "name": "dismissMessageBar",
-              "privacy": "public"
+              "privacy": "public",
+              "description": "Method to emit a `dismiss` event when the message bar is dismissed"
             },
             {
               "kind": "field",
@@ -19098,7 +19555,7 @@
               },
               "privacy": "public",
               "default": "null",
-              "description": "The validation state of the progress bar",
+              "description": "The validation state of the progress bar\nThe validation state of the progress bar\n\nHTML Attribute: `validation-state`",
               "parsedType": {
                 "text": "'success' | 'warning' | 'error' | null"
               }
@@ -19173,7 +19630,7 @@
                 "text": "ProgressBarValidationState | null"
               },
               "default": "null",
-              "description": "The validation state of the progress bar",
+              "description": "The validation state of the progress bar\nThe validation state of the progress bar\n\nHTML Attribute: `validation-state`",
               "fieldName": "validationState",
               "parsedType": {
                 "text": "'success' | 'warning' | 'error' | null"
@@ -19216,7 +19673,7 @@
                 "text": "ProgressBarThickness | undefined"
               },
               "privacy": "public",
-              "description": "The thickness of the progress bar",
+              "description": "The thickness of the progress bar\n\nThe thickness of the progress bar\n\nHTML Attribute: `thickness`",
               "parsedType": {
                 "text": "'medium' | 'large' | undefined"
               }
@@ -19228,7 +19685,7 @@
                 "text": "ProgressBarShape | undefined"
               },
               "privacy": "public",
-              "description": "The shape of the progress bar",
+              "description": "The shape of the progress bar\nThe shape of the progress bar\n\nHTML Attribute: `shape`",
               "parsedType": {
                 "text": "'rounded' | 'square' | undefined"
               }
@@ -19241,7 +19698,7 @@
               },
               "privacy": "public",
               "default": "null",
-              "description": "The validation state of the progress bar",
+              "description": "The validation state of the progress bar\nThe validation state of the progress bar\n\nHTML Attribute: `validation-state`",
               "parsedType": {
                 "text": "'success' | 'warning' | 'error' | null"
               },
@@ -19335,7 +19792,7 @@
               "type": {
                 "text": "ProgressBarThickness | undefined"
               },
-              "description": "The thickness of the progress bar",
+              "description": "The thickness of the progress bar\n\nThe thickness of the progress bar\n\nHTML Attribute: `thickness`",
               "fieldName": "thickness",
               "parsedType": {
                 "text": "'medium' | 'large' | undefined"
@@ -19346,7 +19803,7 @@
               "type": {
                 "text": "ProgressBarShape | undefined"
               },
-              "description": "The shape of the progress bar",
+              "description": "The shape of the progress bar\nThe shape of the progress bar\n\nHTML Attribute: `shape`",
               "fieldName": "shape",
               "parsedType": {
                 "text": "'rounded' | 'square' | undefined"
@@ -19358,7 +19815,7 @@
                 "text": "ProgressBarValidationState | null"
               },
               "default": "null",
-              "description": "The validation state of the progress bar",
+              "description": "The validation state of the progress bar\nThe validation state of the progress bar\n\nHTML Attribute: `validation-state`",
               "fieldName": "validationState",
               "parsedType": {
                 "text": "'success' | 'warning' | 'error' | null"
@@ -21777,1116 +22234,69 @@
               "kind": "method",
               "name": "setCustomValidity",
               "privacy": "public",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "message",
-                  "type": {
-                    "text": "string"
-                  },
-                  "description": "The message to set"
-                }
-              ],
-              "description": "Sets a custom validity message.",
-              "inheritedFrom": {
-                "name": "BaseCheckbox",
-                "module": "src/checkbox/checkbox.base.ts"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "toggleChecked",
-              "privacy": "public",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "force",
-                  "default": "!this.checked",
-                  "type": {
-                    "text": "boolean"
-                  },
-                  "description": "Forces the element to be checked or unchecked"
-                }
-              ],
-              "description": "Toggles the checked state of the control.",
-              "inheritedFrom": {
-                "name": "BaseCheckbox",
-                "module": "src/checkbox/checkbox.base.ts"
-              }
-            }
-          ],
-          "superclass": {
-            "name": "BaseCheckbox",
-            "module": "/src/checkbox/checkbox.base.js"
-          },
-          "tagName": "fluent-switch",
-          "customElement": true,
-          "attributes": [
-            {
-              "name": "autofocus",
-              "type": {
-                "text": "boolean"
-              },
-              "description": "Indicates that the element should get focus after the page finishes loading.",
-              "fieldName": "autofocus",
-              "inheritedFrom": {
-                "name": "BaseCheckbox",
-                "module": "src/checkbox/checkbox.base.ts"
-              }
-            },
-            {
-              "name": "disabled",
-              "type": {
-                "text": "boolean | undefined"
-              },
-              "description": "The initial disabled state of the control.",
-              "fieldName": "disabledAttribute",
-              "inheritedFrom": {
-                "name": "BaseCheckbox",
-                "module": "src/checkbox/checkbox.base.ts"
-              }
-            },
-            {
-              "name": "form",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "The id of a form to associate the element to.",
-              "fieldName": "formAttribute",
-              "inheritedFrom": {
-                "name": "BaseCheckbox",
-                "module": "src/checkbox/checkbox.base.ts"
-              }
-            },
-            {
-              "name": "checked",
-              "type": {
-                "text": "boolean | undefined"
-              },
-              "description": "The initial checked state of the element.",
-              "fieldName": "initialChecked",
-              "inheritedFrom": {
-                "name": "BaseCheckbox",
-                "module": "src/checkbox/checkbox.base.ts"
-              }
-            },
-            {
-              "name": "value",
-              "type": {
-                "text": "string"
-              },
-              "default": "'on'",
-              "description": "The initial value of the input.",
-              "fieldName": "initialValue",
-              "inheritedFrom": {
-                "name": "BaseCheckbox",
-                "module": "src/checkbox/checkbox.base.ts"
-              }
-            },
-            {
-              "name": "name",
-              "type": {
-                "text": "string"
-              },
-              "description": "The name of the element. This element's value will be surfaced during form submission under the provided name.",
-              "fieldName": "name",
-              "inheritedFrom": {
-                "name": "BaseCheckbox",
-                "module": "src/checkbox/checkbox.base.ts"
-              }
-            },
-            {
-              "name": "required",
-              "type": {
-                "text": "boolean"
-              },
-              "description": "The element's required state.",
-              "fieldName": "required",
-              "inheritedFrom": {
-                "name": "BaseCheckbox",
-                "module": "src/checkbox/checkbox.base.ts"
-              }
-            }
-          ],
-          "modulePath": "./dist/esm/switch/switch.js",
-          "definitionPath": "./dist/esm/switch/define.js",
-          "cssProperties": [],
-          "cssParts": [],
-          "cssStates": [],
-          "events": [],
-          "slots": []
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "Switch",
-          "declaration": {
-            "name": "Switch",
-            "module": "src/switch/switch.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "./dist/esm/tab-panel/tab-panel.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "TabPanel",
-          "superclass": {
-            "name": "FASTElement",
-            "package": "@microsoft/fast-element"
-          },
-          "deprecated": "- Use tablist instead",
-          "tagName": "fluent-tab-panel",
-          "customElement": true,
-          "modulePath": "./dist/esm/tab-panel/tab-panel.js",
-          "definitionPath": "./dist/esm/tab-panel/define.js"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "TabPanel",
-          "declaration": {
-            "name": "TabPanel",
-            "module": "src/tab-panel/tab-panel.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "./dist/esm/tab/tab.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "Tab extends the FASTTab and is a child of the TabList",
-          "name": "Tab",
-          "members": [
-            {
-              "kind": "field",
-              "name": "disabled",
-              "type": {
-                "text": "boolean"
-              },
-              "privacy": "public",
-              "description": "When true, the control will be immutable by user interaction. See https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/disabled | disabled HTML attribute for more information."
-            },
-            {
-              "kind": "field",
-              "name": "styles",
-              "type": {
-                "text": "ElementStyles | undefined"
-              },
-              "privacy": "private"
-            }
-          ],
-          "attributes": [
-            {
-              "name": "disabled",
-              "type": {
-                "text": "boolean"
-              },
-              "description": "When true, the control will be immutable by user interaction. See https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/disabled | disabled HTML attribute for more information.",
-              "fieldName": "disabled"
-            }
-          ],
-          "superclass": {
-            "name": "FASTElement",
-            "package": "@microsoft/fast-element"
-          },
-          "tagName": "fluent-tab",
-          "customElement": true,
-          "modulePath": "./dist/esm/tab/tab.js",
-          "definitionPath": "./dist/esm/tab/define.js"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "Tab",
-          "declaration": {
-            "name": "Tab",
-            "module": "src/tab/tab.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "./dist/esm/tabs/tabs.base.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "A Tabs component that wraps a collection of tab and tab panel elements.",
-          "name": "BaseTabs",
-          "members": [
-            {
-              "kind": "field",
-              "name": "orientation",
-              "type": {
-                "text": "TabsOrientation"
-              },
-              "privacy": "public",
-              "description": "The orientation",
-              "parsedType": {
-                "text": "'horizontal' | 'vertical'"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "activeid",
-              "type": {
-                "text": "string"
-              },
-              "privacy": "public",
-              "description": "The id of the active tab"
-            },
-            {
-              "kind": "field",
-              "name": "activetab",
-              "type": {
-                "text": "HTMLElement"
-              },
-              "privacy": "public",
-              "description": "A reference to the active tab"
-            },
-            {
-              "kind": "field",
-              "name": "prevActiveTabIndex",
-              "type": {
-                "text": "number"
-              },
-              "privacy": "private",
-              "default": "0"
-            },
-            {
-              "kind": "field",
-              "name": "activeTabIndex",
-              "type": {
-                "text": "number"
-              },
-              "privacy": "private",
-              "default": "0"
-            },
-            {
-              "kind": "field",
-              "name": "tabIds",
-              "type": {
-                "text": "Array<string>"
-              },
-              "privacy": "private"
-            },
-            {
-              "kind": "field",
-              "name": "tabpanelIds",
-              "type": {
-                "text": "Array<string>"
-              },
-              "privacy": "private"
-            },
-            {
-              "kind": "field",
-              "name": "change",
-              "privacy": "private"
-            },
-            {
-              "kind": "field",
-              "name": "isDisabledElement",
-              "privacy": "private"
-            },
-            {
-              "kind": "field",
-              "name": "isHiddenElement",
-              "privacy": "private"
-            },
-            {
-              "kind": "field",
-              "name": "isFocusableElement",
-              "privacy": "private"
-            },
-            {
-              "kind": "method",
-              "name": "getActiveIndex",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "number"
-                }
-              }
-            },
-            {
-              "kind": "method",
-              "name": "setTabs",
-              "privacy": "public",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "description": "Function that is invoked whenever the selected tab or the tab collection changes."
-            },
-            {
-              "kind": "method",
-              "name": "setTabPanels",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              }
-            },
-            {
-              "kind": "method",
-              "name": "getTabIds",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "Array<string>"
-                }
-              }
-            },
-            {
-              "kind": "method",
-              "name": "getTabPanelIds",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "Array<string>"
-                }
-              }
-            },
-            {
-              "kind": "method",
-              "name": "setComponent",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              }
-            },
-            {
-              "kind": "field",
-              "name": "handleTabClick",
-              "privacy": "private"
-            },
-            {
-              "kind": "method",
-              "name": "isHorizontal",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "boolean"
-                }
-              }
-            },
-            {
-              "kind": "field",
-              "name": "handleTabKeyDown",
-              "privacy": "private"
-            },
-            {
-              "kind": "method",
-              "name": "adjust",
-              "privacy": "public",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "adjustment",
-                  "type": {
-                    "text": "number"
-                  }
-                }
-              ],
-              "description": "The adjust method for FASTTabs"
-            },
-            {
-              "kind": "method",
-              "name": "adjustForward",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "KeyboardEvent"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "adjustBackward",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "KeyboardEvent"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "moveToTabByIndex",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "group",
-                  "type": {
-                    "text": "HTMLElement[]"
-                  }
-                },
-                {
-                  "name": "index",
-                  "type": {
-                    "text": "number"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "focusTab",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              }
-            }
-          ],
-          "attributes": [
-            {
-              "name": "orientation",
-              "type": {
-                "text": "TabsOrientation"
-              },
-              "description": "The orientation",
-              "fieldName": "orientation",
-              "parsedType": {
-                "text": "'horizontal' | 'vertical'"
-              }
-            },
-            {
-              "name": "activeid",
-              "type": {
-                "text": "string"
-              },
-              "description": "The id of the active tab",
-              "fieldName": "activeid"
-            }
-          ],
-          "superclass": {
-            "name": "FASTElement",
-            "package": "@microsoft/fast-element"
-          },
-          "deprecated": "- use tablist instead",
-          "customElement": true,
-          "modulePath": "./dist/esm/tabs/tabs.base.js",
-          "definitionPath": "./dist/esm/tabs/define.js"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "BaseTabs",
-          "declaration": {
-            "name": "BaseTabs",
-            "module": "src/tabs/tabs.base.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "./dist/esm/tabs/tabs.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "Tabs",
-          "members": [
-            {
-              "kind": "field",
-              "name": "activeTabData",
-              "type": {
-                "text": "TabData"
-              },
-              "privacy": "private",
-              "default": "{ x: 0, y: 0, height: 0, width: 0 }",
-              "description": "activeTabData\nThe positional coordinates and size dimensions of the active tab. Used for calculating the offset and scale of the tab active indicator."
-            },
-            {
-              "kind": "field",
-              "name": "previousActiveTabData",
-              "type": {
-                "text": "TabData"
-              },
-              "privacy": "private",
-              "default": "{ x: 0, y: 0, height: 0, width: 0 }",
-              "description": "previousActiveTabData\nThe positional coordinates and size dimensions of the active tab. Used for calculating the offset and scale of the tab active indicator."
-            },
-            {
-              "kind": "field",
-              "name": "activeTabOffset",
-              "type": {
-                "text": "number"
-              },
-              "privacy": "private",
-              "default": "0",
-              "description": "activeTabOffset\nUsed to position the active indicator for animations of the active indicator on active tab changes."
-            },
-            {
-              "kind": "field",
-              "name": "activeTabScale",
-              "type": {
-                "text": "number"
-              },
-              "privacy": "private",
-              "default": "1",
-              "description": "activeTabScale\nUsed to scale the tab active indicator up or down as animations of the active indicator occur."
-            },
-            {
-              "kind": "field",
-              "name": "styles",
-              "type": {
-                "text": "ElementStyles | undefined"
-              },
-              "privacy": "private",
-              "description": "styles\nused in the class for storing the css variables required for animations"
-            },
-            {
-              "kind": "field",
-              "name": "appearance",
-              "type": {
-                "text": "TabsAppearance | undefined"
-              },
-              "privacy": "public",
-              "description": "appearance\nThere are two modes of appearance: transparent and subtle.",
-              "parsedType": {
-                "text": "'subtle' | 'transparent' | undefined"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "disabled",
-              "type": {
-                "text": "boolean | undefined"
-              },
-              "privacy": "public",
-              "description": "disabled\nUsed for disabling all click and keyboard events for the tabs, child tab elements and tab panel elements. UI styling of content and tabs will appear as \"grayed out.\""
-            },
-            {
-              "kind": "field",
-              "name": "size",
-              "type": {
-                "text": "TabsSize | undefined"
-              },
-              "privacy": "public",
-              "description": "size\ndefaults to medium.\nUsed to set the size of all the tab controls, which effects text size and margins. Three sizes: small, medium and large.",
-              "parsedType": {
-                "text": "'small' | 'medium' | 'large' | undefined"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "calculateAnimationProperties",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "tab",
-                  "type": {
-                    "text": "Tab"
-                  }
-                }
-              ],
-              "description": "calculateAnimationProperties\n\nRecalculates the active tab offset and scale.\nThese values will be applied to css variables that control the tab active indicator position animations"
-            },
-            {
-              "kind": "method",
-              "name": "getTabPosition",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "number"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "tab",
-                  "type": {
-                    "text": "Tab"
-                  }
-                }
-              ],
-              "description": "getSelectedTabPosition - gets the x or y coordinates of the tab"
-            },
-            {
-              "kind": "method",
-              "name": "getTabScale",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "number"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "tab",
-                  "type": {
-                    "text": "Tab"
-                  }
-                }
-              ],
-              "description": "getSelectedTabScale - gets the scale of the tab"
-            },
-            {
-              "kind": "method",
-              "name": "getTabPositionData",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": ""
-                }
-              },
-              "parameters": [
-                {
-                  "name": "tab",
-                  "type": {
-                    "text": "HTMLElement"
-                  },
-                  "description": "The tab element to get position data for"
-                }
-              ],
-              "description": "Gets the position data for a tab element relative to its parent"
-            },
-            {
-              "kind": "method",
-              "name": "setTabOffsetCSSVar",
-              "privacy": "private"
-            },
-            {
-              "kind": "method",
-              "name": "setTabScaleCSSVar",
-              "privacy": "private"
-            },
-            {
-              "kind": "method",
-              "name": "activeidChanged",
-              "privacy": "public",
-              "parameters": [
-                {
-                  "name": "oldValue",
-                  "type": {
-                    "text": "string"
-                  }
-                },
-                {
-                  "name": "newValue",
-                  "type": {
-                    "text": "string"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "tabsChanged",
-              "privacy": "public",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              }
-            },
-            {
-              "kind": "field",
-              "name": "orientation",
-              "type": {
-                "text": "TabsOrientation"
-              },
-              "privacy": "public",
-              "description": "The orientation",
-              "parsedType": {
-                "text": "'horizontal' | 'vertical'"
-              },
-              "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "activeid",
-              "type": {
-                "text": "string"
-              },
-              "privacy": "public",
-              "description": "The id of the active tab",
-              "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "activetab",
-              "type": {
-                "text": "HTMLElement"
-              },
-              "privacy": "public",
-              "description": "A reference to the active tab",
-              "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "prevActiveTabIndex",
-              "type": {
-                "text": "number"
-              },
-              "privacy": "private",
-              "default": "0",
-              "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "activeTabIndex",
-              "type": {
-                "text": "number"
-              },
-              "privacy": "private",
-              "default": "0",
-              "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "tabIds",
-              "type": {
-                "text": "Array<string>"
-              },
-              "privacy": "private",
-              "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "tabpanelIds",
-              "type": {
-                "text": "Array<string>"
-              },
-              "privacy": "private",
-              "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "change",
-              "privacy": "private",
-              "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "isDisabledElement",
-              "privacy": "private",
-              "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "isHiddenElement",
-              "privacy": "private",
-              "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "isFocusableElement",
-              "privacy": "private",
-              "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "getActiveIndex",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "number"
-                }
-              },
-              "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "setTabs",
-              "privacy": "public",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "description": "Function that is invoked whenever the selected tab or the tab collection changes.",
-              "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "setTabPanels",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "getTabIds",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "Array<string>"
-                }
-              },
-              "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "getTabPanelIds",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "Array<string>"
-                }
-              },
-              "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "setComponent",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "handleTabClick",
-              "privacy": "private",
-              "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "isHorizontal",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "boolean"
-                }
-              },
-              "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "handleTabKeyDown",
-              "privacy": "private",
-              "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "adjust",
-              "privacy": "public",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "adjustment",
-                  "type": {
-                    "text": "number"
-                  }
-                }
-              ],
-              "description": "The adjust method for FASTTabs",
-              "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "adjustForward",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "KeyboardEvent"
-                  }
-                }
-              ],
-              "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "adjustBackward",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "KeyboardEvent"
-                  }
-                }
-              ],
-              "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
-              }
-            },
-            {
-              "kind": "method",
-              "name": "moveToTabByIndex",
-              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
               "parameters": [
                 {
-                  "name": "group",
-                  "type": {
-                    "text": "HTMLElement[]"
-                  }
-                },
-                {
-                  "name": "index",
+                  "name": "message",
                   "type": {
-                    "text": "number"
-                  }
+                    "text": "string"
+                  },
+                  "description": "The message to set"
                 }
               ],
+              "description": "Sets a custom validity message.",
               "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
+                "name": "BaseCheckbox",
+                "module": "src/checkbox/checkbox.base.ts"
               }
             },
             {
               "kind": "method",
-              "name": "focusTab",
-              "privacy": "private",
+              "name": "toggleChecked",
+              "privacy": "public",
               "return": {
                 "type": {
                   "text": "void"
                 }
               },
+              "parameters": [
+                {
+                  "name": "force",
+                  "default": "!this.checked",
+                  "type": {
+                    "text": "boolean"
+                  },
+                  "description": "Forces the element to be checked or unchecked"
+                }
+              ],
+              "description": "Toggles the checked state of the control.",
               "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
+                "name": "BaseCheckbox",
+                "module": "src/checkbox/checkbox.base.ts"
               }
             }
           ],
+          "superclass": {
+            "name": "BaseCheckbox",
+            "module": "/src/checkbox/checkbox.base.js"
+          },
+          "tagName": "fluent-switch",
+          "customElement": true,
           "attributes": [
             {
-              "name": "appearance",
+              "name": "autofocus",
               "type": {
-                "text": "TabsAppearance | undefined"
+                "text": "boolean"
               },
-              "description": "appearance\nThere are two modes of appearance: transparent and subtle.",
-              "fieldName": "appearance",
-              "parsedType": {
-                "text": "'subtle' | 'transparent' | undefined"
+              "description": "Indicates that the element should get focus after the page finishes loading.",
+              "fieldName": "autofocus",
+              "inheritedFrom": {
+                "name": "BaseCheckbox",
+                "module": "src/checkbox/checkbox.base.ts"
               }
             },
             {
@@ -22894,57 +22304,77 @@
               "type": {
                 "text": "boolean | undefined"
               },
-              "description": "disabled\nUsed for disabling all click and keyboard events for the tabs, child tab elements and tab panel elements. UI styling of content and tabs will appear as \"grayed out.\"",
-              "fieldName": "disabled"
+              "description": "The initial disabled state of the control.",
+              "fieldName": "disabledAttribute",
+              "inheritedFrom": {
+                "name": "BaseCheckbox",
+                "module": "src/checkbox/checkbox.base.ts"
+              }
             },
             {
-              "name": "size",
+              "name": "form",
               "type": {
-                "text": "TabsSize | undefined"
+                "text": "string | undefined"
               },
-              "description": "size\ndefaults to medium.\nUsed to set the size of all the tab controls, which effects text size and margins. Three sizes: small, medium and large.",
-              "fieldName": "size",
-              "parsedType": {
-                "text": "'small' | 'medium' | 'large' | undefined"
+              "description": "The id of a form to associate the element to.",
+              "fieldName": "formAttribute",
+              "inheritedFrom": {
+                "name": "BaseCheckbox",
+                "module": "src/checkbox/checkbox.base.ts"
               }
             },
             {
-              "name": "orientation",
+              "name": "checked",
               "type": {
-                "text": "TabsOrientation"
+                "text": "boolean | undefined"
               },
-              "description": "The orientation",
-              "fieldName": "orientation",
-              "parsedType": {
-                "text": "'horizontal' | 'vertical'"
+              "description": "The initial checked state of the element.",
+              "fieldName": "initialChecked",
+              "inheritedFrom": {
+                "name": "BaseCheckbox",
+                "module": "src/checkbox/checkbox.base.ts"
+              }
+            },
+            {
+              "name": "value",
+              "type": {
+                "text": "string"
               },
+              "default": "'on'",
+              "description": "The initial value of the input.",
+              "fieldName": "initialValue",
               "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
+                "name": "BaseCheckbox",
+                "module": "src/checkbox/checkbox.base.ts"
               }
             },
             {
-              "name": "activeid",
+              "name": "name",
               "type": {
                 "text": "string"
               },
-              "description": "The id of the active tab",
-              "fieldName": "activeid",
+              "description": "The name of the element. This element's value will be surfaced during form submission under the provided name.",
+              "fieldName": "name",
+              "inheritedFrom": {
+                "name": "BaseCheckbox",
+                "module": "src/checkbox/checkbox.base.ts"
+              }
+            },
+            {
+              "name": "required",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "The element's required state.",
+              "fieldName": "required",
               "inheritedFrom": {
-                "name": "BaseTabs",
-                "module": "src/tabs/tabs.base.ts"
+                "name": "BaseCheckbox",
+                "module": "src/checkbox/checkbox.base.ts"
               }
             }
           ],
-          "superclass": {
-            "name": "BaseTabs",
-            "module": "/src/tabs/tabs.base.js"
-          },
-          "deprecated": "- Use tablist instead",
-          "tagName": "fluent-tabs",
-          "customElement": true,
-          "modulePath": "./dist/esm/tabs/tabs.js",
-          "definitionPath": "./dist/esm/tabs/define.js",
+          "modulePath": "./dist/esm/switch/switch.js",
+          "definitionPath": "./dist/esm/switch/define.js",
           "cssProperties": [],
           "cssParts": [],
           "cssStates": [],
@@ -22955,10 +22385,68 @@
       "exports": [
         {
           "kind": "js",
-          "name": "Tabs",
+          "name": "Switch",
+          "declaration": {
+            "name": "Switch",
+            "module": "src/switch/switch.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "./dist/esm/tab/tab.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "Tab extends the FASTTab and is a child of the TabList",
+          "name": "Tab",
+          "members": [
+            {
+              "kind": "field",
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "privacy": "public",
+              "description": "When true, the control will be immutable by user interaction. See https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/disabled | disabled HTML attribute for more information."
+            },
+            {
+              "kind": "field",
+              "name": "styles",
+              "type": {
+                "text": "ElementStyles | undefined"
+              },
+              "privacy": "private"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "When true, the control will be immutable by user interaction. See https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/disabled | disabled HTML attribute for more information.",
+              "fieldName": "disabled"
+            }
+          ],
+          "superclass": {
+            "name": "FASTElement",
+            "package": "@microsoft/fast-element"
+          },
+          "tagName": "fluent-tab",
+          "customElement": true,
+          "modulePath": "./dist/esm/tab/tab.js",
+          "definitionPath": "./dist/esm/tab/define.js"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "Tab",
           "declaration": {
-            "name": "Tabs",
-            "module": "src/tabs/tabs.ts"
+            "name": "Tab",
+            "module": "src/tab/tab.ts"
           }
         }
       ]
@@ -27831,7 +27319,7 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "When true, the control will be appear expanded by user interaction.",
+              "description": "When true, the control will be appear expanded by user interaction.\nWhen true, the control will be appear expanded by user interaction.\n\nHTML Attribute: `expanded`",
               "privacy": "public"
             },
             {
@@ -27879,7 +27367,7 @@
               },
               "privacy": "public",
               "default": "false",
-              "description": "When true, the control has no child tree items"
+              "description": "When true, the control has no child tree items\nWhen true, the control has no child tree items\n\nHTML Attribute: empty"
             },
             {
               "kind": "field",
@@ -27975,7 +27463,7 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "When true, the control will be appear expanded by user interaction.",
+              "description": "When true, the control will be appear expanded by user interaction.\nWhen true, the control will be appear expanded by user interaction.\n\nHTML Attribute: `expanded`",
               "fieldName": "expanded"
             },
             {
@@ -27993,7 +27481,7 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "When true, the control has no child tree items",
+              "description": "When true, the control has no child tree items\nWhen true, the control has no child tree items\n\nHTML Attribute: empty",
               "fieldName": "empty"
             },
             {
@@ -28071,7 +27559,7 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "When true, the control will be appear expanded by user interaction.",
+              "description": "When true, the control will be appear expanded by user interaction.\nWhen true, the control will be appear expanded by user interaction.\n\nHTML Attribute: `expanded`",
               "privacy": "public",
               "inheritedFrom": {
                 "name": "BaseTreeItem",
@@ -28131,7 +27619,7 @@
               },
               "privacy": "public",
               "default": "false",
-              "description": "When true, the control has no child tree items",
+              "description": "When true, the control has no child tree items\nWhen true, the control has no child tree items\n\nHTML Attribute: empty",
               "inheritedFrom": {
                 "name": "BaseTreeItem",
                 "module": "src/tree-item/tree-item.base.ts"
@@ -28289,7 +27777,7 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "When true, the control will be appear expanded by user interaction.",
+              "description": "When true, the control will be appear expanded by user interaction.\nWhen true, the control will be appear expanded by user interaction.\n\nHTML Attribute: `expanded`",
               "fieldName": "expanded",
               "inheritedFrom": {
                 "name": "BaseTreeItem",
@@ -28315,7 +27803,7 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "When true, the control has no child tree items",
+              "description": "When true, the control has no child tree items\nWhen true, the control has no child tree items\n\nHTML Attribute: empty",
               "fieldName": "empty",
               "inheritedFrom": {
                 "name": "BaseTreeItem",
@@ -28472,7 +27960,7 @@
                 "text": "TreeItemSize"
               },
               "privacy": "public",
-              "description": "The size of the tree item element",
+              "description": "The size of the tree item element\nThe size of the tree item element\n\nHTML Attribute: size",
               "parsedType": {
                 "text": "'small' | 'medium'"
               }
@@ -28489,7 +27977,7 @@
                 "text": "TreeItemAppearance"
               },
               "privacy": "public",
-              "description": "The appearance variants of the tree item element",
+              "description": "The appearance variants of the tree item element\nThe appearance variants of the tree item element\n\nHTML Attribute: appearance",
               "parsedType": {
                 "text": "'subtle' | 'transparent' | 'subtle-alpha'"
               }
@@ -28601,7 +28089,7 @@
               "type": {
                 "text": "TreeItemSize"
               },
-              "description": "The size of the tree item element",
+              "description": "The size of the tree item element\nThe size of the tree item element\n\nHTML Attribute: size",
               "fieldName": "size",
               "parsedType": {
                 "text": "'small' | 'medium'"
@@ -28612,7 +28100,7 @@
               "type": {
                 "text": "TreeItemAppearance"
               },
-              "description": "The appearance variants of the tree item element",
+              "description": "The appearance variants of the tree item element\nThe appearance variants of the tree item element\n\nHTML Attribute: appearance",
               "fieldName": "appearance",
               "parsedType": {
                 "text": "'subtle' | 'transparent' | 'subtle-alpha'"
@@ -28647,15 +28135,57 @@
     },
     {
       "kind": "javascript-module",
-      "path": "src/index-rollup.ts",
-      "declarations": [],
-      "exports": []
+      "path": "src/theme/set-theme.ts",
+      "declarations": [
+        {
+          "kind": "function",
+          "name": "setTheme",
+          "parameters": [
+            {
+              "name": "theme",
+              "type": {
+                "text": "Theme | null"
+              },
+              "description": "Flat object of theme tokens. Each object entry must follow\nthese rules: the key is the name of the token, usually in camel case, it\nmust be a valid CSS Custom Property name WITHOUT the starting two dashes\n(`--`), the two dashes are added inside the function; the value must be\na valid CSS value, e.g. it cannot contain semicolons (`;`).\nNote that this argument is not limited to existing theme objects (from\n`@fluentui/tokens`), you can pass in an arbitrary theme object as long\nas each entry’s value is either a string or a number."
+            },
+            {
+              "name": "node",
+              "default": "document",
+              "type": {
+                "text": "Document | HTMLElement"
+              },
+              "description": "The node to set the theme on, defaults to `document` for\nsetting global theme."
+            }
+          ],
+          "description": "Sets the theme tokens as CSS Custom Properties. The Custom Properties are\nset in a constructed stylesheet on `document.adoptedStyleSheets` if\nsupported, and on `document.documentElement.style` as a fallback.",
+          "privacy": "public"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "setTheme",
+          "declaration": {
+            "name": "setTheme",
+            "module": "src/theme/set-theme.ts"
+          }
+        }
+      ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/theme/set-theme.ts",
+      "path": "src/index-rollup.ts",
       "declarations": [],
-      "exports": []
+      "exports": [
+        {
+          "kind": "js",
+          "name": "setTheme",
+          "declaration": {
+            "name": "setTheme",
+            "module": "./theme/set-theme.js"
+          }
+        }
+      ]
     },
     {
       "kind": "javascript-module",
@@ -29368,22 +28898,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "./dist/esm/tab-panel/define.js",
-      "deprecated": "- Use tablist instead",
-      "declarations": [],
-      "exports": [
-        {
-          "kind": "custom-element-definition",
-          "name": "fluent-tab-panel",
-          "declaration": {
-            "name": "TabPanel",
-            "module": "./dist/esm/tab-panel/tab-panel.js"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "./dist/esm/tab/define.js",
@@ -29400,38 +28914,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "./dist/esm/tabs/define.js",
-      "deprecated": "- use tablist instead",
-      "declarations": [],
-      "exports": [
-        {
-          "kind": "custom-element-definition",
-          "name": "BaseTabs",
-          "declaration": {
-            "name": "BaseTabs",
-            "module": "./dist/esm/tabs/tabs.base.js"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "./dist/esm/tabs/define.js",
-      "deprecated": "- Use tablist instead",
-      "declarations": [],
-      "exports": [
-        {
-          "kind": "custom-element-definition",
-          "name": "fluent-tabs",
-          "declaration": {
-            "name": "Tabs",
-            "module": "./dist/esm/tabs/tabs.js"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "./dist/esm/tablist/define.js",