@fluentui/web-components 3.0.0-beta.122 → 3.0.0-beta.124

package/CHANGELOG.md

@@ -1,12 +1,30 @@
 # Change Log - @fluentui/web-components
 
-This log was last generated on Thu, 04 Sep 2025 04:06:55 GMT and should not be manually modified.
+This log was last generated on Thu, 18 Sep 2025 04:07:06 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [3.0.0-beta.124](https://github.com/microsoft/fluentui/tree/@fluentui/web-components_v3.0.0-beta.124)
+
+Thu, 18 Sep 2025 04:07:06 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/web-components_v3.0.0-beta.123..@fluentui/web-components_v3.0.0-beta.124)
+
+### Changes
+
+- fix: bug in switch checked story in forced-colors mode ([PR #35204](https://github.com/microsoft/fluentui/pull/35204) by rupertdavid@microsoft.com)
+
+## [3.0.0-beta.123](https://github.com/microsoft/fluentui/tree/@fluentui/web-components_v3.0.0-beta.123)
+
+Fri, 05 Sep 2025 04:09:54 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/web-components_v3.0.0-beta.122..@fluentui/web-components_v3.0.0-beta.123)
+
+### Changes
+
+- fix: use defined selector in waitForConnectedDescendants ([PR #35142](https://github.com/microsoft/fluentui/pull/35142) by 863023+radium-v@users.noreply.github.com)
+
 ## [3.0.0-beta.122](https://github.com/microsoft/fluentui/tree/@fluentui/web-components_v3.0.0-beta.122)
 
-Thu, 04 Sep 2025 04:06:55 GMT 
+Thu, 04 Sep 2025 04:07:08 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/web-components_v3.0.0-beta.121..@fluentui/web-components_v3.0.0-beta.122)
 
 ### Changes

package/custom-elements.json

@@ -14546,7 +14546,7 @@
             {
               "name": "callback",
               "type": {
-                "text": "(args: { didTimeout: boolean }) => void"
+                "text": "(deadline: IdleDeadline) => void"
               },
               "description": "The function to call when the browser is idle."
             },
@@ -14607,7 +14607,10 @@
             },
             {
               "name": "options",
-              "default": "{ shallow: false, timeout: 50 }",
+              "optional": true,
+              "type": {
+                "text": "{ shallow?: boolean; timeout?: number }"
+              },
               "description": "Options object that may contain a timeout property for the idle callback."
             }
           ],

package/dist/esm/listbox/listbox.js

