@vonage/vivid 3.0.0-next.2 → 3.0.0-next.22

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

@@ -1,4 +1,7 @@
 import { Anchor } from '@microsoft/fast-foundation';
+import { AffixIcon } from '../../shared/patterns/affix';
 export declare class TextAnchor extends Anchor {
-    text: string;
+    text?: string;
+}
+export interface TextAnchor extends AffixIcon {
 }

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

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

@@ -0,0 +1,21 @@
+import { TextField as FoundationTextfield } from '@microsoft/fast-foundation';
+import type { Appearance, Density, Shape } from '../enums';
+import { AffixIcon } from '../../shared/patterns';
+declare type TextFieldDensity = Extract<Density, Density.Normal | Density.Extended>;
+declare type TextFieldAppearance = Extract<Appearance, Appearance.Outlined | Appearance.Ghost>;
+declare type TextFieldShape = Extract<Shape, Shape.Rounded | Shape.Pill>;
+export declare class TextField extends FoundationTextfield {
+    label?: string;
+    helperText?: string;
+    charCount: boolean;
+    density?: TextFieldDensity;
+    appearance?: TextFieldAppearance;
+    shape?: TextFieldShape;
+    userValid: boolean;
+    autoComplete?: string;
+    get errorValidationMessage(): string;
+    validate(): void;
+}
+export interface TextField extends AffixIcon {
+}
+export {};

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

@@ -0,0 +1,5 @@
+import type { ViewTemplate } from '@microsoft/fast-element';
+import type { ElementDefinitionContext, FoundationElementDefinition } from '@microsoft/fast-foundation';
+import '../icon/index';
+import type { TextField } from './text-field';
+export declare const TextfieldTemplate: (context: ElementDefinitionContext, definition: FoundationElementDefinition) => ViewTemplate<TextField>;

package/lib/tooltip/index.d.ts

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

@@ -0,0 +1,8 @@
+import { FoundationElement } from '@microsoft/fast-foundation';
+import type { Placement } from '@floating-ui/dom';
+export declare class Tooltip extends FoundationElement {
+    text?: string;
+    open: boolean;
+    corner?: Placement;
+    anchor?: string;
+}

package/lib/tooltip/tooltip.template.d.ts

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

package/note/index.js

