@vonage/vivid 3.0.0-next.12 → 3.0.0-next.120

package/dialog/index.js

@@ -0,0 +1,24 @@
+import { r as registerDialog } from '../shared/definition17.js';
+import '../shared/index.js';
+import '../shared/definition3.js';
+import '../shared/icon.js';
+import '../shared/to-string.js';
+import '../shared/string-trim.js';
+import '../shared/_has.js';
+import '../shared/when.js';
+import '../shared/class-names.js';
+import '../shared/definition9.js';
+import '../shared/definition4.js';
+import '../shared/focus.js';
+import '../shared/affix.js';
+import '../shared/button.js';
+import '../shared/apply-mixins.js';
+import '../shared/form-associated.js';
+import '../shared/key-codes.js';
+import '../shared/aria-global.js';
+import '../shared/start-end.js';
+import '../shared/ref.js';
+import '../shared/focus2.js';
+import '../shared/definition15.js';
+
+registerDialog();

package/divider/index.js

@@ -0,0 +1,6 @@
+import { r as registerDivider } from '../shared/definition18.js';
+import '../shared/index.js';
+import '../shared/aria.js';
+import '../shared/class-names.js';
+
+registerDivider();

package/elevation/index.js

@@ -1,31 +1,5 @@
-import { F as FoundationElement, _ as __decorate, a as attr, b as __metadata, h as html, d as designSystem } from '../shared/index.js';
-import { s as styleInject } from '../shared/style-inject.es.js';
-import { c as classNames } from '../shared/class-names.js';
+import { r as registerElevation } from '../shared/definition15.js';
+import '../shared/index.js';
+import '../shared/class-names.js';
 
-class Elevation extends FoundationElement {}
-
-__decorate([attr, __metadata("design:type", Number)], Elevation.prototype, "dp", void 0);
-
-var css_248z = ".control.dp-0 ::slotted(*) {\n  background-color: var(--vvd-color-surface-0dp);\n  filter: var(--vvd-shadow-surface-0dp);\n}\n.control.dp-2 ::slotted(*) {\n  background-color: var(--vvd-color-surface-2dp);\n  filter: var(--vvd-shadow-surface-2dp);\n}\n.control.dp-4 ::slotted(*) {\n  background-color: var(--vvd-color-surface-4dp);\n  filter: var(--vvd-shadow-surface-4dp);\n}\n.control.dp-8 ::slotted(*) {\n  background-color: var(--vvd-color-surface-8dp);\n  filter: var(--vvd-shadow-surface-8dp);\n}\n.control.dp-12 ::slotted(*) {\n  background-color: var(--vvd-color-surface-12dp);\n  filter: var(--vvd-shadow-surface-12dp);\n}\n.control.dp-16 ::slotted(*) {\n  background-color: var(--vvd-color-surface-16dp);\n  filter: var(--vvd-shadow-surface-16dp);\n}\n.control.dp-24 ::slotted(*) {\n  background-color: var(--vvd-color-surface-24dp);\n  filter: var(--vvd-shadow-surface-24dp);\n}\n.control:not(.dp-0, .dp-4, .dp-8, .dp-12, .dp-16, .dp-24) ::slotted(*) {\n  background-color: var(--vvd-color-surface-2dp);\n  filter: var(--vvd-shadow-surface-2dp);\n}";
-styleInject(css_248z);
-
-let _ = t => t,
-    _t;
-
-const getClasses = ({
-  dp
-}) => classNames('control', [`dp-${dp}`, Boolean(dp)]);
-
-const elevationTemplate = () => html(_t || (_t = _`
-        <div class="${0}" part="base">
-			<slot></slot>
-		</div>`), getClasses);
-
-const VIVIDElevation = Elevation.compose({
-  baseName: 'elevation',
-  template: elevationTemplate,
-  styles: css_248z
-});
-designSystem.register(VIVIDElevation());
-
-export { VIVIDElevation };
+registerElevation();

package/fab/index.js

