@fluentui/web-components 3.0.0-beta.8 → 3.0.0-beta.80

package/dist/dts/menu-item/menu-item.bench.d.ts

@@ -0,0 +1,3 @@
+declare const itemRenderer: () => HTMLElement;
+export default itemRenderer;
+export { tests } from '../utils/benchmark-wrapper.js';

package/dist/dts/menu-item/menu-item.d.ts

@@ -1,43 +1,40 @@
 import { FASTElement } from '@microsoft/fast-element';
-import type { StaticallyComposableHTML } from '../utils/template-helpers.js';
 import type { StartEndOptions } from '../patterns/start-end.js';
 import { StartEnd } from '../patterns/start-end.js';
+import type { StaticallyComposableHTML } from '../utils/template-helpers.js';
 import { MenuItemRole, roleForMenuItem } from './menu-item.options.js';
-export declare type MenuItemColumnCount = 0 | 1 | 2;
+export type MenuItemColumnCount = 0 | 1 | 2;
 export { MenuItemRole, roleForMenuItem };
 /**
  * Menu Item configuration options
  * @public
  */
-export declare type MenuItemOptions = StartEndOptions<MenuItem> & {
-    checkboxIndicator?: StaticallyComposableHTML<MenuItem>;
-    expandCollapseGlyph?: StaticallyComposableHTML<MenuItem>;
-    radioIndicator?: StaticallyComposableHTML<MenuItem>;
+export type MenuItemOptions = StartEndOptions<MenuItem> & {
+    indicator?: StaticallyComposableHTML<MenuItem>;
+    submenuGlyph?: StaticallyComposableHTML<MenuItem>;
 };
 /**
  * A Switch Custom HTML Element.
  * Implements {@link https://www.w3.org/TR/wai-aria-1.1/#menuitem | ARIA menuitem }, {@link https://www.w3.org/TR/wai-aria-1.1/#menuitemcheckbox | ARIA menuitemcheckbox}, or {@link https://www.w3.org/TR/wai-aria-1.1/#menuitemradio | ARIA menuitemradio }.
  *
- * @slot checked-indicator - The checked indicator
- * @slot radio-indicator - The radio indicator
+ * @slot indicator - The checkbox or radio indicator
  * @slot start - Content which can be provided before the menu item content
- * @slot end - Content which can be provided after the menu item content
  * @slot - The default slot for menu item content
- * @slot expand-collapse-indicator - The expand/collapse indicator
+ * @slot end - Content which can be provided after the menu item content
+ * @slot submenu-glyph - The submenu expand/collapse indicator
  * @slot submenu - Used to nest menu's within menu items
- * @csspart input-container - The element representing the visual checked or radio indicator
- * @csspart checkbox - The element wrapping the `menuitemcheckbox` indicator
- * @csspart radio - The element wrapping the `menuitemradio` indicator
  * @csspart content - The element wrapping the menu item content
- * @csspart expand-collapse-glyph-container - The element wrapping the expand collapse element
- * @csspart expand-collapse - The expand/collapse element
- * @csspart submenu-region - The container for the submenu, used for positioning
- * @fires expanded-change - Fires a custom 'expanded-change' event when the expanded state changes
  * @fires change - Fires a custom 'change' event when a non-submenu item with a role of `menuitemcheckbox`, `menuitemradio`, or `menuitem` is invoked
  *
  * @public
  */
 export declare class MenuItem extends FASTElement {
+    /**
+     * The internal {@link https://developer.mozilla.org/docs/Web/API/ElementInternals | `ElementInternals`} instance for the component.
+     *
+     * @internal
+     */
+    elementInternals: ElementInternals;
     /**
      * The disabled state of the element.
      *
@@ -47,14 +44,11 @@ export declare class MenuItem extends FASTElement {
      */
     disabled: boolean;
     /**
-     * The expanded state of the element.
-     *
-     * @public
-     * @remarks
-     * HTML Attribute: expanded
+     * Handles changes to disabled attribute custom states and element internals
+     * @param prev - the previous state
+     * @param next - the next state
      */
-    expanded: boolean;
-    protected expandedChanged(prev: boolean | undefined, next: boolean): void;
+    disabledChanged(prev: boolean | undefined, next: boolean | undefined): void;
     /**
      * The role of the element.
      *
@@ -64,11 +58,11 @@ export declare class MenuItem extends FASTElement {
      */
     role: MenuItemRole;
     /**
-     * Cleanup function for the submenu positioner.
-     *
-     * @public
+     * Handles changes to role attribute element internals properties
+     * @param prev - the previous state
+     * @param next - the next state
      */
-    cleanup: () => void;
+    roleChanged(prev: MenuItemRole | undefined, next: MenuItemRole | undefined): void;
     /**
      * The checked value of the element.
      *
@@ -77,7 +71,12 @@ export declare class MenuItem extends FASTElement {
      * HTML Attribute: checked
      */
     checked: boolean;
-    protected checkedChanged(oldValue: boolean, newValue: boolean): void;
+    /**
+     * Handles changes to checked attribute custom states and element internals
+     * @param prev - the previous state
+     * @param next - the next state
+     */
+    protected checkedChanged(prev: boolean, next: boolean): void;
     /**
      * The hidden attribute.
      *
@@ -92,31 +91,17 @@ export declare class MenuItem extends FASTElement {
      * @internal
      */
     slottedSubmenu: HTMLElement[];
-    /**
-     * @internal
-     */
-    get hasSubmenu(): boolean;
     /**
      * Sets the submenu and updates its position.
      *
      * @internal
      */
     protected slottedSubmenuChanged(prev: HTMLElement[] | undefined, next: HTMLElement[]): void;
-    /**
-     * The container for the submenu.
-     *
-     * @internal
-     */
-    submenuContainer: HTMLDivElement;
     /**
      * @internal
      */
     submenu: HTMLElement | undefined;
-    private focusSubmenuOnLoad;
-    /**
-     * @internal
-     */
-    disconnectedCallback(): void;
+    connectedCallback(): void;
     /**
      * @internal
      */
@@ -125,10 +110,6 @@ export declare class MenuItem extends FASTElement {
      * @internal
      */
     handleMenuItemClick: (e: MouseEvent) => boolean;
-    /**
-     * @internal
-     */
-    submenuLoaded: () => void;
     /**
      * @internal
      */
@@ -138,23 +119,19 @@ export declare class MenuItem extends FASTElement {
      */
     handleMouseOut: (e: MouseEvent) => boolean;
     /**
+     * Setup required ARIA on open/close
      * @internal
      */
-    private closeSubMenu;
-    /**
-     * @internal
-     */
-    private expandAndFocus;
+    toggleHandler: (e: Event) => void;
     /**
      * @internal
      */
     private invoke;
     /**
-     * Calculate and apply submenu positioning.
-     *
-     * @public
+     * Set fallback position of menu on open when CSS anchor not supported
+     * @internal
      */
-    updateSubmenu(): void;
+    setSubmenuPosition: () => void;
 }
 /**
  * Mark internal because exporting class and interface of the same name

package/dist/dts/menu-item/menu-item.options.d.ts

@@ -21,10 +21,10 @@ export declare const MenuItemRole: {
  * The types for menu item roles
  * @public
  */
-export declare type MenuItemRole = ValuesOf<typeof MenuItemRole>;
+export type MenuItemRole = ValuesOf<typeof MenuItemRole>;
 /**
  * @internal
  */
 export declare const roleForMenuItem: {
-    [value in keyof typeof MenuItemRole]: typeof MenuItemRole[value];
+    [value in keyof typeof MenuItemRole]: (typeof MenuItemRole)[value];
 };

package/dist/dts/menu-list/index.d.ts

@@ -1,4 +1,4 @@
-export * from './menu-list.js';
+export { MenuList } from './menu-list.js';
 export { template as MenuListTemplate } from './menu-list.template.js';
 export { styles as MenuListStyles } from './menu-list.styles.js';
 export { definition as MenuListDefinition } from './menu-list.definition.js';

package/dist/dts/menu-list/menu-list.bench.d.ts

@@ -0,0 +1,3 @@
+declare const itemRenderer: () => HTMLElement;
+export default itemRenderer;
+export { tests } from '../utils/benchmark-wrapper.js';

package/dist/dts/menu-list/menu-list.d.ts

@@ -8,19 +8,25 @@ import { FASTElement } from '@microsoft/fast-element';
  * @public
  */
 export declare class MenuList extends FASTElement {
+    /**
+     * The internal {@link https://developer.mozilla.org/docs/Web/API/ElementInternals | `ElementInternals`} instance for the component.
+     *
+     * @internal
+     */
+    elementInternals: ElementInternals;
     /**
      * @internal
      */
     items: HTMLElement[];
     protected itemsChanged(oldValue: HTMLElement[], newValue: HTMLElement[]): void;
     protected menuItems: Element[] | undefined;
-    private expandedItem;
     /**
      * The index of the focusable element in the items array
      * defaults to -1
      */
     private focusIndex;
     private static focusableElementRoles;
+    constructor();
     /**
      * @internal
      */
@@ -39,12 +45,6 @@ export declare class MenuList extends FASTElement {
      * @public
      */
     focus(): void;
-    /**
-     * Collapses any expanded menu items.
-     *
-     * @public
-     */
-    collapseExpandedItem(): void;
     /**
      * @internal
      */
@@ -55,15 +55,17 @@ export declare class MenuList extends FASTElement {
      */
     handleFocusOut: (e: FocusEvent) => void;
     private handleItemFocus;
-    private handleExpandedChanged;
     private removeItemListeners;
     private static elementIndent;
     protected setItems(): void;
+    /**
+     * Method for Observable changes to the hidden attribute of child elements
+     */
     handleChange(source: any, propertyName: string): void;
     /**
-     * handle change from child element
+     * Handle change from child MenuItem element and set radio group behavior
      */
-    private changeHandler;
+    private changedMenuItemHandler;
     /**
      * check if the item is a menu item
      */

package/dist/dts/menu-list/menu-list.template.d.ts

@@ -1,4 +1,4 @@
-import { ElementViewTemplate } from '@microsoft/fast-element';
+import { type ElementViewTemplate } from '@microsoft/fast-element';
 import type { MenuList } from './menu-list.js';
 export declare function menuTemplate<T extends MenuList>(): ElementViewTemplate<T>;
 export declare const template: ElementViewTemplate<MenuList>;

package/dist/dts/message-bar/define.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/dts/message-bar/index.d.ts

@@ -0,0 +1,5 @@
+export { definition as MessageBarDefinition } from './message-bar.definition.js';
+export { MessageBar } from './message-bar.js';
+export { MessageBarIntent, MessageBarLayout, MessageBarShape } from './message-bar.options.js';
+export { styles as MessageBarStyles } from './message-bar.styles.js';
+export { template as MessageBarTemplate } from './message-bar.template.js';

package/dist/dts/message-bar/message-bar.bench.d.ts

@@ -0,0 +1,3 @@
+declare const itemRenderer: () => HTMLElement;
+export default itemRenderer;
+export { tests } from '../utils/benchmark-wrapper.js';

package/dist/dts/message-bar/message-bar.d.ts

@@ -0,0 +1,66 @@
+import { FASTElement } from '@microsoft/fast-element';
+import { MessageBarIntent, MessageBarLayout, MessageBarShape } from './message-bar.options.js';
+/**
+ * A Message Bar Custom HTML Element.
+ *
+ * @slot actions - Content that can be provided for the actions
+ * @slot dismiss - Content that can be provided for the dismiss button
+ * @slot - The default slot for the content
+ * @public
+ */
+export declare class MessageBar extends FASTElement {
+    /**
+     * The internal {@link https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals | `ElementInternals`} instance for the component.
+     *
+     * @internal
+     */
+    elementInternals: ElementInternals;
+    constructor();
+    /**
+     * Sets the shape of the Message Bar.
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `shape`
+     */
+    shape?: MessageBarShape;
+    /**
+     * Handles changes to shape attribute custom states
+     * @param prev - the previous state
+     * @param next - the next state
+     */
+    shapeChanged(prev: MessageBarShape | undefined, next: MessageBarShape | undefined): void;
+    /**
+     * Sets the layout of the control.
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `layout`
+     */
+    layout?: MessageBarLayout;
+    /**
+     * Handles changes to the layout attribute custom states
+     * @param prev - the previous state
+     * @param next - the next state
+     */
+    layoutChanged(prev: MessageBarLayout | undefined, next: MessageBarLayout | undefined): void;
+    /**
+     * Sets the intent of the control.
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `intent`
+     */
+    intent?: MessageBarIntent;
+    /**
+     * Handles changes to the intent attribute custom states
+     * @param prev - the previous state
+     * @param next - the next state
+     */
+    intentChanged(prev: MessageBarIntent | undefined, next: MessageBarIntent | undefined): void;
+    /**
+     * @public
+     * Method to emit a `dismiss` event when the message bar is dismissed
+     */
+    dismissMessageBar: () => void;
+}

package/dist/dts/message-bar/message-bar.definition.d.ts

@@ -0,0 +1,9 @@
+import { MessageBar } from './message-bar.js';
+/**
+ * The Fluent MessageBar Element definition.
+ *
+ * @public
+ * @remarks
+ * HTML Element: `<fluent-message-bar>`
+ */
+export declare const definition: import("@microsoft/fast-element").FASTElementDefinition<typeof MessageBar>;

package/dist/dts/message-bar/message-bar.options.d.ts

@@ -0,0 +1,30 @@
+import type { ValuesOf } from '../utils/typings.js';
+/**
+ * @public
+ * The `layout` variations for the MessageBar component.
+ */
+export declare const MessageBarLayout: {
+    readonly multiline: "multiline";
+    readonly singleline: "singleline";
+};
+export type MessageBarLayout = ValuesOf<typeof MessageBarLayout>;
+/**
+ * @public
+ * The `shape` variations for the MessageBar component.
+ */
+export declare const MessageBarShape: {
+    readonly rounded: "rounded";
+    readonly square: "square";
+};
+export type MessageBarShape = ValuesOf<typeof MessageBarShape>;
+/**
+ * @public
+ * The `intent` variations for the MessageBar component.
+ */
+export declare const MessageBarIntent: {
+    readonly success: "success";
+    readonly warning: "warning";
+    readonly error: "error";
+    readonly info: "info";
+};
+export type MessageBarIntent = ValuesOf<typeof MessageBarIntent>;

package/dist/dts/message-bar/message-bar.styles.d.ts

@@ -0,0 +1,7 @@
+import type { ElementStyles } from '@microsoft/fast-element';
+/**
+ * Styles for the MessageBar component.
+ *
+ * @public
+ */
+export declare const styles: ElementStyles;

package/dist/dts/message-bar/message-bar.template.d.ts

@@ -0,0 +1,14 @@
+import { type ElementViewTemplate } from '@microsoft/fast-element';
+import type { MessageBar } from './message-bar.js';
+/**
+ * Generates a template for the MessageBar component.
+ * @public
+ * @param {MessageBar} T - The type of the MessageBar.
+ * @returns {ElementViewTemplate<T>} - The template for the MessageBar component.
+ */
+export declare function messageBarTemplate<T extends MessageBar>(): ElementViewTemplate<T>;
+/**
+ * The template for the MessageBar component.
+ * @type {ElementViewTemplate<MessageBar>}
+ */
+export declare const template: ElementViewTemplate<MessageBar>;

package/dist/dts/option/define.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/dts/option/index.d.ts

@@ -0,0 +1,5 @@
+export { definition as DropdownOptionDefinition } from './option.definition.js';
+export { DropdownOption } from './option.js';
+export { isDropdownOption, type DropdownOptionOptions } from './option.options.js';
+export { styles as DropdownOptionStyles } from './option.styles.js';
+export { template as DropdownOptionTemplate } from './option.template.js';