@trackunit/react-components 1.5.28 → 1.5.30

package/index.cjs.js

@@ -2899,7 +2899,11 @@ const TrendIndicator = ({ trend, unit, isSmallVariant }) => {
     return (jsxRuntime.jsxs("div", { className: "flex flex-row items-center gap-1", "data-testid": "trend-indicator", children: [!isSmallVariant && trend.value ? (jsxRuntime.jsxs(Text, { dataTestId: "trend-value", size: "small", weight: "normal", children: [trend.value, " ", unit] })) : null, trend.variant?.icon ? jsxRuntime.jsx(Icon, { color: trend.variant.color, name: trend.variant.icon, size: "small" }) : null, trend.percentage ? (jsxRuntime.jsxs(Text, { className: cvaKPITrendPercentage({ color: trend.variant?.color }), size: "small", weight: "bold", children: [trend.percentage, "%"] })) : null] }));
 };
 
-const cvaKPICard = cssClassVarianceUtilities.cvaMerge(["inline-flex", "gap-1"], {
+const cvaKPICard = cssClassVarianceUtilities.cvaMerge([
+    "inline-flex",
+    "gap-1",
+    "hover:shadow-none", // overwriting the Card hover shadow when wrapped in a KPICard
+], {
     variants: {
         minHeight: {
             default: ["min-h-[78px]"],
@@ -3376,7 +3380,7 @@ const PageHeaderSecondaryActions = ({ actions, hasPrimaryAction, }) => {
                 return [danger, [...others, action]];
             }
         }, [[], []]);
-        return (jsxRuntime.jsx(MoreMenu, { dataTestId: "secondary-actions-more-menu", iconButtonProps: { size: "small", variant: "ghost-neutral" }, children: close => (jsxRuntime.jsxs(MenuList, { className: "min-w-[160px]", children: [otherActions.map((action, index) => (jsxRuntime.jsx(ActionRenderer, { action: action, externalOnClick: close, isMenuItem: true }, `${action.actionText}-${index}`))), dangerActions.length ? jsxRuntime.jsx(MenuDivider, {}) : null, dangerActions.map((action, index) => (jsxRuntime.jsx(ActionRenderer, { action: action, externalOnClick: close, isMenuItem: true }, `${action.actionText}-${index}`)))] })) }));
+        return (jsxRuntime.jsx(MoreMenu, { dataTestId: "secondary-actions-more-menu", iconButtonProps: { size: "small", variant: "secondary" }, children: close => (jsxRuntime.jsxs(MenuList, { className: "min-w-[160px]", children: [otherActions.map((action, index) => (jsxRuntime.jsx(ActionRenderer, { action: action, externalOnClick: close, isMenuItem: true }, `${action.actionText}-${index}`))), dangerActions.length ? jsxRuntime.jsx(MenuDivider, {}) : null, dangerActions.map((action, index) => (jsxRuntime.jsx(ActionRenderer, { action: action, externalOnClick: close, isMenuItem: true }, `${action.actionText}-${index}`)))] })) }));
     }
     // Otherwise, render them inline as buttons
     return (jsxRuntime.jsx("div", { className: "flex flex-row items-center gap-2", children: enabledActions

package/index.esm.js

@@ -2897,7 +2897,11 @@ const TrendIndicator = ({ trend, unit, isSmallVariant }) => {
     return (jsxs("div", { className: "flex flex-row items-center gap-1", "data-testid": "trend-indicator", children: [!isSmallVariant && trend.value ? (jsxs(Text, { dataTestId: "trend-value", size: "small", weight: "normal", children: [trend.value, " ", unit] })) : null, trend.variant?.icon ? jsx(Icon, { color: trend.variant.color, name: trend.variant.icon, size: "small" }) : null, trend.percentage ? (jsxs(Text, { className: cvaKPITrendPercentage({ color: trend.variant?.color }), size: "small", weight: "bold", children: [trend.percentage, "%"] })) : null] }));
 };
 
-const cvaKPICard = cvaMerge(["inline-flex", "gap-1"], {
+const cvaKPICard = cvaMerge([
+    "inline-flex",
+    "gap-1",
+    "hover:shadow-none", // overwriting the Card hover shadow when wrapped in a KPICard
+], {
     variants: {
         minHeight: {
             default: ["min-h-[78px]"],
@@ -3374,7 +3378,7 @@ const PageHeaderSecondaryActions = ({ actions, hasPrimaryAction, }) => {
                 return [danger, [...others, action]];
             }
         }, [[], []]);
-        return (jsx(MoreMenu, { dataTestId: "secondary-actions-more-menu", iconButtonProps: { size: "small", variant: "ghost-neutral" }, children: close => (jsxs(MenuList, { className: "min-w-[160px]", children: [otherActions.map((action, index) => (jsx(ActionRenderer, { action: action, externalOnClick: close, isMenuItem: true }, `${action.actionText}-${index}`))), dangerActions.length ? jsx(MenuDivider, {}) : null, dangerActions.map((action, index) => (jsx(ActionRenderer, { action: action, externalOnClick: close, isMenuItem: true }, `${action.actionText}-${index}`)))] })) }));
+        return (jsx(MoreMenu, { dataTestId: "secondary-actions-more-menu", iconButtonProps: { size: "small", variant: "secondary" }, children: close => (jsxs(MenuList, { className: "min-w-[160px]", children: [otherActions.map((action, index) => (jsx(ActionRenderer, { action: action, externalOnClick: close, isMenuItem: true }, `${action.actionText}-${index}`))), dangerActions.length ? jsx(MenuDivider, {}) : null, dangerActions.map((action, index) => (jsx(ActionRenderer, { action: action, externalOnClick: close, isMenuItem: true }, `${action.actionText}-${index}`)))] })) }));
     }
     // Otherwise, render them inline as buttons
     return (jsx("div", { className: "flex flex-row items-center gap-2", children: enabledActions

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/react-components",
-  "version": "1.5.28",
+  "version": "1.5.30",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "engines": {

package/src/components/PageHeader/types.d.ts

@@ -26,7 +26,7 @@ export type PageHeaderSecondaryActionType = PageHeaderActionType & {
     target?: HTMLAnchorElement["target"];
 };
 export type PageHeaderPrimaryActionType = PageHeaderActionType & {
-    variant: Extract<ButtonVariant, "primary" | "primary-danger">;
+    variant: Extract<ButtonVariant, "primary" | "primary-danger" | "secondary">;
 };
 interface BasePageHeaderProps extends CommonProps {
     /**