@@ -0,0 +1,22 @@
+import { r as registerFab } from '../shared/definition19.js';
+import '../shared/index.js';
+import '../shared/definition3.js';
+import '../shared/icon.js';
+import '../shared/to-string.js';
+import '../shared/string-trim.js';
+import '../shared/_has.js';
+import '../shared/when.js';
+import '../shared/class-names.js';
+import '../shared/definition4.js';
+import '../shared/focus.js';
+import '../shared/affix.js';
+import '../shared/button.js';
+import '../shared/apply-mixins.js';
+import '../shared/form-associated.js';
+import '../shared/key-codes.js';
+import '../shared/aria-global.js';
+import '../shared/start-end.js';
+import '../shared/ref.js';
+import '../shared/focus2.js';
+
+registerFab();

package/focus/index.js

@@ -1,3 +1,5 @@
+import { r as registerFocus } from '../shared/definition4.js';
 import '../shared/index.js';
-export { V as VIVIDFocus } from '../shared/index2.js';
-import '../shared/style-inject.es.js';
+import '../shared/focus.js';
+
+registerFocus();

package/header/index.js

@@ -0,0 +1,58 @@
+import { F as FoundationElement, _ as __decorate, a as attr, b as __metadata, h as html, r as registerFactorial } from '../shared/index.js';
+import { E as Elevation, e as elevationElements } from '../shared/definition15.js';
+import { c as classNames } from '../shared/class-names.js';
+
+var css_248z = "/**\n * Do not edit directly\n * Generated on Wed, 14 Dec 2022 16:38:57 GMT\n */\n.base {\n  z-index: 1;\n  block-size: calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density, 0), 2))) + calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density, 0), 2) - 16)));\n  font: var(--vvd-typography-heading-4);\n  inline-size: 100%;\n}\n.base .header-content {\n  display: inline-flex;\n  align-items: center;\n  column-gap: 4px;\n}\n\n.container {\n  display: flex;\n  box-sizing: border-box;\n  justify-content: space-between;\n  block-size: inherit;\n  color: var(--vvd-color-canvas-text);\n  column-gap: 12px;\n  padding-block: 8px;\n  padding-inline: 16px;\n}\n.container[part~=vvd-theme-alternate] {\n  background-color: var(--vvd-color-canvas);\n  color: var(--vvd-color-canvas-text);\n  color-scheme: var(--vvd-color-scheme);\n}\n\n.app-content {\n  --vvd-header-block-size: calc(calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density, 0), 2))) + calc(1px * (40 + 4 * clamp(-1, var(--vvd-size-density, 0), 2) - 16)));\n}";
+
+class Header extends FoundationElement {
+  constructor() {
+    super(...arguments);
+    this.elevationShadow = false;
+    this.alternate = false;
+  }
+}
+__decorate([attr({
+  attribute: 'elevation-shadow',
+  mode: 'boolean'
+}), __metadata("design:type", Object)], Header.prototype, "elevationShadow", void 0);
+__decorate([attr({
+  mode: 'boolean'
+}), __metadata("design:type", Object)], Header.prototype, "alternate", void 0);
+
+let _ = t => t,
+  _t;
+const getPartAlternate = ({
+  alternate
+}) => classNames(['vvd-theme-alternate', Boolean(alternate)]);
+const headerTemplate = context => {
+  const elevationTag = context.tagFor(Elevation);
+  return html(_t || (_t = _`
+    <${0} dp="4" ?no-shadow=${0}>
+      <header class="base" part="base">
+        <!-- a container is needed to distinguish the surface background color of the
+        element from its shadow when applying elevation with alternate -->
+        <div class="container" part="${0}">
+          <section class="header-content">
+            <slot></slot>
+          </section>
+          <section class="header-content">
+            <slot name="action-items"></slot>
+          </section>
+        </div>
+      </header>
+    </${0}>
+    <div class="app-content">
+      <slot name="app-content"></slot>
+    </div>
+	`), elevationTag, x => !x.elevationShadow, getPartAlternate, elevationTag);
+};
+
+const header = Header.compose({
+  baseName: 'header',
+  template: headerTemplate,
+  styles: css_248z
+})();
+const headerElements = [header, ...elevationElements];
+const registerHeader = registerFactorial(headerElements);
+
+registerHeader();

package/icon/index.js

