@turquoisehealth/pit-viper 2.37.1 → 2.39.0

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

@@ -4112,6 +4112,9 @@
 .pv-v2 .pv-surface-critical {
   background-color: #FFEFEB;
 }
+.pv-v2 .pv-surface-highlight {
+  background-color: #E4F8F6;
+}
 .pv-v2 .pv-surface-brand-gradient {
   background: var(--color-background-brand-gradient, linear-gradient(109deg, #176F6F 0%, #02363D 100%));
 }

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

@@ -4465,6 +4465,10 @@ body:has(.pv-layout-primary) {
   background-color: #FFEFEB;
 }
 
+.pv-surface-highlight {
+  background-color: #E4F8F6;
+}
+
 .pv-surface-brand-gradient {
   background: var(--color-background-brand-gradient, linear-gradient(109deg, #176F6F 0%, #02363D 100%));
 }

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

@@ -4482,6 +4482,10 @@ body:has(.pv-layout-primary) {
   background-color: #FFF1F1;
 }
 
+.pv-surface-highlight {
+  background-color: #E4F8F6;
+}
+
 .pv-surface-brand-gradient {
   background: var(--color-background-brand-gradient, linear-gradient(109deg, #176F6F 0%, #02363D 100%));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@turquoisehealth/pit-viper",
-  "version": "2.37.1",
+  "version": "2.39.0",
   "description": "Turquoise Health's design system.",
   "main": "README.md",
   "publishConfig": {
@@ -9,7 +9,8 @@
   },
   "workspaces": [
     ".",
-    "pv-components"
+    "pv-components",
+    "storybook"
   ],
   "files": [
     "_site/assets/css/pit-viper.css",
@@ -48,11 +49,11 @@
     "build:eleventy": "eleventy",
     "build:pagefind": "npx pagefind --site _site",
     "build:pv-components": "npm run build --workspace=pv-components",
-    "build:pv-component-docs": "npm run build_docs --workspace=pv-components",
     "watch:pv-components": "npm run watch_docs --workspace=pv-components",
     "prepublishOnly": "npm run test && npm run build",
     "start": "npm-run-all build:sass --parallel watch:*",
     "build": "npm-run-all build:*",
+    "prebuild": "npm run build_docs --workspace=pv-components",
     "postbuild": "eleventy --quiet",
     "prepare": "husky",
     "test": "npm run test --workspace=pv-components",
@@ -88,7 +89,10 @@
   },
   "devDependencies": {
     "@changesets/cli": "^2.29.4",
+    "@vue/eslint-config-prettier": "^10.1.0",
+    "@vue/eslint-config-typescript": "^14.3.0",
     "chokidar-cli": "^3.0.0",
+    "eslint-plugin-vue": "^9.32.0",
     "pagefind": "^1.3.0",
     "tsx": "^4.0.0"
   }

package/pv-components/dist/vue/base/pv-components-base.d.ts

@@ -162,6 +162,10 @@ declare interface OptionWithIcon extends Option_2 {
     iconPosition: "left" | "right";
 }
 
+declare type PillSize = Extract<PvSize, "md" | "lg">;
+
+declare type PillVariant = Extract<PvColorVariants, "default" | "success" | "warning" | "critical" | "highlight">;
+
 export declare const PvAccordion: __VLS_WithTemplateSlots_7<typeof __VLS_component_2, __VLS_TemplateResult_2["slots"]>;
 
 declare interface PvAccordionProps {
@@ -221,6 +225,10 @@ declare type PvButtonVariant = (typeof PvButtonVariants)[number];
 
 declare const PvButtonVariants: readonly ["primary", "secondary", "tertiary", "primary-outline", "secondary-outline", "ghost", "link", "destructive", "destructive-outline", "icon", "icon-outline", "transformer"];
 
+declare const PvColorVariants: readonly ["default", "success", "warning", "critical", "highlight"];
+
+declare type PvColorVariants = (typeof PvColorVariants)[number];
+
 export declare const PvCompanyLogo: DefineComponent<PvCompanyLogoProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<PvCompanyLogoProps> & Readonly<{}>, {
 size: PvCompanyLogoSize;
 basePath: string;
@@ -563,6 +571,36 @@ dialog: HTMLDialogElement;
     footer?(_: {}): any;
 }>;
 
+export declare const PvPill: DefineComponent<PvPillProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<PvPillProps> & Readonly<{}>, {
+variant: PillVariant;
+size: PillSize;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLButtonElement>;
+
+declare interface PvPillProps {
+    /**
+     * @default 'Medium'
+     * Tag size
+     */
+    size?: PillSize;
+    /**
+     * @default 'Tertiary'
+     * Tag Variant
+     */
+    variant?: PillVariant;
+    /**
+     * Tag Icon
+     */
+    icon?: string;
+    /**
+     * Display Dot Instead of Background
+     */
+    showDot?: boolean;
+    /**
+     * Tag Label
+     */
+    label: string;
+}
+
 export declare const PvPopover: __VLS_WithTemplateSlots_3<DefineComponent<PvPopoverProps, {
 popoverRoot: Ref<HTMLElement | null, HTMLElement | null>;
 }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {