@fluentui/web-components 3.0.0-alpha.9 → 3.0.0-beta.10

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

@@ -1,2 +1,2 @@
-export * from './design-tokens.js';
-export { setTheme } from './set-theme.js';
+export { borderRadiusNone, borderRadiusSmall, borderRadiusMedium, borderRadiusLarge, borderRadiusXLarge, borderRadiusCircular, fontSizeBase100, fontSizeBase200, fontSizeBase300, fontSizeBase400, fontSizeBase500, fontSizeBase600, fontSizeHero700, fontSizeHero800, fontSizeHero900, fontSizeHero1000, lineHeightBase100, lineHeightBase200, lineHeightBase300, lineHeightBase400, lineHeightBase500, lineHeightBase600, lineHeightHero700, lineHeightHero800, lineHeightHero900, lineHeightHero1000, fontFamilyBase, fontFamilyMonospace, fontFamilyNumeric, fontWeightRegular, fontWeightMedium, fontWeightSemibold, fontWeightBold, strokeWidthThin, strokeWidthThick, strokeWidthThicker, strokeWidthThickest, spacingHorizontalNone, spacingHorizontalXXS, spacingHorizontalXS, spacingHorizontalSNudge, spacingHorizontalS, spacingHorizontalMNudge, spacingHorizontalM, spacingHorizontalL, spacingHorizontalXL, spacingHorizontalXXL, spacingHorizontalXXXL, spacingVerticalNone, spacingVerticalXXS, spacingVerticalXS, spacingVerticalSNudge, spacingVerticalS, spacingVerticalMNudge, spacingVerticalM, spacingVerticalL, spacingVerticalXL, spacingVerticalXXL, spacingVerticalXXXL, durationUltraFast, durationFaster, durationFast, durationNormal, durationSlow, durationSlower, durationUltraSlow, curveAccelerateMax, curveAccelerateMid, curveAccelerateMin, curveDecelerateMax, curveDecelerateMid, curveDecelerateMin, curveEasyEaseMax, curveEasyEase, curveLinear, colorNeutralForeground1, colorNeutralForeground1Hover, colorNeutralForeground1Pressed, colorNeutralForeground1Selected, colorNeutralForeground2, colorNeutralForeground2Hover, colorNeutralForeground2Pressed, colorNeutralForeground2Selected, colorNeutralForeground2BrandHover, colorNeutralForeground2BrandPressed, colorNeutralForeground2BrandSelected, colorNeutralForeground3, colorNeutralForeground3Hover, colorNeutralForeground3Pressed, colorNeutralForeground3Selected, colorNeutralForeground3BrandHover, colorNeutralForeground3BrandPressed, colorNeutralForeground3BrandSelected, colorNeutralForeground4, colorNeutralForegroundDisabled, colorNeutralForegroundInvertedDisabled, colorBrandForegroundLink, colorBrandForegroundLinkHover, colorBrandForegroundLinkPressed, colorBrandForegroundLinkSelected, colorNeutralForeground2Link, colorNeutralForeground2LinkHover, colorNeutralForeground2LinkPressed, colorNeutralForeground2LinkSelected, colorCompoundBrandForeground1, colorCompoundBrandForeground1Hover, colorCompoundBrandForeground1Pressed, colorBrandForeground1, colorBrandForeground2, colorNeutralForeground1Static, colorNeutralForegroundStaticInverted, colorNeutralForegroundInverted, colorNeutralForegroundInvertedHover, colorNeutralForegroundInvertedPressed, colorNeutralForegroundInvertedSelected, colorNeutralForegroundInverted2, colorNeutralForegroundOnBrand, colorNeutralForegroundInvertedLink, colorNeutralForegroundInvertedLinkHover, colorNeutralForegroundInvertedLinkPressed, colorNeutralForegroundInvertedLinkSelected, colorBrandForegroundInverted, colorBrandForegroundInvertedHover, colorBrandForegroundInvertedPressed, colorBrandForegroundOnLight, colorBrandForegroundOnLightHover, colorBrandForegroundOnLightPressed, colorBrandForegroundOnLightSelected, colorNeutralBackground1, colorNeutralBackground1Hover, colorNeutralBackground1Pressed, colorNeutralBackground1Selected, colorNeutralBackground2, colorNeutralBackground2Hover, colorNeutralBackground2Pressed, colorNeutralBackground2Selected, colorNeutralBackground3, colorNeutralBackground3Hover, colorNeutralBackground3Pressed, colorNeutralBackground3Selected, colorNeutralBackground4, colorNeutralBackground4Hover, colorNeutralBackground4Pressed, colorNeutralBackground4Selected, colorNeutralBackground5, colorNeutralBackground5Hover, colorNeutralBackground5Pressed, colorNeutralBackground5Selected, colorNeutralBackground6, colorNeutralBackgroundInverted, colorNeutralBackgroundStatic, colorSubtleBackground, colorSubtleBackgroundHover, colorSubtleBackgroundPressed, colorSubtleBackgroundSelected, colorSubtleBackgroundLightAlphaHover, colorSubtleBackgroundLightAlphaPressed, colorSubtleBackgroundLightAlphaSelected, colorSubtleBackgroundInverted, colorSubtleBackgroundInvertedHover, colorSubtleBackgroundInvertedPressed, colorSubtleBackgroundInvertedSelected, colorTransparentBackground, colorTransparentBackgroundHover, colorTransparentBackgroundPressed, colorTransparentBackgroundSelected, colorNeutralBackgroundDisabled, colorNeutralBackgroundInvertedDisabled, colorNeutralStencil1, colorNeutralStencil2, colorNeutralStencil1Alpha, colorNeutralStencil2Alpha, colorBackgroundOverlay, colorScrollbarOverlay, colorBrandBackground, colorBrandBackgroundHover, colorBrandBackgroundPressed, colorBrandBackgroundSelected, colorCompoundBrandBackground, colorCompoundBrandBackgroundHover, colorCompoundBrandBackgroundPressed, colorBrandBackgroundStatic, colorBrandBackground2, colorBrandBackgroundInverted, colorBrandBackgroundInvertedHover, colorBrandBackgroundInvertedPressed, colorBrandBackgroundInvertedSelected, colorNeutralStrokeAccessible, colorNeutralStrokeAccessibleHover, colorNeutralStrokeAccessiblePressed, colorNeutralStrokeAccessibleSelected, colorNeutralStroke1, colorNeutralStroke1Hover, colorNeutralStroke1Pressed, colorNeutralStroke1Selected, colorNeutralStroke2, colorNeutralStroke3, colorNeutralStrokeOnBrand, colorNeutralStrokeOnBrand2, colorNeutralStrokeOnBrand2Hover, colorNeutralStrokeOnBrand2Pressed, colorNeutralStrokeOnBrand2Selected, colorBrandStroke1, colorBrandStroke2, colorCompoundBrandStroke, colorCompoundBrandStrokeHover, colorCompoundBrandStrokePressed, colorNeutralStrokeDisabled, colorNeutralStrokeInvertedDisabled, colorTransparentStroke, colorTransparentStrokeInteractive, colorTransparentStrokeDisabled, colorStrokeFocus1, colorStrokeFocus2, colorNeutralShadowAmbient, colorNeutralShadowKey, colorNeutralShadowAmbientLighter, colorNeutralShadowKeyLighter, colorNeutralShadowAmbientDarker, colorNeutralShadowKeyDarker, colorBrandShadowAmbient, colorBrandShadowKey, colorPaletteRedBackground1, colorPaletteRedBackground2, colorPaletteRedBackground3, colorPaletteRedForeground1, colorPaletteRedForeground2, colorPaletteRedForeground3, colorPaletteRedBorderActive, colorPaletteRedBorder1, colorPaletteRedBorder2, colorPaletteGreenBackground1, colorPaletteGreenBackground2, colorPaletteGreenBackground3, colorPaletteGreenForeground1, colorPaletteGreenForeground2, colorPaletteGreenForeground3, colorPaletteGreenBorderActive, colorPaletteGreenBorder1, colorPaletteGreenBorder2, colorPaletteDarkOrangeBackground1, colorPaletteDarkOrangeBackground2, colorPaletteDarkOrangeBackground3, colorPaletteDarkOrangeForeground1, colorPaletteDarkOrangeForeground2, colorPaletteDarkOrangeForeground3, colorPaletteDarkOrangeBorderActive, colorPaletteDarkOrangeBorder1, colorPaletteDarkOrangeBorder2, colorPaletteYellowBackground1, colorPaletteYellowBackground2, colorPaletteYellowBackground3, colorPaletteYellowForeground1, colorPaletteYellowForeground2, colorPaletteYellowForeground3, colorPaletteYellowBorderActive, colorPaletteYellowBorder1, colorPaletteYellowBorder2, colorPaletteBerryBackground1, colorPaletteBerryBackground2, colorPaletteBerryBackground3, colorPaletteBerryForeground1, colorPaletteBerryForeground2, colorPaletteBerryForeground3, colorPaletteBerryBorderActive, colorPaletteBerryBorder1, colorPaletteBerryBorder2, colorPaletteLightGreenBackground1, colorPaletteLightGreenBackground2, colorPaletteLightGreenBackground3, colorPaletteLightGreenForeground1, colorPaletteLightGreenForeground2, colorPaletteLightGreenForeground3, colorPaletteLightGreenBorderActive, colorPaletteLightGreenBorder1, colorPaletteLightGreenBorder2, colorPaletteMarigoldBackground1, colorPaletteMarigoldBackground2, colorPaletteMarigoldBackground3, colorPaletteMarigoldForeground1, colorPaletteMarigoldForeground2, colorPaletteMarigoldForeground3, colorPaletteMarigoldBorderActive, colorPaletteMarigoldBorder1, colorPaletteMarigoldBorder2, colorPaletteDarkRedBackground2, colorPaletteDarkRedForeground2, colorPaletteDarkRedBorderActive, colorPaletteCranberryBackground2, colorPaletteCranberryForeground2, colorPaletteCranberryBorderActive, colorPalettePumpkinBackground2, colorPalettePumpkinForeground2, colorPalettePumpkinBorderActive, colorPalettePeachBackground2, colorPalettePeachForeground2, colorPalettePeachBorderActive, colorPaletteGoldBackground2, colorPaletteGoldForeground2, colorPaletteGoldBorderActive, colorPaletteBrassBackground2, colorPaletteBrassForeground2, colorPaletteBrassBorderActive, colorPaletteBrownBackground2, colorPaletteBrownForeground2, colorPaletteBrownBorderActive, colorPaletteForestBackground2, colorPaletteForestForeground2, colorPaletteForestBorderActive, colorPaletteSeafoamBackground2, colorPaletteSeafoamForeground2, colorPaletteSeafoamBorderActive, colorPaletteDarkGreenBackground2, colorPaletteDarkGreenForeground2, colorPaletteDarkGreenBorderActive, colorPaletteLightTealBackground2, colorPaletteLightTealForeground2, colorPaletteLightTealBorderActive, colorPaletteTealBackground2, colorPaletteTealForeground2, colorPaletteTealBorderActive, colorPaletteSteelBackground2, colorPaletteSteelForeground2, colorPaletteSteelBorderActive, colorPaletteBlueBackground2, colorPaletteBlueForeground2, colorPaletteBlueBorderActive, colorPaletteRoyalBlueBackground2, colorPaletteRoyalBlueForeground2, colorPaletteRoyalBlueBorderActive, colorPaletteCornflowerBackground2, colorPaletteCornflowerForeground2, colorPaletteCornflowerBorderActive, colorPaletteNavyBackground2, colorPaletteNavyForeground2, colorPaletteNavyBorderActive, colorPaletteLavenderBackground2, colorPaletteLavenderForeground2, colorPaletteLavenderBorderActive, colorPalettePurpleBackground2, colorPalettePurpleForeground2, colorPalettePurpleBorderActive, colorPaletteGrapeBackground2, colorPaletteGrapeForeground2, colorPaletteGrapeBorderActive, colorPaletteLilacBackground2, colorPaletteLilacForeground2, colorPaletteLilacBorderActive, colorPalettePinkBackground2, colorPalettePinkForeground2, colorPalettePinkBorderActive, colorPaletteMagentaBackground2, colorPaletteMagentaForeground2, colorPaletteMagentaBorderActive, colorPalettePlumBackground2, colorPalettePlumForeground2, colorPalettePlumBorderActive, colorPaletteBeigeBackground2, colorPaletteBeigeForeground2, colorPaletteBeigeBorderActive, colorPaletteMinkBackground2, colorPaletteMinkForeground2, colorPaletteMinkBorderActive, colorPalettePlatinumBackground2, colorPalettePlatinumForeground2, colorPalettePlatinumBorderActive, colorPaletteAnchorBackground2, colorPaletteAnchorForeground2, colorPaletteAnchorBorderActive, colorPaletteRedForegroundInverted, colorPaletteGreenForegroundInverted, colorPaletteYellowForegroundInverted, shadow2, shadow4, shadow8, shadow16, shadow28, shadow64, shadow2Brand, shadow4Brand, shadow8Brand, shadow16Brand, shadow28Brand, shadow64Brand, } from './design-tokens.js';
+export { setTheme, setThemeFor } from './set-theme.js';

