@vonage/vivid 2.30.0 → 3.0.0-next.12

package/elevation/index.js

@@ -0,0 +1,31 @@
+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';
+
+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 };

package/focus/index.js

@@ -0,0 +1,3 @@
+import '../shared/index.js';
+export { V as VIVIDFocus } from '../shared/index2.js';
+import '../shared/style-inject.es.js';

package/icon/index.js

@@ -0,0 +1,38 @@
+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 '../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-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 };

package/index.d.ts

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

package/index.js

@@ -1,63 +1,33 @@
-export { VWCIconButtonToggle as VWCIconButtonToggle } from "@vonage/vwc-icon-button-toggle";
-export { VWCNotchedOutline as VWCNotchedOutline } from "@vonage/vwc-notched-outline";
-export { VWCSchemeSelect as VWCSchemeSelect } from "@vonage/vwc-scheme-select";
-export { VWCTopAppBarFixed as VWCTopAppBarFixed } from "@vonage/vwc-top-app-bar-fixed";
-export { VWCAudio as VWCAudio } from "@vonage/vwc-audio";
-export { VWCButtonToggleGroup as VWCButtonToggleGroup } from "@vonage/vwc-button-toggle-group";
-export { VWCCard as VWCCard } from "@vonage/vwc-card";
-export { VWCCheckbox as VWCCheckbox } from "@vonage/vwc-checkbox";
-export { VWCCircularProgress as VWCCircularProgress } from "@vonage/vwc-circular-progress";
-export { VWCDatepicker as VWCDatepicker } from "@vonage/vwc-datepicker";
-export { VWCDialog as VWCDialog } from "@vonage/vwc-dialog";
-export { VWCDropdown as VWCDropdown } from "@vonage/vwc-dropdown";
-export { VWCElevation as VWCElevation } from "@vonage/vwc-elevation";
-export { VWCFab as VWCFab } from "@vonage/vwc-fab";
-export { VWCFilePicker as VWCFilePicker } from "@vonage/vwc-file-picker";
-export { VWCFormfield as VWCFormfield } from "@vonage/vwc-formfield";
-export { VWCHelperMessage as VWCHelperMessage } from "@vonage/vwc-helper-message";
-export { VWCIconButton as VWCIconButton } from "@vonage/vwc-icon-button";
-export { VWCIcon as VWCIcon } from "@vonage/vwc-icon";
-export { VWCKeypad as VWCKeypad } from "@vonage/vwc-keypad";
-export { Layout as VWCLayout } from "@vonage/vwc-layout";
-export { VWCLinearProgress as VWCLinearProgress } from "@vonage/vwc-linear-progress";
-export { VWCMenu as VWCMenu } from "@vonage/vwc-menu";
-export { VWCNote as VWCNote } from "@vonage/vwc-note";
-export { VWCPagination as VWCPagination } from "@vonage/vwc-pagination";
-export { VWCRadio as VWCRadio } from "@vonage/vwc-radio";
-export { VWCSlider as VWCSlider } from "@vonage/vwc-slider";
-export { VWCSnackbar as VWCSnackbar } from "@vonage/vwc-snackbar";
-export { VWCSurface as VWCSurface } from "@vonage/vwc-surface";
-export { VWCSwitch as VWCSwitch } from "@vonage/vwc-switch";
-export { VWCTextArea as VWCTextarea } from "@vonage/vwc-textarea";
-export { VWCThemeSwitch as VWCThemeSwitch } from "@vonage/vwc-theme-switch";
-export { VWCTopAppBar as VWCTopAppBar } from "@vonage/vwc-top-app-bar";
-export { VWCAccordion as VWCAccordion } from "@vonage/vwc-accordion";
-export { VWCBadge as VWCBadge } from "@vonage/vwc-badge";
-export { VWCDrawer as VWCDrawer } from "@vonage/vwc-drawer";
-export { VWCEmptyState as VWCEmptyState } from "@vonage/vwc-empty-state";
-export { VWCPopup as VWCPopup } from "@vonage/vwc-popup";
-export { VWCSelect as VWCSelect } from "@vonage/vwc-select";
-export { VWCSideDrawer as VWCSideDrawer } from "@vonage/vwc-side-drawer";
-export { VWCTag as VWCTag } from "@vonage/vwc-tags/vwc-tag";
-export { VWCText as VWCText } from "@vonage/vwc-text";
-export { VwcTooltip as VWCTooltip } from "@vonage/vwc-tooltip";
-export { VWCBanner as VWCBanner } from "@vonage/vwc-banner";
-export { VWCButton as VWCButton } from "@vonage/vwc-button";
-export { VWCExpansionPanel as VWCExpansionPanel } from "@vonage/vwc-expansion-panel";
-export { VwcMediaController as VWCMediaController } from "@vonage/vwc-media-controller";
-export { VWCScrubBar as VWCScrubBar } from "@vonage/vwc-media-controller/vwc-scrub-bar";
-export { VWCCarouselItem as VWCCarouselItem } from "@vonage/vwc-carousel/vwc-carousel-item";
-export { VWCCarousel as VWCCarousel } from "@vonage/vwc-carousel";
-export { VWCTabBar as VWCTabBar } from "@vonage/vwc-tab-bar";
-export { VWCTab as VWCTab } from "@vonage/vwc-tab-bar/vwc-tab";
-export { GRID_COMPONENT as VWCDataGrid } from "@vonage/vwc-data-grid";
-export { VWCTextField as VWCTextfield } from "@vonage/vwc-textfield";
-export { VWCCalendarEvent as VWCCalendarEvent } from "@vonage/vwc-calendar/vwc-calendar-event";
-export { VWCCalendar as VWCCalendar } from "@vonage/vwc-calendar";
-export { VWCCheckListItem as VWCCheckListItem } from "@vonage/vwc-list/vwc-check-list-item";
-export { VWCListExpansionPanel as VWCListExpansionPanel } from "@vonage/vwc-list/vwc-list-expansion-panel";
-export { VWCListItem as VWCListItem } from "@vonage/vwc-list/vwc-list-item";
-export { VWCList as VWCList } from "@vonage/vwc-list";
-export { VWCRadioListItem as VWCRadioListItem } from "@vonage/vwc-list/vwc-radio-list-item";
-export { default as VVDCore } from "@vonage/vvd-core";
-export { default as VVDContext } from "@vonage/vvd-context";
+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';
+import './shared/affix.js';
+import './shared/web.dom-collections.iterator.js';
+import './shared/object-set-prototype-of.js';
+import './shared/icon.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/when.js';
+import './shared/breadcrumb-item.js';
+import './shared/slotted.js';
+import './shared/es.object.assign.js';

