@vonage/vivid 3.0.0-next.3 → 3.0.0-next.30

package/header/index.js

@@ -0,0 +1,68 @@
+import { E as Elevation } from '../shared/index2.js';
+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 '../shared/web.dom-collections.iterator.js';
+import { c as classNames } from '../shared/class-names.js';
+import '../shared/export.js';
+import '../shared/object-keys.js';
+import '../shared/iterators.js';
+
+var css_248z = "/*\n  Do not edit directly\n  Generated on Wed, 27 Apr 2022 11:58:36 GMT\n*/\n.base {\n  font: 500 condensed 20px / 28px SpeziaWebVariable;\n  letter-spacing: 0px;\n  text-decoration: none;\n  text-transform: none;\n  --_header-block-size: 64px;\n  z-index: 1;\n  block-size: var(--_header-block-size);\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-on-canvas);\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}\n\n.app-content {\n  --_header-block-size: 64px;\n}";
+styleInject(css_248z);
+
+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" role="toolbar">
+            <slot name="actionItems"></slot>
+          </section>
+        </div>
+      </header>
+    </${0}>
+    <div class="app-content">
+      <slot name="app-content"></slot>
+    </div>
+	`), elevationTag, x => !x.elevationShadow, getPartAlternate, elevationTag);
+};
+
+const vividHeader = Header.compose({
+  baseName: 'header',
+  template: headerTemplate,
+  styles: css_248z
+});
+designSystem.register(vividHeader());
+
+export { vividHeader };

package/icon/index.js

@@ -1,5 +1,40 @@
-import '../shared/index2.js';
-export { v as vividIcon } from '../shared/index.js';
-import '../shared/style-inject.es.js';
-import '../shared/web.dom-collections.iterator.js';
-import '../shared/class-names.js';
+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/export.js';
+import '../shared/iterators.js';
+import '../shared/to-string.js';
+import '../shared/_has.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-accent {\n  --_connotation-color-primary: var(--vvd-color-on-canvas);\n}\n.control.connotation-announcement {\n  --_connotation-color-primary: var(--vvd-color-announcement);\n}\n.control.connotation-cta {\n  --_connotation-color-primary: var(--vvd-color-cta);\n}\n.control.connotation-success {\n  --_connotation-color-primary: var(--vvd-color-success);\n}\n.control.connotation-alert {\n  --_connotation-color-primary: var(--vvd-color-alert);\n}\n.control.connotation-info {\n  --_connotation-color-primary: var(--vvd-color-info);\n}\n\n.control[class*=connotation] {\n  color: var(--_connotation-color-basis);\n}\n\nsvg {\n  margin: auto;\n  block-size: inherit;\n  inline-size: inherit;\n}\n\n/* Size */\n.control:not(.size-small):not(.size-medium):not(.size-large) {\n  block-size: 1em;\n  inline-size: 1em;\n}\n\n.control.size-small {\n  block-size: 16px;\n  inline-size: 16px;\n}\n\n.control.size-medium {\n  block-size: 24px;\n  inline-size: 24px;\n}\n\n.control.size-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 };

package/index.d.ts

@@ -1 +1,2 @@
 export * from './lib/components';
+export * from './shared/design-system';

package/index.js

@@ -1,19 +1,55 @@
-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/index3.js';
-export { v as vividIcon } from './shared/index.js';
-export { VIVIDLayout } from './layout/index.js';
-export { VIVIDElevation } from './elevation/index.js';
-export { vividBreadcrumbItem } from './breadcrumb-item/index.js';
+export { vividAccordion } from './accordion/index.js';
+export { vividAccordionItem } from './accordion-item/index.js';
+export { vividActionGroup } from './action-group/index.js';
+export { vividBadge } from './badge/index.js';
+export { vividBanner } from './banner/index.js';
 export { vividBreadcrumb } from './breadcrumb/index.js';
-import './shared/index2.js';
+export { vividBreadcrumbItem } from './breadcrumb-item/index.js';
+export { vividButton } from './button/index.js';
+export { vividCalendar } from './calendar/index.js';
+export { vividCalendarEvent } from './calendar-event/index.js';
+export { vividCard } from './card/index.js';
+export { v as vividElevation } from './shared/index2.js';
+export { vividFab } from './fab/index.js';
+export { vividIcon } from './icon/index.js';
+export { vividLayout } from './layout/index.js';
+export { vividNote } from './note/index.js';
+export { vividPopup } from './popup/index.js';
+export { vividProgress } from './progress/index.js';
+export { vividProgressRing } from './progress-ring/index.js';
+export { vividSideDrawer } from './side-drawer/index.js';
+export { vividSidenav } from './sidenav/index.js';
+export { vividSidenavItem } from './sidenav-item/index.js';
+export { vividText } from './text/index.js';
+export { vividTextfield } from './text-field/index.js';
+export { vividTooltip } from './tooltip/index.js';
+export { vividCheckbox } from './checkbox/index.js';
+export { vividHeader } from './header/index.js';
+export { d as designSystem, p as provideVividDesignSystem } from './shared/index.js';
+import './shared/style-inject.es.js';
+import './shared/class-names.js';
+import './focus/index.js';
+import './shared/focus.js';
 import './shared/web.dom-collections.iterator.js';
-import './shared/anchor.js';
+import './shared/export.js';
+import './shared/object-keys.js';
+import './shared/iterators.js';
+import './shared/affix.js';
+import './shared/icon.js';
+import './shared/to-string.js';
+import './shared/_has.js';
 import './shared/apply-mixins.js';
+import './shared/focus2.js';
+import './shared/when.js';
+import './shared/enums.js';
+import './shared/button.js';
+import './shared/form-associated.js';
 import './shared/aria-global.js';
-import './shared/text-anchor.template.js';
-import './shared/class-names.js';
-import './shared/affix.js';
-import './shared/style-inject.es.js';
+import './shared/slotted.js';
 import './shared/breadcrumb-item.js';
+import './shared/anchor.js';
+import './shared/text-anchor.template.js';
+import './shared/calendar-event.js';
+import './shared/es.object.assign.js';
+import './shared/base-progress.js';
+import './shared/text-anchor.js';

package/layout/index.js

@@ -1,4 +1,4 @@
-import { F as FoundationElement, _ as __decorate, a as attr, b as __metadata, h as html, d as designSystem } from '../shared/index2.js';
+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';
 
@@ -25,7 +25,7 @@ __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}";
+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-small {\n  grid-template-columns: var(--layout-grid-template-columns, repeat(var(--_auto-sizing), minmax(10rem, 1fr)));\n}\n.control:not(.column-basis-small):not(.column-basis-medium):not(.column-basis-large):not(.column-basis-block), .control.column-basis-medium {\n  grid-template-columns: var(--layout-grid-template-columns, repeat(var(--_auto-sizing), minmax(20rem, 1fr)));\n}\n.control.column-basis-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-small {\n  gap: 16px;\n}\n.control:not(.column-spacing-small):not(.column-spacing-medium):not(.column-spacing-large), .control.column-spacing-medium {\n  gap: 24px;\n}\n.control.column-spacing-large {\n  gap: 32px;\n}\n.control.gutters-small {\n  margin: 16px;\n}\n.control.gutters-medium {\n  margin: 24px;\n}\n.control.gutters-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,
@@ -43,11 +43,11 @@ const layoutTemplate = () => html(_t || (_t = _`
 			<slot></slot>
 		</div>`), getClasses);
 
-const VIVIDLayout = Layout.compose({
+const vividLayout = Layout.compose({
   baseName: 'layout',
   template: layoutTemplate,
   styles: css_248z
 });
-designSystem.register(VIVIDLayout());
+designSystem.register(vividLayout());
 
-export { VIVIDLayout };
+export { vividLayout };

package/lib/accordion/accordion.d.ts

@@ -0,0 +1,9 @@
+import { FoundationElement } from '@microsoft/fast-foundation';
+export declare class Accordion extends FoundationElement {
+    private accordionItems;
+    multi: boolean;
+    constructor();
+    connectedCallback(): void;
+    private handleOpened;
+    closeAll(): void;
+}

package/lib/accordion/accordion.template.d.ts

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

package/lib/accordion/index.d.ts

@@ -0,0 +1,2 @@
+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>>;

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

@@ -0,0 +1,13 @@
+import { FoundationElement } from '@microsoft/fast-foundation';
+import { AffixIconWithTrailing } from '../../shared/patterns/affix';
+export declare class AccordionItem extends FoundationElement {
+    heading?: string;
+    headingLevel?: 2 | 3 | 4 | 5 | 6;
+    noIndicator: boolean;
+    meta?: string;
+    open: boolean;
+    attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
+    private emitEvent;
+}
+export interface AccordionItem extends AffixIconWithTrailing {
+}

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

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

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

@@ -0,0 +1,4 @@
+import '../icon';
+import '../focus';
+import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
+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>>;

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/action-group/action-group.template.d.ts

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

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

@@ -0,0 +1,2 @@
+import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
+export declare const vividActionGroup: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<FoundationElementDefinition> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;

package/lib/badge/badge.d.ts

@@ -1,17 +1,17 @@
 import { FoundationElement } from '@microsoft/fast-foundation';
-import { PrefixOrSuffix } 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>;
-declare type BadgeAppearance = Extract<Appearance, Appearance.Filled | Appearance.Outlined | Appearance.Soft>;
+import { AffixIconWithTrailing } from '../../shared/patterns/affix';
+import type { Appearance, Connotation, Density, Shape } from '../enums.js';
+declare type BadgeConnotation = Extract<Connotation, Connotation.Accent | Connotation.CTA | Connotation.Success | Connotation.Alert | Connotation.Warning | Connotation.Info>;
+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>;
+declare type BadgeDensity = Extract<Density, Density.Condensed | Density.Normal | Density.Extended>;
 export declare class Badge extends FoundationElement {
     connotation?: BadgeConnotation;
     shape?: BadgeShape;
     appearance?: BadgeAppearance;
-    size?: BadgeSize;
-    text: string;
+    density?: BadgeDensity;
+    text?: string;
 }
-export interface Badge extends PrefixOrSuffix {
+export interface Badge extends AffixIconWithTrailing {
 }
 export {};

package/lib/badge/index.d.ts

@@ -1,3 +1,3 @@
 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 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>>;

package/lib/banner/banner.d.ts

@@ -0,0 +1,20 @@
+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 class Banner extends FoundationElement {
+    #private;
+    actionHref: string | undefined;
+    actionText: string | undefined;
+    removable: boolean;
+    ariaLive: any;
+    role: string | undefined;
+    text: string | undefined;
+    connotation: BannerConnotation | undefined;
+    get conditionedIcon(): string;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    remove(): void;
+}
+export interface Banner extends AffixIcon {
+}

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

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

package/lib/banner/index.d.ts

@@ -0,0 +1,3 @@
+import '../button';
+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>>;

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-item/breadcrumb-item.d.ts

@@ -1,5 +1,5 @@
 import { BreadcrumbItem as FastBreadcrumbItem } from '@microsoft/fast-foundation';
 export declare class BreadcrumbItem extends FastBreadcrumbItem {
-    text: string;
+    text?: string;
     constructor();
 }

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

@@ -1,5 +1,4 @@
 import type { ViewTemplate } from '@microsoft/fast-element';
 import type { ElementDefinitionContext, FoundationElementDefinition } from '@microsoft/fast-foundation';
 import type { BreadcrumbItem } from './breadcrumb-item';
-import '../icon';
 export declare const BreadcrumbItemTemplate: (context: ElementDefinitionContext, definition: FoundationElementDefinition) => ViewTemplate<BreadcrumbItem>;

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

@@ -1,2 +1,4 @@
+import '../icon';
+import '../focus';
 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>>;

package/lib/button/button.d.ts

@@ -1,17 +1,18 @@
 import { Button as FoundationButton } from '@microsoft/fast-foundation';
-import type { Appearance, Connotation, Shape, Size } from '../enums.js';
-import { PrefixOrSuffix } from '../../shared/patterns/affix';
-declare type ButtonConnotation = Extract<Connotation, Connotation.Primary | Connotation.CTA | Connotation.Success | Connotation.Alert>;
-export declare type ButtonAppearance = Extract<Appearance, Appearance.Filled | Appearance.Outlined | Appearance.Soft>;
+import type { Appearance, Connotation, Density, Shape } from '../enums.js';
+import { AffixIconWithTrailing } from '../../shared/patterns/affix';
+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 ButtonDensity = Extract<Density, Density.Condensed | Density.Normal | Density.Extended>;
 export declare class Button extends FoundationButton {
     connotation?: ButtonConnotation;
     shape?: ButtonShape;
     appearance?: ButtonAppearance;
-    size?: ButtonSize;
-    label: string;
+    density?: ButtonDensity;
+    stacked: boolean;
+    label?: string;
 }
-export interface Button extends PrefixOrSuffix {
+export interface Button extends AffixIconWithTrailing {
 }
 export {};

package/lib/button/index.d.ts

@@ -1,21 +1,4 @@
 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>;
+import { type FoundationElementDefinition } from '@microsoft/fast-foundation';
+export declare const vividButton: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<FoundationElementDefinition> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;

package/lib/calendar/calendar.d.ts

@@ -0,0 +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 activateElement;
+    onKeydown({ key }: KeyboardEvent): boolean;
+}

package/lib/calendar/calendar.template.d.ts

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

package/lib/calendar/helpers/calendar.date-functions.d.ts

@@ -0,0 +1,2 @@
+export declare function getValidDateString(date: Date): string;
+export declare function getFirstDateOfTheWeek(date: Date | undefined, startDay: 'sunday' | 'monday'): Date;

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

@@ -0,0 +1,6 @@
+import type { Calendar } from '../calendar';
+export interface CalendarEventContext {
+    day?: number;
+    hour?: number;
+}
+export declare const getEventContext: (this: Calendar, e: KeyboardEvent | MouseEvent) => CalendarEventContext | null;

package/lib/calendar/helpers/calendar.keyboard-interactions.d.ts

@@ -0,0 +1,9 @@
+import type { Calendar } from '../calendar';
+export declare const ARROW_UP = "ArrowUp";
+export declare const ARROW_RIGHT = "ArrowRight";
+export declare const ARROW_DOWN = "ArrowDown";
+export declare const ARROW_LEFT = "ArrowLeft";
+export declare type PredefindKeys = typeof ARROW_UP | typeof ARROW_RIGHT | typeof ARROW_DOWN | typeof ARROW_LEFT;
+export declare function isCellOrHeader(el: unknown): el is HTMLElement;
+export declare function getNextFocusableGridElement(this: Calendar, key: PredefindKeys, activeElement: HTMLElement): Element | null | void;
+export declare function getHeaderDescendantGridCell(this: Calendar, key: PredefindKeys, activeElement: HTMLElement): Element | null | undefined;

package/lib/calendar/index.d.ts

@@ -0,0 +1,2 @@
+import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
+export declare const vividCalendar: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<FoundationElementDefinition> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;

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

@@ -0,0 +1,14 @@
+import { FoundationElement } from '@microsoft/fast-foundation';
+import type { Appearance, Connotation } from '../enums';
+declare type CalendarEventConnotation = Extract<Connotation, Connotation.Accent | Connotation.CTA | Connotation.Success | Connotation.Alert | Connotation.Warning | Connotation.Info | Connotation.Announcement>;
+declare type CalendarEventAppearance = Extract<Appearance, Appearance.Filled | Appearance.Duotone | Appearance.Subtle>;
+export declare class CalendarEvent extends FoundationElement {
+    heading?: string;
+    description?: string;
+    connotation?: CalendarEventConnotation;
+    appearance?: CalendarEventAppearance;
+    overlapCount?: number;
+    start?: number;
+    duration?: number;
+}
+export {};

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

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

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

@@ -0,0 +1,2 @@
+import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
+export declare const vividCalendarEvent: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<FoundationElementDefinition> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;

package/lib/card/card.d.ts

@@ -0,0 +1,10 @@
+import { FoundationElement } from '@microsoft/fast-foundation';
+export declare class Card extends FoundationElement {
+    heading?: string;
+    subheading?: string;
+    text?: string;
+    icon?: string;
+    elevation?: 0 | 2 | 4 | 8 | 12 | 16 | 24;
+    graphicSlottedContent?: HTMLElement[];
+    hasMetaSlottedContent?: HTMLElement[];
+}

package/lib/card/card.template.d.ts

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

package/lib/card/index.d.ts

@@ -0,0 +1,4 @@
+import '../elevation';
+import '../icon';
+import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
+export declare const vividCard: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<FoundationElementDefinition> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;

package/lib/checkbox/checkbox.d.ts

@@ -0,0 +1,5 @@
+import { Checkbox as FastCheckbox } from '@microsoft/fast-foundation';
+export declare const keySpace: ' ';
+export declare class Checkbox extends FastCheckbox {
+    label?: string;
+}

package/lib/checkbox/checkbox.template.d.ts

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

package/lib/checkbox/index.d.ts

@@ -0,0 +1,4 @@
+import '../icon';
+import '../focus';
+import type { CheckboxOptions } from '@microsoft/fast-foundation';
+export declare const vividCheckbox: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<CheckboxOptions> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<CheckboxOptions, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;

package/lib/components.d.ts

@@ -1,9 +1,27 @@
-export * from './text-anchor';
+export * from './accordion';
+export * from './accordion-item';
+export * from './action-group';
 export * from './badge';
+export * from './banner';
+export * from './breadcrumb';
+export * from './breadcrumb-item';
 export * from './button';
-export * from './focus';
+export * from './calendar';
+export * from './calendar-event';
+export * from './card';
+export * from './elevation';
+export * from './fab';
 export * from './icon';
 export * from './layout';
-export * from './elevation';
-export * from './breadcrumb-item';
-export * from './breadcrumb';
+export * from './note';
+export * from './popup';
+export * from './progress';
+export * from './progress-ring';
+export * from './side-drawer';
+export * from './sidenav';
+export * from './sidenav-item';
+export * from './text';
+export * from './text-field';
+export * from './tooltip';
+export * from './checkbox';
+export * from './header';

package/lib/elevation/elevation.d.ts

@@ -1,4 +1,5 @@
 import { FoundationElement } from '@microsoft/fast-foundation';
 export declare class Elevation extends FoundationElement {
-    dp: number;
+    dp?: 0 | 2 | 4 | 8 | 12 | 16 | 24;
+    noShadow?: boolean;
 }

package/lib/elevation/index.d.ts

@@ -1,2 +1,2 @@
 import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
-export declare const VIVIDElevation: (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 vividElevation: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<FoundationElementDefinition> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;