package/dist/dts/theme/set-theme.d.ts

@@ -4,3 +4,4 @@ import type { Theme } from '@fluentui/tokens';
  * @param theme Flat object of theme token values.
  */
 export declare const setTheme: (theme: Theme) => void;
+export declare const setThemeFor: (element: HTMLElement, theme: Theme) => void;

package/dist/dts/toggle-button/define.d.ts

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

package/dist/dts/toggle-button/index.d.ts

@@ -0,0 +1,5 @@
+export * from './toggle-button.js';
+export * from './toggle-button.options.js';
+export { template as ToggleButtonTemplate } from './toggle-button.template.js';
+export { styles as ToggleButtonStyles } from './toggle-button.styles.js';
+export { definition as ToggleButtonDefinition } from './toggle-button.definition.js';

package/dist/dts/toggle-button/toggle-button.d.ts

@@ -0,0 +1,48 @@
+import { Button } from '../button/button.js';
+/**
+ * The base class used for constructing a fluent-toggle-button custom element
+ * @public
+ */
+export declare class ToggleButton extends Button {
+    /**
+     * Tracks whether the "checked" property has been changed.
+     * This is necessary to provide consistent behavior with
+     * normal input checkboxes
+     */
+    protected dirtyChecked: boolean;
+    /**
+     * Provides the default checkedness of the input element
+     * Passed down to proxy
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: checked
+     */
+    checkedAttribute: boolean;
+    protected checkedAttributeChanged(): void;
+    defaultChecked: boolean;
+    protected defaultCheckedChanged(): void;
+    /**
+     * The checked state of the control.
+     *
+     * @public
+     */
+    checked: boolean;
+    protected checkedChanged(prev: boolean | undefined, next: boolean): void;
+    /**
+     * The current checkedness of the element. This property serves as a mechanism
+     * to set the `checked` property through both property assignment and the
+     * .setAttribute() method. This is useful for setting the field's checkedness
+     * in UI libraries that bind data through the .setAttribute() API
+     * and don't support IDL attribute binding.
+     */
+    currentChecked: boolean;
+    currentCheckedChanged(prev: boolean | undefined, next: boolean): void;
+    constructor();
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    /**
+     * @internal
+     */
+    protected handleToggleButtonClick: (e: MouseEvent) => void;
+}