package/layout/index.js

@@ -0,0 +1,53 @@
+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';
+
+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 };

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

package/lib/badge/badge.d.ts

@@ -0,0 +1,17 @@
+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>;
+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 {
+}
+export {};

package/lib/badge/badge.template.d.ts

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

package/lib/badge/index.d.ts

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

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,6 @@
+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/index.d.ts

@@ -0,0 +1,2 @@
+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.d.ts

@@ -0,0 +1,3 @@
+import { Breadcrumb as FoundationElement } from '@microsoft/fast-foundation';
+export declare class Breadcrumb extends FoundationElement {
+}

package/lib/breadcrumb/index.d.ts

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

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

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

package/lib/breadcrumb-item/breadcrumb-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 { BreadcrumbItem } from './breadcrumb-item';
+export declare const BreadcrumbItemTemplate: (context: ElementDefinitionContext, definition: FoundationElementDefinition) => ViewTemplate<BreadcrumbItem>;

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

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

package/lib/button/button.d.ts

@@ -0,0 +1,17 @@
+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>;
+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>;
+export declare class Button extends FoundationButton {
+    connotation?: ButtonConnotation;
+    shape?: ButtonShape;
+    appearance?: ButtonAppearance;
+    size?: ButtonSize;
+    label?: string;
+}
+export interface Button extends AffixIconWithTrailing {
+}
+export {};

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

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

package/lib/button/index.d.ts

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

