@vonage/vivid 4.12.1 → 4.14.0

package/lib/radio-group/radio-group.d.ts

@@ -1,6 +1,6 @@
-import { FoundationElement } from '@microsoft/fast-foundation';
 import { Orientation } from '@microsoft/fast-web-utilities';
-export declare class RadioGroup extends FoundationElement {
+import { VividElement } from '../../shared/foundation/vivid-element/vivid-element';
+export declare class RadioGroup extends VividElement {
     #private;
     label?: string;
     readOnly: boolean;

package/lib/radio-group/radio-group.template.d.ts

@@ -1,4 +1,3 @@
-import type { ViewTemplate } from '@microsoft/fast-element';
-import type { ElementDefinitionContext } from '@microsoft/fast-foundation';
+import type { VividElementDefinitionContext } from '../../shared/design-system/defineVividComponent';
 import type { RadioGroup } from './radio-group';
-export declare const RadioGroupTemplate: (context: ElementDefinitionContext) => ViewTemplate<RadioGroup>;
+export declare const RadioGroupTemplate: (context: VividElementDefinitionContext) => import("@microsoft/fast-element").ViewTemplate<RadioGroup, any>;

package/lib/range-slider/definition.d.ts

@@ -1,3 +1 @@
-import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
-export declare const rangeSliderDefinition: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<FoundationElementDefinition> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;
-export declare const registerRangeSlider: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;
+export declare const registerRangeSlider: (prefix?: string) => void;

package/lib/range-slider/range-slider.form-associated.d.ts

@@ -1,5 +1,6 @@
-import { FormAssociated, FoundationElement } from '@microsoft/fast-foundation';
-declare class _RangeSlider extends FoundationElement {
+import { FormAssociated } from '../../shared/foundation/form-associated/form-associated';
+import { VividElement } from '../../shared/foundation/vivid-element/vivid-element';
+declare class _RangeSlider extends VividElement {
 }
 interface _RangeSlider extends FormAssociated {
 }

package/lib/range-slider/range-slider.template.d.ts

@@ -1,4 +1,3 @@
-import type { ViewTemplate } from '@microsoft/fast-element';
-import type { ElementDefinitionContext } from '@microsoft/fast-foundation';
+import type { VividElementDefinitionContext } from '../../shared/design-system/defineVividComponent';
 import type { RangeSlider } from './range-slider';
-export declare const RangeSliderTemplate: (context: ElementDefinitionContext) => ViewTemplate<RangeSlider>;
+export declare const RangeSliderTemplate: (context: VividElementDefinitionContext) => import("@microsoft/fast-element").ViewTemplate<RangeSlider, any>;

package/lib/searchable-select/definition.d.ts

@@ -1,4 +1 @@
-import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
-export declare const optionTagDefinition: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<FoundationElementDefinition> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;
-export declare const searchableSelectDefinition: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<FoundationElementDefinition> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;
-export declare const registerSearchableSelect: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;
+export declare const registerSearchableSelect: (prefix?: string) => void;

package/lib/searchable-select/option-tag.template.d.ts

@@ -1,4 +1,3 @@
-import type { ViewTemplate } from '@microsoft/fast-element';
-import type { ElementDefinitionContext, FoundationElementDefinition } from '@microsoft/fast-foundation';
+import type { VividElementDefinitionContext } from '../../shared/design-system/defineVividComponent';
 import type { OptionTag } from './option-tag';
-export declare const optionTagTemplate: (context: ElementDefinitionContext, definition: FoundationElementDefinition) => ViewTemplate<OptionTag>;
+export declare const optionTagTemplate: (context: VividElementDefinitionContext) => import("@microsoft/fast-element").ViewTemplate<OptionTag, any>;

package/lib/searchable-select/searchable-select.form-associated.d.ts

@@ -1,5 +1,6 @@
-import { FormAssociated, FoundationElement } from '@microsoft/fast-foundation';
-declare class _SearchableSelect extends FoundationElement {
+import { FormAssociated } from '../../shared/foundation/form-associated/form-associated';
+import { VividElement } from '../../shared/foundation/vivid-element/vivid-element';
+declare class _SearchableSelect extends VividElement {
 }
 interface _SearchableSelect extends FormAssociated {
 }

package/lib/searchable-select/searchable-select.template.d.ts

@@ -1,4 +1,3 @@
-import { ViewTemplate } from '@microsoft/fast-element';
-import { type ElementDefinitionContext, type FoundationElementDefinition } from '@microsoft/fast-foundation';
+import type { VividElementDefinitionContext } from '../../shared/design-system/defineVividComponent';
 import type { SearchableSelect } from './searchable-select';
-export declare const SearchableSelectTemplate: (context: ElementDefinitionContext, definition: FoundationElementDefinition) => ViewTemplate<SearchableSelect>;
+export declare const SearchableSelectTemplate: (context: VividElementDefinitionContext) => import("@microsoft/fast-element").ViewTemplate<SearchableSelect, any>;

package/lib/select/definition.d.ts

@@ -1,4 +1,2 @@
-import type { SelectOptions } from '@microsoft/fast-foundation';
 export type { SelectAppearance, SelectShape } from './select';
-export declare const selectDefinition: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<SelectOptions> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<SelectOptions, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;
-export declare const registerSelect: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;
+export declare const registerSelect: (prefix?: string) => void;

package/lib/select/select.d.ts

@@ -1,20 +1,30 @@
-import { Select as FoundationSelect } from '@microsoft/fast-foundation';
 import { AffixIconWithTrailing, type ErrorText, type FormElement, FormElementHelperText, FormElementSuccessText } from '../../shared/patterns';
 import type { Appearance, Shape, Size } from '../enums';
+import { FormAssociatedSelect } from './select.form-associated';
 export type SelectAppearance = Extract<Appearance, Appearance.Fieldset | Appearance.Ghost>;
 export type SelectShape = Extract<Shape, Shape.Rounded | Shape.Pill>;
 export type SelectSize = Extract<Size, Size.Condensed | Size.Normal>;
-export declare class Select extends FoundationSelect {
+export declare class Select extends FormAssociatedSelect {
+    multiple: boolean;
+    protected setSelectedOptions(): void;
+    open: boolean;
+    get value(): string;
+    set value(next: string);
+    multipleChanged(prev: boolean | undefined, next: boolean): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
     scale?: SelectSize;
     appearance?: SelectAppearance;
     shape?: SelectShape;
     fixedDropdown: boolean;
     placeholder: string | undefined;
     labelChanged(): void;
-    connectedCallback(): void;
     get displayValue(): string;
     setDefaultSelectedOption(): void;
     formResetCallback(): void;
 }
-export interface Select extends AffixIconWithTrailing, FormElement, FormElementHelperText, ErrorText, FormElementSuccessText {
+export declare class DelegatesARIASelect {
+    ariaControls: string | null;
+}
+export interface Select extends AffixIconWithTrailing, FormElement, FormElementHelperText, ErrorText, FormElementSuccessText, DelegatesARIASelect {
 }

package/lib/select/select.form-associated.d.ts

@@ -0,0 +1,11 @@
+import { FormAssociated } from '@microsoft/fast-foundation';
+import { Listbox } from '../../shared/foundation/listbox/listbox';
+declare class _Select extends Listbox {
+}
+interface _Select extends FormAssociated {
+}
+declare const FormAssociatedSelect_base: typeof _Select;
+export declare class FormAssociatedSelect extends FormAssociatedSelect_base {
+    proxy: HTMLSelectElement;
+}
+export {};

package/lib/select/select.template.d.ts

@@ -1,4 +1,3 @@
-import { ViewTemplate } from '@microsoft/fast-element';
-import type { ElementDefinitionContext, FoundationElementDefinition } from '@microsoft/fast-foundation';
+import type { VividElementDefinitionContext } from '../../shared/design-system/defineVividComponent';
 import type { Select } from './select';
-export declare const SelectTemplate: (context: ElementDefinitionContext, definition: FoundationElementDefinition) => ViewTemplate<Select>;
+export declare const SelectTemplate: (context: VividElementDefinitionContext) => import("@microsoft/fast-element").ViewTemplate<Select, any>;

package/lib/selectable-box/definition.d.ts

@@ -1,3 +1 @@
-import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
-export declare const selectableBoxDefinition: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<FoundationElementDefinition> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;
-export declare const registerSelectableBox: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;
+export declare const registerSelectableBox: (prefix?: string) => void;

package/lib/selectable-box/selectable-box.d.ts

@@ -1,8 +1,8 @@
-import { FoundationElement } from '@microsoft/fast-foundation';
 import type { Connotation } from '../enums.js';
+import { VividElement } from '../../shared/foundation/vivid-element/vivid-element';
 export type SelectableBoxConnotation = Connotation.Accent | Connotation.CTA;
 export type SelectableBoxControlType = 'checkbox' | 'radio';
-export declare class SelectableBox extends FoundationElement {
+export declare class SelectableBox extends VividElement {
     ariaLabel: string | null;
     checked: boolean;
     clickable: boolean;

package/lib/selectable-box/selectable-box.template.d.ts

@@ -1,4 +1,3 @@
-import type { ViewTemplate } from '@microsoft/fast-element';
-import type { ElementDefinitionContext, FoundationElementDefinition } from '@microsoft/fast-foundation';
+import type { VividElementDefinitionContext } from '../../shared/design-system/defineVividComponent';
 import { SelectableBox } from './selectable-box';
-export declare const SelectableBoxTemplate: (context: ElementDefinitionContext, definition: FoundationElementDefinition) => ViewTemplate<SelectableBox>;
+export declare const SelectableBoxTemplate: (context: VividElementDefinitionContext) => import("@microsoft/fast-element").ViewTemplate<SelectableBox, any>;

package/lib/side-drawer/definition.d.ts

@@ -1,3 +1 @@
-import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
-export declare const sideDrawerDefinition: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<FoundationElementDefinition> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;
-export declare const registerSideDrawer: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;
+export declare const registerSideDrawer: (prefix?: string) => void;

package/lib/side-drawer/side-drawer.d.ts

@@ -1,5 +1,5 @@
-import { FoundationElement } from '@microsoft/fast-foundation';
-export declare class SideDrawer extends FoundationElement {
+import { VividElement } from '../../shared/foundation/vivid-element/vivid-element';
+export declare class SideDrawer extends VividElement {
     #private;
     alternate: boolean;
     modal: boolean;

package/lib/side-drawer/side-drawer.template.d.ts

@@ -1,4 +1,2 @@
-import type { ViewTemplate } from '@microsoft/fast-element';
-import type { FoundationElementTemplate } from '@microsoft/fast-foundation';
 import type { SideDrawer } from './side-drawer';
-export declare const sideDrawerTemplate: FoundationElementTemplate<ViewTemplate<SideDrawer>>;
+export declare const sideDrawerTemplate: import("@microsoft/fast-element").ViewTemplate<SideDrawer, any>;

package/lib/slider/definition.d.ts

@@ -1,4 +1,2 @@
-import type { SliderOptions } from '@microsoft/fast-foundation';
 export type { SliderConnotation } from './slider';
-export declare const sliderDefinition: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<SliderOptions> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<SliderOptions, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;
-export declare const registerSlider: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;
+export declare const registerSlider: (prefix?: string) => void;

package/lib/slider/slider.form-associated.d.ts

@@ -1,5 +1,6 @@
-import { FormAssociated, FoundationElement } from '@microsoft/fast-foundation';
-declare class _Slider extends FoundationElement {
+import { FormAssociated } from '../../shared/foundation/form-associated/form-associated';
+import { VividElement } from '../../shared/foundation/vivid-element/vivid-element';
+declare class _Slider extends VividElement {
 }
 interface _Slider extends FormAssociated {
 }

package/lib/slider/slider.template.d.ts

@@ -1,5 +1,4 @@
-import type { ViewTemplate } from '@microsoft/fast-element';
-import type { ElementDefinitionContext, FoundationElementDefinition } from '@microsoft/fast-foundation';
+import type { VividElementDefinitionContext } from '../../shared/design-system/defineVividComponent';
 import type { Slider } from './slider';
-export declare const getMarkersTemplate: (isHorizontal: boolean, numMarkers: number) => ViewTemplate<any, any>;
-export declare const SliderTemplate: (context: ElementDefinitionContext, definition: FoundationElementDefinition) => ViewTemplate<Slider>;
+export declare const getMarkersTemplate: (isHorizontal: boolean, numMarkers: number) => import("@microsoft/fast-element").ViewTemplate<any, any>;
+export declare const SliderTemplate: (context: VividElementDefinitionContext) => import("@microsoft/fast-element").ViewTemplate<Slider, any>;

package/lib/split-button/definition.d.ts

@@ -1,2 +1,2 @@
 export type { SplitButtonAppearance, SplitButtonConnotation, SplitButtonShape, SplitButtonSize, } from './split-button';
-export declare const registerSplitButton: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;
+export declare const registerSplitButton: (prefix?: string) => void;

package/lib/split-button/split-button.d.ts

@@ -1,12 +1,12 @@
-import { FoundationElement } from '@microsoft/fast-foundation';
 import type { Appearance, Connotation, Shape, Size } from '../enums.js';
 import { AffixIcon } from '../../shared/patterns/affix';
 import { Localized } from '../../shared/patterns';
+import { VividElement } from '../../shared/foundation/vivid-element/vivid-element';
 export type SplitButtonConnotation = Extract<Connotation, Connotation.Accent | Connotation.Announcement | Connotation.CTA | Connotation.Success | Connotation.Alert>;
 export type SplitButtonAppearance = Extract<Appearance, Appearance.Filled | Appearance.Outlined | Appearance.Ghost>;
 export type SplitButtonShape = Extract<Shape, Shape.Rounded | Shape.Pill>;
 export type SplitButtonSize = Extract<Size, Size.SuperCondensed | Size.Condensed | Size.Normal | Size.Expanded>;
-export declare class SplitButton extends FoundationElement {
+export declare class SplitButton extends VividElement {
     _action: HTMLButtonElement;
     get action(): HTMLButtonElement;
     _indicator: HTMLButtonElement;

package/lib/split-button/split-button.template.d.ts

@@ -1,4 +1,3 @@
-import type { ViewTemplate } from '@microsoft/fast-element';
-import type { ElementDefinitionContext, FoundationElementDefinition } from '@microsoft/fast-foundation';
+import type { VividElementDefinitionContext } from '../../shared/design-system/defineVividComponent';
 import type { SplitButton } from './split-button';
-export declare const SplitButtonTemplate: (context: ElementDefinitionContext, definition: FoundationElementDefinition) => ViewTemplate<SplitButton>;
+export declare const SplitButtonTemplate: (context: VividElementDefinitionContext) => import("@microsoft/fast-element").ViewTemplate<SplitButton, any>;

package/lib/switch/definition.d.ts

@@ -1,4 +1,2 @@
-import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
 export type { SwitchConnotation } from './switch';
-export declare const switchDefinition: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<FoundationElementDefinition> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;
-export declare const registerSwitch: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;
+export declare const registerSwitch: (prefix?: string) => void;

package/lib/switch/switch.d.ts

@@ -1,7 +1,10 @@
-import { Switch as FoundationSwitch } from '@microsoft/fast-foundation';
 import type { Connotation } from '../enums';
+import { FormAssociatedSwitch } from './switch.form-associated';
 export type SwitchConnotation = Connotation.Accent | Connotation.Alert | Connotation.Announcement | Connotation.Success | Connotation.CTA;
-export declare class Switch extends FoundationSwitch {
+export declare class Switch extends FormAssociatedSwitch {
     label?: string;
     connotation?: SwitchConnotation;
+    readOnly: boolean;
+    constructor();
+    private updateForm;
 }

package/lib/switch/switch.form-associated.d.ts

@@ -0,0 +1,11 @@
+import { CheckableFormAssociated } from '../../shared/foundation/form-associated/form-associated';
+import { VividElement } from '../../shared/foundation/vivid-element/vivid-element';
+declare class _Switch extends VividElement {
+}
+interface _Switch extends CheckableFormAssociated {
+}
+declare const FormAssociatedSwitch_base: typeof _Switch;
+export declare class FormAssociatedSwitch extends FormAssociatedSwitch_base {
+    proxy: HTMLInputElement;
+}
+export {};

package/lib/switch/switch.template.d.ts

@@ -1,4 +1,2 @@
-import type { ViewTemplate } from '@microsoft/fast-element';
-import type { ElementDefinitionContext, FoundationElementDefinition } from '@microsoft/fast-foundation';
 import type { Switch } from './switch';
-export declare const SwitchTemplate: (context: ElementDefinitionContext, definition: FoundationElementDefinition) => ViewTemplate<Switch>;
+export declare const SwitchTemplate: import("@microsoft/fast-element").ViewTemplate<Switch, any>;

package/lib/tab/definition.d.ts

@@ -1,4 +1,2 @@
-import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
 export type { TabConnotation, TabShape } from './tab';
-export declare const tabDefinition: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<FoundationElementDefinition> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;
-export declare const registerTab: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;
+export declare const registerTab: (prefix?: string) => void;

package/lib/tab/tab.d.ts

@@ -1,10 +1,10 @@
-import { FoundationElement } from '@microsoft/fast-foundation';
 import { AffixIconWithTrailing } from '../../shared/patterns/affix';
 import { Localized } from '../../shared/patterns';
 import type { Connotation, Shape } from '../enums.js';
+import { VividElement } from '../../shared/foundation/vivid-element/vivid-element';
 export type TabConnotation = Extract<Connotation, Connotation.Accent | Connotation.CTA>;
 export type TabShape = Extract<Shape, Shape.Rounded | Shape.Sharp>;
-export declare class Tab extends FoundationElement {
+export declare class Tab extends VividElement {
     disabled: boolean;
     connotation?: TabConnotation;
     shape?: TabShape;

package/lib/tab/tab.template.d.ts

@@ -1,3 +1,3 @@
-import type { ElementDefinitionContext } from '@microsoft/fast-foundation';
+import type { VividElementDefinitionContext } from '../../shared/design-system/defineVividComponent';
 import type { Tab } from './tab.js';
-export declare function TabTemplate<T extends Tab>(context: ElementDefinitionContext): import("@microsoft/fast-element").ViewTemplate<T, any>;
+export declare const TabTemplate: (context: VividElementDefinitionContext) => import("@microsoft/fast-element").ViewTemplate<Tab, any>;

package/lib/tab-panel/definition.d.ts

@@ -1,3 +1 @@
-import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
-export declare const tabPanelDefinition: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<FoundationElementDefinition> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;
-export declare const registerTabPanel: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;
+export declare const registerTabPanel: (prefix?: string) => void;

package/lib/tab-panel/tab-panel.d.ts

@@ -1,3 +1,3 @@
-import { FoundationElement } from '@microsoft/fast-foundation';
-export declare class TabPanel extends FoundationElement {
+import { VividElement } from '../../shared/foundation/vivid-element/vivid-element';
+export declare class TabPanel extends VividElement {
 }

package/lib/tab-panel/tab-panel.template.d.ts

@@ -1,2 +1,2 @@
 import type { TabPanel } from './tab-panel.js';
-export declare function TabPanelTemplate<T extends TabPanel>(): import("@microsoft/fast-element").ViewTemplate<T, any>;
+export declare const TabPanelTemplate: import("@microsoft/fast-element").ViewTemplate<TabPanel, any>;

package/lib/tabs/definition.d.ts

@@ -1,3 +1 @@
-import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
-export declare const tabsDefinition: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<FoundationElementDefinition> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;
-export declare const registerTabs: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;
+export declare const registerTabs: (prefix?: string) => void;

package/lib/tabs/tabs.d.ts

@@ -1,9 +1,10 @@
-import { FoundationElement, TabsOrientation } from '@microsoft/fast-foundation';
+import { TabsOrientation } from '@microsoft/fast-foundation';
 import type { Connotation, TabsGutters } from '../enums.js';
+import { VividElement } from '../../shared/foundation/vivid-element/vivid-element';
 export declare const ACTIVE_TAB_WIDTH = "--_tabs-active-tab-inline-size";
+export declare const TABLIST_COLUMN = "--_tabs-tablist-column";
 export type TabsConnotation = Extract<Connotation, Connotation.Accent | Connotation.CTA>;
-export type Gutters = Extract<TabsGutters, TabsGutters.Small | TabsGutters.None>;
-export declare class Tabs extends FoundationElement {
+export declare class Tabs extends VividElement {
     #private;
     orientation: TabsOrientation;
     activeid: string;
@@ -33,8 +34,9 @@ export declare class Tabs extends FoundationElement {
     private focusTab;
     tablist?: HTMLElement;
     connotation?: TabsConnotation;
-    gutters?: Gutters;
+    gutters?: TabsGutters;
     scrollablePanel: boolean;
+    tabsLayout?: 'align-start' | 'stretch';
     connectedCallback(): void;
     disconnectedCallback(): void;
     private handleActiveIndicatorPosition;

package/lib/tabs/tabs.template.d.ts

@@ -1,2 +1,2 @@
 import type { Tabs } from './tabs.js';
-export declare function TabsTemplate<T extends Tabs>(): import("@microsoft/fast-element").ViewTemplate<T, any>;
+export declare const TabsTemplate: import("@microsoft/fast-element").ViewTemplate<Tabs, any>;

package/lib/tag/definition.d.ts

@@ -1,5 +1,2 @@
-import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
 export type { TagConnotation, TagAppearance, TagShape } from './tag';
-export declare const tagDefinition: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<FoundationElementDefinition> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;
-export declare const tagRegistries: import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>[];
-export declare const registerTag: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;
+export declare const registerTag: (prefix?: string) => void;

package/lib/tag/tag.d.ts

@@ -1,10 +1,10 @@
-import { FoundationElement } from '@microsoft/fast-foundation';
 import { AffixIcon } from '../../shared/patterns/affix';
 import type { Appearance, Connotation, Shape } from '../enums.js';
+import { VividElement } from '../../shared/foundation/vivid-element/vivid-element';
 export type TagConnotation = Extract<Connotation, Connotation.Accent | Connotation.CTA>;
 export type TagAppearance = Extract<Appearance, Appearance.Subtle | Appearance.Duotone>;
 export type TagShape = Extract<Shape, Shape.Rounded | Shape.Pill>;
-export declare class Tag extends FoundationElement {
+export declare class Tag extends VividElement {
     #private;
     connotation?: TagConnotation;
     shape?: TagShape;

package/lib/tag/tag.template.d.ts

@@ -1,4 +1,3 @@
-import type { ViewTemplate } from '@microsoft/fast-element';
-import type { ElementDefinitionContext, FoundationElementDefinition } from '@microsoft/fast-foundation';
+import type { VividElementDefinitionContext } from '../../shared/design-system/defineVividComponent';
 import type { Tag } from './tag';
-export declare const tagTemplate: (context: ElementDefinitionContext, definition: FoundationElementDefinition) => ViewTemplate<Tag>;
+export declare const tagTemplate: (context: VividElementDefinitionContext) => import("@microsoft/fast-element").ViewTemplate<Tag, any>;

package/lib/tag-group/definition.d.ts

@@ -1,3 +1 @@
-import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
-export declare const tagGroupDefinition: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<FoundationElementDefinition> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;
-export declare const registerTagGroup: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;
+export declare const registerTagGroup: (prefix?: string) => void;

package/lib/tag-group/tag-group.d.ts

@@ -1,4 +1,4 @@
-import { FoundationElement } from '@microsoft/fast-foundation';
-export declare class TagGroup extends FoundationElement {
+import { VividElement } from '../../shared/foundation/vivid-element/vivid-element';
+export declare class TagGroup extends VividElement {
     ariaLabel: string | null;
 }

package/lib/tag-group/tag-group.template.d.ts

@@ -1,4 +1,2 @@
-import type { ViewTemplate } from '@microsoft/fast-element';
-import type { ElementDefinitionContext } from '@microsoft/fast-foundation';
 import type { TagGroup } from './tag-group';
-export declare const TagGroupTemplate: (context: ElementDefinitionContext) => ViewTemplate<TagGroup>;
+export declare const TagGroupTemplate: import("@microsoft/fast-element").ViewTemplate<TagGroup, any>;

package/lib/text-anchor/definition.d.ts

@@ -1,4 +1,2 @@
-import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
 export type { TextAnchorConnotation, TextAnchorAppearance, } from './text-anchor';
-export declare const textAnchorDefinition: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<FoundationElementDefinition> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;
-export declare const registerTextAnchor: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;
+export declare const registerTextAnchor: (prefix?: string) => void;

package/lib/text-anchor/text-anchor.d.ts

@@ -1,12 +1,13 @@
-import { Anchor } from '@microsoft/fast-foundation';
+import { FoundationElement } from '@microsoft/fast-foundation';
 import { Appearance, Connotation } from '../enums';
 import { AffixIcon } from '../../shared/patterns/affix';
+import { Anchor } from '../../shared/foundation/anchor/anchor';
 export type TextAnchorConnotation = Extract<Connotation, Connotation.Accent | Connotation.CTA>;
 export type TextAnchorAppearance = Extract<Appearance, Appearance.Ghost | Appearance.GhostLight>;
-export declare class TextAnchor extends Anchor {
+export declare class TextAnchor extends FoundationElement {
     text?: string;
     connotation?: TextAnchorConnotation;
     appearance?: TextAnchorAppearance;
 }
-export interface TextAnchor extends AffixIcon {
+export interface TextAnchor extends AffixIcon, Anchor {
 }

package/lib/text-anchor/text-anchor.template.d.ts

@@ -1,4 +1,3 @@
-import type { ViewTemplate } from '@microsoft/fast-element';
-import type { ElementDefinitionContext, FoundationElementDefinition } from '@microsoft/fast-foundation';
+import type { VividElementDefinitionContext } from '../../shared/design-system/defineVividComponent';
 import type { TextAnchor } from './text-anchor';
-export declare const textAnchorTemplate: (context: ElementDefinitionContext, definition: FoundationElementDefinition) => ViewTemplate<TextAnchor>;
+export declare const textAnchorTemplate: (context: VividElementDefinitionContext) => import("@microsoft/fast-element").ViewTemplate<TextAnchor, any>;

package/lib/text-area/definition.d.ts

@@ -1,4 +1,2 @@
-import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
 export type { TextAreaWrap } from './text-area';
-export declare const textAreaDefinition: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<FoundationElementDefinition> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;
-export declare const registerTextArea: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;
+export declare const registerTextArea: (prefix?: string) => void;

package/lib/text-area/text-area.d.ts

@@ -1,11 +1,33 @@
-import { TextArea as FoundationTextArea } from '@microsoft/fast-foundation';
 import { type ErrorText, type FormElement, FormElementCharCount, FormElementHelperText, FormElementSuccessText } from '../../shared/patterns';
+import { DelegatesARIATextbox } from '../text-field/text-field';
+import { FormAssociatedTextArea } from './text-area.form-associated';
 export type TextAreaWrap = 'hard' | 'soft' | 'off';
-export declare class TextArea extends FoundationTextArea {
+export declare const TextAreaResize: {
+    readonly none: "none";
+    readonly both: "both";
+    readonly horizontal: "horizontal";
+    readonly vertical: "vertical";
+};
+export type TextAreaResize = typeof TextAreaResize[keyof typeof TextAreaResize];
+export declare class TextArea extends FormAssociatedTextArea {
     #private;
+    readOnly: boolean;
+    resize: TextAreaResize;
+    autofocus: boolean;
+    formId: string;
+    list: string;
+    maxlength: number;
+    minlength: number;
+    name: string;
+    placeholder: string;
+    cols: number;
+    rows: number;
+    spellcheck: boolean;
+    select(): void;
+    validate(): void;
     wrap?: TextAreaWrap;
     connectedCallback(): void;
     disconnectedCallback(): void;
 }
-export interface TextArea extends FormElement, ErrorText, FormElementCharCount, FormElementHelperText, FormElementSuccessText {
+export interface TextArea extends FormElement, ErrorText, FormElementCharCount, FormElementHelperText, FormElementSuccessText, DelegatesARIATextbox {
 }

package/lib/text-area/text-area.form-associated.d.ts

@@ -0,0 +1,11 @@
+import { FormAssociated } from '../../shared/foundation/form-associated/form-associated';
+import { VividElement } from '../../shared/foundation/vivid-element/vivid-element';
+declare class _TextArea extends VividElement {
+}
+interface _TextArea extends FormAssociated {
+}
+declare const FormAssociatedTextArea_base: typeof _TextArea;
+export declare class FormAssociatedTextArea extends FormAssociatedTextArea_base {
+    proxy: HTMLTextAreaElement;
+}
+export {};

package/lib/text-area/text-area.template.d.ts

@@ -1,4 +1,3 @@
-import type { ViewTemplate } from '@microsoft/fast-element';
-import type { ElementDefinitionContext, FoundationElementDefinition } from '@microsoft/fast-foundation';
+import type { VividElementDefinitionContext } from '../../shared/design-system/defineVividComponent';
 import type { TextArea } from './text-area';
-export declare const TextAreaTemplate: (context: ElementDefinitionContext, definition: FoundationElementDefinition) => ViewTemplate<TextArea>;
+export declare const TextAreaTemplate: (context: VividElementDefinitionContext) => import("@microsoft/fast-element").ViewTemplate<TextArea, any>;

package/lib/text-field/definition.d.ts

@@ -1,4 +1,2 @@
-import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
 export type { TextFieldAppearance, TextFieldShape } from './text-field';
-export declare const textFieldDefinition: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<FoundationElementDefinition> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;
-export declare const registerTextField: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;
+export declare const registerTextField: (prefix?: string) => void;