package/dist/dts/toggle-button/toggle-button.definition.d.ts

@@ -0,0 +1,8 @@
+import { ToggleButton } from './toggle-button.js';
+/**
+ *
+ * @public
+ * @remarks
+ * HTML Element: \<fluent-toggle-button\>
+ */
+export declare const definition: import("@microsoft/fast-element").FASTElementDefinition<typeof ToggleButton>;

package/dist/dts/toggle-button/toggle-button.options.d.ts

@@ -0,0 +1,47 @@
+import type { ButtonOptions } from '../button/index.js';
+import type { ValuesOf } from '../utils/index.js';
+/**
+ * Toggle Button Appearance constants
+ * @public
+ */
+export declare const ToggleButtonAppearance: {
+    readonly primary: "primary";
+    readonly outline: "outline";
+    readonly subtle: "subtle";
+    readonly secondary: "secondary";
+    readonly transparent: "transparent";
+};
+/**
+ * A Toggle Button can be secondary, primary, outline, subtle, transparent
+ * @public
+ */
+export declare type ToggleButtonAppearance = ValuesOf<typeof ToggleButtonAppearance>;
+/**
+ * A Toggle Button can be square, circular or rounded.
+ * @public
+ */
+export declare const ToggleButtonShape: {
+    readonly circular: "circular";
+    readonly rounded: "rounded";
+    readonly square: "square";
+};
+/**
+ * A Toggle Button can be square, circular or rounded
+ * @public
+ */
+export declare type ToggleButtonShape = ValuesOf<typeof ToggleButtonShape>;
+/**
+ * A Toggle Button can be a size of small, medium or large.
+ * @public
+ */
+export declare const ToggleButtonSize: {
+    readonly small: "small";
+    readonly medium: "medium";
+    readonly large: "large";
+};
+/**
+ * A Toggle Button can be on of several preset sizes.
+ * @public
+ */
+export declare type ToggleButtonSize = ValuesOf<typeof ToggleButtonSize>;
+export { ButtonOptions as ToggleButtonOptions };

