@vonage/vivid 5.25.0 → 5.28.0

package/lib/button/button.d.ts

@@ -1,8 +1,17 @@
-import { Appearance, Connotation, Shape, Size } from '../enums.js';
+import { Shape, Size } from '../enums.js';
 import { VividFoundationButton } from '../../shared/foundation/button/button.js';
 import { ExtractFromEnum } from '../../shared/utils/enums';
-export type ButtonConnotation = ExtractFromEnum<Connotation, Connotation.Accent | Connotation.Announcement | Connotation.CTA | Connotation.Success | Connotation.Alert>;
-export type ButtonAppearance = ExtractFromEnum<Appearance, Appearance.Filled | Appearance.Outlined | Appearance.Ghost | Appearance.GhostLight | Appearance.OutlinedLight>;
+import { ComponentEnum } from '../../shared/utils/component-enum.ts';
+export declare const buttonConnotation: {
+    parse: (value: unknown) => "alert" | "accent" | "cta" | "success" | "announcement";
+    defaultValue: "alert" | "accent" | "cta" | "success" | "announcement";
+};
+export type ButtonConnotation = ComponentEnum<typeof buttonConnotation>;
+export declare const buttonAppearance: {
+    parse: (value: unknown) => "filled" | "outlined" | "ghost" | "ghost-light" | "outlined-light";
+    defaultValue: "filled" | "outlined" | "ghost" | "ghost-light" | "outlined-light";
+};
+export type ButtonAppearance = ComponentEnum<typeof buttonAppearance>;
 export type ButtonShape = ExtractFromEnum<Shape, Shape.Rounded | Shape.Pill>;
 export type ButtonSize = ExtractFromEnum<Size, Size.SuperCondensed | Size.Condensed | Size.Normal | Size.Expanded>;
 declare const Button_base: {
@@ -12,7 +21,7 @@ declare const Button_base: {
         iconSlottedContent?: HTMLElement[];
         connectedCallback(): void;
         focus(...args: any[]): void;
-        _vividAriaBehaviour: import('../../shared/aria/aria-mixin.js').VividAriaBehaviour;
+        _vividAriaBehaviour: import('../../shared/aria/aria-mixin.ts').VividAriaBehaviour;
         readonly $fastController: import('@microsoft/fast-element').ElementController;
         $emit(type: string, detail?: any, options?: Omit<CustomEventInit, "detail">): boolean | void;
         disconnectedCallback: (() => void) & (() => void);
@@ -428,16 +437,16 @@ declare const Button_base: {
             fromDeprecated: (v: any) => any;
             toDeprecated?: ((v: any) => any) | undefined;
         }): void;
-        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.js').ReactiveController>;
-        _addController(controller: import('../../shared/framework/reactive-controller.js').ReactiveController): void;
-        _removeController(controller: import('../../shared/framework/reactive-controller.js').ReactiveController): void;
+        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.ts').ReactiveController>;
+        _addController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
+        _removeController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
     };
 } & {
     new (...args: any[]): {
-        get locale(): import('../../shared/localization/Locale.js').Locale;
+        get locale(): import('../../shared/localization/Locale.ts').Locale;
         connectedCallback(): void;
         focus(...args: any[]): void;
-        _vividAriaBehaviour: import('../../shared/aria/aria-mixin.js').VividAriaBehaviour;
+        _vividAriaBehaviour: import('../../shared/aria/aria-mixin.ts').VividAriaBehaviour;
         readonly $fastController: import('@microsoft/fast-element').ElementController;
         $emit(type: string, detail?: any, options?: Omit<CustomEventInit, "detail">): boolean | void;
         disconnectedCallback: (() => void) & (() => void);
@@ -853,9 +862,9 @@ declare const Button_base: {
             fromDeprecated: (v: any) => any;
             toDeprecated?: ((v: any) => any) | undefined;
         }): void;
-        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.js').ReactiveController>;
-        _addController(controller: import('../../shared/framework/reactive-controller.js').ReactiveController): void;
-        _removeController(controller: import('../../shared/framework/reactive-controller.js').ReactiveController): void;
+        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.ts').ReactiveController>;
+        _addController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
+        _removeController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
     };
 } & {
     new (...args: any[]): {
@@ -868,7 +877,7 @@ declare const Button_base: {
         target?: "_self" | "_blank" | "_parent" | "_top";
         type?: string;
         control: HTMLAnchorElement;
-        _renderLinkElement: <T extends any>(content: import('@microsoft/fast-element').ViewTemplate<T>, cssClass: import('@microsoft/fast-element').TemplateValue<T>, boundAriaProperties?: import('../../shared/aria/aria-binding-directive.js').BoundAriaProperties<unknown>) => import('@microsoft/fast-element').ViewTemplate<T, any>;
+        _renderLinkElement: <T extends any>(content: import('@microsoft/fast-element').ViewTemplate<T>, cssClass: import('@microsoft/fast-element').TemplateValue<T>, boundAriaProperties?: import('../../shared/aria/aria-binding-directive.ts').BoundAriaProperties<unknown>) => import('@microsoft/fast-element').ViewTemplate<T, any>;
         _vividAriaBehaviour: "delegate";
         connectedCallback(): void;
         focus(...args: any[]): void;
@@ -1287,9 +1296,9 @@ declare const Button_base: {
             fromDeprecated: (v: any) => any;
             toDeprecated?: ((v: any) => any) | undefined;
         }): void;
-        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.js').ReactiveController>;
-        _addController(controller: import('../../shared/framework/reactive-controller.js').ReactiveController): void;
-        _removeController(controller: import('../../shared/framework/reactive-controller.js').ReactiveController): void;
+        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.ts').ReactiveController>;
+        _addController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
+        _removeController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
     };
 } & typeof VividFoundationButton;
 export declare class Button extends Button_base {

package/lib/calendar-event/calendar-event.d.ts

@@ -1,8 +1,15 @@
-import { Appearance, Connotation } from '../enums';
 import { VividElement } from '../../shared/foundation/vivid-element/vivid-element';
-import { ExtractFromEnum } from '../../shared/utils/enums';
-export type CalendarEventConnotation = ExtractFromEnum<Connotation, Connotation.Accent | Connotation.CTA | Connotation.Success | Connotation.Alert | Connotation.Warning | Connotation.Information | Connotation.Announcement>;
-export type CalendarEventAppearance = ExtractFromEnum<Appearance, Appearance.Filled | Appearance.Duotone | Appearance.Subtle>;
+import { ComponentEnum } from '../../shared/utils/component-enum.ts';
+export declare const calendarEventConnotation: {
+    parse: (value: unknown) => "alert" | "accent" | "warning" | "cta" | "success" | "information" | "announcement";
+    defaultValue: "alert" | "accent" | "warning" | "cta" | "success" | "information" | "announcement";
+};
+export type CalendarEventConnotation = ComponentEnum<typeof calendarEventConnotation>;
+export declare const calendarEventAppearance: {
+    parse: (value: unknown) => "filled" | "duotone" | "subtle";
+    defaultValue: "filled" | "duotone" | "subtle";
+};
+export type CalendarEventAppearance = ComponentEnum<typeof calendarEventAppearance>;
 declare const CalendarEvent_base: {
     new (...args: any[]): {
         _vividAriaBehaviour: "delegate";
@@ -423,9 +430,9 @@ declare const CalendarEvent_base: {
             fromDeprecated: (v: any) => any;
             toDeprecated?: ((v: any) => any) | undefined;
         }): void;
-        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller').ReactiveController>;
-        _addController(controller: import('../../shared/framework/reactive-controller').ReactiveController): void;
-        _removeController(controller: import('../../shared/framework/reactive-controller').ReactiveController): void;
+        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.ts').ReactiveController>;
+        _addController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
+        _removeController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
     };
 } & typeof VividElement;
 export declare class CalendarEvent extends CalendarEvent_base {

package/lib/checkbox/checkbox.d.ts

@@ -1,8 +1,11 @@
-import { Connotation } from '../enums.js';
-import { ExtractFromEnum } from '../../shared/utils/enums';
 import { VividElement } from '../../shared/foundation/vivid-element/vivid-element';
+import { ComponentEnum } from '../../shared/utils/component-enum.ts';
 export declare const keySpace: ' ';
-export type CheckboxConnotation = ExtractFromEnum<Connotation, Connotation.Accent | Connotation.CTA>;
+export declare const checkboxConnotation: {
+    parse: (value: unknown) => "accent" | "cta";
+    defaultValue: "accent" | "cta";
+};
+export type CheckboxConnotation = ComponentEnum<typeof checkboxConnotation>;
 declare const Checkbox_base: {
     new (...args: any[]): {
         _vividAriaBehaviour: "delegate";
@@ -423,9 +426,9 @@ declare const Checkbox_base: {
             fromDeprecated: (v: any) => any;
             toDeprecated?: ((v: any) => any) | undefined;
         }): void;
-        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.js').ReactiveController>;
-        _addController(controller: import('../../shared/framework/reactive-controller.js').ReactiveController): void;
-        _removeController(controller: import('../../shared/framework/reactive-controller.js').ReactiveController): void;
+        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.ts').ReactiveController>;
+        _addController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
+        _removeController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
     };
 } & {
     new (...args: any[]): {
@@ -433,14 +436,14 @@ declare const Checkbox_base: {
         _helperTextSlottedContent?: HTMLElement[];
         get _feedbackDescribedBy(): string;
         _internalFeedback(): {
-            type: import('../../shared/feedback/feedback-message.js').FeedbackType;
+            type: import('../../shared/feedback/feedback-message.ts').FeedbackType;
             message: string;
         };
         _slottedHelperTextFeedbackType(): "none" | "helper";
-        _getFeedbackTemplate(ctx: import('../../shared/design-system/defineVividComponent.js').VividElementDefinitionContext): import('@microsoft/fast-element').ViewTemplate<any, any>;
+        _getFeedbackTemplate(ctx: import('../../shared/design-system/defineVividComponent.ts').VividElementDefinitionContext): import('@microsoft/fast-element').ViewTemplate<any, any>;
         connectedCallback(): void;
         focus(...args: any[]): void;
-        _vividAriaBehaviour: import('../../shared/aria/aria-mixin.js').VividAriaBehaviour;
+        _vividAriaBehaviour: import('../../shared/aria/aria-mixin.ts').VividAriaBehaviour;
         readonly $fastController: import('@microsoft/fast-element').ElementController;
         $emit(type: string, detail?: any, options?: Omit<CustomEventInit, "detail">): boolean | void;
         disconnectedCallback: (() => void) & (() => void);
@@ -856,9 +859,9 @@ declare const Checkbox_base: {
             fromDeprecated: (v: any) => any;
             toDeprecated?: ((v: any) => any) | undefined;
         }): void;
-        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.js').ReactiveController>;
-        _addController(controller: import('../../shared/framework/reactive-controller.js').ReactiveController): void;
-        _removeController(controller: import('../../shared/framework/reactive-controller.js').ReactiveController): void;
+        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.ts').ReactiveController>;
+        _addController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
+        _removeController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
     };
 } & {
     new (...args: any[]): {
@@ -910,7 +913,7 @@ declare const Checkbox_base: {
         _keypressHandler(e: KeyboardEvent): void;
         stopPropagation(e: Event): void;
         focus(...args: any[]): void;
-        _vividAriaBehaviour: import('../../shared/aria/aria-mixin.js').VividAriaBehaviour;
+        _vividAriaBehaviour: import('../../shared/aria/aria-mixin.ts').VividAriaBehaviour;
         readonly $fastController: import('@microsoft/fast-element').ElementController;
         $emit(type: string, detail?: any, options?: Omit<CustomEventInit, "detail">): boolean | void;
         attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
@@ -1325,16 +1328,16 @@ declare const Checkbox_base: {
             fromDeprecated: (v: any) => any;
             toDeprecated?: ((v: any) => any) | undefined;
         }): void;
-        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.js').ReactiveController>;
-        _addController(controller: import('../../shared/framework/reactive-controller.js').ReactiveController): void;
-        _removeController(controller: import('../../shared/framework/reactive-controller.js').ReactiveController): void;
+        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.ts').ReactiveController>;
+        _addController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
+        _removeController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
     };
 } & {
     new (...args: any[]): {
         successText?: string;
         connectedCallback(): void;
         focus(...args: any[]): void;
-        _vividAriaBehaviour: import('../../shared/aria/aria-mixin.js').VividAriaBehaviour;
+        _vividAriaBehaviour: import('../../shared/aria/aria-mixin.ts').VividAriaBehaviour;
         readonly $fastController: import('@microsoft/fast-element').ElementController;
         $emit(type: string, detail?: any, options?: Omit<CustomEventInit, "detail">): boolean | void;
         disconnectedCallback: (() => void) & (() => void);
@@ -1750,9 +1753,9 @@ declare const Checkbox_base: {
             fromDeprecated: (v: any) => any;
             toDeprecated?: ((v: any) => any) | undefined;
         }): void;
-        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.js').ReactiveController>;
-        _addController(controller: import('../../shared/framework/reactive-controller.js').ReactiveController): void;
-        _removeController(controller: import('../../shared/framework/reactive-controller.js').ReactiveController): void;
+        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.ts').ReactiveController>;
+        _addController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
+        _removeController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
     };
 } & {
     new (...args: any[]): {
@@ -1798,7 +1801,7 @@ declare const Checkbox_base: {
         _keypressHandler(e: KeyboardEvent): void;
         stopPropagation(e: Event): void;
         focus(...args: any[]): void;
-        _vividAriaBehaviour: import('../../shared/aria/aria-mixin.js').VividAriaBehaviour;
+        _vividAriaBehaviour: import('../../shared/aria/aria-mixin.ts').VividAriaBehaviour;
         readonly $fastController: import('@microsoft/fast-element').ElementController;
         $emit(type: string, detail?: any, options?: Omit<CustomEventInit, "detail">): boolean | void;
         attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
@@ -2213,9 +2216,9 @@ declare const Checkbox_base: {
             fromDeprecated: (v: any) => any;
             toDeprecated?: ((v: any) => any) | undefined;
         }): void;
-        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.js').ReactiveController>;
-        _addController(controller: import('../../shared/framework/reactive-controller.js').ReactiveController): void;
-        _removeController(controller: import('../../shared/framework/reactive-controller.js').ReactiveController): void;
+        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.ts').ReactiveController>;
+        _addController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
+        _removeController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
     };
 } & {
     new (...args: any[]): {
@@ -2266,7 +2269,7 @@ declare const Checkbox_base: {
         _keypressHandler(e: KeyboardEvent): void;
         stopPropagation(e: Event): void;
         focus(...args: any[]): void;
-        _vividAriaBehaviour: import('../../shared/aria/aria-mixin.js').VividAriaBehaviour;
+        _vividAriaBehaviour: import('../../shared/aria/aria-mixin.ts').VividAriaBehaviour;
         readonly $fastController: import('@microsoft/fast-element').ElementController;
         $emit(type: string, detail?: any, options?: Omit<CustomEventInit, "detail">): boolean | void;
         attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
@@ -2681,9 +2684,9 @@ declare const Checkbox_base: {
             fromDeprecated: (v: any) => any;
             toDeprecated?: ((v: any) => any) | undefined;
         }): void;
-        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.js').ReactiveController>;
-        _addController(controller: import('../../shared/framework/reactive-controller.js').ReactiveController): void;
-        _removeController(controller: import('../../shared/framework/reactive-controller.js').ReactiveController): void;
+        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.ts').ReactiveController>;
+        _addController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
+        _removeController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
     };
     get formAssociated(): boolean;
 } & typeof VividElement;