@@ -1,38 +1,10 @@
-import { h as html, d as designSystem } from '../shared/index.js';
-import { s as styleInject } from '../shared/style-inject.es.js';
-import { I as Icon } from '../shared/icon.js';
-import { w as when } from '../shared/when.js';
-import { c as classNames } from '../shared/class-names.js';
-import '../shared/object-set-prototype-of.js';
+import { r as registerIcon } from '../shared/definition3.js';
+import '../shared/index.js';
+import '../shared/icon.js';
+import '../shared/to-string.js';
+import '../shared/string-trim.js';
 import '../shared/_has.js';
+import '../shared/when.js';
+import '../shared/class-names.js';
 
-var css_248z = ":host {\n  display: inline-block;\n  vertical-align: sub;\n}\n\n.control {\n  display: flex;\n  margin: unset;\n  color: currentColor;\n  contain: strict;\n}\n.control.connotation-primary {\n  --connotation: var(--vvd-color-primary);\n  --on-connotation: var(--vvd-color-on-primary);\n}\n\n.control.connotation-announcement {\n  --connotation: var(--vvd-color-announcement);\n  --on-connotation: var(--vvd-color-on-announcement);\n}\n\n.control.connotation-cta {\n  --connotation: var(--vvd-color-cta);\n  --on-connotation: var(--vvd-color-on-cta);\n}\n\n.control.connotation-success {\n  --connotation: var(--vvd-color-success);\n  --on-connotation: var(--vvd-color-on-success);\n}\n\n.control.connotation-alert {\n  --connotation: var(--vvd-color-alert);\n  --on-connotation: var(--vvd-color-on-alert);\n}\n\n.control.connotation-info {\n  --connotation: var(--vvd-color-info);\n  --on-connotation: var(--vvd-color-on-info);\n}\n\n.control[class*=connotation] {\n  color: var(--connotation);\n}\n\nsvg {\n  margin: auto;\n  block-size: inherit;\n  inline-size: inherit;\n}\n\n/* Size */\n.control:not(.size-base-small):not(.size-base):not(.size-base-large) {\n  block-size: 1em;\n  inline-size: 1em;\n}\n\n.control.size-base-small {\n  block-size: 16px;\n  inline-size: 16px;\n}\n\n.control.size-base {\n  block-size: 24px;\n  inline-size: 24px;\n}\n\n.control.size-base-large {\n  block-size: 32px;\n  inline-size: 32px;\n}";
-styleInject(css_248z);
-
-let _ = t => t,
-    _t,
-    _t2;
-
-const getClasses = ({
-  connotation,
-  size
-}) => classNames('control', [`connotation-${connotation}`, Boolean(connotation)], [`size-${size}`, Boolean(size)]);
-
-const iconTemplate = () => html(_t || (_t = _`
-  <figure class="${0}">
-		${0}
-  </figure>
-	`), getClasses, when(x => isValidString(x.svg), x => html(_t2 || (_t2 = _`${0}`), x.svg)));
-
-function isValidString(value) {
-  return typeof value === 'string' && value.length > 0;
-}
-
-const vividIcon = Icon.compose({
-  baseName: 'icon',
-  template: iconTemplate,
-  styles: css_248z
-});
-designSystem.register(vividIcon());
-
-export { vividIcon };
+registerIcon();

package/index.js

