@fluentui/web-components 3.0.0-beta.27 → 3.0.0-beta.29

package/dist/web-components.d.ts

@@ -238,92 +238,13 @@ export declare const accordionStyles: ElementStyles;
 
 export declare const accordionTemplate: ElementViewTemplate<Accordion>;
 
-/**
- * An Anchor Custom HTML Element.
- * Based largely on the {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a | <a> element }.
- *
- * @slot start - Content which can be provided before the anchor content
- * @slot end - Content which can be provided after the anchor content
- * @slot - The default slot for anchor content
- * @csspart control - The anchor element
- * @csspart content - The element wrapping anchor content
- *
- * @public
- */
-export declare class AnchorButton extends FASTElement {
-    /**
-     * Prompts the user to save the linked URL. See {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a | <a> element } for more information.
-     * @public
-     * @remarks
-     * HTML Attribute: download
-     */
-    download: string;
-    /**
-     * The URL the hyperlink references. See {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a | <a> element } for more information.
-     * @public
-     * @remarks
-     * HTML Attribute: href
-     */
-    href: string;
-    /**
-     * Hints at the language of the referenced resource. See {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a | <a> element } for more information.
-     * @public
-     * @remarks
-     * HTML Attribute: hreflang
-     */
-    hreflang: string;
-    /**
-     * See {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a | <a> element } for more information.
-     * @public
-     * @remarks
-     * HTML Attribute: ping
-     */
-    ping: string;
-    /**
-     * See {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a | <a> element } for more information.
-     * @public
-     * @remarks
-     * HTML Attribute: referrerpolicy
-     */
-    referrerpolicy: string;
-    /**
-     * See {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a | <a> element } for more information.
-     * @public
-     * @remarks
-     * HTML Attribute: rel
-     */
-    rel: string;
-    /**
-     * See {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a | <a> element } for more information.
-     * @public
-     * @remarks
-     * HTML Attribute: target
-     */
-    target: AnchorTarget;
-    /**
-     * See {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a | <a> element } for more information.
-     * @public
-     * @remarks
-     * HTML Attribute: type
-     */
-    type: string;
-    /**
-     *
-     * Default slotted content
-     *
-     * @internal
-     */
-    defaultSlottedContent: HTMLElement[];
-    /**
-     * References the root element
-     */
-    control: HTMLAnchorElement;
+export declare class AnchorButton extends BaseAnchor {
     /**
      * The appearance the anchor button should have.
      *
      * @public
      * @remarks
-     * HTML Attribute: appearance
+     * HTML Attribute: `appearance`
      */
     appearance?: AnchorButtonAppearance | undefined;
     /**
@@ -331,7 +252,7 @@ export declare class AnchorButton extends FASTElement {
      *
      * @public
      * @remarks
-     * HTML Attribute: shape
+     * HTML Attribute: `shape`
      */
     shape?: AnchorButtonShape | undefined;
     /**
@@ -339,7 +260,7 @@ export declare class AnchorButton extends FASTElement {
      *
      * @public
      * @remarks
-     * HTML Attribute: size
+     * HTML Attribute: `size`
      */
     size?: AnchorButtonSize;
     /**
@@ -347,33 +268,9 @@ export declare class AnchorButton extends FASTElement {
      *
      * @public
      * @remarks
-     * HTML Attribute: icon-only
+     * HTML Attribute: `icon-only`
      */
     iconOnly: boolean;
-    /**
-     * The anchor button is disabled
-     *
-     * @public
-     * @remarks
-     * HTML Attribute: disabled-focusable
-     */
-    disabled?: boolean;
-    protected disabledChanged(prev: boolean, next: boolean): void;
-    /**
-     * The anchor button is disabled but focusable
-     *
-     * @public
-     * @remarks
-     * HTML Attribute: disabled-focusable
-     */
-    disabledFocusable?: boolean;
-    protected disabledFocusableChanged(prev: boolean, next: boolean): void;
-    /**
-     * Prevents disabledFocusable click events
-     */
-    private handleDisabledFocusableClick;
-    connectedCallback(): void;
-    disconnectedCallback(): void;
 }
 
 /**
@@ -382,7 +279,7 @@ export declare class AnchorButton extends FASTElement {
  * TODO: https://github.com/microsoft/fast/issues/3317
  * @internal
  */
-export declare interface AnchorButton extends StartEnd, DelegatesARIALink {
+export declare interface AnchorButton extends StartEnd {
 }
 
 /**
@@ -410,12 +307,6 @@ export declare type AnchorButtonAppearance = ValuesOf<typeof AnchorButtonAppeara
  */
 export declare const AnchorButtonDefinition: FASTElementDefinition<typeof AnchorButton>;
 
-/**
- * Anchor configuration options
- * @public
- */
-export declare type AnchorButtonOptions = StartEndOptions<AnchorButton>;
-
 /**
  * An Anchor Button can be square, circular or rounded.
  * @public
@@ -473,196 +364,6 @@ export declare const AnchorTarget: {
  */
 export declare type AnchorTarget = ValuesOf<typeof AnchorTarget>;
 
-/**
- * Some states and properties are applicable to all host language elements regardless of whether a role is applied.
- * The following global states and properties are supported by all roles and by all base markup elements.
- * {@link https://www.w3.org/TR/wai-aria-1.1/#global_states}
- *
- * This is intended to be used as a mixin. Be sure you extend FASTElement.
- *
- * @public
- */
-declare class ARIAGlobalStatesAndProperties {
-    /**
-     * Indicates whether assistive technologies will present all, or only parts of,
-     * the changed region based on the change notifications defined by the aria-relevant attribute.
-     * {@link https://www.w3.org/TR/wai-aria-1.1/#aria-atomic}
-     *
-     * @public
-     * @remarks
-     * HTML Attribute: aria-atomic
-     */
-    ariaAtomic: 'true' | 'false' | string | null;
-    /**
-     * Indicates an element is being modified and that assistive technologies MAY want to wait
-     * until the modifications are complete before exposing them to the user.
-     * {@link https://www.w3.org/TR/wai-aria-1.1/#aria-busy}
-     *
-     * @public
-     * @remarks
-     * HTML Attribute: aria-busy
-     */
-    ariaBusy: 'true' | 'false' | string | null;
-    /**
-     * Identifies the element (or elements) whose contents or presence are controlled by the current element.
-     *
-     * {@link https://www.w3.org/TR/wai-aria-1.1/#aria-controls}
-     * @public
-     * @remarks
-     * HTML Attribute: aria-controls
-     */
-    ariaControls: string | null;
-    /**
-     * Indicates the element that represents the current item within a container or set of related elements.
-     *
-     * {@link https://www.w3.org/TR/wai-aria-1.1/#aria-current}
-     * @public
-     * @remarks
-     * HTML Attribute: aria-current
-     */
-    ariaCurrent: 'page' | 'step' | 'location' | 'date' | 'time' | 'true' | 'false' | string | null;
-    /**
-     * Identifies the element (or elements) that describes the object.
-     *
-     * {@link https://www.w3.org/TR/wai-aria-1.1/#aria-describedby}
-     * @public
-     * @remarks
-     * HTML Attribute: aria-describedby
-     */
-    ariaDescribedby: string | null;
-    /**
-     * Identifies the element that provides a detailed, extended description for the object.
-     *
-     * {@link https://www.w3.org/TR/wai-aria-1.1/#aria-details}
-     * @public
-     * @remarks
-     * HTML Attribute: aria-details
-     */
-    ariaDetails: string | null;
-    /**
-     * Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.
-     *
-     * {@link https://www.w3.org/TR/wai-aria-1.1/#aria-disabled}
-     * @public
-     * @remarks
-     * HTML Attribute: aria-disabled
-     */
-    ariaDisabled: 'true' | 'false' | string | null;
-    /**
-     * Identifies the element that provides an error message for the object.
-     *
-     * {@link https://www.w3.org/TR/wai-aria-1.1/#aria-errormessage}
-     * @public
-     * @remarks
-     * HTML Attribute: aria-errormessage
-     */
-    ariaErrormessage: string | null;
-    /**
-     * Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion,
-     * allows assistive technology to override the general default of reading in document source order.
-     *
-     * {@link https://www.w3.org/TR/wai-aria-1.1/#aria-flowto}
-     * @public
-     * @remarks
-     * HTML Attribute: aria-flowto
-     */
-    ariaFlowto: string | null;
-    /**
-     * Indicates the availability and type of interactive popup element,
-     * such as menu or dialog, that can be triggered by an element.
-     *
-     * {@link https://www.w3.org/TR/wai-aria-1.1/#aria-haspopup}
-     * @public
-     * @remarks
-     * HTML Attribute: aria-haspopup
-     */
-    ariaHaspopup: 'false' | 'true' | 'menu' | 'listbox' | 'tree' | 'grid' | 'dialog' | string | null;
-    /**
-     * Indicates whether the element is exposed to an accessibility API
-     *
-     * {@link https://www.w3.org/TR/wai-aria-1.1/#aria-hidden}
-     * @public
-     * @remarks
-     * HTML Attribute: aria-hidden
-     */
-    ariaHidden: 'false' | 'true' | string | null;
-    /**
-     * Indicates the entered value does not conform to the format expected by the application.
-     *
-     * {@link https://www.w3.org/TR/wai-aria-1.1/#aria-invalid}
-     * @public
-     * @remarks
-     * HTML Attribute: aria-invalid
-     */
-    ariaInvalid: 'false' | 'true' | 'grammar' | 'spelling' | string | null;
-    /**
-     * Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element.
-     *
-     * {@link https://www.w3.org/TR/wai-aria-1.1/#aria-keyshortcuts}
-     * @public
-     * @remarks
-     * HTML Attribute: aria-keyshortcuts
-     */
-    ariaKeyshortcuts: string | null;
-    /**
-     * Defines a string value that labels the current element.
-     *
-     * {@link https://www.w3.org/TR/wai-aria-1.1/#aria-label}
-     * @public
-     * @remarks
-     * HTML Attribute: aria-label
-     */
-    ariaLabel: string | null;
-    /**
-     * Identifies the element (or elements) that labels the current element.
-     *
-     * {@link https://www.w3.org/TR/wai-aria-1.1/#aria-labelledby}
-     * @public
-     * @remarks
-     * HTML Attribute: aria-labelledby
-     */
-    ariaLabelledby: string | null;
-    /**
-     * Indicates that an element will be updated, and describes the types of updates the user agents,
-     * assistive technologies, and user can expect from the live region.
-     *
-     * {@link https://www.w3.org/TR/wai-aria-1.1/#aria-live}
-     * @public
-     * @remarks
-     * HTML Attribute: aria-live
-     */
-    ariaLive: 'assertive' | 'off' | 'polite' | string | null;
-    /**
-     * Identifies an element (or elements) in order to define a visual,
-     * functional, or contextual parent/child relationship between DOM elements
-     * where the DOM hierarchy cannot be used to represent the relationship.
-     *
-     * {@link https://www.w3.org/TR/wai-aria-1.1/#aria-owns}
-     * @public
-     * @remarks
-     * HTML Attribute: aria-owns
-     */
-    ariaOwns: string | null;
-    /**
-     * Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.
-     *
-     * {@link https://www.w3.org/TR/wai-aria-1.1/#aria-relevant}
-     * @public
-     * @remarks
-     * HTML Attribute: aria-relevant
-     */
-    ariaRelevant: 'additions' | 'additions text' | 'all' | 'removals' | 'text' | string | null;
-    /**
-     * Defines a human-readable, author-localized description for the role of an element.
-     *
-     * {@link https://www.w3.org/TR/wai-aria-1.1/#aria-roledescription}
-     * @public
-     * @remarks
-     * HTML Attribute: aria-roledescription
-     */
-    ariaRoledescription: string | null;
-}
-
 /**
  * The base class used for constructing a fluent-avatar custom element
  * @public
@@ -1064,6 +765,138 @@ export declare const BadgeStyles: ElementStyles;
 
 export declare const BadgeTemplate: ElementViewTemplate<Badge>;
 
+/**
+ * An Anchor Custom HTML Element.
+ * Based largely on the {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a | <a> element }.
+ *
+ * @slot start - Content which can be provided before the anchor content
+ * @slot end - Content which can be provided after the anchor content
+ * @slot - The default slot for anchor content
+ * @csspart control - The anchor element
+ * @csspart content - The element wrapping anchor content
+ *
+ * @public
+ */
+declare class BaseAnchor extends FASTElement {
+    /**
+     * The internal {@link https://developer.mozilla.org/docs/Web/API/ElementInternals | `ElementInternals`} instance for the component.
+     *
+     * @internal
+     */
+    protected elementInternals: ElementInternals;
+    /**
+     * The proxy anchor element
+     * @internal
+     */
+    private internalProxyAnchor;
+    /**
+     * Prompts the user to save the linked URL.
+     *
+     * @see The {@link https://developer.mozilla.org/docs/Web/HTML/Element/a#download | `download`} attribute
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `download`
+     */
+    download?: string;
+    /**
+     * The URL the hyperlink references.
+     * @see The {@link https://developer.mozilla.org/docs/Web/HTML/Element/a#href | `href`} attribute
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `href`
+     */
+    href?: string;
+    /**
+     * Hints at the language of the referenced resource.
+     * @see The {@link https://developer.mozilla.org/docs/Web/HTML/Element/a#hreflang | `hreflang`} attribute
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `hreflang`
+     */
+    hreflang?: string;
+    /**
+     * The ping attribute.
+     * @see The {@link https://developer.mozilla.org/docs/Web/HTML/Element/a#ping | `ping`} attribute
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `ping`
+     */
+    ping?: string;
+    /**
+     * The referrerpolicy attribute.
+     * See The {@link https://developer.mozilla.org/docs/Web/HTML/Element/a#referrerpolicy | `referrerpolicy`} attribute
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `referrerpolicy`
+     */
+    referrerpolicy?: string;
+    /**
+     * The rel attribute.
+     * See The {@link https://developer.mozilla.org/docs/Web/HTML/Element/a#rel | `rel`} attribute
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `rel`
+     */
+    rel: string;
+    /**
+     * The target attribute.
+     * @see The {@link https://developer.mozilla.org/docs/Web/HTML/Element/a#target | `target`} attribute
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `target`
+     */
+    target?: AnchorTarget;
+    /**
+     * The type attribute.
+     * @see The {@link https://developer.mozilla.org/docs/Web/HTML/Element/a#type | `type`} attribute
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `type`
+     */
+    type?: string;
+    constructor();
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    /**
+     * Handles changes to observable properties
+     * @internal
+     * @param source - the source of the change
+     * @param propertyName - the property name being changed
+     */
+    handleChange(source: any, propertyName: string): void;
+    /**
+     * Handles the anchor click event.
+     *
+     * @param e - The event object
+     * @internal
+     */
+    clickHandler(): boolean;
+    /**
+     * Handles keypress events for the anchor.
+     *
+     * @param e - the keyboard event
+     * @returns - the return value of the click handler
+     * @public
+     */
+    keypressHandler(e: KeyboardEvent): boolean | void;
+    /**
+     * A method for updating proxy attributes when attributes have changed
+     * @internal
+     * @param attribute - an attribute to set/remove
+     * @param value - the value of the attribute
+     */
+    private handleProxyAttributeChange;
+    private createProxyElement;
+}
+
 /**
  * A Checkbox Custom HTML Element.
  * Implements the {@link https://www.w3.org/TR/wai-aria-1.1/#checkbox | ARIA checkbox }.
@@ -1346,47 +1179,6 @@ declare class BaseCheckbox extends FASTElement {
     private toggleChecked;
 }
 
-/**
- * A base class for progress components.
- * @public
- */
-declare class BaseProgress extends FASTElement {
-    /**
-     * The value of the progress
-     * @public
-     * @remarks
-     * HTML Attribute: value
-     */
-    value: number | null;
-    protected valueChanged(): void;
-    /**
-     * The minimum value
-     * @public
-     * @remarks
-     * HTML Attribute: min
-     */
-    min: number;
-    protected minChanged(): void;
-    /**
-     * The maximum value
-     * @public
-     * @remarks
-     * HTML Attribute: max
-     */
-    max: number;
-    protected maxChanged(): void;
-    /**
-     * Indicates progress in %
-     * @internal
-     */
-    percentComplete: number;
-    /**
-     * @internal
-     */
-    connectedCallback(): void;
-    private updatePercentComplete;
-}
-
 /**
  * A Tabs component that wraps a collection of tab and tab panel elements.
  *
@@ -4404,30 +4196,6 @@ export declare const curveLinear = "var(--curveLinear)";
  */
 export declare const darkModeStylesheetBehavior: (styles: ElementStyles) => MatchMediaStyleSheetBehavior;
 
-/**
- * Includes ARIA states and properties relating to the ARIA link role
- *
- * @public
- */
-declare class DelegatesARIALink {
-    /**
-     * See {@link https://www.w3.org/WAI/PF/aria/roles#link} for more information
-     * @public
-     * @remarks
-     * HTML Attribute: aria-expanded
-     */
-    ariaExpanded: 'true' | 'false' | string | null;
-}
-
-/**
- * Mark internal because exporting class and interface of the same name
- * confuses API documenter.
- * TODO: https://github.com/microsoft/fast/issues/3317
- * @internal
- */
-declare interface DelegatesARIALink extends ARIAGlobalStatesAndProperties {
-}
-
 /**
  * A Dialog Custom HTML Element.
  *
@@ -5340,6 +5108,84 @@ export declare const lineHeightHero800 = "var(--lineHeightHero800)";
  */
 export declare const lineHeightHero900 = "var(--lineHeightHero900)";
 
+/**
+ * An Anchor Custom HTML Element.
+ * Based largely on the {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a | <a> element }.
+ *
+ * @slot start - Content which can be provided before the link content
+ * @slot end - Content which can be provided after the link content
+ * @slot - The default slot for link content
+ *
+ * @public
+ */
+export declare class Link extends BaseAnchor {
+    /**
+     * The appearance the link should have.
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `appearance`
+     */
+    appearance?: LinkAppearance | undefined;
+    /**
+     * The link is inline with text
+     * In chromium browsers, if the link is contained within a semantic
+     * text element (`h1`, `h2`, `h3`, `h4`, `h5`, `h6`, `p`) or `fluent-text`,
+     * `:host-context()` ensures inline links are styled appropriately.
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `inline`
+     */
+    inline: boolean;
+}
+
+/**
+ * Link Appearance constants
+ * @public
+ */
+export declare const LinkAppearance: {
+    readonly subtle: "subtle";
+};
+
+/**
+ * An Link can be subtle or the default appearance
+ * @public
+ */
+export declare type LinkAppearance = ValuesOf<typeof LinkAppearance>;
+
+/**
+ * @public
+ * @remarks
+ * HTML Element: \<fluent-link\>
+ */
+export declare const LinkDefinition: FASTElementDefinition<typeof Link>;
+
+/**
+ * Link target values.
+ *
+ * @public
+ */
+export declare const LinkTarget: {
+    readonly _self: "_self";
+    readonly _blank: "_blank";
+    readonly _parent: "_parent";
+    readonly _top: "_top";
+};
+
+/**
+ * Type for link target values.
+ *
+ * @public
+ */
+export declare type LinkTarget = ValuesOf<typeof AnchorTarget>;
+
+/**
+ * The template for the Link component.
+ * @public
+ */
+export declare const LinkTemplate: ElementViewTemplate<Link>;
+
 /**
  * An abstract behavior to react to media queries. Implementations should implement
  * the `constructListener` method to perform some action based on media query changes.
@@ -6029,36 +5875,79 @@ export declare const MenuTemplate: ElementViewTemplate<Menu>;
  * An Progress HTML Element.
  * Implements the {@link https://www.w3.org/TR/wai-aria-1.1/#progressbar | ARIA progressbar }.
  *
- * @slot indeterminate - The slot for a custom indeterminate indicator
- * @csspart progress - Represents the progress element
- * @csspart determinate - The determinate indicator
- * @csspart indeterminate - The indeterminate indicator
- *
  * @public
  */
-export declare class ProgressBar extends BaseProgress {
+export declare class ProgressBar extends FASTElement {
+    /**
+     * The internal {@link https://developer.mozilla.org/docs/Web/API/ElementInternals | `ElementInternals`} instance for the component.
+     *
+     * @internal
+     */
+    elementInternals: ElementInternals;
     /**
      * The thickness of the progress bar
      *
      * @public
-     * @remarks
-     * HTML Attribute: thickness
+     * HTML Attribute: `thickness`
      */
     thickness?: ProgressBarThickness;
     /**
      * The shape of the progress bar
      * @public
-     * @remarks
-     * HTML Attribute: shape
+     * HTML Attribute: `shape`
      */
     shape?: ProgressBarShape;
     /**
      * The validation state of the progress bar
      * @public
-     * @remarks
-     * HTML Attribute: validation-state
+     * HTML Attribute: `validation-state`
      */
     validationState: ProgressBarValidationState | null;
+    /**
+     * The value of the progress
+     * @internal
+     * HTML Attribute: `value`
+     */
+    value?: number;
+    /**
+     * Updates the percent complete when the `value` property changes.
+     *
+     * @internal
+     */
+    protected valueChanged(prev: number | undefined, next: number | undefined): void;
+    /**
+     * The minimum value
+     * @internal
+     * HTML Attribute: `min`
+     */
+    min?: number;
+    /**
+     * Updates the percent complete when the `min` property changes.
+     *
+     * @param prev - The previous min value
+     * @param next - The current min value
+     */
+    protected minChanged(prev: number | undefined, next: number | undefined): void;
+    /**
+     * The maximum value
+     * @internal
+     * HTML Attribute: `max`
+     */
+    max?: number;
+    /**
+     * Updates the percent complete when the `max` property changes.
+     *
+     * @param prev - The previous max value
+     * @param next - The current max value
+     * @internal
+     */
+    protected maxChanged(prev: number | undefined, next: number | undefined): void;
+    /**
+     * Indicates progress in %
+     * @internal
+     */
+    get percentComplete(): number;
+    constructor();
 }
 
 /**
@@ -6124,15 +6013,6 @@ export declare const ProgressBarValidationState: {
  */
 export declare type ProgressBarValidationState = ValuesOf<typeof ProgressBarValidationState>;
 
-/**
- * Progress configuration options
- * @public
- */
-export declare type ProgressOptions = {
-    indeterminateIndicator1?: StaticallyComposableHTML<ProgressBar>;
-    indeterminateIndicator2?: StaticallyComposableHTML<ProgressBar>;
-};
-
 /**
  * A Radio Custom HTML Element.
  * Implements the {@link https://www.w3.org/TR/wai-aria-1.1/#radio | ARIA radio }.