@turquoisehealth/pit-viper 2.113.0 → 2.114.1

package/_site/assets/css/pit-viper-v2-scoped.css

@@ -2967,6 +2967,9 @@
   position: absolute;
   left: var(--progress);
 }
+.pv-v2 .pv-progress-bar[data-disabled] {
+  background: linear-gradient(90deg, #C1CAC9 var(--progress), #E3E7EA var(--progress));
+}
 .pv-v2 .pv-tooltip,
 .pv-v2 .pv-hover-card {
   --max-width: 320px;
@@ -3319,10 +3322,29 @@
   line-height: 1.33333333;
   font-weight: 500;
 }
+.pv-v2 .pv-action-bar-container > ::slotted(*) {
+  display: flex;
+  align-items: center;
+  white-space: nowrap;
+  justify-content: unset;
+  gap: 0.5rem;
+  background-color: #242626;
+  color: #FFFFFF;
+  padding: 0.5rem 0.75rem;
+  box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.12);
+  border-radius: 8px;
+  font-size: 0.75rem;
+  line-height: 1.33333333;
+  font-weight: 500;
+}
 .pv-v2 .pv-action-bar-container[data-style=white] > div {
   background-color: #FFFFFF;
   color: #121313;
 }
+.pv-v2 .pv-action-bar-container[data-style=white] > ::slotted(*) {
+  background-color: #FFFFFF;
+  color: #121313;
+}
 .pv-v2 .pv-card {
   position: relative;
   border: 1px solid var(--card-border-color, #E3E7EA);
@@ -4466,6 +4488,27 @@
 .pv-v2 svg.pv-text-inherit {
   fill: currentColor;
 }
+.pv-v2 .pv-data-surface-visualization-1 {
+  background-color: #36C5BA;
+}
+.pv-v2 .pv-data-surface-visualization-2 {
+  background-color: #16696D;
+}
+.pv-v2 .pv-data-surface-visualization-3 {
+  background-color: #FF7A4E;
+}
+.pv-v2 .pv-data-surface-visualization-4 {
+  background-color: #C97AEB;
+}
+.pv-v2 .pv-data-surface-visualization-5 {
+  background-color: #F2AD0D;
+}
+.pv-v2 .pv-data-surface-visualization-6 {
+  background-color: #7C8AF4;
+}
+.pv-v2 .pv-data-surface-visualization-7 {
+  background-color: #95C54C;
+}
 .pv-v2 .pv-flex,
 .pv-v2 .pv-flex-vertical,
 .pv-v2 .pv-flex-inline {

package/_site/assets/css/pit-viper-v2.css

@@ -3229,6 +3229,9 @@ pv-dropdown-auto-close.pv-dropdown > [class*=pv-button][data-dropdown] {
   position: absolute;
   left: var(--progress);
 }
+.pv-progress-bar[data-disabled] {
+  background: linear-gradient(90deg, #C1CAC9 var(--progress), #E3E7EA var(--progress));
+}
 
 .pv-tooltip,
 .pv-hover-card {
@@ -3599,11 +3602,32 @@ pv-dropdown-auto-close.pv-dropdown > [class*=pv-button][data-dropdown] {
   font-weight: 500;
 }
 
+.pv-action-bar-container > ::slotted(*) {
+  display: flex;
+  align-items: center;
+  white-space: nowrap;
+  justify-content: unset;
+  gap: 0.5rem;
+  background-color: #242626;
+  color: #FFFFFF;
+  padding: 0.5rem 0.75rem;
+  box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.12);
+  border-radius: 8px;
+  font-size: 0.75rem;
+  line-height: 1.33333333;
+  font-weight: 500;
+}
+
 .pv-action-bar-container[data-style=white] > div {
   background-color: #FFFFFF;
   color: #121313;
 }
 
+.pv-action-bar-container[data-style=white] > ::slotted(*) {
+  background-color: #FFFFFF;
+  color: #121313;
+}
+
 .pv-card {
   position: relative;
   border: 1px solid var(--card-border-color, #E3E7EA);
@@ -4873,6 +4897,34 @@ svg.pv-text-inherit {
   fill: currentColor;
 }
 
+.pv-data-surface-visualization-1 {
+  background-color: #36C5BA;
+}
+
+.pv-data-surface-visualization-2 {
+  background-color: #16696D;
+}
+
+.pv-data-surface-visualization-3 {
+  background-color: #FF7A4E;
+}
+
+.pv-data-surface-visualization-4 {
+  background-color: #C97AEB;
+}
+
+.pv-data-surface-visualization-5 {
+  background-color: #F2AD0D;
+}
+
+.pv-data-surface-visualization-6 {
+  background-color: #7C8AF4;
+}
+
+.pv-data-surface-visualization-7 {
+  background-color: #95C54C;
+}
+
 .pv-flex,
 .pv-flex-vertical,
 .pv-flex-inline {

package/_site/assets/css/pit-viper.css

@@ -3234,6 +3234,9 @@ pv-dropdown-auto-close.pv-dropdown > [class*=pv-button][data-dropdown] {
   position: absolute;
   left: var(--progress);
 }
+.pv-progress-bar[data-disabled] {
+  background: linear-gradient(90deg, #C1CAC9 var(--progress), #DCDFE4 var(--progress));
+}
 
 .pv-tooltip,
 .pv-hover-card {
@@ -3604,11 +3607,32 @@ pv-dropdown-auto-close.pv-dropdown > [class*=pv-button][data-dropdown] {
   font-weight: 500;
 }
 
+.pv-action-bar-container > ::slotted(*) {
+  display: flex;
+  align-items: center;
+  white-space: nowrap;
+  justify-content: space-between;
+  gap: 0.5rem;
+  background-color: #02363D;
+  color: #FFFFFF;
+  padding: 0;
+  box-shadow: 0 8px 32px rgba(2, 54, 61, 0.24);
+  border-radius: 4px;
+  font-size: 1.125rem;
+  line-height: 1.55555555;
+  font-weight: 500;
+}
+
 .pv-action-bar-container[data-style=white] > div {
   background-color: #02363D;
   color: #02363D;
 }
 
+.pv-action-bar-container[data-style=white] > ::slotted(*) {
+  background-color: #02363D;
+  color: #02363D;
+}
+
 .pv-card {
   position: relative;
   border: 1px solid var(--card-border-color, #DCDFE4);
@@ -4878,6 +4902,34 @@ svg.pv-text-inherit {
   fill: currentColor;
 }
 
+.pv-data-surface-visualization-1 {
+  background-color: #36C5BA;
+}
+
+.pv-data-surface-visualization-2 {
+  background-color: #16696D;
+}
+
+.pv-data-surface-visualization-3 {
+  background-color: #FF7A4E;
+}
+
+.pv-data-surface-visualization-4 {
+  background-color: #C97AEB;
+}
+
+.pv-data-surface-visualization-5 {
+  background-color: #F2AD0D;
+}
+
+.pv-data-surface-visualization-6 {
+  background-color: #7C8AF4;
+}
+
+.pv-data-surface-visualization-7 {
+  background-color: #95C54C;
+}
+
 .pv-flex,
 .pv-flex-vertical,
 .pv-flex-inline {

package/_site/assets/js/pit-viper.js

@@ -179,7 +179,7 @@ class PVAutoClose extends HTMLElement {
     }
     customElements.define('pv-data-grid', PVDataGrid);
 
-    class PvGlobalNav extends HTMLElement {
+class PvGlobalNav extends HTMLElement {
     constructor() {
       super();
       this.hoverTimeout = null;
@@ -243,7 +243,7 @@ class PVAutoClose extends HTMLElement {
     updateIcons(button, isExpanded) {
       const use = button.querySelector('svg use');
       const tooltip = document.getElementById('description');
-      use.setAttributeNS('http://www.w3.org/1999/xlink', 'href', isExpanded ? '#panel-left-close' : '#panel-left-open');
+      use.setAttribute('href', isExpanded ? '#panel-left-close' : '#panel-left-open');
       if (tooltip) tooltip.querySelector('p').textContent = isExpanded ? 'Close Sidebar' : 'Open Sidebar';
     }
 
@@ -311,25 +311,23 @@ class PVAutoClose extends HTMLElement {
           }
         });
         this.toggleMenu(clickedMenu);
-        this.style.overflowX = 'initial';
         if (!this.layout.hasAttribute('data-expanded')) {
           this.hoverExpandState();
         }
         return;
       }
+      // clicked outside any menu, close all menus
+      allMenus.forEach(menu => menu.removeAttribute('data-active'));
+
       // if outside sidebar, remove 'data-floating;
       if (!inSidebar) {
         this.layout.removeAttribute('data-floating');
-      }
-
-      // clicked outside any menu, close all menus
-      allMenus.forEach(menu => menu.removeAttribute('data-active'));
-      this.style.overflowX = 'hidden';
-      if (!this.layout.hasAttribute('data-collapsed') && !this.layout.hasAttribute('data-expanded')) {
-        this.hoverCollapseState();
+        if (!this.layout.hasAttribute('data-collapsed') && !this.layout.hasAttribute('data-expanded')) {
+          this.hoverCollapseState();
+        }
       }
     }
   }
 
-  customElements.define('pv-global-nav', PvGlobalNav, { extends: 'aside' });
+  customElements.define('pv-global-nav', PvGlobalNav);
 })();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@turquoisehealth/pit-viper",
-  "version": "2.113.0",
+  "version": "2.114.1",
   "description": "Turquoise Health's design system.",
   "main": "README.md",
   "publishConfig": {