@turquoisehealth/pit-viper 2.52.0 → 2.53.0

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

@@ -2982,6 +2982,13 @@
 .pv-v2 .pv-hover-card[data-style=white] > [role=tooltip] a {
   color: #16696D;
 }
+.pv-v2 .pv-tooltip[data-static]:after,
+.pv-v2 .pv-hover-card[data-static]:after {
+  display: none;
+}
+.pv-v2 .pv-tooltip-small:hover > [role=tooltip], .pv-v2 .pv-tooltip-small:focus > [role=tooltip] {
+  padding: 0.25rem 0.5rem;
+}
 .pv-v2 .pv-hover-card:hover > [role=tooltip] {
   background-color: #FFFFFF;
   border: 1px solid #E3E7EA;
@@ -4970,6 +4977,8 @@
   --p-inputtext-focus-ring-color: #36C5BA;
   --p-inputtext-focus-ring-width: 2px;
   --p-inputtext-focus-ring-style: solid;
+  --p-skeleton-background: #F0F2F2;
+  --p-skeleton-border-radius: 4px;
 }
 .pv-v2 .p-datepicker-input {
   font-size: var(--datepicker-text-size, 0.6875rem);

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

@@ -3232,6 +3232,14 @@ pv-dropdown-auto-close.pv-dropdown > [class*=pv-button][data-dropdown] {
 .pv-hover-card[data-style=white] > [role=tooltip] a {
   color: #16696D;
 }
+.pv-tooltip[data-static]:after,
+.pv-hover-card[data-static]:after {
+  display: none;
+}
+
+.pv-tooltip-small:hover > [role=tooltip], .pv-tooltip-small:focus > [role=tooltip] {
+  padding: 0.25rem 0.5rem;
+}
 
 .pv-hover-card:hover > [role=tooltip] {
   background-color: #FFFFFF;
@@ -5487,6 +5495,8 @@ svg.pv-text-inherit {
   --p-inputtext-focus-ring-color: #36C5BA;
   --p-inputtext-focus-ring-width: 2px;
   --p-inputtext-focus-ring-style: solid;
+  --p-skeleton-background: #F0F2F2;
+  --p-skeleton-border-radius: 4px;
 }
 
 .p-datepicker-input {

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

@@ -3237,6 +3237,14 @@ pv-dropdown-auto-close.pv-dropdown > [class*=pv-button][data-dropdown] {
 .pv-hover-card[data-style=white] > [role=tooltip] a {
   color: #176F6F;
 }
+.pv-tooltip[data-static]:after,
+.pv-hover-card[data-static]:after {
+  display: none;
+}
+
+.pv-tooltip-small:hover > [role=tooltip], .pv-tooltip-small:focus > [role=tooltip] {
+  padding: 0.5rem 0.25rem;
+}
 
 .pv-hover-card:hover > [role=tooltip] {
   background-color: #FFFFFF;

package/package.json

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

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

@@ -34,9 +34,11 @@ chevronPosition: ChevronPosition;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDetailsElement>;
 
 declare const __VLS_component_3: DefineComponent<PvTooltipProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<PvTooltipProps> & Readonly<{}>, {
+size: PvTooltipSize;
 variant: PvTooltipVariants;
 tooltipPosition: PvTooltipPositions;
 ariaLabelledBy: string;
+interactive: boolean;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
 
 declare const __VLS_component_4: DefineComponent<__VLS_PublicProps_5, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
@@ -53,7 +55,19 @@ declare const __VLS_component_6: DefineComponent<__VLS_PublicProps_6, {}, {}, {}
 "onUpdate:modelValue"?: ((value: string) => any) | undefined;
 }>, {
 variant: PvGhostInputVariant;
-}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {
+inputRef: HTMLInputElement;
+}, HTMLDivElement>;
+
+declare const __VLS_component_7: DefineComponent<__VLS_PublicProps_9, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+"update:modelValue": (value: string) => any;
+}, string, PublicProps, Readonly<__VLS_PublicProps_9> & Readonly<{
+"onUpdate:modelValue"?: ((value: string) => any) | undefined;
+}>, {
+variant: PvInputVariant;
+type: PvInputType;
+id: string;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
 declare type __VLS_Props = PvSearchInputProps;
 
@@ -71,6 +85,8 @@ declare type __VLS_Props_7 = PvToggleButton_2;
 
 declare type __VLS_Props_8 = PvCheckboxProps;
 
+declare type __VLS_Props_9 = PvInputProps;
+
 declare type __VLS_PublicProps = {
     modelValue: string;
 } & __VLS_Props;
@@ -103,6 +119,10 @@ declare type __VLS_PublicProps_8 = {
     modelValue?: boolean;
 } & __VLS_Props_8;
 
+declare type __VLS_PublicProps_9 = {
+    modelValue?: string;
+} & __VLS_Props_9;
+
 declare function __VLS_template(): {
     attrs: Partial<{}>;
     slots: {
@@ -156,10 +176,21 @@ declare function __VLS_template_6(): {
     slots: {
         action?(_: {}): any;
     };
-    refs: {};
+    refs: {
+        inputRef: HTMLInputElement;
+    };
     rootEl: HTMLDivElement;
 };
 
+declare function __VLS_template_7(): {
+    attrs: Partial<{}>;
+    slots: {
+        label?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+
 declare type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 
 declare type __VLS_TemplateResult_2 = ReturnType<typeof __VLS_template_2>;
@@ -172,6 +203,8 @@ declare type __VLS_TemplateResult_5 = ReturnType<typeof __VLS_template_5>;
 
 declare type __VLS_TemplateResult_6 = ReturnType<typeof __VLS_template_6>;
 
+declare type __VLS_TemplateResult_7 = ReturnType<typeof __VLS_template_7>;
+
 declare type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {
         $slots: S;
@@ -184,6 +217,12 @@ declare type __VLS_WithTemplateSlots_10<T, S> = T & {
     };
 };
 
+declare type __VLS_WithTemplateSlots_11<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
 declare type __VLS_WithTemplateSlots_2<T, S> = T & {
     new (): {
         $slots: S;
@@ -762,6 +801,22 @@ declare type PvIconSize = (typeof PvIconSizes)[number];
 
 declare const PvIconSizes: readonly [undefined, 10, 12, 20, 24, 32, 64];
 
+export declare const PvInput: __VLS_WithTemplateSlots_11<typeof __VLS_component_7, __VLS_TemplateResult_7["slots"]>;
+
+declare interface PvInputProps {
+    error?: boolean;
+    disabled?: boolean;
+    placeholder?: string;
+    type?: PvInputType;
+    id?: string;
+    lowerLabel?: string;
+    variant?: PvInputVariant;
+}
+
+declare type PvInputType = "text" | "password" | "number";
+
+declare type PvInputVariant = "white" | "gray";
+
 declare const PvInputVariants: readonly ["h1", "h2", "h3", "h4", "text-md", "text-sm", "text-lg", "caption"];
 
 declare type PvInputVariants = (typeof PvInputVariants)[number];
@@ -784,7 +839,7 @@ dialog: HTMLDialogElement;
 }>;
 
 export declare const PvMultiSelectButton: DefineComponent<    {
-modelValue: MenuOption[];
+modelValue?: MenuOption[];
 searchInput?: string;
 } & PvMultiSelectButton_2, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
 "update:modelValue": (value: MenuOption[]) => any;
@@ -793,7 +848,7 @@ searchInput?: string;
 "dropdown-open": () => any;
 "dropdown-closed": () => any;
 }, string, PublicProps, Readonly<{
-modelValue: MenuOption[];
+modelValue?: MenuOption[];
 searchInput?: string;
 } & PvMultiSelectButton_2> & Readonly<{
 "onDropdown-open"?: (() => any) | undefined;
@@ -807,6 +862,7 @@ variant: PvSelectButtonVariant;
 showClear: boolean;
 useTeleport: boolean;
 teleportLocation: string;
+options: MenuOption[];
 counterPosition: "left" | "right";
 showDropdown: boolean;
 showMenuAction: boolean;
@@ -997,6 +1053,7 @@ declare interface PvMultiSelectButton_2 {
     size?: PvSelectButtonSize;
     alignment?: "top" | "right" | "top right" | undefined;
     popoverCssProperties?: CSSProperties;
+    prefixLabel?: string;
     label?: string;
     icon?: string;
     counterPosition?: "left" | "right";
@@ -1126,6 +1183,8 @@ declare interface PvSegmentedControlWithTextLabelProps extends PvSegmentedContro
     iconOnly?: false;
 }
 
+declare type PvSekeltonSize = Extract<PvSize, "xs" | "sm" | "md" | "lg" | "xl">;
+
 export declare const PvSelectableCard: __VLS_WithTemplateSlots_8<typeof __VLS_component_4, __VLS_TemplateResult_4["slots"]>;
 
 declare interface PvSelectableCardProps {
@@ -1399,6 +1458,32 @@ declare type PvSize = (typeof PvSizes)[number];
 
 declare const PvSizes: readonly ["xs", "sm", "md", "lg", "xl", "2x"];
 
+export declare const PvSkeleton: DefineComponent<PvSkeletonProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<PvSkeletonProps> & Readonly<{}>, {
+size: PvSekeltonSize;
+variant: PvSkeletonVariant;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
+
+declare interface PvSkeletonProps {
+    size?: PvSekeltonSize;
+    variant?: PvSkeletonVariant;
+}
+
+declare type PvSkeletonVariant = "square" | "rectangle";
+
+export declare const PvSpinner: DefineComponent<PvSpinnerProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<PvSpinnerProps> & Readonly<{}>, {
+size: PvSpinnerSize;
+variant: PvSpinnerVariant;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+
+declare interface PvSpinnerProps {
+    variant?: PvSpinnerVariant;
+    size?: PvSpinnerSize;
+}
+
+declare type PvSpinnerSize = Extract<PvSize, "xs" | "sm" | "md" | "lg" | "xl">;
+
+declare type PvSpinnerVariant = Extract<PvVariants, "primary"> | Extract<PvThemes, "white" | "dark">;
+
 export declare const PvSprite: DefineComponent<PvSpriteProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<PvSpriteProps> & Readonly<{}>, {
 variant: "v1" | "v2";
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
@@ -1500,6 +1585,10 @@ declare interface PvTagProps {
     rounded?: boolean;
 }
 
+declare const PvTheme: readonly ["white", "dark"];
+
+declare type PvThemes = (typeof PvTheme)[number];
+
 export declare const PvToggleButton: DefineComponent<__VLS_PublicProps_7, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
 "update:modelValue": (value: string | boolean) => any;
 }, string, PublicProps, Readonly<__VLS_PublicProps_7> & Readonly<{
@@ -1536,8 +1625,12 @@ declare interface PvTooltipProps {
     variant?: PvTooltipVariants;
     tooltipPosition?: PvTooltipPositions;
     ariaLabelledBy?: string;
+    size?: PvTooltipSize;
+    interactive?: boolean;
 }
 
+declare type PvTooltipSize = Extract<PvSize, "sm" | "md">;
+
 declare type PvTooltipVariants = "white" | "dark";
 
 declare const PvVariants: readonly ["primary", "secondary", "tertiary", "ghost", "destructive"];