package/dist/dts/toggle-button/toggle-button.styles.d.ts

@@ -0,0 +1 @@
+export declare const styles: import("@microsoft/fast-element").ElementStyles;

package/dist/dts/toggle-button/toggle-button.template.d.ts

@@ -0,0 +1,7 @@
+import { ElementViewTemplate } from '@microsoft/fast-element';
+import type { ToggleButton } from './toggle-button.js';
+/**
+ * The template for the ToggleButton component.
+ * @public
+ */
+export declare const template: ElementViewTemplate<ToggleButton>;

package/dist/dts/utils/apply-mixins.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Apply mixins to a constructor.
+ * Sourced from {@link https://www.typescriptlang.org/docs/handbook/mixins.html | TypeScript Documentation }.
+ *
+ * TODO: Remove with https://github.com/microsoft/fast/pull/6797
+ * This was used for Badge where start/end was not yet implemented.
+ * The method itself was deprecated as it was largely intended to be "internals" for Fast Foundation.
+ * Adding here to avoid breaking of the existing API.
+ * @internal
+ */
+export declare function applyMixins(derivedCtor: any, ...baseCtors: any[]): void;

package/dist/dts/utils/benchmark-dependencies/tokens.d.ts

@@ -0,0 +1 @@
+export * from '@fluentui/tokens';

package/dist/dts/utils/benchmark-wrapper.d.ts

@@ -0,0 +1,2 @@
+declare const wrappedTests: {};
+export { wrappedTests as tests };

package/dist/dts/utils/direction.d.ts

@@ -0,0 +1,10 @@
+import { Direction } from '@microsoft/fast-web-utilities';
+/**
+ * Determines the current localization direction of an element.
+ *
+ * @param rootNode - the HTMLElement to begin the query from, usually "this" when used in a component controller
+ * @returns the localization direction of the element
+ *
+ * @public
+ */
+export declare const getDirection: (rootNode: HTMLElement) => Direction;

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

@@ -0,0 +1,4 @@
+export * from './direction.js';
+export * from './typings.js';
+export * from './template-helpers.js';
+export * from './whitespace-filter.js';

package/dist/dts/utils/template-helpers.d.ts

@@ -0,0 +1,16 @@
+import { CaptureType, HTMLDirective } from '@microsoft/fast-element';
+import type { SyntheticViewTemplate } from '@microsoft/fast-element';
+/**
+ * A value that can be statically composed into a
+ * foundation template.
+ * @remarks
+ * When providing a string, take care to ensure that it is
+ * safe and will not enable an XSS attack.
+ * @public
+ */
+export declare type StaticallyComposableHTML<TSource = any, TParent = any> = string | HTMLDirective | SyntheticViewTemplate<TSource, TParent> | undefined;
+/**
+ * A function to compose template options.
+ * @public
+ */
+export declare function staticallyCompose<TSource = any, TParent = any>(item: StaticallyComposableHTML<TSource, TParent>): CaptureType<TSource, TParent>;

package/dist/dts/utils/typings.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Helper for enumerating a type from a const object
+ * Example: export type Foo = ValuesOf\<typeof Foo\>
+ * @public
+ */
+export declare type ValuesOf<T> = T[keyof T];

package/dist/dts/utils/whitespace-filter.d.ts

@@ -0,0 +1,12 @@
+import type { ElementsFilter } from '@microsoft/fast-element';
+/**
+ * filters out any whitespace-only nodes, to be used inside a template.
+ *
+ * @param value - The Node that is being inspected
+ * @param index - The index of the node within the array
+ * @param array - The Node array that is being filtered
+ * @returns true if the node is not a whitespace-only node, false otherwise
+ *
+ * @public
+ */
+export declare const whitespaceFilter: ElementsFilter;

package/dist/esm/accordion/accordion.definition.js

@@ -3,10 +3,6 @@ import { Accordion } from './accordion.js';
 import { styles } from './accordion.styles.js';
 import { template } from './accordion.template.js';
 /**
- * The Fluent Accordion Element. Implements {@link @microsoft/fast-foundation#Accordion },
- * {@link @microsoft/fast-foundation#accordionTemplate}
- *
- *
  * @public
  * @remarks
  * HTML Element: \<fluent-accordion\>

package/dist/esm/accordion/accordion.definition.js.map

@@ -1 +1 @@
-{"version":3,"file":"accordion.definition.js","sourceRoot":"","sources":["../../../src/accordion/accordion.definition.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAEnD;;;;;;;;GAQG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,SAAS,CAAC,OAAO,CAAC;IAC1C,IAAI,EAAE,GAAG,kBAAkB,CAAC,MAAM,YAAY;IAC9C,QAAQ;IACR,MAAM;CACP,CAAC,CAAC"}
+{"version":3,"file":"accordion.definition.js","sourceRoot":"","sources":["../../../src/accordion/accordion.definition.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAEnD;;;;GAIG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,SAAS,CAAC,OAAO,CAAC;IAC1C,IAAI,EAAE,GAAG,kBAAkB,CAAC,MAAM,YAAY;IAC9C,QAAQ;IACR,MAAM;CACP,CAAC,CAAC"}

package/dist/esm/accordion/accordion.js

@@ -1,8 +1,221 @@
-import { FASTAccordion } from '@microsoft/fast-foundation';
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { Observable } from '@microsoft/fast-element';
+import { attr, FASTElement, observable } from '@microsoft/fast-element';
+import { keyArrowDown, keyArrowUp, keyEnd, keyHome, wrapInBounds } from '@microsoft/fast-web-utilities';
+import { AccordionItem } from '../accordion-item/accordion-item.js';
+import { AccordionExpandMode } from './accordion.options.js';
 /**
- * The base class used for constructing a fluent-accordion custom element
+ * An Accordion Custom HTML Element
+ * Implements {@link https://www.w3.org/TR/wai-aria-practices-1.1/#accordion | ARIA Accordion}.
+ *
+ * @fires change - Fires a custom 'change' event when the active item changes
+ * @csspart item - The slot for the accordion items
  * @public
  */
-export class Accordion extends FASTAccordion {
+export class Accordion extends FASTElement {
+    constructor() {
+        super(...arguments);
+        /**
+         * Controls the expand mode of the Accordion, either allowing
+         * single or multiple item expansion.
+         * @public
+         *
+         * @remarks
+         * HTML attribute: expand-mode
+         */
+        this.expandmode = AccordionExpandMode.multi;
+        this.activeItemIndex = 0;
+        this.change = () => {
+            this.$emit('change', this.activeid);
+        };
+        this.setItems = () => {
+            if (this.slottedAccordionItems.length === 0) {
+                return;
+            }
+            const children = Array.from(this.children);
+            this.removeItemListeners(children);
+            children.forEach((child) => Observable.getNotifier(child).subscribe(this, 'disabled'));
+            this.accordionItems = children.filter(child => !child.hasAttribute('disabled'));
+            this.accordionIds = this.getItemIds();
+            this.accordionItems.forEach((item, index) => {
+                if (item instanceof AccordionItem) {
+                    item.addEventListener('click', this.activeItemChange);
+                    item.addEventListener('keydown', this.handleItemKeyDown);
+                    item.addEventListener('focus', this.handleItemFocus);
+                    Observable.getNotifier(item).subscribe(this, 'expanded');
+                }
+                const itemId = this.accordionIds[index];
+                item.setAttribute('id', typeof itemId !== 'string' ? `accordion-${index + 1}` : itemId);
+                this.activeid = this.accordionIds[this.activeItemIndex];
+            });
+            if (this.isSingleExpandMode()) {
+                const expandedItem = this.findExpandedItem();
+                this.setSingleExpandMode(expandedItem);
+            }
+        };
+        this.removeItemListeners = (oldValue) => {
+            oldValue.forEach((item, index) => {
+                Observable.getNotifier(item).unsubscribe(this, 'disabled');
+                Observable.getNotifier(item).unsubscribe(this, 'expanded');
+                item.removeEventListener('click', this.activeItemChange);
+                item.removeEventListener('keydown', this.handleItemKeyDown);
+                item.removeEventListener('focus', this.handleItemFocus);
+            });
+        };
+        this.activeItemChange = (event) => {
+            if (event.defaultPrevented || event.target !== event.currentTarget) {
+                return;
+            }
+            event.preventDefault();
+            this.handleExpandedChange(event.target);
+        };
+        this.handleExpandedChange = (item) => {
+            if (item instanceof AccordionItem) {
+                this.activeid = item.getAttribute('id');
+                if (!this.isSingleExpandMode()) {
+                    item.expanded = !item.expanded;
+                    // setSingleExpandMode sets activeItemIndex on its own
+                    this.activeItemIndex = this.accordionItems.indexOf(item);
+                }
+                else {
+                    this.setSingleExpandMode(item);
+                }
+                this.change();
+            }
+        };
+        this.handleItemKeyDown = (event) => {
+            // only handle the keydown if the event target is the accordion item
+            // prevents arrow keys from moving focus to accordion headers when focus is on accordion item panel content
+            if (event.target !== event.currentTarget) {
+                return;
+            }
+            this.accordionIds = this.getItemIds();
+            switch (event.key) {
+                case keyArrowUp:
+                    event.preventDefault();
+                    this.adjust(-1);
+                    break;
+                case keyArrowDown:
+                    event.preventDefault();
+                    this.adjust(1);
+                    break;
+                case keyHome:
+                    this.activeItemIndex = 0;
+                    this.focusItem();
+                    break;
+                case keyEnd:
+                    this.activeItemIndex = this.accordionItems.length - 1;
+                    this.focusItem();
+                    break;
+            }
+        };
+        this.handleItemFocus = (event) => {
+            // update the active item index if the focus moves to an accordion item via a different method other than the up and down arrow key actions
+            // only do so if the focus is actually on the accordion item and not on any of its children
+            if (event.target === event.currentTarget) {
+                const focusedItem = event.target;
+                const focusedIndex = (this.activeItemIndex = Array.from(this.accordionItems).indexOf(focusedItem));
+                if (this.activeItemIndex !== focusedIndex && focusedIndex !== -1) {
+                    this.activeItemIndex = focusedIndex;
+                    this.activeid = this.accordionIds[this.activeItemIndex];
+                }
+            }
+        };
+    }
+    expandmodeChanged(prev, next) {
+        if (!this.$fastController.isConnected) {
+            return;
+        }
+        const expandedItem = this.findExpandedItem();
+        if (!expandedItem) {
+            return;
+        }
+        if (next !== AccordionExpandMode.single) {
+            expandedItem === null || expandedItem === void 0 ? void 0 : expandedItem.expandbutton.removeAttribute('aria-disabled');
+        }
+        else {
+            this.setSingleExpandMode(expandedItem);
+        }
+    }
+    /**
+     * @internal
+     */
+    slottedAccordionItemsChanged(oldValue, newValue) {
+        if (this.$fastController.isConnected) {
+            this.setItems();
+        }
+    }
+    /**
+     * @internal
+     */
+    handleChange(source, propertyName) {
+        if (propertyName === 'disabled') {
+            this.setItems();
+        }
+        else if (propertyName === 'expanded') {
+            // we only need to manage single expanded instances
+            // such as scenarios where a child is programatically expanded
+            if (source.expanded && this.isSingleExpandMode()) {
+                this.setSingleExpandMode(source);
+            }
+        }
+    }
+    findExpandedItem() {
+        var _a;
+        if (this.accordionItems.length === 0) {
+            return null;
+        }
+        return ((_a = this.accordionItems.find((item) => item instanceof AccordionItem && item.expanded)) !== null && _a !== void 0 ? _a : this.accordionItems[0]);
+    }
+    setSingleExpandMode(expandedItem) {
+        if (this.accordionItems.length === 0) {
+            return;
+        }
+        const currentItems = Array.from(this.accordionItems);
+        this.activeItemIndex = currentItems.indexOf(expandedItem);
+        currentItems.forEach((item, index) => {
+            if (item instanceof AccordionItem) {
+                if (this.activeItemIndex === index) {
+                    item.expanded = true;
+                    item.expandbutton.setAttribute('aria-disabled', 'true');
+                }
+                else {
+                    item.expanded = false;
+                    if (!item.hasAttribute('disabled')) {
+                        item.expandbutton.removeAttribute('aria-disabled');
+                    }
+                }
+            }
+        });
+    }
+    getItemIds() {
+        return this.slottedAccordionItems.map((accordionItem) => {
+            return accordionItem.id;
+        });
+    }
+    isSingleExpandMode() {
+        return this.expandmode === AccordionExpandMode.single;
+    }
+    adjust(adjustment) {
+        this.activeItemIndex = wrapInBounds(0, this.accordionItems.length - 1, this.activeItemIndex + adjustment);
+        this.focusItem();
+    }
+    focusItem() {
+        const element = this.accordionItems[this.activeItemIndex];
+        if (element instanceof AccordionItem) {
+            element.expandbutton.focus();
+        }
+    }
 }
+__decorate([
+    attr({ attribute: 'expand-mode' })
+], Accordion.prototype, "expandmode", void 0);
+__decorate([
+    observable
+], Accordion.prototype, "slottedAccordionItems", void 0);
 //# sourceMappingURL=accordion.js.map

package/dist/esm/accordion/accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"accordion.js","sourceRoot":"","sources":["../../../src/accordion/accordion.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAE3D;;;GAGG;AACH,MAAM,OAAO,SAAU,SAAQ,aAAa;CAAG"}
+{"version":3,"file":"accordion.js","sourceRoot":"","sources":["../../../src/accordion/accordion.ts"],"names":[],"mappings":"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"}

package/dist/esm/accordion/accordion.options.js

@@ -0,0 +1,9 @@
+/**
+ * Expand mode for {@link FASTAccordion}
+ * @public
+ */
+export const AccordionExpandMode = {
+    single: 'single',
+    multi: 'multi',
+};
+//# sourceMappingURL=accordion.options.js.map

package/dist/esm/accordion/accordion.options.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"accordion.options.js","sourceRoot":"","sources":["../../../src/accordion/accordion.options.ts"],"names":[],"mappings":"AAEA;;;GAGG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG;IACjC,MAAM,EAAE,QAAQ;IAChB,KAAK,EAAE,OAAO;CACN,CAAC"}

package/dist/esm/accordion/accordion.styles.js

@@ -1,11 +1,12 @@
 import { css } from '@microsoft/fast-element';
-import { display } from '@microsoft/fast-foundation';
+import { display } from '@microsoft/fast-foundation/utilities.js';
 export const styles = css `
   ${display('flex')}
 
   :host {
     flex-direction: column;
     width: 100%;
+    contain: content;
   }
 `;
 //# sourceMappingURL=accordion.styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"accordion.styles.js","sourceRoot":"","sources":["../../../src/accordion/accordion.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAErD,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,MAAM,CAAC;;;;;;CAMlB,CAAC"}
+{"version":3,"file":"accordion.styles.js","sourceRoot":"","sources":["../../../src/accordion/accordion.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,yCAAyC,CAAC;AAElE,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,MAAM,CAAC;;;;;;;CAOlB,CAAC"}

package/dist/esm/accordion/accordion.template.js

@@ -1,3 +1,13 @@
-import { accordionTemplate } from '@microsoft/fast-foundation';
+import { elements, html, slotted } from '@microsoft/fast-element';
+/**
+ * @public
+ */
+export function accordionTemplate() {
+    return html `
+    <template>
+      <slot ${slotted({ property: 'slottedAccordionItems', filter: elements() })}></slot>
+    </template>
+  `;
+}
 export const template = accordionTemplate();
 //# sourceMappingURL=accordion.template.js.map

package/dist/esm/accordion/accordion.template.js.map

@@ -1 +1 @@
-{"version":3,"file":"accordion.template.js","sourceRoot":"","sources":["../../../src/accordion/accordion.template.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAG/D,MAAM,CAAC,MAAM,QAAQ,GAAmC,iBAAiB,EAAE,CAAC"}
+{"version":3,"file":"accordion.template.js","sourceRoot":"","sources":["../../../src/accordion/accordion.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAuB,IAAI,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAGvF;;GAEG;AACH,MAAM,UAAU,iBAAiB;IAC/B,OAAO,IAAI,CAAG;;cAEF,OAAO,CAAC,EAAE,QAAQ,EAAE,uBAAuB,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,CAAC;;GAE7E,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,QAAQ,GAAmC,iBAAiB,EAAE,CAAC"}

package/dist/esm/accordion-item/accordion-item.definition.js

@@ -3,9 +3,6 @@ import { AccordionItem } from './accordion-item.js';
 import { styles } from './accordion-item.styles.js';
 import { template } from './accordion-item.template.js';
 /**
- * The Fluent AccordionItem Element. Implements {@link @microsoft/fast-foundation#AccordionItem },
- * {@link @microsoft/fast-foundation#accordionItemTemplate}
- *
  *
  * @public
  * @remarks

package/dist/esm/accordion-item/accordion-item.definition.js.map

@@ -1 +1 @@
-{"version":3,"file":"accordion-item.definition.js","sourceRoot":"","sources":["../../../src/accordion-item/accordion-item.definition.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpD,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AAExD;;;;;;;;GAQG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,aAAa,CAAC,OAAO,CAAC;IAC9C,IAAI,EAAE,GAAG,kBAAkB,CAAC,MAAM,iBAAiB;IACnD,QAAQ;IACR,MAAM;CACP,CAAC,CAAC"}
+{"version":3,"file":"accordion-item.definition.js","sourceRoot":"","sources":["../../../src/accordion-item/accordion-item.definition.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpD,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AAExD;;;;;GAKG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,aAAa,CAAC,OAAO,CAAC;IAC9C,IAAI,EAAE,GAAG,kBAAkB,CAAC,MAAM,iBAAiB;IACnD,QAAQ;IACR,MAAM;CACP,CAAC,CAAC"}