@@ -1,33 +1,72 @@
-export { vividTextAnchor } from './text-anchor/index.js';
-export { VIVIDBadge } from './badge/index.js';
-export { vividButton } from './button/index.js';
-export { V as VIVIDFocus } from './shared/index2.js';
-export { vividIcon } from './icon/index.js';
-export { VIVIDLayout } from './layout/index.js';
-export { VIVIDElevation } from './elevation/index.js';
-export { vividBreadcrumbItem } from './breadcrumb-item/index.js';
-export { vividBreadcrumb } from './breadcrumb/index.js';
-export { VIVIDSideDrawer } from './side-drawer/index.js';
-export { vividCalendar } from './calendar/index.js';
-export { VIVIDPopup } from './popup/index.js';
-export { vividTooltip } from './tooltip/index.js';
-export { vividBanner } from './banner/index.js';
-export { vividAccordionItem } from './accordion-item/index.js';
-export { vividAccordion } from './accordion/index.js';
-export { d as designSystem, p as provideVividDesignSystem } from './shared/index.js';
-import './shared/text-anchor.js';
+export { a as accordion, b as accordionElements, r as registerAccordion } from './shared/definition.js';
+export { a as accordionItem, b as accordionItemElements, r as registerAccordionItem } from './shared/definition2.js';
+export { a as actionGroup, b as actionGroupElements, r as registerActionGroup } from './shared/definition5.js';
+export { a as avatar, b as avatarElements, r as registerAvatar } from './shared/definition6.js';
+export { b as badge, a as badgeElements, r as registerBadge } from './shared/definition7.js';
+export { b as banner, a as bannerElements, r as registerBanner } from './shared/definition8.js';
+export { b as breadcrumb, a as breadcrumbElements, r as registerBreadcrumb } from './shared/definition10.js';
+export { b as breadcrumbItem, a as breadcrumbItemElements, r as registerBreadcrumbItem } from './shared/definition11.js';
+export { a as button, b as buttonElements, r as registerButton } from './shared/definition9.js';
+export { c as calendar, a as calendarElements, r as registerCalendar } from './shared/definition12.js';
+export { c as calendarEvent, a as calendarEventElements, r as registerCalendarEvent } from './shared/definition13.js';
+export { c as card, a as cardElements, r as registerCard } from './shared/definition14.js';
+export { c as checkbox, a as checkboxElements, r as registerCheckbox } from './shared/definition16.js';
+export { a as elevation, e as elevationElements, r as registerElevation } from './shared/definition15.js';
+export { d as dialog, a as dialogElements, r as registerDialog } from './shared/definition17.js';
+export { a as divider, d as dividerElements, r as registerDivider } from './shared/definition18.js';
+export { f as fab, a as fabElements, r as registerFab } from './shared/definition19.js';
+export { a as icon, i as iconElements, r as registerIcon } from './shared/definition3.js';
+export { l as layout, a as layoutElements, r as registerLayout } from './shared/definition20.js';
+export { l as listboxElements, r as registerListbox } from './shared/definition21.js';
+export { a as listboxOption, l as listboxOptionElements, r as registerOption } from './shared/definition22.js';
+export { m as menu, a as menuElements, r as registerMenu } from './shared/definition23.js';
+export { c as menuItem, m as menuItemElements, b as registerMenuItem } from './shared/definition25.js';
+export { n as nav, a as navElements, r as registerNav } from './shared/definition26.js';
+export { n as navDisclosure, a as navDisclosureElements, r as registerNavDisclosure } from './shared/definition27.js';
+export { n as navItem, a as navItemElements, r as registerNavItem } from './shared/definition28.js';
+export { n as note, a as noteElements, r as registerNote } from './shared/definition29.js';
+export { a as popup, p as popupElements, r as registerPopup } from './shared/definition24.js';
+export { p as progress, a as progressElements, r as registerProgress } from './shared/definition30.js';
+export { p as progressRing, a as progressRingElements, r as registerProgressRing } from './shared/definition31.js';
+export { a as radio, b as radioElements, r as registerRadio } from './shared/definition32.js';
+export { a as radioGroup, b as radioGroupElements, r as registerRadioGroup } from './shared/definition33.js';
+export { r as registerSideDrawer, s as sideDrawer, a as sideDrawerElements } from './shared/definition34.js';
+export { r as registerSlider, s as slider, a as sliderElements } from './shared/definition35.js';
+export { r as registerSwitch, s as switchCE, a as switchElements } from './shared/definition36.js';
+export { r as registerTextField, t as textField, a as textFieldElements } from './shared/definition38.js';
+export { r as registerTextArea, t as textArea, a as textAreaElements } from './shared/definition37.js';
+export { r as registerTooltip, t as tooltip, a as tooltipElements } from './shared/definition39.js';
+export { r as registerFactorial } from './shared/index.js';
+import './shared/class-names.js';
+import './shared/definition4.js';
+import './shared/focus.js';
 import './shared/affix.js';