package/lib/combobox/combobox.d.ts

@@ -1,10 +1,15 @@
-import { Appearance, Shape, Size } from '../enums';
+import { Shape, Size } from '../enums';
 import { ListboxOption } from '../option/option';
 import { ExtractFromEnum } from '../../shared/utils/enums';
 import { Listbox } from '../../shared/foundation/listbox/listbox';
 import { ComboboxAutocomplete } from './combobox.options';
+import { ComponentEnum } from '../../shared/utils/component-enum.ts';
 export type PopupPlacement = 'top-start' | 'top' | 'top-end' | 'bottom-start' | 'bottom' | 'bottom-end';
-export type ComboboxAppearance = ExtractFromEnum<Appearance, Appearance.Fieldset | Appearance.Ghost>;
+export declare const comboboxAppearance: {
+    parse: (value: unknown) => "fieldset" | "ghost";
+    defaultValue: "fieldset" | "ghost";
+};
+export type ComboboxAppearance = ComponentEnum<typeof comboboxAppearance>;
 export type ComboboxShape = ExtractFromEnum<Shape, Shape.Rounded | Shape.Pill>;
 export type ComboboxSize = ExtractFromEnum<Size, Size.Condensed | Size.Normal>;
 declare const Combobox_base: {
@@ -54,7 +59,7 @@ declare const Combobox_base: {
         _keypressHandler(e: KeyboardEvent): void;
         stopPropagation(e: Event): void;
         focus(...args: any[]): void;
-        _vividAriaBehaviour: import('../../shared/aria/aria-mixin').VividAriaBehaviour;
+        _vividAriaBehaviour: import('../../shared/aria/aria-mixin.ts').VividAriaBehaviour;
         readonly $fastController: import('@microsoft/fast-element').ElementController;
         $emit(type: string, detail?: any, options?: Omit<CustomEventInit, "detail">): boolean | void;
         attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
@@ -469,9 +474,9 @@ declare const Combobox_base: {
             fromDeprecated: (v: any) => any;
             toDeprecated?: ((v: any) => any) | undefined;
         }): void;
-        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller').ReactiveController>;
-        _addController(controller: import('../../shared/framework/reactive-controller').ReactiveController): void;
-        _removeController(controller: import('../../shared/framework/reactive-controller').ReactiveController): void;
+        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.ts').ReactiveController>;
+        _addController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
+        _removeController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
     };
 } & {
     new (...args: any[]): {
@@ -479,14 +484,14 @@ declare const Combobox_base: {
         _helperTextSlottedContent?: HTMLElement[];
         get _feedbackDescribedBy(): string;
         _internalFeedback(): {
-            type: import('../../shared/feedback/feedback-message').FeedbackType;
+            type: import('../../shared/feedback/feedback-message.ts').FeedbackType;
             message: string;
         };
         _slottedHelperTextFeedbackType(): "none" | "helper";
-        _getFeedbackTemplate(ctx: import('../../shared/design-system/defineVividComponent').VividElementDefinitionContext): import('@microsoft/fast-element').ViewTemplate<any, any>;
+        _getFeedbackTemplate(ctx: import('../../shared/design-system/defineVividComponent.ts').VividElementDefinitionContext): import('@microsoft/fast-element').ViewTemplate<any, any>;
         connectedCallback(): void;
         focus(...args: any[]): void;
-        _vividAriaBehaviour: import('../../shared/aria/aria-mixin').VividAriaBehaviour;
+        _vividAriaBehaviour: import('../../shared/aria/aria-mixin.ts').VividAriaBehaviour;
         readonly $fastController: import('@microsoft/fast-element').ElementController;
         $emit(type: string, detail?: any, options?: Omit<CustomEventInit, "detail">): boolean | void;
         disconnectedCallback: (() => void) & (() => void);
@@ -902,9 +907,9 @@ declare const Combobox_base: {
             fromDeprecated: (v: any) => any;
             toDeprecated?: ((v: any) => any) | undefined;
         }): void;
-        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller').ReactiveController>;
-        _addController(controller: import('../../shared/framework/reactive-controller').ReactiveController): void;
-        _removeController(controller: import('../../shared/framework/reactive-controller').ReactiveController): void;
+        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.ts').ReactiveController>;
+        _addController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
+        _removeController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
     };
 } & {
     new (...args: any[]): {
@@ -956,7 +961,7 @@ declare const Combobox_base: {
         _keypressHandler(e: KeyboardEvent): void;
         stopPropagation(e: Event): void;
         focus(...args: any[]): void;
-        _vividAriaBehaviour: import('../../shared/aria/aria-mixin').VividAriaBehaviour;
+        _vividAriaBehaviour: import('../../shared/aria/aria-mixin.ts').VividAriaBehaviour;
         readonly $fastController: import('@microsoft/fast-element').ElementController;
         $emit(type: string, detail?: any, options?: Omit<CustomEventInit, "detail">): boolean | void;
         attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
@@ -1371,16 +1376,16 @@ declare const Combobox_base: {
             fromDeprecated: (v: any) => any;
             toDeprecated?: ((v: any) => any) | undefined;
         }): void;
-        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller').ReactiveController>;
-        _addController(controller: import('../../shared/framework/reactive-controller').ReactiveController): void;
-        _removeController(controller: import('../../shared/framework/reactive-controller').ReactiveController): void;
+        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.ts').ReactiveController>;
+        _addController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
+        _removeController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
     };
 } & {
     new (...args: any[]): {
         successText?: string;
         connectedCallback(): void;
         focus(...args: any[]): void;
-        _vividAriaBehaviour: import('../../shared/aria/aria-mixin').VividAriaBehaviour;
+        _vividAriaBehaviour: import('../../shared/aria/aria-mixin.ts').VividAriaBehaviour;
         readonly $fastController: import('@microsoft/fast-element').ElementController;
         $emit(type: string, detail?: any, options?: Omit<CustomEventInit, "detail">): boolean | void;
         disconnectedCallback: (() => void) & (() => void);
@@ -1796,9 +1801,9 @@ declare const Combobox_base: {
             fromDeprecated: (v: any) => any;
             toDeprecated?: ((v: any) => any) | undefined;
         }): void;
-        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller').ReactiveController>;
-        _addController(controller: import('../../shared/framework/reactive-controller').ReactiveController): void;
-        _removeController(controller: import('../../shared/framework/reactive-controller').ReactiveController): void;
+        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.ts').ReactiveController>;
+        _addController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
+        _removeController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
     };
 } & {
     new (...args: any[]): {
@@ -1844,7 +1849,7 @@ declare const Combobox_base: {
         _keypressHandler(e: KeyboardEvent): void;
         stopPropagation(e: Event): void;
         focus(...args: any[]): void;
-        _vividAriaBehaviour: import('../../shared/aria/aria-mixin').VividAriaBehaviour;
+        _vividAriaBehaviour: import('../../shared/aria/aria-mixin.ts').VividAriaBehaviour;
         readonly $fastController: import('@microsoft/fast-element').ElementController;
         $emit(type: string, detail?: any, options?: Omit<CustomEventInit, "detail">): boolean | void;
         attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
@@ -2259,9 +2264,9 @@ declare const Combobox_base: {
             fromDeprecated: (v: any) => any;
             toDeprecated?: ((v: any) => any) | undefined;
         }): void;
-        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller').ReactiveController>;
-        _addController(controller: import('../../shared/framework/reactive-controller').ReactiveController): void;
-        _removeController(controller: import('../../shared/framework/reactive-controller').ReactiveController): void;
+        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.ts').ReactiveController>;
+        _addController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
+        _removeController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
     };
 } & {
     new (...args: any[]): {
@@ -2269,7 +2274,7 @@ declare const Combobox_base: {
         iconSlottedContent?: HTMLElement[];
         connectedCallback(): void;
         focus(...args: any[]): void;
-        _vividAriaBehaviour: import('../../shared/aria/aria-mixin').VividAriaBehaviour;
+        _vividAriaBehaviour: import('../../shared/aria/aria-mixin.ts').VividAriaBehaviour;
         readonly $fastController: import('@microsoft/fast-element').ElementController;
         $emit(type: string, detail?: any, options?: Omit<CustomEventInit, "detail">): boolean | void;
         disconnectedCallback: (() => void) & (() => void);
@@ -2685,9 +2690,9 @@ declare const Combobox_base: {
             fromDeprecated: (v: any) => any;
             toDeprecated?: ((v: any) => any) | undefined;
         }): void;
-        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller').ReactiveController>;
-        _addController(controller: import('../../shared/framework/reactive-controller').ReactiveController): void;
-        _removeController(controller: import('../../shared/framework/reactive-controller').ReactiveController): void;
+        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.ts').ReactiveController>;
+        _addController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
+        _removeController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
     };
 } & {
     new (...args: any[]): {
@@ -2728,7 +2733,7 @@ declare const Combobox_base: {
         _keypressHandler(e: KeyboardEvent): void;
         stopPropagation(e: Event): void;
         focus(...args: any[]): void;
-        _vividAriaBehaviour: import('../../shared/aria/aria-mixin').VividAriaBehaviour;
+        _vividAriaBehaviour: import('../../shared/aria/aria-mixin.ts').VividAriaBehaviour;
         readonly $fastController: import('@microsoft/fast-element').ElementController;
         $emit(type: string, detail?: any, options?: Omit<CustomEventInit, "detail">): boolean | void;
         attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
@@ -3143,9 +3148,9 @@ declare const Combobox_base: {
             fromDeprecated: (v: any) => any;
             toDeprecated?: ((v: any) => any) | undefined;
         }): void;
-        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller').ReactiveController>;
-        _addController(controller: import('../../shared/framework/reactive-controller').ReactiveController): void;
-        _removeController(controller: import('../../shared/framework/reactive-controller').ReactiveController): void;
+        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.ts').ReactiveController>;
+        _addController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
+        _removeController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
     };
     get formAssociated(): boolean;
 } & typeof Listbox;