@@ -0,0 +1,68 @@
+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 { b as AffixIcon } from '../shared/affix.js';
+import '../shared/focus.js';
+import { a as applyMixins } from '../shared/apply-mixins.js';
+import '../shared/web.dom-collections.iterator.js';
+import '../icon/index.js';
+import { C as Connotation } from '../shared/enums.js';
+import { w as when } from '../shared/when.js';
+import { c as classNames } from '../shared/class-names.js';
+import '../shared/icon.js';
+import '../shared/export.js';
+import '../shared/iterators.js';
+import '../shared/to-string.js';
+import '../shared/_has.js';
+import '../shared/object-keys.js';
+
+var css_248z = "/*\n  Do not edit directly\n  Generated on Wed, 27 Apr 2022 11:58:36 GMT\n*/\n.base {\n  display: flex;\n  align-items: stretch;\n  padding: 20px;\n  border-left: 8px solid var(--_connotation-color-primary);\n  background-color: var(--vvd-color-canvas);\n  border-radius: 6px;\n  box-shadow: inset 0 1px 0 0 var(--vvd-color-neutral-40), inset -1px 0 0 0 var(--vvd-color-neutral-40), inset 0 -1px 0 0 var(--vvd-color-neutral-40);\n  color: var(--vvd-color-on-canvas);\n}\n.base.connotation-success {\n  --_connotation-color-primary: var(--vvd-color-success);\n}\n.base.connotation-info {\n  --_connotation-color-primary: var(--vvd-color-info);\n}\n.base.connotation-alert {\n  --_connotation-color-primary: var(--vvd-color-alert);\n}\n.base.connotation-warning {\n  --_connotation-color-primary: var(--vvd-color-warning);\n}\n.base:not(.connotation-success, .connotation-info, .connotation-alert, .connotation-warning) {\n  --_connotation-color-primary: var(--vvd-color-announcement);\n}\n@supports (contain: content) {\n  .base {\n    contain: content;\n  }\n}\n@supports not (contain: content) {\n  .base {\n    overflow: hidden;\n  }\n}\n\n.icon {\n  align-self: flex-start;\n  font-size: 24px;\n  margin-inline-end: 16px;\n}\n\n.text {\n  display: flex;\n  min-height: 24px;\n  flex: 1;\n  flex-direction: column;\n  justify-content: center;\n  gap: 4px;\n  text-align: start;\n}\n.text .heading {\n  font: 600 ultra-condensed 14px / 20px SpeziaWebVariable;\n  letter-spacing: 0px;\n  text-decoration: none;\n  text-transform: none;\n}\n.text .message {\n  font: 400 ultra-condensed 14px / 20px SpeziaWebVariable;\n  letter-spacing: 0px;\n  text-decoration: none;\n  text-transform: none;\n}";
+styleInject(css_248z);
+
+class Note extends FoundationElement {}
+
+__decorate([attr, __metadata("design:type", String)], Note.prototype, "heading", void 0);
+
+__decorate([attr, __metadata("design:type", String)], Note.prototype, "connotation", void 0);
+
+applyMixins(Note, AffixIcon);
+
+let _ = t => t,
+    _t,
+    _t2,
+    _t3;
+const connotationIconMap = new Map([[Connotation.Info, 'info-solid'], [Connotation.Announcement, 'megaphone-solid'], [Connotation.Success, 'check-circle-solid'], [Connotation.Warning, 'warning-solid'], [Connotation.Alert, 'error-solid']]);
+
+const getClasses = ({
+  connotation
+}) => classNames('base', `connotation-${connotation}`);
+
+function getHeaderTemplate() {
+  return html(_t || (_t = _`<div class="heading">${0}</div>`), x => x.heading);
+}
+
+function getIconType(note) {
+  return note.icon ? note.icon : note.connotation ? connotationIconMap.get(note.connotation) : 'megaphone-solid';
+}
+
+function getIconTemplate() {
+  return html(_t2 || (_t2 = _`<vwc-icon class="icon" type="${0}"></vwc-icon>`), getIconType);
+}
+
+const NoteTemplate = () => html(_t3 || (_t3 = _`
+    <div class="${0}">
+      ${0}
+			<div class="text">
+	        ${0}
+			    <slot class="message"></slot>
+			</div>
+    </div>
+`), getClasses, getIconTemplate(), when(x => x.heading, getHeaderTemplate()));
+
+const vividNote = Note.compose({
+  baseName: 'note',
+  template: NoteTemplate,
+  styles: css_248z
+});
+designSystem.register(vividNote());
+
+export { vividNote };

package/package.json

@@ -1,14 +1,45 @@
 {
   "name": "@vonage/vivid",
-  "version": "3.0.0-next.2",
-  "main": "./index.umd.js",
+  "version": "3.0.0-next.22",
+  "type": "module",
   "module": "./index.esm.js",
+  "main": "./index.js",
+  "exports": {
+    "./accordion": "./accordion",
+    "./accordion-item": "./accordion-item",
+    "./action-group": "./action-group",
+    "./badge": "./badge",
+    "./banner": "./banner",
+    "./breadcrumb": "./breadcrumb",
+    "./breadcrumb-item": "./breadcrumb-item",
+    "./button": "./button",
+    "./calendar": "./calendar",
+    "./calendar-event": "./calendar-event",
+    "./card": "./card",
+    "./elevation": "./elevation",
+    "./fab": "./fab",
+    "./icon": "./icon",
+    "./layout": "./layout",
+    "./note": "./note",
+    "./popup": "./popup",
+    "./progress": "./progress",
+    "./progress-ring": "./progress-ring",
+    "./side-drawer": "./side-drawer",
+    "./sidenav-item": "./sidenav-item",
+    "./text": "./text",
+    "./text-field": "./text-field",
+    "./tooltip": "./tooltip"
+  },
   "typings": "./index.d.ts",
   "dependencies": {
-    "@microsoft/fast-element": "^1.7.0",
-    "@microsoft/fast-foundation": "^2.33.3",
-    "@microsoft/fast-web-utilities": "^5.1.0",
-    "ramda": "^0.27.2"
+    "@microsoft/fast-element": "^1.10.2",
+    "@microsoft/fast-foundation": "^2.46.9",
+    "@microsoft/fast-web-utilities": "^5.4.1",
+    "ramda": "^0.27.2",
+    "@floating-ui/dom": "^0.5.2",
+    "blocking-elements": "^0.1.1",
+    "wicg-inert": "^3.1.2",
+    "babel-polyfill": "^6.26.0"
   },
   "peerDependencies": {}
 }