package/lib/calendar/calendar.d.ts

@@ -0,0 +1,11 @@
+import { FoundationElement } from '@microsoft/fast-foundation';
+export declare class Calendar extends FoundationElement {
+    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 arrowKeysInteractions;
+    private moveTo;
+    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,3 @@
+import '../elevation';
+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/components.d.ts

@@ -0,0 +1,16 @@
+export * from './text-anchor';
+export * from './badge';
+export * from './button';
+export * from './focus';
+export * from './icon';
+export * from './layout';
+export * from './elevation';
+export * from './breadcrumb-item';
+export * from './breadcrumb';
+export * from './side-drawer';
+export * from './calendar';
+export * from './popup';
+export * from './tooltip';
+export * from './banner';
+export * from './accordion-item';
+export * from './accordion';

package/lib/elevation/elevation.d.ts

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

package/lib/elevation/elevation.template.d.ts

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

package/lib/elevation/index.d.ts

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

package/lib/enums.d.ts

@@ -0,0 +1,46 @@
+export declare enum Connotation {
+    Primary = "primary",
+    CTA = "cta",
+    Success = "success",
+    Alert = "alert",
+    Warning = "warning",
+    Info = "info",
+    Announcement = "announcement"
+}
+export declare enum ConnotationDecorative {
+    Pacific = "pacific"
+}
+export declare enum Shape {
+    Rounded = "rounded",
+    Pill = "pill",
+    Circled = "circled",
+    Sharp = "sharp"
+}
+export declare enum Appearance {
+    Text = "text",
+    Filled = "filled",
+    Outlined = "outlined",
+    Duotone = "duotone",
+    Subtle = "subtle",
+    Ghost = "ghost"
+}
+export declare enum Size {
+    BaseSmall = "base-small",
+    Base = "base",
+    BaseLarge = "base-large"
+}
+export declare enum Position {
+    Top = "TOP",
+    Bottom = "BOTTOM",
+    Start = "START",
+    Center = "CENTER",
+    End = "END"
+}
+export declare enum Role {
+    Status = "status",
+    Alert = "alert"
+}
+export declare enum AriaLive {
+    Polite = "polite",
+    Assertive = "assertive"
+}

package/lib/focus/focus.d.ts

@@ -0,0 +1,3 @@
+import { FoundationElement } from '@microsoft/fast-foundation';
+export declare class Focus extends FoundationElement {
+}

package/lib/focus/focus.template.d.ts

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

package/lib/focus/index.d.ts

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

@@ -0,0 +1,11 @@
+import { FoundationElement } from '@microsoft/fast-foundation';
+import type { Connotation, Size } from '../enums';
+declare type IconConnotation = Extract<Connotation, Connotation.Primary | Connotation.CTA | Connotation.Announcement | Connotation.Success | Connotation.Alert | Connotation.Info>;
+export declare class Icon extends FoundationElement {
+    connotation?: IconConnotation;
+    size?: Size;
+    svg?: string;
+    type?: string;
+    typeChanged(): Promise<void>;
+}
+export {};

package/lib/icon/icon.placeholder.d.ts

@@ -0,0 +1 @@
+export declare const PLACEHOLDER_ICON = "<svg width=\"80%\" height=\"80%\" viewBox=\"0 0 64 64\">\n    <g>\n        <g stroke-width=\"6\" stroke-linecap=\"round\" fill=\"none\">\n            <path stroke=\"currentColor\" d=\"M4,32 c0,15,12,28,28,28c8,0,16-4,21-9\">\n            </path>\n            <path d=\"M60,32 C60,16,47.464,4,32,4S4,16,4,32\">\n            </path>\n            <animateTransform values=\"0,32,32;360,32,32\" attributeName=\"transform\" type=\"rotate\" repeatCount=\"indefinite\" dur=\"750ms\">\n            </animateTransform>\n        </g>\n    </g>\n</svg>";

package/lib/icon/icon.template.d.ts

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

package/lib/icon/index.d.ts

@@ -0,0 +1,2 @@
+import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
+export declare const vividIcon: (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/layout/index.d.ts

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