-import './shared/web.dom-collections.iterator.js';
-import './shared/object-set-prototype-of.js';
 import './shared/icon.js';
+import './shared/to-string.js';
+import './shared/string-trim.js';
 import './shared/_has.js';
-import './shared/anchor.js';
 import './shared/apply-mixins.js';
-import './shared/aria-global.js';
-import './shared/text-anchor.template.js';
-import './shared/class-names.js';
-import './shared/style-inject.es.js';
+import './shared/focus2.js';
 import './shared/when.js';
-import './shared/breadcrumb-item.js';
+import './shared/enums.js';
 import './shared/slotted.js';
+import './shared/breadcrumb-item.js';
+import './shared/anchor.js';
+import './shared/aria-global.js';
+import './shared/start-end.js';
+import './shared/ref.js';
+import './shared/text-anchor.template.js';
+import './shared/button.js';
+import './shared/form-associated.js';
+import './shared/key-codes.js';
+import './shared/calendar-event.js';
 import './shared/es.object.assign.js';
+import './shared/aria.js';
+import './shared/numbers.js';
+import './shared/dom.js';
+import './shared/direction.js';
+import './shared/text-anchor.js';
+import './shared/base-progress.js';
+import './shared/radio.js';
+import './shared/es.regexp.to-string.js';
+import './shared/form-elements.js';

package/layout/index.js

@@ -1,53 +1,5 @@
-import { F as FoundationElement, _ as __decorate, a as attr, b as __metadata, h as html, d as designSystem } from '../shared/index.js';
-import { s as styleInject } from '../shared/style-inject.es.js';
-import { c as classNames } from '../shared/class-names.js';
+import { r as registerLayout } from '../shared/definition20.js';
+import '../shared/index.js';
+import '../shared/class-names.js';
 
-var AUTO_SIZING;
-
-(function (AUTO_SIZING) {
-  AUTO_SIZING["Fit"] = "fit";
-  AUTO_SIZING["Fill"] = "fill";
-})(AUTO_SIZING || (AUTO_SIZING = {}));
-
-class Layout extends FoundationElement {}
-
-__decorate([attr, __metadata("design:type", String)], Layout.prototype, "gutters", void 0);
-
-__decorate([attr({
-  attribute: 'column-basis'
-}), __metadata("design:type", String)], Layout.prototype, "columnBasis", void 0);
-
-__decorate([attr({
-  attribute: 'column-spacing'
-}), __metadata("design:type", String)], Layout.prototype, "columnSpacing", void 0);
-
-__decorate([attr({
-  attribute: 'auto-sizing'
-}), __metadata("design:type", String)], Layout.prototype, "autoSizing", void 0);
-
-var css_248z = "/* #region SIZEs */\n/* #region BASES */\n/* #region SPACES */\n.control {\n  display: grid;\n  grid-auto-rows: min-content;\n}\n.control.column-basis-base-small {\n  grid-template-columns: var(--layout-grid-template-columns, repeat(var(--_auto-sizing), minmax(10rem, 1fr)));\n}\n.control:not(.column-basis-base-small):not(.column-basis-base):not(.column-basis-base-large):not(.column-basis-block), .control.column-basis-base {\n  grid-template-columns: var(--layout-grid-template-columns, repeat(var(--_auto-sizing), minmax(20rem, 1fr)));\n}\n.control.column-basis-base-large {\n  grid-template-columns: var(--layout-grid-template-columns, repeat(var(--_auto-sizing), minmax(30rem, 1fr)));\n}\n.control.column-basis-block {\n  grid-template-columns: var(--layout-grid-template-columns, repeat(var(--_auto-sizing), minmax(1fr, 1fr)));\n}\n.control.column-spacing-base-small {\n  gap: 16px;\n}\n.control:not(.column-spacing-base-small):not(.column-spacing-base):not(.column-spacing-base-large), .control.column-spacing-base {\n  gap: 24px;\n}\n.control.column-spacing-base-large {\n  gap: 32px;\n}\n.control.gutters-base-small {\n  margin: 16px;\n}\n.control.gutters-base {\n  margin: 24px;\n}\n.control.gutters-base-large {\n  margin: 32px;\n}\n.control.auto-sizing-fill {\n  --_auto-sizing: auto-fill;\n}\n.control:not(.auto-sizing-fill):not(.auto-sizing-fit), .control.auto-sizing-fit {\n  --_auto-sizing: auto-fit;\n}";
-styleInject(css_248z);
-
-let _ = t => t,
-    _t;
-
-const getClasses = ({
-  columnBasis,
-  gutters,
-  columnSpacing,
-  autoSizing
-}) => classNames('control', [`column-basis-${columnBasis}`, Boolean(columnBasis)], [`gutters-${gutters}`, Boolean(gutters)], [`column-spacing-${columnSpacing}`, Boolean(columnSpacing)], [`auto-sizing-${autoSizing}`, Boolean(autoSizing)]);
-
-const layoutTemplate = () => html(_t || (_t = _`
-        <div class="${0}">
-			<slot></slot>
-		</div>`), getClasses);
-
-const VIVIDLayout = Layout.compose({
-  baseName: 'layout',
-  template: layoutTemplate,
-  styles: css_248z
-});
-designSystem.register(VIVIDLayout());
-
-export { VIVIDLayout };
+registerLayout();