package/lib/components.d.ts

@@ -29,6 +29,7 @@ export * from './divider/definition';
 export * from './empty-state/definition';
 export * from './fab/definition';
 export * from './file-picker/definition';
+export * from './form-field/definition';
 export * from './header/definition';
 export * from './icon/definition';
 export * from './kbd-shortcut/definition';

package/lib/data-grid/data-grid.options.d.ts

@@ -1,3 +1,4 @@
+import { ComponentEnum } from '../../shared/utils/component-enum.ts';
 export type ValuesOf<T> = T[keyof T];
 export declare const DataGridCellSortStates: {
     readonly none: "none";
@@ -24,11 +25,15 @@ export declare const DataGridRowTypes: {
     readonly stickyHeader: "sticky-header";
 };
 export type DataGridRowTypes = ValuesOf<typeof DataGridRowTypes>;
+export declare const dataGridConnotation: {
+    parse: (value: unknown) => "accent" | "cta";
+    defaultValue: "accent" | "cta";
+};
 export declare const DataGridConnotation: {
     readonly accent: "accent";
     readonly cta: "cta";
 };
-export type DataGridConnotation = ValuesOf<typeof DataGridConnotation>;
+export type DataGridConnotation = ComponentEnum<typeof dataGridConnotation>;
 export declare const DataGridCellTypeClass: {
     readonly columnheader: "column-header";
     readonly default: "";

package/lib/dial-pad/locale.d.ts

@@ -14,6 +14,7 @@ export interface DialPadLocale {
     digitNineLabel: string;
     digitAsteriskLabel: string;
     digitZeroLabel: string;
+    digitZeroDescription: string;
     digitHashtagLabel: string;
     errorLabel: string;
 }

package/lib/divider/divider.d.ts

@@ -1,8 +1,11 @@
 import { Orientation } from '@microsoft/fast-web-utilities';
-import { Appearance } from '../enums.js';
 import { VividElement } from '../../shared/foundation/vivid-element/vivid-element';
-import { ExtractFromEnum } from '../../shared/utils/enums';
-export type DividerAppearance = ExtractFromEnum<Appearance, Appearance.Ghost | Appearance.Subtle>;
+import { ComponentEnum } from '../../shared/utils/component-enum.ts';
+export declare const dividerAppearance: {
+    parse: (value: unknown) => "subtle" | "ghost";
+    defaultValue: "subtle" | "ghost";
+};
+export type DividerAppearance = ComponentEnum<typeof dividerAppearance>;
 export declare const DividerRole: {
     readonly separator: "separator";
     readonly presentation: "presentation";
@@ -428,9 +431,9 @@ declare const Divider_base: {
             fromDeprecated: (v: any) => any;
             toDeprecated?: ((v: any) => any) | undefined;
         }): void;
-        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.js').ReactiveController>;
-        _addController(controller: import('../../shared/framework/reactive-controller.js').ReactiveController): void;
-        _removeController(controller: import('../../shared/framework/reactive-controller.js').ReactiveController): void;
+        "__#private@#controllers": Set<import('../../shared/framework/reactive-controller.ts').ReactiveController>;
+        _addController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
+        _removeController(controller: import('../../shared/framework/reactive-controller.ts').ReactiveController): void;
     };
 } & typeof VividElement;
 export declare class Divider extends Divider_base {

package/lib/elevation/definition.d.ts

@@ -1 +1,3 @@
+import { Elevation } from './elevation';
 export declare const registerElevation: (prefix?: string) => void;
+export { Elevation as VwcElevationElement };

package/lib/empty-state/empty-state.d.ts

@@ -1,7 +1,12 @@
-import { Connotation, IconDecoration } from '../enums.js';
+import { IconDecoration } from '../enums.js';
 import { VividElement } from '../../shared/foundation/vivid-element/vivid-element';
 import { ExtractFromEnum } from '../../shared/utils/enums';
-export type EmptyStateConnotation = ExtractFromEnum<Connotation, Connotation.Accent | Connotation.CTA | Connotation.Success | Connotation.Alert | Connotation.Warning | Connotation.Information>;
+import { ComponentEnum } from '../../shared/utils/component-enum.ts';
+export declare const emptyStateConnotation: {
+    parse: (value: unknown) => "alert" | "accent" | "warning" | "cta" | "success" | "information";
+    defaultValue: "alert" | "accent" | "warning" | "cta" | "success" | "information";
+};
+export type EmptyStateConnotation = ComponentEnum<typeof emptyStateConnotation>;
 export type EmptyStateIconDecoration = ExtractFromEnum<IconDecoration, IconDecoration.Filled | IconDecoration.Outlined>;
 export declare class EmptyState extends VividElement {
     connotation?: EmptyStateConnotation;

package/lib/fab/fab.d.ts

@@ -1,7 +1,8 @@
 import { VividFoundationButton } from '../../shared/foundation/button/button.js';
-import { Connotation, Size } from '../enums.js';
+import { Size } from '../enums.js';
 import { ExtractFromEnum } from '../../shared/utils/enums';
-export type FabConnotation = ExtractFromEnum<Connotation, Connotation.CTA | Connotation.Accent | Connotation.Announcement>;
+export declare const FAB_CONNOTATIONS: readonly ["cta", "accent", "announcement"];
+export type FabConnotation = (typeof FAB_CONNOTATIONS)[number];
 export type FABSize = ExtractFromEnum<Size, Size.Condensed | Size.Normal | Size.Expanded>;
 declare const Fab_base: {
     new (...args: any[]): {

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

@@ -0,0 +1,4 @@
+import { FormField } from './form-field';
+export type { FormFieldState } from './form-field';
+export declare const registerFormField: (prefix?: string) => void;
+export { FormField as VwcFormFieldElement };

package/lib/form-field/form-field.d.ts

@@ -0,0 +1,6 @@
+import { VividElement } from '../../shared/foundation/vivid-element/vivid-element';
+import { FeedbackType } from '../../shared/feedback/feedback-message';
+export type FormFieldState = Extract<FeedbackType, 'error' | 'success'>;
+export declare class FormField extends VividElement {
+    state?: FormFieldState;
+}

package/lib/form-field/form-field.template.d.ts

@@ -0,0 +1,3 @@
+import { VividElementDefinitionContext } from '../../shared/design-system/defineVividComponent';
+import { FormField } from './form-field';
+export declare const FormFieldTemplate: (context: VividElementDefinitionContext) => import('@microsoft/fast-element').ViewTemplate<FormField, any>;

package/lib/icon/icon.d.ts

@@ -5,7 +5,7 @@ export type IconConnotation = ExtractFromEnum<Connotation, Connotation.Accent |
 export declare class Icon extends VividElement {
     #private;
     connotation?: IconConnotation;
-    size?: -6 | -5 | -4 | -3 | -2 | -1 | 0 | 1 | 2 | 3 | 4 | 5;
+    size?: -7 | -6 | -5 | -4 | -3 | -2 | -1 | 0 | 1 | 2 | 3 | 4 | 5;
     label?: string;
     name?: string;
 }

package/lib/kbd-key/kbd-key.d.ts

@@ -1,12 +1,17 @@
-import { Appearance, Size } from '../enums.js';
+import { Size } from '../enums.js';
 import { VividElement } from '../../shared/foundation/vivid-element/vivid-element';
 import { ExtractFromEnum } from '../../shared/utils/enums';
+import { ComponentEnum } from '../../shared/utils/component-enum.ts';
 declare const SUPPORTED_KEY_NAMES: readonly ["Alt", "Control", "Shift", "Enter", "Tab", "Space", "Backspace", "Escape", "ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight", "End", "Home", "PageUp", "PageDown", "A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z", "0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "Mod", "Custom"];
 export type KbdKeyName = (typeof SUPPORTED_KEY_NAMES)[number];
 export declare const KEY_DISPLAY_MAP: Record<string, string>;
 export declare const APPLE_DISPLAY_OVERRIDES: Record<string, string>;
 export type KbdKeyKeyboard = 'auto' | 'standard' | 'apple';
-export type KbdKeyAppearance = ExtractFromEnum<Appearance, Appearance.Subtle | Appearance.Outlined> | 'dropshadow';
+export declare const kbdKeyAppearance: {
+    parse: (value: unknown) => "outlined" | "subtle" | "dropshadow";
+    defaultValue: "outlined" | "subtle" | "dropshadow";
+};
+export type KbdKeyAppearance = ComponentEnum<typeof kbdKeyAppearance>;
 export type KbdKeySize = ExtractFromEnum<Size, Size.SuperCondensed | Size.Condensed | Size.Normal | Size.Expanded>;
 export declare class KbdKey extends VividElement {
     name?: KbdKeyName;

package/lib/listbox/listbox.d.ts

@@ -1295,6 +1295,7 @@ export declare class Listbox extends Listbox_base {
     selectionMode: SelectionMode;
     selectionBehavior: SelectionBehavior;
     requiredSelection: RequiredSelectionMode;
+    disconnectedCallback(): void;
     values: Value[];
     get value(): Value | null;
     set value(value: Value | null);