@@ -165,8 +165,9 @@ export class Listbox extends FASTElement {
      * @public
      */
     slotchangeHandler(e) {
+        const target = e.target;
         waitForConnectedDescendants(this, () => {
-            const options = e.target
+            const options = target
                 .assignedElements()
                 .filter((option) => isDropdownOption(option));
             this.options = options;

package/dist/esm/listbox/listbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"listbox.js","sourceRoot":"","sources":["../../../src/listbox/listbox.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"listbox.js","sourceRoot":"","sources":["../../../src/listbox/listbox.ts"],"names":[],"mappings":"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"}

package/dist/esm/switch/switch.styles.js

@@ -95,6 +95,7 @@ export const styles = css `
   :host(:not([slot='input']):focus-visible) {
     border-color: ${colorTransparentStroke};
     outline: ${strokeWidthThick} solid ${colorTransparentStroke};
+    outline-offset: 1px;
     box-shadow: ${shadow4}, 0 0 0 2px ${colorStrokeFocus2};
   }
 `.withBehaviors(forcedColorsStylesheetBehavior(css `

package/dist/esm/switch/switch.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"switch.styles.js","sourceRoot":"","sources":["../../../src/switch/switch.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EACL,oBAAoB,EACpB,4BAA4B,EAC5B,iCAAiC,EACjC,mCAAmC,EACnC,8BAA8B,EAC9B,uBAAuB,EACvB,4BAA4B,EAC5B,8BAA8B,EAC9B,8BAA8B,EAC9B,8BAA8B,EAC9B,mCAAmC,EACnC,qCAAqC,EACrC,4BAA4B,EAC5B,iCAAiC,EACjC,mCAAmC,EACnC,0BAA0B,EAC1B,iBAAiB,EACjB,0BAA0B,EAC1B,sBAAsB,EACtB,aAAa,EACb,cAAc,EACd,OAAO,EACP,oBAAoB,EACpB,gBAAgB,GACjB,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAAE,8BAA8B,EAAE,MAAM,uDAAuD,CAAC;AACvG,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAE9C,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,aAAa,CAAC;;;;;;;;;iBAST,oBAAoB;;;wBAGb,0BAA0B;wBAC1B,4BAA4B;qBAC/B,oBAAoB;;;;;;;;;oBASrB,iCAAiC;;;oBAGjC,mCAAmC;;;;wBAI/B,0BAA0B;;;;UAIxC,YAAY;kBACJ,4BAA4B;oBAC1B,4BAA4B;;UAEtC,YAAY;kBACJ,iCAAiC;oBAC/B,iCAAiC;;UAE3C,YAAY;kBACJ,mCAAmC;oBACjC,mCAAmC;;UAE7C,YAAY;kBACJ,8BAA8B;oBAC5B,0BAA0B;;;;;;;wBAOtB,uBAAuB;2BACpB,cAAc;kCACP,aAAa;;;UAGrC,YAAY;wBACE,8BAA8B;;;UAG5C,YAAY;kBACJ,mCAAmC;;UAE3C,YAAY;kBACJ,qCAAqC;;;wBAG/B,4BAA4B;;;wBAG5B,8BAA8B;;;;kBAIpC,8BAA8B;;UAEtC,YAAY;kBACJ,8BAA8B;;;;;;;;oBAQ5B,sBAAsB;eAC3B,gBAAgB,UAAU,sBAAsB;kBAC7C,OAAO,eAAe,iBAAiB;;CAExD,CAAC,aAAa,CACb,8BAA8B,CAAC,GAAG,CAAA;;;;YAIxB,YAAY;YACZ,YAAY;YACZ,YAAY;;;;;;;;;YASZ,YAAY;YACZ,YAAY;YACZ,YAAY;;;;YAIZ,YAAY;;;GAGrB,CAAC,CACH,CAAC"}
+{"version":3,"file":"switch.styles.js","sourceRoot":"","sources":["../../../src/switch/switch.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EACL,oBAAoB,EACpB,4BAA4B,EAC5B,iCAAiC,EACjC,mCAAmC,EACnC,8BAA8B,EAC9B,uBAAuB,EACvB,4BAA4B,EAC5B,8BAA8B,EAC9B,8BAA8B,EAC9B,8BAA8B,EAC9B,mCAAmC,EACnC,qCAAqC,EACrC,4BAA4B,EAC5B,iCAAiC,EACjC,mCAAmC,EACnC,0BAA0B,EAC1B,iBAAiB,EACjB,0BAA0B,EAC1B,sBAAsB,EACtB,aAAa,EACb,cAAc,EACd,OAAO,EACP,oBAAoB,EACpB,gBAAgB,GACjB,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAAE,8BAA8B,EAAE,MAAM,uDAAuD,CAAC;AACvG,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAE9C,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,aAAa,CAAC;;;;;;;;;iBAST,oBAAoB;;;wBAGb,0BAA0B;wBAC1B,4BAA4B;qBAC/B,oBAAoB;;;;;;;;;oBASrB,iCAAiC;;;oBAGjC,mCAAmC;;;;wBAI/B,0BAA0B;;;;UAIxC,YAAY;kBACJ,4BAA4B;oBAC1B,4BAA4B;;UAEtC,YAAY;kBACJ,iCAAiC;oBAC/B,iCAAiC;;UAE3C,YAAY;kBACJ,mCAAmC;oBACjC,mCAAmC;;UAE7C,YAAY;kBACJ,8BAA8B;oBAC5B,0BAA0B;;;;;;;wBAOtB,uBAAuB;2BACpB,cAAc;kCACP,aAAa;;;UAGrC,YAAY;wBACE,8BAA8B;;;UAG5C,YAAY;kBACJ,mCAAmC;;UAE3C,YAAY;kBACJ,qCAAqC;;;wBAG/B,4BAA4B;;;wBAG5B,8BAA8B;;;;kBAIpC,8BAA8B;;UAEtC,YAAY;kBACJ,8BAA8B;;;;;;;;oBAQ5B,sBAAsB;eAC3B,gBAAgB,UAAU,sBAAsB;;kBAE7C,OAAO,eAAe,iBAAiB;;CAExD,CAAC,aAAa,CACb,8BAA8B,CAAC,GAAG,CAAA;;;;YAIxB,YAAY;YACZ,YAAY;YACZ,YAAY;;;;;;;;;YASZ,YAAY;YACZ,YAAY;YACZ,YAAY;;;;YAIZ,YAAY;;;GAGrB,CAAC,CACH,CAAC"}

package/dist/esm/utils/request-idle-callback.d.ts

@@ -7,9 +7,7 @@
  * @returns An ID that can be used to cancel the callback.
  * @public
  */
-export declare function requestIdleCallback(callback: (args: {
-    didTimeout: boolean;
-}) => void, options?: {
+export declare function requestIdleCallback(callback: (deadline: IdleDeadline) => void, options?: {
     timeout: number;
 }): ReturnType<typeof globalThis.requestIdleCallback | typeof setTimeout>;
 /**
@@ -38,6 +36,6 @@ export declare function cancelIdleCallback(id: ReturnType<typeof globalThis.requ
  * @public
  */
 export declare function waitForConnectedDescendants(target: HTMLElement, callback: () => void, options?: {
-    shallow: boolean;
-    timeout: number;
+    shallow?: boolean;
+    timeout?: number;
 }): void;

package/dist/esm/utils/request-idle-callback.js

@@ -15,6 +15,7 @@ export function requestIdleCallback(callback, options) {
     return setTimeout(() => {
         callback({
             didTimeout: options?.timeout ? Date.now() - start >= options.timeout : false,
+            timeRemaining: () => 0,
         });
     }, 1);
 }
@@ -50,23 +51,21 @@ export function cancelIdleCallback(id) {
  *
  * @public
  */
-export function waitForConnectedDescendants(target, callback, options = { shallow: false, timeout: 50 }) {
+export function waitForConnectedDescendants(target, callback, options) {
     let idleCallbackId;
-    const query = options.shallow ? ':scope > *' : '*';
-    if (!target.isConnected) {
-        return;
-    }
-    const scheduleCheck = () => {
+    const shallow = options?.shallow ?? false;
+    const query = `${shallow ? ':scope > ' : ''}:not(:defined)`;
+    const timeout = options?.timeout ?? 50;
+    const scheduleCheck = (deadline) => {
         if (idleCallbackId) {
-            idleCallbackId = cancelIdleCallback(idleCallbackId);
+            cancelIdleCallback(idleCallbackId);
+            idleCallbackId = undefined;
         }
-        if (Array.from(target.querySelectorAll(query))
-            .filter(el => el.tagName.includes('-'))
-            .every(el => el.isConnected)) {
+        if (!target.querySelector(query) || (deadline && deadline.timeRemaining() <= 0)) {
             callback();
             return;
         }
-        idleCallbackId = requestIdleCallback(scheduleCheck, { timeout: options.timeout });
+        idleCallbackId = requestIdleCallback(scheduleCheck, { timeout });
     };
     scheduleCheck();
 }

package/dist/esm/utils/request-idle-callback.js.map

@@ -1 +1 @@
-{"version":3,"file":"request-idle-callback.js","sourceRoot":"","sources":["../../../src/utils/request-idle-callback.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AACH,MAAM,UAAU,mBAAmB,CACjC,QAAiD,EACjD,OAA6B;IAE7B,IAAI,qBAAqB,IAAI,UAAU,EAAE,CAAC;QACxC,OAAO,UAAU,CAAC,mBAAmB,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IAC3D,CAAC;IAED,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC;IACzB,OAAO,UAAU,CAAC,GAAG,EAAE;QACrB,QAAQ,CAAC;YACP,UAAU,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,EAAE,GAAG,KAAK,IAAI,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK;SAC7E,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,CAAC,CAAC;AACR,CAAC;AAED;;;;;;GAMG;AACH,MAAM,UAAU,kBAAkB,CAAC,EAAyE;IAC1G,IAAI,oBAAoB,IAAI,UAAU,EAAE,CAAC;QACtC,UAAgC,CAAC,kBAAkB,CAAC,EAAY,CAAC,CAAC;IACrE,CAAC;SAAM,CAAC;QACN,YAAY,CAAC,EAAE,CAAC,CAAC;IACnB,CAAC;AACH,CAAC;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,UAAU,2BAA2B,CACzC,MAAmB,EACnB,QAAoB,EACpB,OAAO,GAAG,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE;IAEzC,IAAI,cAA6D,CAAC;IAClE,MAAM,KAAK,GAAG,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,GAAG,CAAC;IAEnD,IAAI,CAAC,MAAM,CAAC,WAAW,EAAE,CAAC;QACxB,OAAO;IACT,CAAC;IAED,MAAM,aAAa,GAAG,GAAG,EAAE;QACzB,IAAI,cAAc,EAAE,CAAC;YACnB,cAAc,GAAG,kBAAkB,CAAC,cAAc,CAAC,CAAC;QACtD,CAAC;QAED,IACE,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC;aACvC,MAAM,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;aACtC,KAAK,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,WAAW,CAAC,EAC9B,CAAC;YACD,QAAQ,EAAE,CAAC;YACX,OAAO;QACT,CAAC;QAED,cAAc,GAAG,mBAAmB,CAAC,aAAa,EAAE,EAAE,OAAO,EAAE,OAAO,CAAC,OAAO,EAAE,CAAC,CAAC;IACpF,CAAC,CAAC;IAEF,aAAa,EAAE,CAAC;AAClB,CAAC"}
+{"version":3,"file":"request-idle-callback.js","sourceRoot":"","sources":["../../../src/utils/request-idle-callback.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AACH,MAAM,UAAU,mBAAmB,CACjC,QAA0C,EAC1C,OAA6B;IAE7B,IAAI,qBAAqB,IAAI,UAAU,EAAE,CAAC;QACxC,OAAO,UAAU,CAAC,mBAAmB,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IAC3D,CAAC;IAED,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC;IACzB,OAAO,UAAU,CAAC,GAAG,EAAE;QACrB,QAAQ,CAAC;YACP,UAAU,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,EAAE,GAAG,KAAK,IAAI,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK;YAC5E,aAAa,EAAE,GAAG,EAAE,CAAC,CAAC;SACvB,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,CAAC,CAAC;AACR,CAAC;AAED;;;;;;GAMG;AACH,MAAM,UAAU,kBAAkB,CAAC,EAAyE;IAC1G,IAAI,oBAAoB,IAAI,UAAU,EAAE,CAAC;QACtC,UAAgC,CAAC,kBAAkB,CAAC,EAAY,CAAC,CAAC;IACrE,CAAC;SAAM,CAAC;QACN,YAAY,CAAC,EAAE,CAAC,CAAC;IACnB,CAAC;AACH,CAAC;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,UAAU,2BAA2B,CACzC,MAAmB,EACnB,QAAoB,EACpB,OAAiD;IAEjD,IAAI,cAAkE,CAAC;IACvE,MAAM,OAAO,GAAG,OAAO,EAAE,OAAO,IAAI,KAAK,CAAC;IAC1C,MAAM,KAAK,GAAG,GAAG,OAAO,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,gBAAgB,CAAC;IAC5D,MAAM,OAAO,GAAG,OAAO,EAAE,OAAO,IAAI,EAAE,CAAC;IAEvC,MAAM,aAAa,GAAG,CAAC,QAAuB,EAAE,EAAE;QAChD,IAAI,cAAc,EAAE,CAAC;YACnB,kBAAkB,CAAC,cAAc,CAAC,CAAC;YACnC,cAAc,GAAG,SAAS,CAAC;QAC7B,CAAC;QAED,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,KAAK,CAAC,IAAI,CAAC,QAAQ,IAAI,QAAQ,CAAC,aAAa,EAAE,IAAI,CAAC,CAAC,EAAE,CAAC;YAChF,QAAQ,EAAE,CAAC;YACX,OAAO;QACT,CAAC;QAED,cAAc,GAAG,mBAAmB,CAAC,aAAa,EAAE,EAAE,OAAO,EAAE,CAAC,CAAC;IACnE,CAAC,CAAC;IAEF,aAAa,EAAE,CAAC;AAClB,CAAC"}

package/dist/web-components.js

@@ -7101,7 +7101,8 @@ function requestIdleCallback(callback, options) {
   const start = Date.now();
   return setTimeout(() => {
     callback({
-      didTimeout: options?.timeout ? Date.now() - start >= options.timeout : false
+      didTimeout: options?.timeout ? Date.now() - start >= options.timeout : false,
+      timeRemaining: () => 0
     });
   }, 1);
 }
@@ -7112,25 +7113,22 @@ function cancelIdleCallback(id) {
     clearTimeout(id);
   }
 }
-function waitForConnectedDescendants(target, callback, options = {
-  shallow: false,
-  timeout: 50
-}) {
+function waitForConnectedDescendants(target, callback, options) {
   let idleCallbackId;
-  const query = options.shallow ? ":scope > *" : "*";
-  if (!target.isConnected) {
-    return;
-  }
-  const scheduleCheck = () => {
+  const shallow = options?.shallow ?? false;
+  const query = `${shallow ? ":scope > " : ""}:not(:defined)`;
+  const timeout = options?.timeout ?? 50;
+  const scheduleCheck = deadline => {
     if (idleCallbackId) {
-      idleCallbackId = cancelIdleCallback(idleCallbackId);
+      cancelIdleCallback(idleCallbackId);
+      idleCallbackId = void 0;
     }
-    if (Array.from(target.querySelectorAll(query)).filter(el => el.tagName.includes("-")).every(el => el.isConnected)) {
+    if (!target.querySelector(query) || deadline && deadline.timeRemaining() <= 0) {
       callback();
       return;
     }
     idleCallbackId = requestIdleCallback(scheduleCheck, {
-      timeout: options.timeout
+      timeout
     });
   };
   scheduleCheck();
@@ -8453,8 +8451,9 @@ class Listbox extends FASTElement {
    * @public
    */
   slotchangeHandler(e) {
+    const target = e.target;
     waitForConnectedDescendants(this, () => {
-      const options = e.target.assignedElements().filter(option => isDropdownOption(option));
+      const options = target.assignedElements().filter(option => isDropdownOption(option));
       this.options = options;
     });
   }
@@ -11198,7 +11197,7 @@ const template$b = switchTemplate({
 const styles$b = css`
   ${display("inline-flex")}
 
-  :host{box-sizing:border-box;align-items:center;flex-direction:row;outline:none;user-select:none;contain:content;padding:0 ${spacingHorizontalXXS};width:40px;height:20px;background-color:${colorTransparentBackground};border:1px solid ${colorNeutralStrokeAccessible};border-radius:${borderRadiusCircular}}:host(:enabled){cursor:pointer}:host(:hover){background:none;border-color:${colorNeutralStrokeAccessibleHover}}:host(:active){border-color:${colorNeutralStrokeAccessiblePressed}}:host(:disabled),:host([readonly]){border:1px solid ${colorNeutralStrokeDisabled};background-color:none;pointer:default}:host(${checkedState}){background:${colorCompoundBrandBackground};border-color:${colorCompoundBrandBackground}}:host(${checkedState}:hover){background:${colorCompoundBrandBackgroundHover};border-color:${colorCompoundBrandBackgroundHover}}:host(${checkedState}:active){background:${colorCompoundBrandBackgroundPressed};border-color:${colorCompoundBrandBackgroundPressed}}:host(${checkedState}:disabled){background:${colorNeutralBackgroundDisabled};border-color:${colorNeutralStrokeDisabled}}.checked-indicator{height:14px;width:14px;border-radius:50%;margin-inline-start:0;background-color:${colorNeutralForeground3};transition-duration:${durationNormal};transition-timing-function:${curveEasyEase};transition-property:margin-inline-start}:host(${checkedState}) .checked-indicator{background-color:${colorNeutralForegroundInverted};margin-inline-start:calc(100% - 14px)}:host(${checkedState}:hover) .checked-indicator{background:${colorNeutralForegroundInvertedHover}}:host(${checkedState}:active) .checked-indicator{background:${colorNeutralForegroundInvertedPressed}}:host(:hover) .checked-indicator{background-color:${colorNeutralForeground3Hover}}:host(:active) .checked-indicator{background-color:${colorNeutralForeground3Pressed}}:host(:disabled) .checked-indicator,:host([readonly]) .checked-indicator{background:${colorNeutralForegroundDisabled}}:host(${checkedState}:disabled) .checked-indicator{background:${colorNeutralForegroundDisabled}}:host(:focus-visible){outline:none}:host(:not([slot='input']):focus-visible){border-color:${colorTransparentStroke};outline:${strokeWidthThick} solid ${colorTransparentStroke};box-shadow:${shadow4},0 0 0 2px ${colorStrokeFocus2}}`.withBehaviors(forcedColorsStylesheetBehavior(css`
+  :host{box-sizing:border-box;align-items:center;flex-direction:row;outline:none;user-select:none;contain:content;padding:0 ${spacingHorizontalXXS};width:40px;height:20px;background-color:${colorTransparentBackground};border:1px solid ${colorNeutralStrokeAccessible};border-radius:${borderRadiusCircular}}:host(:enabled){cursor:pointer}:host(:hover){background:none;border-color:${colorNeutralStrokeAccessibleHover}}:host(:active){border-color:${colorNeutralStrokeAccessiblePressed}}:host(:disabled),:host([readonly]){border:1px solid ${colorNeutralStrokeDisabled};background-color:none;pointer:default}:host(${checkedState}){background:${colorCompoundBrandBackground};border-color:${colorCompoundBrandBackground}}:host(${checkedState}:hover){background:${colorCompoundBrandBackgroundHover};border-color:${colorCompoundBrandBackgroundHover}}:host(${checkedState}:active){background:${colorCompoundBrandBackgroundPressed};border-color:${colorCompoundBrandBackgroundPressed}}:host(${checkedState}:disabled){background:${colorNeutralBackgroundDisabled};border-color:${colorNeutralStrokeDisabled}}.checked-indicator{height:14px;width:14px;border-radius:50%;margin-inline-start:0;background-color:${colorNeutralForeground3};transition-duration:${durationNormal};transition-timing-function:${curveEasyEase};transition-property:margin-inline-start}:host(${checkedState}) .checked-indicator{background-color:${colorNeutralForegroundInverted};margin-inline-start:calc(100% - 14px)}:host(${checkedState}:hover) .checked-indicator{background:${colorNeutralForegroundInvertedHover}}:host(${checkedState}:active) .checked-indicator{background:${colorNeutralForegroundInvertedPressed}}:host(:hover) .checked-indicator{background-color:${colorNeutralForeground3Hover}}:host(:active) .checked-indicator{background-color:${colorNeutralForeground3Pressed}}:host(:disabled) .checked-indicator,:host([readonly]) .checked-indicator{background:${colorNeutralForegroundDisabled}}:host(${checkedState}:disabled) .checked-indicator{background:${colorNeutralForegroundDisabled}}:host(:focus-visible){outline:none}:host(:not([slot='input']):focus-visible){border-color:${colorTransparentStroke};outline:${strokeWidthThick} solid ${colorTransparentStroke};outline-offset:1px;box-shadow:${shadow4},0 0 0 2px ${colorStrokeFocus2}}`.withBehaviors(forcedColorsStylesheetBehavior(css`
     :host{border-color:InactiveBorder}:host(${checkedState}),:host(${checkedState}:active),:host(${checkedState}:hover){background:Highlight;border-color:Highlight}.checked-indicator,:host(:hover) .checked-indicator,:host(:active) .checked-indicator{background-color:ActiveCaption}:host(${checkedState}) .checked-indicator,:host(${checkedState}:hover) .checked-indicator,:host(${checkedState}:active) .checked-indicator{background-color:ButtonFace}:host(:disabled) .checked-indicator,:host(${checkedState}:disabled) .checked-indicator{background-color:GrayText}`));
 
 const definition$b = Switch.compose({

package/dist/web-components.min.js

@@ -420,7 +420,7 @@ const p=Object.freeze({prefix:"fluent",shadowRootMode:"open",registry:customElem
 
   :host{--dialog-backdrop:${gr}}:host([type='non-modal']) dialog[open]::backdrop{display:none}:host([type='non-modal']) dialog{position:fixed;top:0;bottom:0}:host([type='inline']){height:100%;width:fit-content}:host([type='inline']) dialog[open]{box-shadow:none;position:relative}:host([size='small']) dialog{width:320px;max-width:320px}:host([size='large']) dialog{width:940px;max-width:940px}:host([size='full']) dialog{width:100%;max-width:100%}:host([position='end']) dialog{margin-inline-start:auto;margin-inline-end:0}dialog{box-sizing:border-box;z-index:var(--drawer-elevation,1000);font-size:${B};line-height:${A};font-family:${v};font-weight:${_};color:${z};max-width:var(--drawer-width,592px);max-height:100vh;height:100%;margin-inline-start:0;margin-inline-end:auto;border-inline-end-color:${J};border-inline-start-color:var(--drawer-separator,${J});outline:none;top:0;bottom:0;width:var(--drawer-width,592px);border-radius:0;padding:0;max-width:var(--drawer-width,592px);box-shadow:${jn};border:${T} solid ${J};background:${I}}dialog::backdrop{background:var(--dialog-backdrop)}@layer animations{@media (prefers-reduced-motion:no-preference){dialog{transition:display allow-discrete,opacity,overlay allow-discrete,transform;transition-duration:${Ir};transition-timing-function:${kt}}:host dialog:not([open]){transform:translateX(-100%);transition-timing-function:${xt}}:host([position='end']) dialog:not([open]){transform:translateX(100%);transition-timing-function:${xt}}dialog[open]{transform:translateX(0)}dialog::backdrop{transition:display allow-discrete,opacity,overlay allow-discrete,scale;transition-duration:${Ir};transition-timing-function:${kt};background:var(--dialog-backdrop,${gr});opacity:0}dialog[open]::backdrop{opacity:1}dialog::backdrop{transition-timing-function:${zr}}}@starting-style{dialog[open]{transform:translateX(-100%)}:host([position='end']) dialog[open]{transform:translateX(100%)}dialog[open]::backdrop{opacity:0}}}`;function Gu(){return b`<dialog class="dialog" part="dialog" aria-describedby="${o=>o.ariaDescribedby}" aria-labelledby="${o=>o.ariaLabelledby}" aria-label="${o=>o.ariaLabel}" size="${o=>o.size}" position="${o=>o.position}" @click="${(o,e)=>o.clickHandler(e.event)}" @cancel="${o=>o.cancelHandler()}" ${E("dialog")}><slot></slot></dialog>`}const Uu=Gu(),Xu=It.compose({name:`${p.prefix}-drawer`,template:Uu,styles:Wu});Xu.define(p.registry);class Ku extends ${clickHandler(e){if(!e.defaultPrevented){const t=this.parentElement;na(t,"-drawer")&&t.hide()}return!0}}const Yu=u`
   ${k("grid")}
-  :host{box-sizing:border-box;grid-template-rows:min-content auto min-content;position:relative;height:100%;padding:${wd};max-height:100svh}.header{display:flex;justify-content:space-between;align-items:center;${zh}}.footer{display:flex;justify-content:flex-start;gap:${le}}::slotted([slot='title']){font:inherit;padding:0;margin:0}`;function Qu(){return b`<div class="header" part="header"><slot name="title"></slot><slot name="close" @click="${(o,e)=>o.clickHandler(e.event)}"></slot></div><div class="content" part="content"><slot></slot></div><div class="footer" part="footer"><slot name="footer"></slot></div>`}const Zu=Qu(),Ju=Ku.compose({name:`${p.prefix}-drawer-body`,template:Zu,styles:Yu});Ju.define(p.registry);function ca(o,e="-listbox"){return o?.nodeType!==Node.ELEMENT_NODE?!1:o.tagName.toLowerCase().endsWith(e)}function Oi(o,e="-option"){return o?.nodeType!==Node.ELEMENT_NODE?!1:o.tagName.toLowerCase().endsWith(e)}function da(o){return o.closest("[lang]")?.lang??"en"}let ep=0;function Qt(o="id-"){const e=`${o}${ep++}`;return document.getElementById(e)?Qt(o):e}function tp(o,e){if("requestIdleCallback"in globalThis)return globalThis.requestIdleCallback(o,e);const t=Date.now();return setTimeout(()=>{o({didTimeout:e?.timeout?Date.now()-t>=e.timeout:!1})},1)}function op(o){"cancelIdleCallback"in globalThis?globalThis.cancelIdleCallback(o):clearTimeout(o)}function ha(o,e,t={shallow:!1,timeout:50}){let i;const r=t.shallow?":scope > *":"*";if(!o.isConnected)return;const s=()=>{if(i&&(i=op(i)),Array.from(o.querySelectorAll(r)).filter(n=>n.tagName.includes("-")).every(n=>n.isConnected)){e();return}i=tp(s,{timeout:t.timeout})};s()}const ip={filledDarker:"filled-darker",filledLighter:"filled-lighter",outline:"outline",transparent:"transparent"},Dr={combobox:"combobox",dropdown:"dropdown",select:"select"},rp=b`<svg class="chevron-down-20-regular" role="button" slot="indicator" viewBox="0 0 20 20" ${E("indicator")}><path d="M15.85 7.65a.5.5 0 0 1 0 .7l-5.46 5.49a.55.55 0 0 1-.78 0L4.15 8.35a.5.5 0 1 1 .7-.7L10 12.8l5.15-5.16a.5.5 0 0 1 .7 0" fill="currentColor" /></svg>`,sp=b`<input @input="${(o,e)=>o.inputHandler(e.event)}" @change="${(o,e)=>o.changeHandler(e.event)}" aria-activedescendant="${o=>o.activeDescendant}" aria-controls="${o=>o.listbox?.id??null}" aria-labelledby="${o=>o.ariaLabelledBy}" aria-expanded="${o=>o.open}" aria-haspopup="listbox" placeholder="${o=>o.placeholder}" role="combobox" ?disabled="${o=>o.disabled}" type="${o=>o.type}" value="${o=>o.valueAttribute}" slot="control" ${E("control")} />`,np=b`<button aria-activedescendant="${o=>o.activeDescendant}" aria-controls="${o=>o.listbox?.id??null}" aria-expanded="${o=>o.open}" aria-haspopup="listbox" role="combobox" ?disabled="${o=>o.disabled}" type="button" slot="control" ${E("control")}>${o=>o.displayValue}</button>`;function ap(o={}){return b`<template @click="${(e,t)=>e.clickHandler(t.event)}" @focusout="${(e,t)=>e.focusoutHandler(t.event)}" @keydown="${(e,t)=>e.keydownHandler(t.event)}" @mousedown="${(e,t)=>e.mousedownHandler(t.event)}"><div class="control"><slot name="control" ${E("controlSlot")}></slot><slot name="indicator" ${E("indicatorSlot")}>${fe(o.indicator)}</slot></div><slot @slotchange="${(e,t)=>e.slotchangeHandler(t.event)}"></slot></template>`}const lp=ap({indicator:rp});var cp=Object.defineProperty,dp=Object.getOwnPropertyDescriptor,X=(o,e,t,i)=>{for(var r=i>1?void 0:i?dp(e,t):e,s=o.length-1,n;s>=0;s--)(n=o[s])&&(r=(i?n(e,t,r):n(r))||r);return i&&r&&cp(e,t,r),r};const L=class so extends ${constructor(){super(),this.activeIndex=0,this.id=Qt("dropdown-"),this.required=!1,this.type=Dr.dropdown,this.valueAttribute="",this.repositionListbox=()=>{this.frameId&&cancelAnimationFrame(this.frameId),this.frameId=requestAnimationFrame(()=>{const e=this.getBoundingClientRect(),t=window.innerWidth-e.right,i=e.left;this.listbox.style.minWidth=`${e.width}px`,this.listbox.style.top=`${e.top}px`,i+e.width>window.innerWidth||ei(this)==="rtl"&&t-e.width>0?(this.listbox.style.right=`${t}px`,this.listbox.style.left="unset"):(this.listbox.style.left=`${i}px`,this.listbox.style.right="unset")})},this.elementInternals=this.attachInternals(),this.elementInternals.role="presentation",Q.enqueue(()=>{this.insertControl()})}get activeDescendant(){if(this.open)return this.enabledOptions[this.activeIndex]?.id}activeIndexChanged(e,t){if(typeof t=="number"){const i=this.matches(":has(:focus-visible)")?t:-1;this.enabledOptions.forEach((r,s)=>{r.active=s===i}),this.open&&this.enabledOptions[i]?.scrollIntoView({block:"nearest"})}}controlChanged(e,t){t&&(t.id=t.id||Qt("input-"))}disabledChanged(e,t){Q.enqueue(()=>{this.options.forEach(i=>{i.disabled=i.disabledAttribute||this.disabled})})}get displayValue(){if(!this.$fastController.isConnected||!this.control||this.isCombobox&&this.multiple)return y(this.elementInternals,"placeholder-shown",!1),"";this.listFormatter=this.listFormatter??new Intl.ListFormat(da(this),{type:"conjunction",style:"narrow"});const e=this.listFormatter.format(this.selectedOptions.map(t=>t.text));return y(this.elementInternals,"placeholder-shown",!e),this.isCombobox?e:e||this.placeholder}listboxChanged(e,t){if(e&&m.getNotifier(this).unsubscribe(e),t){t.dropdown=this,t.popover="manual",t.tabIndex=-1;const i=m.getNotifier(this);i.subscribe(t);for(const r of["disabled","multiple"])i.notify(r);if(Q.enqueue(()=>{this.enabledOptions.filter(r=>r.defaultSelected).forEach((r,s)=>{r.selected=this.multiple||s===0}),this.setValidity()}),ti){const r=Qt("--dropdown-anchor-");this.style.setProperty("anchor-name",r),this.listbox.style.setProperty("position-anchor",r)}}}multipleChanged(e,t){this.elementInternals.ariaMultiSelectable=t?"true":"false",y(this.elementInternals,"multiple",t),this.value=null}nameChanged(e,t){Q.enqueue(()=>{this.options.forEach(i=>{i.name=t})})}openChanged(e,t){y(this.elementInternals,"open",t),this.elementInternals.ariaExpanded=t?"true":"false",this.activeIndex=this.selectedIndex??-1,ti||this.anchorPositionFallback(t)}typeChanged(e,t){this.$fastController.isConnected&&this.insertControl()}get enabledOptions(){return this.listbox?.enabledOptions??[]}get freeformOption(){return this.enabledOptions.find(e=>e.freeform)}get isCombobox(){return this.type===Dr.combobox}get labels(){return Object.freeze(Array.from(this.elementInternals.labels))}get options(){return this.listbox?.options??[]}get selectedIndex(){return this.enabledOptions.findIndex(e=>e.selected)??-1}get selectedOptions(){return this.listbox?.selectedOptions??[]}get validationMessage(){if(this.elementInternals.validationMessage)return this.elementInternals.validationMessage;if(!this._validationFallbackMessage){const e=document.createElement("input");e.type="radio",e.name="validation-message-fallback",e.required=!0,e.checked=!1,this._validationFallbackMessage=e.validationMessage}return!this.disabled&&this.required&&this.listbox.selectedOptions.length===0?this._validationFallbackMessage:""}get validity(){return this.elementInternals.validity}get value(){return m.notify(this,"value"),this.enabledOptions.find(e=>e.selected)?.value??null}set value(e){this.multiple||(this.selectOption(this.enabledOptions.findIndex(t=>t.value===e)),m.track(this,"value"))}get willValidate(){return this.elementInternals.willValidate}changeHandler(e){if(this===e.target)return!0;const t=this.isCombobox?this.enabledOptions.findIndex(i=>i.text===this.control.value):this.enabledOptions.indexOf(e.target);return this.selectOption(t,!0),!0}checkValidity(){return this.elementInternals.checkValidity()}clickHandler(e){if(this.disabled)return;const t=e.target;if(this.focus(),t===this.control&&!this.isCombobox)return this.listbox.togglePopover(),!0;if(!this.open)return this.listbox.showPopover(),!0;if(Oi(t)){if(t.disabled)return;this.selectOption(this.enabledOptions.indexOf(t),!0),this.multiple||(this.isCombobox&&(this.control.value=t.text,this.updateFreeformOption()),this.listbox.hidePopover())}return!0}filterOptions(e,t=this.enabledOptions){return this.listCollator||(this.listCollator=new Intl.Collator(da(this),{usage:"search",sensitivity:"base"})),t.filter(i=>this.listCollator.compare(i.text.substring(0,Math.min(i.text.length,e.length)),e)===0)}focus(e){this.disabled||this.control.focus(e)}focusoutHandler(e){const t=e.relatedTarget;return this.open&&!this.contains(t)&&this.listbox.togglePopover(),!0}formResetCallback(){this.enabledOptions.forEach((e,t)=>{if(this.multiple){e.selected=!!e.defaultSelected;return}if(!e.defaultSelected){e.selected=!1;return}this.selectOption(t)}),this.setValidity()}getEnabledIndexInBounds(e,t=this.enabledOptions.length||0){return t===0?-1:(e+t)%t}inputHandler(e){this.open||this.listbox.showPopover(),this.updateFreeformOption();const t=this.control.value,i=this.enabledOptions.indexOf(this.filterOptions(t)[0]??null);return this.activeIndex=i,!0}insertControl(){if(this.controlSlot?.assignedNodes().forEach(e=>this.removeChild(e)),this.type===Dr.combobox){sp.render(this,this);return}np.render(this,this)}keydownHandler(e){let t=0;switch(e.key){case"ArrowUp":{e.preventDefault(),t=-1;break}case"ArrowDown":{e.preventDefault(),t=1;break}case" ":{if(this.isCombobox)break;e.preventDefault()}case"Enter":case"Tab":{if(this.open){if(this.selectOption(this.activeIndex,!0),this.multiple)break;return this.listbox.hidePopover(),e.key==="Tab"}this.listbox.showPopover();break}case"Escape":{this.activeIndex=this.multiple?0:this.selectedIndex,this.listbox.hidePopover();break}}if(!t)return!0;if(!this.open){this.listbox.showPopover();return}let i=this.activeIndex;i+=t;let r=this.getEnabledIndexInBounds(i);return r===0&&this.freeformOption?.hidden&&(r=this.getEnabledIndexInBounds(i+t)),this.activeIndex=r,!0}mousedownHandler(e){if(!(this.disabled||e.target===this.control&&!this.isCombobox))return!Oi(e.target)}reportValidity(){return this.elementInternals.reportValidity()}selectOption(e=this.selectedIndex,t=!1){this.listbox.selectOption(e),this.control.value=this.displayValue,this.setValidity(),this.updateFreeformOption(),t&&this.$emit("change")}setValidity(e,t,i){if(this.$fastController.isConnected){if(this.disabled||!this.required){this.elementInternals.setValidity({});return}const r=this.required&&this.listbox.selectedOptions.length===0;this.elementInternals.setValidity({valueMissing:r,...e},t??this.validationMessage,i??this.control)}}slotchangeHandler(e){const t=e.target;ha(this,()=>{const i=t.assignedElements().find(r=>ca(r));i&&(this.listbox=i)})}updateFreeformOption(e=this.control.value){if(this.freeformOption){if(e===""||this.filterOptions(e,this.enabledOptions.filter(t=>!t.freeform)).length){this.freeformOption.value="",this.freeformOption.selected=!1,this.freeformOption.hidden=!0;return}this.freeformOption.value=e,this.freeformOption.hidden=!1}}disconnectedCallback(){so.AnchorPositionFallbackObserver?.disconnect(),this.debounceController?.abort(),super.disconnectedCallback()}anchorPositionFallback(e){if(so.AnchorPositionFallbackObserver||(so.AnchorPositionFallbackObserver=new IntersectionObserver(t=>{t.forEach(({boundingClientRect:i,isIntersecting:r,target:s})=>{if(ca(s)){if(i.bottom>window.innerHeight){y(s.elementInternals,"flip-block",!0);return}i.top<0&&y(s.elementInternals,"flip-block",!1)}})},{threshold:1})),e){this.debounceController=new AbortController,so.AnchorPositionFallbackObserver.observe(this.listbox),window.addEventListener("scroll",this.repositionListbox,{passive:!0,capture:!0,signal:this.debounceController.signal}),window.addEventListener("resize",this.repositionListbox,{passive:!0,signal:this.debounceController.signal}),this.repositionListbox();return}so.AnchorPositionFallbackObserver.unobserve(this.listbox),this.debounceController?.abort(),this.frameId&&(cancelAnimationFrame(this.frameId),this.frameId=void 0)}};L.formAssociated=!0,X([ls],L.prototype,"activeDescendant",1),X([g],L.prototype,"activeIndex",2),X([a({attribute:"aria-labelledby",mode:"fromView"})],L.prototype,"ariaLabelledBy",2),X([g],L.prototype,"control",2),X([a({mode:"boolean"})],L.prototype,"disabled",2),X([ls],L.prototype,"displayValue",1),X([a({attribute:"id"})],L.prototype,"id",2),X([g],L.prototype,"indicator",2),X([g],L.prototype,"indicatorSlot",2),X([a({attribute:"value",mode:"fromView"})],L.prototype,"initialValue",2),X([g],L.prototype,"listbox",2),X([a({mode:"boolean"})],L.prototype,"multiple",2),X([a],L.prototype,"name",2),X([g],L.prototype,"open",2),X([a],L.prototype,"placeholder",2),X([a({mode:"boolean"})],L.prototype,"required",2),X([a],L.prototype,"type",2),X([a({attribute:"value"})],L.prototype,"valueAttribute",2);let hp=L;var up=Object.defineProperty,pp=Object.getOwnPropertyDescriptor,ua=(o,e,t,i)=>{for(var r=i>1?void 0:i?pp(e,t):e,s=o.length-1,n;s>=0;s--)(n=o[s])&&(r=(i?n(e,t,r):n(r))||r);return i&&r&&up(e,t,r),r};class Hr extends hp{constructor(){super(...arguments),this.appearance=ip.outline}}ua([a],Hr.prototype,"appearance",2),ua([a],Hr.prototype,"size",2);const bp=u`
+  :host{box-sizing:border-box;grid-template-rows:min-content auto min-content;position:relative;height:100%;padding:${wd};max-height:100svh}.header{display:flex;justify-content:space-between;align-items:center;${zh}}.footer{display:flex;justify-content:flex-start;gap:${le}}::slotted([slot='title']){font:inherit;padding:0;margin:0}`;function Qu(){return b`<div class="header" part="header"><slot name="title"></slot><slot name="close" @click="${(o,e)=>o.clickHandler(e.event)}"></slot></div><div class="content" part="content"><slot></slot></div><div class="footer" part="footer"><slot name="footer"></slot></div>`}const Zu=Qu(),Ju=Ku.compose({name:`${p.prefix}-drawer-body`,template:Zu,styles:Yu});Ju.define(p.registry);function ca(o,e="-listbox"){return o?.nodeType!==Node.ELEMENT_NODE?!1:o.tagName.toLowerCase().endsWith(e)}function Oi(o,e="-option"){return o?.nodeType!==Node.ELEMENT_NODE?!1:o.tagName.toLowerCase().endsWith(e)}function da(o){return o.closest("[lang]")?.lang??"en"}let ep=0;function Qt(o="id-"){const e=`${o}${ep++}`;return document.getElementById(e)?Qt(o):e}function tp(o,e){if("requestIdleCallback"in globalThis)return globalThis.requestIdleCallback(o,e);const t=Date.now();return setTimeout(()=>{o({didTimeout:e?.timeout?Date.now()-t>=e.timeout:!1,timeRemaining:()=>0})},1)}function op(o){"cancelIdleCallback"in globalThis?globalThis.cancelIdleCallback(o):clearTimeout(o)}function ha(o,e,t){let i;const s=`${t?.shallow??!1?":scope > ":""}:not(:defined)`,n=t?.timeout??50,c=h=>{if(i&&(op(i),i=void 0),!o.querySelector(s)||h&&h.timeRemaining()<=0){e();return}i=tp(c,{timeout:n})};c()}const ip={filledDarker:"filled-darker",filledLighter:"filled-lighter",outline:"outline",transparent:"transparent"},Dr={combobox:"combobox",dropdown:"dropdown",select:"select"},rp=b`<svg class="chevron-down-20-regular" role="button" slot="indicator" viewBox="0 0 20 20" ${E("indicator")}><path d="M15.85 7.65a.5.5 0 0 1 0 .7l-5.46 5.49a.55.55 0 0 1-.78 0L4.15 8.35a.5.5 0 1 1 .7-.7L10 12.8l5.15-5.16a.5.5 0 0 1 .7 0" fill="currentColor" /></svg>`,sp=b`<input @input="${(o,e)=>o.inputHandler(e.event)}" @change="${(o,e)=>o.changeHandler(e.event)}" aria-activedescendant="${o=>o.activeDescendant}" aria-controls="${o=>o.listbox?.id??null}" aria-labelledby="${o=>o.ariaLabelledBy}" aria-expanded="${o=>o.open}" aria-haspopup="listbox" placeholder="${o=>o.placeholder}" role="combobox" ?disabled="${o=>o.disabled}" type="${o=>o.type}" value="${o=>o.valueAttribute}" slot="control" ${E("control")} />`,np=b`<button aria-activedescendant="${o=>o.activeDescendant}" aria-controls="${o=>o.listbox?.id??null}" aria-expanded="${o=>o.open}" aria-haspopup="listbox" role="combobox" ?disabled="${o=>o.disabled}" type="button" slot="control" ${E("control")}>${o=>o.displayValue}</button>`;function ap(o={}){return b`<template @click="${(e,t)=>e.clickHandler(t.event)}" @focusout="${(e,t)=>e.focusoutHandler(t.event)}" @keydown="${(e,t)=>e.keydownHandler(t.event)}" @mousedown="${(e,t)=>e.mousedownHandler(t.event)}"><div class="control"><slot name="control" ${E("controlSlot")}></slot><slot name="indicator" ${E("indicatorSlot")}>${fe(o.indicator)}</slot></div><slot @slotchange="${(e,t)=>e.slotchangeHandler(t.event)}"></slot></template>`}const lp=ap({indicator:rp});var cp=Object.defineProperty,dp=Object.getOwnPropertyDescriptor,X=(o,e,t,i)=>{for(var r=i>1?void 0:i?dp(e,t):e,s=o.length-1,n;s>=0;s--)(n=o[s])&&(r=(i?n(e,t,r):n(r))||r);return i&&r&&cp(e,t,r),r};const L=class so extends ${constructor(){super(),this.activeIndex=0,this.id=Qt("dropdown-"),this.required=!1,this.type=Dr.dropdown,this.valueAttribute="",this.repositionListbox=()=>{this.frameId&&cancelAnimationFrame(this.frameId),this.frameId=requestAnimationFrame(()=>{const e=this.getBoundingClientRect(),t=window.innerWidth-e.right,i=e.left;this.listbox.style.minWidth=`${e.width}px`,this.listbox.style.top=`${e.top}px`,i+e.width>window.innerWidth||ei(this)==="rtl"&&t-e.width>0?(this.listbox.style.right=`${t}px`,this.listbox.style.left="unset"):(this.listbox.style.left=`${i}px`,this.listbox.style.right="unset")})},this.elementInternals=this.attachInternals(),this.elementInternals.role="presentation",Q.enqueue(()=>{this.insertControl()})}get activeDescendant(){if(this.open)return this.enabledOptions[this.activeIndex]?.id}activeIndexChanged(e,t){if(typeof t=="number"){const i=this.matches(":has(:focus-visible)")?t:-1;this.enabledOptions.forEach((r,s)=>{r.active=s===i}),this.open&&this.enabledOptions[i]?.scrollIntoView({block:"nearest"})}}controlChanged(e,t){t&&(t.id=t.id||Qt("input-"))}disabledChanged(e,t){Q.enqueue(()=>{this.options.forEach(i=>{i.disabled=i.disabledAttribute||this.disabled})})}get displayValue(){if(!this.$fastController.isConnected||!this.control||this.isCombobox&&this.multiple)return y(this.elementInternals,"placeholder-shown",!1),"";this.listFormatter=this.listFormatter??new Intl.ListFormat(da(this),{type:"conjunction",style:"narrow"});const e=this.listFormatter.format(this.selectedOptions.map(t=>t.text));return y(this.elementInternals,"placeholder-shown",!e),this.isCombobox?e:e||this.placeholder}listboxChanged(e,t){if(e&&m.getNotifier(this).unsubscribe(e),t){t.dropdown=this,t.popover="manual",t.tabIndex=-1;const i=m.getNotifier(this);i.subscribe(t);for(const r of["disabled","multiple"])i.notify(r);if(Q.enqueue(()=>{this.enabledOptions.filter(r=>r.defaultSelected).forEach((r,s)=>{r.selected=this.multiple||s===0}),this.setValidity()}),ti){const r=Qt("--dropdown-anchor-");this.style.setProperty("anchor-name",r),this.listbox.style.setProperty("position-anchor",r)}}}multipleChanged(e,t){this.elementInternals.ariaMultiSelectable=t?"true":"false",y(this.elementInternals,"multiple",t),this.value=null}nameChanged(e,t){Q.enqueue(()=>{this.options.forEach(i=>{i.name=t})})}openChanged(e,t){y(this.elementInternals,"open",t),this.elementInternals.ariaExpanded=t?"true":"false",this.activeIndex=this.selectedIndex??-1,ti||this.anchorPositionFallback(t)}typeChanged(e,t){this.$fastController.isConnected&&this.insertControl()}get enabledOptions(){return this.listbox?.enabledOptions??[]}get freeformOption(){return this.enabledOptions.find(e=>e.freeform)}get isCombobox(){return this.type===Dr.combobox}get labels(){return Object.freeze(Array.from(this.elementInternals.labels))}get options(){return this.listbox?.options??[]}get selectedIndex(){return this.enabledOptions.findIndex(e=>e.selected)??-1}get selectedOptions(){return this.listbox?.selectedOptions??[]}get validationMessage(){if(this.elementInternals.validationMessage)return this.elementInternals.validationMessage;if(!this._validationFallbackMessage){const e=document.createElement("input");e.type="radio",e.name="validation-message-fallback",e.required=!0,e.checked=!1,this._validationFallbackMessage=e.validationMessage}return!this.disabled&&this.required&&this.listbox.selectedOptions.length===0?this._validationFallbackMessage:""}get validity(){return this.elementInternals.validity}get value(){return m.notify(this,"value"),this.enabledOptions.find(e=>e.selected)?.value??null}set value(e){this.multiple||(this.selectOption(this.enabledOptions.findIndex(t=>t.value===e)),m.track(this,"value"))}get willValidate(){return this.elementInternals.willValidate}changeHandler(e){if(this===e.target)return!0;const t=this.isCombobox?this.enabledOptions.findIndex(i=>i.text===this.control.value):this.enabledOptions.indexOf(e.target);return this.selectOption(t,!0),!0}checkValidity(){return this.elementInternals.checkValidity()}clickHandler(e){if(this.disabled)return;const t=e.target;if(this.focus(),t===this.control&&!this.isCombobox)return this.listbox.togglePopover(),!0;if(!this.open)return this.listbox.showPopover(),!0;if(Oi(t)){if(t.disabled)return;this.selectOption(this.enabledOptions.indexOf(t),!0),this.multiple||(this.isCombobox&&(this.control.value=t.text,this.updateFreeformOption()),this.listbox.hidePopover())}return!0}filterOptions(e,t=this.enabledOptions){return this.listCollator||(this.listCollator=new Intl.Collator(da(this),{usage:"search",sensitivity:"base"})),t.filter(i=>this.listCollator.compare(i.text.substring(0,Math.min(i.text.length,e.length)),e)===0)}focus(e){this.disabled||this.control.focus(e)}focusoutHandler(e){const t=e.relatedTarget;return this.open&&!this.contains(t)&&this.listbox.togglePopover(),!0}formResetCallback(){this.enabledOptions.forEach((e,t)=>{if(this.multiple){e.selected=!!e.defaultSelected;return}if(!e.defaultSelected){e.selected=!1;return}this.selectOption(t)}),this.setValidity()}getEnabledIndexInBounds(e,t=this.enabledOptions.length||0){return t===0?-1:(e+t)%t}inputHandler(e){this.open||this.listbox.showPopover(),this.updateFreeformOption();const t=this.control.value,i=this.enabledOptions.indexOf(this.filterOptions(t)[0]??null);return this.activeIndex=i,!0}insertControl(){if(this.controlSlot?.assignedNodes().forEach(e=>this.removeChild(e)),this.type===Dr.combobox){sp.render(this,this);return}np.render(this,this)}keydownHandler(e){let t=0;switch(e.key){case"ArrowUp":{e.preventDefault(),t=-1;break}case"ArrowDown":{e.preventDefault(),t=1;break}case" ":{if(this.isCombobox)break;e.preventDefault()}case"Enter":case"Tab":{if(this.open){if(this.selectOption(this.activeIndex,!0),this.multiple)break;return this.listbox.hidePopover(),e.key==="Tab"}this.listbox.showPopover();break}case"Escape":{this.activeIndex=this.multiple?0:this.selectedIndex,this.listbox.hidePopover();break}}if(!t)return!0;if(!this.open){this.listbox.showPopover();return}let i=this.activeIndex;i+=t;let r=this.getEnabledIndexInBounds(i);return r===0&&this.freeformOption?.hidden&&(r=this.getEnabledIndexInBounds(i+t)),this.activeIndex=r,!0}mousedownHandler(e){if(!(this.disabled||e.target===this.control&&!this.isCombobox))return!Oi(e.target)}reportValidity(){return this.elementInternals.reportValidity()}selectOption(e=this.selectedIndex,t=!1){this.listbox.selectOption(e),this.control.value=this.displayValue,this.setValidity(),this.updateFreeformOption(),t&&this.$emit("change")}setValidity(e,t,i){if(this.$fastController.isConnected){if(this.disabled||!this.required){this.elementInternals.setValidity({});return}const r=this.required&&this.listbox.selectedOptions.length===0;this.elementInternals.setValidity({valueMissing:r,...e},t??this.validationMessage,i??this.control)}}slotchangeHandler(e){const t=e.target;ha(this,()=>{const i=t.assignedElements().find(r=>ca(r));i&&(this.listbox=i)})}updateFreeformOption(e=this.control.value){if(this.freeformOption){if(e===""||this.filterOptions(e,this.enabledOptions.filter(t=>!t.freeform)).length){this.freeformOption.value="",this.freeformOption.selected=!1,this.freeformOption.hidden=!0;return}this.freeformOption.value=e,this.freeformOption.hidden=!1}}disconnectedCallback(){so.AnchorPositionFallbackObserver?.disconnect(),this.debounceController?.abort(),super.disconnectedCallback()}anchorPositionFallback(e){if(so.AnchorPositionFallbackObserver||(so.AnchorPositionFallbackObserver=new IntersectionObserver(t=>{t.forEach(({boundingClientRect:i,isIntersecting:r,target:s})=>{if(ca(s)){if(i.bottom>window.innerHeight){y(s.elementInternals,"flip-block",!0);return}i.top<0&&y(s.elementInternals,"flip-block",!1)}})},{threshold:1})),e){this.debounceController=new AbortController,so.AnchorPositionFallbackObserver.observe(this.listbox),window.addEventListener("scroll",this.repositionListbox,{passive:!0,capture:!0,signal:this.debounceController.signal}),window.addEventListener("resize",this.repositionListbox,{passive:!0,signal:this.debounceController.signal}),this.repositionListbox();return}so.AnchorPositionFallbackObserver.unobserve(this.listbox),this.debounceController?.abort(),this.frameId&&(cancelAnimationFrame(this.frameId),this.frameId=void 0)}};L.formAssociated=!0,X([ls],L.prototype,"activeDescendant",1),X([g],L.prototype,"activeIndex",2),X([a({attribute:"aria-labelledby",mode:"fromView"})],L.prototype,"ariaLabelledBy",2),X([g],L.prototype,"control",2),X([a({mode:"boolean"})],L.prototype,"disabled",2),X([ls],L.prototype,"displayValue",1),X([a({attribute:"id"})],L.prototype,"id",2),X([g],L.prototype,"indicator",2),X([g],L.prototype,"indicatorSlot",2),X([a({attribute:"value",mode:"fromView"})],L.prototype,"initialValue",2),X([g],L.prototype,"listbox",2),X([a({mode:"boolean"})],L.prototype,"multiple",2),X([a],L.prototype,"name",2),X([g],L.prototype,"open",2),X([a],L.prototype,"placeholder",2),X([a({mode:"boolean"})],L.prototype,"required",2),X([a],L.prototype,"type",2),X([a({attribute:"value"})],L.prototype,"valueAttribute",2);let hp=L;var up=Object.defineProperty,pp=Object.getOwnPropertyDescriptor,ua=(o,e,t,i)=>{for(var r=i>1?void 0:i?pp(e,t):e,s=o.length-1,n;s>=0;s--)(n=o[s])&&(r=(i?n(e,t,r):n(r))||r);return i&&r&&up(e,t,r),r};class Hr extends hp{constructor(){super(...arguments),this.appearance=ip.outline}}ua([a],Hr.prototype,"appearance",2),ua([a],Hr.prototype,"size",2);const bp=u`
   ${k("inline-flex")}
 
   :host{anchor-name:--dropdown-trigger;box-sizing:border-box;color:${z};cursor:pointer}:host(${Yh}){color:${pr}}.control{appearance:none;background-color:${I};border-radius:${C};border:none;box-shadow:inset 0 0 0 ${T} var(--control-border-color);box-sizing:border-box;color:inherit;column-gap:${H};display:inline-flex;justify-content:space-between;min-width:160px;overflow:hidden;padding:${je} ${ae};position:relative;text-align:start;width:100%;z-index:1;${ia}}:host([size='small']) .control{column-gap:${H};padding:${qt} ${ee};${ra}}:host([size='large']) .control{column-gap:${Oe};padding:${V} ${le};${Ph}}::slotted(:is(input,button)){all:unset;flex:1 1 auto}::slotted(button){cursor:pointer}::slotted(input){cursor:text}:where(slot[name='indicator'] > *,::slotted([slot='indicator'])){all:unset;align-items:center;appearance:none;aspect-ratio:1;color:${Z};display:inline-flex;justify-content:center;width:20px}:host([size='small']) :where(slot[name='indicator'] > *,::slotted([slot='indicator'])){width:16px}:host([size='large']) :where(slot[name='indicator'] > *,::slotted([slot='indicator'])){width:24px}.control::after,.control::before{content:'' / '';inset:auto 0 0;pointer-events:none;position:absolute}.control::before{height:${T}}.control::after{background-color:${$t};height:${ue};scale:0 1;transition:scale ${Sr} ${kt}}:host(:where(:focus-within)) .control{border-radius:${C};box-shadow:inset 0 0 0 1px ${di};outline:${ue} solid ${ve}}:host(:where(${Xh},:focus-within)) .control::after{scale:1 1;transition-duration:${$i};transition-timing-function:${xt}}:host(:where([appearance='outline'],[appearance='transparent'])) .control::before{background-color:${Ve}}:host([appearance='transparent']) .control{--control-border-color:${fr};background-color:${me};border-radius:${hi}}:host([appearance='outline']) .control{--control-border-color:${Le}}:host([appearance='outline']) .control:hover{--control-border-color:${Lt}}:host(:where([appearance='outline'],[appearance='transparent'])) .control:hover::before{background-color:${mt}}:host([appearance='outline']) .control:hover::after{background-color:${Ht}}:host([appearance='outline']) .control:active{--control-border-color:${ko}}:host(:where([appearance='outline'],[appearance='transparent'])) .control:active::before{background-color:${vt}}:host(:where([appearance='outline'],[appearance='transparent'])) .control:active::after{background-color:${Vt}}:host([appearance='filled-darker']) .control{background-color:${$o}}:host(:where([appearance='filled-lighter'],[appearance='filled-darker'])) .control{--control-border-color:${J}}:host(:disabled),:host(:disabled) ::slotted(:where(button,input)){cursor:not-allowed}:host(:disabled) .control::before,:host(:disabled) .control::after{content:none}:host(:disabled) .control:is(*,:active,:hover),:host(:disabled) :where(slot[name='indicator'] > *,::slotted([slot='indicator'])){--control-border-color:${Ce};background-color:${it};color:${S}}::slotted([popover]:not(:popover-open)){display:none}@supports not (anchor-name:--anchor){:host{--listbox-max-height:50vh;--margin-offset:calc(${A} + (${je} * 2) + ${T})}:host([size='small']){--margin-offset:calc(${q} + (${qt} * 2) + ${T})}:host([size='large']){--margin-offset:calc(${ye} + (${V} * 2) + ${T})}}`,gp=Hr.compose({name:`${p.prefix}-dropdown`,template:lp,styles:bp});gp.define(p.registry);const fp={above:"above",after:"after",before:"before"},ze={badInput:"bad-input",customError:"custom-error",patternMismatch:"pattern-mismatch",rangeOverflow:"range-overflow",rangeUnderflow:"range-underflow",stepMismatch:"step-mismatch",tooLong:"too-long",tooShort:"too-short",typeMismatch:"type-mismatch",valueMissing:"value-missing",valid:"valid"};var mp=Object.defineProperty,vp=Object.getOwnPropertyDescriptor,_i=(o,e,t,i)=>{for(var r=i>1?void 0:i?vp(e,t):e,s=o.length-1,n;s>=0;s--)(n=o[s])&&(r=(i?n(e,t,r):n(r))||r);return i&&r&&mp(e,t,r),r};class zo extends ${constructor(){super(),this.labelSlot=[],this.elementInternals=this.attachInternals(),this.elementInternals.role="presentation"}labelSlotChanged(e,t){t&&this.input&&(this.setLabelProperties(),this.setStates())}messageSlotChanged(e,t){y(this.elementInternals,"has-message",!!t.length)}slottedInputsChanged(e,t){const i=t?.filter(r=>r.nodeType===Node.ELEMENT_NODE)??[];i?.length&&(this.input=i?.[0])}inputChanged(e,t){t&&(this.setStates(),this.setLabelProperties(),this.slottedInputObserver.observe(this.input,{attributes:!0,attributeFilter:["disabled","required","readonly"],subtree:!0}))}changeHandler(e){return this.setStates(),this.setValidationStates(),!0}clickHandler(e){return this===e.target&&this.input.click(),!0}connectedCallback(){super.connectedCallback(),this.addEventListener("invalid",this.invalidHandler,{capture:!0}),this.slottedInputObserver=new MutationObserver(()=>{this.setStates()})}disconnectedCallback(){this.slottedInputObserver.disconnect(),this.removeEventListener("invalid",this.invalidHandler,{capture:!0}),super.disconnectedCallback()}focusinHandler(e){return this.matches(":focus-within:has(> :focus-visible)")&&y(this.elementInternals,"focus-visible",!0),!0}focusoutHandler(e){return y(this.elementInternals,"focus-visible",!1),!0}invalidHandler(e){this.messageSlot.length&&e.preventDefault(),this.setValidationStates()}setLabelProperties(){this.$fastController.isConnected&&(this.input.id=this.input.id||Ft("input"),this.labelSlot?.forEach(e=>{e instanceof HTMLLabelElement&&(e.htmlFor=e.htmlFor||this.input.id,e.id=e.id||`${this.input.id}--label`,e.setAttribute("aria-hidden","true"),this.input.setAttribute("aria-labelledby",e.id))}))}setStates(){this.elementInternals&&this.input&&(y(this.elementInternals,"disabled",!!this.input.disabled),y(this.elementInternals,"readonly",!!this.input.readOnly),y(this.elementInternals,"required",!!this.input.required),y(this.elementInternals,"checked",!!this.input.checked))}setValidationStates(){if(this.input?.validity)for(const[e,t]of Object.entries(ze))y(this.elementInternals,t,this.input.validity[e])}}_i([g],zo.prototype,"labelSlot",2),_i([g],zo.prototype,"messageSlot",2),_i([g],zo.prototype,"slottedInputs",2),_i([g],zo.prototype,"input",2);var $p=Object.defineProperty,yp=Object.getOwnPropertyDescriptor,xp=(o,e,t,i)=>{for(var r=i>1?void 0:i?yp(e,t):e,s=o.length-1,n;s>=0;s--)(n=o[s])&&(r=(i?n(e,t,r):n(r))||r);return i&&r&&$p(e,t,r),r};class pa extends zo{constructor(){super(...arguments),this.labelPosition=fp.above}}xp([a({attribute:"label-position"})],pa.prototype,"labelPosition",2);const kp=u`
@@ -434,7 +434,7 @@ const p=Object.freeze({prefix:"fluent",shadowRootMode:"open",registry:customElem
   ${k("inline")}
 
   :host{position:relative;box-sizing:border-box;background-color:transparent;color:${El};cursor:pointer;font-family:${v};font-size:${B};font-weight:${_};overflow:inherit;text-align:start;text-decoration:none;text-decoration-thickness:${T};text-overflow:inherit;user-select:text}:host(:is(:hover,:focus-visible)){outline:none;text-decoration-line:underline}@media (hover:hover){:host(:hover){color:${Nl}}:host(:active){color:${Fl}}:host([appearance='subtle']:hover){color:${Dl}}:host([appearance='subtle']:active){color:${Hl}}}:host([appearance='subtle']){color:${Ml}}:host-context(:is(h1,h2,h3,h4,h5,h6,p,fluent-text)),:host([inline]){font:inherit;text-decoration:underline}:host(:not([href])){color:inherit;text-decoration:none}::slotted(a){position:absolute;inset:0}`.withBehaviors(U(u`
-    :host{color:LinkText}`));function Hp(){return b`<template tabindex="0" @click="${(o,e)=>o.clickHandler(e.event)}" @keydown="${(o,e)=>o.keydownHandler(e.event)}"><slot></slot></template>`}const Vp=Hp(),Lp=Vr.compose({name:`${p.prefix}-link`,template:Vp,styles:Dp});Lp.define(p.registry);var jp=Object.defineProperty,Rp=Object.getOwnPropertyDescriptor,Oo=(o,e,t,i)=>{for(var r=i>1?void 0:i?Rp(e,t):e,s=o.length-1,n;s>=0;s--)(n=o[s])&&(r=(i?n(e,t,r):n(r))||r);return i&&r&&jp(e,t,r),r};class Jt extends ${constructor(){super(),this.id=Qt("listbox-"),this.elementInternals=this.attachInternals(),this.elementInternals.role="listbox"}multipleChanged(e,t){this.elementInternals.ariaMultiSelectable=t?"true":"false",y(this.elementInternals,"multiple",t),Q.enqueue(()=>{this.options.forEach(i=>{i.multiple=!!t})})}optionsChanged(e,t){t?.forEach((i,r)=>{i.elementInternals.ariaPosInSet=`${r+1}`,i.elementInternals.ariaSetSize=`${t.length}`})}beforetoggleHandler(e){if(!this.dropdown)return!0;if(this.dropdown.disabled){this.dropdown.open=!1;return}return this.dropdown.open=e.newState==="open",!0}get enabledOptions(){return this.options?.filter(e=>!e.disabled)??[]}get selectedOptions(){return this.options?.filter(e=>e.selected)??[]}clickHandler(e){if(this.dropdown)return!0;const t=e.target;return Oi(t)&&this.selectOption(this.enabledOptions.indexOf(t)),!0}handleChange(e,t){if(t==="multiple"){this.multiple=e.multiple;return}}selectOption(e=this.selectedIndex){let t=this.selectedIndex;if(!this.multiple)this.enabledOptions.forEach((i,r)=>{const s=r===e;i.selected=s,s&&(t=r)});else{const i=this.enabledOptions[e];i&&(i.selected=!i.selected),t=e}this.selectedIndex=t}slotchangeHandler(e){ha(this,()=>{const t=e.target.assignedElements().filter(i=>Oi(i));this.options=t})}}Oo([a({attribute:"id",mode:"fromView"})],Jt.prototype,"id",2),Oo([g],Jt.prototype,"multiple",2),Oo([g],Jt.prototype,"options",2),Oo([g],Jt.prototype,"selectedIndex",2),Oo([g],Jt.prototype,"dropdown",2);const qp=u`
+    :host{color:LinkText}`));function Hp(){return b`<template tabindex="0" @click="${(o,e)=>o.clickHandler(e.event)}" @keydown="${(o,e)=>o.keydownHandler(e.event)}"><slot></slot></template>`}const Vp=Hp(),Lp=Vr.compose({name:`${p.prefix}-link`,template:Vp,styles:Dp});Lp.define(p.registry);var jp=Object.defineProperty,Rp=Object.getOwnPropertyDescriptor,Oo=(o,e,t,i)=>{for(var r=i>1?void 0:i?Rp(e,t):e,s=o.length-1,n;s>=0;s--)(n=o[s])&&(r=(i?n(e,t,r):n(r))||r);return i&&r&&jp(e,t,r),r};class Jt extends ${constructor(){super(),this.id=Qt("listbox-"),this.elementInternals=this.attachInternals(),this.elementInternals.role="listbox"}multipleChanged(e,t){this.elementInternals.ariaMultiSelectable=t?"true":"false",y(this.elementInternals,"multiple",t),Q.enqueue(()=>{this.options.forEach(i=>{i.multiple=!!t})})}optionsChanged(e,t){t?.forEach((i,r)=>{i.elementInternals.ariaPosInSet=`${r+1}`,i.elementInternals.ariaSetSize=`${t.length}`})}beforetoggleHandler(e){if(!this.dropdown)return!0;if(this.dropdown.disabled){this.dropdown.open=!1;return}return this.dropdown.open=e.newState==="open",!0}get enabledOptions(){return this.options?.filter(e=>!e.disabled)??[]}get selectedOptions(){return this.options?.filter(e=>e.selected)??[]}clickHandler(e){if(this.dropdown)return!0;const t=e.target;return Oi(t)&&this.selectOption(this.enabledOptions.indexOf(t)),!0}handleChange(e,t){if(t==="multiple"){this.multiple=e.multiple;return}}selectOption(e=this.selectedIndex){let t=this.selectedIndex;if(!this.multiple)this.enabledOptions.forEach((i,r)=>{const s=r===e;i.selected=s,s&&(t=r)});else{const i=this.enabledOptions[e];i&&(i.selected=!i.selected),t=e}this.selectedIndex=t}slotchangeHandler(e){const t=e.target;ha(this,()=>{const i=t.assignedElements().filter(r=>Oi(r));this.options=i})}}Oo([a({attribute:"id",mode:"fromView"})],Jt.prototype,"id",2),Oo([g],Jt.prototype,"multiple",2),Oo([g],Jt.prototype,"options",2),Oo([g],Jt.prototype,"selectedIndex",2),Oo([g],Jt.prototype,"dropdown",2);const qp=u`
   ${k("inline-flex")}
 
   :host{background-color:${I};border-radius:${C};border:none;box-shadow:${xr};box-sizing:border-box;flex-direction:column;margin:0;min-width:160px;padding:${ne};row-gap:${H};width:auto}:host([popover]){inset:unset;overflow:auto}@supports (anchor-name:--anchor){:host([popover]){position:absolute;margin-block-start:0;max-height:var(--listbox-max-height,calc(50vh - anchor-size(self-block)));min-width:anchor-size(width);position-anchor:--dropdown;position-area:block-end span-inline-end;position-try-fallbacks:flip-inline,flip-block,--flip-block,block-start}@position-try --flip-block{bottom:anchor(top);top:unset}}@supports not (anchor-name:--anchor){:host([popover]){margin-block-start:var(--margin-offset,0);max-height:var(--listbox-max-height,50vh);position:fixed}:host([popover]${Gh}){margin-block-start:revert;translate:0 -100%}}`;function Wp(){return b`<template id="${o=>o.id}" @beforetoggle="${(o,e)=>o.beforetoggleHandler(e.event)}" @click="${(o,e)=>o.clickHandler(e.event)}"><slot @slotchange="${(o,e)=>o.slotchangeHandler(e.event)}"></slot></template>`}const Gp=Wp(),Up=Jt.compose({name:`${p.prefix}-listbox`,template:Gp,styles:qp});Up.define(p.registry);class Xp extends Ye{}const Kp=Ar({end:b.partial(`
@@ -525,7 +525,7 @@ const p=Object.freeze({prefix:"fluent",shadowRootMode:"open",registry:customElem
     .background{display:none}.indicator{border-color:Canvas;border-block-start-color:Highlight;border-right-color:Highlight}`)),kg=b`<slot name="indicator"><div class="background"></div><div class="progress"><div class="spinner"><div class="start"><div class="indicator"></div></div><div class="end"><div class="indicator"></div></div></div></div></slot>`,wg=Wr.compose({name:`${p.prefix}-spinner`,template:kg,styles:xg});wg.define(p.registry);class Cg extends Pe{constructor(){super(),this.elementInternals.role="switch"}}function Sg(o={}){return b`<template @click="${(e,t)=>e.clickHandler(t.event)}" @input="${(e,t)=>e.inputHandler(t.event)}" @keydown="${(e,t)=>e.keydownHandler(t.event)}" @keyup="${(e,t)=>e.keyupHandler(t.event)}"><slot name="switch">${fe(o.switch)}</slot></template>`}const Ig=Sg({switch:'<span class="checked-indicator" part="checked-indicator"></span>'}),Pg=u`
   ${k("inline-flex")}
 
-  :host{box-sizing:border-box;align-items:center;flex-direction:row;outline:none;user-select:none;contain:content;padding:0 ${H};width:40px;height:20px;background-color:${me};border:1px solid ${Ve};border-radius:${$e}}:host(:enabled){cursor:pointer}:host(:hover){background:none;border-color:${mt}}:host(:active){border-color:${vt}}:host(:disabled),:host([readonly]){border:1px solid ${Ce};background-color:none;pointer:default}:host(${x}){background:${ft};border-color:${ft}}:host(${x}:hover){background:${Ht};border-color:${Ht}}:host(${x}:active){background:${Vt};border-color:${Vt}}:host(${x}:disabled){background:${it};border-color:${Ce}}.checked-indicator{height:14px;width:14px;border-radius:50%;margin-inline-start:0;background-color:${Z};transition-duration:${$i};transition-timing-function:${xi};transition-property:margin-inline-start}:host(${x}) .checked-indicator{background-color:${bt};margin-inline-start:calc(100% - 14px)}:host(${x}:hover) .checked-indicator{background:${Ll}}:host(${x}:active) .checked-indicator{background:${jl}}:host(:hover) .checked-indicator{background-color:${Ol}}:host(:active) .checked-indicator{background-color:${_l}}:host(:disabled) .checked-indicator,:host([readonly]) .checked-indicator{background:${S}}:host(${x}:disabled) .checked-indicator{background:${S}}:host(:focus-visible){outline:none}:host(:not([slot='input']):focus-visible){border-color:${J};outline:${ue} solid ${J};box-shadow:${fi},0 0 0 2px ${ve}}`.withBehaviors(U(u`
+  :host{box-sizing:border-box;align-items:center;flex-direction:row;outline:none;user-select:none;contain:content;padding:0 ${H};width:40px;height:20px;background-color:${me};border:1px solid ${Ve};border-radius:${$e}}:host(:enabled){cursor:pointer}:host(:hover){background:none;border-color:${mt}}:host(:active){border-color:${vt}}:host(:disabled),:host([readonly]){border:1px solid ${Ce};background-color:none;pointer:default}:host(${x}){background:${ft};border-color:${ft}}:host(${x}:hover){background:${Ht};border-color:${Ht}}:host(${x}:active){background:${Vt};border-color:${Vt}}:host(${x}:disabled){background:${it};border-color:${Ce}}.checked-indicator{height:14px;width:14px;border-radius:50%;margin-inline-start:0;background-color:${Z};transition-duration:${$i};transition-timing-function:${xi};transition-property:margin-inline-start}:host(${x}) .checked-indicator{background-color:${bt};margin-inline-start:calc(100% - 14px)}:host(${x}:hover) .checked-indicator{background:${Ll}}:host(${x}:active) .checked-indicator{background:${jl}}:host(:hover) .checked-indicator{background-color:${Ol}}:host(:active) .checked-indicator{background-color:${_l}}:host(:disabled) .checked-indicator,:host([readonly]) .checked-indicator{background:${S}}:host(${x}:disabled) .checked-indicator{background:${S}}:host(:focus-visible){outline:none}:host(:not([slot='input']):focus-visible){border-color:${J};outline:${ue} solid ${J};outline-offset:1px;box-shadow:${fi},0 0 0 2px ${ve}}`.withBehaviors(U(u`
     :host{border-color:InactiveBorder}:host(${x}),:host(${x}:active),:host(${x}:hover){background:Highlight;border-color:Highlight}.checked-indicator,:host(:hover) .checked-indicator,:host(:active) .checked-indicator{background-color:ActiveCaption}:host(${x}) .checked-indicator,:host(${x}:hover) .checked-indicator,:host(${x}:active) .checked-indicator{background-color:ButtonFace}:host(:disabled) .checked-indicator,:host(${x}:disabled) .checked-indicator{background-color:GrayText}`)),zg=Cg.compose({name:`${p.prefix}-switch`,template:Ig,styles:Pg});zg.define(p.registry);class Tg extends ${}function Bg(){return b`<template slot="tabpanel" role="tabpanel"><slot></slot></template>`}const Og=Bg(),_g=u`
   ${k("block")}
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fluentui/web-components",
   "description": "A library of Fluent Web Components",
-  "version": "3.0.0-beta.122",
+  "version": "3.0.0-beta.124",
   "author": {
     "name": "Microsoft",
     "url": "https://discord.gg/FcSNfg4"
@@ -27,6 +27,8 @@
   ],
   "exports": {
     ".": "./dist/esm/index.js",
+    "./utils/behaviors/*.js": "./dist/esm/utils/behaviors/*.js",
+    "./utils/*.js": "./dist/esm/utils/*.js",
     "./utilities.js": "./dist/esm/utils/index.js",
     "./theme/*.js": "./dist/esm/theme/*.js",
     "./*/base.js": "./dist/esm/*/*.base.js",
@@ -65,6 +67,7 @@
     "start": "yarn start-storybook -p 6006 --docs",
     "start-storybook": "storybook dev",
     "build-storybook": "storybook build -o ./dist/storybook --docs",
+    "build-storybook:docsite": "cross-env DEPLOY_PATH=/web-components/ storybook build -o ./dist/storybook --docs",
     "e2e": "node ./scripts/e2e.js",
     "e2e:local": "node ./scripts/e2e.js --ui"
   },