package/lib/accordion/definition.d.ts

@@ -0,0 +1,3 @@
+import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
+export declare const accordionElements: import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>[];
+export declare const registerAccordion: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;

package/lib/accordion/index.d.ts

@@ -1,2 +1 @@
-import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
-export declare const vividAccordion: (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 {};

package/lib/accordion-item/definition.d.ts

@@ -0,0 +1,3 @@
+import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
+export declare const accordionItemElements: import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>[];
+export declare const registerAccordionItem: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;

package/lib/accordion-item/index.d.ts

@@ -1,3 +1 @@
-import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
-import '../icon';
-export declare const vividAccordionItem: (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 {};

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

@@ -0,0 +1,10 @@
+import { FoundationElement } from '@microsoft/fast-foundation';
+import type { Appearance, Shape } from '../enums.js';
+export declare type ActionGroupAppearance = Extract<Appearance, Appearance.Filled | Appearance.Outlined | Appearance.Ghost>;
+declare type ActionGroupShape = Extract<Shape, Shape.Rounded | Shape.Pill>;
+export declare class ActionGroup extends FoundationElement {
+    shape?: ActionGroupShape;
+    appearance?: ActionGroupAppearance;
+    tight: boolean;
+}
+export {};

package/lib/{sidenav-item/sidenav-item.template.d.ts → action-group/action-group.template.d.ts}

@@ -1,4 +1,4 @@
 import type { ViewTemplate } from '@microsoft/fast-element';
 import type { ElementDefinitionContext, FoundationElementDefinition } from '@microsoft/fast-foundation';
-import type { SidenavItem } from './sidenav-item';
-export declare const SidenavItemTemplate: (context: ElementDefinitionContext, definition: FoundationElementDefinition) => ViewTemplate<SidenavItem>;
+import type { ActionGroup } from './action-group';
+export declare const ActionGroupTemplate: (context: ElementDefinitionContext, definition: FoundationElementDefinition) => ViewTemplate<ActionGroup>;

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

@@ -0,0 +1,3 @@
+import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
+export declare const actionGroupElements: import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>[];
+export declare const registerActionGroup: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;

package/lib/action-group/index.d.ts

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

package/lib/avatar/avatar.d.ts

@@ -0,0 +1,15 @@
+import { FoundationElement } from '@microsoft/fast-foundation';
+import type { Appearance, Connotation, Shape, Size } from '../enums.js';
+export declare type AvatarConnotation = Extract<Connotation, Connotation.Accent | Connotation.CTA>;
+export declare type AvatarAppearance = Extract<Appearance, Appearance.Filled | Appearance.Outlined>;
+declare type AvatarShape = Extract<Shape, Shape.Rounded | Shape.Pill>;
+declare type AvatarSize = Extract<Size, Size.Condensed | Size.Normal | Size.Expanded>;
+export declare class Avatar extends FoundationElement {
+    connotation?: AvatarConnotation;
+    shape?: AvatarShape;
+    appearance?: AvatarAppearance;
+    size?: AvatarSize;
+    icon?: string;
+    name?: string;
+}
+export {};

package/lib/avatar/avatar.template.d.ts

@@ -0,0 +1,4 @@
+import type { ViewTemplate } from '@microsoft/fast-element';
+import type { ElementDefinitionContext, FoundationElementDefinition } from '@microsoft/fast-foundation';
+import type { Avatar } from './avatar';
+export declare const AvatarTemplate: (context: ElementDefinitionContext, definition: FoundationElementDefinition) => ViewTemplate<Avatar>;

package/lib/avatar/definition.d.ts

@@ -0,0 +1,3 @@
+import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
+export declare const avatarElements: import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>[];
+export declare const registerAvatar: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;

package/lib/avatar/index.d.ts

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

package/lib/badge/badge.d.ts

@@ -1,15 +1,13 @@
 import { FoundationElement } from '@microsoft/fast-foundation';
 import { AffixIconWithTrailing } from '../../shared/patterns/affix';
-import type { Appearance, Connotation, Shape, Size } from '../enums.js';
-declare type BadgeConnotation = Extract<Connotation, Connotation.Primary | Connotation.CTA | Connotation.Success | Connotation.Alert | Connotation.Warning | Connotation.Info>;
+import type { Appearance, Connotation, Shape } from '../enums.js';
+declare type BadgeConnotation = Extract<Connotation, Connotation.Accent | Connotation.CTA | Connotation.Success | Connotation.Alert | Connotation.Warning | Connotation.Information>;
 declare type BadgeAppearance = Extract<Appearance, Appearance.Filled | Appearance.Duotone | Appearance.Subtle>;
 declare type BadgeShape = Extract<Shape, Shape.Rounded | Shape.Pill>;
-declare type BadgeSize = Extract<Size, Size.BaseSmall | Size.Base | Size.BaseLarge>;
 export declare class Badge extends FoundationElement {
     connotation?: BadgeConnotation;
     shape?: BadgeShape;
     appearance?: BadgeAppearance;
-    size?: BadgeSize;
     text?: string;
 }
 export interface Badge extends AffixIconWithTrailing {

package/lib/badge/definition.d.ts

@@ -0,0 +1,3 @@
+import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
+export declare const badgeElements: import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>[];
+export declare const registerBadge: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;

package/lib/badge/index.d.ts

@@ -1,3 +1 @@
-import '../icon';
-import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
-export declare const VIVIDBadge: (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 {};

package/lib/banner/banner.d.ts

@@ -1,7 +1,7 @@
 import { FoundationElement } from '@microsoft/fast-foundation';
 import { Connotation } from '../enums';
 import { AffixIcon } from '../../shared/patterns/affix';
-export declare type BannerConnotation = Connotation.Info | Connotation.Announcement | Connotation.Success | Connotation.Warning | Connotation.Alert;
+export declare type BannerConnotation = Connotation.Information | Connotation.Announcement | Connotation.Success | Connotation.Warning | Connotation.Alert;
 export declare class Banner extends FoundationElement {
     #private;
     actionHref: string | undefined;

package/lib/banner/banner.template.d.ts

@@ -1,6 +1,4 @@
 import type { ViewTemplate } from '@microsoft/fast-element';
 import type { ElementDefinitionContext, FoundationElementDefinition } from '@microsoft/fast-foundation';
-import '../button';
-import '../text-anchor';
 import type { Banner } from './banner';
 export declare const BannerTemplate: (context: ElementDefinitionContext, definition: FoundationElementDefinition) => ViewTemplate<Banner>;

package/lib/banner/definition.d.ts

@@ -0,0 +1,3 @@
+import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
+export declare const bannerElements: import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>[];
+export declare const registerBanner: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;

package/lib/banner/index.d.ts

@@ -1,2 +1 @@
-import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
-export declare const vividBanner: (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 {};

package/lib/breadcrumb/breadcrumb.template.d.ts

@@ -0,0 +1,4 @@
+import type { ViewTemplate } from '@microsoft/fast-element';
+import type { FoundationElementTemplate } from '@microsoft/fast-foundation';
+import type { Breadcrumb } from './breadcrumb';
+export declare const breadcrumbTemplate: FoundationElementTemplate<ViewTemplate<Breadcrumb>>;

package/lib/breadcrumb/definition.d.ts

@@ -0,0 +1,3 @@
+import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
+export declare const breadcrumbElements: import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>[];
+export declare const registerBreadcrumb: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;

package/lib/breadcrumb/index.d.ts

@@ -1,2 +1 @@
-import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
-export declare const vividBreadcrumb: (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 {};

package/lib/breadcrumb-item/definition.d.ts

@@ -0,0 +1,3 @@
+import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
+export declare const breadcrumbItemElements: import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>[];
+export declare const registerBreadcrumbItem: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;

package/lib/breadcrumb-item/index.d.ts

@@ -1,3 +1 @@
-import '../icon';
-import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
-export declare const vividBreadcrumbItem: (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 {};

package/lib/button/button.d.ts

@@ -1,15 +1,16 @@
 import { Button as FoundationButton } from '@microsoft/fast-foundation';
 import type { Appearance, Connotation, Shape, Size } from '../enums.js';
 import { AffixIconWithTrailing } from '../../shared/patterns/affix';
-declare type ButtonConnotation = Extract<Connotation, Connotation.Primary | Connotation.CTA | Connotation.Success | Connotation.Alert>;
+declare type ButtonConnotation = Extract<Connotation, Connotation.Accent | Connotation.CTA | Connotation.Success | Connotation.Alert>;
 export declare type ButtonAppearance = Extract<Appearance, Appearance.Filled | Appearance.Outlined | Appearance.Ghost>;
 declare type ButtonShape = Extract<Shape, Shape.Rounded | Shape.Pill>;
-declare type ButtonSize = Extract<Size, Size.BaseSmall | Size.Base | Size.BaseLarge>;
+declare type ButtonSize = Extract<Size, Size.Condensed | Size.Normal | Size.Expanded>;
 export declare class Button extends FoundationButton {
     connotation?: ButtonConnotation;
     shape?: ButtonShape;
     appearance?: ButtonAppearance;
     size?: ButtonSize;
+    stacked: boolean;
     label?: string;
 }
 export interface Button extends AffixIconWithTrailing {

package/lib/button/definition.d.ts

@@ -0,0 +1,3 @@
+import { type FoundationElementDefinition } from '@microsoft/fast-foundation';
+export declare const buttonElements: import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>[];
+export declare const registerButton: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;

package/lib/button/index.d.ts

@@ -1,21 +1 @@
-import '../icon';
-import '../focus';
-import { Button as FastButton } from '@microsoft/fast-foundation';
-import { Button } from './button';
-export declare const vividButton: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<{
-    baseName: string;
-    baseClass: typeof FastButton;
-    template: any;
-    styles: import("@microsoft/fast-element").ComposableStyles;
-    shadowOptions: {
-        delegatesFocus: true;
-    };
-}> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<{
-    baseName: string;
-    baseClass: typeof FastButton;
-    template: any;
-    styles: import("@microsoft/fast-element").ComposableStyles;
-    shadowOptions: {
-        delegatesFocus: true;
-    };
-}, typeof Button>;
+export {};

package/lib/calendar/calendar.d.ts

@@ -1,11 +1,13 @@
 import { FoundationElement } from '@microsoft/fast-foundation';
 export declare class Calendar extends FoundationElement {
+    #private;
     datetime?: Date | string;
     startDay?: 'sunday' | 'monday';
     locales?: string | string[] | undefined;
     hour12: boolean;
     getEventContext: (this: Calendar, e: KeyboardEvent | MouseEvent) => import("./helpers/calendar.event-context").CalendarEventContext | null;
+    private getCalendarEventContainingCell;
     private arrowKeysInteractions;
-    private moveTo;
+    private activateElement;
     onKeydown({ key }: KeyboardEvent): boolean;
 }

package/lib/calendar/definition.d.ts

@@ -0,0 +1,3 @@
+import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
+export declare const calendarElements: import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>[];
+export declare const registerCalendar: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;