@vonage/vivid 5.4.0 → 5.6.0

package/tooltip/definition.cjs

@@ -9,8 +9,6 @@ const anchored = require('../unbundled/anchored.cjs');
 const fastWebUtilities = require('@microsoft/fast-web-utilities');
 const index = require('../unbundled/index.cjs');
 
-const styles = ":host :host{display:var(--_popup-display, inline)}:host :host([slotted-anchor]){--_popup-display: contents}.control{pointer-events:none}.tooltip{width:var(--tooltip-inline-size, auto);box-sizing:border-box;padding:8px 12px;color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base-bold);max-inline-size:var(--tooltip-max-inline-size, 30ch)}";
-
 var __defProp = Object.defineProperty;
 var __decorateClass = (decorators, target, key, kind) => {
   var result = void 0 ;
@@ -33,7 +31,10 @@ class Tooltip extends anchored.Anchored(vividElement.VividElement) {
       this.#updateAnchorExpanded();
     };
     this.#closeOnEscape = (e) => {
-      if (e.key === "Escape") this.#hide();
+      /* v8 ignore else -- @preserve */
+      if (e.key === "Escape") {
+        this.#hide();
+      }
     };
   }
   connectedCallback() {
@@ -99,6 +100,8 @@ __decorateClass([
   fastElement.attr({ mode: "boolean" })
 ], Tooltip.prototype, "open");
 
+const styles = ":host :host{display:var(--_popup-display, inline)}:host :host([slotted-anchor]){--_popup-display: contents}.control{pointer-events:none}.tooltip{width:var(--tooltip-inline-size, auto);box-sizing:border-box;padding:8px 12px;color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base-bold);max-inline-size:var(--tooltip-max-inline-size, 30ch)}";
+
 const getClasses = ({ open }) => fastWebUtilities.classNames("control", ["open", Boolean(open)]);
 const TooltipTemplate = (context) => {
   const popupTag = context.tagFor(popup_definition.Popup);

package/tooltip/definition.js

@@ -5,8 +5,6 @@ import { A as Anchored, a as anchorSlotTemplateFactory } from '../unbundled/anch
 import { classNames } from '@microsoft/fast-web-utilities';
 import { h as handleEscapeKeyAndStopPropogation } from '../unbundled/index.js';
 
-const styles = ":host :host{display:var(--_popup-display, inline)}:host :host([slotted-anchor]){--_popup-display: contents}.control{pointer-events:none}.tooltip{width:var(--tooltip-inline-size, auto);box-sizing:border-box;padding:8px 12px;color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base-bold);max-inline-size:var(--tooltip-max-inline-size, 30ch)}";
-
 var __defProp = Object.defineProperty;
 var __decorateClass = (decorators, target, key, kind) => {
   var result = void 0 ;
@@ -29,7 +27,10 @@ class Tooltip extends Anchored(VividElement) {
       this.#updateAnchorExpanded();
     };
     this.#closeOnEscape = (e) => {
-      if (e.key === "Escape") this.#hide();
+      /* v8 ignore else -- @preserve */
+      if (e.key === "Escape") {
+        this.#hide();
+      }
     };
   }
   connectedCallback() {
@@ -95,6 +96,8 @@ __decorateClass([
   attr({ mode: "boolean" })
 ], Tooltip.prototype, "open");
 
+const styles = ":host :host{display:var(--_popup-display, inline)}:host :host([slotted-anchor]){--_popup-display: contents}.control{pointer-events:none}.tooltip{width:var(--tooltip-inline-size, auto);box-sizing:border-box;padding:8px 12px;color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base-bold);max-inline-size:var(--tooltip-max-inline-size, 30ch)}";
+
 const getClasses = ({ open }) => classNames("control", ["open", Boolean(open)]);
 const TooltipTemplate = (context) => {
   const popupTag = context.tagFor(Popup);

package/tooltip/index.cjs

@@ -1 +1 @@
-"use strict";const i=require("../bundled/definition18.cjs");i.registerTooltip();
+"use strict";const i=require("../bundled/definition11.cjs");i.registerTooltip();

package/tooltip/index.js

@@ -1,2 +1,2 @@
-import { r } from "../bundled/definition18.js";
+import { r } from "../bundled/definition11.js";
 r();

package/tree-view/definition.cjs

@@ -53,11 +53,13 @@ class TreeView extends hostSemantics.HostSemantics(vividElement.VividElement) {
     this.handleFocus = (e) => {
       if (this.slottedTreeItems.length > 0) {
         if (e.target === this) {
+          /* v8 ignore else -- @preserve */
           if (this.currentFocused !== null) {
             treeItem_definition.TreeItem.focusItem(this.currentFocused);
           }
           return;
         }
+        /* v8 ignore else -- @preserve */
         if (this.contains(e.target)) {
           this.setAttribute("tabindex", "-1");
           this.currentFocused = e.target;
@@ -83,22 +85,29 @@ class TreeView extends hostSemantics.HostSemantics(vividElement.VividElement) {
       if (this.slottedTreeItems.length < 1) {
         return true;
       }
+      /* v8 ignore else -- @preserve */
       if (!e.defaultPrevented) {
         const treeItems = this.getVisibleNodes();
         switch (e.key) {
-          case fastWebUtilities.keyHome:
+          case fastWebUtilities.keyHome: {
+            /* v8 ignore else -- @preserve */
             if (treeItems.length) {
               treeItem_definition.TreeItem.focusItem(treeItems[0]);
             }
             return;
-          case fastWebUtilities.keyEnd:
+          }
+          case fastWebUtilities.keyEnd: {
+            /* v8 ignore else -- @preserve */
             if (treeItems.length) {
               treeItem_definition.TreeItem.focusItem(treeItems[treeItems.length - 1]);
             }
             return;
-          case fastWebUtilities.keyArrowLeft:
+          }
+          case fastWebUtilities.keyArrowLeft: {
+            /* v8 ignore else -- @preserve */
             if (e.target && this.isFocusableElement(e.target)) {
               const item = e.target;
+              /* v8 ignore else -- @preserve */
               if (item instanceof treeItem_definition.TreeItem && item.childItemLength() > 0 && item.expanded) {
                 item.expanded = false;
               } else if (item instanceof treeItem_definition.TreeItem && item.parentElement instanceof treeItem_definition.TreeItem) {
@@ -106,9 +115,12 @@ class TreeView extends hostSemantics.HostSemantics(vividElement.VividElement) {
               }
             }
             return false;
-          case fastWebUtilities.keyArrowRight:
+          }
+          case fastWebUtilities.keyArrowRight: {
+            /* v8 ignore else -- @preserve */
             if (e.target && this.isFocusableElement(e.target)) {
               const item = e.target;
+              /* v8 ignore else -- @preserve */
               if (item instanceof treeItem_definition.TreeItem && item.childItemLength() > 0 && !item.expanded) {
                 item.expanded = true;
               } else if (item instanceof treeItem_definition.TreeItem && item.childItemLength() > 0) {
@@ -116,16 +128,21 @@ class TreeView extends hostSemantics.HostSemantics(vividElement.VividElement) {
               }
             }
             return;
-          case fastWebUtilities.keyArrowDown:
+          }
+          case fastWebUtilities.keyArrowDown: {
+            /* v8 ignore else -- @preserve */
             if (e.target && this.isFocusableElement(e.target)) {
               this.focusNextNode(1, e.target);
             }
             return;
-          case fastWebUtilities.keyArrowUp:
+          }
+          case fastWebUtilities.keyArrowUp: {
+            /* v8 ignore else -- @preserve */
             if (e.target && this.isFocusableElement(e.target)) {
               this.focusNextNode(-1, e.target);
             }
             return;
+          }
           case fastWebUtilities.keyEnter:
             this.handleClick(e);
             return;
@@ -140,11 +157,13 @@ class TreeView extends hostSemantics.HostSemantics(vividElement.VividElement) {
      *  @internal
      */
     this.handleSelectedChange = (e) => {
+      /* v8 ignore else -- @preserve */
       if (!e.defaultPrevented) {
         if (!(e.target instanceof Element) || !treeItem_definition.isTreeItemElement(e.target)) {
           return true;
         }
         const item = e.target;
+        /* v8 ignore else -- @preserve */
         if (item.selected) {
           if (this.currentSelected && this.currentSelected !== item) {
             this.currentSelected.selected = false;
@@ -168,6 +187,7 @@ class TreeView extends hostSemantics.HostSemantics(vividElement.VividElement) {
       this.nested = this.checkForNestedItems();
       const treeItems = this.getVisibleNodes();
       treeItems.forEach((node) => {
+        /* v8 ignore else -- @preserve */
         if (treeItem_definition.isTreeItemElement(node)) {
           node.nested = this.nested;
         }
@@ -217,8 +237,10 @@ class TreeView extends hostSemantics.HostSemantics(vividElement.VividElement) {
    */
   focusNextNode(delta, item) {
     const visibleNodes = this.getVisibleNodes();
+    /* v8 ignore else -- @preserve */
     if (visibleNodes) {
       const focusItem = visibleNodes[visibleNodes.indexOf(item) + delta];
+      /* v8 ignore else -- @preserve */
       if (fastWebUtilities.isHTMLElement(focusItem)) {
         treeItem_definition.TreeItem.focusItem(focusItem);
       }

package/tree-view/definition.js

@@ -49,11 +49,13 @@ class TreeView extends HostSemantics(VividElement) {
     this.handleFocus = (e) => {
       if (this.slottedTreeItems.length > 0) {
         if (e.target === this) {
+          /* v8 ignore else -- @preserve */
           if (this.currentFocused !== null) {
             TreeItem.focusItem(this.currentFocused);
           }
           return;
         }
+        /* v8 ignore else -- @preserve */
         if (this.contains(e.target)) {
           this.setAttribute("tabindex", "-1");
           this.currentFocused = e.target;
@@ -79,22 +81,29 @@ class TreeView extends HostSemantics(VividElement) {
       if (this.slottedTreeItems.length < 1) {
         return true;
       }
+      /* v8 ignore else -- @preserve */
       if (!e.defaultPrevented) {
         const treeItems = this.getVisibleNodes();
         switch (e.key) {
-          case keyHome:
+          case keyHome: {
+            /* v8 ignore else -- @preserve */
             if (treeItems.length) {
               TreeItem.focusItem(treeItems[0]);
             }
             return;
-          case keyEnd:
+          }
+          case keyEnd: {
+            /* v8 ignore else -- @preserve */
             if (treeItems.length) {
               TreeItem.focusItem(treeItems[treeItems.length - 1]);
             }
             return;
-          case keyArrowLeft:
+          }
+          case keyArrowLeft: {
+            /* v8 ignore else -- @preserve */
             if (e.target && this.isFocusableElement(e.target)) {
               const item = e.target;
+              /* v8 ignore else -- @preserve */
               if (item instanceof TreeItem && item.childItemLength() > 0 && item.expanded) {
                 item.expanded = false;
               } else if (item instanceof TreeItem && item.parentElement instanceof TreeItem) {
@@ -102,9 +111,12 @@ class TreeView extends HostSemantics(VividElement) {
               }
             }
             return false;
-          case keyArrowRight:
+          }
+          case keyArrowRight: {
+            /* v8 ignore else -- @preserve */
             if (e.target && this.isFocusableElement(e.target)) {
               const item = e.target;
+              /* v8 ignore else -- @preserve */
               if (item instanceof TreeItem && item.childItemLength() > 0 && !item.expanded) {
                 item.expanded = true;
               } else if (item instanceof TreeItem && item.childItemLength() > 0) {
@@ -112,16 +124,21 @@ class TreeView extends HostSemantics(VividElement) {
               }
             }
             return;
-          case keyArrowDown:
+          }
+          case keyArrowDown: {
+            /* v8 ignore else -- @preserve */
             if (e.target && this.isFocusableElement(e.target)) {
               this.focusNextNode(1, e.target);
             }
             return;
-          case keyArrowUp:
+          }
+          case keyArrowUp: {
+            /* v8 ignore else -- @preserve */
             if (e.target && this.isFocusableElement(e.target)) {
               this.focusNextNode(-1, e.target);
             }
             return;
+          }
           case keyEnter:
             this.handleClick(e);
             return;
@@ -136,11 +153,13 @@ class TreeView extends HostSemantics(VividElement) {
      *  @internal
      */
     this.handleSelectedChange = (e) => {
+      /* v8 ignore else -- @preserve */
       if (!e.defaultPrevented) {
         if (!(e.target instanceof Element) || !isTreeItemElement(e.target)) {
           return true;
         }
         const item = e.target;
+        /* v8 ignore else -- @preserve */
         if (item.selected) {
           if (this.currentSelected && this.currentSelected !== item) {
             this.currentSelected.selected = false;
@@ -164,6 +183,7 @@ class TreeView extends HostSemantics(VividElement) {
       this.nested = this.checkForNestedItems();
       const treeItems = this.getVisibleNodes();
       treeItems.forEach((node) => {
+        /* v8 ignore else -- @preserve */
         if (isTreeItemElement(node)) {
           node.nested = this.nested;
         }
@@ -213,8 +233,10 @@ class TreeView extends HostSemantics(VividElement) {
    */
   focusNextNode(delta, item) {
     const visibleNodes = this.getVisibleNodes();
+    /* v8 ignore else -- @preserve */
     if (visibleNodes) {
       const focusItem = visibleNodes[visibleNodes.indexOf(item) + delta];
+      /* v8 ignore else -- @preserve */
       if (isHTMLElement(focusItem)) {
         TreeItem.focusItem(focusItem);
       }

package/tree-view/index.cjs

@@ -1,4 +1,4 @@
-"use strict";const l=require("../bundled/vivid-element.cjs"),n=require("../bundled/definition22.cjs"),m=require("../bundled/host-semantics.cjs"),c=require("../bundled/key-codes.cjs"),h=require("../bundled/dom.cjs"),f=require("../bundled/ref.cjs"),g=require("../bundled/slotted.cjs"),I=require("../bundled/class-names.cjs"),p=".control{position:relative;display:flex;flex-direction:column;gap:4px}";var b=Object.defineProperty,d=(r,e,t,s)=>{for(var i=void 0,a=r.length-1,u;a>=0;a--)(u=r[a])&&(i=u(e,t,i)||i);return i&&b(e,t,i),i};function T(r,e){return h.isHTMLElement(r)?Array.from(r.querySelectorAll(e)).filter(i=>{if(i.parentElement instanceof n.TreeItem){if(i.parentElement.expanded)return!0}else return!0;return!1}):[]}class o extends m.HostSemantics(l.VividElement){constructor(){super(...arguments),this.currentFocused=null,this.handleFocus=e=>{if(this.slottedTreeItems.length>0){if(e.target===this){this.currentFocused!==null&&n.TreeItem.focusItem(this.currentFocused);return}this.contains(e.target)&&(this.setAttribute("tabindex","-1"),this.currentFocused=e.target)}},this.handleBlur=e=>{e.target instanceof HTMLElement&&(e.relatedTarget===null||!this.contains(e.relatedTarget))&&this.setAttribute("tabindex","0")},this.handleKeyDown=e=>{if(this.slottedTreeItems.length<1)return!0;if(!e.defaultPrevented){const t=this.getVisibleNodes();switch(e.key){case c.keyHome:t.length&&n.TreeItem.focusItem(t[0]);return;case c.keyEnd:t.length&&n.TreeItem.focusItem(t[t.length-1]);return;case c.keyArrowLeft:if(e.target&&this.isFocusableElement(e.target)){const s=e.target;s instanceof n.TreeItem&&s.childItemLength()>0&&s.expanded?s.expanded=!1:s instanceof n.TreeItem&&s.parentElement instanceof n.TreeItem&&n.TreeItem.focusItem(s.parentElement)}return!1;case c.keyArrowRight:if(e.target&&this.isFocusableElement(e.target)){const s=e.target;s instanceof n.TreeItem&&s.childItemLength()>0&&!s.expanded?s.expanded=!0:s instanceof n.TreeItem&&s.childItemLength()>0&&this.focusNextNode(1,e.target)}return;case c.keyArrowDown:e.target&&this.isFocusableElement(e.target)&&this.focusNextNode(1,e.target);return;case c.keyArrowUp:e.target&&this.isFocusableElement(e.target)&&this.focusNextNode(-1,e.target);return;case c.keyEnter:this.handleClick(e);return}}return!0},this.handleSelectedChange=e=>{if(!e.defaultPrevented){if(!(e.target instanceof Element)||!n.isTreeItemElement(e.target))return!0;const t=e.target;t.selected?(this.currentSelected&&this.currentSelected!==t&&(this.currentSelected.selected=!1),this.currentSelected=t):!t.selected&&this.currentSelected===t&&(this.currentSelected=null);return}},this.setItems=()=>{const e=this.treeView.querySelector("[selected]");this.currentSelected=e,(this.currentFocused===null||!this.contains(this.currentFocused))&&(this.currentFocused=this.getValidFocusableItem()),this.nested=this.checkForNestedItems(),this.getVisibleNodes().forEach(s=>{n.isTreeItemElement(s)&&(s.nested=this.nested)})},this.isFocusableElement=e=>n.isTreeItemElement(e),this.isSelectedElement=e=>e.selected}slottedTreeItemsChanged(){this.$fastController.isConnected&&this.setItems()}connectedCallback(){super.connectedCallback(),this.setAttribute("tabindex","0"),l.Updates.enqueue(()=>{this.setItems()})}handleClick(e){if(!e.defaultPrevented){if(!(e.target instanceof Element)||!n.isTreeItemElement(e.target))return!0;const t=e.target;t.disabled||(t.selected=!t.selected);return}}focusNextNode(e,t){const s=this.getVisibleNodes();if(s){const i=s[s.indexOf(t)+e];h.isHTMLElement(i)&&n.TreeItem.focusItem(i)}}getValidFocusableItem(){const e=this.getVisibleNodes();let t=e.findIndex(this.isSelectedElement);return t===-1&&(t=e.findIndex(this.isFocusableElement)),t!==-1?e[t]:null}checkForNestedItems(){return this.slottedTreeItems.some(e=>n.isTreeItemElement(e)&&e.querySelector("[data-vvd-component='tree-item']"))}getVisibleNodes(){return T(this,"[data-vvd-component='tree-item']")}}d([l.attr({attribute:"render-collapsed-nodes"})],o.prototype,"renderCollapsedNodes");d([l.observable],o.prototype,"currentSelected");d([l.observable],o.prototype,"slottedTreeItems");const v=r=>I.classNames("control"),E=l.html` <template
+"use strict";const l=require("../bundled/vivid-element.cjs"),n=require("../bundled/definition22.cjs"),m=require("../bundled/host-semantics.cjs"),c=require("../bundled/key-codes.cjs"),h=require("../bundled/dom.cjs"),f=require("../bundled/ref.cjs"),g=require("../bundled/slotted.cjs"),I=require("../bundled/class-names.cjs"),p=".control{position:relative;display:flex;flex-direction:column;gap:4px}";var b=Object.defineProperty,d=(r,e,t,s)=>{for(var i=void 0,a=r.length-1,u;a>=0;a--)(u=r[a])&&(i=u(e,t,i)||i);return i&&b(e,t,i),i};function T(r,e){return h.isHTMLElement(r)?Array.from(r.querySelectorAll(e)).filter(i=>{if(i.parentElement instanceof n.TreeItem){if(i.parentElement.expanded)return!0}else return!0;return!1}):[]}class o extends m.HostSemantics(l.VividElement){constructor(){super(...arguments),this.currentFocused=null,this.handleFocus=e=>{if(this.slottedTreeItems.length>0){if(e.target===this){/* v8 ignore else -- @preserve */this.currentFocused!==null&&n.TreeItem.focusItem(this.currentFocused);return}/* v8 ignore else -- @preserve */this.contains(e.target)&&(this.setAttribute("tabindex","-1"),this.currentFocused=e.target)}},this.handleBlur=e=>{e.target instanceof HTMLElement&&(e.relatedTarget===null||!this.contains(e.relatedTarget))&&this.setAttribute("tabindex","0")},this.handleKeyDown=e=>{if(this.slottedTreeItems.length<1)return!0;/* v8 ignore else -- @preserve */if(!e.defaultPrevented){const t=this.getVisibleNodes();switch(e.key){case c.keyHome:{/* v8 ignore else -- @preserve */t.length&&n.TreeItem.focusItem(t[0]);return}case c.keyEnd:{/* v8 ignore else -- @preserve */t.length&&n.TreeItem.focusItem(t[t.length-1]);return}case c.keyArrowLeft:{/* v8 ignore else -- @preserve */if(e.target&&this.isFocusableElement(e.target)){const s=e.target;/* v8 ignore else -- @preserve */s instanceof n.TreeItem&&s.childItemLength()>0&&s.expanded?s.expanded=!1:s instanceof n.TreeItem&&s.parentElement instanceof n.TreeItem&&n.TreeItem.focusItem(s.parentElement)}return!1}case c.keyArrowRight:{/* v8 ignore else -- @preserve */if(e.target&&this.isFocusableElement(e.target)){const s=e.target;/* v8 ignore else -- @preserve */s instanceof n.TreeItem&&s.childItemLength()>0&&!s.expanded?s.expanded=!0:s instanceof n.TreeItem&&s.childItemLength()>0&&this.focusNextNode(1,e.target)}return}case c.keyArrowDown:{/* v8 ignore else -- @preserve */e.target&&this.isFocusableElement(e.target)&&this.focusNextNode(1,e.target);return}case c.keyArrowUp:{/* v8 ignore else -- @preserve */e.target&&this.isFocusableElement(e.target)&&this.focusNextNode(-1,e.target);return}case c.keyEnter:this.handleClick(e);return}}return!0},this.handleSelectedChange=e=>{/* v8 ignore else -- @preserve */if(!e.defaultPrevented){if(!(e.target instanceof Element)||!n.isTreeItemElement(e.target))return!0;const t=e.target;/* v8 ignore else -- @preserve */t.selected?(this.currentSelected&&this.currentSelected!==t&&(this.currentSelected.selected=!1),this.currentSelected=t):!t.selected&&this.currentSelected===t&&(this.currentSelected=null);return}},this.setItems=()=>{const e=this.treeView.querySelector("[selected]");this.currentSelected=e,(this.currentFocused===null||!this.contains(this.currentFocused))&&(this.currentFocused=this.getValidFocusableItem()),this.nested=this.checkForNestedItems(),this.getVisibleNodes().forEach(s=>{/* v8 ignore else -- @preserve */n.isTreeItemElement(s)&&(s.nested=this.nested)})},this.isFocusableElement=e=>n.isTreeItemElement(e),this.isSelectedElement=e=>e.selected}slottedTreeItemsChanged(){this.$fastController.isConnected&&this.setItems()}connectedCallback(){super.connectedCallback(),this.setAttribute("tabindex","0"),l.Updates.enqueue(()=>{this.setItems()})}handleClick(e){if(!e.defaultPrevented){if(!(e.target instanceof Element)||!n.isTreeItemElement(e.target))return!0;const t=e.target;t.disabled||(t.selected=!t.selected);return}}focusNextNode(e,t){const s=this.getVisibleNodes();/* v8 ignore else -- @preserve */if(s){const i=s[s.indexOf(t)+e];/* v8 ignore else -- @preserve */h.isHTMLElement(i)&&n.TreeItem.focusItem(i)}}getValidFocusableItem(){const e=this.getVisibleNodes();let t=e.findIndex(this.isSelectedElement);return t===-1&&(t=e.findIndex(this.isFocusableElement)),t!==-1?e[t]:null}checkForNestedItems(){return this.slottedTreeItems.some(e=>n.isTreeItemElement(e)&&e.querySelector("[data-vvd-component='tree-item']"))}getVisibleNodes(){return T(this,"[data-vvd-component='tree-item']")}}d([l.attr({attribute:"render-collapsed-nodes"})],o.prototype,"renderCollapsedNodes");d([l.observable],o.prototype,"currentSelected");d([l.observable],o.prototype,"slottedTreeItems");const v=r=>I.classNames("control"),E=l.html` <template
 	${f.ref("treeView")}
 	${m.applyHostSemantics({role:"tree"})}
 	@keydown="${(r,e)=>r.handleKeyDown(e.event)}"

package/tree-view/index.js

@@ -28,9 +28,11 @@ class a extends y(h) {
     super(...arguments), this.currentFocused = null, this.handleFocus = (e) => {
       if (this.slottedTreeItems.length > 0) {
         if (e.target === this) {
+          /* v8 ignore else -- @preserve */
           this.currentFocused !== null && n.focusItem(this.currentFocused);
           return;
         }
+        /* v8 ignore else -- @preserve */
         this.contains(e.target) && (this.setAttribute("tabindex", "-1"), this.currentFocused = e.target);
       }
     }, this.handleBlur = (e) => {
@@ -38,33 +40,48 @@ class a extends y(h) {
     }, this.handleKeyDown = (e) => {
       if (this.slottedTreeItems.length < 1)
         return !0;
+      /* v8 ignore else -- @preserve */
       if (!e.defaultPrevented) {
         const t = this.getVisibleNodes();
         switch (e.key) {
-          case w:
+          case w: {
+            /* v8 ignore else -- @preserve */
             t.length && n.focusItem(t[0]);
             return;
-          case T:
+          }
+          case T: {
+            /* v8 ignore else -- @preserve */
             t.length && n.focusItem(t[t.length - 1]);
             return;
-          case S:
+          }
+          case S: {
+            /* v8 ignore else -- @preserve */
             if (e.target && this.isFocusableElement(e.target)) {
               const s = e.target;
+              /* v8 ignore else -- @preserve */
               s instanceof n && s.childItemLength() > 0 && s.expanded ? s.expanded = !1 : s instanceof n && s.parentElement instanceof n && n.focusItem(s.parentElement);
             }
             return !1;
-          case k:
+          }
+          case k: {
+            /* v8 ignore else -- @preserve */
             if (e.target && this.isFocusableElement(e.target)) {
               const s = e.target;
+              /* v8 ignore else -- @preserve */
               s instanceof n && s.childItemLength() > 0 && !s.expanded ? s.expanded = !0 : s instanceof n && s.childItemLength() > 0 && this.focusNextNode(1, e.target);
             }
             return;
-          case N:
+          }
+          case N: {
+            /* v8 ignore else -- @preserve */
             e.target && this.isFocusableElement(e.target) && this.focusNextNode(1, e.target);
             return;
-          case F:
+          }
+          case F: {
+            /* v8 ignore else -- @preserve */
             e.target && this.isFocusableElement(e.target) && this.focusNextNode(-1, e.target);
             return;
+          }
           case x:
             this.handleClick(e);
             return;
@@ -72,16 +89,19 @@ class a extends y(h) {
       }
       return !0;
     }, this.handleSelectedChange = (e) => {
+      /* v8 ignore else -- @preserve */
       if (!e.defaultPrevented) {
         if (!(e.target instanceof Element) || !l(e.target))
           return !0;
         const t = e.target;
+        /* v8 ignore else -- @preserve */
         t.selected ? (this.currentSelected && this.currentSelected !== t && (this.currentSelected.selected = !1), this.currentSelected = t) : !t.selected && this.currentSelected === t && (this.currentSelected = null);
         return;
       }
     }, this.setItems = () => {
       const e = this.treeView.querySelector("[selected]");
       this.currentSelected = e, (this.currentFocused === null || !this.contains(this.currentFocused)) && (this.currentFocused = this.getValidFocusableItem()), this.nested = this.checkForNestedItems(), this.getVisibleNodes().forEach((s) => {
+        /* v8 ignore else -- @preserve */
         l(s) && (s.nested = this.nested);
       });
     }, this.isFocusableElement = (e) => l(e), this.isSelectedElement = (e) => e.selected;
@@ -113,8 +133,10 @@ class a extends y(h) {
    */
   focusNextNode(e, t) {
     const s = this.getVisibleNodes();
+    /* v8 ignore else -- @preserve */
     if (s) {
       const i = s[s.indexOf(t) + e];
+      /* v8 ignore else -- @preserve */
       f(i) && n.focusItem(i);
     }
   }

package/unbundled/_commonjsHelpers.cjs

@@ -6,31 +6,5 @@ function getDefaultExportFromCjs (x) {
 	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
 }
 
-function getAugmentedNamespace(n) {
-  if (n.__esModule) return n;
-  var f = n.default;
-	if (typeof f == "function") {
-		var a = function a () {
-			if (this instanceof a) {
-        return Reflect.construct(f, arguments, this.constructor);
-			}
-			return f.apply(this, arguments);
-		};
-		a.prototype = f.prototype;
-  } else a = {};
-  Object.defineProperty(a, '__esModule', {value: true});
-	Object.keys(n).forEach(function (k) {
-		var d = Object.getOwnPropertyDescriptor(n, k);
-		Object.defineProperty(a, k, d.get ? d : {
-			enumerable: true,
-			get: function () {
-				return n[k];
-			}
-		});
-	});
-	return a;
-}
-
 exports.commonjsGlobal = commonjsGlobal;
-exports.getAugmentedNamespace = getAugmentedNamespace;
 exports.getDefaultExportFromCjs = getDefaultExportFromCjs;

package/unbundled/_commonjsHelpers.js

@@ -4,29 +4,4 @@ function getDefaultExportFromCjs (x) {
 	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
 }
 
-function getAugmentedNamespace(n) {
-  if (n.__esModule) return n;
-  var f = n.default;
-	if (typeof f == "function") {
-		var a = function a () {
-			if (this instanceof a) {
-        return Reflect.construct(f, arguments, this.constructor);
-			}
-			return f.apply(this, arguments);
-		};
-		a.prototype = f.prototype;
-  } else a = {};
-  Object.defineProperty(a, '__esModule', {value: true});
-	Object.keys(n).forEach(function (k) {
-		var d = Object.getOwnPropertyDescriptor(n, k);
-		Object.defineProperty(a, k, d.get ? d : {
-			enumerable: true,
-			get: function () {
-				return n[k];
-			}
-		});
-	});
-	return a;
-}
-
-export { getAugmentedNamespace as a, commonjsGlobal as c, getDefaultExportFromCjs as g };
+export { commonjsGlobal as c, getDefaultExportFromCjs as g };

package/unbundled/attribute-binding-behaviour.cjs

@@ -14,6 +14,7 @@ class AttributeBindingBehavior {
   bind(controller) {
     this.source = controller.source;
     this.context = controller.context;
+    /* v8 ignore else -- @preserve */
     if (!this.bindingObserver) {
       this.bindingObserver = fastElement.Observable.binding(
         this.binding.evaluate,

package/unbundled/attribute-binding-behaviour.js

@@ -12,6 +12,7 @@ class AttributeBindingBehavior {
   bind(controller) {
     this.source = controller.source;
     this.context = controller.context;
+    /* v8 ignore else -- @preserve */
     if (!this.bindingObserver) {
       this.bindingObserver = Observable.binding(
         this.binding.evaluate,

package/unbundled/base-color-picker.cjs

@@ -66,14 +66,22 @@ const BaseColorPicker = (Base) => {
       this.proxy = document.createElement("input");
       this.open = false;
       this.swatches = [];
-      /**
-       * @internal
-       */
       this._canvasColor = "";
     }
     connectedCallback() {
       super.connectedCallback();
-      this._refreshCanvasColor();
+      requestAnimationFrame(() => {
+        this._refreshCanvasColor();
+      });
+    }
+    /**
+     * @internal
+     */
+    get _computedCanvasColor() {
+      if (!this._canvasColor) {
+        this._canvasColor = getCSSCustomProperty("--vvd-color-canvas", this);
+      }
+      return this._canvasColor;
     }
     /**
      * @internal
@@ -85,8 +93,10 @@ const BaseColorPicker = (Base) => {
      * @internal
      */
     _applyContrastClass(color, threshold = 3) {
-      if (!color || !this._canvasColor) return false;
-      const ratio = getContrastRatio(color, this._canvasColor);
+      if (!color) return false;
+      const canvasColor = this._computedCanvasColor;
+      if (!canvasColor) return false;
+      const ratio = getContrastRatio(color, canvasColor);
       return ratio < threshold;
     }
     /**
@@ -109,7 +119,8 @@ const BaseColorPicker = (Base) => {
     }
     /**
      * @internal
-     */
+     * /
+    /* v8 ignore next -- @preserve */
     _handleColorSaving() {
     }
     /**
@@ -147,21 +158,25 @@ const BaseColorPicker = (Base) => {
       const currentCol = index % rowLength;
       const totalRows = Math.ceil(totalCells / rowLength);
       switch (event.key) {
-        case "ArrowRight":
+        case "ArrowRight": {
+          /* v8 ignore else -- @preserve */
           if (currentCol < rowLength - 1 && index + 1 < totalCells) {
             this._focusSwatchByIndex(index + 1);
           }
           return false;
+        }
         case "ArrowLeft":
           if (currentCol > 0) {
             this._focusSwatchByIndex(index - 1);
           }
           return false;
-        case "ArrowDown":
+        case "ArrowDown": {
+          /* v8 ignore else -- @preserve */
           if (currentRow < totalRows - 1 && index + rowLength < totalCells) {
             this._focusSwatchByIndex(index + rowLength);
           }
           return false;
+        }
         case "ArrowUp":
           if (currentRow > 0) {
             this._focusSwatchByIndex(index - rowLength);
@@ -173,6 +188,7 @@ const BaseColorPicker = (Base) => {
             lastRowStart + currentCol,
             totalCells - 1
           );
+          /* v8 ignore else -- @preserve */
           if (index !== targetIndex) {
             this._focusSwatchByIndex(targetIndex);
           }
@@ -235,33 +251,38 @@ const BaseColorPicker = (Base) => {
     /**
      * @internal
      */
-    _renderColorSwatch(iconTag) {
+    _renderColorSwatch(iconTag, tooltipTag) {
       return fastElement.html`
-				<button
-					class="swatch ${(x, c) => fastWebUtilities.classNames(
+				<${tooltipTag} placement="top" 
+					text="${(x) => x.label ?? x.value}" 
+					exportparts="vvd-theme-alternate">
+					<button
+						slot="anchor"
+						class="swatch ${(x, c) => fastWebUtilities.classNames(
         c.parent.value === x.value ? "selected" : "",
         c.parent._applyContrastClass(x.value) ? "contrast" : ""
       )}"
-					role="gridcell"
-					style="--swatch-color: ${(x) => x.value};"
-					tabindex="${(x, c) => c.index === 0 ? "0" : "-1"}"
-					aria-label="${(x, c) => c.parent.locale.baseColorPicker.colorSwatchLabel(
+						role="gridcell"
+						style="--swatch-color: ${(x) => x.value};"
+						tabindex="${(x, c) => c.index === 0 ? "0" : "-1"}"
+						aria-label="${(x, c) => c.parent.locale.baseColorPicker.colorSwatchLabel(
         x.value,
         x.label,
         c.parent.value === x.value
       )}"
-					@click="${(x, c) => c.parent._handleSwatchSelection(x.value)}"
-					@keydown="${(x, c) => c.parent._handleCellKeydown(
+						@click="${(x, c) => c.parent._handleSwatchSelection(x.value)}"
+						@keydown="${(x, c) => c.parent._handleCellKeydown(
         c.event,
         x.value,
         c.index
       )}"
-				>
-					${fastElement.when(
+					>
+						${fastElement.when(
         (x, c) => c.parent.value === x.value,
         fastElement.html`<${iconTag} size="-6" name="check-solid" aria-hidden="true"></${iconTag}>`
       )}
-				</button>
+					</button>
+				</${tooltipTag}>
 			`;
     }
   }
@@ -271,6 +292,9 @@ const BaseColorPicker = (Base) => {
   __decorateClass([
     fastElement.observable
   ], BaseColorPickerElement.prototype, "swatches");
+  __decorateClass([
+    fastElement.observable
+  ], BaseColorPickerElement.prototype, "_canvasColor");
   return BaseColorPickerElement;
 };